@charset "utf-8";
/* Medios fluidos sencillos
   Nota: Los medios fluidos exigen la eliminación de los atributos de altura y anchura de los medios del código HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/
img, object, embed, video {
	max-width: 100%;
}
/* IE 6 no admite max-width (anchura máxima), por lo que usa de manera predeterminada una anchura del 100% */
.ie6 img {
	width:100%;
}

a:link {
	color:#FFF;
	text-decoration: none;
}
a:visited {
	color:#FFF;
	text-decoration: none;
}
a:hover {
	color: #03C;
}
a:active {
	color: #FFF;
	text-decoration: none;
}


body {
}


/* Diseño móvil: 480 px e inferior. */

.gridContainer {	
	width: 99%;
	padding-left: 0.5%;
	padding-right: 0.5%;	
}
#cabecera{
	clear: both;
	float: left;
	width: 99.5%;
	padding: 0px 0.25% 0px 0.25%;
	margin: 0px 0px 0px 0px;
	display: block;
	background-color: #FFFFFF;
	text-align: center;
	position: fixed;
	border-bottom: 1px solid #CCC;
	z-index: 1900;
}

#cabecera1 {
	float: left;
	clear:both;
	width: 155px;	
	height: 55px;
	padding: 3px 0% 2px 1%;
	margin: 1px 0% 2px 0%;
	display: block;
	text-align:left;	
}

#cabecera2{
	clear: none;
	float: right;
	width: 30%;
	padding: 1% 1% 0% 1%;
	margin: 0px 0px 0px 0%;
	display: none;	
	text-align:right;	
}
#cabecera2a{
	clear: none;
	float: right;
	width: 5%;
	padding: 1% 1% 0% 1%;
	margin: 0px 0px 0px 0%;
	display: none;	
	text-align:center;	
}

#cabecera3{
	clear: both;
	float: left;
	width: 99%;
	height:25px;
	padding: 3px 0px 2px 0px;
	margin: 0px 0px 0px 0px;
	display: block;	
	text-align:right;
}
#iconos{
	clear: both;
	float: left;
	width: 96%;
	margin: 0% 0% 0% 0%;
	padding: 1% 2% 1% 2%;
	display: block;	
	background-color: #C6FFFF;
}
.iconos1{
	clear: none;
	float: left;
	width: 15%;
	height:100%;
	margin: 0% 0.6% 0% 0.6%;
	padding: 0% 0.2% 0% 0.2%;
	display: block;	
	background-color: #C6FFFF;
	text-align:center;
}
.iconos2{
	background-color: #3EFFFF;	
}

