*{
    font-family: 'Montserrat', sans-serif;
}
html{
    font-size: 16px;   
}
p, h1, h2, h3, h4, h5, h6{
    margin-bottom: 0 !important;
}
a{
    color: inherit;
    text-decoration: none;
}
header{
    background-image: url('https://fasttire.com.br/themes/fasttire/assets/images/images-new-site/fundo-top-site-mobile.webp');   
    background-size: cover;
    padding: 5% 10% 5% 10%;
}
#header-sobre-nos{
    background-image: url('https://fasttire.com.br/themes/fasttire/assets/images/images-new-site/sobre-nos-header-bg.webp');   
    background-size: cover;
    padding: 5% 10% 5% 10%;
}
#header-lojas{
    background-image: url('https://fasttire.com.br/themes/fasttire/assets/images/images-new-site/bg-img-lojas.webp');   
    background-size: cover;
    padding: 5% 10% 5% 10%;
}
footer{
    background-color: #163F90;
    padding: 5%;
    margin-top: -2px;
}
button {
  cursor: pointer;
  border: none;
}
button:focus{
    outline: none !important;
}
.flex{
    display: flex;
    align-items: center;
    justify-content: space-between;
    /*
    css para deixar o cabecalho fixo ao scrollar (levar em conta o espaçamento que não fica adequado com o texto "SOMOS A EVOLUCAO EM VENDA DE PNEUS")
    position: fixed;
    top: 5%;
    left: 10%;
    right: 10%;
    */
}
.header-texts{
    padding: 5% 0 5% 0;
    text-align: left;
    width: 100%;
    display: block;
    margin: auto;
}
.header-texts-sn{
    padding: 5% 0 5% 0;
    text-align: left;
    width: 100%;
    display: block;
    margin: auto;
}
.dif-cards{
    
}
.dif-card{
    background-color: #FFFFFF;
    border-radius: 16px;
    display: block;
    margin: auto;
    margin-top: 104px;
    width: 80%;
    box-shadow: 0px 3px 30px -14px black;
    padding: 24px;
    max-width: 500px;
}
.dif-card-center{
    background-color: #18418D !important;
    color: #FFFFFF !important;
    position: relative;
}
.ofertas{
    text-align: center;
    padding: 72px 10% 124px 10%; 
}
.encontre-pneu{
    padding: 5%;
    background-color: #F2F2F2;
}
.esp-txt{
    margin-left: 10px;
    margin-top: 9px;
}
.esp-txt-flex{
    display: flex;
    justify-content: center;
    align-items: center;
}
.esp-calculadora{
    display: flex;
    justify-content: space-between;
    padding-top: 7.5%;
}
.esp-slct-f{
    margin-top: -2px;
    display: flex;
    justify-content: space-around;
}
.m-inputs{
    width: 100%;   
    font-size: 0.8rem;
}
.esp-carro{
    background-color: #FFD000;
    border-radius: 0 8px 0 0;
    padding: 0 0 16px 0
}
.esp-medida{
    background-color: #163F90; 
    padding: 1rem 5% 1rem 5%;
    opacity: 0;
    color: #FFFFFF;
    height: 0;
    padding: 0;
}
.esf-p{
    padding: 0.5rem 1rem 0.5rem 1rem
}
.marcas{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 24px 0 32px 0;
}
.encontre-loja{
    background-color: #163F90;
    padding: 10% 5% 0 5%;
}
.encontre-loja-moto{
    background-color: #4E008E !important;   
}
.e-l-f{
    display: flex;
    justify-content: center;
    align-items: center;
}
.dgt-cep{
    padding: 5% 5% 8% 5%;
}
.input-group{
    position: relative;    
}
.input-cep{
    height: 28px;
}
.flex-inp-d{
    display: flex;
}
.ts-lojas{
    background-color: #163F90;
    padding: 5%;
}
.ts-lojas-moto{
    background-color: #4E008E;
}
.ts-l-div{
    margin: 16px 0 16px 0;
}
.ts-l-t-b{
    display: flex;
    justify-content: space-between;
    background-color: #FFFFFF;
    border-radius: 0 0 8px 8px;
    margin: auto;
   
}
.max-w-300{
    max-width: 300px;
}
.newsletter{
    padding: 32px 5% 32px 5%;
}
.clientes{
    background-color: #FFFFFF;
    margin-top: -20px;
}
.newsletter input{
    border: solid 1px #F0F0F0;
    border-radius: 8px 0 0 8px;
    width: 100%;
}
.medidas-especiais{
    background-color: #F2F2F2;
    padding: 1px 5% 0 5%;
}
.c-i-d{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 64px 5% 0 5%; ;
}
.comentarios-card{
    
}
.c-c-i{
    margin-top: -70px;
}
.comentario-card{
    box-shadow: 0px 3px 30px -14px black;
    position: relative;
    z-index: 9999;
    padding: 64px 10% 10% 10%;
    margin: auto;
    display: block;
    min-width: 70%;
}
.yellow-side-bars{
    display: flex;   
}
.c-c-yellow-bar{
    background-color: #FFD000;
    width: 100%;
    height: 20px;
}
.ccyb-l-1{
    margin-top: 108px
}
.ccyb-l-2{
    margin-top: 12px;   
}
.ccyb-r-1{
    margin-top: 108px;
}
.ccyb-r-2{
    margin-top: 12px;
}
.i-h-div{
    width: 60%;
    text-align: left;
    display: block;
    transform: translate(10%, 0);
    margin: 32px auto 32px auto;
}
.redes-sociais{
    display: flex;
    align-items: center;
    color: #FFD000;
    font-weight: 700;
    justify-content: center;
}

.redes-sociais img, .redes-sociais label{
    margin:  48px 8px 48px 8px;   
}
.yellow-bar-header{
    height: 0;
    width: 49%;
    border: 1.86517px solid #FFD000;
    margin: 24px 0 24px 0;
}
.dif-sn-card{
    display: block;
    margin: auto;
    width: 80%;
    box-shadow: 0px 3px 30px -14px black;
    margin-top: 64px;
    border-radius: 12px;
}
.dsc-head{
    background-color: #FFD000;
    border-radius: 12px 12px 0 0;
    padding: 16px;
}
.dsc-body{
    text-align: justify;
    display: block;
    margin: auto;
    padding: 32px;
    width: 100%;
    background-color: #FFFFFF;
    border-radius: 0 0 16px 16px
}
.dsc-body label{
    margin-bottom: 0 !important;
}
.dif-sn{
   
}
#last-dsn-card{ 
    margin-bottom: 64px;
}
.collapse.show{
    max-width: 450px;
    transition: opacity 0.3s;
    opacity: 1;
    margin: auto;
}
.img-close{
    position: relative;
}
.close-btn{
    position: absolute;
    right: 0;
    top: 0;
    background-color: #FFDC00 !important;
    color: #163F90 !important;
    opacity: 1 !important;
    height: 32px;
    width: 32px;
    display: none;
}
.lojas{
    padding: 0 5% 0 5%;
}
.lojas-card{
    margin: 32px auto 0 auto;
    max-width: 450px;
    display: block;
    box-shadow: 0px 3px 22px -14px black;
    border-radius: 16px;
}
.lojas-card-body{
    display: flex;
    justify-content: space-between
}
.lcb-c-n{
    width: 60%;
    padding: 12px;
}
.lcb-expand{
    padding: 4px 8px 0 8px;
}
.lcb-btns-div{

}
.d-flex-wrap-mob{
    display: flex;
    flex-wrap: wrap;
}
.d-flex-wrap-desk{
    display: none;    
    flex-wrap: wrap;
}
.af-card-md{
    border-radius: 24px;
    height: 36px;
    position: absolute;
    text-align: center;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    left: 2.5%;
}
.aberto-card-mobile{
    display: none;
    background-color: #05FF00;
    color: #000000;
    width: 150px;
    top: 70%;
}
.fechado-card-mobile{
    display: none;
    background-color: #FF0000;
    color: #FFFFFF;
    width: 150px;
    top: 70%;
}
.aberto-card-desk{
    display: none;
    background-color: #05FF00;
    width: 200px;
    top: 75%;
}
.fechado-card-desk{
    display: none;
    background-color: #FF0000;
    width: 250px;
    top: 75%;
}
.dropdown-menu {
    opacity: 0.96;
    text-align: right !important;
}
.rotate-up {
    transform: rotate(45deg);
}

