/** Fontes utilizadas **/
@import url('https://fonts.googleapis.com/css2?family=Lato&family=Raleway:wght@300;400;500&display=swap');
h1, h2, h3, h4, h5, h6, p, span{
    font-family: 'Raleway', sans-serif !important;
}
.titulos{
    font-family: 'Lato', sans-serif !important;
}

/** Tamanho das fontes **/
h1{
    font-size:clamp(28px, 3vw, 36px) !important;
    margin-bottom: 0 !important;
}
h2{
    font-size:clamp(24px, 3vw, 28px) !important;
}
h3{
    font-size:clamp(22px, 3vw, 26px) !important;
}

h6{
    font-size:clamp(15px, 3vw, 20px) !important;
}
p{
    font-size:clamp(13px, 3vw, 18px) !important;
    margin-bottom: 0 !important;
}
.card-header p{
    font-size:clamp(12px, 3vw, 13px) !important ;
    font-family: 'Lato', sans-serif !important;
    margin-bottom: 0 !important;
}
.card-body p{
    font-size:clamp(12px, 3vw, 12px) !important;
    font-family: 'Lato', sans-serif !important;
    margin-bottom: 0 !important;
}
.card-body span{
    font-size:clamp(14px, 3vw, 14px) !important;
    font-family: 'Lato', sans-serif !important;
}
.celebridades h1{
    font-size: clamp(28px, 5vw, 56px) !important;
}
/** AJUSTA O TOAST **/
.toast{
    max-width: 605px !important;
}
/** RETIRA CORES E DECORAÇÃO DOS LINKS **/
a,
a:active,
a:hover {
  color: unset !important;
}

a:hover {
  text-decoration: none !important;
}

/** Cores **/
.branco{
    color:white;
}
.preto{
    color:#333333;
}
.dourado{
    color:#A68F67;
}
.cinza{
    background-color:#c7c6c6 !important;
}
.preto-bg{
    background-color: #000;
}
.cinza2{
    color:#666;
}
.amarelo{
    color:#F9B332;
}
/** Bordas **/
.borda{
    border:1px solid #666666;
    border-radius:0;
}
/** Rastreio **/
.rastreio{
    background: #000;
    width: 300px;
    border-radius: 0px 0px 10px 10px;
    padding: 5px;
    text-align: center;
    font-size: 19px;
    color: #fff;
    cursor: pointer;
    height: 60px;
    position: fixed;
    top: 0;
    right: 10px;
    z-index: 99;
}

/** Background **/
.background{
    background: url(../img/fundo1.webp),
    url(../img/fundo1.png);
}
.bg-celebridades{
    background: url(../img/bgcelebridades.webp),
    url(../img/bgcelebridades.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-size: 92%;
    background-position-x: -230px;
    background-color: #f1f1f1;
}
/** Botões **/
.botao{
    margin-bottom: 50px !important;
    background: #5ABB4F !important;
    letter-spacing: 2px !important;
    transition: all .2s ease-in-out;
    font-weight: 600 !important;
    border: 1px solid #3c3c3c !important;
    padding: 19px 0 !important;
    text-align: center !important;
    width: 254px !important;
    border-radius:0 !important;
    text-transform: uppercase !important;
    color: #fff !important;
    text-decoration: none!important;
}
.botao:hover{
    outline: 0 !important;
    color: #fff !important;
    border-color: #fff !important;
}
.botao-fundo-branco{
    border:1px solid #fff !important;
}
.botao-fundo-branco:hover{
    border: 1px solid #3c3c3c !important;
}

.botaokit {
    font-family: 'Lato', sans-serif !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    color: white !important;
    width: 100% !important;
    border: 1px solid black !important;
    border-radius: 0 !important;
    padding: 12px !important;
    transition: all 0.7s ease-out;
    background: linear-gradient(
270deg
, black, #696969, rgba(34, 34, 34, 0), rgba(34, 34, 34, 0)) !important;
    background-position: 100% 0% !important; 
    background-size: 300% 300% !important;
    text-decoration: none !important;
}
.botaokit:hover{
    background: #767676 !important;
    color: black !important;
    border: 1px solid black !important;
}

/** Tamanho imagens **/
.blogueiras .instagram img{
    width: 87%;
}


/** Antes e Depois **/
.twentytwenty-before-label:before{
    content: 'Antes';
}
.twentytwenty-after-label:before{
    content: 'Depois';
}
.botao-whats{
    width: 13%;
    position: fixed;
        right: 10px;
        z-index: 999;
        display: block;
        bottom: 10px;
}
/** Mobile **/
@media(max-width:767px){
.bg-celebridades{
    background-image: none;
    background-color: #fff;
}
.beneficios img{
    width: 50%;
}
.blogueiras .instagram img{
    width: 100%;
}
.botao-whats{
    width: 50%;
}

}