:root{
    --primary-color:#9e5b40;
    --primary-color-nav:#bd5831;
    --secondy-color:#da8a67;
    --secondy-color-nav1:#e8a589;
    --light-color:#D3D3D3;
    --jalapao-color:#3ce17b;
    --jalapao-color2:#1ed3af;
    --black-color:#0f0f0f;
    --navbar-color:#2c2928;
    --box-shadow1:2px 2px 10px var(--primary-color-nav);
    --cor-extra:#7fc142;
}

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/*primeira navbar header-1 INICIO*/

header .header-1{
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--light-color);
    width: 100%;
    padding: 10px 20px;
}

/* header .header-1.stick-1{
    position: fixed;
    top: 28px;
    left: 0;
    box-shadow: 0 .5px 15px #cac9c9;
    width: 100%;
    z-index: 9999;
} */

header .header-1 .logo{
    text-transform: capitalize;
    transition: all .2s linear;
    font-family: Georgia, 'Times New Roman', Times, serif, Helvetica, sans-serif;
    text-decoration: none;
    font-size: 25px;
    color:#505050;
    text-shadow: 1px 2px 5px #878585;
}

header .header-1 .logo:hover{
    transform: scale(1.1);
}

.header-1 .logo span{
    color:var(--primary-color-nav);
}

.phone{
   display: flex;
   font-size: 25px;
  
}

.phone .treme:hover{
    cursor: pointer;
    animation: tremble 0.2s infinite;
    animation-name: tremble;
}

@keyframes tremble {
    /* Definição da animação "tremble" */
    0% {
      transform: rotate(0deg); /* Define a rotação inicial do ícone como 0 graus */
      
    }
    25% {
      transform: rotate(-10deg); /* Define a rotação do ícone em 25% da animação como -10 graus */
      
    }
    75% {      transform: rotate(10deg); /* Define a rotação do ícone em 75% da animação como 10 graus */
      
    }
    100% {
      transform: rotate(0deg); /* Define a rotação final do ícone como 0 graus */
      
    }
}

.header-1 .phone .num{
    margin-left: 10px;
    font-size: 20px;
    color:#505050;
    text-decoration: none;
}

.header-1 i{
    color:var(--primary-color-nav);
}
/* 
.content{
    min-height: 130vh;
    background:url('/img/carousel-1.jpg') no-repeat;
    background-size: cover;
    background-position: center; 
} 
*/

/*prieira navbar header-1 FIM */


/*segunda navbar header-2 INICIO*/

.header-2{
    display: flex;
    align-items: center;
    justify-content: space-between;
    background:#2c2928;
    width: 100%;
    padding: 10px 20px;
}

header .header-2 .navbar ul{
    display: flex;
    align-items: center;
    justify-content: space-between;
    list-style: none;
}

header .header-2 .navbar ul li{
    margin: 10px;
}

header .header-2 .navbar ul li a{
    color:var(--light-color);
    text-decoration: none;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    font-weight: bold;
    text-transform: uppercase;
    transition: all 0.3s ease;
}

header .header-2 .navbar ul li a:hover{
   color: var(--primary-color);
   background-color:var(--light-color);
   padding: 3px;
   border-radius: .25rem;
}

header .header-2 .icons a{
    font-size: 25px;
    color: var(--light-color);
    margin: 10px;
    text-decoration: none;
    transition: all 0.3s ease;
}

header .header-2 .icons a:hover{
    color: var(--primary-color);
    border-radius: .25rem;
    transform: scale(1.2);
 
}

header .header-2 .icons .jalapa{
    color: #1ed3af;
}

header .header-2 .icons .whati{
    color:#16a945;
    font-size: 28px;
    /* background: #16a945; */
    /* padding: 3px; */
    
}
header .header-2 .icons .whati:hover{
  color:var(--light-color);

}

header .header-2 .icons .inst:hover{
    color: rgb(233, 67, 166);

}

header .header-2 .icons .facce:hover{
    color: rgb(94, 99, 246);

}

/*botao hamburguer*/
#menu{
    font-size: 30px;
    color: var(--light-color);
    cursor: pointer;
    display: none;
}

/*class da sombra da navbar*/
header .header-2.stick{
    position: fixed;
    top: 0;
    left: 0;
    box-shadow: 0 .5px 15px #cac9c9;
    width: 100%;
    z-index: 9999;
}
/*segunda navbar header-2 FIM*/