.rotate-down {
    transform: rotate(-45deg);
}
.bg-motos-purple-bg{
    position: relative;   
}
.purple-bg-moto{
    background-color: #4E008E;
    position: absolute;
    width: 50%;
    left: 50%;
    right: 0;
    margin: 0 auto;
    height: 50%;
    top: 50%;
    z-index: 1;
    transform: translateY(-50%);
}
.moto-description{
    padding-bottom: 64px;   
}
.p-c-car-moto{
    background-color: #4E008E !important;
}

.a-fale-com-consultor-cred{
    width: 100%;                        
}
.a-fale-com-consultor-cred-mob{
    width: 100%;                        
}
    
    
    

/* CARROSEL NEW CARD */



.product-card{
    display: flex;
    justify-content: center; 
    height: 40px;
    padding-top: 20px;
    transform: scale(1);
}
.p-c-pneu{
    background-color: #FFD000;
    width: 180px;
    height: 70px;
    transition: height 0.3s
}
.p-c-pneu-moto{
    background-color: #F2F2F2;
    width: 180px;
    height: 70px;
    transition: height 0.3s
}
.p-c-car{
    background-color: #18418D;
    width: 100px;
    height: 38.75px;
    padding: 5px;
    text-align: left;
    transition: height 0.3s;
}
.p-c-car img{
    width: 118px;
    height: 73px;
    position: relative;
    z-index: 99999999999;
    margin-left: -16px !important;
}
.p-c-logo-img {
    width: 100px !important;   
}
.p-c-car h6{
    color: #FFFFFF;
    font-size: 1rem;
    text-align: center;
    text-transform: uppercase;
    font-weight: 600;
}
.p-c-car p{
    color: #FFFFFF;
    font-weight: 300;
    font-size: 0.5rem;
}
.p-c-car-mob{
    background-color: #18418D;
    width: 100px;
    height: 150px;
    padding: 5px;
    text-align: left;
    transition: height 0.3s;
}
.p-c-car-mob img{
    width: 118px;
    height: 73px;
    position: relative;
    z-index: 99999999999;
    margin-left: -16px;
}
.p-c-car-mob h6{
    color: #FFFFFF;
    font-size: 0.625rem;
    font-weight: 600;
    text-align: center;
}
.p-c-car-mob p{
    color: #FFFFFF;
    font-weight: 300;
    font-size: 0.5rem;
}
.p-c-car-mob-moto{
    background-color: #4E008E;
    width: 100px;
    height: 150px;
    padding: 5px;
    text-align: left;
    transition: height 0.3s;
}
.p-c-car-mob-moto img{
    width: 118px;
    height: 73px;
    position: relative;
    z-index: 99999999999;
    margin-left: -16px;
}
.p-c-car-mob-moto h6{
    color: #FFFFFF;
    font-size: 0.625rem;
    font-weight: 600;
}
.p-c-car-mob-moto p{
    color: #FFFFFF;
    font-weight: 300;
    font-size: 0.5rem;
}

