@import url(header.css);
@import url(footer.css);



:root{

    --body:#fff;
    --scroll:#2D7AA4;

    --wrapper:#2D7AA4;
    --wrapperColor:#ffffff;
    --categoryModal:#a3a3a3;
    
    /* Menu */
  --backgroundHeaderInfo: #dadada;
  --HeaderInfoColorIco: #4d4d4d;
  --backgroundHeaderNumber: #5e5e5e;
  --HeaderNumber: #fff;
  --backgroundMainMenu:#F8F9FA;
  --LinksMainMenu:#353535;
  --backgroundSubMenu:#fff;
  --LinksSubMenu:#353535;
   /* Fim Menu */

  --cardBtn:#246993;
  --cardBtnText:#FFF;


  /*Home*/

    --sectionHomeCategory:#fcfcfc;
    --sectionHomeProvaSocial:#F3F6FF;
 
  /* Fim Home*/

  /* Category */
  --backgroundCategoryText:#f3f3f3;
  --categoryText:#535353;
  --asideCategory:#d1d1d1;
  --asideCategoryColor:#414141;
  --asideCategoryBorderLeft: blue;
/* Fim Category */

   /*footer*/
   --backgroundFooter:#ffffff;
   --textFooter:#505050;
  /*Fim footer*/


}

.idProjeto p{
    color: #FFF;
}
.mapa_site{
  
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

body{
  background-color: var(--body);
}

.modals-categories .btn{
    background-color: var(--categoryModal);
    border: transparent;
}

h1{
    font-size: 20px;
}

h2,h3{
    font-size: 18px;
}

p{
    color: #2a2a2a;
}

p,a{
    font-size: 16px;
    
}

.img_banner{
    height: 80vh;
}

.hidden{
    display: none ;
}

.ativar{
    display: block ;
}

::-webkit-scrollbar{

    width: 10px;
}
::-webkit-scrollbar-thumb{
    width: 10px;
    background-color: var( --scroll);
    border: transparent;
    border-radius: 10px;
}
button.region-btn-open {
    position: relative;
    top: -19ch ;
}


.card .btn{
   background-color: var(--cardBtn);
   color: var(--cardBtnText);
   border: transparent !important;
}


#backTop{
    position: fixed;
    left: 15px;
    display: none;
    bottom: 20px;
    z-index: 10;
    background-color: #fff;
    border: transparent;
    border-radius: 50px;
    
}
.card{
    max-width: 540px;
}
.categories-home  .cards .card:hover{
    background-color: #f1f1f1 !important ;

}


/* article */

article img{
  width: 70%;

  margin-bottom: 5%;
  border: transparent;
  border-radius: 5px;
}
.wrapper{
    background-color: var(--wrapper) ;
    display: flex;
    padding: 10px;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    
    
}
.key_word a{
    text-decoration: none;
    color: #2a2a2a;
    padding: 3px;
}
.key_word:hover{
    background-color: #b1b1b1;
}


.btn-categories button:not(.modal-content button){
    white-space: nowrap; 
    width: 10em; 
    overflow: hidden;
    text-overflow: ellipsis; 
   
}



.btn-categories{
    width: 70%;
    margin: 0 auto;

}



.wrapper h1{
   font-size: 1.3rem;
   text-transform: uppercase;
   color: var(--wrapperColor);
   
}

aside h2{
    text-decoration: none;
    color: #3f3f3f;
    font-size: 1.3rem;
}



.text-category {
    width: 85%;
}
/*
.breadcrum_category li a{
    text-decoration: none;
    color: var(--categoryText);
    font-size: 9px;
}

.breadcrum_category li svg{
    text-decoration: none;
    fill:  var(--categoryText);
    font-size: 9px;
}

.breadcrum_category ol{
    display: flex;
    margin: auto;
    background-color: transparent;
    border: transparent;
    border-radius: 5px;
    flex-wrap: wrap;
    padding: 10px;
    justify-content: end;
 background-color: var(--backgroundCategoryText);
    text-align: center;
    list-style: none;

}

*/

