/* Estilos gerais realacionado a parte Mobile do Site */

@font-face {
    font-family: 'Trajan Pro';
    src: url('trajan-pro.otf');
}

@font-face {
    font-family: 'Roboto';
    src: url('Roboto-Regular.ttf');
}

*{
    font-family: 'Roboto';    
}

.cidades-atendidas p{
    margin-bottom: 0px;
}
.cidades-atendidas{
    margin-bottom: 20px;
}

.ripple {
    background-position: center;
    transition: background 0.8s;
}
.ripple:hover {
    background: #664406 radial-gradient(circle, transparent 1%, #664406 1%) center/15000%;
}
.ripple:active {
    background-color: #664406;
    background-size: 100%;
    transition: background 0s;
}

body {
    background-color: black;
    color: #FFF;
}

.btn-form-cidade-nao-atendida{
    font-size:13px;
}

/* estilos Menu Mobile */
@media (max-width: 500px) {
    .bg-gray {
        background: #191919;
    }
}

.text-yellow {
    color: #CC9B0B;
}

.text-gray {
    color: #CCCCCC;
}

.is-size-1 {
    font-size: 4rem;
}

.is-size-2 {
    font-size: 3rem;
}

.is-size-3 {
    font-size: 2rem;
}

.is-size-4 {
    font-size: 1.25rem;
}

.is-size-5 {
    font-size: 1rem;
}

.navbar{
    background-color: #000;
    top: 0;
    width: 100%;
    z-index: 9999;
}

.sticky {
    position: fixed;
    top: 0;
    width: 100%;
}

.sticky + .content {
    padding-top: 60px;
}

.navbar ul {
    list-style-type: none;
    margin: 0;
    padding: 0px 10px;
    overflow: hidden;
}

.nav-item {
    float: left;
}

.item-left a {
    display: block;
    padding: 12px 12px;
}

.item-right{
    float: right;
}

.item-right a{
    display: block;
    color: white;
    text-align: center;
    text-decoration: none;
}

.nav-item-texto{
    display: block;
    padding: 12px 12px;
    margin-top: 0.2em;
}

.nav-active {
    color:#CC9B0B !important;
    font-weight: bolder;
}

@media only screen and (min-width: 650px) {
    .btn-nav-mobile{
        display: none;
    }
    .form-login{
        padding: 0% 35% !important;
    }
    .carregaConteudo{
        padding: 0% 30% !important;
    }

    .secao-programa-gratidao{
        padding: 0px !important;
        background-repeat:no-repeat;
        background-size: 100% 100%;
    }

    .mobile{
        display: none;
    }
    .input-estilo{
        margin-bottom: 0px !important;
    }
    .secao-form-novidades{
        padding: 5em !important;
    }

    .rodape-mais-info {
        padding-left: 2em !important;
        padding-right: 2em !important;
    }

    .nav-margin{
        margin-top:4%;
    }

    .nav-margin-carrinho{
        margin-top:5% !important;   
    }

    .div-texto-institucional-inicial{
        padding: 2em 20%;
        text-align: center !important;
    }

    .banner-sobre{
        width: 100% !important;
    }
    .secao-carrinho{
        margin:auto 30%;
    }
    .margin-desktop{
        margin-top: 1em;
    }
    .texto-footer{
        float: right;
        margin-top: 5px;
    }
}

@media only screen and (max-width: 600px) {
    .nav-desktop, .div-ordenar{
        display: none;
    }
    .desktop{
        display: none !important;
    }

    .div-btns-club {
        text-align: center;
    }

    .secao-institucional{
        background-image: none !important;
        background-color: #0000;
    }
    .fundo-escricao-instituicional{
        padding: 20px !important;
    }

    .div-inputs{
        text-align: center;
    }

    .secao-form-novidades{
        padding: 2em !important;
    }

    .nav-margin{
        margin-top:14%;
    }

    .nav-margin-carrinho{
        margin-top:13%;   
    }

}


.nav-item-texto a{
    color: rgb(187, 187, 187);
}

.menu-item{
    margin-top:13px;
    padding-top: 1px;
    width:35px;
    height:32px;
}

  /* estilos Parte Incial do site */

.div-titulo{
    padding: 20px;
    text-align: center;
}

.titulo-inicial{
    font-family: 'Trajan Pro';
    font-style: normal;
    font-weight: bold;
    font-size: 35.8px;
    line-height: 109%;
    color: #CC9B0B;
}

.sub-titulo{
    color: rgb(187, 187, 187);
    font-size: 13px;
}

.div-pos-carousel{
padding: 20px;
    text-align: center;
}

.btn-login-inicial{
    background-color:#CC9B0B;
    color: black !important;
    padding: 5px 30px;
    border-radius: 18px;
    cursor: pointer;
}

