@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');

*, span, p, h1, h2, h3, h4, h5, h6, a, li, ul, ol, div{
   font-family: "Ubuntu", sans-serif;
}
:root{
    --cor-01: #FFFF;  /*layout*/
    --cor-02: #23AFA9; /*layout*/
    --cor-03: #75B6B3;
    --cor-04: #ebebeb; /*layout*/
    --cor-05: #d7d7d7;
    --cor-06: #DCD7C9;
    --cor-07: #243D46;
    --cor-08: #F7F5F2;
    --branco: #FFFFFF;
    --preto:  #000000;
    --fonte: #4D4D4D;
    --fonte-2: #7E7E7E;
}
.btn-det-whatsapp{
    position: relative;
    top: 6px;
    padding: 9px 0;
}
.btn-det-whatsapp, .detalhe .conteudo-descricao .container_btn .bt-padrao{
    border-radius: 5px !important;
    webkit-border-radius: 5px !important;
    -moz-border-radius: 5px !important;    
}

.breandcumbs, section.breandcumbs{
    background-color: var(--preto);
}
.breandcumbs table, section.breandcumbs table{
    border-color: var(--preto);
}
.d-car{
    background-image: none;
    font-size: 26px !important;
    color: var(--branco);
    position: relative;
    top: 8px;
}
/*BOTAO*/
.conteudo-cadastro .botao-padrao, .conteudo-contato .conteudo-form .bt-contato, .detalhe .conteudo-descricao .container_btn .bt-padrao, .div-bt .bt, .section-login-header .enviar_senhar, .erro404 .btn-home, section.section-favoritos .btn-orcar, .add-comentario, .produto .botao-car .bt, .btn-solicitar, .btn_mob_filtro_opcoes .bt, .div-botao-finaliza .text-right .botao-padrao{
    background-color: var(--cor-02) !important;
    border: 1px solid var(--cor-02) !important;
    color: var(--branco);
    border-radius: 5px;
}
.btn-solicitar:hover{
    background-color: var(--cor-02) ;
    border: 1px solid var(--cor-02) ;
    color: var(--branco);
    border-radius: 5px;
}
.texto-finalizado .btn-primary{
    background-color: var(--cor-02) !important;
    border: 1px solid var(--cor-02) !important;
    color: var(--branco) !important;
    border-radius: 5px;
}
/*BOTAO*/
/* HEADER*/
.header{
    background-color: var(--cor-01);
}
.divi-menu .show-all .fa{
    color: var(--branco);
}
.logo-header{
    width: 60%;
    top: 11px;
    /* padding-top: 15px; */
    /* padding-bottom: 15px; */
    position: relative;
    margin: 0 auto;
}
.ul-pedido-header{
    width: 30px;
    padding: 0;
    float: right;
}
/* HEADER*/

/* MENU */
.header-menu .menu-prod{
    background-color: var(--cor-07);
    border-top: 2px solid var(--cor-07);
}
.header-menu .menu-prod ul li a{
    color: var(--branco);
}
.header-menu .menu-prod ul li a:hover{
    background-color: var(--cor-03);
    color: var(--branco);
}
.prod_destaques h3{
    border-bottom: 3px solid var(--cor-02);
    padding-bottom: 22px;
    padding-left: 15px;
    font-size: 21px;
    font-weight: 600;
}
.descricao-prod{
    text-align: left !important;
}
.descricao-prod h2{
    border-bottom: none !important;
    text-align: left !important;
    font-weight: 400 !important;
    color: var(--fonte-2) !important; 
    display: inline-block !important;
    margin: 0 !important;
}
.produto .ref{
    color: var(--fonte-2) !important; 
    font-size: 13px;
}
.d-car{
    font-size: 0;
    color: transparent;
    background-image: url(../img/assets/cart_desk.png);
    width: 22px;
    height: 19px;
    position: relative;
    top: 12px;
}
@media(max-width:991px){
    .bt-padrao i{
        margin-top: -34px;
    }
    .d-car{
        background-image: url(../img/assets/cart_mobi.png);
    }
}
/* MENU */

