*{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;}

/* 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;}

/* 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;}

/* Producto */
main section#producto {width: 80%; height: 286px; float: none; position: relative; margin: 0 auto 85px;}
main section#producto figure {width: 40%; height: 286px; float: left; position: relative;}
main section#producto figure img {width: 100%; height: 286px; float: none; position: absolute;}
main section#producto article {width: 60%; height: auto; float: left; position: relative; text-align: justify;}
main section#producto article h3 {padding: 20px 0 10px 20px;}
main section#producto article p {padding: 0 0 10px 20px;}
main section#producto article span {padding: 0 0 10px 20px;}
main section#producto article button {padding: 10px 30px; margin: 24px 0 0 20px; background-color: #dcb682; color: #fff; border-radius: 5px; font-size: 1.3em;}

/* Categorias */
main section#bloque-categorias {width: 100%; height: auto; margin: 0 auto; float: none; position: relative;}
main section#bloque-categorias nav {width: 100%; height: auto; margin: 0 auto; float: none; position: relative;}
main section#bloque-categorias nav a {width: 31%; height: 400px; margin: 0 1%; float: none; position: relative; display: inline-block; overflow: hidden;}

main section#bloque-categorias nav a#categoria-1 {background: url('img/pantys.jpg') no-repeat top center; background-size: cover;}
main section#bloque-categorias nav a#categoria-2 {background: url('img/brasieres.jpg') no-repeat top center; background-size: cover;}
main section#bloque-categorias nav a#categoria-3 {background: url('img/boxer1.jpg') no-repeat top center; background-size: cover;}

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;}
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);}
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;}

/* 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#producto {width: 100%; height: 572px; float: none; margin: 0 auto;}
main section#producto figure {width: 80%; float: none; margin: 0 auto;}
main section#producto figure img {width: 100%; margin: 0 auto;}
main section#producto article {width: 80%; height: 286px; float: none; margin: 0 auto; text-align: center;}

main section#producto article h3 {padding: 20px 0 10px 0; font-size: 2.5em;}
main section#producto article p {padding: 0 0 10px 0; font-size: 1.2em;}
main section#producto article span {padding: 0 0 10px 0; font-size: 1.2em;}
main section#producto article button {padding: 10px 30px; margin: 24px 0 0 0; background-color: #dcb682; color: #fff; border-radius: 5px; font-size: 1.3em;}

main section#bloque-categorias {margin: 0 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;}

}

@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){

}