@charset "utf-8";
/* CSS Document */
*{margin:0; padding:0; font-family: 'latolight'}

nav{ width:100%; height:75px; background-color: rgba(45,70,132,.5); position:fixed; z-index:200} /*rgba(42,116,158,.5);*/
#content_logo{ width:346px; height:50px; margin-top:15px; margin-left:7%; float:left}
#content_logo img{ width:100%; height:auto;}
#iniciar{ width:50%; height:20px; float:right; margin-right:80px; margin-top:10px; text-align:left}
#iniciar a{ text-decoration:none; color:#fff}
#iniciar a:hover{ text-decoration:none; color:#bdc8e4}
#iniciar p{ float:right; color:#FFF; font-size:12px; font-weight:bolder}
#menu{ float:right; margin-right:50px; display:block; margin-top:10px;} 
#menu li{ margin-right:20px; margin-left:20px; color:#FFF; display:inline; font-size:12px;}
#menu li a{ text-decoration:none; color:#fff}
#menu li a:hover{ text-decoration:none; color:#bdc8e4}

#menu_cuad{ width:50%; height:20px; float:right; margin-right:80px; margin-top:10px; text-align:left; display:none}
#menudesp{ width:40px; height:40px; background-color:rgba(255,255,255,.6); float:left;  border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; border:solid 1px #E1E1E1;} 
#menudesp:hover{background-color:#3D82C8}
.lineamenu{ width:70%; height:3px; background-color:#EDEDED; margin-top:8px; margin-left:15%; margin-right:15% }

#menudesplegado{ width:250px; height:1000px; background-color:rgba(45,70,132,.9);  margin-top:75px; position:fixed; right:-300px; display:block; display:none} /*right: -300*/ 
#menudesplegado ul{ width:100%; height:auto; float:right; display:block} 
#menudesplegado ul li{ width:100%; height:30px; list-style-type:none; text-decoration:none; border-bottom:solid 1px #fff; cursor:pointer} 
#menudesplegado ul li a{ color:#FFF; text-decoration:none}
#menudesplegado ul li p{ width:100%; text-align:center;  height:auto;  margin-top:13px; font-size:12px}


#cont_nosotros{ width:100%; height:auto; background-color:#53c0ff}
#anchomaximo_nos{ width:100%; height:auto; max-width:1280px;  margin:0 auto; text-align:center;}
#anchomaximo_nos h2{ padding-top:30px; font-family:'bebas_neue_regularregular'; text-align:center; color:#FFF; font-size:60px}

.division_titulo{max-width:750px; width:80%; height:55px;  margin:0 auto; padding-top:30px;}
.linea1{max-width:337.5px; width:45%; height:3px; background-color:#FFF; margin-top:26px; margin-bottom:26px; display:inline; float:left}

.iconocentral{ max-width:55px; width:7.3333%; height:55px;  display:inline; float:left; margin-left:1.3%; margin-right:1.3%;}
.iconocentral img{ width:100%}
#cont_desc_nos{ width:100%; height:auto;}
#cont_desc_nos h4 {height:auto; padding:5%; text-align:center; color:#0c5a88; font-weight:bolder; font-size:15px}
#image_nosotros{ width:100%; height:220px;}
#image_nos_1{ width:28.125%; height:220px; display:inline; float:left}/* altura provicional*/
#image_nos_2{ width:10.703125%; height:220px; display:inline; float:left}/*137px*/
#image_nos_3{ width:26.09375%; height:220px;display:inline; float:left}/*334px*/
#image_nos_4{ width:11.640625%; height:220px; display:inline; float:left}/*149px*/
#image_nos_5{ width:23.4375%; height:220px; display:inline; float:left}/*300px*/

#image_nos_1 p{ text-align:center; font-size:24px; font-family:'bebas_neue_regularregular'; color:#FFF; margin-left:50px}
#image_nosotros img{ margin-top:50px; width:80%; max-width:307px;
	 -webkit-transform: scale(1,1);
	-webkit-transition-timing-function: ease-out;
	-webkit-transition-duration: 1000ms;
	-moz-transform: scale(1,1);
	-moz-transition-timing-function: ease-out;
	-moz-transition-duration: 1000ms;
}
#image_nosotros img:hover{ -webkit-transform: scale(1.1,1.1); -webkit-transform:
	-webkit-transition-timing-function: ease-out;
	-webkit-transition-duration: 100ms;
	-moz-transform: scale(1.1,1.1);
	-moz-transition-timing-function: ease-out;
	-moz-transition-duration: 100ms;}
	


