.header-container {
    background-color: rgb(217 197 180 / 80%);
}

.header-nav ul li a::after {
    content: '';
    width: 100%;
    height: 5px;
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: #d04440;
    opacity: 0;
}

.header-nav ul li a:hover::after {
    opacity: 1;
}
.header-nav ul li .active::after{
    opacity: 1;

}
.header-nav-main {
    transform: translateX(100%);
    transition: all 0.5s ease;
    z-index: 20;
}

.header-nav-main.active {
    transform: translateX(0);
}
.header-container.active{
    position: relative;
}