.breadcrumb_category {
    background-color: var(--backgroundCategoryText);
    display: flex;
    justify-content: end;
    align-items: center;
    padding: 20px 50px;
}
.breadcrumb_category li, .breadcrumb_category ol li a, .breadcrumb_category ol li svg{

 color: #000 !important;
 fill: #000 !important;
}

.breadcrumb_produto .breadcrumb{
    margin: auto;
}
.breadcrumb{
    max-width: 800px;
   
}

.breadcrumb ol{
    display: flex;
    margin: auto;
    background-color: transparent;
    width: 100%;
    text-transform: uppercase;
    border: transparent;
    border-radius: 5px;
    flex-wrap: wrap;
    padding: 3px;
    justify-content: center;
    text-align: center;
    list-style: none;
}

.breadcrumb li{
 padding: 0 3px;
 font-size: 12px;

}
.breadcrumb li svg{
    fill: var(--wrapperColor);
   }

.breadcrumb ol a{
        color: var(--wrapperColor);
        text-decoration: none;
       font-size: 12px;
}
.breadcrumb ol {
  
    color: var(--wrapperColor);
}


.breadcrumb li:not(:last-child):after {
    content: "/";
 
 }
 
 .breadcrumb li:first-child:before {
     content: none;
   }
 
   .breadcrumb li:first-child::after {
     content: none;
   }
 


.container-prova-social{
    padding: 5% 10% !important;
    background-color: var(--sectionHomeProvaSocial);

}

.cards .card{
    width: 540px;
    height: auto ;
  /*  height:180px;*/
}
@media only screen and (max-width: 760px) {
    #sub-menu_ico::before{
        border-bottom: 25px solid transparent;
    }
    .cards .card{
        width: 100%;
        height: auto ;
    }

    .text-category {
        width: 95%;
    }

  }

.cards p{
    color: #2a2a2a;
}
.cards .card  h5 {
    color: #4b4b4b;
    text-transform: uppercase;
    margin-bottom: 3%;
    font-size: 16px;
}

.cards .card p {
    color: #2a2a2a;
    font-size: 12px;
    margin-bottom: 3%;
}




@media only screen and (max-width: 769px) {

    .breadcrumb_category{
        display: flex;
        justify-content: center
    }

    .cards{
        width: 90%;
         margin: 0 auto;
    }

  
.container-prova-social{
    padding: 0% 0% !important;

}

    .img_banner {
        height: 50vh;
    }

    .wrapper{
        display: flex;
        flex-direction: column;
     }
     .wrapper h1{
        text-align: center;
     }
     .header__breadcrumb {
         width: 90% !important;
         justify-content: center !important;
       
     }

     
.hamburmgue{
    display: flex;
    justify-content: space-around;
    align-items: center;
    width: 100%;
}

    .hamburmgue button{

        height: 50%;
    }
    
  }

  header nav ul li:nth-child(4) #servico_link::after{
      content: "";
      display: inline-block;
     margin-left: 0.255em;
    vertical-align: 0.255em;
    content: "";
    border-top: 0.3em solid;
    border-right: 0.3em solid transparent;
    border-bottom: 0;
    border-left: 0.3em solid transparent;
      
  }


/*breadcrumb*/

.header__breadcrumb{
   width: 18% ;
   display: flex;
   align-items: center;
   justify-content: end;
   
}

/* Form*/
.form{
    display: flex;
    justify-content: end;
   
}




.form form p {
    font-weight: 600;
    font-size: 1.5rem;
    text-align: center;

}

.form form{
    width: 500px;
    padding: 10% 10%;
    background-color: #fff;
    border: 2px solid transparent;
    border-radius: 20px;
    -webkit-box-shadow: -1px 0px 29px -6px rgba(173,173,173,1);
    -moz-box-shadow: -1px 0px 29px -6px rgba(173,173,173,1);
    box-shadow: -1px 0px 29px -6px rgba(173,173,173,1);
}



/*category*/
.main-category{
    background-color:  var(--backgroundCategoryText);
    color:  var(--categoryText);
    padding: 50px;
    margin-bottom: 2%;
}