/*inicio projeto:*/

html{
    scroll-behavior: smooth;
  }
/*=====================================MARGIN DO BODY============================*/
body{
    font-family: 'Poppins', sans-serif;
    overflow-x: hidden;
    
} 

/*=====================================MARGIN DO BODY============================*/

.flex{
    display: flex;

}

.flex_space{
    display: flex;
    justify-content: space-between;
}

button{
    border: none;
    background: none;
    outline: none;
    transition: 0.5s;
    cursor: pointer;
}

.primary-btn{
    padding: 15px 40px;
    background: var(--primary-color-nav);
    font-weight: bold;
    color: white;
    font-size: .8rem;
}

.primary-btn:hover{
    color: var(--primary-color-nav);
    text-transform: uppercase;
    background: #2c2928;
    box-shadow: 2px 2px 10px var(--primary-color-nav);
    
}

.secondary-btn{
    padding: 15px 40px;
    background:none;
    border: 2px solid white;
    font-weight: bold;
    color: white;
    letter-spacing: .5px;
    font-size: .8rem;
}

.secondary-btn:hover{
    background: #2c2928;
    box-shadow: 2px 2px 10px var(--primary-color-nav);
    border: 2px solid var(--primary-color-nav);
}

.container{
    max-width: 85%;
    margin: auto;
}
/*testando mappapapapa==================*/
.container-1{
    display: flex;
    flex-direction: column;
}

.container-1 .heading{
    margin-left: 7.5%;
}

.container-1 .heading h1{
    margin-top: 25px;
}

.container-1 .flex{
    justify-content: center;
}
.container-1 .flex .grid3 iframe{
    width: 100vw;
}
/*testando mappapapapa   FFFIIIMMMMMMMMMMMMMMMMMMMMMMMMMMMM==================*/





h1, h2{
    font-family: sans-serif;
    font-weight: 400;
}


/*section home INICIO*/

.home{
    height: 100vh;
    color: #fff;
}

.home img{
    width: 100%;
    height: 100vh;
    object-fit: cover;
}

.home .text{
    position: absolute;
    top: 49%;
    left: 5%;
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: .3rem;
    /* max-width: 70%; */
}

.home .text h1{
    font-size: 80px;
    font-family: serif;
    font-weight: 400;
    /* width: 80%; */
    text-shadow: 0px .5px 10px #8c8c8c;
    color: #ffffff;
    margin-left: 10px;
}

.home p{
    margin: 20px 10px;
    font-size: 1rem;
    text-shadow: 0px .5px 10px #8c8c8c;
    /* max-width: 70%; */
}

.home button{
    margin-right: 20px;
    border-radius: .3rem;
    margin-bottom: 10px;
}

.home .espaco{
    margin-left: 10px;
   
 }
/*setas do carousel =====================================*/

.owl-carousel1 .owl-nav .owl-prev,
.owl-carousel1 .owl-nav .owl-next{
    position: absolute;
    top: 40%;
    height: 50px;
    width: 50px;
    background: rgba(0, 0, 0, 0.5) !important;
}

.owl-carousel1 .owl-nav .owl-prev:hover{
    background: rgba(189, 88, 49, .5) !important;
}
.owl-carousel1 .owl-nav .owl-next:hover{
    background: rgba(189, 88, 49, .5) !important;
}



.owl-carousel1 .owl-nav .owl-prev{
    left: 0;
}

.owl-carousel1 .owl-nav .owl-next{
    right: 0;
}

 /*setas do carousel end*/

/*section home FIM*/

/*reservas INICIO*/

.nomezinho {
    width: 443px;
    display: flex;
    color: rgb(185, 158, 158);
    justify-content: space-between;
    font-size: 14px;
    margin-top: 2px;
    }

.grid{
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-gap: 20px;
}

input{
    outline: none;
    border: none;
    width: 100%;
}

.book{
    padding: 40px 0;
    background: #282834;
    color: #fff;
}

h1{
    font-family: serif;
    margin-bottom: 10px;
}

.book h1{
    font-size: 28px;
}

.book h1 span{
    /* color: #7fc142; */
    color: var(--primary-color-nav);
}

.book input{
    padding: 20px;
    border-radius: .3rem;
}

