/*=============================================
BANNER
=============================================*/

.banner{
	position: relative;
	overflow:hidden;
	border-radius: 6px;

}

.banner .textoBanner{
	position:absolute;
	font-family: 'Ubuntu Condensed', sans-serif;
}

.banner .textoDer{
	right:50px; 
	text-align:right;
}

.banner .textoIzq {
	left:0px; 
	text-align:left;
}

.banner .textoIzq h1{
	background:rgba(0,0,0,.9);
	text-shadow:0px 0px 10px black;
	border-radius:0px 5px 5px 0px;
}

.banner .textoCentro{
	top:50px; 
	left:50%;
	width:800px; 
	margin-left: -400px;
	text-align:center;
}

.textoBanner h1{
	font-size:35px;
	line-height:20px;
}

.textoBanner h2{
	font-size:30px;
	line-height:20px;
}

.textoBanner h3{
	font-size:24px;
}

/*=============================================
BARRA PRODUCTOS
=============================================*/

.productos {
	width: 121%;
	margin-left:-9%;
}


.barraProductos .organizarProductos span{
	margin-left:30px;
}

/*=============================================
VITRINA PRODUCTOS CUADRÍCULA
=============================================*/

.tituloDestacado h1{
	margin-top:-10px;
	text-align:center;

}

.tituloDestacado button span{
	margin-left:5px;
}

.productos ul li figure{
	overflow:hidden;
}

.productos ul li a img:hover{
	transition: .3s all ease;
	opacity:.8;
	transform: scale(1.2,1.2);

}

.productos ul li h4 small{
	color:#777;
	text-transform: uppercase;
	font-size:12px;
	font-weight: 700;
}

.productos ul li h4 small a{
	color:#777;
}

.productos ul li div.precio{
	padding:0;
	margin-top:-30px;
	padding-bottom:20px;
}

.productos ul li div.enlaces{
	padding:0;
	padding-bottom:20px;
}

.productos ul li div.enlaces button{
	margin:2px;
}

.productos ul li div.enlaces button i{
	color:#999;
	font-size:10px;
}


/*=============================================
VITRINA PRODUCTOS LISTA
=============================================*/

.productos ul li h1{
	margin-top:-10px;
}

.productos ul li h1 small{
	text-transform: uppercase;
	font-size:18px;
	font-weight: 700;
}

.productos ul li h1 small a{
	color:#777;
}

.oferta{
	 text-decoration:line-through;
	 color:#ccc;
	 font-size:14px;
}

.fontSize{
	font-size:11px;
}


/*=============================================
ESCRITORIO GRANDE (LG revisamos en 1366px en adelante)
=============================================*/