#image_nos_2 img{ margin-top:100px; width:80%; max-width:70px;}

#image_nos_3 p{ text-align:center; font-size:24px; font-family:'bebas_neue_regularregular'; color:#FFF;}
#image_nos_3 img{ margin-top:50px; width:80%; max-width:270px;}
#image_nos_4 img{ margin-top:100px; width:80%; max-width:70px;}
#image_nos_5 p{ text-align:center; font-size:24px; font-family:'bebas_neue_regularregular'; color:#FFF;}
#image_nos_5 img{ margin-top:20px; width:80%; max-width:205px;}


/*quienes*/

#quienes{ width:100%; height:auto; text-align:center;
	background-image: url(../img/quienes_fondo.jpg);
	background-attachment:fixed; 
	background-repeat:no-repeat; 
	background-size:cover; 
	height:auto;  
	margin:0 auto;
	padding:0;
	padding-bottom:50px; 
	max-width:100%;
	width:100%; 
	overflow:hidden; 
	position: relative; 
	}
#quienes h2{ color:#FFF; padding-top:30px; font-family:'bebas_neue_regularregular'; font-size:55px; font-weight:bolder;}
#quienes p{ font-family: 'latolight'; font-size:16px; max-width:1280px; padding-left:5%; padding-right:5%; height:auto; color:#FFF; margin:auto; text-align:justify; }
#bton_quienes{ width:150px; height:25px; text-align:center; border:solid 5px #FFFFFF; font-family:Arial, Helvetica, sans-serif; font-size:12px; padding-top:10px; float:right; margin-right:5%; color:#FFF; font-weight:bolder; cursor:pointer}

/*quienes*/
#filosofia{ width:100%; height:500px; background-color:#FFF; text-align:center; padding-bottom:50px}

#filosofia img{ -webkit-transform: scale(1,1);
	-webkit-transition-timing-function: ease-out;
	-webkit-transition-duration: 1000ms;
	-moz-transform: scale(1,1);
	-moz-transition-timing-function: ease-out;
	-moz-transition-duration: 1000ms;}
	
#filosofia img:hover{ -webkit-transform: scale(1.2,1.2);
	-webkit-transition-timing-function: ease-out;
	-webkit-transition-duration: 500ms;
	-moz-transform: scale(1.2,1.2);
	-moz-transition-timing-function: ease-out;
	-moz-transition-duration: 500ms;}
	
	