.book input:nth-last-child(1){
    background: var(--primary-color-nav);
    color: var(--light-color);
    transition: all .3s ease;
    text-transform: uppercase;
    font-weight: bold;
}


.book input:nth-last-child(1):hover{
    background: var(--navbar-color);
    color: var(--light-color);
    box-shadow: var(--box-shadow1);
}

/*reservas FIM*/


/*sobre INICIO*/
.left, .right{
    width: 50%;
    padding: 30px;
}

.right img{
    width: 100%;
    height: 80%;
    object-fit: hidden;
}

.top{
    margin-top: 80px;
}


.mtop{
    margin-top: 40px;
}

.heading h1{
    font-size: 100px;
    font-weight: 500;
    opacity: 0.1;
    font-family: serif;
    position: absolute;
    top: -30px;
}

.heading h2{
    margin: 30px 0;
    font-size: 45px;
    font-family: serif;
    font-weight: 400;
}

.about .heading h1{
    top: 55px;
}

.about{
    position: relative;
}

.about .left{
    margin-top: 30px;
}

.about h2 span{
    color: var(--primary-color-nav);
}

.about p{
    font-size: 15px;
    text-align: justify;
}


.about button{
    margin: 30px 0;

}

/*sobre FIM*/

/*marketing counter INICIO*/

.counter{
background: url('/img/dunas-4.jpg');
background-size: cover;
background-repeat: no-repeat;
height: 40vh;
width: 100%;
color: var(--light-color);
/* margin-top: 20px; */
}

.counter .grid{
    grid-template-columns: repeat(4,1fr);
    text-align: center;
    place-items: center;
    padding-top: 60px;
}

.counter h1{
    font-size: 50px;
    color: #282834;
    background: #fff;
    opacity: 0.5;
    border-radius: .3rem;
}

.counter span{
    font-size: 20px;
    color: var(--light-color);
    text-shadow: 2px 2px 10px #0c0c0c;
}
.counter hr{
    width: 90%;
    margin: 10px auto;
    background: var(--primary-color-nav);
    height: 3px;
    border: none;
}
/*marketing counter FIM*/


/*quartos INICIO*/


.rooms{
    position: relative;
 
}

.rooms .sombra{
    /* box-shadow: 4px 4px 14px rgba(0, 0, 0, 0.4); */

    box-shadow: -2px 0px 10px rgba(0, 0, 0, 0.2),
                 2px 0px 10px rgba(0, 0, 0, 0.2);
}

.rooms .text{
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-top: none;
    padding: 30px;
    
}

.rooms span{
    color: var(--primary-color-nav);
    
}

.rooms i{
    font-size: 12px;
    color: #fbb234;
    margin: 15px 0;
    margin-right: 5px;
}

.rooms p{
    margin: 20px 0;
    opacity: 0.7;
}

.rooms h3{
    font-size: 30px;
    line-height: 20px;
    margin-left: 20px;
    font-weight: 500;
    color: var(--primary-color-nav);
}

.rooms h3 span{
    font-size: 15px;
    font-weight: 400;
    color: var(--primary-color);
    opacity: .9;
}


/*setas do carousel 2 ==================================*/


.owl-carousel2 .owl-nav .owl-prev,
.owl-carousel2 .owl-nav .owl-next{
    position: absolute;
    top: -20%;
    height: 50px;
    width: 50px;
    background: rgba(0, 0, 0, 0.5) !important;
    
}

.owl-carousel2 .owl-nav .owl-prev i,
.owl-carousel2 .owl-nav .owl-next i{
    color: var(--light-color);
}

.owl-carousel2 .owl-nav .owl-prev:hover{
    background: rgba(189, 88, 49, .5) !important;
}

.owl-carousel2 .owl-nav .owl-next:hover{
    background: rgba(189, 88, 49, .5) !important;
}

.owl-carousel2 .owl-nav .owl-prev{
    left: 90%;
}

.owl-carousel2 .owl-nav .owl-next{
    right: 0;
}
/*setas do carousel 2 end*/

/*quartos FIM*/

/*galeria INICIO*/

.gallery{
    position: relative;
}

.gallery img{
    width: 100%;
    height: 100%;
}

.gallery .img{
    position: relative;
    
}

.gallery .img::after{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(189, 88, 49, 0.86);
    width: 395px;
    height: 350px;
    z-index: 2;
    opacity: 0;
    transition: 0.5s;
}