.home_selected, .sobre_selected, .contato_selected, .blog_selected{
    color: var(--cor-02) !important;
}
.topo-header{
    background-color: var(--cor-01);
}
span.span-tel, .topo-header a{
    color: #FFFFFF;
}
.header-menu{
    background-color: var(--cor-02);
}
.header-menu .conteudo-menu div>ul>li{
    width: 17%;
    text-align: center;
}
.header-menu .menu-prod ul li{
    width: 100% !important;
    text-align: left !important;
}
.divi-menu .show-all span, .header-menu .conteudo-menu div>ul>li>a{
    color: var(--branco);
    text-transform: capitalize;
}
.ul-pedido-header span, a, i {
    color: var(--cor-07);
}
.d-busca-header .icon-busca {
    background-color: transparent;
}
.d-busca-header .input_busca_form {
    border: 1px solid var(--cor-07);
    border-radius: 5px;
}
.divi-menu{
    background-color: var(--cor-02);
    /* margin-right: 10px; */
}
.informacaoutil{
    background-color: var(--cor-04);
}
.informacaoutil p img, .informacaoutil p .texto{
    color: var(--branco);
}
.informacaoutil p .btn-download{
    background-color: var(--cor-03);
    border: 1px solid var(--cor-03);
    color: var(--branco);
}
.menu-footer ._title, .div-end .title{
    color: var(--preto);
}
.footer .div-end .sub-title{
    color: var(--preto);
    font-weight: bold;
    font-size: 15px;
}
.footer .div-end .text{
    font-size: 13px;
    color: var(--preto);
    font-weight: 400;
}
.footer .menu-footer-categoria{
    width: 100%;
}
.footer .footer-dados span, a{
    color: var(--fonte);
}
.footer .footer-dados ion-icon{
    color: var(--cor-02);
    font-size: 32px;
    position: relative;
    right: 8px;
}
.footer .logo-footer-mobile{
    width: 70%;
}
.logo-endereco .logo-rodape{
    max-width: 297px;
}
.div_redes .nav-redes a i{
    color: var(--cor-01);
}
.footer{
    border-top: 4px solid var(--cor-02);
    background-color: var(--branco);
    /* padding-bottom: 25px; */
}
.footer .footer-dados i{
    color: var(--cor-02);
    margin-right: 20px;
}
/* .footer .end, .footer .footer-dados span, a{
    color: var(--cor-07) !important;
} */
.footer .redes-sociais ul li{
    display: inline-block;
    width: 40px;
}
.footer .nav-redes a{
    display: inline-block;
    background-color: var(--cor-02);
    width: 40px;
    height: 40px;
    border-radius: 100%;
 }
.footer .nav-redes ion-icon{
    color: var(--branco);
    position: relative;
    font-size: 27px;
    top: 8px;
    left: 7px;
}
.footer .nav-redes .fa-facebook{
    color: var(--branco);
    position: relative;
    font-size: 30px;
    top: 12px;
    left: 11px;
}
.footer .menu_footer{
    background-image: url(../img/logo/logo-background.png);
    background-repeat: no-repeat;
    background-position: center right;
    background-size: contain;
}
.logo-endereco .logo-rodape{
    filter: none;
}
.logo-endereco .div-end .title, .logo-endereco .div-end .tel, .logo-endereco .div-end .end, .menu-footer ._title{
    color: var(--cor-03);
}
.menu-footer ul li a{
    font-weight: 400 !important;
    font-size: 14px !important;
    color: var(--fonte) !important;
}
.sub-footer{
    background-color: var(--cor-07);
}
.footer .redes-sociais span{
    font-weight: 400;
    font-size: 14px;
}
.footer .selossl-footer img{
    display: inline-block;
}
.redes-sociais-flutuantes{
    background-color: var(--cor-01);
}
.produto{
    border: 3px solid transparent;
}
.produto:hover{
    border: 3px solid var(--cor-03);
}
.section-login-header .login_button{
    background-color: var(--cor-01);
    border: 1px solid var(--cor-01);
}
.destaque-header{
    background-color: var(--cor-01) !important;
}
.prod_destaques{
    background-color: var(--branco);
}
.destaque-header{
    background-color: var(--cor-01) !important;
}
.destaque-header nav a img{
    filter: none !important;
}
.destaque-header .link-cat-destaque span{
    color: var(--branco) !important;
}
.section-cat-destaque-footer{
    background-color: var(--cor-04);
}
.section-cat-destaque-footer nav a img{
    filter: invert();
}
.section-cat-destaque-footer .link-cat-destaque span{
    color: var(--preto);
}
.conteudo-top-mobile, .conteudo-mobile{
    background-color: var(--cor-01);
    border-top: 1px solid var(--cor-01);
    padding: 10px 0;
}
.header-menu .d-minha-conta-mobile{
    background-color: var(--cor-07);
    border-top: 1px solid var(--cor-07);
}
.span-car{
    background-color: var(--cor-07) !important  ;
    top: 6px !important;
}
.span-car table tr td{
    color: var(--branco);
}
.container_produtos_exclusivos .swiper-button-prev .prev{
    background-image: url(../img/assets/_prev.png);
}
.container_produtos_exclusivos .swiper-button-next .next{
    background-image: url(../img/assets/_next.png);
}

/*CADASTRO*/
.conteudo-cadastro{
    background-color: var(--branco);
}
.conteudo-cadastro .div-cadastro{
    background-color: var(--branco);
}
/*CADASTRO*/

