@font-face {
    font-family: "Carnas W03 Medium";
    src: url("https://db.onlinewebfonts.com/t/6c3edd04a03685b9890f2d2cbe81f8d3.eot");
    src: url("https://db.onlinewebfonts.com/t/6c3edd04a03685b9890f2d2cbe81f8d3.eot?#iefix")format("embedded-opentype"),
    url("https://db.onlinewebfonts.com/t/6c3edd04a03685b9890f2d2cbe81f8d3.woff2")format("woff2"),
    url("https://db.onlinewebfonts.com/t/6c3edd04a03685b9890f2d2cbe81f8d3.woff")format("woff"),
    url("https://db.onlinewebfonts.com/t/6c3edd04a03685b9890f2d2cbe81f8d3.ttf")format("truetype"),
    url("https://db.onlinewebfonts.com/t/6c3edd04a03685b9890f2d2cbe81f8d3.svg#Carnas W03 Medium")format("svg");
}


body {
      
    
}
.navbar { 
    height: 250px;    

  opacity: 1;
  transition: top 1s, opacity 1s;
}
.mostra {
  top: 0px !important;
  opacity: 1 !important;
}
.esconde {
  top: -100px;
  opacity: 0;
}




.navbar-light .navbar-nav .nav-link {
    color: white;  background-color:#677872;  border-radius: 30px; margin: 20px 15px; padding: 10px 25px; text-transform: uppercase; text-decoration: none;
} 



.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
    color: white;   background-color: rgb(68, 88, 81);  border-radius: 30px; margin: 20px 15px; padding: 10px 25px; text-decoration: none;
}


#navbarNav{ text-align: right;}



.navbar-brand {
    font-size: 1.7rem;    
    /*font-weight: 600;*/
  }
  
  

section {
    text-align: center;
    
    position: relative;
    
}

footer {
    background-color: #844d4a;
    color:white;
    padding: 20px 0;     
    bottom: 0;
    width: 100%;
}

.whatsapp-btn {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
}


.fundo{
    background-image:url('../../assets/images/fundoTopo.jpg'); height: 180px; background-size:cover; background-position: right,center; 
}

#quem-somos{ padding-top: 180px; font-family: "Carnas W03 Medium"; color:black}
#especialistas{ padding-top:100px; font-family: "Carnas W03 Medium"; color:black}

.quem{   
    background-color: rgb(0, 255, 115);
}
.sectionOne{
    background-image:url('../../assets/images/fundosectionOne.jpg'); height: 580px; background-size:cover; background-position: left,center;    
}

