/*-------------- header-section -------------------------*/
div.img-header-home{
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
   

}

@media (min-width:768px) {
    div.img-header-home{
        height: calc(100vw / 3);
        position: relative;
        top: calc(0px - calc(100vw / 4.8)) ;
    }
}

#cont-header-img{
    max-width: 90%;
}

#clima-date{
    border-radius: 1rem;
    background-color: white;
    min-width:76px;
}

#clima-date #date{
    background-color: var(--guati-color-cuar);
    background-image:linear-gradient(90deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
    border-radius: 0 0 1rem 1rem;
}

#clima-date > div{
    border-radius: 1rem;
}

.calendar-header{
    width: max(50%, 75px);
}
.calendar-header p.day{
    line-height: 1.1;
    font-size:3.5rem;
    font-weight:bold;
}
.calendar-header p.month{
    font-size:1rem;
    font-weight:bold;
}

#social-menu > div{
    background-color: var(--blanco);
    background-image:linear-gradient(0deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0));
    border-radius: 1rem;
}