@media (max-width: 767px) {
    .nav-container{
        position: fixed;
        height: 100%;
        display: flex;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        opacity: 0;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 65px;
        font-size: 2.2rem;
        background-color: #000;
        opacity: 0;
        transition: all 0.3s;
        z-index: 0;
    }

    .Container-burger-menu.active ~ .nav-container {
        opacity: 0.9;
        z-index: 2;
    }

    .SocialIcons {
        height: 68px;
    }
}

@media (min-width: 767px) {
    header {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    
    .nav-container {
        display: flex;
        align-items: center;
        gap: 34px;
    }
    
    .nav-container a {
        text-shadow: 3px 2px 2px #000;
        padding: 6px;
        transition: all 0.8s;
    }
    
    .nav-container a.Text-a:hover {
        background-color: #E62721;
    }

    .SocialIcons {
        height: 28px;
    }
}