h2, p{ color: #844d4a}


.minha-div0 {
    height: 30vh; /* Ajuste a altura conforme necessário */   
    display: flex;
    align-items: center;
    justify-content: center;    
  }

.minha-div1 {
    height: 10vh; /* Ajuste a altura conforme necessário */   
    display: flex;
    align-items: center;
    justify-content: center;       
  }  

  .minha-div2 {
    height: 10vh; /* Ajuste a altura conforme necessário */      
  }

  .minha-div2 {
    height: 10vh; /* Ajuste a altura conforme necessário */      
  }

  .texto-centralizado {
    text-align: center;
    width: 100%;
    transition: all 0.3s ease-in-out;
  }

 .btn-patricia{
    background-color: #a4817f;
    color:white;

 }


 

 .btn-patricia:hover{
    background-color: #86615f;
    color:rgb(230, 207, 207);    
    border-color: #987573; /* Cor da borda */  
    /* Adicione estilos adicionais conforme necessário */
  }

 /* Sobrescreva as propriedades de estilo da classe btn-danger do Bootstrap */
 .btn-patricia{
    background-color: #a4817f;
    color:white;   
    border-color: #987573; /* Cor da borda */  
    /* Adicione estilos adicionais conforme necessário */
  }
  
  /* Adicione estilos quando o botão estiver em foco (outline) */
  .btn-patricia:focus {
    box-shadow: 0 0 0 0.2rem rgba(219, 143, 150, 0.5);
  }
  
  /* Adicione estilos quando o botão estiver ativo (pressionado) */
  .btn-patricia:active,
  .btn-patricia.active{
    background-color: #a4817f; /* Altere a cor quando o botão estiver ativo */
    border-color: #987573; /* Cor da borda */ /* Altere a cor da borda quando o botão estiver ativo */
    color:white; 
  }


  .sectionTwo{
    background-image:url('../../assets/images/fundosectionTwo.jpg');   padding-top:90px; height: 650px;  background-size: cover; background-position: right,center;  
}

.sectionthree{  
  background-image:url('../../assets/images/fundoDepoimentos.png');   height: 580px;  background-size:cover; background-position: top,center;  
  text-align: left;
}
  



/* carousel */
#quote-carousel 
{
  padding: 0 10px 30px 10px;
  margin-top: 30px;
}

/* Control buttons  */
#quote-carousel .carousel-control
{
  background: none;
  color: #222;
  font-size: 2.3em;
  text-shadow: none;
  margin-top: 30px;
 
}
/* Previous button  */
#quote-carousel .carousel-control.left 
{
  left: 10px;
  padding-top: 198px;
  width: 20px;
}
/* Next button  */
#quote-carousel .carousel-control.right 
{
  left: 40px !important;
  padding-top: 198px;
  width: 20px;
}
/* Changes the position of the indicators */
#quote-carousel .carousel-indicators 
{
  right: 100%;
  top: auto;
  bottom: 0px;
  margin-right: -19px;
}
/* Changes the color of the indicators */
#quote-carousel .carousel-indicators li 
{
  background: #c0c0c0;
}
#quote-carousel .carousel-indicators .active 
{
  background: #333333;
}
#quote-carousel img
{
  /*width: 250px;
  height: 100px*/
}
/* End carousel */

.item blockquote {
    border-left: none; 
    margin: 0;
}

.item blockquote img {
    margin-bottom: 10px;
}

.item blockquote p:before {
    content: "\f10d";
    font-family: 'Fontawesome';
    float: left;
    margin-right: 10px;
}



/*carrosel B*/




/* carousel */
#quote-carouselB
{
  padding: 0 10px 30px 10px;
  margin-top: 30px;
}

/* Control buttons  */
#quote-carouselB .carousel-control
{
  background: none;
  color: #222;
  font-size: 2.3em;
  text-shadow: none;
  margin-top: 30px;
 
}
/* Previous button  */
#quote-carouselB .carousel-control.left 
{
  left: 340px;
  padding-top: 195px;
  width: 20px;
}
/* Next button  */
#quote-carouselB .carousel-control.right 
{
  left: 370px !important;
  padding-top: 195px;
  width: 20px;
}
/* Changes the position of the indicators */
#quote-carouselB .carousel-indicators 
{
  right: 100%;
  top: auto;
  bottom: 0px;
  margin-right: -19px;
}
/* Changes the color of the indicators */
#quote-carouselB .carousel-indicators li 
{
  background: #c0c0c0;
}
#quote-carouselB .carousel-indicators .active 
{
  background: #333333;
}
#quote-carouselB img
{
  /*width: 250px;
  height: 100px*/
}


.liberebeleza{
  background-color: #a4817f;  width: 350px;; padding:6px
}


.logo{ width: 100%;}
.instagram{
  width: 45px; float:left; padding-left:3px;
}

.face{
  width: 45px; float:left; padding-right:3px;
}

.cem{ width: 100%;}


.view{
  display: inline;
}


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


  .view{
    display: none;
  }



    body {
      /*background-color: lightblue;*/
    }

    .fundo{
        background-image:url('../../assets/images/fundoTopo.jpg'); height: 100px; background-size: cover; background-position: bottom,bottom;  
    }
  

  #quem-somos{ padding-top: 65px; font-family: "Carnas W03 Medium"; color:black}

  
.minha-div0 {
  height: 10vh; /* Ajuste a altura conforme necessário */   
  display: flex;
  align-items: center;
  justify-content: center;    
}

.minha-div1.h2 {
  font-size: 16px;
  top: 0px;
  position: relative;
  height: 5vh; /* Ajuste a altura conforme necessário * 
  display: flex;
  align-items: center;
  justify-content: center; */        
}  


.subtxt{
  font-size: 24px;;
}

.subsub{
  font-size: 18px;;
}

.minha-div2 {
  
  padding-top:7px;
  height: 10vh; /* Ajuste a altura conforme necessário */      
}

.minha-div3 {
  height: 1vh; /* Ajuste a altura conforme necessário */      
}

.texto-centralizado {
  text-align: center;
  width: 100%;
  transition: all 0.3s ease-in-out;
}


.sectionOne{
  background-image:url('../../assets/images/fundosectionOne.jpg'); height: 350px; background-size:cover; background-position: right,center;    
}


.sectionTwo{
  background-image:url('../../assets/images/fundosectionTwo.jpg'); padding-top:90px;   height: 1100px;  background-size:cover; background-position: left,center;  
}



.sectionthree{  
  background-image:url('../../assets/images/fundoDepoimentos.png');   height: 1090px;  background-size:cover; background-position: top,center; 
  text-align:left; padding-bottom:0px; margin-bottom:0px; 
}

.liberebeleza{
  background-color: #a4817f;  width: 100%; padding:10px 6px;
}

    

    .navbar-brand {
      font-size: 1.7rem;  
      padding-left:20px;  
      /*font-weight: 600;*/
    }


    .logo{ width: 150px;;}





    
/* carousel */
#quote-carouselB
{
  padding: 0 10px 30px 10px;
  margin-top: 30px;
}

/* Control buttons  */
#quote-carouselB .carousel-control
{
  background: none;
  color: #222;
  font-size: 2.3em;
  text-shadow: none;
  margin-top: 30px;
 
}
/* Previous button  */
#quote-carouselB .carousel-control.left 
{
  left: 160px;
  padding-top: 400px;
  width: 20px;
}
/* Next button  */
#quote-carouselB .carousel-control.right 
{
  left: 195px !important;
  padding-top: 400px;
  width: 20px;
}
/* Changes the position of the indicators */
#quote-carouselB .carousel-indicators 
{
  right: 100%;
  top: auto;
  bottom: 0px;
  margin-right: -19px;
}





.carousel-inner2{
  padding-top:60px;
}


/* carousel */
#quote-carousel 
{
  padding: 0 10px 30px 10px;
  margin-top: 30px;
}

/* Control buttons  */
#quote-carousel .carousel-control
{
  background: none;
  color: #222;
  font-size: 2.3em;
  text-shadow: none;
  margin-top: 30px;
 
}
/* Previous button  */
#quote-carousel .carousel-control.left 
{
  left: 120px;
  padding-top: 0px;
  width: 20px;
}
/* Next button  */
#quote-carousel .carousel-control.right 
{
  left: 160px !important;
  padding-top: 0px;
  width: 20px;
}
/* Changes the position of the indicators */
#quote-carousel .carousel-indicators 
{
  right: 100%;
  top: auto;
  bottom: 0px;
  margin-right: -19px;
}
/* Changes the color of the indicators */
#quote-carousel .carousel-indicators li 
{
  background: #c0c0c0;
}
#quote-carousel .carousel-indicators2 .active 
{
  background: #333333;
}
#quote-carousel img
{
  /*width: 250px;
  height: 100px*/
}


   


}