.overlay{
    position: absolute;
    top: 35%;
    left: 33%;
    z-index: 3;
    text-align: center;
    color:white;
    opacity: 0;
    transition: 0.5s;
}

@media(max-width: 500px){
    .overlay{
        display: none;
    }
}

.gallery span{
width: 50px;
height: 50px;
line-height: 50px;
border-radius: 50%;
border: 2px solid white;
text-decoration: none;
}

.gallery h2 span{
    color: var(--primary-color-nav);
}

.overlay h3{
    margin-top:20px;
    font-weight: 500;
}

.gallery a{
    text-decoration: none;
    color: white;
}

.gallery .items:hover .overlay,
.gallery .items:hover .img::after{
    opacity: 1;
    cursor: pointer;
}


/*setas do carousel3-----------------------------------*/
.owl-carousel3 .owl-nav .owl-prev,
.owl-carousel3 .owl-nav .owl-next{
    position: absolute;
    top: -40%;
    height: 50px;
    width: 50px;
    background: rgba(0, 0, 0, 0.5) !important;
    
}

.owl-carousel3 .owl-nav .owl-prev i,
.owl-carousel3 .owl-nav .owl-next i{
    color: var(--light-color);
}

.owl-carousel3 .owl-nav .owl-prev:hover{
    background: rgba(189, 88, 49, .5) !important;
}

.owl-carousel3 .owl-nav .owl-next:hover{
    background: rgba(189, 88, 49, .5) !important;
}

.owl-carousel3 .owl-nav .owl-prev{
    left: 84.4%;
}

.owl-carousel3 .owl-nav .owl-next{
    right: 7%;
}
/*setas do carousel3-----------------------------------*/
/*galeria FIM*/

/*serviços INICIO*/

.services{
    position: relative;
}

.grid2{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-gap:20px;
}

.services .left{
    padding: 30px 0;
}

.services .box{
    border: 1px solid rgba(0, 0, 0, 0.1);
    text-align: center;
    transition: 0.5s;
    padding: 20px;
}

.services .box .text{
    padding: 30px 0;
    border: 1px dashed #fff;
}
.services span{
    color: var(--primary-color-nav);
}
.services i{
    font-size: 50px;
    color: var(--primary-color-nav);
    transition: 0.5s;
}

.services h3{
    font-size: 20px;
    font-weight: 400;
    margin-top: 20px;
    transition: 0.5s;
}

.services  img{
    width: 100%;
    height: 100%;
}

.services .box:hover{
    background:var(--primary-color-nav);
    color: #fff;
    cursor: pointer;
}

.services .box:hover i,
.services .box:hover h3{
    color: #fff;
}

/*serviços FIM*/


/*comentarios INICIO*/

.Customer{
background-image: url('/img/areaee.jpg');
background-size:cover;
background-repeat: no-repeat;
height: 90vh;
width: 100%;
color: #fff;
text-align: center;
}

.Customer .container{
    max-width: 70%;
}

.Customer .item{
    padding: 10% 0;
}

.Customer i{

    width: 100px;
    height: 100px;
    background: rgba(189, 88, 49, 0.8);
    line-height: 100px;
    border-radius: 50%;
    font-size: 50px;
    margin-bottom: 50px;
}

/*class do texto dos comentarios*/

.Customer p{
    line-height: 24px;
    padding-bottom: 20px;
    background-color: rgba(38, 38, 38, 0.7);
    border-radius: .3rem;
}

/*class do texto dos comentarios*/

.Customer h3{
    margin-top:24px;
    color: var(--primary-color-nav);
}

.Customer span{
    font-size: 15px;
}
/*botoes de navagação dos comentarios*/
.owl-carousel4 .owl-dots{
    position: absolute;
    bottom: 70px;
    left: 46.6%;
}
/*botoes de navagação dos comentarios*/

.owl-carousel4 .owl-dots i{
    color: var(--primary-color-nav);
}

.owl-carousel4 .owl-dots i:hover{
    color: var(--primary-color-nav) !important;
}

.owl-carousel4 span{
    border: 2px solid #fff;
    background: transparent !important;
    
}

.owl-carousel4 .active span{
    background: var(--primary-color-nav)!important;
    border: 2px solid var(--primary-color);
}

