.header{
    background: var(--color-terciario);
    width: 100%;
    height: 90px;
    display: flex;
    align-items: flex-end;   
}
.header__box{
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
}
.header__box-logo a{
    display: flex;
    flex-wrap: wrap;
}
.header__title{
    font-size: 1.2rem;
    width: 52%;
    color: var(--blanco);
}
.divisor{
    background: var(--blanco);
    width: 1px;
    height: 21px;
    margin: 1px 4px;
    transform: rotate(15deg);
}
.linea{
    background: var(--blanco);
    width: 25px;
    height: 3px;
    border-radius: 5px;
    margin: 3px 0;
    transition: all 1s;
    transform-origin: left;
}
.linea:nth-child(1){
    transform: rotate(0deg);
}
.linea:nth-child(2){
    opacity: 1;
}
.linea:nth-child(3){
    transform: rotate(0deg);
}

.linea2{
    background: var(--blanco);
    width: 25px;
    height: 3px;
    border-radius: 5px;
    margin: 3px 0;
    transition: all 1s;
    transform-origin: left;
}

.linea2:nth-child(1){
    transform: rotate(30deg);
}
.linea2:nth-child(2){
    opacity: 0;
}
.linea2:nth-child(3){
    transform: rotate(-30deg);
}



.idiomas{
    display: flex;
    position: absolute;
    top: 0.8rem;
    right: 0.2rem;
    padding-left: 8px;
    align-items: center;
    background: var(--color-primario);
    border-radius: 20px;
    margin-top: 4px;
    margin-right: 4px;
}
.idiomas__title{
    color: var(--blanco);
    font-size: 0.9rem;
    font-style: italic;
    padding-right: 0.4rem;
}
.idiomas__icono{
    width: 23px;
    height: 23px;
    filter: invert(100%) sepia(9%) saturate(7492%) hue-rotate(222deg) brightness(116%) contrast(94%);
}
.navbar{
    align-items: center;
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 9rem;
    background: var(--color-primario);
    padding: 1.6rem;
    left: 0;
    width: 100%;
}
.navbar a{
    color: var(--color-secundario);
    padding: 0 0.6rem;
}

.hamburger:hover{
    cursor: pointer;
}

.submenu{
    display: none;
}
.navbar__dropdown-content {
    background-color: #9aa1ff;
}

.navbar__dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: inline-block;
    width: 100%;
}

.navbar__dropdown-content a:hover {
    background-color: #ddd;
}

.navbar__link:hover{
    text-transform: uppercase;
}

/*?------------------------------- MediaQuery ------------------------ */

@media screen and (min-width:768px){
    .header__title {
        width: 40%;
    }
    .idiomas{
        top: 16px;
        right: 30px;
    }    
}

@media screen and (min-width:992px){
    .header__title {
        width: 54%;
    }
    .hamburger{
        display: none;
    }
    .idiomas{
        right: 146px;
    } 
    .no-mostrar{
        display: contents;
    }
    .navbar{
        flex-direction: row;
        position: static;
        padding: 0;
        background: var(--color-terciario);
        justify-content: flex-end;
    }

    .navbar__dropdown-content {
        display: none;
        position: absolute;
        background-color: #f1f1f1;
        box-shadow: 8px 12px 7px 0px rgb(0 0 0 / 80%);
        z-index: 1;
        border-radius: 4px;
        width: 24rem;
    }
    
    .navbar__dropdown-content a {
        color: black;
        padding: 0.4rem 1rem;
        text-decoration: none;
        display: block;
    }   
    
    .navbar__dropdown:hover .navbar__dropdown-content {
        display: block;
    }
    .navbar__link:hover{
        background: var(--color-primario);
        border-radius: 10px 10px 0px 0px;
        padding-bottom: 3px;
        text-transform: none;
    }

}