.p-c-pneu img{
    width: 146px;
    height: 193px;
    margin-left: 25px;
    margin-top: -30px;
}
.p-c-pneu-moto img{
    width: 101px;
    height: 193px;
    margin-left: 25px;
    margin-top: -30px;
}
.dropdown-item{
    color: #163F90 !important;
}
.parcelamos-h6{
    color: #18418D;
    text-align: center;
    font-weight: 800;
    margin-top: 8px
}
.modal-redir-w{
    background-color: #11418D;
    padding: 16px;
    padding-bottom: 124px;
    color: #fff;
}
.modal-redir-w h3{
    font-weight: 800;
    text-align: center;
    padding-top: 16px;
    padding-bottom: 16px;    
}
.modal-redir-w-desk h3{
    font-weight: 800;
    padding-top: 16px;
    padding-bottom: 16px;    
    font-size: 36px;
    font-style: italic;
    width: 250px;
}
.modal-redir-w label{
    display: inline;
}
.w-f{
    width: 400px;
    margin-left: 200px;
    transform: translateY(-50%);
}
.modal-redir-w p{
    text-align: center;
    display: block;
    margin: auto;
    width: 80%;
    max-width: 220px;
    font-size: 16px;
}
.modal-redir-w-desk p{
    font-size: 22px;
    width: 310px;
    font-weight: 600;
}
.mdrwd-p{
    width: auto;
    height: 340px;
    transform: translate(35%, -115%);
}
.mrw-mascote-desk{
    width: 370px;
    height: 600px;
    transform: translate(-10%, -105%);
}
.mdrw-flex{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.mdrw-imgs-flex{
    display: flex;
    height: 0;
}
.svg-mrwd{
    width: 1200px;
    height: 700px;
}
.mrw-mascote{
    height: 300px;
    width: auto;
    display: block;
    margin: auto;
    transform: translateY(-50%);
}
.mrw-ydiv{
    background-color: #FFD000;
    height: 230px;
    padding-top: 42px;
}
.modal-redir-w-desk{
    background-color: #11418D;
    padding: 16px 0 16px 0;    
    color: #fff;
}


/**********/



/*CAROUSEL*/
    
.carousel-control-next-icon{
    background-image: url('https://fasttire.com.br/themes/fasttire/assets/images/images-new-site/seta-direita.webp') !important;     
}
.carousel-control-prev-icon{
    background-image: url('https://fasttire.com.br/themes/fasttire/assets/images/images-new-site/seta-esquerda.webp') !important;    
}
.carousel-indicators{
    bottom: -50px !important;   
}
.carousel-indicators li {
    border: solid 0.1px #163F90 !important;
    border-radius: 50% !important;
    height: 8px !important;
    width: 8px !important;
}
.carousel-indicators .active {
    background-color: #163F90 !important;
}

/**************/

/*DROPDOWN*/

.dropdown-line{
    width: 34px;
    background-color: #FFFFFF;
    opacity: 0.8;
    height: 5px;
    border-radius: 24px;
    transform-origin: left;
    transition: transform 0.3s ease;
}
.ddl-m-t{
    margin-top: 18px;
    transform-origin: left;
}
.dc-img-container{
    width: 96px;
    height: 96px;
    background-color: #FFFFFF;
    border-radius: 50%;
    box-shadow: 0px 2px 10px -4px black;
    display: flex;
    margin: auto;
    transform: translate(0%, -75%);
}
.dc-img-container-center{
    width: 96px;
    height: 96px;
    background-color: #FFD000;
    border-radius: 50%;
    box-shadow: 0px 2px 10px -4px black;
    display: flex;
    margin: auto;
    transform: translate(0%, -75%);
}
.moto-container{
    display: block;
    margin: auto;
    max-width: 350px;
}
/****************/


/*IMAGENS*/
    #logo-fast-header{
        width: 100%;
        max-width: 150px;
    }
    .a-logo-fast-header{
        width: 30%;   
    }
    .marcas img{
        width: 100%;    
    }
    .marcas-img-l img{
        padding: 5% 5% 0 0;
    }
    .marcas-img-r img{
        padding: 5% 0 0 5%;
    }
    .dif-card img{
        width: 60%;
        height: auto;
        display: block;
        margin: auto;
    }
    .esp-txt-flex img{
        height: 60px;
        width: 60px;
        margin-right: 10px;
    }
    .e-l-f img{
        width: 32px;
        height: auto;
        margin-right: 16px;
    }
    .dgt-cep img{
        position: absolute;
        top: 50%;
        right: 12px;
        transform: translateY(-50%);
        width: 16px;
        height: 16px;
    }
    .ts-l-div img{
        width: 100%;   
        height: 150px;
        object-fit: cover;
    }
    .newsletter img{
        width: 50%;
        max-width: 250px;
        display: block;
        margin: auto;
    }
    .carousel-item img{
        max-width: 250px;   
    }
    .c-i-d img{
        width: 20%;
        height: auto;
        max-width: 100px;
        margin-right: 16px;
    }
    .c-c-img{
        border: solid 3px #FFD000;
        border-radius: 50%;
        width: 65px;
        transform: translate(0%, 50%);
        display: block;
        z-index: 99999;
        box-shadow: 0px 3px 30px -14px black;
    }
    .c-c-i-img{
        z-index: 999;
        clip-path: polygon(0 0, 100% 0, 100% 50%, 0 50%);
        width: 100px;
        transform: translate(0%, 115%);      
    }
    .logo-dsp{
        width: 50%;
        max-width: 150px;
        margin: auto;
        display: block;
    }
    .redes-sociais img{
        width: 32px;
        height: auto;
    }
    .dsc-head img{
        width: 30%;
        height: auto;
        max-width: 100px;
        display: block;
        margin: auto;
    }
    .sn-t-img{
        width: 100%;
    }
    .sn-icons{
        display: block;
        margin: auto;
        padding: 32px;
        width: 50%;
        max-width: 120px;
    }
    #rodapeImgMob{
        width: 100%;
        margin-top: 64px;
    }
    .lojas-card img{
        width: 100%;
        height: 200px;
        object-fit: cover;
        border-radius: 16px 16px 0 0;
    } 
    .btn-f-cons img{
        height: 36px;
        border-top-left-radius: 5px;
        border-bottom-left-radius: 5px;
    }
    .img-loja-collapse{
        display: none;   
    }
    .bg-motos-home{
        width: 80%;
        display: block;
        margin: auto;
        transform: translate(5%, 0px);
        z-index: 2;
        position: relative;
    }
    .logo-speedmax-home{
        width: 40%;   
        display: block;
        margin: auto;
    }
    .bg-motos{
        width: 100%;    
    }
    .logo-speedmax{
        width: 45%;
        margin-top: 3rem;
    }
    .moto-description img{
        display: block;
        margin: 32px auto 16px auto;
        width: 30%;
        max-width: 100px;
    }
    .whats-button-flex{
        height: 24px;
        width: 24px;
        margin-top: -3px;
    }
    .certificado-ssl-img{
        display: block;
        margin: auto;
        margin-top: 32px;
    }
    
/***************/

/*TEXTOS*/
header h1{
    font-size: 1.5rem;
    color: #FFFFFF;
    font-weight: 800;    
    margin: 36px 0 12px 0;
}
header h5{
    color: #FFFFFF;    
}
.p-c-car-moto-h6{
    font-size: 0.5rem !important;   
}
.yellow-label{
    color: #FFD000;   
    margin-bottom: 0;
}
.mdesk-h5-desc{
    width: 85%;
    display: block;
    margin: auto;
    font-size: 1rem;
}
.mdesk-h5-title{
    text-align: center;
    color: #4E008E;
    font-size: 1rem;
    font-weight: 800;
}
.purple-label{
    color: #4E008E;
    font-weight: 900;
    margin-bottom: 0;
}
.dif-card h5{
    color: #163F90;
    font-weight: 600;
    margin-top: -50px;
}
.dif-card-center h5{
    color: #FFFFFF !important   
}
.dif-card p{
    font-weight: 500;
    font-size: 0.8rem
}
.ofertas h2{
    color: #163F90;   
    font-weight: 700;
    font-style: italic;
    font-size: 3rem;
}
.ofertas h3{
    color: #666666;
    font-weight: 600;
}
.esp-txt-flex h3{
    font-size: 1rem;
    color: #666666;
    font-weight: 600;
}
.esp-txt-flex h2{
    font-size: 2.7rem;
    color: #163F90; 
    font-weight: 800;
    font-style: italic;
}
.esp-calculadora h5{ 
    border-radius: 8px 8px 0 0;
    width: 50%;
    text-align: center;
    color: #163F90;
    font-weight: 600;
    padding: 6px;
}
.esp-slct-f h6{
    color: #163F90;
    font-weight: 600;
}
#esp-carro-txt{
    background-color: #FFD000;
}
#esp-medida-txt{
    background-color: #163F90;
    color: #FFFFFF;
}
.e-l-f h6{
    color: #FFFFFF;
    font-weight: 700;
    font-size: 0.8rem;
}
.e-l-f h3{
    color: #FFD000;
    font-style: italic;
    font-weight: 700;
    font-size: 1.65rem;
}
.dgt-cep p{
    color: #FFFFFF;
    font-weight: 600;
}
.ts-l-t-b h6{
    color: #163F90;
    font-weight: 700;
    padding: 8px 0 0 8px
}
.ts-l-t-b p{
    font-weight: 700;
    padding: 0 0 0 8px
}
.newsletter h5{
    color: #163F90;
    text-align: center;
    font-weight: 700;
    margin-top: 24px;
    font-size: 1rem;
}
.newsletter h6{
    color: #666666;
    text-align: justify;
    font-weight: 500;
    padding: 0 2.6% 0 2.6%;
    margin: auto;
    margin-top: 4px;
    font-size: 0.7rem;
    max-width: 300px;
}
.medidas-especiais h5{
    color: #163F90;
    text-align: center;
    font-weight: 700;
    margin-top: 24px;
    font-size: 1rem;
}
.medidas-especiais h6{
    color: #666666;
    text-align: justify;
    font-weight: 500;
    max-width: 250px;
    margin: auto;
    margin-top: 4px;
    font-size: 0.7rem;
}
.nca h6{
    color: #666666;
    font-weight: 600;
}
.nca h4{
    color: #163F90;
    font-weight: 700;
    font-style: italic;
}
.comentario-card h5{
    text-align: center;
    color: #163F90;
    font-weight: 700;
}
.comentario-card p{
    text-align: justify;
    font-size: 14px;
}
.i-h-div h6{
    color: #FFD000;
    font-weight: 700;
}
.i-h-div p{
    color: #FFFFFF;
    font-weight: 600;
}
.footer-direitos{
    color: #FFD000;
    font-weight: 600;
    font-size: 0.8rem;
    text-align: center;
}
.footer-devs{
    color: #FFFFFF;
    font-weight: 700;
    font-size: 0.7rem;
    text-align: center;
}
.font-weight-900{
    font-weight: 900;
}
.sn-textos p{
    text-align: justify;
    padding: 0 5% 10% 5%;
}
.lcb-c-n h5{
    color: #163F90;
    font-weight: 700;
}
.lcb-c-n h6{
    color: #000000;
    font-weight: 700;
}
.lcb-expand h5{
    font-size: 1rem;
    font-weight: 700;
    color: #163F90;
}
.collapse-desk-nome{
    display: none;
}
.collapse-desk-cidade{
    display: none;
}
.active-link{
    color: #FFDC00 !important;
    font-weight: 700 !important;
    text-decoration: underline;
    text-decoration-color: #FFDC00;
    display: inline-block;
}
.fechado-card-desk h5{
    color: #FFFFFF;
}
.aberto-card-desk h5{
    color: #000000;
}
.gray-span{
    color: #666666;
}
.pcc-preco{
     font-size: 1rem !important;   
    }
