/***************************************************************************** Declaraciones Generales */

body { text-align: center; background: #000 url(../img/bg.jpg) center top no-repeat;  }


.clear { clear: both; }

p, a, h1, h2, h3, h4, h5, h6 { font-family: Arial, Helvetica, sans-serif; }


/***************************************************************************** Estructura */

#wrapper {
  margin: 0 auto;
  width: 879px;
  padding: 0;
  text-align: left;
} 
#header, #main_tabs { float: left; width: 100%; }

#main {
  float: left;
  width: 100%;
  position: relative;
  min-height: 770px;
  height: auto !important;
  height: 770px;
  background: url(../img/main_bg.png) repeat-y; 
}

#content {
  float: left;
  width: 605px;
  padding: 25px 35px;
}

#sidebar { 
  float: right;
  width: 178px; 
  padding: 15px 11px;
}


/***************************************************************************** Header */

/* Logo */

#header h1 { float: left; }
#header h1 a { 
  float: left;
  width: 433px;
  height: 82px;
  text-indent: -9999px; 
}


/* Menú */

#header #nav { 
  float: right;
  margin: 18px 0 0; 
}
#header #nav li { 
  float: left;
  padding: 0 0 0 7px; 
}
#header #nav li a { 
  font-size: 11px;
  color: #fff;
  text-transform: uppercase;
  text-decoration: none;
}
#header #nav li a:hover { color: #ed1c24; }
#header #nav li.active a { color: #ed1c24; text-decoration:underline }

#content p.cuadro-exito {
	font-weight:bold;
	color: #ed1c24;
}

.error-message {
	font-weight:bold;
	color: #ed1c24;
}


/* Pestañas */

#main_tabs li { float: left; }
#main_tabs li a {
  float: left;
  font-size: .7em;
  color: #fff;
  text-transform: uppercase;
  text-decoration: none;
  height: 20px;
  line-height: 20px;
  padding: 0 18px;
  background: #575757;
}
#main_tabs li a:hover, #main_tabs li.active a  { 
  background: #b8b9ba;
  color: #231f20; 
}


/***************************************************************************** Contenido */

#content h2  {
  font-size: 1.2em;
  font-weight:bold;
  line-height: .8em;
  color: #414142;
  display:block;
  padding-bottom:.5em;
}

 #content p, #content a {
  font: .8em Verdana, Tahoma, Arial, Helvetica, sans-serif;
  line-height: 18px;
  color: #414142;
}
#content h2 { font-weight: bold; }
#content p { padding-bottom: 18px; }
#content a {
  font-weight: bold;
  text-decoration: none;
}
#content a:hover { text-decoration: underline; }


/***************************************************************************** Sidebar */

#sidebar h4, #sidebar a {
  font-size: 10px;
  color: #c9c9c9;
  
}
	#sidebar a:hover {
		color: #ff0000;
	}

#sidebar h4 {
  font-weight: bold;
  text-transform: uppercase;
  line-height: 10px;
}
#sidebar ul { padding: 0 0 12px; }
#sidebar ul li { 
  padding: 0 0 0 10px;
  width: 157px;
  line-height: 16px; 
}


/***************************************************************************** Estilos Página Home */

body#home { background: #000 url(../img/bg_home.jpg) center top no-repeat; }


/***************************************************************************** Estilos Página Competencia */

.slogan {
  position: absolute;
  width: 663px;
  height: 27px;
  background: url(../img/slogan.png) no-repeat; 
  right: 212px;
  bottom: 5px;
}


/***************************************************************************** Estilos Página Detalle */

#detalle #content {
  padding: 12px 16px;
  width: 643px;
}

#detalle #bike_pic {
  float: left;
  position: relative;
  background: url(../img/bike_bg.png) no-repeat;
  width: 646px;
  height: 425px; 
}

#detalle #bike_pic #colors {
  position: absolute;
  top: 0;
  right: 0;
}
#detalle #bike_pic #colors img {
  float: left;
  width: 16px;
  height: 16px;
  margin: 0 4px 0 0;
}
#detalle #bike_pic #colors span.red { background: #ed1c24; } 
#detalle #bike_pic #colors span.blue { background: #2e3192; }
#detalle #bike_pic #colors span.black { background: #000; }
#detalle #bike_pic #colors span.yellow { background: #fff200; }

#detalle #descripcion {
  color: #414142;
  float: left;
  position: relative;
}

	#detalle #descripcion p{
		font-size:.8em;
	}
	
#detalle #rotator {
	float:right;
	padding:2px;
}
	
/* Pestañas internas */

#detalle_tabs {
  float: left;
  width: 100%;
  margin: 23px 0 0;
}
#detalle_tabs #tabs-nav li { float: left; }
#detalle_tabs #tabs-nav li a {
  float: left;
  font-size: 11px;
  color: #231f20;
  text-transform: uppercase;
  text-decoration: none;
  height: 18px;
  line-height: 18px;
  padding: 0 17px;
  background: #888a8c;
  font-weight: normal;
}
#detalle_tabs #tabs-nav li a:hover, #detalle_tabs #tabs-nav li.ui-state-active a { 
  background: #231f20;
  color: #fff; 
}
#detalle_tabs div.ui-tabs-panel {
  float: left;
  width: 634px;
  border: 1px solid #231f20;
}
#detalle_tabs div.ui-tabs-hide { display: none; }

#detalle_tabs div#tab-info {
  width: 614px;
  padding: 10px;
}

#tab-info img {
	float:right;
}

#tab-info table { 
  float: left;
  table-layout: fixed;
  border-collapse: collapse;  
  width: 75%; 
}
#tab-info table th, #tab-info table td {
  font: 10px/18px Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: #414142;
  height: 20px; 
  border: 0;
  vertical-align: middle;
}

	#tab-info table td.titulo {
		width: 20%;
	}

#tab-geom img { float: left; }
#tab-geom table { 
  float: right;
  table-layout: fixed;
  border-collapse: collapse;  
  height: 100%; 
}
#tab-geom table th, #tab-geom table td {
  color: #414142;
  height: 20px; 
  border: 1px solid #231f20;
  text-align: center;
  vertical-align: middle;
  width: 40px;
}
#tab-geom table td.talla { font-weight: bold; }
#tab-geom table th.last, #tab-geom table td.last { border-right: none; }
#tab-geom table th { height: 40px; font-weight: bold; border-top: none; }
#tab-geom table tr.last td { border-bottom: 0; }

#footer{
margin:0px;
width:100%;
height:1.7em;
background: url(../img/main_bg_foot.png) repeat; 
font-size: .8em;
}
#left_footer{
float:left;
width:150px;
padding:5px 0 0 10px;
}
#right_footer{
float:right;
padding:.3em 2em 0 0;

}
#right_footer a{
padding:0 0 0 7px;
text-decoration:none;
color: #414141;
}
#right_footer a:hover{
text-decoration:underline;
}

#center_footer{
float:left;
text-align:center;
color: #414141;
padding:.3em 0 0 2em;
}

.contact_form label {
  font: 12px/20px Verdana, Tahoma, Arial, Helvetica, sans-serif;
  color: #414142;
  height: 20px; 
  border: 0;
  vertical-align: middle;
}

.contact_form input {
	width:50%;
}

.contact_form textarea {
	width:80%;
}