/*comentarios FIM*/

/*blog INICIO*/
.news{
position:relative;
}

.news i{
    color: var(--primary-color-nav);
    text-transform: capitalize;
    font-size: 18px;
}

.news label{
    margin-top: 14px;
    margin-right: 20px;
}

.news .left{
    padding: 30px 0;
    width: 65%;
}

.news .right{
    width: 35%;
}

.news img{
    
    width: 100%;
    height: 214px;
    object-fit: cover;
    
   
}

.news .items p{
    padding-top: 10px;
    border-top: 1px solid rgba(0, 0, 0, 0.3);
}

.news .box{
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    padding: 40px 0;
}

.news .box:nth-child(1){
    padding: 0;
}

.news .box:nth-last-child(1){
    border-bottom: none;
}

.news .box img{
    width: 110px;
    height: 110px;
   
}

.news .stext{
    padding: 0 0 0 20px;
}

/*blog FIM*/

/*se inscreva INICIO*/
.newsletter{
    position: relative;
}

.newsletter .container{
    background: var(--primary-color-nav);
    padding: 40px 30px;
    position: absolute;
    top: -70px;
    left: 8%;
    width: 100%;
    border-radius: .3rem;
}

.newsletter h1{
    width: 100%;
    font-size: 30px;
    color: #fff;
    margin-top: 10px;
}

.newsletter input{
    padding: 20px;
    border-radius: .3rem;
    
}

.newsletter .bt{
    background:#fff;
    border-radius: .3rem;
    transition: all 0.3s ease;
}

.newsletter .bt:hover{
    cursor: pointer;
    color:var(--primary-color-nav);
    background: var(--navbar-color);
    box-shadow: 1px 1px 10px #fff;
}

.newsletter input:nth-last-child(2){
    width: 80%;
    background:#fff;
}

.newsletter input:nth-last-child(1){
    margin-left: 20px;
    width: 30%;
    text-align: center;
    font-weight: bold;
    text-transform: uppercase;
}

/*se inscreva FIM*/


/*footer INICIO*/
footer{
    background: #282834;
    color: #b6b7b9;
    padding: 10% 0 5% 0;
}

footer .grid{
    grid-template-columns: 6fr 3fr 3fr;
}

footer p{
    color:#b6b7b9;
    font-size: 15px;
    line-height: 25px;
}

footer .icon i{
    margin: 20px 20px 20px 0;
    color:#b6b7b9 ;
}

footer h2{
    color: #fff;
    margin-bottom: 10px;
}
footer li{
       
    list-style: none;
    margin-bottom: 12px;
    transition: all 0.5s ease;
    
}

footer li a{
    text-decoration: none;
    color:var(--primary-color-nav);
    font-size: 16px;
    transition: all 0.5s ease;
    
    
}
footer li:hover{
    transform: rotateY(15deg);
}

footer li a:hover{
    color: #fff;
    

}

footer i{
    color: var(--primary-color-nav);
    margin: 20px 0;
    margin-right: 20px;
}

footer .icon i{
    color:var(--primary-color-nav);
    font-size: 24px;
    transition: all 0.3s ease;
}

footer .icon i:hover{
    transform: rotate(360deg);
    color: #fff;

}

footer label{
    margin: 20px 0;
    color: inherit;
    text-decoration: none;
}

.legal{
    text-align: center;
    padding: 15px 0;
    background: #282834;
    color: #b6b7b9;
    border-top: 1px solid rgba(255, 255, 2550, 0.2);
}

.legal a{
    font-size: 20px;
    text-decoration: none;
    color: var(--primary-color-nav);
}


/*footer FIM*/

















/*==================================responsive navbar INICIO======================*/

