body{
    background-color: #231F20;
    overflow-x: hidden;
}

.animatable {
  
    /* initially hide animatable objects */
    visibility: hidden;
    
    /* initially pause animatable objects their animations */
    -webkit-animation-play-state: paused;   
    -moz-animation-play-state: paused;     
    -ms-animation-play-state: paused;
    -o-animation-play-state: paused;   
    animation-play-state: paused; 
  }
  
  /* show objects being animated */
  .animated {
    visibility: visible;
    
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -ms-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -ms-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
  
    -webkit-animation-play-state: running;
    -moz-animation-play-state: running;
    -ms-animation-play-state: running;
    -o-animation-play-state: running;
    animation-play-state: running;
}

@media( max-width: 998px){
    .animatable {  
        visibility: visible;
    
        -webkit-animation-fill-mode: both;
        -moz-animation-fill-mode: both;
        -ms-animation-fill-mode: both;
        -o-animation-fill-mode: both;
        animation-fill-mode: both;
        
        -webkit-animation-duration: 1s;
        -moz-animation-duration: 1s;
        -ms-animation-duration: 1s;
        -o-animation-duration: 1s;
        animation-duration: 1s;
    
        -webkit-animation-play-state: running;
        -moz-animation-play-state: running;
        -ms-animation-play-state: running;
        -o-animation-play-state: running;
        animation-play-state: running;
    }
    
}


.btn-orange{
    background-color: #F7931D;
}


/*HOME*/
.home-img{
    background-image: url("/furniture/images/family-sitting-on-wall-during-walk-in-summer-P5JTQFH-car-lg.jpg");
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-x: 0;
    overflow: hidden;
      width: 2136px;
    height: 2374px;
    position: absolute;
    transform: scale(1, 1);
    z-index: -3;
    top: -0%;
    left: -6.6%;
    animation: zoom-in 0.7s ease-out forwards;
    animation-delay: 0.5s;
}

@keyframes zoom-in{
    0% {
        transform: scale(1, 1);
    }

    100% {
        transform: scale(0.9, 0.9);
        top: -12.4%;
    }
}

@media( max-width: 998px){
    .home-img{
        background-image: url("/furniture/images/family-sitting-on-wall-during-walk-in-summer-P5JTQFH-car-lg.jpg");
        overflow: hidden;
        width: 1864px;
        height: 1074px;
        position: absolute;
        z-index: -3;
        transform: scale(0.67, 0.67);
        top: -75%;
        left: -61%;
        animation: zoom-in 0.6s ease-in forwards;
    }

    @keyframes zoom-in{
        0% {
            transform: scale(0.67, 0.67);
        }
    
        100% {
            transform: scale(0.47, 0.47);
        }
    }
    
}


@media( max-width: 768px){
    .home-img{
        background-image: url("/furniture/images/family-sitting-on-wall-during-walk-in-summer-P5JTQFH-car-lg.jpg");
        background-repeat: no-repeat;
        background-attachment: fixed;
        overflow: hidden;
        background-position-x: -955px;
        width: 439px;
        height: 979px;
        position: absolute;
        transform: scale(1.1, 1.1);
        z-index: -3;
        top: -10%;
        left: -6%;
        animation: zoom-in 0.6s ease-in forwards; 
    }

    @keyframes zoom-in{
        0% {
            transform: scale(1.1, 1.1);
        }
    
        100% {
            transform: scale(0.9, 0.9);
        }
    }
}


.home{
    background-attachment: linear-gradient( rgba(0, 0, 0, 0.096), rgba(0, 0, 0, 0.096) );
    margin: 0 auto;
    height: 852px;
    z-index: 2;
}

@media( max-width: 998px ){
    .home{
        margin: 0 auto;
        height: 375px;
        z-index: 2;
    }
}

@media( max-width: 768px ){
    .home{
        margin: 0 auto;
        height: 725px;
        z-index: 2;
    }
}

/*HEADER*/
.header{
    background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.582) 100%);
    height: 119px;
    width: 100%;
    justify-content: center;
    position: relative;
    z-index: 1;
}

.header img{
    height: 100px;
}
/*FIM DO HEADER*/

.home-center{
    margin: 0 auto;
}

.home-texts{
    color: #ffff;
    text-align: left;
}

.home-texts h1{
    font-size: 30px;
    line-height: 30px;
    font-weight: 300;
}

.home-buttons-a a{
    color: black;
    padding: 20px;
    padding-left: 30px;
    padding-right: 30px;
    max-width: 415px;
    border-radius: 5px;
    transition: 0.2s ease-in;
}

.home-buttons-a a:hover{
    background-color: #F7931D;
    transform: translateY(-0.25em);
    box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
}
/*FIM DA HOME*/

/*SOBRE NÓS*/
.sobre-nos{
    background-color: #F7931D;
    padding: 80px;
   
}

.SN-texts h3{
    font-size: 25px;
    line-height: 30px;
    font-weight: 350;
}
/*FIM DO SOBRE NÓS*/

/*BACK TO TOP BUTTON*/
#back-top-button{
  text-decoration: none;
  position: fixed;
  width: 50px;
  height: 50px;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 20px;
  border: 1px 1px 1px #777;
  background-color: #7777775b;
  color: #ffff;
  cursor: pointer;
  padding-top: 10px;
  border-radius: 50%;
  transition: 0.2s ease-in;
}

#back-top-button:hover{
    background-color: #F7931D;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
}

/*FIM BACK TO TOP BUTTON*/