.navbar-toggler {
  padding: 10px;
  font-size: 12px;
  line-height: 1;
  color: white;
  background-color: transparent;
  border: none;
  border-radius: 2px;
  transition: none;
}


.navbar-toggler-icon {
display: inline-block;
width: 1.5em;
height: 1.5em;
vertical-align: middle;
background-image: var(--bs-navbar-toggler-icon-bg);
background-repeat: no-repeat;
background-position: center;
background-size: 100%;
padding-top:0px;
}




.no-margin{
  padding:0px; margin:0px;
}


/* preloader */
.preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #fff;
  z-index: 999;
  display: flex;
  align-items: center;
  justify-content: center;
}

.spinner {
  color: #9F742C;
  font-size: 90px;
  text-indent: -9999em;
  overflow: hidden;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  margin: 72px auto;
  position: relative;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load6 1.7s infinite ease, round 1.7s infinite ease;
  animation: load6 1.7s infinite ease, round 1.7s infinite ease;
}

@-webkit-keyframes load6 {
  0% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  5%,
  95% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  10%,
  59% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
  }
  20% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
  }
  38% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
  }
  100% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
}

@keyframes load6 {
  0% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  5%,
  95% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  10%,
  59% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
  }
  20% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
  }
  38% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
  }
  100% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
}

@-webkit-keyframes round {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes round {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}