*{margin: 0; padding: 0;}

/* Display block */
header, main, section, footer, aside, article, figure, figcaption, nav, div {display: block;}

/* Quitar márgenes a textos y figuras */
h1, h2, h3, h4, h5, h6, p, figure {margin: 0;}

h1, h2, h3, h4, h5, h6, p, a, span, form, input, select, textarea, option, button, div { font-family: 'Antonio', sans-serif; }

/* Header */
header {width: 100%; height: 80px; margin: 0 auto; float: none; position: fixed; top: 0; right: 0; background: rgba(232, 212, 187, 0.6); z-index: 9998;}
header article {width: 90px; height: 70px; float: none; margin: 0 0 0 35px; padding: 5px 0;}
header article a {width: 100px; height: 70px; float: none;}
header article a img {height: 70px; width: auto; margin: 0 auto; float: none;}

/* Cabecera */
section#cabecera-pantys {width: 100%; height: 150px; float: none; position: relative; margin: 0 auto 85px; background: url('img/pantys.jpg')no-repeat top center; background-size: cover; background-position: 100% 22%; text-align: center;}
section#cabecera-brasier {width: 100%; height: 150px; float: none; position: relative; margin: 0 auto 85px; background: url('img/brasieres.jpg')no-repeat bottom center; background-size: cover; background-position: 100% 39%; text-align: center;}
section#cabecera-boxers {width: 100%; height: 150px; float: none; position: relative; margin: 0 auto 85px; background: url('img/boxer1.jpg') no-repeat bottom center; background-size: cover; background-position: 100% 85%; text-align: center;}
section#cabecera-pantys h1 {padding: 34px 0; font-size: 4em; color: #fff;}
section#cabecera-brasier h1 {padding: 34px 0; font-size: 4em; color: #fff;}
section#cabecera-boxers h1 {padding: 34px 0; font-size: 4em; color: #fff;}


/* Main */
main {width: 100%; height: auto; margin: 0 auto; float: none; position: relative;}

/* Menú */
aside#menu {width: 290px; height: 100%; margin: 0; float: none; position: fixed; right: -290px; top: 0; z-index: 99999; background: rgba(42, 46, 87, 0.9); backdrop-filter: blur(8px);}
aside#menu a#abrir-menu {width: 30px; height: auto; margin: 0; float: none; position: absolute; top: 14px; left: -50px; display: block; text-decoration: none; color: #2a2e57; font-weight: 600; font-size: 2em; line-height: 1em; text-align: center; padding: 10px 0; border-radius: 5px 0 0 5px; transition: all 0.3s ease-in;}
aside#menu a#cerrar-menu {width: 30px; height: auto; margin: 0; float: none; position: absolute; top: 14px; left: -50px; display: none; text-decoration: none; color: #2a2e57; font-weight: 600; font-size: 2em; line-height: 1em; text-align: center; padding: 10px 0; border-radius: 5px 0 0 5px; transition: all 0.3s ease-in;}
aside#menu nav 	{width: 60%; height: auto; margin: 15% auto; float: none; position: relative;}
aside#menu nav a {width: 100%; height: auto; display: block; margin: 0 auto; float: none; position: relative; color: #fff; font-weight: 600; font-size: 1.25em; padding: 10px 0; text-decoration: none; transition: all 0.3s ease-in;}

aside#menu nav a:hover{color: #f3e075; transition: all 0.3s ease-in;}

/* Boton de Whatsapp */
aside#boton-wp {float: none; width: 45px; height: 45px; display: block; margin: 0; position: fixed; right: 15px; bottom: 15px; z-index: 99998;}
aside#boton-wp a {background: #00bb2d; float: none; width: 100%; height: auto; display: block; margin: 0; position: relative; border-radius: 50%; text-align: center; transition: 0.3s ease-in; padding: 10px 0;}
aside#boton-wp a:hover {background: black; transition: 0.3s ease-in;}
aside#boton-wp a i {font-size: 1.5em; line-height: 1em; color: #fff; transition: 0.3s ease-in;}
aside#boton-wp a:hover i {color: #00bb2d; transition: 0.3s ease-in;}

