/* ::::::::::::::::::::::::::::::::::: */
/* Contiene CSS para Desktop y Mobile */
/* ::::::::::::::::::::::::::::::::::: */

/* --> DESKTOP :: menú hamburguesa (burger menu) ------------------------ */
.burger-button, .burger-menu {
    position: absolute;
    position: fixed;
    top: 0;
    right: 0;
}
.burger-button {
    position: relative;
    background: url("../images/menu-nav.svg") no-repeat center center;
    background-size: 22px;
    width: 30px;
    padding: 30px;
    top: 15px;
    transition: var(--trans);
    z-index: 991;
    /* border-left: 1px solid rgba(0,0,255,0.3); */
}
.burger-button:hover {
    background: url("../images/menu-nav-hover.svg") no-repeat center center;
    background-size: 20px;
}
.burger-menu {
    background: rgba(0,0,0,0.9);
    z-index: 9999;
    height: 100vh;
    left: -30vw;
    width: 30vw;
    transition: all 0.4s ease-in-out;
    display: grid;
    justify-items: center;
    align-content: center;
}
.burger-menu.is-active {
    left: 0;
}

.burger-menu ul li {
    font-size: 1.3em;
    line-height: 3em;
}
.burger-menu ul li a {
    padding: 10px;
    transition: var(--trans);
}

.burger-menu ul li a:hover {
    color: var(--orodedalo);
}

a.boton-cerrar {
    position: absolute;
    background: url("../images/close.svg"), url("../images/close-hover.svg") no-repeat center center;
    background-size: cover;
    width: 50px;
    height: 50px;
    right: 10px;
    cursor: pointer;
    margin: 7px 7px 0;
    z-index: 9999;
    transition: all 0.2s;
}
a.boton-cerrar:hover {
    background: url("../images/close-hover.svg") no-repeat center center;
    background-size: 3em; 
    transform: rotate(90deg);
}
.boton-cerrar img {
    width: 50px;
}
/* <-- DESKTOP :: menú hamburguesa (burger menu) ------------------------ */

/* ······· */

/* --> MOBILE :: menú hamburguesa (burger menu) */
@media only screen and (max-width: 425px) {
    .burger-menu {
        left: -100vw;
        width: 100vw;
    }
    
}
/* <-- MOBILE :: menú hamburguesa (burger menu) */