/*LOGIN*/
.conteudo-login{
    background-color: var(--banco);
}
.conteudo-login .d-login{
    background-color: var(--branco);
}
/*LOGIN*/

/* CARRINHO */
.titulo-listagem ul li{
    font-weight: 600;
    color: #000;
}
.titulo-listagem, .produto-carrinho{
    border-bottom: 3px solid var(--cor-04);
}
.produto-carrinho .fa-trash{
    color: red;
    font-size: 32px;
}
.car-inputs{
    border-radius: 0;
}
/* CARRINHO */
.categoria-destaquecategoria .caixa-texto{
    background-color: var(--cor-01);
}
.categoria-destaquecategoria .caixa-texto h3{
    color: var(--branco);
}
.conteudo-contato .fa{
    color: var(--fonte);
}
/* ERRO 404 */
.erro404{
    background-color: var(--cor-07); 
}
.erro404 h1 span, .erro404 h1{
    color: var(--branco);
}
.erro404 .title, .erro404 .subtitle{
    color: var(--branco);
}
.d-busca-header .icon-busca .icone-from-busca{
    filter: invert(100%);
}

/* DETALHE */
.detalhe .conteudo-descricao span.especificacoes.valor, .detalhe .conteudo-descricao .container-cor small, .d-valores small{
    color: var(--fonte-2);
    font-weight: 400;
    font-family: "Ubuntu", sans-serif;
    font-size: 20px;
}
.relacionados .conteudo-produtos-relacionados{
    border-color: transparent;
}
.relacionados .title span {
    color: var(--fonte);
    font-size: 25px;
    font-weight: 600;
    display: inline-block;
    padding-bottom: 10px;
}
/* DETALHE */

