@charset "utf-8";
/* CSS Document */
#accordion {
 list-style: none;
 padding: 0 0 0 0;
/* width: 100%; /*ANCHO DEL CUADRO DEL MENU*/
 margin: 0;
  }
 #accordion div {
 display: block;
 font-weight: bold;
 font-size:20px;  						/* cambio de "16" a "20" */
 color:white;
 cursor: pointer;						/*cambio de "5" a "8" */
 padding: 8px; 				
 margin:1px;  							/* cambio de "0" a "2" */
 background-color: #375d84;
 background-image: url(/script/arrow-down.png);
 background-position: right center;
 background-repeat:no-repeat;
 border-bottom: 1px solid #eff2f5;
 }
 /*--------------------*/
 #accordion div:hover; 
  {
 background-color: #375d84;	 
 background-image: url(/script/arrow-doun.png);
 background-position: right center;	
 background-repeat:no-repeat;
 border-bottom: 1px solid #eff2f5;
 }
 /*----------------------*/
 #accordion ul {
 list-style-type: none;
 display: none;						/*para que se muestre solo al clikear */
 height:auto;
 
 }
 #accordion ul li {
 font-weight: normal;
 cursor: pointer;
 padding: 8px;							/* cambio de "5" a "8" */
 width:auto;
 height: auto;
 font-size:20px;						/* cambio de "14" a "20" */
 color: #375d84;
 display: block;
 
 }
 #accordion ul li:hover /* acabo de cambiar li:hover por li:target , funciona mejor en dispositivos tactiles*/
 {
 background-color: #d6dfec; /*COLOR DEL SUBMENU CUANDO ESTA SELECCIONADO*/
 font-weight: bold;
 cursor: pointer;
 padding: 8px;							/* cambio de "5" a "8" */
 font-size:20px;
 color: #375d84;
 display:block;
 transition: .3s all ease-in;   /*agregado recientemente */
 }
 #accordion a
 {
 text-decoration: none;
 color: #375d84;
 position: relative;
 cursor: pointer;				/*recien agregado */	
display: block;					/*recien agregado */ 
 }
 
body {background-color: #eff2f5;}
	
/*{margin-left:0; margin-top:0; margin-right:0; margin-bottom:0;} */
	
/* dimensiones de los 3 espacios de la pagina*/

/* ESTA PARTE DEL CSS CORRESPONDE AL TAMAÑO Y FORMA DE LA PAGINA*/
#contenido
	{width:100%; background-color:#eff2f5; margin:0 0;} /*ANCHO DE LA PAGINA*/
#banersuperior
	{float:left; width:100%; height:110px; margin:0; padding:0; background-color: #229CBF;}
#tituloproductos
	{float:left; width:100%; margin:0; padding:0;}
#lista
	{float:left; width:100%; height:auto; margin:0; padding:0;}
#piedepagina
	{float:left; width:100%; height:58px; background-image:url(/script/piedepagina2.png); background-repeat:repeat-x;}
#foto
	{float:left; width:100%; height:auto; background-color: #FFF;}
#descripcionfoto
	{float:left; width:100%; height:auto; background-color: #eff2f5;}
#separadorpiedepagina
	{float:left; width:100%; height:10px; background-color: #eff2f5;}
#botonvolver
	{float:left; width:100%; height:auto; background-color: #eff2f5;}
#descripcion
	{float:left; width:100%; height:70px; background-color: #FFF;}
#datosempresa
	{float:left; width:100%; height:15px;}
#titulopiedepagina
	{float:left; width:100%; height:20px;}
#marcogrande
	{ background-color:#eff2f5;}

/*clases de las divisiones de la pagina*/	

.listaproductos
	{
	font:Verdana, Geneva, sans-serif, Lucida Sans Unicode, Lucida Grande, sans-serif;
	font-size:20px;  /*cambio de 14 a 20 */
	color:#06C;
	margin:2px;
	padding:2px;
	font-style: italic;
	font-weight: bold;
}
.piedepagina
	{
	font:Verdana, Geneva, sans-serif, Lucida Sans Unicode, Lucida Grande, sans-serif;
	font-size: 16px;
	color: #FFF;
	margin:1px;
	padding:1px;
	border:#00F;}

/*texto de colores*/
.tituloprincipal
	{
	font-family:Verdana, Geneva, sans-serif, Lucida Sans Unicode, Lucida Grande, sans-serif;
	font-size: 20px;
	font-weight:bold;
	font-style:italic;
	color: #FFFFFF;
	margin:4px;
	padding:2px;
	}
.titulogrande
	{
	font-family:Verdana, Geneva, sans-serif, Lucida Sans Unicode, Lucida Grande, sans-serif;
	font-size: 18px;
	font-weight:bold;
	font-style:italic;
	color: #375d84;
	margin:4px;
	padding:2px;
	}
.textoblancogrande
	{
	font:Lucida Sans Unicode, Lucida Grande, sans-serif;
	font-size:18px;
	font-weight:bold;
	color: #fff;
	font-style:italic;
	margin-left:10px;
	}
.textoblancochico
	{
	font-family: Lucida Sans Unicode, Lucida Grande, sans-serif;
	font-style: italic;
	font-weight: bold;
	font-size: 14px;
	color: #fff;
	margin: 2px;
	padding: 2px;
	}
.textorojochico
	{
	font-family: Lucida Sans Unicode, Lucida Grande, sans-serif;
	font-style: italic;
	font-weight:bold;
	font-size:14px;
	color: #646464;
	margin: 2px;
	padding: 2px;
	}
.textoazuloscuro
	{
	font-family: Lucida Sans Unicode, Lucida Grande, sans-serif;
	font-size:16px;
	color: #006;
	font-style:italic;
	font-weight:bold;
	}
.textoazulclaro
	{
	font-family: Lucida Sans Unicode, Lucida Grande, sans-serif;
	font-size:16px;
	color: #2935B7;
	font-style:italic;
	font-weight:bold;
	}
	
.miboton {
  font-style:italic;
  font-weight:bold;
  padding: 10px 20px;
  background-color: #4CAF50;
  color: white;
  border: none;
  border-radius: 10px;
  cursor: pointer;
}

.miboton:hover {
  background-color: #45a049;
  transition: .8s all ease-in;   /*agregado recientemente */
}

.miboton:active {
  background-color: #3e8e41;
}