.container-linha-moto h2{
    text-align: left;
    display: block;
    margin: auto;
    font-weight: 700;
    width: 60%;
}


/***************/

/*BUTTONS*/
.btn-header{
    background-color: #FFD000;
    width: 75%;
    display: block;
    margin: auto;
    color: #163F90;
    border: none;
    border-radius: 6px;
    font-size:  1.3rem;
    font-weight: 700;
    padding: 6px;
    color: #000000;
}
.btn-header-sn{
    background-color: #FFD000;
    width: 100%;
    display: block;
    margin: auto;
    color: #000000;
    border: none;
    border-radius: 6px;
    font-size:  1rem;
    font-weight: 700;
    padding: 6px;
}
.btn-header-lojas{
    background-color: #FFD000;
    width: 100%;
    display: block;
    margin: 24px auto 24px auto;
    color: #000000;
    border: none;
    border-radius: 6px;
    font-size:  1rem;
    font-weight: 700;
    padding: 6px;
}
.btn-orcamento{
    background-color: #163F90;
    display: block;
    width: 60%;
    margin: 50px auto 0 auto;
    color: #FFFFFF;
    border: none;
    border-radius: 6px;
    font-size: 1rem;
    font-weight: 700;
    padding: 6px;
    position: relative;
    z-index: 9999;
    max-width: 300px;
}
.btn-orcamento-of{
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(0deg);   
}
.btn-esp{
    background-color: #FFD000;
    display: block;
    width: 100%;
    margin: 4px auto 0 auto;
    color: #163F90;
    border: none;
    border-radius: 0 0 6px 6px;
    font-size: 1rem;
    transition: 0.3s;
    font-weight: 700;
    position: relative;
    z-index: 23;
    padding: 6px;
}
.btn-esp-hover-yellow:hover{   
    background-color: #FFDC00 !important;
    color: #163F90 !important;
}
.btn-esp-hover-blue:hover{
    background-color: #163F90 !important;
    color: #FFFFFF !important;
}
.btn-buscar-cep{
    background-color: #FFD000;
    display: block;
    margin: auto;
    color: #163F90;
    border: none;
    border-radius: 0 6px 6px 0;
    font-size:  1rem;
    font-weight: 700;
    padding: 2px;
}
.btn-ir-loja{
    background-color: #FFD000;
    border: none;
    border-radius: 0 0 8px 0;
    color: #163F90;
    font-weight: 700;
}
.btn-rebecer-newsl{
    background-color: #FFD000;
    border: none;
    border-radius: 0 8px 8px 0;
    color: #163F90;
    font-weight: 700;
}
.btn-v-t-l{
    background-color: #F2F2F2;
    display: block;
    margin: 32px auto 16px auto;
    color: #163F90;
    border: none;
    border-radius: 12px;
    padding: 8px 24px 8px 24px;
    font-weight: 700;
}
.btn-saiba-mais-loja{
    background-color: #FFD000;
    color: #163F90;
    border: none;
    border-radius: 0 0 12px 0 ;
    padding: 8px;
    width: 40%;
    font-weight: 700;
}
.btn-v-loja{
    background-color: #163F90;
    border: none;
    border-radius: 4px;
    width: 100%;
    font-weight: 700;
    color: #FFFFFF;
    text-align: center;
    padding: 4px 4px 4px 16px;
    margin: 4px 0 4px 0;
    font-size: 0.7rem;
}
.btn-f-cons{
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 16px;
    padding: 10px;
    background-color: #00AF3A;
    color: #fff;
    border: none;
    width: 100%;
    font-size: 0.7rem;
    font-weight: 700;
    height: 38px;
    margin: 8px 0 8px 0;
}
.btn-0800{
    border: none;
    color: #163F90;
    width: 100%;
    background-color: #F2F2F2;
    border-radius: 16px;
    height: 38px;
    margin: 12px 0 12px 0;
    font-weight: 700;
}
.btn-fechar{
    background-color: #FFDC00;
    border: none;
    width: 49%;
    color: #000000;
    font-weight: 700;
    margin: 4px 0 4px 0;
    border-radius: 4px;
    font-size: 0.7rem;
}
.btn-motos{
    background-color: #4E008E;
    color: #FFFFFF;
    border: none;
    width: 60%;
    border-radius: 5px;
    padding: 6px 0 6px 0;
    display: block;
    margin: 32px auto 64px auto;
    
}

/***************/




/*MEDIA QUERIES*/

@media (min-width: 0px) and (max-width: 440px){
    
    .btn-header{
        font-size: 0.7rem;
    }
    
}


@media (min-width: 200px) and (max-width: 440px){ 

    header h1{
        font-size: 1.5rem;   
    }
    header h5{
        font-size: 1rem;
    }
    .btn-orcamento{
        width: 70%;
        font-size: 0.8rem;   
    }
    .product-card {
        transform: scale(0.8);    
    }
    
}

@media (min-width: 440px) and (max-width: 550px){ 

    header h1{
        font-size: 1.7rem;   
    }
    header h5{
        font-size: 1.3rem;
    }
    .btn-header{
        font-size: 1.1rem;   
    }
}

@media (min-width: 550px) and (max-width: 725px){ 

    header h1{
        font-size: 1.9rem;   
    }
    header h5{
        font-size: 1.5rem;
    }

}

@media (min-width: 725px) and (max-width: 800px){ 

    header h1{
        font-size: 2.1rem;   
    }
    header h5{
        font-size: 1.7rem;
    }

}