@media only screen and (max-width:768px){
    header .header-2 #menu{
        display: block;
        animation-duration: .2s;
        animation-iteration-count: 7;
        animation-name: tremble;
       
    }

    /*carousel3 galeria */
    .owl-carousel3 .owl-nav .owl-prev{
        left: 7%;
    }
    
    .owl-carousel3 .owl-nav .owl-next{
        right: 7%;
    }
    .owl-carousel3 .owl-nav .owl-prev,
    .owl-carousel3 .owl-nav .owl-next{
        top: 38%;
}
/*carousel3 galeria end*/

    header .header-2 .navbar{
        position: fixed;
        top: -1000px; /*faz a list mobile sumir*/
        left: 50%;
        transform: translate(-50%, -50%);
        opacity: 0;
        transition: all .3s linear;
        z-index: 999;
    }


    /*class da navbar mobile*/
    header .header-2 .navbar ul{
        flex-flow: column;
        width: 250px;
        border-radius: 5px;
        padding: 30px 10px;
        background:var(--primary-color);
        background-position: center center;
        background-size: cover;
        box-shadow: 0 0 0 100vh rgba(0,0,0, .5),
        0 3px 5px #000;
        /* z-index: 999; */
        
    }

    header .header-2 .navbar ul li{
        width: 100%;
        text-align: center;
        
    }

    header .header-2 .navbar ul li a{
        font-size: 20px;
        display: block;
        
    }

    header .header-2 .navbar.nav-toggle{
        top: 50%;
        opacity: 1;
        transition: all .3s ease;

    }

    .home .text{
        position: absolute;
        top: 65%;
        left: 8%;
        background-color: rgba(0, 0, 0, 0.5);
        
    }

    .home .text h1{
        font-size: 60px;
        font-family: serif;
        font-weight: 400;
        /* width: 80%; */
        text-shadow: 0px .5px 10px #8c8c8c;
        
        color: #ffffff;
        margin-left: 10px;
    }

    .home p{
        margin: 20px 10px;
        font-size: 1rem;
        text-shadow: 0px .5px 10px #8c8c8c;
    }

.home .mobile-text-1{
  left: 14%;
}

.home .mobile-text-3{
  left: 13%;
}


/*ajuste novo ----------*/
.home{
    color: #fff;
    height: 60vh;
   
}

.home img{
    width: 100%;
    height: 60vh;
}

/*jean----------------*/
.home .text{
    top: 60%;
}

/*jean----------------*/

.left, .right{
    width: 100%;
}


.book h1{
    margin-bottom: 20px;
    
}

.container.flex,
.book .flex_space{
    flex-direction: column;

}

.book .grid{
    grid-template-columns: repeat(3, 1fr);
}

.counter .grid{
    grid-template-columns: repeat(2, 1fr);
}

.owl-carousel2 .owl-nav .owl-prev{
    left: 80%;
}

/*camada por cima da foto da galeria*/
.gallery .img::after{
    display: none;
}


.overlay{
    position: absolute;
    top: 55%;
    left: 43%;
    z-index: 3;
    text-align: center;
    color:var(--primary-color-nav);
    opacity: 0;
    transition: 0.5s;
}

.gallery span{
    width: 50px;
    height: 50px;
    line-height: 50px;
    border-radius: 50%;
    border: 2px solid #fff;
    text-decoration: none;
    color:#fff;
    }

    /*camada por cima da foto da galeria*/


    .services .flex_space{
        flex-direction: column;
    }

    .Customer{
        height: 60vh;
    }

    
    .owl-carousel4 .owl-dots{
        bottom: 0;
        left: 43.5%;
       
    }

    .Customer h3{
        /* margin-top:20px; */
        color: var(--primary-color-nav);
        text-shadow:1px 0px 1px rgba(0, 0, 0, 0.6);
    }

    .news .content.flex{
        flex-direction: column;
    }

    .news .left{
        padding: 30px 0;
        width: 100%;
    } 

    .news .right{
        width: 100%;
    }

    .newsletter{
        position: relative;
        background: var(--primary-color-nav);
    }

    .newsletter .container{
       top: 0;
       left: 0;
       width: 100%;
       padding: 40px 30px;
       position: relative; 
    }

    .newsletter .flex_space{
        flex-direction: column;
    }

    .newsletter input:nth-last-child(2){
        margin: 20px 0;
        width: 100%;
    }

    .newsletter input:nth-last-child(1){
        margin: 0;
        
    }
    footer .grid{
        grid-template-columns: repeat(1, 1fr);
    }


/*aluste novo ----------*/





 /* .home .frase-1{
vivencie um experiencia
    
 }
 .home .frase-2{
relaxe apos um dia

 }
 .home .frase-3{
descubra a beleza

 } */

}

