﻿.cabecalhoB2C-lateral {
}

.cabecalhoB2C-lateral .header-toolbar .container,
.cabecalhoB2C-lateral .header .inner .container,
.cabecalhoB2C-lateral .header .inner .menu-institucional .container {
    width: 100% !important;
    padding: 0 30px 0 30px;
}

.cabecalho-sombra {
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.17) !important;
}

.cabecalhoB2C-lateral .header .menu-institucional .menu-organizacao {
    width: 100%;
    height: 44px;
}

.cabecalhoB2C-lateral .header .menu-institucional .menu-organizacao .slick-list {
    margin: 0 30px 0 30px;
    padding: 10px 0 0 0;
}

.cabecalhoB2C-lateral .header .menu-institucional .menu-organizacao .slick-list .slick-slide {
    margin-right: 15px;
    padding: 0 3px 0 3px;
}

.cabecalhoB2C-lateral .header .menu-institucional .menu-organizacao .slick-list .slick-slide a {
    font-size: 14px;
    margin-left: 10px;
    text-transform: uppercase;
}

.cabecalhoB2C-lateral .header .menu-institucional .menu-organizacao .slick-list .slick-slide:hover {
    font-weight: bold;
}

.cabecalhoB2C-lateral .header .menu-institucional .menu-organizacao .slick-list .slick-slide i.fa {
    font-size: 8px;
    position: absolute;
    top: 9px;
}

.cabecalhoB2C-lateral .slick-prev,
.cabecalhoB2C-lateral .slick-next {
    top: 50%;
}

.cabecalhoB2C-lateral .slick-prev::before,
.cabecalhoB2C-lateral .slick-next::before {
    font-size: 15px !important;
}

.cabecalhoB2C-lateral .header .logo {
    margin-top: 2px;
    width: 200px;
    height: 80px;
}

.cabecalhoB2C-lateral .header .search i {
    font-size: 1.2em !important;
}

.cabecalhoB2C-lateral .header .navigation {
    text-align: center !important;
    width: auto !important;
}

.cabecalhoB2C-lateral .header .navigation .menu ul.submenu {
    top: inherit;
}

.cabecalhoB2C-lateral .header-toolbar {
    display: block;
    padding-right: 0;
    height: 32px;
    padding: 0;
}

.cabecalhoB2C-lateral .header-toolbar .tools {
    top: 2px;
    right: 30px;
}

.cabecalhoB2C-lateral .header-toolbar .container .tools a {
    margin-left: 2px;
    font-size: 12px;
}

.cabecalhoB2C-lateral .header-toolbar .container .tools a.recuo {
    margin-left: 10px;
}

.cabecalhoB2C-lateral .header-toolbar .container .tools a.espaco {
    margin-right: 0;
}

.cabecalhoB2C-lateral .sticky-wrapper {
    height: 130px;
}