@media (min-width: 800px) and (max-width: 880px){ 

    header h1{
        font-size: 2.3rem;   
    }
    header h5{
        font-size: 1.9rem;
    }

}

@media (min-width: 880px) and (max-width: 960px){ 

    header h1{
        font-size: 2.5rem;   
    }
    header h5{
        font-size: 2.1rem;
    }

}

@media (min-width: 960px) and (max-width: 1023px){ 

    header h1{
        font-size: 2.7rem;   
    }
    header h5{
        font-size: 2.3rem;
    }

}

@media (max-width: 1023px){
 
    .header-links{
        display: none;
    }
    #ht-h5-desk{
        display: none;
    }
    .cc-y-s-b-desk{
        display: none;
    }
    .header-motos{
        background-color: #4E008E;
        background-image: unset;
    }
    #p-horario-desk{
        display: none;
    }
    .carouselMultiOfertas{
        display: none !important;
    }
    .carouselMultiOfertasEspeciais {
        display: none !important;
    }
    #rodapeImgDesk{
        display: none;
    }
    .sn-t-div-second-desk{
        display: none;   
    }
    .a-v-loja{
        width: 49%;   
    }
    .collapse-lcb-padding{
        padding: 24px 8px 0px 8px !important;
        margin-top: -24px !important;
    }
    .ts-l-div-desk{
        display: none;
    }
    .header-container-mob{
        flex-direction: column-reverse;   
    }
    #bg-motos-desk{
        display: none;
    }
    
    
    
    .new-product-card{
        display: block;
        margin: auto;
        max-width: 380px;
    }
    .p-c-header{
        background-color: #FFD000;   
        height: 150px;
        width: 80%;
    }
    .p-c-header-moto{
        background-color: #FFD000;   
        height: 160px;
        width: 80%;
    }
    .p-c-body{
        display: flex;
        flex-direction: column;
    }
    .p-c-body-b-bg{
        background-color: #18418D;
        display: block;
        height: 60px;
        margin: auto;
        color: #FFFFFF;
        width: 50%;
        max-width: 250px;
        padding: 8px 0 8px 0;
        text-align: center;
    }
    .p-c-body img{
        display: block;
    }
    .p-c-body-pneu{
        width: 144px !important;
        height: 232px !important;
        margin: auto;
        margin-top: -90px;
        z-index: 99;
    }
    .p-c-body-pneu-moto{
        width: 115px !important;
        height: 185px !important;
        margin: auto;
        margin-top: -90px;
        z-index: 99;
    }
    .p-c-body-carro{
        width: 180px !important;
        height: auto;
        margin: auto;
        margin-top: -40px;   
        z-index: 999;
    }
    .p-c-body-moto{
        width: 140px !important;
        height: auto;
        margin: auto;
        margin-top: -80px;   
        z-index: 999;
    }
    .p-c-body-marca-container{
        width: 50%;
        max-width: 250px;
        display: block;
        margin: auto;
        margin-top: -50px;
        height: 90px;
        position: relative;
    }
    .p-c-body-marca-moto-container{
        width: 50%;
        background-color: #4E008E;
        max-width: 250px;
        display: block;
        margin: auto;
        height: 30px;
        position: relative;
    }
    .p-c-body-marca{
        width: 100% !important;
        margin: auto;
        z-index: 9;
        position: absolute;
        bottom: 0;
        height: 38px;
        padding: 6px;
    }
    .p-c-body-marca-moto{
        width: 80% !important;
        max-width: 100px !important;
        display: block;
        margin: auto;
        z-index: 9;
        height: 30px;
        padding: 8px 0 8px 0;
    }
    .p-c-body-b-bg h5{
        font-weight: 800;
    }
    .p-c-header h4{
        text-transform: uppercase;
        color: #18418D;
        font-weight: 800;
    }
    .p-c-header-moto h6{
        text-transform: uppercase;
        color: #18418D;
        font-weight: 800;
    }
    .n-product-card{
        max-width: 250px;
        display: block;
        margin: auto;
    }
    .npc-logo{
        width: 100%;
    }
    .pc-body{
        display: flex;
        flex-direction: column;        
        background-color: #FFD000;
        padding: 16px 0 16px 0;
    }
    .pc-body h3{
        color: #18418D;
        font-weight: 900;
        text-transform: uppercase;
        font-size: 2.5rem;
        padding: 14px 0 8px 0;
    }
    .pc-body img{
        display: block;
        margin: auto;
    }
    .pc-body-pneu{
        width: 100%;   
    }
    .pc-body-carro{
        width: 65%;
        margin-top: -50px !important;
    }
    .pc-footer{
        background-color: #18418D;
        padding: 12px;
        color: #FFFFFF;
        text-align: left;
    }
    .pc-footer h2{
        font-weight: 700;   
        color: #FFFFFF;
        font-style: normal;
        font-size: 2.25rem;
    }
    
    
    
}

