#cabecalho {
    padding-top: 0
}

#cabecalho .conteiner {
    position: relative;
    display: flex;
    align-items: center;
    column-gap: 1.25rem;
    width: 100%;
    height: auto;
    padding: 1.25rem 0.9375rem !important;
    box-shadow: none !important;
    border-bottom: 0.0625rem solid rgba(0, 0, 0, .1)
}

#cabecalho .conteiner.fixed {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999
}

#cabecalho .conteiner .btn-menu {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.5625rem;
    height: 1.0625rem;
    outline: 0;
    border: 0;
    background: none
}

#cabecalho .conteiner .btn-menu img {
    width: 100%
}

#cabecalho .conteiner .nav-menu {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    width: 100%;
    height: 100vh;
    background: none;
    box-shadow: none;
    backdrop-filter: blur(0rem);
    display: none
}

#cabecalho .conteiner .nav-menu.active {
    display: block;
    background: rgba(0, 0, 0, .5);
    box-shadow: 0 0.25rem 1.875rem rgba(0, 0, 0, .1);
    backdrop-filter: blur(0.625rem);
    animation: open 1s
}

#cabecalho .conteiner .nav-menu.active .header-menu {
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 0.9375rem;
    border-bottom: 0.0625rem solid rgba(0, 0, 0, .1)
}

#cabecalho .conteiner .nav-menu.active .header-menu .brand {
    height: 1.625rem
}

#cabecalho .conteiner .nav-menu.active .header-menu .close-menu {
    background: none;
    border: 0;
    outline: 0;
    height: 1.375rem
}

#cabecalho .conteiner .nav-menu.active .header-menu .close-menu img {
    height: 100%
}

#cabecalho .conteiner .nav-menu.active .list-menu {
    background: #fff;
    list-style: none;
    padding: 1.25rem 0.9375rem 2.5rem 0.9375rem;
    border-radius: 0 0 0.9375rem 0.9375rem
}

#cabecalho .conteiner .nav-menu.active .list-menu .item-menu {
    display: flex;
    align-items: center;
    width: 100%;
    height: 2.5rem
}

#cabecalho .conteiner .nav-menu.active .list-menu .item-menu:not(:last-child) {
    border-bottom: 0.0625rem solid rgba(0, 0, 0, .1)
}

#cabecalho .conteiner .brand-menu {
    height: 1.625rem
}

#cabecalho .conteiner .brand-menu img {
    height: 100%
}

#cabecalho .conteiner .actions-menu {
    position: absolute;
    right: 0.9375rem;
    display: flex;
    align-items: center;
    column-gap: 0.6875rem
}

#cabecalho .conteiner .actions-menu .action.search img {
    height: 1.5625rem
}

#cabecalho .conteiner .actions-menu .action.user img {
    height: 2rem
}

#cabecalho .conteiner .actions-menu .action.kart img {
    height: 1.5rem
}

@media(min-width: 64rem) {
    #cabecalho .conteiner {
        padding-left: 5rem;
        padding-right: 5rem;
        justify-content: space-between
    }

    #cabecalho .conteiner .btn-menu {
        display: none
    }

    #cabecalho .conteiner .nav-menu {
        position: relative;
        display: block;
        left: 314px;
        width: auto;
        height: auto
    }

    #cabecalho .conteiner .nav-menu .header-menu {
        display: none
    }

    #cabecalho .conteiner .nav-menu .list-menu {
        display: flex;
        list-style: none;
        display: flex;
        align-items: center;
        column-gap: 1.0625rem
    }

    #cabecalho .conteiner .nav-menu .list-menu .link-menu {
        font-size: 0.875rem;
        line-height: 1rem
    }

    #cabecalho .conteiner .nav-menu .list-menu .link-menu.active {
        font-weight: 700;
        color: #914922;
        text-decoration: underline
    }

    #cabecalho .conteiner .brand-menu {
        position: absolute;
        top: 50%;
        left: 9%;
        transform: translate(-50%, -50%);
        height: 2.375rem
    }

    #cabecalho .conteiner .actions-menu {
        position: relative
    }
}

@media(min-width: 80rem) {
    #cabecalho .conteiner {
        padding-left: 9.375rem;
        padding-right: 9.375rem
    }
}

@keyframes open {
    0% {
        display: block;
        background: none;
        box-shadow: none;
        backdrop-filter: blur(0rem);
        opacity: 0
    }

    100% {
        opacity: 1;
        background: rgba(0, 0, 0, .5);
        box-shadow: 0 0.25rem 1.875rem rgba(0, 0, 0, .1);
        backdrop-filter: blur(0.625rem)
    }
}

@media (max-width: 1450px) {
    #cabecalho .conteiner .nav-menu {
        left: 237px;
    }
    #cabecalho .conteiner .nav-menu .list-menu {
        column-gap: 0.6625rem;
    }
}