.menu-site {font-family: 'Montserrat', sans-serif;text-transform:uppercase;font-weight:600}
.menu-site ul {padding:0px;margin:0px; display:flex; gap:30px;}
.menu-site li {display:inline-block;position:relative;padding-bottom:4px}
.menu-site li:after {content:"";position:absolute;height:2px;bottom:0px;right:0px;left:75%;background:white;transition:.3s;opacity:0}
.menu-site li:hover:after {left:25%;opacity:.5}
#header .menu-site a {color:white}

#top-menu {background:white;padding:30px 0px;}

#top-menu .logo a {display:block;font-family:"Meddon", cursive; font-size:22px;line-height:22px;color:var(--cor-texto-principal)}

#top-menu .menu-site a {color:var(--cor-primaria)}
#top-menu .menu-site li:hover:after {background:var(--cor-texto-principal)}
#top-menu .social-icons a {color:var(--cor-texto-principal);opacity:0.5}
#top-menu .social-icons a:hover {opacity:1}

#top-menu .logo {margin-right:auto;}
#top-menu .menu {gap: 40px;}

#top-menu .content.flex {align-items:center;}

@media(max-width:1300px) {

    #top-menu {top:0;right:0;left:0;z-index:9}

    .scroll #top-menu {position:fixed;}

    #header .menu-site a {color:var(--cor-primaria)}

    #header .desktop {display:none;}
    #header .p50 {width:100%}

    #top-menu .menu {
        position:fixed;
        background:#000000c9;
        top:0;
        left:0;
        right:0;
        bottom:0;
        flex-direction:column;
        justify-content:center;
        align-items:center;text-align:center;
        display:none;
        z-index:99
    }

    .menu-site ul {
        flex-direction:column;
        font-size:6vw;
        line-height:6vw;
    }

    #top-menu .social-icons a {color:white;opacity:1;font-size:6vw;line-height:6vw;margin:3vw !important}

    #top-menu .mobile {display:block;z-index:9}

    #top-menu.active .menu {display:flex}

    .menu-site li:after {display:none}

    #top-menu.active .fa-bars:before {content: '\f00d'}
}