.ico1 {
	background-image:url(foto/icono1.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico1:hover {
	background-image:url(foto/icono1a.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}

.ico2 {
	background-image:url(foto/icono2.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico2:hover {
	background-image:url(foto/icono2a.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico3 {
	background-image:url(foto/icono3.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico3:hover {
	background-image:url(foto/icono3a.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico4 {
	background-image:url(foto/icono4.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico4:hover {
	background-image:url(foto/icono4a.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico5 {
	background-image:url(foto/icono5.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico5:hover {
	background-image:url(foto/icono5a.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico6 {
	background-image:url(foto/icono6.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico6:hover {
	background-image:url(foto/icono6a.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}

#contenido3{
	clear: both;
	float: left;
	width: 99%;
	margin: 0% 0% 0% 0%;	
	padding:0.8% 0.5% 0% 0.5%;	
	display: block;
	text-align:center;
	background-color:#0CF;
}
#contenido3a{
	clear: none;
	float: left;
	display: block;
	width: 90%;
	margin: 0% 0% 0% 0%;
	padding:0% 5% 0% 5%;	
	text-align:left;	
}
#contenido3b{
	clear: none;
	float: left;
	display: block;
	width: 90%;
	margin: 0% 0% 0% 0%;
	padding:0% 5% 0% 5%;
	text-align:left;	
}
#contenido3c{
	clear: none;
	float: left;
	display: block;
	width: 90%;
	margin: 0% 0% 0% 0%;
	padding:0% 5% 0% 5%;	
	text-align:left;	
}
#contenido3d{
	clear: none;
	float: left;
	display: block;
	width: 90%;
	margin: 0% 0% 0% 0%;
	padding:0% 5% 0% 5%;	
	text-align:left;	
}
#contenido3e{
	clear: none;
	float: left;
	display: block;
	width: 90%;
	margin: 0% 0% 0% 0%;
	padding:0% 5% 0% 5%;	
	text-align:left;	
}

#contenido4{
	clear: both;
	float: left;
	width: 98%;
	margin: 0% 0% 0% 0%;	
	padding:1% 1% 0% 1%;	
	display: block;
	text-align:center;
	background-color: #42D9FF;	
}
#contenido4a{
	clear: none;
	float: left;
	display: block;
	width: 90%;
	margin: 0% 0% 1% 0%;
	padding:1% 5% 1% 5%;	
	text-align:left;
	border-bottom:1px solid #999;
}
#contenido4b{
	clear: none;
	float: left;
	display: block;
	width: 90%;
	margin: 1% 0% 1% 0%;
	padding:0% 5% 2% 5%;
	text-align:left;
	border-bottom:1px solid #999;
}
#contenido4c{
	clear: none;
	float: left;
	display: block;
	width: 90%;
	margin: 1% 0% 0% 0%;
	padding:0% 5% 0% 5%;	
	text-align:left;
	border-bottom:1px solid #999;	
}
#contenido4d{
	clear: none;
	float: left;
	display: block;
	width: 90%;
	margin: 1% 0% 0% 0%;
	padding:0% 5% 0% 5%;	
	text-align:left;	
}



/* Diseño tableta: de 481 px a 768 px. Hereda estilos de: Diseño móvil. */

@media only screen and (min-width: 481px) {
.gridContainer {
	width: 100%;
	padding-left: 0%;
	padding-right: 0%;	
}
#cabecera{
	clear: both;
	float: left;
	width: 100%;
	padding: 0% 0% 0% 0%;
	margin: 0px 0px 0px 0px;
	display: block;
	background-color: #FFFFFF;
	text-align: center;
	position: fixed;
	z-index: 1900;
	border-bottom: 1px solid #CCC;
}

#cabecera1 {
	float: left;
	clear: both;
	width: 200px;	
	height:70px;
	text-align:left;	
	padding:0% 0% 0% 1%;
	margin:8px 0px 8px 0px;
	display: block;	
}

#cabecera2{
	clear: none;
	float: right;
	width: 26%;
	padding: 5px 0.5% 0px 0.5%;
	margin: 0px 0px 0px 0px;
	display: block;	
	text-align:right;
}
#cabecera2a{
	clear: none;
	float: right;
	width: 6%;
	padding: 8px 0.5% 0px 0.5%;
	margin: 0px 0px 0px 0px;
	display: block;	
}

#cabecera3{
	clear: none;
	float: left;
	width: 98%;
	height:34px;
	padding: 1px 0px 0px 0.5%;
	margin: 0px 0px 0px 0px;
	display: block;	
}
#iconos{
	clear: both;
	float: left;
	width: 80%;
	margin: 0% 0% 0% 0%;
	padding: 1% 10% 1% 10%;
	display: block;	
	background-color: #C6FFFF;
}
.iconos1{
	clear: none;
	float: left;
	width: 15%;
	height:100%;
	margin: 0% 0.6% 0% 0.6%;
	padding: 0% 0.2% 0% 0.2%;
	display: block;	
	background-color: #C6FFFF;
	text-align:center;
}
.ico1 {
	background-image:url(foto/icono1.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico1:hover {
	background-image:url(foto/icono1a.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}

.ico2 {
	background-image:url(foto/icono2.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico2:hover {
	background-image:url(foto/icono2a.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico3 {
	background-image:url(foto/icono3.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico3:hover {
	background-image:url(foto/icono3a.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico4 {
	background-image:url(foto/icono4.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico4:hover {
	background-image:url(foto/icono4a.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico5 {
	background-image:url(foto/icono5.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico5:hover {
	background-image:url(foto/icono5a.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico6 {
	background-image:url(foto/icono6.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico6:hover {
	background-image:url(foto/icono6a.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}

#contenido3{
	clear: both;
	float: left;
	width: 99%;
	margin: 0% 0% 0% 0%;	
	padding:0.8% 0.5% 0% 0.5%;	
	display: block;
	text-align:center;
	background-color:#0CF;
}
#contenido3a{
	clear: none;
	float: left;
	display: block;
	width: 30%;
	margin: 0% 0% 0% 0%;
	padding:0% 1% 0% 1%;	
	text-align:center;	
}
#contenido3b{
	clear: none;
	float: left;
	display: block;
	width: 31%;
	margin: 0% 0% 0% 0%;
	padding:0% 1% 1% 1%;
	text-align:center;	
}
#contenido3c{
	clear: none;
	float: left;
	display: block;
	width: 30%;
	margin: 0% 0% 0% 0%;
	padding:0% 1% 1% 1%;	
	text-align:center;	
}
#contenido3d{
	clear: both;
	float: left;
	display: block;
	width: 33%;
	margin: 0% 0% 0% 0%;
	padding:0% 1% 1% 1%;	
	text-align:center;	
}
#contenido3e{
	clear: none;
	float: left;
	display: block;
	width: 30%;
	margin: 0% 0% 1% 0%;
	padding:0% 0% 0% 0%;	
	text-align:center;		
}

#contenido4{
	clear: both;
	float: left;
	width: 99%;
	margin: 0% 0% 0% 0%;	
	padding:1% 0.5% 0% 0.5%;	
	display: block;
	text-align:center;
	background-color: #42D9FF;	
}
#contenido4a{
	clear: none;
	float: left;
	display: block;
	width: 49%;
	margin: 0% 0% 0% 0%;
	padding:0% 0.5% 2% 0.5%;	
	text-align:left;
	border:none;	
}
#contenido4b{
	clear: none;
	float: left;
	display: block;
	width: 49%;
	margin: 0% 0% 0% 0%;
	padding:0% 0.5% 2% 0.5%;
	text-align:right;
	border:none;	
}
#contenido4c{
	clear: both;
	float: left;
	display: block;
	width: 49%;
	margin: 0% 0% 0% 0%;
	padding:2% 0.5% 2% 0.5%;
	text-align:left;
	border:none;
	border-top:1px solid #069;	
}
#contenido4d{
	clear: none;
	float: left;
	display: block;
	width: 49%;
	margin: 0% 0% 0% 0%;
	padding:2% 0.5% 2% 0.5%;
	text-align:right;
	border-top:1px solid #069;	
}

}

/* Diseño escritorio: de 769 px hasta un máximo de 1232 px.  Hereda estilos de: Diseño móvil y Diseño tableta. */

@media only screen and (min-width: 1000px) {
.gridContainer {
	width:100%;
	max-width: 2200px;
	padding-left: 0%;
	padding-right: 0%;
	margin: auto;	
}
#cabecera{
	clear: both;
	float: left;
	width: 94%;
	padding: 0px 3% 0px 3%;
	margin: 0px 0px 0px 0px;
	display: block;
	background-color: #FFFFFF;
	text-align: center;
	position: fixed;
	z-index: 1900;
	border-bottom: 1px solid #CCC;
}
#cabecera1 {
	float: left;
	clear:both;
	width: 23%;
	height:100px;	
	padding: 5px 0% 5px 0%;
	margin:5px 0px 5px 0px;
	display: block;
	text-align:left;	
}

#cabecera2{
	clear: none;
	float: right;
	width: 15%;
	padding: 0.2% 0.5% 0% 1%;
	margin: 0px 0px 0px 0px;
	display: block;	
	text-align:right;
}
#cabecera2a{
	clear: none;
	float: right;
	width: 3%;
	padding: 6px 0% 0% 1%;
	margin: 0px 0px 0px 0px;
	display: block;	
	text-align:right;
}

#cabecera3{
	clear: none;
	float: left;
	width: 74%;
	height:36px;
	margin: 10px 0px 0px 0px;
	padding: 2px 0% 5px 3%;
	display: block;	
	text-align:right;	
}

#iconos{
	clear: both;
	float: left;
	width: 80%;
	margin: 1% 0% 0% 0%;
	padding: 1% 10% 1% 10%;
	display: block;	
	background-color: #C6FFFF;
}
.iconos1{
	clear: none;
	float: left;
	width: 15%;
	height:100%;
	margin: 0% 0.6% 0% 0.6%;
	padding: 0% 0.2% 0% 0.2%;
	display: block;	
	background-color: #C6FFFF;
	text-align:center;
}
.iconos2{
	background-color: #3EFFFF;
	border:1px solid blue;	
}
.ico1 {
	background-image:url(foto/icono1.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico1:hover {
	background-image:url(foto/icono1a.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}

.ico2 {
	background-image:url(foto/icono2.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico2:hover {
	background-image:url(foto/icono2a.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico3 {
	background-image:url(foto/icono3.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico3:hover {
	background-image:url(foto/icono3a.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico4 {
	background-image:url(foto/icono4.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico4:hover {
	background-image:url(foto/icono4a.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico5 {
	background-image:url(foto/icono5.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico5:hover {
	background-image:url(foto/icono5a.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico6 {
	background-image:url(foto/icono6.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}
.ico6:hover {
	background-image:url(foto/icono6a.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;	
}

#contenido3{
	clear: both;
	float: left;
	width: 86%;
	margin: 0% 0% 0% 0%;	
	padding:0.8% 7% 0% 7%;	
	display: block;
	text-align:center;
	background-color:#0CF;	
}
#contenido3a{
	clear: none;
	float: left;
	display: block;
	width: 18%;
	margin: 0% 0% 0% 0%;
	padding:0% 1% 0% 1%;	
	text-align:center;	
}
#contenido3b{
	clear: none;
	float: left;
	display: block;
	width: 18%;
	margin: 0% 0% 0% 0%;
	padding:0% 1% 2% 1%;
	text-align:center;	
}
#contenido3c{
	clear: none;
	float: left;
	display: block;
	width: 18%;
	margin: 0% 0% 0% 0%;
	padding:0% 1% 1% 1%;	
	text-align:center;	
}
#contenido3d{
	clear: none;
	float: left;
	display: block;
	width: 19%;
	margin: 0% 0% 1% 0%;
	padding:0% 1% 1% 1%;	
	text-align:center;	
}
#contenido3e{
	clear: none;
	float: left;
	display: block;
	width: 18%;
	margin: 0% 0% 1% 0%;
	padding:0% 0% 1% 1%;	
	text-align:center;	
}
#contenido4{
	clear: both;
	float: left;
	width: 86%;
	margin: 0% 0% 0% 0%;
	padding: 0.8% 7% 0.5% 7%;
	display: block;
	text-align: center;
	background-color: #42D9FF;
}
#contenido4a{
	clear: none;
	float: left;
	display: block;
	width: 24%;
	margin: 0% 0% 0% 0%;
	padding:0% 1% 0% 1%;	
	text-align:left;
	border:none;	
}
#contenido4b{
	clear: none;
	float: left;
	display: block;
	width: 23%;
	margin: 0% 0% 0% 0%;
	padding:0% 0.5% 0% 0.5%;
	text-align:center;
	border:none;	
}
#contenido4c{
	clear: none;
	float: left;
	display: block;
	width: 23%;
	margin: 0% 0% 0% 0%;
	padding:0% 1% 1% 1%;	
	text-align:center;
	border:none;	
}
#contenido4d{
	clear: none;
	float: left;
	display: block;
	width: 24%;
	margin: 0% 0% 0% 0%;
	padding:0% 0% 1% 1%;	
	text-align:right;
	border:none;	
}

}