.btn-login-inicial:hover{
    background-color:#865a08;
}

.titulo-produtos{
    font-size: 25px;
    font-family: 'Trajan Pro';
    color:#CC9B0B;
    font-weight: bolder;
}

/* Secao Produtos  */

.secao-produtos{
    padding: 20px;
}

.proviewcard .card-body{
    padding: 0;
}
.cardlist{
    border-bottom: 1px solid #f0f0f0;
}
.cardlist:last-child{
    border: 0;
}
.qty .input-group{
    width: 100%;
    height: 25px;
}
.btn-qty{
    height: 25px;
    color: #fff !important;
    background-color: #555 !important; 
    border-color: #555 !important;
    padding: 0px 3px !important;
}
.qty input{
    height: 25px;
}
.addcardrmv{
    font-size: 14px;
    line-height: 1.8;
    text-transform: uppercase;
    color: #212529;
}
.addcardrmv:hover{
    color: #c16302;
    text-decoration: none;
    font-weight: 600;
}
.prostatus .del-time {
    font-size: 12px;
    color: #757575;
    margin-right: 10px;
}
.prostatus .del-time > span {
    font-weight: 600;
    color: #555;
}
.proviewcard .card-footer{
    text-align: center;
    box-shadow: rgba(0, 0, 0, 0.1) 0px -2px 10px 0px;
    padding: 8px 15px;
}
.btn-add-con{
    background-color: #fff;
    color: #212121;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 2px 0px;
    font-size: 16px;
    font-weight: 500;
    padding: 8px 20px;
    border-radius: 2px;
    border-width: 1px;
    border-style: solid;
    border-color: #E0E0E0;
    border-image: initial;
    min-width: 185px;
}
.card .card-footer{
    background-color: #fff;
}

.div-titulo-prod{
    border-bottom: 1px #fff solid;
}

.titulo-prod{
    font-size: 18px;
    font-weight: bolder;
}
.sub-titulo-prod{
    font-size: 12px;
    margin-bottom: 0px;
}

.lista-prod{
    margin-left: 5%;
    color: #CC9B0B;
    width: 100%;
}


.lista-prod-2{
    margin-left: 6%;
    width: 100%;
}

.info-prod{
    border-bottom: 1px #fff solid;
}

.titulo-lista-prod{
    font-size:12px;
    font-weight: bolder;
}

.titulo-lista-prod-sem-club{
    font-size:12px;
}

.valor-lista-prod{
    font-size:12px;
}

.frete-lista-prod{
    font-size:12px;
}

.conteudo-prod{
    background-color: #333333;
    padding: 15px 0px;
    margin-top: 15px;
}

.mostrar-mais{
    position: relative;
    background-color: #333333; 
    border-radius: 100%;
    width: 38px;
    padding: 5px;
    cursor: pointer;
}

.subtitulo-desc{
    font-size: 10px;
    margin-bottom: 0px;
}
.composicao-desc, .especificacao-desc{
    font-size: 12px;
}

.texto-desc{
    font-size: 13px;
}

.rotated{
    transform: rotate(180deg); 
}

/* Estilo Vangens do clube Panere  */

.secao-club-panere{
    padding: 20px;
}


.para-sobre-club{
    text-align: justify;
}

.para-vantagens{
    font-weight: bolder;
}

.lista-vantagens {
    list-style: none;
  padding: 0;
  margin: 0;
}
.vantagen{
    padding-left: 1em; 
  text-indent: -.7em;
}
.vantagen::before{
    content: "• ";
    color: #CC9B0B;
    font-size: 20px;
}

.div-pos-sobre-club{
    padding: 10px;
    text-align: center;
}

.btn-club{
    background-color:#CC9B0B;
    color: black !important;
    padding: 5px 20px;
    border-radius: 18px;
    cursor: pointer;
}

.btn-outline{
    background-color:transparent;
    border: 2px solid #CC9B0B;
    color: #CC9B0B !important;
    padding: 5px 30px;
    border-radius: 18px;
    cursor: pointer;
}

.btn-comum{
    background-color:transparent;
    background-color:#CC9B0B;
    color: black !important;
    padding: 6px 30px;
    border-radius: 18px;
    cursor: pointer;
    font-size: 1rem;
}
.div-btn{
    margin-top:20px;
}

.btn-adc-dmn{
    color: #CC9B0B !important;
}

.btn-adc-dmn:active{
    color: #865a08 !important;
    transform: scale(1.5);
}

.btn-club:hover{
    background-color:#865a08;
}



/* Estilos Programa Gratidão */
.secao-programa-gratidao{
    padding: 20px;
    background-repeat:no-repeat;
    background-size: 100% 100%;
}

.titulo-gratidão{
    font-family: 'Trajan Pro';
    font-style: normal;
    font-weight: bold;
    font-size: 24px;
    line-height: 109%;
    color: #997408;
}