@media (max-width: 620px){    /*======================================================620px*/
    header .header-1{
        flex-flow: column;
    }
    .phone{
        padding-top: .5rem;
    }

    .home .text{
        position: absolute;
        top: 58%;
        left: 5%;
        background:none;
        border-radius: .3rem;
        /* max-width: 70%; */
    }

    .home .mobile-text-1{
        left: 3%;
      }

    .home img{
        width: 100%;
        object-fit: cover;
        height: 100vh;
    }

    
    .book{
        margin-top: 65%;
        padding: 40px 0;
        overflow-x: hidden;
        /* background: #282834;
        color: #fff; */
    }

    
}






@media (max-width: 500px){    /*========================================================= max-width 500px*/
    .nomezinho {
        width: 190px;
      
        /* margin-right: 20px; */
        font-size: 12px;
        margin-top: 2px;
        }
    
    
    header .header-1{
        flex-flow: column;
    }
    .phone{
        padding-top: .5rem;
    }

    .home .text{
        position: absolute;
        top: 58%;
        left: 0%;
        /* background-color: rgba(0, 0, 0, 0.5); */
        background:none;
        border-radius: .3rem;
        
    }

    .home img{
        width: 100%;
        object-fit: cover;
        height: 100vh;
    }


    /*=*/

    .heading h1{
        font-size: 65px;
        /* font-weight: 500; */
        line-height: 66px;
        opacity: 0.1;
        font-family: serif;
        position: absolute;
        top: -20px;
        left:13% ;
    }

    .container-1 .heading h1{
        margin-left:-30px ;
        margin-top: 35px;
    }

    .right img{
        width: 100%;
        height: 100%;
       
    }

    /*marketing */

    .counter{
        overflow: hidden;
     
        }
        
    .counter h1{
        
        font-size: 30px;
   
    }

    .book{
        margin-top: 80%;
        padding: 40px 0;
        overflow-x: hidden;
   
    }
    
    .book h1 span{
        /* color: #7fc142; */
        color: var(--primary-color-nav);
    }
    
    .book input{
        padding: 10px;
        border-radius: .3rem;
    }

    .owl-carousel2 .owl-nav .owl-prev{
    left: 66%;
        
    }

    .owl-carousel2 .owl-nav .owl-prev,
    .owl-carousel2 .owl-nav .owl-next{
      top: -15%;

    }

    .overlay{
      
        left: 37%;
    
    }

    .grid2{
        /* display: grid; */
        grid-template-columns: repeat(1,1fr);
        
        grid-gap:20px;
    }

    .right{
        width: 100%;
        padding: 0;
    }
    
    .right img{
        width: 100%;
        height: 100%;
    }
    /*marketing end */

    /*customer comentarios INICIO*/
    

/*class do texto dos comentarios*/

.Customer h3{
    margin-top:2px;
    color: var(--primary-color-nav);
}


/*botoes de navagação dos comentarios*/
.owl-carousel4 .owl-dots{
    position: absolute;
    bottom: 6px;
    left: 38%;
}
    /*customer comentarios FIM*/
    
}

@media (max-width: 400px){
    header .header-2 .navbar.nav-toggle{
        top: 43%;
        left: 36.3%;
        opacity: 1;
        transition: all .3s ease;

    }
    header .header-2 .navbar{
        position: fixed;
        /* top: -1000px;  */
        left: 50%;
        transform: translate(-50%, -50%);
        opacity: 0;
        transition: all .3s linear;
        z-index: 999;
    }
    header .header-2.stick{
        position: fixed;
        top: 0;
        left: 0;
        box-shadow: 0 .5px 15px #cac9c9;
        width: 100%;
        z-index: 9999;
    }
}

@media (max-width: 376px){
    .owl-carousel2 .owl-nav .owl-prev{
        left: 71%;
        
            
        }
    .owl-carousel2 .owl-nav .owl-next{
        right: -8%;
            
        }

        .rooms h3{
            font-size: 27px;
       
        }

        header .header-2 .navbar.nav-toggle{
            top: 43%;
            left: 50%;
        }

}

@media (max-width: 394px){
    header .header-2 .navbar.nav-toggle{
        top: 43%;
        left: 50%;
    }
}

@media (max-width: 361px){
    .rooms h3{
        font-size: 22px;
   
    }
}


/* @media (max-width: 450px){    
    .book{
        margin-top: 80%;
        padding: 40px 0;
        overflow-x: hidden;
        background: #282834;
        color: #fff;
    }
} */

/*responsive navbar FIM*/