.main-category p{

    color:  var(--categoryText);

}


.main__card__menu{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items:  flex-start;
    gap: 100px;
    width: 80%;
    margin: 0 auto;
}
.main__card__menu aside{
    width: 30%;
}

aside h2{
    font-size: 20px;
    text-transform: uppercase;
    text-decoration: none;
   
}

aside h2 a {
    text-decoration: none;
   color: #707070;
   font-size:1.3rem
}

a.tel.follow-click {
    background-color: transparent;
    text-decoration: none;
    font-size: 16px;
}

.main__card__menu aside ul{
    list-style: none;
    text-align: center;

}
.main__card__menu aside .aside_categories .aside_categories_itens{
    padding: 10px;
    background-color: #fff;
    margin-bottom: 10px;
    border-radius: 10px;
    -webkit-box-shadow: -2px -1px 18px -4px rgba(191,191,191,1);
    -moz-box-shadow: -2px -1px 18px -4px rgba(191,191,191,1);
    box-shadow: -2px -1px 18px -4px rgba(191,191,191,1);
    border: solid 1px transparent;
}




@media only screen and (max-width: 760px) {
  .main__card__menu{
    flex-direction: column;
  }
  .main-category{
    width: 100%;
    padding: 10px;
  }

  .main__card__menu aside {
    width: 95%;
   }
   .cards{
    width: 90%;
   }

}





/* Home */

.banner_form{

    position: absolute;
    
    top: 28%;
    
    right: 7%;
    
    z-index: 2;
    
    padding: 33px;
    
    border-radius: 18px;
    
    background-color: #ffffff29 ;
    
    width: 400px;
    
    backdrop-filter: blur(10px) ;
    }


.banner_form_mobile{
    display: none;
}
.banner_text{
    position: absolute;
    bottom: 180px;
    z-index: 2;
    left: 7%;
    padding: 35px;
    border-radius: 50px;
     color: #fff;
    width: 700px;
}


.banner_text p{
   font-size: 1.2rem;
   color: #fff;
}

.banner_text h6{
    font-size: 30px;
 }

 .container-company{
    background-color: #f3f3f3;
}

.container-company div{

    display: flex;
    gap: 30px;
    padding: 5%;
    width: 75%;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    align-items: center;
}
.region {
    display: flex;
    justify-content: end;
    margin-top: 5%;
}
.region-links{
    border: transparent;
    border-radius: 10px;
    padding: 10px 40px;
}

.region-btn {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 500px;
}
.region-btn-open{
    background-color: transparent;
    border: none;
}
.region-btn button {
 margin: 0 auto;
}
.company__home{
    background-color: #fdfdfd;
}
.company__home .company__home__text{
    width: 60%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0 auto;
    padding: 50px;
}

.company__home .company__home__text h1{
    font-size: 1.4rem;
    text-align: center;
}


 @media only screen and (max-width: 760px) {

    .banner_background {
        height: 90%;
    }

    .company__home .company__home__text{
        width: 100%;
    
    }
.banner_form{
        display: none;
    }

    .banner_form_mobile{
        display: block;
        padding: 10% 10%;
    }
    .banner_form_mobile p{
       font-size: 1.5rem;
    }


    div#banner img {
        height: auto ;
    }
    .banner_text h6 {
        font-size: 13px;
    }
    .banner_text p{
        font-size: 0.6rem;
        width: 300px;
    }
    .banner_text {
        position: absolute;
        width: 90%;
   
        top: 3ch;
        padding: 0px;
      
    }

    .container-company div{

        width: 100%;
  
    }
 }




.categories-home{
    background-color: var(--sectionHomeCategory);
}

.prova-social{
    width: 95% !important;
    background-color: #fff;
    margin: 5px auto;
    border: solid 1px transparent;
    border-radius: 20px;
    padding: 30px 20px;
    -webkit-box-shadow: -1px 0px 17px -3px rgba(227,227,227,1);
-moz-box-shadow: -1px 0px 17px -3px rgba(227,227,227,1);
box-shadow: -1px 0px 17px -3px rgba(227,227,227,1);

}