/*O QUE IMPORTA PARA VOCÊ*/
.oq-imp-p-vc{
    background-color: #ffff;
}

.oq-imp-p-vc-grid{
    padding: 0;
    display: flex;
    justify-content: space-around;
    margin: 0 auto;
    margin-left: -24px;
}

.oq-imp-p-vc-grid h5{
    font-weight: 350;
}


@media (max-width: 768px) {
    .oq-imp-p-vc-grid{
        display: block;
        margin-left: 0;
    }
}

@media (max-width: 998px) {
    .oq-imp-p-vc-grid{
        display: block;
        margin: 0 auto;
    }
}

.oq-imp-p-vc-button a{
    color: black;
    padding: 20px;
    padding-left: 30px;
    padding-right: 30px;
    max-width: 619px;
    border-radius: 5px;
    transition: 0.2s ease-in;
}

.oq-imp-p-vc-button a:hover{
    transform: translateY(-0.25em);
    background-color: #F7931D;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
}
/*FIM DO O QUE IMPORTA PARA VOCÊ*/

/*SEGURADORAS PARCEIRAS*/
.seguradoras-parceiras h2{
    color: #F7931D;
}

.logos-seguradoras-parceiras{
    width: 313px;
    height: 180px;
    padding: 30px;
    filter: grayscale(100%);
    opacity: 0.55;
    transition: 0.2s ease-in;
}

@media (max-width: 998px) {
    .logos-seguradoras-parceiras{
        width: 180px;
        height: 137px;
        padding: 30px;
        filter: grayscale(100%);
        opacity: 0.55;
        transition: 0.2s ease-in;
    }
}

@media (max-width: 768px) {
    .logos-seguradoras-parceiras{
        width: 388px;
        height: 134px;
        padding: 30px;
        filter: grayscale(100%);
        opacity: 0.55;
        transition: 0.2s ease-in;
    }
}

.logos-seguradoras-parceiras:hover{
    filter: grayscale(0%);
    opacity: 1;
}
/*FIM SEGURADORAS PARCEIRAS*/

/*CONTATO*/
.contato{
    background-color: #ffff;
    height: 800px;
}

@media (max-width: 768px) {
    .contato{
        height: 929px;
    }
}

.flexao-contato{
    display: flex;
}

@media (max-width: 998px) {
    .flexao-contato{
        display: block;
    }
}

.formulario-contato{
    width: 600px;
    margin-right: 50px;
    padding-left: 300px;
}

.formulario-contato p{
    inline-size: 600px;
    overflow-wrap: break-word;
    font-size: 20px;
}

.contato-button{
    border: none;
    color: black;
    padding: 10px;
    max-width: 100px;
    border-radius: 5px;
    transition: 0.2s ease-in;
}

.contato-button:hover{
    transform: translateY(-0.25em);
    background-color: #F7931D;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
}

.contato-input{
    background-color: #F1F1F1;
    border: none;
    padding: 10px;
    width: 465px;
    margin-bottom: 10px;
}

@media( max-width: 998px ){
    .formulario-contato{
        width: 100px;
        margin-right: 0px;
        padding-left: 104px;
        padding-top: 50px;
    }
    
    .formulario-contato p{
        inline-size: 600px;
        overflow-wrap: break-word;
        font-size: 22px;
    }

    .contato-input{
        background-color: #F1F1F1;
        border: none;
        padding: 10px;
        width: 595px;
        margin-bottom: 10px;
    }
}

@media( max-width: 768px ){
    .formulario-contato{
        width: 300px;
        margin-right: 0px;
        padding-left: 20px;
        padding-top: 20px;
    }
    
    .formulario-contato p{
        inline-size: 300px;
        overflow-wrap: break-word;
        font-size: 20px;
    }

    .contato-input{
        background-color: #F1F1F1;
        border: none;
        padding: 10px;
        width: 327px;
        margin-bottom: 10px;
    }
}

.mapa-contato{
    left: 49.9%;
    height: 82.6%;
    width: 50%;
    position: absolute;
}

.mapa-contato iframe{
    height: 100%;
    width: 100%;
}

@media( max-width: 998px ){
    .mapa-contato{
        left: 0%;
        margin-top: 50px;
        height: 56.6%;
        width: 100%;
        position: absolute;
    }
    
    .mapa-contato iframe{
        height: 100%;
        width: 100%;
    }
}


@media( max-width: 768px ){
    .mapa-contato{
        left: 0%;
        margin-top: 50px;
        height: 40%;
        width: 100%;
        position: absolute;
    }
    
    .mapa-contato iframe{
        height: 100%;
        width: 100%;
    }
}
/*FIM DO CONTATO*/

/*FOOTER*/
footer p{
    color: #777;
}



/*DIVIDERS*/
.divider-lg{
    height: 300px;
}

.divider-md{
    height: 200px;
}

.divider-sl{
    height: 150px;
}

.cool-divider{
    height: 80px;
}

.divider-lg-sp{
    height: 300px;
}

@media(max-width: 998px){
    .divider-lg{
        height: 200px;
    }
    
    .divider-md{
        height: 100px;
    }

    .divider-sl{
        height: 50px;
    }

    .divider-lg-sp{
        height: 59px;
    }
}

@media(max-width: 768px){
    .divider-lg{
        height: 200px;
    }
    
    .divider-md{
        height: 100px;
    }

    .divider-sl{
        height: 50px;
    }

    .divider-lg-sp{
        height: 200px;
    }
}