/* DIV contenedor de toda la página */
#page_container {
 width: 950px;
 font-family: Arial, Helvetica, sans-serif;
 font-size: 14px;
 background-image: url(../images/fondos/contentBackground.png);
 background-repeat: repeat-y;
}

/* Cabecera de página y sus elementos (Logo, código QR) */
#page_header {
 height: 100px;
 background-image: url(../images/fondos/headerBackground.png);
 background-repeat: no-repeat;
}

#logo {
 margin-left: 16px;
 margin-top: 16px;
 float: left;
}

#logo img {
 width=296;
 height=75;
}

#qrcode {
 width: 82px;
 height: 82px;
 margin-top: 13px;
 margin-right: 30px;
 border-style: solid;
 border-width: 1px;
 border-color: black;
 float: right;
}

#qrcode img {
 width: 82px;
 height: 82px;
 border: 0px;
}

/* Barra de menú */
#menu {
 height: 40px;
 margin-top: 1px;
 margin-left: 20px;	
 margin-right: 20px;
 border-top-width: 1px;
 border-top-style: solid;
 border-top-color: #3366FF;
 font-family: Arial, Helvetica, sans-serif;
}

#mainMenuBar {
 width: 912px;
 margin: 0px 0px 0px 2px; 
 padding-left: 0px; 
 padding-right: 0px; 
 padding-top: 3px;
 padding-bottom: 0px; 
 float: Left;
 position: relative;   
 z-index: 1;
}

#mainMenuBar li {
 width: 130px;
 white-space: nowrap; 
 float: left;
 display: block;
}

#mainMenuBar ul {
 top: 100%;
 margin: -1px 0px 0px; 
 padding-left: 4px;  
 padding-right: 4px; 
 padding-top: 4px;
 padding-bottom: 4px; 
 background-color: #3366FF; 
 left: -10000px;
 position: absolute; 
}

#mainMenuBar ul li {
 width: auto;
 float: none;
}

#mainMenuBar a {
 color: #000000; 
 text-decoration: none; 
 display: block; 
}

#mainMenuBar > li > a {
 font-size: 16px; 
 text-align: center; 
 margin-bottom: 2px;
 padding-top: 5px;
 padding-bottom: 7px; 
 padding-right: 0px; 
 padding-left: 0px; 
 background-image: url(../images/fondos/menuBackground.png); 
}

#mainMenuBar ul a {
 font-size: 14px; 
 text-align: left; 
 padding-left: 2px; 
 padding-right: 5px; 
 padding-top: 1px;
 padding-bottom: 0px; 
}

#mainMenuBar li:hover > a {
 text-decoration: underline;
 background-color: #6699CC;
}

#mainMenuBar li:hover > ul {
 left: auto;
}

/* Pie de página */
#page_footer {
 clear: both;
 height: 76px;
 amargin-top: 5px;
 font-family: Arial, Helvetica, sans-serif;
 font-size: 12px;
 line-height: 18px;
 text-align: center;
 color: #333333;
 background-image: url(../images/fondos/footerBackground.png);
 background-repeat: no-repeat;
}

/* Contenido real (sin incluir cabecera ni pie) de la página Web */
#page_content {
 padding-left: 15px;
 padding-right: 15px;
}

/* Rótulo */
.rotulo {
 background-image: url(../images/fondos/rotuloBackground.png);
 background-repeat: no-repeat;
 background-color: #ffffff;
 width: 200px;
 height: 30px;
 margin-left: 4px;
 margin-right: 4px;
 margin-top: 4px;
 margin-bottom: 4px;
}

.rotulo h3 {  
  margin-top: 0px;
  margin-bottom: 0px;  
  padding-top: 6px;
  text-align: center; 
  font-size: 14px; 
  font-weight: bold;
 }

/* Menú de opciones vertical */ 
.vmenu {
 float: left; 
 width: 200px; 
 margin-bottom: 10px;
}

.vmenu ul {
 font-size: 14px; 
 padding-left: 10px;
 margin: 0px;
}

.vmenu li {
 float: left; 
 width: 180px; 
 display: block;
 margin-left: 2px;
 margin-top: 2px;
 margin-bottom: 2px;
}

.vmenu li a {
 padding-left: 3px;
 padding-top: 2px;
 padding-right: 3px;
 padding-bottom: 2px;
}

/* Lista de cuadros de información */
.lista_cuadros_info {
 clear: both;
 float: left;
 width: 912px;
 height: 280px;	
 margin-top: 8px;
 margin-bottom: 4px;
 margin-left: 16px;
}

.cuadro_info {
 float: left;
 width: 280px;
 height: 265px;
 margin-left: 8px;
 margin-right: 8px;
 border-width: 2px;
 border-style: solid;
 border-color: #3366FF;
}

.cuadro_info H2 {
 margin-left: 20px; 
 margin-top: 10px; 
 margin-bottom: 5px; 
 padding: 0px;
 color: #0072BC; 
 font-size: 16px; 
 font-weight: bold;
}

.cuadro_info  img {
 margin-bottom: 10px;
}

.cuadro_info  p {
 color: #999999; 
 font-size: 12px;
 padding-left: 5px;
 padding-right: 5px;
 padding-bottom: 0px;
 margin: 0px;
}

.cuadro_info_more {
 margin-top: 5px; 
 float: right; 
 font-size: 12px; 
 margin-right: 5px; 
 text-decoration: none;
}

.cuadro_info_more a {
 color: #000055; 
 text-decoration: none;
}

/* DIV para documento de condiciones (reparación, venta,,,) */
.condiciones {
  width: 700px; 
  border-style: solid; 
  border-width: 1px; 
  margin-left: 100px;
  margin-top: 14px;
  margin-bottom: 20px;
  padding-left: 12px;
  padding-right: 20px;  
  padding-top: 4px;
  padding-bottom: 0px;  
}

.condiciones  p {
 text-align: center;
}

.condiciones  ol li {
 padding-bottom: 6px;
 text-align: justify;
}

/* Título de una página */
.page_title {
  width: 80%;
  height: 26px;
  margin: auto auto 15px auto;
  padding-bottom: 6px;
  text-align: center;
  font-family: Verdana;
  font-size: 24px;
  font-weight: bold;  
  color: #7777BB;
  border: 2px solid #7777BB;
  background-color: #DDDDFF;
 }

/* Leyenda de una imagen */
.image_legend {
  margin-top: 4px; 
  font-family: Courier;
  font-size: 12px;
  font-style: italic;
  text-align: center;
 }

  /* Lista de resumen */
 .lista_resumen {
   font-family: "Times New Roman", Times, serif;
   font-size: 16px;
   margin-top: 4px;
   padding-left: 0px;
   list-style-type: none;
 }
  
 /* Productos */
 .tabla_productos {
   width: 900px;
   background-color: #EEEEFF;
   margin-left: 10px;
   margin-bottom: 20px;
  }
 .tipo_productos {
   width: 160px;
   padding-left: 30px;
   padding-right: 10px;	
   font-size: 24px;
   font-weight: bold;
   color: #000099;
  } 
  
 .img_productos {
   width: 220px;  
   padding-left: 12px;
   padding-right: 12px;
  }
   
 /* Lista de detalle */
 .lista_detalle {
   font-size: 18px; 
 }