.prova-social .prova-social_stars{
    color: #cac714;
    width: 100%;
    text-align: end;
    font-size: 1.2rem;
}



.prova-social h5{
    font-size: 1.5rem;
    font-style: italic;
}
.prova-social h6{
    font-size: 1.1rem;
    font-style: italic;
}


.card {
    background-color: rgb(255, 255, 255) !important;
    border: solid 0.5px #f3f3f3 !important;
    -webkit-box-shadow: -1px 0px 17px -3px rgba(227,227,227,1)!important;
-moz-box-shadow: -1px 0px 17px -3px rgba(227,227,227,1)!important;
box-shadow: -1px 0px 17px -3px rgba(227,227,227,1)!important;
}


@media only screen and (min-width: 1900px) {

    .banner_text{
        top: 30%;
    }

    
.banner_form{

    top: 30%;
    
}
}

/*Footer*/

.footer__adress p{
  font-size: 1.2rem;
  font-weight: 400;
}
.footer__menu a{
    font-size: 1.1rem; 
}

footer{
    -webkit-box-shadow: -2px -1px 17px 0px rgba(235,235,235,1);
-moz-box-shadow: -2px -1px 17px 0px rgba(235,235,235,1);
box-shadow: -2px -1px 17px 0px rgba(235,235,235,1);
}




/*missao*/

.missao .breadcrum{

   max-width: 100%;
}


.missao .breadcrum ol {
    justify-content: end;


}
.missao article{
    width: 75%;
    margin: 0 auto;

}


/**/

.empresa .breadcrum{

    max-width: 100%;
 }
 
 
 .empresa .breadcrum ol {
     justify-content: end;
 
 
 }
 .empresa article{
     width: 75%;
     margin: 0 auto;
 
 }

@media only screen and (max-width: 760px) {

    .missao .breadcrum ol {
        justify-content: center;
    
    
    }

    .missao article{
        width: 90%;
    
    }

    /**/

    .empresa .breadcrum ol {
        justify-content: center;
    
    
    }

    .empresa article{
        width: 90%;
    
    }
}









.list_categories {
    color: #444;
    cursor: pointer;
    list-style: none;
    width: 100%;
    border: none;
    outline: none;
    font-size: 15px;
    transition: 0.4s;
  }
.accordion-btn{
    font-size: 20px ;
}

  .list_categories button{
     border: transparent;

  }
  
  .list_categories button{
    border-left: solid var(--asideCategoryBorderLeft) 1px;
    margin-top: 10px;
    border-radius: 0 5px 5px 0;


 }
  
  .panel li{
        font-size: 18px;
        padding: 5px;
  }

  .panel li a{
   text-decoration: none;
   color: #2a2a2a;
}

