@charset "utf-8";
/* CSS Document */

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{
	display: block;
}
body{ margin:0; padding:0;}
*{box-sizing: border-box}

div{ display:block}

.contenedor{ width:100%; margin: 0 auto; background:none;}
.ovfh{overflow:hidden}

/*columnas con porcentajes*/
.col1,.col2,.col3,.col4,.col5,.col6,.col7,.col8,.col9,.colter,.col2ter,.colcuar{  float:left; padding:  0 16px}

.col1{  width:10%;}
.col2{  width:20%;}
.col3{  width:30%;}
.col4{  width:40%; }
.col5{  width:50%;}
.col6{  width:60%;}
.col7{  width:70%;}
.col8{  width:80%;}
.col9{  width:90%;}
.col10{  width:100%;}
.colter{  width:33.3%;}
.col2ter{  width:66%;}
.colcuar{  width:25%;}
.col3cuar{  width:75%;}
.col-nopad{padding: 0  0}
.fila{width:100%;clear:both; position: relative}

.paddingpeq{padding:10px}
.paddingmd{padding:20px}
.paddingg{padding:30px}

.padding1peq {padding-top:10px}
.padding2peq {padding-right:10px}
.padding3peq {padding-bottom:10px}
.padding4peq {padding-left:10px}

.padding1md{padding-top:20px}
.padding2md {padding-right:20px}
.padding3md{padding-bottom:20px}
.padding4md {padding-left:20px}

.padding1g{padding-top:30px}
.padding2g{padding-right:30px}
.padding3g{padding-bottom:30px}
.padding4g {padding-left:30px}

/*separadores */
.margin10{margin:16px}
.margin20{margin:24px}
.mg0{margin:0;}
.mt0{margin-top:0}

.separahorz{margin-left:64px ;margin-right:  64px  }
.separaver{ margin-top:  64px ;margin-bottom:  64px }

.separa-down{margin-bottom:15px}
.separa-up{margin-top:15px}
.separa-drch{ margin-right: 10px }
.separa-izq{ margin-left:10px }
/*alineamiento de texto*/
.text-drch{ text-align:right}
.text-izq{ text-align:left}
.text-centro{ text-align:center}
.vm{ vertical-align:middle}
/* flotar */
.flotar{float:left}
.flotar-drch{float:right}
.fin-float{clear:both}
.finfloat{clear:both}
.posab{position:absolute}
.posrel{position:relative}

.bloque{display:block}
.ocultar_pc{display:none;}
.mostrar{display:none}
/********/

@media (max-width: 1023px) {

.col1-tab{ width:100%;}
.col2-tab{ width:50%;}
.col3-tab{  width:33%;}
.ocultar{display:none;}
.ocultar_pc{display:block;}
}

@media (max-width: 768px) {
	.mostrar{ display: block}
.col1-movil{width:100%;}
.col2-movil{width:50%;}



}
/***********************************************************

.btn
	{ 	font-size: 22px;
	    display: inline-flex;
        padding: 10px 8px;
        justify-content: center;
       align-items: center;
        gap: 10px;
		font-family:'Lato', sans-serif;font-weight:400;
		cursor: pointer;
		color: #12568c;
	}
.btn2
	{ padding:4px 12px;
		font-size:0.8em;
		color: #45778E;
		background:#CBDDE6;
		border:none;
		text-decoration:none;
	
		
	}
		
.btn:hover {
		color: #000; text-decoration:none;
	}*/
.enlace{text-decoration:none; }
.img-responsive {width:100%}	





/**************************especificos-------------------------------------------*/
.caja-syb{border:1px solid #ccc; margin-top:10px;margin-bottom:10px;padding:10px 15px}
.contorno{border:1px solid #ccc}
.negrita{ font-weight:bold}
.blanco{color:#fff}
.negro{color:#000}

.enlace{text-decoration:none; }
.img-responsive, .img-resp {width:100%}	
 
 
 
 /*zoom*/
    .zoom, .zoom img{
        /* Aumentamos la anchura y altura durante 2 segundos-con esto se consigue una transicion progresiva cuando se realiza el hover, si no, saldria del tiron mas grande */
        transition: width 2s, height 2s, transform 2s;
        -moz-transition: width 2s, height 2s, -moz-transform 2s;
        -webkit-transition: width 2s, height 2s, -webkit-transform 2s;
        -o-transition: width 2s, height 2s,-o-transform 2s;
    }
    .zoom:hover, .zoom:hover img{
        /* tranformamos el elemento al pasar el mouse por encima al doble de
           su tamaño con scale(2). */
        transform : scale(1.2);
        -moz-transform : scale(1.2);      /* Firefox */
        -webkit-transform : scale(1.2);   /* Chrome - Safari */
        -o-transform : scale(1.2);        /* Opera */
    }
/***********************efecto zoom*****************************/
.img-zoom img {
-webkit-transition:all .9s ease; /* Safari y Chrome */
-moz-transition:all .9s ease; /* Firefox */
-o-transition:all .9s ease; /* IE 9 */
-ms-transition:all .9s ease; /* Opera */
width:100%;
}
.img-zoom:hover img {
-webkit-transform:scale(1.25);
-moz-transform:scale(1.25);
-ms-transform:scale(1.25);
-o-transform:scale(1.25);
transform:scale(1.25);
}
.img-zoom {/*Ancho y altura son modificables al requerimiento de cada uno*/
width:200px;
height:150px;
overflow:hidden;
}
/*efecto giro */
.ex3 img {
/*margin: 20px;
border: 5px solid #eee;
-webkit-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
-moz-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
box-shadow: 4px 4px 4px rgba(0,0,0,0.2);*/
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
}
.ex3 img:hover {
-webkit-transform: rotate(-7deg);
-moz-transform: rotate(-7deg);
-ms-transform: rotate(-7deg);
transform: rotate(-7deg);

}
/*efecto sube-------------------------------------*/
.ex1 img {
/*border: 5px solid #ccc;
float: left;
margin: 15px;*/
-webkit-transition: margin 0.5s ease-out;
-moz-transition: margin 0.5s ease-out;
-ms-transition: margin 0.5s ease-out;
transition: margin 0.5s ease-out;
}
.ex1 img:hover {
margin-top: 2px;
}