*{margin:0;padding:0;font-family: 'Roboto', sans-serif; }
body{background-color: white;}

ul{float:right; margin: 5px 15px; }


/*---COLORES--*/
.bg-red{background-color:#ff0036;}
.bg-white{background-color:white;}
.bg-gray{background-color:#d0d0d0;}
.bg-blue{background-color:#0090ff;} 
.bg-gray-dark{background-color: #454545}
.bg-black{background-color: black;}
.bg-header{background-image:url(../img/header.jpg); background-size:cover; background-attachment: fixed; background-position: top; }

.iframe{width:600px; height:359px; border:0; }

.texto { text-align: center; }
.texto h2 {font-size: 40px; margin-bottom: 1%}
.texto p {font-size: 18px; margin-left: 5%; margin-right: 5%; margin-bottom: 10%; }

.color-black{color:black;}
.color-white{color:white;}

.ancho-total{width: 100%;}
.ancho-ochenta{width: 80%;}
.alto-350{height:350px;}

.nav{height: 50px; z-index:99;}
.logo-nav{width: 50px; margin:10px 20px;}

.fixed{position:fixed;}

.thin{font-weight:100;}
.light{font-weight:300;}
.normal{font-weight:400;}
.medium{font-weight:500;}
.bold{font-weight:700;}

.texto{font-size:70%;}
.subtitle{font-size:80%;}
.title{font-size:100%;}
.big-title{font-size:120%;}
.ultra-title{font-size:180%;}
.header-title{font-size:500%;}
.caterogia-title{font-size:260%; }

.text-center{text-align:center;}
.text-left{text-align:left;}
.text-right{text-align:right;}
.text-justify{text-align: justify;}

.padding-top-header{padding-top:100px;}
.padding-top-50{padding-top:50px;}
.padding-bottom-100{padding-bottom:100px;}

.margin-auto{margin:auto;}

.display-inline{display:inline-block; vertical-align:top; }

.categoria{
	position:relative;
	overflow:hidden; 
	width:280px; 
	height:200px;
	margin: auto;
	transition: all 0.3s ease-in-out;
	margin: 5px;
}

.grises{
filter: url('#grayscale'); /* Versión SVG para IE10, Chrome 17, FF3.5, Safari 5.2 and Opera 11.6 */
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%); /* Para cuando es estándar funcione en todos */
filter: Gray(); /* IE4-8 and 9 */

-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
transition: all 0.5s ease;
}



.categoria-text{
	position:absolute; 
	bottom:-60px; 
	padding:2px 8px;
	width: 150px; 
	height: 40px;
	border-radius: 50px;
	left:65px; 
	transition:0.3s;
	line-height: 40px;
}
.categoria-text-final{bottom:10px;}
.categoria-btn{
	position:absolute; 
	bottom:-60px; 
	padding:2px 8px;
	height: 40px;
	border-radius:50px;
	left:95px; 
	transition:0.3s;
	line-height:40px;
}
.categoria-btn-final{bottom:30px;}

.fecha{
	position:absolute; 
	top:70px; 
	width:100%; 
	height:40px;
	left:0; 
	transition:0.3s;
	line-height:40px;
}


.img-footer{width: 60%;}
.img-contenido{width: 80%;}

.foto{ width:60px; background-color:red;border:0;border-radius: 50%;margin:5px;}

.logo-footer{display:inline-block;vertical-align: middle; width:100px;margin:10px 20px;  }
.logo-kebuena{width:150px; }

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

.logo-cri{width:85%; }

}


@media screen and (max-width: 468px) {
.img-footer{width: 100%;}
.subtitle{font-size:80%;}
.title{font-size:100%;}
.big-title{font-size:120%;}
.ultra-title{font-size:180%;}
.header-title{font-size:300%;}

.logo-cri{width:98%; }
.alto-350{height:200px;}

.iframe{width:90%; height:250px; border:0; }
    


}

@media only screen and (min-width:320px) and (max-width: 480px){

    .bg-header{ display: none;}

.bg-header-movil { 
	background-image: url(../img/header-movil.jpg);

background-position: center;
    background-size: cover;



}


}


@media only screen and (min-width:480px) and (max-width: 2080px){

.bg-header-movil {display: none;}



}


}