.list_categories button{
    background-color: var(--asideCategory) ;
    color: var(--asideCategoryColor);
}
  
  .list_categories .active, .list_categories button :hover {
    background-color: #d8d8d8; 

  }
  
  .panel {
    padding: 0 18px;
    text-align: start !important;
    display: none;
    background-color: white;
    overflow: hidden;
    border:solid #c5c5c5 0.5px;
  }
  .aside_info {

    width: 90%;
    margin-left: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
 
    background-image: url(http://localhost/novoTema/assets/img/5127047.jpg);
    background-position: center; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
   background-size: cover;
    
}

.aside_info p {
   color: #FFF;
   font-weight: 500;
}
.container_aside_info{
    background-color: rgba(0,0,0,0.7);
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    border: transparent;
    border-radius: 20px;
}

.container_aside_info a{
    background-color: #FCA700;
    color: #fff;
}

.container_aside_info .tel a{
    background-color: transparent;
    font-size: 16px;
    text-decoration: none;
    color: #fff;
}


.container_aside_info a:hover{
    background-color: #c28202;
    color: #fff;
}



.mensagem {
    position: fixed;
    bottom: 200px;
    left: -356px;
    z-index: 10;
    -webkit-box-shadow: 0px -1px 24px -8px rgba(133,133,133,1);
    -moz-box-shadow: 0px -1px 24px -8px rgba(133,133,133,1);
    box-shadow: 0px -1px 24px -8px rgba(133,133,133,1);
    transition: .4s;
}


.mensagem__show{
    left: 2px !important;
    transition: .4s;
}


.mensagem_content{
    background-color: #FFF;
    height: 140px;
    width: 350px;
    padding: 20px;

   
}

.mensagem svg{
    transform: rotate(90deg);
    margin-bottom: 5px;
    transition: .30s;
 
}

  .mensagem__show svg{
    transform: rotate(-90deg);
    transition: .30s;
    margin-bottom: 5px;
 
}


.mensagem .mensagem__open{
    transform: rotate(90deg);
    border: transparent;
    border-radius: 20px 5px 0 0 ;
    padding: 10px;
    color: #fff;
    width: 147px;
    cursor: pointer;
    top: 50px;
    text-align: center;
    left: 300px;
    background-color: #cf7207;
    animation: pulse_mensagem 2s infinite;
    position: absolute;
}

  @keyframes pulse_mensagem {
    0% {
      -moz-box-shadow: 0 0 0 0 rgba(204,169,44, 0.4);
      box-shadow: 0 0 0 0 rgba(204,169,44, 0.4);
    }
    70% {
       
        box-shadow: 0 0 0 20px rgba(177, 109, 7, 0);
    }
    100% {
        -moz-box-shadow: 0 0 0 0 rgba(204,169,44, 0);
        box-shadow: 0 0 0 0 rgba(204,169,44, 0);
    }
}

/* WhatsApp*/

.whatsapp{
    position: fixed;
    right: 5px;
    z-index: 9999;
    bottom: 10px;
   }
   .whats_msg {
    display: flex;
    align-items: center;
    /* margin: 0 auto; */
    /* justify-content: center; */
    background-color: rgb(255 255 255);
    border: 1px solid #ccc!important;
    border-radius: 34px;
    margin-right: 100px;
    margin: 1em 0;
    width: 80%;
    position: relative;
    box-shadow: 4px 3px 3px #4f46461c;
}

.whats_msg input{

    border: none;
    outline: none;
    border-radius: 0.65rem;
}
input#TelWhats {
    font-size: 18px;
    font-weight: bold;
    background-color: rgb(255 255 255 / 0%);
    width: 200px;
    padding: 15px;
    color: #738189;
}


   .modal-whatsapp{
       position: absolute;
       right: 70px;
       background-color: rgb(234 230 223);
       width: 318px;
       bottom: 20px;
       z-index: 10;
       text-align: center;
       display: none;
       border: transparent;
       border-radius: 17px;
       color:#474747;
       font-weight: bold;
       -webkit-box-shadow: 0px -1px 24px -8px rgba(133,133,133,1);
       -moz-box-shadow: 0px -1px 24px -8px rgba(133,133,133,1);
       box-shadow: 0px -1px 24px -8px rgba(133,133,133,1);
   }

   


   
   .modal-whatsapp::after{
     content: "";
     width: 0;
     height: 0;
     border-top: 15px solid transparent;
     border-bottom: 15px solid transparent;
     border-left: 15px solid  #eae6df;
     position: absolute;
     bottom: 5px;
     right: -11px;
     -webkit-box-shadow: 0px -1px 24px -8px rgba(133,133,133,1);
     -moz-box-shadow: 0px -1px 24px -8px rgba(133,133,133,1);
     box-shadow: 0px -1px 24px -8px rgba(133,133,133,1);
   }
   

   #modal_tremer{
    animation: tremer .2s;
    animation-iteration-count: 3;
  }


  @keyframes tremer {
    0% {right: 70px;}
    25% {right: 72px;}
    50% {right: 70px;}
    75% {right: 78px;}
    100% {right: 70px;}
}


   .modal-whatsapp ol{
       list-style-type: none;
       max-height: 350px;
       overflow-y: auto;
   }
   
   .modal-whatsapp ol a{
       text-decoration: none;
       color:#5a5a5a;
   }
   .modal-whatsapp .whatsapp-info{
     padding: 20px;
     border-top: #f4f4f4  solid 0.5px;
   }
   
   .modal-whatsapp .whatsapp-info span{
       display: flex;
       padding: 5px;
       align-items: center;
       justify-content: center;
   
     }
     .wp-loading{
       display: none;
     }
     .modal-whatsapp .whatsapp-header img {
        border: transparent;
        border-radius: 100px;
        width: 40px;
        margin-right: 15px;
        height: 40px;
        background-color: #fff;
        object-fit: cover;
    }

   
   
     .modal-whatsapp .whatsapp-header{
        background-color: rgb(0 128 105);
        border-radius: 17px 17px 0px 0px;
        padding: 10px;
        font-weight: 200;
        display: flex;
        align-items: center;
        justify-content: center;
   }
     .modal-whatsapp .whatsapp-header h3{
       color: #FFF;
       font-size: 0.8rem;
     }
     .modal-whatsapp .btn_modal_WhatsApp:hover {
        background-color: #103f24;
    }
     .modal-whatsapp .description{
          font-size: 1.2rem;
     }
   
     .modal-whatsapp .btn_modal_WhatsApp{
        padding: 15px 53px;
        border: transparent;
        border-radius: 10px;
        margin-top: 10px;
        background-color: #25d366;
        margin-bottom: 2%;
        color: #fff;
        font-size: 18px;
        /* font-weight: bold; */
     }
     .modal-whatsapp form {
        /* padding: 20px 34px !important; */
        background-color: rgb(234 230 223);
        /* margin: 0 auto; */
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
     }
     .close_modal_Whats {
        position: absolute;
        right: 7px;
        top: 10px;
        cursor: pointer;
    }
    .btn-whatsapp span{
        position: absolute;
        background-color: rgb(221, 5, 5);
        padding: 3px;
        color: #fff;
        cursor: pointer;
        border: transparent;
        border-radius: 20px;
        top: -10px;
        right: 5px

    }



     @media only screen and (max-width: 720px) {
   
       .whatsapp{
           position: fixed;
           right: 10px;
         
          }
   
          .modal-whatsapp{
            right: 37px;
            bottom: 50px
          }
   
          .modal-whatsapp::after{
           content: "";
           width: 0;
           height: 0;
           border-top: 0px solid transparent;
           border-bottom: 0px solid transparent;
           border-left: 0px solid  transparent;
          }
     }
   span#whatsapp_close_link {
    position: absolute;
    right: 10px;
    color: #fff;
    cursor: pointer;
    font-size: 15px;
    font-weight: bold;
}
     /* Fim*/

     #sendForm::before{
        content: url(../imagens/send.svg);
     }

     #ico-aspas-home{
        position: absolute;
        top:2px;
     }

     #ico-aspas-home-footer{
        position: absolute;
        bottom:4px;
        right: 35px;
     }
    
    
 

     /*Modal*/

     .modal-scroll{
        height: 50ch;
        overflow-y: auto;
     }


     .contact__phones a{
        color: #FFF;
    }
    
    .cta-formulario{
        display: none;
    }
    .banner_background {
        background-color: #0000004d;
        position: absolute;
        top: 0;
        width: 100%;
        height: 97%;
        z-index: 1;
    }
    
    .main-content form textarea{
        height: 100px;
    }
    .cards .card a {
        text-decoration: none;
    }
    .item-cta {
        display: flex;
        justify-content: center;
    }
    .container_nome svg{
      position:absolute;
       margin:10px;
    }
    
    input::placeholder {    opacity: 0.5;}
    input { padding-left:35px !important;}
    textarea::placeholder {    opacity: 0.5; }
    textarea{ padding-left:35px !important;}
    
    .container_email svg{
      position:absolute;
       margin:10px;
    }
    .container_telefone svg{
      position:absolute;
       margin:10px;
    }
    
    .container_mensagem svg{
      position:absolute;
       margin:10px;
    }
    
.main-content{
 justify-content: space-around !important;
}