@media (min-width:1200px){

	.banner{
		top:5px;
		height:380px;
	}

	.banner .textoDer{
		top:5px; 
	}
	
	.banner .textoIzq {
		top:50px; 
	}

	.banner .textoIzq h1{
		font-size:40px;
		padding:25px;
		padding-left:100px;
	}
	.organizarProductos {
		position: absolute;
		right: 5%;
		
	}

	.btnFiltrar {
		position: relative;		
		margin-top:-15px;
		width: 100px;


		
	


}

/*=============================================
ESCRITORIO MEDIANO O TABLET HORIZONTAL (MD revisamos en 1024px)
=============================================*/

@media (max-width:1199px) and (min-width:992px){

	.banner{
		height:180px;
	}
	
	.banner .textoDer{
		top:10px; 
	}

	.banner .textoIzq {
		top:35px; 
	}

	.banner .textoIzq h1{
		font-size:30px;
		padding:25px;
		padding-left:60px;
	}

	.textoBanner h1{
		font-size:25px;
		line-height:10px;
	}

	.textoBanner h2{
		font-size:20px;
		line-height:10px;
	}

	.textoBanner h3{
		font-size:20px;
		line-height:10px;
	}
	.organizarProductos {
		position: absolute;
		right: 5%;
		
	}

}

/*=============================================
ESCRITORIO PEQUEÑO O TABLET VERTICAL (SM revisamos en 768px)
=============================================*/

@media (max-width:991px) and (min-width:768px){

	.banner{
		height:150px;
	}

	.banner .textoDer{
		top:0px; 
	}
	
	.banner .textoIzq {
		top:10px; 
	}

	.banner .textoIzq h1{
		font-size:20px;
		padding:25px;
		padding-left:60px;
	}

	.textoBanner h1{
		font-size:25px;
		line-height:10px;
	}

	.textoBanner h2{
		font-size:20px;
		line-height:10px;
	}

	.textoBanner h3{
		font-size:20px;
		line-height:10px;
	}

	.banner .textoIzq, .banner .textoCentro{
		top:22px; 
	}

	.organizarProductos {
		position: absolute;
		right: 5%;
		
	}

	.tituloDestacado h1{
		
		font-size:12px !important;	
		font-weight: bold !important;
		margin-top: -1%;
		
	}

	.btnVerMas{
		position: absolute;
		right: 10%;
		font-size:10px;	

	}


}

/*=============================================
MOVIL (XS revisamos en 320px)
=============================================*/

@media (max-width:767px) and (min-width:401px){

	.banner{
		top: 10px;
		height:100px;
	}
	.banner .textoDer{
		top:-5px; 
		

	}
	
	.banner .textoIzq {
		top:0px; 
		left: 0%;
	}	
	
	.textoBanner h1{
		font-size: 19px;
		position: relative;
		left: 16%;
	}

	.textoBanner h2{
		font-size: 15px;
		position: relative;
		top: -15px;
		left: 16%;
	}

	.textoBanner h3{
		font-size: 14px;
		position: relative;
		top: -30px;
		left: 16%;
	}

	
	.banner .textoIzq {		
		font-size:20px;	
		display:block;
		left: -10px;
	}	

	.tituloDestacado h1{
		
		font-size:12px !important;	
		font-weight: bold !important;
		margin-top: -1%;	
	}

	

	#btnVerMas{
		position: absolute;
		right: -50%;
		font-size:100px;	

	}

	.btnGridCompleta{
		position: absolute;
		right: -5%;
		margin-top: -1%;
		

	}

	.productos ul li h1 small{
		font-size:16px;
	}

	.organizarProductos {
		position: absolute;
		right: 5%;
		
	}

	

	
}

/*=============================================
MOVIL (XS revisamos en 400px)
=============================================*/

@media (max-width:400px) {

	.banner{
		top: 10px;
		height:100px;
	}
	.banner .textoDer{
		top:-5px; 
		

	}
	
	.banner .textoIzq {
		top:0px; 
		left: 0%;
	}	
	
	.textoBanner h1{
		font-size: 19px;
		position: relative;
		left: 16%;
	}

	.textoBanner h2{
		font-size: 15px;
		position: relative;
		top: -15px;
		left: 16%;
	}

	.textoBanner h3{
		font-size: 14px;
		position: relative;
		top: -30px;
		left: 16%;
	}

	
	.banner .textoIzq {		
		font-size:20px;	
		display:block;
		left: -10px;
	}	

	.tituloDestacado h1{
		
		font-size:12px !important;	
		font-weight: bold !important;
		margin-top: -1%;	
	}

	

	#btnVerMas{
		position: absolute;
		right: -50%;
		font-size:100px;	

	}

	.btnGridCompleta{
		position: absolute;
		right: -5%;
		margin-top: -1%;
		

	}

	.productos ul li h1 small{
		font-size:16px;
	}

	.organizarProductos {
		position: absolute;
		right: 5%;
		
	}

	.skrim__title {
    
    font-weight: 900;
    font-style: normal;
    letter-spacing: .05em;
    line-height: .8;
    text-transform: uppercase;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 12.5px 0;    
    transition: bottom .5s ease;
    display: -ms-flexbox;
    display: flex;
    text-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;

    
}

	

	
}