.para-sobre-gratidao{
    text-align: justify;
    color: #535252;
    font-size: 16px;
    line-height: 20px;
    /* or 125% */
    letter-spacing: 0.0015em;
    font-weight: 580;
}

.btn-gratidao{
    color:#000 !important;
}

/*  Formulario Novidades */

.titulo-novidades{
    color:#CC9B0B;
    font-size: 20px;
}

.div-inputs{
    padding: 0px 10%;
}

/* select {
    appearance: none;
    background-color: transparent;
    border: none;
    padding: 0 1em 0 0;
    margin: 0;
    width: 100%;
    font-family: inherit;
    font-size: inherit;
    cursor: inherit;
    line-height: inherit;
    color: #CC9B0B;
    background: url(http://cdn1.iconfinder.com/data/icons/cc_mono_icon_set/blacks/16x16/br_down.png) no-repeat right ;
    filter: invert(52%) sepia(75%) saturate(450%) hue-rotate(7deg) brightness(99%) contrast(111%);
    -webkit-appearance: none;
    background-position-x: 100%;
} */

select::-ms-expand {
    display: none;
}

.select-estilo {
    background-color: transparent;
    color: #CC9B0B;
    width:100%;
    padding: 12px;
    margin-bottom: 25px;
    border: solid #fff 1px;
    border-radius: 4px;
}

.select-estilo:focus {
    border-color: #CC9B0B;
    color: #b1770b;
    background-color: transparent;
}

select option{
    position: absolute;
    color: rgb(143, 143, 143);
    background-color: #ffffff;
    border-bottom: 2px solid var(--yellow);
    top: 100%;
    left: 0;
    right: 0;
    z-index: 99;
}


.input-estilo{
    background-color: transparent;
    color: #CC9B0B;
    width:100%;
    padding: 12px;
    margin-bottom: 25px;
}

.input-estilo:focus {
    border-color: #CC9B0B;
    color: #b1770b;
    background-color: transparent;
}


::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #CC9B0B !important;
    opacity: 1 !important; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #CC9B0B !important;
}
  
::-ms-input-placeholder { /* Microsoft Edge */
    color: #CC9B0B !important;
}
  /* Estilo rodape */

.topo-rodape{
        background-color: #FFC20F;  
} 
.rodape-sociais{
    display: flex;
    list-style-type: none;
    margin: 0;
    padding: 5px;
    overflow: hidden;
}

.rodape-sociais li{
      color: rgba(000,000,000, 0.7);
      padding:10px;
      font-size: 20px;
  }

.rodape-sociais li i{
    cursor: pointer;
}

.corpo-rodape{
    padding: 10px;
    background-color:#CD9A09;
    color: rgba(000,000,000, 0.8);
    font-weight: bolder;

}

.rodape-seguranca{
    display: flex;
    list-style-type: none;
    margin: 0;
    padding: 5px;
    overflow: hidden;
}

.rodape-seguranca li{
      color: rgba(000,000,000, 0.8);
      padding:10px;
}

.titulo-seguranca{
    padding: 6px;
}

.lista-mais-info{
    list-style-type: none;
    margin: 0;
    padding: 0px 10px;
    overflow: hidden;
}

.mais-info-item{
    border-bottom: black solid 1px !important;
    padding: 5px;
}

.item-info{
    position: relative;
    border-width:2px;
    left:0px;
    padding: 5px;
}

.item-info a{
    font-size:14px;
}

.item-info i{
    cursor: pointer;
    padding:5px;
}

.info-left{
    float: left;
}

.info-right{
    float: right;
}


.texto-item-info{
    margin-top: 1em; 
    margin-left: 1em; 
    font-family: Roboto;
    font-style: normal;
    font-weight: normal;
    font-size: 15px;

}
/* MODAL */

.modal {
    text-align: center;
    padding: 0!important;
}
  
.modal-centraliza:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -4px; /* Adjusts for spacing */
}
  
.modal-dialog {
    display: inline-block;
    text-align: left;
    vertical-align: middle;
}

.modal-dialog-prod {
    vertical-align: top !important;
    width: 95% !important;
    margin-top: 10px !important;
}

.modal-content-carrinho{
    border-radius: 10px !important;
}

.modal-content{
    background-color: #333333 !important;
    border-radius: 0px;
}

.modal-header, .modal-footer{
    border: none !important;
}

.modal-adc-succ{
    background-color: #CCCCCC !important;
    border-bottom: 5px solid #CC9B0B;
}

.p-modal-sucesso{
    font-size: 12px !important;
    color:#000 !important;
    font-weight: normal !important;
}

.modal-title{
    font-size: 15px;
    color:#CC9B0B;
    font-weight: bolder;
}

.close{
    color: #fff !important;
    font-size: 0px !important;
}