#filosofia h2{ color:#333333; padding-top:30px; font-family:'bebas_neue_regularregular'; font-size:55px; font-weight:bolder; margin-bottom:30px;}
.division_negro{ width:70%; max-width:700px; height:3px; margin-top:50px; background-color:#333333; margin:0 auto; margin-bottom:30px}
.op{ width:33.333%; height:350px; display:inline; float:left; margin-top:30px; text-align:center}
.op img{ width:100%; max-width:107px;}
.op h3{ color:#333333; padding-top:30px; font-family:'bebas_neue_regularregular'; font-size:30px; font-weight:bolder; margin-bottom:10px}
.op .division_op{ width:70%; max-width:208px; height:1px; background-color:#333333; margin:0 auto;}
.op p{ color:#333333; padding-top:10px;font-weight:bolder; margin-left:5%; margin-right:5%;}

/*Servicios*/

#servicios{ width:100%; height:500px; text-align:center;
	background-image: url(../img/servicios_fondo.png);
	background-attachment:fixed; 
	background-repeat:no-repeat; 
	background-size:cover; 
	height:auto;  
	margin:0 auto;
	padding:0;
	max-width:100%;
	width:100%; 
	overflow:hidden; 
	position: relative; }

#servicios h2{ color:#fff; padding-top:30px; font-family:'bebas_neue_regularregular'; font-size:55px; font-weight:bolder;}

#content_services{ width:100%; height:auto; background-color:#CCC; margin-top:60px;}


figure { margin: 0; position: relative;}
figure img { display: block; position: relative;  z-index: 10; max-width: 100%; height: auto;width:100%;}
figure figcaption { display: block; position: absolute; z-index: 5;}
figure h3 { color: #fff;font-weight: 700; margin-bottom: 10px; font-size:23px; font-family:'bebas_neue_regularregular'
}
figure span {  color: #b2cce1; display: block;font-size:14px; padding-right:5%;	padding-left:5%; text-align:justify;}
figure a.close-caption {   display: block;   position: absolute;   width: 44px;   height: 44px;   text-align: center;  line-height: 44px;    font-size: 24px;    font-weight: 700;   color: #315a7d;}
figure a.close-caption.hidden {    display: none}
#effect-2{ width:33.3333333%; display:inline-block; float:left}
#effect-2 a.close-caption {   top: 10px;right: 10px; color: #fff; text-decoration: none;}
#effect-2 figure figcaption {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color:#000;
    text-align: center;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: rotateY(-180deg);
    -moz-transform: rotateY(-180deg);
    -ms-transform: rotateY(-180deg);
    -o-transform: rotateY(-180deg);
    transform: rotateY(-180deg);
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}
#effect-2 figure figcaption h3 {margin-top: 150px}
#effect-2 figure img {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}
.no-touch #effect-2 figure:hover img,
#effect-2 figure.hover img {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
}
.no-touch #effect-2 figure:hover figcaption,
#effect-2 figure.hover figcaption {
    -webkit-transform: rotateY(0);
    -moz-transform: rotateY(0);
    -ms-transform: rotateY(0);
    -o-transform: rotateY(0);
    transform: rotateY(0);
}

/*tablas*/
#tablas{ width:100%; height:auto; background-color:#36C; padding-bottom:30px}
#contetablas{ max-width:1280px;  width:100%;  margin:0 auto; text-align:center; padding-top: 30px}
#contetablas h2{ text-align:center; font-family:'bebas_neue_regularregular'; color:#FFF; font-size:36px}
#contetablas h2 a{ text-decoration:none; color:#FFF; font-family:'bebas_neue_regularregular'; }
#contetablas h2 a:hover{ color:#0a246e;}

/*Beneficios*/
#beneficios{ width:100%; height:900px; background-color:#FFF; text-align:center; padding-bottom:50px}
#beneficios h2{ color:#333333; padding-top:30px; font-family:'bebas_neue_regularregular'; font-size:55px; font-weight:bolder;}
.division_titulo_bene{max-width:750px; width:80%;  height:55px;  margin:0 auto; padding-top:30px;}
.division_titulo_bene .linea1{max-width:337.5px; width:45%; height:3px; background-color:#333; margin-top:26px; margin-bottom:26px; display:inline; float:left}

.division_titulo_bene .iconocentral{ max-width:55px; width:7.3333%; height:55px;  display:inline; float:left;margin-left:1.3%; margin-right:1.3%;}
.division_titulo_bene .iconocentral img{ width:100%}
#beneficios img{ -webkit-transform: scale(1,1);
	-webkit-transition-timing-function: ease-out;
	-webkit-transition-duration: 1000ms;
	-moz-transform: scale(1,1);
	-moz-transition-timing-function: ease-out;
	-moz-transition-duration: 1000ms;}
	
#beneficios img:hover{ -webkit-transform: scale(1.2,1.2);
	-webkit-transition-timing-function: ease-out;
	-webkit-transition-duration: 500ms;
	-moz-transform: scale(1.2,1.2);
	-moz-transition-timing-function: ease-out;
	-moz-transition-duration: 500ms;}
	
.opc{ width:33.333%; height:350px; display:inline; float:left; margin-top:30px; text-align:center}
.opc img{ width:100%; max-width:107px;}
.opc h3{ color:#333333; padding-top:30px; font-family:'bebas_neue_regularregular'; font-size:30px; font-weight:bolder; margin-bottom:10px}
.opc .division_op{ width:70%; max-width:208px; height:1px; background-color:#333333; margin:0 auto;}
.opc p{ color:#333333; padding-top:10px;font-weight:bolder; margin-left:5%; margin-right:5%;}


/*contacto*/
#contacto{background-color:#36C; width:100%; height:auto;
	text-align:center;
	background-image: url(../img/contacto_fondo.jpg);
	background-attachment:fixed; 
	background-repeat:no-repeat; 
	background-size:cover;  
	margin:0 auto;
	padding:0;
	padding-bottom:50px; 
	max-width:100%;
	overflow:hidden; 
	position: relative; }

#contenedor_contacto{ width:100%; max-width:1280px; height:auto; margin: 0 auto;}
#contacto h2{ color:#fff; padding-top:30px; font-family:'bebas_neue_regularregular'; font-size:55px; font-weight:bolder;}
#contacto h3{ color:#fff; padding-top:10px; font-size:16px;}

#formulario{  width:50%; height:auto; float:left; display:inline; padding-top:30px;} 
input{ background-color:rgba(255,255,255,.8); width:90%; height:30px; margin:0 auto; margin-top:20px; border:none; border-radius:5px; color:#0a246e; font-size:14px; padding:5px;}
::-webkit-input-placeholder { color:#0a246e; } /* WebKit */
:-moz-placeholder { color:#0a246e; } /* Firefox 18- */
::-moz-placeholder { color:#0a246e; } /* Firefox 19+ */
:-ms-input-placeholder { color:#0a246e; } /* IE 10+ */
textarea {  background-color:rgba(255,255,255,.8); width:90%; height:208px; margin:0 auto; margin-top:20px; border:none; border-radius:5px; color:#0a246e; font-size:14px; padding:5px; resize:none}
button{background-color:#0a246e; width:90%; height:40px; margin:0 auto; margin-top:20px; border:none; border-radius:5px; color:#fff; font-size:14px; padding:5px;}
button:hover{background-color:#1f377d;}

#cont_mapa{ width:50%; height:500px; float:left; display:inline; padding-top:30px;}
#mapa{ width:90%; height:480px; margin:0 auto; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; border:solid 6px #FFFFFF} 

/*footer*/
footer{ width:100%; height:auto; background-color:#2a3243; font-size:12px; color:#FFF; line-height:23px}
footer h4{ padding-left:10%; padding-right:10%}
#direccion{ width:100%; height:auto; text-align:center; padding-top:20px;}
#redes{ width:100%; height:auto; text-align:center}
#redes img{ width:50%;display:inline-block; float:left; 
	-webkit-transform: scale(1,1);
	-webkit-transition-timing-function: ease-out;
	-webkit-transition-duration: 500ms;
	-moz-transform: scale(1,1);
	-moz-transition-timing-function: ease-out;
	-moz-transition-duration: 500ms;}
#redes img:hover{ 
	-webkit-transform: scale(1.2,1.2);
	-webkit-transition-timing-function: ease-out;
	-webkit-transition-duration: 500ms;
	-moz-transform: scale(1.2,1.2);
	-moz-transition-timing-function: ease-out;
	-moz-transition-duration: 500ms;}
	
#sucursales{ width:45%; height:auto; float:left; display:inline-block; margin-top:30px; text-align:center}
#cont_redes{ width:90%; max-width:70px; height:35px; margin:0 auto; padding-top:20px;}


#aviso {width:100%; text-align:center; height:50px; background-color:#2a3243; color:#fff; font-size:10px;padding-top:20px; }
#aviso a{ color:#CCC; text-decoration:none;}
#aviso a:hover{ color:#C30; cursor:pointer}
.iconospie {width:300px; float:right;}
.icon {width:25px; height:25px; float:left; margin-right:15px; margin-left:10px; margin-top:5px;}

#aviso a:hover{ color:#DE001D}
/*inicia popup aviso*/
a.aviso{cursor:pointer;}
.overlay{background:transparent  url(../img/overlay1.png) repeat top left;position:fixed;top:0px;bottom:0px;left:0px;right:0px;z-index:2000;}
.box{position:fixed;top:-700px;left:10%;right:10%;height:auto;background-color:#fff;color:#7F7F7F;padding:20px;-moz-border-radius: 20px;-webkit-border-radius:8px;
-khtml-border-radius:8px;-moz-box-shadow: 0 1px 5px #333;-webkit-box-shadow: 0 1px 5px #333;z-index:2000;}
.scroll{ width:100%; height: 500px; overflow:auto;} 
.box h1{border-bottom: 1px dashed #7F7F7F;margin:-20px -20px 0px -20px;padding:10px; background-color:#666;color:#FFF;-moz-border-radius:8px 8px 0px 0px;-webkit-border-top-left-radius: 8px;-webkit-border-top-right-radius: 8px;-khtml-border-top-left-radius: 8px;-khtml-border-top-right-radius: 8px; font-family:'bebas_neue_regularregular'; text-align:center}
a.boxclose{float:right;width:26px;height:26px; background:transparent url(../img/cancel.png) repeat top left;margin-top:-30px;margin-right:-30px;cursor:pointer;}
.box p{text-align:justify; padding-top:10px; font-size:14px}
.box a{color:#36F; text-decoration:none}

@media screen and (max-width:1140px){ 
#content_logo { width:320px; margin-left:4%}
#menu li { margin-right: 12px; margin-left: 12px;}
}

@media screen and (max-width:1000px){ 

#effect-2 figure figcaption h3 {margin-top: 100px}
#menu{margin-right:10px;}
#iniciar { margin-right:10px}
#menu li { margin-right: 8px; margin-left: 8px;}
}

@media screen and (max-width:890px){ 
#effect-2 { width: 50%;}
#effect-2 figure figcaption h3 {margin-top: 150px}

#Contenedor_general{ padding-top:75px;}
nav {background-color: rgba(45,70,132,1);}
#menu { display:none}
#iniciar{ width:20%; margin-top:5px; margin-right:80px}
#menu_cuad{width:30%; margin-top:0;  display: block}
#menudesp { float:right; }

#menudesplegado{ display:block}

}

@media screen and (max-width:750px){ 
.op {width: 100%; margin-top:0; }
.opc{ width:50%; }



#cont_desc_nos h4 { font-size:13px}
#quienes p { font-size:13px}

#bton_quienes { width:130px; height:20px; margin-top:10px}
#menu_cuad{ margin-right:4%}
#iniciar{ margin-right:4%}

#contetablas h2{font-size:30px}

}

@media screen and (max-width:680px){ 
#effect-2 figure figcaption h3 {margin-top: 75px;}
.scroll { height:350px}

}


@media screen and (max-width:600px){ 
#formulario {width: 100%;}
#cont_mapa { width: 80%; margin-right:10%; margin-left:10%}
#effect-2 figure figcaption h3 { font-size:18px}
figure span { font-size:12px}
.opc p { font-size:13px}
.opc { height:300px}

#menu_cuad{ width:20%; margin-right:10px;}
#iniciar{ width:20%; margin-right:10px}
}

@media screen and (max-width:500px){ 

#content_logo { width:250px; margin-top: 20px;}
#cont_desc_nos h4 { text-align:justify; padding-top:0}
#anchomaximo_nos h2 { font-size:40px;}
#quienes h2 { font-size:40px;}
.division_titulo { padding-top:0px}
#effect-2 { width: 100%;}

#effect-2 figure figcaption h3 {margin-top: 150px; font-size:25px;}
figure span { font-size:16px}
.opc { width:100%; height:270px}
.opc p { font-size:14px}
#direccion { width: 100%; float:none; font-size:11px}
#redes { width: 100%; height:50px; float:none}
#cont_redes { margin-top:0; float:none}
#sucursales { width:100%; margin-top:0;float:none}
#aviso { padding-top:30px; height:auto}
.iconocentral { display:none}
.linea1 { width:50%}

.division_titulo_bene { padding-top:0}
.division_titulo_bene .linea1 { width:50%}
.division_titulo_bene .iconocentral { display:none}

#contetablas h2{font-size:25px}
}

@media screen and (max-width:450px){ 
#image_nosotros { height:auto ; padding-bottom:50px}
#image_nos_1 { width: 100%; float:none; display:block; height:auto}
#image_nos_1 p { margin-left:0}
#image_nos_2 {width: 100%; float:none; display:block; height:auto; margin-top:40px; margin-bottom:40px}
#image_nos_2 img { margin-top:0;  transform:rotate(90deg)}
#image_nos_3 {width: 100%; float:none; display:block; height:auto}
#image_nos_4 {width: 100%; float:none; display:block; height:auto; margin-top:40px; margin-bottom:40px}
#image_nos_4 img { margin-top:0;  transform:rotate(90deg)}
#image_nos_5 {width: 100%; float:none; display:block;height:auto}
#content_logo { width:200px}
#iniciar {width: 25%;}

#cont_mapa { height:auto}
#mapa { height:380px}
#contetablas h2{font-size:20px}
}