@media (min-width: 1024px){
    
    header{
        background-image: url('https://fasttire.com.br/themes/fasttire/assets/images/images-new-site/top-image.webp');
    }
    .header-motos{
        background-image: url('https://fasttire.com.br/themes/fasttire/assets/javascript/bg-purple.png');
        background-size: 78% 100%;
        background-repeat: no-repeat;
    }
    .header-motos-bg{   
        background-color: #4E008E;
        clip-path: polygon(0 0, calc(75%) 0, 100% 100%, 0 100%);         
    }
    #carouselOfertas{
        display: none;   
    }
    #carouselOfertasEspeciais{
        display: none;
    }
    .max-w-300{
        max-width: unset;
    }
    .ts-l-div-mob{
        display: none;
    }
    .dropdown{
        display: none;
    }
    #rodapeImgMob{
        display: none;
    }
    .sn-t-div-second-mob{
        display: none;
    }
    .header-links{
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100%;
    }
    .header-texts {
        width: 60%;
        padding: 5% 0% 24px 0;
        text-align: left;
        margin: unset;
    }
    .header-texts-moto{
        width: 100% !important;
    }
    .header-texts-sn {
        width: 100%;
        padding: 5% 35% 24px 0;
        text-align: left
    }
    .header-texts-loja {
        width: 100%;
        padding: 5% 30% 24px 0;
        text-align: left
    }
    .d-flex-wrap-mob{
        display: none;
    }
    .d-flex-wrap-desk{
        display: flex;
    }
    .dif-cards{
        display: flex;
        justify-content: space-between;
        padding: 0 10% 0 10%;
    }
    .dif-card{
        width: 30%;
        margin: unset;
    }
    .ofertas{
        padding: 96px 10% 48px 10%;
    }
    .esp-txt{
        margin-top: 0;
    }
    .encontre-pneu{
        padding: 5% 20% 5% 20%;   
        margin-top: -65px;
    }
    .esp-carro{
        padding: 0 0 24px 0;
        height: 180px;
        overflow: visible;
        opacity: 1;
    }
    .esf-p{
        width: 40%;   
    }
    .m-inputs {
        border: none;
        padding: 2px 8px 2px 8px;
        height: 36px;
    }
    .marcas-img-l, .marcas-img-r{
        display: flex;
        justify-content: space-between;
        width: 100%;
    }
    .marcas{
        flex-direction: column;
    }
    .encontre-loja {
        padding: 5% 5% 0 5%;
    }
    .dgt-cep {
        padding: 42px 15% 48px 15%;        
    }
    .input-cep{
        height: 48px;
    }
    #iframe-map{
        height: 500px;
        width: 80%;
        display: block;
        margin: auto;
    }
    .iframe-bg{
        background-color: #163F90;
        margin: -1px 0 -1px 0;
    }
    .iframe-bg-moto{
        background-color: #4E008E !important;
    }
    .ts-lojas {
        padding: 32px 10% 32px 10%;
    }
    .ts-l-flex{
        display: flex;
        justify-content: space-between;
    }
    .ts-l-div{
        width: 48.5%;
    }
    .newsletter{
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 84px;
    }
    .ts-l-t-b{
        padding-left: 0;
    }
    .newsletter input {
        height: 48px;
        font-size: 1.5rem;     
        padding-left: 16px
    }
    .medidas-especiais{
        text-align: center;
        padding: 5% 5% 0 5%;
    }
    .clientes{
        background-color: #FFFFFF;
        margin-top: -20px;
    }
    .comentarios-card{
        display: flex;   
        justify-content: space-between;
        padding: 0 10% 0 10%;
        position: relative;
    }
    .comentario-card{
        padding: 44px 5% 0% 5%;
        height: 220px;
        background-color: #FFFFFF;
    }
    .w-100-dn{
        display: none;
    }
    .c-c-i{
        width: 20%;  
        margin-top: 0;
        position: relative;
        z-index: 999; 
    }
    .c-i-d{
        padding: 124px 5% 0 5%;
    }
    .cc-y-s-b-desk{
        background-color: #FFD000;
        width: 100%;
        position: absolute;
        height: 14px;
        left: 0;
        top: 60%;
        z-index: 1;
    }
    .cc-y-s-b-desk-2{
        background-color: #FFD000;
        width: 100%;
        position: absolute;
        height: 14px;
        left: 0;
        top: 66%;
        z-index: 1;
    }
    footer{        
        padding: 5% 10% 2% 10%;
        margin-top: -2px;
    }
    .footer-flex-d{
        display: flex;
        justify-content: space-between;
        align-items: end;
    }    
    .i-h-div{
        width: 100%;   
        transform: translate(0, 0);
    }
    .f-w-35{
        width: 35%;
    }
    .f-w-65{
        width: 65%;
    }
    .esp-medida{
        padding: 0;
    }
    .esp-calculadora{
     padding-top: 5%;   
    }
    .dif-sn{
        display: flex;
        justify-content: space-between;
        margin: auto;        
    }
    .dif-sn-card{
        display: flex;
        width: 30%;
        margin: 0 0 auto 0;
    }
    .dsc-head{
        border-radius: 12px 0 0 12px;   
        width: 28%;
    }
    .dsc-body{
        border-radius: 0 12px 12px 0;
        padding: 16px;
        margin: 0 auto auto auto;
        height: 100px;
        text-align: left;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .container-mw{
        display: block;
        margin: auto;
        max-width: 1600px;
    }
    #last-dsn-card {
        margin-bottom: 0;
    }
    .sn-t-div{
        display: flex;
        padding: 4% 10% 6% 10%;
    }
    .stdsd-1{
        background-image: url('https://fasttire.com.br/themes/fasttire/assets/images/images-new-site/bg-mvv-fast.webp');
        background-size: 100% 100%;        
        width: 41%;
        display: flex;
        flex-direction: column
    }
    .stdsd-2{
        width: 65%;   
        padding: 64px;
    }
    .sn-t-div-second-desk{
        background-color: #F7F7F7;
        display: flex;
        align-items: center;
    }
    .lojas{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin: auto;
        padding: 0;
    }
    .lojas-card{
        width: 47.5%;
        max-width: none;
        margin: 48px 0 0 0;
    }
    .collapse.show{
        width: 100%;
        margin-bottom: 116px;
        max-width: unset;
    }
    
    .d-f-j-c-s-b{
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 8px 16px 8px 16px;
    }
    .product-card{
        transform: scale(1);
    }
    .container-linha-moto{
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        padding: 64px 0 194px 0;
        
    }
    .w-50-desk{
        width: 50%;
    }
    .moto-description{
        display: flex;
        align-items: center;
        justify-content: space-evenly;
    }
    .moto-container{
        max-width: unset;
        margin: unset;
    }
    .a-fale-com-consultor-cred{
        width: 40%;
    }
    /*TEXTOS*/
    
    .mdesk-h5-desc{
        width: 300px;
    }
    .header-links a{
        color: #FFFFFF;
        font-weight: 400;
    }
    .header-links a:hover{
        color: yellow;   
    }
    .header-links-bg{
        background-color: #FFDC00;
        border-radius: 36px;
        padding: 8px 16px 8px 16px;
        color: #163F90;
        font-weight: 700;
    }
    header h1{
        margin: 16px 0 8px 0;
        font-size: 3rem
    }
    #ht-h5{
        display: none;
    }
    .ofertas h3 {
        font-size: 2.25rem;
    }
    .ofertas h2{
        font-size: 4.5rem;
    }
    .esp-txt-flex h3{
        font-size: 1.5rem;    
    }
    .esp-txt-flex h2{
        font-size: 3rem;
        line-height: 0.8
    }
    .esp-calculadora h5 {
        font-size: 2rem;
        font-weight: 700;
    }
    .esp-slct-f h6{
        font-size: 1.75rem;
        font-weight: 600; 
    }
    .e-l-f h6{
        font-size: 1.75rem;   
    }
    .e-l-f h3{
        font-size: 3.5rem;
    }
    .esp-medida h6{
        font-size: 1.75rem;
        font-weight: 700;
    }
    .dgt-cep p{
        font-size: 2rem;
    }
    .ts-l-t-b h6{
        font-size: 1.5rem;
        font-weight: 700;
    }
    .ts-l-t-b p{
        font-size: 1.5rem
    }
    .newsletter h5{
        font-size: 2rem;
        text-align: left;
        padding: 0;
    }
    .newsletter h6{
        font-size: 1rem;   
        max-width: 550px;
        text-align: left;
        margin: 0;
        padding: 0;
        margin-top: 12px;
    }
    .medidas-especiais h5{
        font-size: 2.25rem;
    }
    .medidas-especiais h6{
        font-size: 1rem;   
        max-width: 450px;
        text-align: center;
    }
    .nca h6 {
        font-size: 2rem;
        font-weight: 700;
    }
    .nca h4{
        font-size: 3.5rem;   
        font-weight: 800;
    }
    .comentario-card p{
        font-size: 12px;
    }
    .i-h-div h6 {
        font-size: 1.5rem;
    }
    .i-h-div p{
        font-size: 1.25rem;
        margin-top: 8px;
    }
    .redes-sociais label{
        font-size: 1.5rem;   
    }
    .footer-direitos{
        font-size: 1.25rem;   
        margin-top: 48px;
    }
    .footer-devs{
        font-size: 1rem;    
    }
    .i-h-div p{
        font-weight: 400;  
    }
    #p-horario-mob{
        display: none;
    } 
    .sn-textos p{
        padding: 0;
        margin-right: 64px;
    }
    .collapse-desk-nome{
        display: block;
        margin-bottom: 0;
        color: #000000;
        font-weight: 700;
        font-size: 1.5rem;
    }
    .collapse-desk-cidade{
        display: block;
        margin-bottom: 0;
        color: #163F90;
        font-weight: 700;
        font-size: 1.75rem;
    }
    .d-f-j-c-s-b p{
        font-size: 1.25rem;
        font-weight: 600;
    }
    .lcb-expand h5{
        font-size: 1rem;
    }
    #a-h-p-bg{
        color: #4E008E;   
    }
    
    
    
    /*************/
    
    /*BUTTONS*/
    
    .btn-motos{
        margin: 32px auto 124px 20%; 
        font-size: 1.5rem;
    }
    .btn-header{
        display: inline-block;
        width: auto;    
        padding: 6px 12px 6px 12px;
    }
    .btn-orcamento{
        display: inline-block;
        width: auto;
        padding: 6px 12px 6px 12px;
    }
    .btn-buscar-cep{
        height: 48px;
        width: 180px;
        font-size: 1.5rem;
    }
    .btn-ir-loja{
        font-size: 1.2rem;
        padding: 4px 12px 4px 12px;
        font-weight: 800;
    }
    .btn-v-t-l{
        padding: 8px 48px 8px 48px;
        font-size: 1.5rem;
    }
    .btn-rebecer-newsl{
        font-size: 1.5rem;   
        padding: 0 14px 0 14px;
    }
    .btn-header-sn{
        margin: initial; 
        width: 35%;
    }
    .btn-header-lojas{
        margin: initial; 
        width: auto;
        padding: 6px 24px 6px 24px;
    }
    .btn-v-loja{
        width: 100%;   
        border-radius: 0;
        height: 80%;
        text-align: center;
        font-size: 1.2rem;
    }
    .a-v-loja{
        width: 40%;
    }
    .btn-fechar{
        width: 20%;
        border-radius: 0;
        text-align: center;
        font-size: 1.2rem;
    }
    .btn-f-cons{
        width: 100%;
        border-radius: 0;
        margin: 4px 0 4px 0;
        text-align: center;
        padding: 0;
        justify-content: center;
        font-size: 1.2rem;
    }
    
    #sgv-whats-white path {
        fill: #18418D;
    }
            
    /* CSS para o ícone na cor branca quando o botão é acionado no hover */
    #btn-esp:hover #sgv-whats-white path {
        fill: #FFFFFF;
    }
            
    /* CSS para o ícone do Whatsapp em branco quando o formulário de medida está ativo */
    #btn-esp.medida-active #sgv-whats-white path {
        fill: #FFFFFF;
    }
            
    /* CSS para o ícone do Whatsapp em azul quando o hover é acionado no botão de medida */
    #btn-esp.medida-active.btn-esp-hover-blue:hover #sgv-whats-white path {
        fill: #18418D;
    }
    /*************/
    
    /*IMAGENS*/
    
    .p-c-car img{
        width: 150%;
        height: auto;
    }
    .p-c-pneu img{
        width: 70%;
        height: auto;
    }
    .logo-speedmax-home{
        margin-right: 40%;
    }
    .bg-motos-home{
        width: 100%;   
        transform: translate(0, 0);
    }
    .bg-motos{
        width: 50%;
        margin-left: 50px;
    }
    #logo-fast-header {
        max-width: 150px;
    }
    .marcas-img-r img, .marcas-img-l img {
        padding: 24px 0 0 0;
        width: 23%;
    }
    .e-l-f img{
        width: 64px   
    }
    .ts-l-div img{
        height: 250px;   
        object-fit: cover;
    }
    .newsletter img{
        width: 30%;
        max-width: 350px;
        margin: unset;
    }
    .c-i-d img{
        max-width: 150px;
    } 
    .c-c-img{
        position: relative;
    }
    .logo-dsp{
        width: 100%;
        max-width: 300px;
        margin-bottom: 64px;
    }
    .redes-sociais img{
        width: 50px;
    }
    .side-items{
        width: 100%;   
    }
    .dsc-head img{
        width: 100%;
        height: auto;
    }
    .sn-t-img{
        width: 45%;
        height: fit-content;
    }
    .sn-icons{
        max-width: 150px;   
    }
    #rodapeImgDesk{
        margin-top: 104px;   
        width: 100%;        
    }
    .img-loja-collapse{
        display: block;
        width: 100%;
        height: 300px;
        object-fit: cover;
        margin-top: 32px;
    }
    .logo-speedmax{
        width: 50%;
    }
    #bg-motos-mob{
        display: none;
    }
    .certificado-ssl-img{
        margin-top: 0;
    }
    
    
    
    /*************/
    
    /*CAROUSEL*/
    
    
    .carousel-indicators {
        bottom: 0px !important;
    }
    
    
    /*************/
}