/* Bloque Productos */
main section.bloque-productos {width: 100%; height: auto; margin: 0 auto; float: none; position: relative;}
main section.bloque-productos article {width: 1100px; height: auto; margin: 0 auto; float: none; position: relative;}
main section.bloque-productos article h3 {width: 100%; height: auto; margin: 0 auto; float: none; position: relative; font-size: 3.125em; font-weight: 400; letter-spacing: -0.01em; padding: 0 12px;}
main section.bloque-productos article nav {width: 100%; height: auto; margin: 0 auto; float: none; position: relative;}
main section.bloque-productos article nav a {width: 524px; height: 286px; margin: 12px; float: none; position: relative; display: inline-block;}
main section.bloque-productos article nav a span.nombre-producto {width: 90%; height: auto; display: block; float: none; position: absolute; bottom: 70px; left: 5%; z-index: 2; font-size: 3.125em; font-weight: 400; letter-spacing: -0.01em; padding: 0 12px; color: #fff; text-shadow: 0 0 5px #000;}
main section.bloque-productos article nav a span.precio-producto {width: 90%; height: auto; display: block; float: none; position: absolute; bottom: 35px; left: 5%; z-index: 2; font-size: 2em; font-weight: 200; letter-spacing: -0.015em; padding: 0 12px; color: #fff;}
main section.bloque-productos article nav a img {width: 100%; height: 286px; margin: 0; float: none; position: absolute; top: 0; left: 0; z-index: 1;}


/* Bloque Categorias */
main section#bloque-categorias {width: 100%; height: auto; margin: 35px auto; float: none; position: relative;}
main section#bloque-categorias nav {width: 1100px; height: auto; margin: 0 auto; float: none; position: relative;}
main section#bloque-categorias nav a {width: 48%; height: 400px; margin: 12px 1%; float: none; position: relative; display: inline-block; transition: 0.3s ease-in all;}
main section#bloque-categorias nav a:last-child {width: 48%; height: 400px; margin: 12px 0 1% 1%;  float: none; position: relative; display: inline-block;}
main section#bloque-categorias nav a#categoria-1 {background: url('img/pantys.jpg') no-repeat top center; background-size: cover; transition: 0.3s ease-in all;}
main section#bloque-categorias nav a#categoria-2 {background: url('img/brasieres.jpg') no-repeat top center; background-size: cover; transition: 0.3s ease-in all;}
main section#bloque-categorias nav a#categoria-3 {background: url('img/boxer1.jpg') no-repeat top center; background-size: cover; transition: 0.3s ease-in all;}
main section#bloque-categorias nav a span.nombre-categoria {width: 100%; height: auto; display: block; float: none; position: absolute; top: 0; left: 0; z-index: 2; font-size: 3.125em; font-weight: 100; letter-spacing: -0.035em; padding: 174px 0; color: #fff; text-align: center; line-height: 1em;}
main section#bloque-categorias nav a:hover span.nombre-categoria {width: 100%; height: auto; display: block; float: none; position: absolute; top: 0; left: 0; z-index: 2; font-size: 3.125em; font-weight: 100; letter-spacing: -0.035em; padding: 174px 0; color: #000; text-align: center; line-height: 1em; transition: 0.3s ease-in all;}
main section#bloque-categorias nav a:hover span.capa-oscura {width: 100%; height: 100%; display: block; margin: 0 auto; float: none; position: absolute; top: 0; left: 0; z-index: 1; background: rgba(255, 255, 255, 0.35); transition: 0.3s ease-in all;}
main section#bloque-categorias nav a span.capa-oscura {width: 100%; height: 100%; display: block; margin: 0 auto; float: none; position: absolute; top: 0; left: 0; z-index: 1; background: rgba(0, 0, 0, 0.35);}


/* Footer */
footer {width: 100%; height: 200px; margin: 80px auto 0; float: none; position: relative; top: 0; right: 0; background: #e8d4bb;}
footer article {width: 242px; height: 170px; float: none; margin: 0 auto; padding: 15px 0;}
footer article a {width: 100px; height: 170px; float: none;}
footer article a img {height: 170px; width: auto; margin: 0 auto; float: none;}




/* Zona de Media Queries */

/* Tablets */
@media only screen and (max-width: 1199px){
main section#bloque-categorias {margin: 85px auto;}
main section#bloque-categorias nav {width: 100%;}
main section#bloque-categorias nav a {width: 100%; height: 400px; margin: 0 auto 25px; display: block; overflow: hidden;}
main section#bloque-categorias nav a:last-child {width: 100%; height: 400px; margin: 0 auto 25px; display: block; overflow: hidden;}

main section.bloque-productos article {width: 80%;}
main section.bloque-productos article h3 {text-align: center; padding: 10px 0; margin: auto;}
main section.bloque-productos article nav {width: 100%;} 
main section.bloque-productos article nav a {width: 100%; height: 286px; margin: 0 auto 25px; display: block; overflow: hidden;}
main section.bloque-productos article nav a img {width: 100%; height: 100%;}


}

@media only screen and (max-width: 999px){
	
}

@media only screen and (max-width: 899px){
main section#bloque-categorias nav a {width: 98%; margin: 2% auto 25px; display: block;}
main section#bloque-categorias nav a:last-child {width: 98%; margin: 2% auto; display: block;}
}

@media only screen and (max-width: 699px){

}

@media only screen and (max-width: 499px){
main section.bloque-productos article {width: 90%;}
}

@media only screen and (max-width: 399px){

}