.cabecalhoB2C-lateral .header .inner {
    height: 86px;
    border: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.cabecalhoB2C-lateral header .container-menu {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.cabecalhoB2C-lateral header .container-menu .menu-sanduiche {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    margin-right: 20px;
    font-size: 1.75em;
}

.cabecalhoB2C-lateral header .container-menu .logotipo {
    width: 41%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.cabecalhoB2C-lateral header .container-menu .logotipo img {
    width: 90%;
    margin-top: 5px;
}

.cabecalhoB2C-lateral header .container-menu .busca {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.cabecalhoB2C-lateral header .container-menu .busca #containerInputBusca {
    display: inline-flex;
    width: 100%;
}

.cabecalhoB2C-lateral header .container-menu .busca form {
    width: 100%;
}

.cabecalhoB2C-lateral header .container-menu .busca #containerInputBusca input {
    display: inline !important;
    font-size: small;
    width: 100%;
    height: 40px;
    -webkit-border-top-left-radius: 50px;
    -webkit-border-bottom-left-radius: 50px;
    -moz-border-radius-topleft: 50px;
    -moz-border-radius-bottomleft: 50px;
    border-top-left-radius: 50px;
    border-bottom-left-radius: 50px;
    border: 1px solid #CCC;
    border-right: 0;
    padding: 10px;
    color: #777;
}

.cabecalhoB2C-lateral header .container-menu .busca #containerInputBusca button {
    color: #3f8654;
    border: 1px solid #CCC;
    border-left: 0;
    background-color: #fff;
    height: 40px;
    width: 40px;
    -webkit-border-top-right-radius: 50px;
    -webkit-border-bottom-right-radius: 50px;
    -moz-border-radius-topright: 50px;
    -moz-border-radius-bottomright: 50px;
    border-top-right-radius: 50px;
    border-bottom-right-radius: 50px;
}

.cabecalhoB2C-lateral header .container-menu .opcoes {
    width: 70%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.cabecalhoB2C-lateral header .container-menu .opcoes .sobre-usuario {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30%;
}

.cabecalhoB2C-lateral header .container-menu .opcoes .sobre-usuario-rodape {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30%;
}

.cabecalhoB2C-lateral header .container-menu .opcoes .sobre-usuario a.word {
    font-size: 12px;
}

.cabecalhoB2C-lateral header .container-menu .opcoes .sobre-usuario a:hover.word {
    text-decoration: underline !important;
}

.cabecalhoB2C-lateral header .container-menu .opcoes .sobre-usuario span {
    font-size: small;
}

.cabecalhoB2C-lateral header .container-menu .opcoes .sobre-usuario .quebrar {
    display: flex;
    justify-content: flex-start;
    align-content: center;
    flex-direction: column;
    line-height: 18px;
    margin-left: 5px;
}

.cabecalhoB2C-lateral header .menu-institucional {
    height: 44px;
    border-bottom: none;
    display: none;
}

.cabecalhoB2C-lateral header .menu-institucional .navigation {
    /* float: right !important; */
    text-align: center;
    height: 44px;
    width: auto;
}

.cabecalhoB2C-lateral header .menu-institucional .navigation .menu {
    height: 100%;
}

.cabecalhoB2C-lateral header .menu-institucional .navigation .menu ul {
    margin: 0;
    line-height: inherit;
}

.cabecalhoB2C-lateral header .menu-institucional .navigation .menu ul li a {
    padding: 10px;
}

.cabecalhoB2C-lateral .opcoes .carrinho {
    position: relative;
}

.cabecalhoB2C-lateral .opcoes .carrinho span.badge.resumoQuantidade {
    padding: 5px;
    font-size: 25%;
    position: absolute;
    display: inline-block;
    top: -10px;
    right: -10px;
    font-family: Lato;
}

.cabecalhoB2C-lateral .opcoes .carrinho .resumo {
    display: none;
    position: absolute;
    border: 2px solid #ccc;
    width: 300px;
    height: auto;
    padding: 5px;
    background-color: #fff;
    right: 0;
    border-radius: 3px;
}

.cabecalhoB2C-lateral .opcoes .carrinho .resumo.active {
    display: inline;
}

.cabecalhoB2C-lateral .opcoes .carrinho .resumo h3 {
    font-size: 75%;
    color: #333;
    margin-bottom: 5px;
    font-weight: bold;
}

.cabecalhoB2C-lateral .opcoes .carrinho .resumo .lista {
    width: 100%;
    display: inline-block;
    height: auto;
    max-height: 300px;
    overflow-y: auto;
    padding: 5px;
}

.cabecalhoB2C-lateral .opcoes .carrinho .resumo .lista .vazia {
    width: 100%;
    display: inline-block;
    padding: 5px;
    text-align: center;
    color: #ccc;
}

.cabecalhoB2C-lateral .opcoes .carrinho .resumo .item {
    border-bottom: 1px dashed #f0f0f0;
    margin-bottom: 10px;
    padding-bottom: 5px;
    width: 100%;
    display: inline-block;
    font-size: 90%;
    color: #777;
}

.cabecalhoB2C-lateral .opcoes .carrinho .resumo .item span.nome {
    display: inline-block;
    width: 100%;
    padding-bottom: 3px;
    color: #555;
}

.cabecalhoB2C-lateral .opcoes .carrinho .resumo .item span.quantidade {
    float: left;
}

.cabecalhoB2C-lateral .opcoes .carrinho .resumo .item span.preco {
    float: right;
}

.cabecalhoB2C-lateral .opcoes .carrinho .resumo .total {
    width: 100%;
    color: #333;
    font-weight: bold;
    display: inline-block;
}

.cabecalhoB2C-lateral .opcoes .carrinho .resumo .total .quantidade {
    font-size: 90%;
    float: left;
}

.cabecalhoB2C-lateral .opcoes .carrinho .resumo .total .valor {
    font-size: 100%;
    float: right;
}

.cabecalhoB2C-lateral .opcoes .carrinho .resumo .nav-topo {
    width: 100%;
    display: inline-block;
    margin-bottom: 5px;
    text-align: right;
}

.cabecalhoB2C-lateral .opcoes .carrinho .resumo .nav {
    width: 100%;
    display: inline-block;
    margin-top: 20px;
}

.cabecalhoB2C-lateral .opcoes .carrinho .resumo .nav a.btn {
    color: #fff !important;
}

.cabecalhoB2C-lateral header .container-menu .agruparBuscaCarrinho {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}


@media only screen and (max-width: 480px) {
    .cabecalhoB2C-lateral header .container-menu {
        width: 100%;
        display: inline-block;
    }

    .cabecalhoB2C-lateral .header .inner {
        height: 100%;
    }

    .cabecalhoB2C-lateral .header .inner .container {
        padding: 0 10px 0 10px;
    }

    .cabecalhoB2C-lateral header .container-menu .logotipo {
        width: 100%;
        margin-left: 10px;
    }

    .cabecalhoB2C-lateral .header .logo {
        max-width: 150px;
        width: auto;
        height: auto;
    }

    .cabecalhoB2C-lateral .header-toolbar,
    .cabecalhoB2C-lateral header .menu-institucional,
    .cabecalhoB2C-lateral header .container-menu .menu-sanduiche,
    .cabecalhoB2C-lateral header .container-menu .opcoes .sobre-usuario-rodape,
    .cabecalhoB2C-lateral header .container-menu .opcoes .sobre-usuario .quebrar {
        display: none;
    }

    .cabecalhoB2C-lateral .sticky-wrapper {
        height: 120px !important;
    }

    ol.breadcrumb {
        font-size: 90%;
    }

    ol.breadcrumb li.active {
        display: none;
    }

    #sidebar {
        display: none;
    }

    .page-heading h1.title {
        font-size: 22px;
    }

    .cabecalhoB2C-lateral header .container-menu .opcoes {
        width: 30%;
        font-size: 12px;
        justify-content: flex-start;
    }

    .cabecalhoB2C-lateral header .container-menu .opcoes .sobre-usuario {
        width: 45%;
    }

    .cabecalhoB2C-lateral header .menu-institucional {
        display: none !important;
    }

    .cabecalhoB2C-lateral header .container-menu .agruparBuscaCarrinho {
        margin: 10px 0;
    }
}

@media only screen and (max-width: 800px) {

    .cabecalhoB2C-lateral header .container-menu {
        width: 100%;
        display: inline-block;
    }

    .cabecalhoB2C-lateral .header .inner {
        height: 100%;
    }

    .cabecalhoB2C-lateral .header .inner .container {
        padding: 0 10px 0 10px;
    }

    .cabecalhoB2C-lateral header .container-menu .logotipo {
        width: 100%;
        margin-left: 10px;
    }

    .cabecalhoB2C-lateral .header .logo {
        max-width: 150px;
        width: auto;
        height: auto;
    }

    .cabecalhoB2C-lateral .sticky-wrapper {
        height: 120px !important;
    }

    .cabecalhoB2C-lateral .header-toolbar,
    .cabecalhoB2C-lateral header .menu-institucional,
    .cabecalhoB2C-lateral header .container-menu .menu-sanduiche,
    .cabecalhoB2C-lateral header .container-menu .opcoes .sobre-usuario-rodape,
    .cabecalhoB2C-lateral header .container-menu .opcoes .sobre-usuario .quebrar {
        display: none;
    }

    .cabecalhoB2C-lateral header .container-menu .logotipo {
        width: 90%;
        margin-left: 35px;
        justify-content: flex-end;
    }

    #sidebar {
        display: none;
    }

    .cabecalhoB2C-lateral header .container-menu .opcoes {
        width: 30%;
        font-size: 12px;
        justify-content: flex-start;
    }

    .cabecalhoB2C-lateral header .container-menu .opcoes .sobre-usuario {
        width: 45%;
    }

    .cabecalhoB2C-lateral header .menu-institucional {
        display: none !important;
    }

    .cabecalhoB2C-lateral header .container-menu .agruparBuscaCarrinho {
        margin: 10px 0;
    }
}

@media only screen and (max-width: 1024px) {

    .cabecalhoB2C-lateral .header-toolbar,
    .cabecalhoB2C-lateral header .menu-institucional,
    .cabecalhoB2C-lateral header .container-menu .menu-sanduiche,
    .cabecalhoB2C-lateral header .container-menu .opcoes .sobre-usuario-rodape,
    .cabecalhoB2C-lateral header .container-menu .opcoes .sobre-usuario .quebrar {
        display: none;
    }
    
    .cabecalhoB2C-lateral header .container-menu .logotipo {
        width: 100%;
        justify-content: center;
    }

    .busca-marcas .alfabeto ul li {
        margin-bottom: 8px;
    }

    .cabecalhoB2C-lateral header .container-menu .opcoes {
        width: 30%;
        font-size: 12px;
        justify-content: flex-start;
    }

    .cabecalhoB2C-lateral header .container-menu .opcoes .sobre-usuario {
        width: 45%;
    }

    .cabecalhoB2C-lateral header .menu-institucional {
        display: none !important;
    }

    .cabecalhoB2C-lateral header .container-menu .agruparBuscaCarrinho {
        margin: 10px 0;
    }

}