@media (min-width: 1024px) and (max-width: 1400px){
    
    .carouselMultiOfertasEspeciais {
        height: 370px !important;    
    }
    
    .carouselMultiOfertasEspeciais .carousel-item{
        transform: scale(0.7);   
    }
    
}

@media (min-width: 1024px) and (max-width: 1150px){ 
    
    .header-motos {
        background-size: 74.5% 100% !important;
    }
    
}

@media (min-width: 1024px) and (max-width: 1250px){ 
    
    header h1{
        font-size: 2.2rem;        
    }
    .header-links{
        width: 100%;   
    }
    .header-links a{
        font-size: 0.8rem;   
    }
    .header-motos {
        background-size: 75.5% 100%;
    }
}

@media (min-width: 1150px) and (max-width: 1370px){ 
    
    header h1{
        font-size: 2.5rem;        
    }
    
}

@media (min-width: 1300px) and (max-width: 1600px){ 
    
    .comentario-card{
        height: 190px;
    }
    
}

@media (min-width: 1600px){ 
    
    .comentario-card{
        height: 170px;
    }
    .slick-list {
        height: 370px !important;
    }
    .product-card{
        transform: scale(1.4);
    }
    .slick-track {
        top: 20px !important;
    }
}

@media (min-width: 1485px){
    
    #header-sobre-nos {
        padding: 5% 15% 5% 15%;
    }
    #header-lojas {
        padding: 5% 15% 5% 15%;
    }
    .dif-sn{        
        
    }
    .sn-t-div{
        padding: 5% 15% 5% 15%;
    }
    
}

@media (min-width: 1500px){ 
    
    .header-motos{
        background-size: 80% 100%;
    }
    .container-linha-moto h2{
        font-size: 2.5rem;   
    }
}

@media (min-width: 2000px){ 
    .container-linha-moto h2{
        font-size: 3rem;   
    }
}

@media (min-width: 0px) and (max-width: 400px){
    
    .container-linha-moto h2{
        font-size: 1rem;  
    }

}

@media (min-width: 400px) and (max-width: 550px){
    
    .container-linha-moto h2{
        font-size: 1.25rem;  
    }

}

/***************/
























/* ANIMAÇÕES */


