@charset "utf-8";
/* CSS Document  */

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{
	display: block;
}
body{ margin:0; padding:0;font-family: Arial, Helvetica, sans-serif;}
*{box-sizing: border-box}

div{ display:block}

.contenedor{ width:100%;  margin: 0 auto; background:none;}
.contenedor-con{max-width:1100px;  margin: 0 auto;}
.ovfh{overflow:hidden}
.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:10px}
.margin20{margin:20px}
.separahorz{margin: 0 10px 0 10px}
.separaver{ margin:  10px 0 10px 0}

.separa-down{margin-bottom:15px}
.separa-downg{margin-bottom:70px}
.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}
/*columnas con porcentajes*/
.col1,.col2,.col3,.col4,.col5,.col6,.col7,.col8,.col9,.colter,.col2ter,.colcuar{  float:left; padding:  0 12px}

.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%;}
.col-nopad{padding: 0  0}
.col-pad{ padding:  0 12px}
.fila{width:100%;clear:both;position:relative}
/********/
@media (max-width: 1024px) {

.col1-tab{ width:100%;}
.col2-tab{ width:50%;}
.col3-tab{  width:33%;}

}

@media (max-width: 768px) {

.col1-movil{width:100%;}
.col2-movil{width:50%;}
.contenedor{margin:5px;}


}
/************************************************************/

.btn
	{ display:inline-block;
		padding:8px 22px;	
		font-size: 1,2em;
		letter-spacing:1px;
		border: none;
		color: #FFF;
		background:#9D0020;
		text-decoration:none;
		font-family: 'Open Sans',san-serif;
		/*box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.35);*/
	}
.btn2
	{ padding:4px 12px;
		font-size: 0.9em;
		color: #fff;
		background:rgba(204,153,0,1);
		border:none;
		text-decoration:none;
	
		
	}
		
.btn:hover {
		color: #222;
		background: rgba(213,229,105,1); text-decoration:none;
	}
.enlace{text-decoration:none; }
.img-responsive {width:100%}	


 /**********sybelio inputs***************/
.cajainput, .form-hab input, .form-hab select {
	border:1px solid #000;
	 padding:7px 3px; 
	 display:block;
	 height:34px;
	 margin-bottom:10px;}
/*.cajainput{background:none}*/
.bordeabajo{margin:18px 0; border-bottom:2px solid #333; 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;
}