/* LISTAGEM */
.container-filtro .sub-categoria .ul-categoria li:hover, .container-filtro .d-cor .ul-cor li:hover{
    background-color: var(--cor-01);
}
.container-filtro .ordem .select-ordem{
    border-color: var(--cor-01);
}
.btn-filtro-mobile span.yellow-bg, .btn-ativar-filtro{
    background-color: var(--cor-01) !important;
    border: 1px solid var(--cor-01) !important;
    color: var(--branco) !important;
}
/* LISTAGEM */
.relacionados .title{
    border-bottom: 3px solid var(--cor-02);
}
.input_busca_form input[type="text"]{
    border: 2px solid var(--cor-07) !important;
}
.conteudo-mobile .fa-bars{
    color: var(--cor-07);
    top: 10px;
}
.conteudo-top-mobile img{
    width: 179px;
}
.d-dados-header i.fa{
    font-size: 20px
}
.sub-menu-listagem h1{
    display: inline-block;
    width: 100%;
    padding-left: 10px;
    padding-bottom: 15px;
    border-bottom: 4px solid var(--cor-02);
}
.sub-menu-listagem h1 a{
    text-transform: uppercase;
}
.sub-menu-listagem .lista-sub ul{
    padding-left: 0;
}
._nav._button-prev, ._nav._button-next{
    border: 1px solid #4c4c4c; 
}
.swiper-container ion-icon{
    color: #4c4c4c !important;
}
.detalhe .conteudo-descricao .desc-prod span, .detalhe .conteudo-descricao .nome-ref-prod .sku{
    font-size:20px;
}
 .detalhe .conteudo-descricao .qtd-minima span, .detalhe .conteudo-descricao .qtd-minima span, .detalhe .conteudo-descricao .nome-ref-prod .nome{
    color: var(--fonte);
}
.detalhe .conteudo-descricao .nome-ref-prod .sku, .detalhe .conteudo-descricao .desc-prod span{
    color: var(--fonte-2)
}
.detalhe .conteudo-descricao .nome-ref-prod .nome{
    margin-bottom: 10px;
}
.detalhe .conteudo-descricao span.especificacoes{
    color: var(--fonte-2);
    font-family: "Ubuntu", sans-serif;
    font-weight: 400;
    font-size: 20px;
}
.detalhe .conteudo-descricao .form-pedido .select_det{
    width: 274px;
}
.detalhe .conteudo-descricao .container_btn .bt-padrao{
    max-width: 137px;
    font-family: "Ubuntu", sans-serif;
    font-size: 20px;
}
.btn-det-whatsapp span{
    font-size: 20px;
    font-weight: 600;
}
.detalhe .conteudo-descricao .qtd{
    margin-right: 90px;
}
.btn-det-whatsapp .fa-whatsapp{
    font-size: 26px;
}
.compartilhar-span{
    font-size: 17px;
    font-weight: 600;
    color: var(--fonte);
    display: inline-block;
    margin-bottom: 10px;
}
.d-compartilhar .li-facebook {
    width: 40px;
    height: 40px;
    display: inline-block;
    background-color: var(--fonte);
    border-radius: 100%;
    text-align: center;
}
.d-compartilhar .li-facebook i{
    color: var(--branco) !important;
    position: relative;
    font-size: 27px !important;
    top: 8px;
}
.d-compartilhar i.fa-whatsapp{
    font-size: 41px !important;
    color: var(--fonte) !important;
    position: relative;
    top: 6px;
}
.breandcumbs-erro{
    display: none;
    visibility: hidden;
}
.div-dados-contato span, a, i, ion-icon{
    color: var(--fonte) ;
}
.div-dados-contato table tr td{
    padding-bottom: 7px;
}
.conteudo-contato .cont-contato {
    text-align: left;
    padding-left: 32px;
}
.conteudo-contato  h2{
    border-bottom: 2px solid var(--cor-02);
    display: inline-block;
    padding-bottom: 10px;
    width: 100%;
}
@media(max-width:991px){
    .detalhe .conteudo-descricao .container_btn .bt-padrao{
        max-width: 100%;
    }
    .header-menu .d-logo-mobile img{
        width: 179px;
    }
    .header-menu .conteudo-menu div>ul>li{
        background-color: var(--cor-07);
    }
    .header-menu .conteudo-menu div>ul>li>a{
        color: var(--branco) !important;
        background-color: var(--cor-07) !important;
    }
    .header-menu .conteudo-menu ul {
        background: var(--cor-01);
    }
    .header-menu .conteudo-menu ul li{
        border-bottom: 1px solid var(--branco);
    }
    .header-menu .conteudo-menu ul>li>a, .link_com_filho .fa-categoria, .header-menu .conteudo-menu ul>li>a b{
        color: var(--branco);
    }
    .header-menu .menu-prod ul li a:hover,  .header-menu .menu-prod ul li a, .header-menu .menu-prod .sub-menu .menu-sub li a span{
        background-color: var(--cor-07);
        color: var(--branco);
    }
    .logo-endereco .div-end .title, .logo-endereco .div-end .tel, .logo-endereco .div-end .end, .d-buscar-mobile .fa-search, .d-buscar-mobile .input_busca_form::placeholder{
        color: var(--cor-03);
    }
    .d-buscar-mobile{
        background-color: var(--branco);
    }
    .d-buscar-mobile .input_busca_form{
        margin-top: 10px;
    }
    .mprod {
        background-color: var(--branco);
        border-radius: 0;
        border: 4px solid var(--cor-04);
    }
    .categoria-destaquecategoria{
        padding: 0;
    }
    .informacaoutil .container{
        padding-left: 0;
        padding-right: 0;
    }
    .span-car{
        background-color: var(--cor-04);
    }
    .span-car table tr td{
        color: var(--cor-03);
    }
    .d-logo-mobile{
        padding: 10px 0;
    }
    .categoria-destaquecategoria table td.td-left {
        border-top: 4px solid var(--cor-07);
        border-left: 4px solid var(--cor-07);
        border-bottom: 4px solid var(--cor-07);
    }
    .categoria-destaquecategoria table td.td-right {
        border-top: 4px solid var(--cor-07);
        border-right: 4px solid var(--cor-07);
        border-bottom: 4px solid var(--cor-07);
    }
    .logo-endereco{
        width: 100%;
    }
    .footer{
        padding: 0;
    }
    .footer .div-end{
        text-align: center;
    }
    .footer .logo-rodape{
        margin-bottom: 20px;
    }
    .footer .footer-dados{
        margin-top: 29px;
        padding: 0;
    }
    .footer .footer-dados i{
        margin-right: 5px;
    }
    .footer .footer-dados i.fa-whatsapp{
        margin-right: 14px;
    }
    
    .header-menu .conteudo-menu div>ul>li {
        width: 100%;
        text-align: left;
    }
    .d-car{
        background-image: url(../img/assets/cart_mobi.png);
        color: transparent;
        font-size: 0;
        width: 30px;
        height: 26px;
        top: 16px;
    }
   .d-bottao-detalhe .d-car{
        background-image: url(../img/assets/cart_desk.png);
        color: transparent;
        font-size: 0;
        width: 22px;
        height: 19px;
        top: 14px;
    }
    .divi-menu{
        margin-right: 0 !important;
    }
    .d-buscar-mobile .input_busca_form{
        color: var(--preto);
    }
    .div_redes .nav-redes{
        margin: 0 auto;
    }
    .header-menu{
        background-color: var(--branco);
    }
    .detalhe .conteudo-descricao .container_btn .bt-padrao{
        max-width: 100%;
    }
    .detalhe .conteudo-descricao .qtd{
        margin-right: 0;
    }
}