.hideFormCarro {
    animation-name: hideFormCarroAnimation;
    animation-duration: 1s;
    animation-fill-mode: forwards;
}
.hideFormMedida{
    animation-name: hideFormMedidaAnimation;
    animation-duration: 1s;
    animation-fill-mode: forwards;
}

.showFormCarro{
    animation-name: showFormCarroAnimation;
    animation-duration: 1s;
    animation-fill-mode: forwards;  
}
.showFormCarroMobile{
    animation-name: showFormCarroAnimationMobile;
    animation-duration: 1s;
    animation-fill-mode: forwards;  
}
.showFormMedida{
    animation-name: showFormMedidaAnimation;
    animation-duration: 1s;
    animation-fill-mode: forwards;  
}
.showFormMedidaMobile{
    animation-name: showFormMedidaAnimationMobile;
    animation-duration: 1s;
    animation-fill-mode: forwards;  
}


.changeEspCarroTxtColor{
    animation-name: changeEspCarroTxtColorAnimation;
    animation-duration: 1s;
    animation-fill-mode: forwards;
}
.changeEspCarroTxtColorTwo{
    animation-name: changeEspCarroTxtColorTwoAnimation;
    animation-duration: 1s;
    animation-fill-mode: forwards;
}
.changeEspMedidaTxtColor{
    animation-name: changeEspMedidaTxtColorAnimation;
    animation-duration: 1s;
    animation-fill-mode: forwards;
}
.changeEspMedidaTxtColorTwo{
    animation-name: changeEspMedidaTxtColorTwoAnimation;
    animation-duration: 1s;
    animation-fill-mode: forwards;
}
.increaseLojaWidth{
    animation-name: increaseLojaWidthAnimation;   
    animation-duration: 1s;
    animation-fill-mode: forwards;
}
.lowerLojaWidth{
    animation-name: lowerLojaWidthAnimation;   
    animation-duration: 1s;
    animation-fill-mode: forwards;
}

.showProdutoCard{
    transform: scale(1.3);
}


.hideOpacity{
    opacity: 0;   
    transition: 0.3s opacity;
}


@keyframes increaseLojaWidthAnimation{
 
    0%{
        width: 47.5%;   
    }
    
    100%{
        width: 100%;
    }
    
}

@keyframes lowerLojaWidthAnimation{
 
    0%{
        width: 100%;   
    }
    
    100%{
        width: 47.5%;
    }
    
}

@keyframes hideFormCarroAnimation {
    0%{
        opacity: 1; 
        overflow: visible; 
        width: 100%; 
        height: 180px;  
        padding: 0 0 24px 0
    }
    50%{
        opacity: 0;
        overflow: hidden;
    }
    100% {
        opacity: 0;
        overflow: hidden;
        width: 50%; 
        height: 0;  
        padding: 0
    }
}

@keyframes hideFormMedidaAnimation {
    0%{
        opacity: 1; 
        overflow: visible; 
        width: 100%;
        height: 100px;
    }
    20%{
        float: right;
        opacity: 0.3;
    }
    50%{
        opacity: 0; 
        width: 50%;
    } 
    100% {
        height: 0;
        opacity: 0;
        overflow: hidden;
    }
}

@keyframes showFormMedidaAnimation {
    0%{
        opacity: 0;
        height: 0;
        padding: 0;
    }
    55%{
        opacity: 0;
        height: 0;
    } 
    100%{
        opacity: 1; 
        height: 100px;
        padding: 1rem 7.5% 1rem 7.5%;
    }
}
@keyframes showFormMedidaAnimationMobile {
    0%{
        opacity: 0;
        height: 0;
        padding: 0;
    }
    55%{
        opacity: 0;
        height: 0;
    }
    100%{
        opacity: 1;
        height: 80px;
        padding: 1rem 7.5% 1rem 7.5%;
    }
}

@keyframes showFormCarroAnimation {
    0%{
        opacity: 0;
        height: 0;
    }
    55%{
        opacity: 0;
        height: 0;
    }
    100%{
        opacity: 1;
        height: 180px;
    }
}
@keyframes showFormCarroAnimationMobile {
    0%{
        opacity: 0;
        height: 0;
    }
    55%{
        opacity: 0;
        height: 0;
    }
    100%{
        opacity: 1;
        height: 130px;
    }
}

@keyframes changeEspCarroTxtColorAnimation {
    0%{
        background-color: #F2F2F2;
        
    }
    100%{
        background-color: #FFD000;
        
    } 
}
@keyframes changeEspCarroTxtColorTwoAnimation {
    0%{
        background-color: #FFD000;
        
    }
    100%{
        background-color: #F2F2F2;
        
    } 
}



@keyframes changeEspMedidaTxtColorAnimation {
    0%{
        background-color: transparent;
        color: #163F90;
    }
    100%{
        background-color: #163F90;
        color: #FFFFFF;
    }
    
    
}


@keyframes changeEspMedidaTxtColorTwoAnimation {
    0%{
        background-color: transparent;
        color: #FFFFFF;
    }
    100%{
        background-color: #F2F2F2;
        color: #163F90;
    }
    
    
}



.containerx {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  position: absolute;
  top: -150px;
  transform: translate(-5%, 0px);
}

.chevron {
  position: absolute;
  width: calc(0.6rem * 3.5);
  height: calc(0.6rem * 0.8);
  opacity: 0;
  transform: scale(0.3);
  animation: move-chevron 3s ease-out infinite;
}

.chevron:first-child {
  animation-delay: 1s;
}

.chevron:nth-child(2) {
  animation-delay: 2s;
}

.chevron:before,
.chevron:after {
  content: "";
  position: absolute;
  top: 0;
  height: 100%;
  width: 50%;
  background: #FFD000;
}

.chevron:before {
  left: 0;
  transform: skewY(30deg);
}

.chevron:after {
  right: 0;
  width: 50%;
  transform: skewY(-30deg);
}

@keyframes move-chevron {
  25% {
    opacity: 1;
  }
  33.3% {
    opacity: 1;
    transform: translateY(calc(0.6rem * 3.8));
  }
  66.6% {
    opacity: 1;
    transform: translateY(calc(0.6rem * 5.2));
  }
  100% {
    opacity: 0;
    transform: translateY(calc(0.6rem * 8)) scale(0.5);
  }
}




body .pulsex {        
            position:fixed;        
            right:0;        
            bottom:0;        
            transform:translate(-50%,-50%);        
            width:80px;        
            height:80px;
            color:#fff;        
            border-radius:50%;        
            text-align:center;        
            line-height:84px;        
            font-size:48px;        
            z-index: 999999999999999999999999999999999999999;        
        }
        body .pulsex:after,        
        body .pulsex:before {        
            content:'';        
            display:block;        
            position:absolute;        
            border:1px solid #0cba59;        
            left:-20px;        
            right:-20px;
            top:-20px;        
            bottom:-10px;        
            border-radius:50%;        
            animation:animate 1.5s linear infinite;        
            opacity:0;        
            z-index:-999999        
        }        
        body .pulsex:after {        
            animation-delay:.5s        
        }                        
        @keyframes animate {        
            0% {        
                transform:scale(.5);        
                opacity:0        
            }       
            50% {        
                opacity:1        
            }        
            100% {        
                transform:scale(1.2);        
                opacity:0        
            }    
        }




/*************/