.modal-body{
    padding-top: 0px;
}


/* The container */
.container-radio {
    display: block;
    position: relative;
    padding-left: 35px;
    padding-top: -5px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 15px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }
  
  /* Hide the browser's default radio button */
  .container-radio input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
  }
  
  /* Create a custom radio button */
  .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: transparent;
    border-radius: 50%;
    border: #CC9B0B solid;
  }
  
  /* On mouse-over, add a grey background color */
  .container-radio:hover input ~ .checkmark {
    background-color: #000;
  }
  
  /* When the radio button is checked, add a blue background */
  .container-radio input:checked ~ .checkmark {
    background-color: #b1770b;
    background-size:10px ;
  }
  
  /* Create the indicator (the dot/circle - hidden when not checked) */
  .container-radio:after {
    content: "";
    position: absolute;
    display: none;
  }
  
  /* Show the indicator (dot/circle) when checked */
  .container-radio input:checked ~ .checkmark:after {
    display: block;
  }
  
  /* Style the indicator (dot/circle) */
  .container-radio .checkmark:after {
       top: 9px;
      left: 9px;
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: white;
  }

/* carrinho */

.tabela-carrinho{
    width: 100%;
}

.tabela-carrinho tr{
    border-bottom: solid rgba(255, 255, 255, 0.479) 1px;
    font-size: 12px;
    font-weight: normal !important;
}

.thead-produto{
    text-align: right;
    padding-right: 1em;
}

.total-club-carrinho{
    font-weight: bolder !important;
    font-size: 13px;
}

.carrinho-final-club{
    color: #CC9B0B;
}
.carrinho-final-loja{
    color:#ffffffbb !important;
}

.carrinho-final-loja-borda{
    border-bottom: none !important;
}

.div-final-texto{
    background-color: #FFC20F; 
    border-radius: 10px;
    padding:8px;
    text-align: center;
    margin-top: 10px;
}
.div-final-texto p{
    color: black;
    margin-bottom: -10px;
    font-weight: 500;
    padding: 10px;
    font-size: 13px;
}

.btn-preto{
    background-color:#000;
    color: #FFC20F !important;
    padding: 5px 60px;
    border-radius: 18px;
    cursor: pointer;
    margin-bottom: 10px;
}

.btn-outline-branco{
    background-color:transparent;
    border: 2px solid #ffff;
    color: #ffff !important;
    border-radius: 18px;
    cursor: pointer;
    padding: 5px;
}

/* Secao Proposito */
.secao-proposito{
    text-align: center;
    padding: 40px;
}
.titulo-proposito{
    font-family: 'Trajan Pro';
    font-style: normal;
    font-weight: bold;
    font-size: 24px;
    line-height: 109%;
    color: #CC9B0B;
}
.sub-proposito{
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 18px;
    text-align: center;
    letter-spacing: 0.0015em;
    color: #FFFFFF;
}
.texto-proposito{
    text-align: justify;
    color: #CC9B0B;
    font-weight: 580;
}

/* SECAO OPINIAO */

.secao-opiniao{
    background-color: #333333;
}
#client-testimonial-carousel {
    min-height: 160%;
}

.carousel-indicators li{
    width: 10px;
  height: 10px;
  border-radius: 100%;
}

.texto-opiniao{
    font-size: 14px; 
    line-height: 18px; 
    text-align: center; 
    letter-spacing: 0.0015em; 
    color: #CCCCCC;
}

.btn-concluir-club{
    background-color: #FFC20F; 
    text-align: center;
    color: #000;
    border-radius: 15px;
    padding: 6px;
}

.btn-concluir-club:hover{
    cursor: pointer;
}

.lista-vantagem-club {
    list-style: none; 
}

.lista-vantagem-club li::before {
    content: "\2022";  
    color: #CC9B0B;
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left: -1em;
}

/* SECAO INSTITUCIONAL */

.secao-institucional{
    background-image: url("../../images/novas_img/fundo_institucional.png");;
}
.fundo-escricao-instituicional{
    background-color: rgba(0, 0, 0, 0.7);
    text-align: center;
    padding: 10em;
}

.titulo-institucional{
    font-family: 'Trajan Pro';
    font-style: normal;
    font-weight: bold;
    font-size: 29.8px;
    line-height: 109%;
    color: #CC9B0B;
}
.texto-institucional{
    color: #CC9B0B;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 18px;
    letter-spacing: 0.0015em;
}

.cont-escondido{
   display: none;
}

.texto-item-info{
  color: rgba(000,000,000, 0.8) !important;
}

@media only screen and (max-width: 600px) {
    .btn-adc-carrinho{
        margin-left: 3.5em;
    }
}

@media only screen and (min-width: 601px) {
    .btn-adc-carrinho{
        margin-left: 2em;
    }
}