/*Animations*/
.fadeinleft {
    opacity:0;
    transform: translateX(200px);
    transition: all 1.3s ease-out;
}

.fadeinright{
    opacity: 0;
    transform: translateX(-200px);
    transition: all 0.8s ease-out;
}

.fadeindown{
    opacity: 0;
    transform: translateY(-100px);
    transition: all 1.2s ease-out;
}

.fade-in{
    opacity:0;
    transition: all 1.3s ease-in;
}

.active-left,.active,.active-right,.active-down{
    opacity:1;
    transform: translateX(0);
    transform: translateY(0);
}



.fadein{
opacity: 0;
}   


/* End Animations*/

body,html{
    width: 100%;
    overflow-x: hidden;
}
.navbar{
    box-shadow: none;
     
    background-color:white!important;
   font-family: "Roboto", sans-serif;
    position: relative;
    color:#606060;
 
     justify-content: space-between;
     text-align: center;


  }

  .nav-link{
   color:#606060; 
text-transform: uppercase;
  font-family: "Roboto", sans-serif;
  font-size: 18px;
margin-left: 20px;

  }

  .nav-link.active{
    color:black; 
text-transform: uppercase;
 font-family: "Roboto (woff2)", sans-serif;
  }

.nav-link:hover{
 color:#ab8a62;
}

.nav-link.active:hover{
 color:#ab8a62;
}


.background-heading{
text-align: center!important;
margin-top: 120px;
font-family: "Roboto";
text-transform: uppercase;
font: 80px;

}

.background-p{
   text-align: center!important;
   margin-bottom: 150px;
     font-family: "Lato", sans-serif;
     font-size: 30px;
}

.carousel-h{
    text-align: center!important;
    font-size: 50px;
    color: white;
      font-family: "Gilda Display", serif;


}

#nav-button{
    background-color:#ab8a62;
   color: white;
   margin-right: 30px;

}

#nav-button:hover{
   background-color:#ab7f62;
   color: white;

}


.carousel-caption {
  position: absolute;
  top: 60%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}



#aboutus-section{
    margin-top: 70px;
   
   background-color:white;
}

.aboutus-h{
    color:#ab8a62;
    margin-top: 50px;
    margin-bottom: 10px;
  font-family: "Gilda Display", serif;
 
}

.about-caption{
    color:#65676b;
      font-family: "Lato", sans-serif;
      font-size: 21px;
   
 
}

.about-p{
    font-family: "Lato", sans-serif;
   font-size: 18px;
    margin-top: 30px;
    font-size: 15px;
    margin-bottom: 25px;
    color: #65676b;
    line-height:2;
}

#aboutButton{
   background-color:#ab8a62;
   color: white;
   padding-top: 16px;
   padding-bottom: 16px;
   padding-left: 30px;
   padding-right: 30px;
}

#aboutButton:hover{
   background-color:#ab7f62;
   color: white;

}

.room-p{
    font-family: "Jost", sans-serif;
    font-size: 20px;
    color: RGB(101, 103, 107);
}

#room-section{
   margin-top: 0!important;
    background-color:white;
   
    
}
.room-h1{
 color:#ab8a62;
    margin-top: 50px;
    margin-bottom: 10px;
  font-family: "Gilda Display", serif;
}

.rooms-button{
float: right;
margin-top: 90px;
background-color:#ab8a62;
color:white;
border: none;
padding-top: 15px;
padding-bottom: 15px;
margin-right: 20px;
margin-left: 20px;

}

 .gallery-button{
float: right;
margin-top: 90px;
background-color:#ab8a62;
color:white;
border: none;
padding-top: 15px;
padding-bottom: 15px;
margin-right: 20px;
margin-left: 20px;

}


.rooms-button:hover{
  color: white;
background-color:#ab8262;

}
.item1 {
  color: white;
  border-radius: 8px;
  background: url('../img/one-bedroom.jpg')rgba(0, 0, 0, 0.35);
  background-size: cover;
  background-position: center;
  background-blend-mode: multiply;
  height: 70vh;
  display: flex;
  align-items: end;
  margin-bottom: 30px;
  margin-top: 20px;
}

.item2{
  color: white;
  border-radius: 8px;
  background: url('../img/standart-villa.jpg')rgba(0, 0, 0, 0.35);
  background-size: cover;
  background-position: center;
  background-blend-mode: multiply;
  height: 70vh;
  display: flex;
  align-items: end;
  margin-bottom: 30px;
  margin-top: 20px;
}

.contact-details{
  margin-top: 50px;
}

.item2 {
  color: white;
  border-radius: 8px;
  background: url('../img/standart-villa.jpg')rgba(0, 0, 0, 0.35);
  background-size: cover;
  background-position: center;
  background-blend-mode: multiply;
  height: 70vh;
  display: flex;
  align-items: end;
}

.room-desc{
   font-family: "Jost", sans-serif;color: rgba(255, 255, 255, 0.884);
}
.room-tittle{
      font-family: "Gilda Display", serif;
      color: rgba(255, 255, 255, 0.925);
      }

#services{
    margin-top:60px;
    background-color:#f1f1f1;

    }

.facilities-h{
  text-align: center!important;
color: #AB8A62;
font-family:"Gilda Display";
font-size: 24px;
margin-top: 55px;
margin-left:350px;
}

.hotel-services{
font-family:"Gilda Display";
color: RGB(10, 10, 10);
font-size: 50px;
margin-left:500px;
}
.card-tittle{
  color:#0A0A0A;
  font-family: "Gilda Display", serif;
  font-size: 24px;
  margin-top: 10px;

}

.card-p{
   font-family: "Jost", sans-serif;
   color:RGB(101, 103, 107);
}



.testimonial-text{
    font-family: 'Gilda Display';
    text-align: center;
}

.client-country{
  margin-bottom: 0px;
}

#testimonialCarousel .carousel-item {
    height: 40vh;
}
.clients-name{
   font-family: "Urbanist", sans-serif;
    color: white;
    font-size: 17px!important;
    margin-top: 30px;
 
  }


.test-caption{
    bottom: 0%;
}

#testimonialCarousel .fa-star{
    color:#bd945a;
margin-bottom: 50px;
   
}

#testimonialCarousel .fa-star-half-stroke{
    color:#bd945a;
}


 
.our-services {
      display: flex;
      max-width: 1200px;
      margin: 0 auto;
      padding: 20px;
    }

    .services-image {
      flex: 1;
    }

    .services-image img {
      width: 100%;
      height: auto;
      display: block;
    }

    .services-list {
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 20px;
    }

    .service-box {
      background-color: white;
      border: 1px solid #ddd;
      padding: 15px;
      margin-bottom: 15px;
      display: flex;
      align-items: center;
      gap: 15px;
      border-radius: 5px;
    }

 
    .service-icon {
      font-size: 24px;
    }

    .service-info h3 {
      margin: 0;
      font-size: 18px;
    }

    .service-info p {
      margin: 5px 0 0;
      font-size: 14px;
    }

    .footer-caption{
       font-family: "Urbanist", sans-serif;
       font-size: 17px;
       color: rgba(255, 255, 255, 0.66);
       margin-top:84px;
       line-height: 30px!important;
       margin-top: 100px;
    }

    .footer-container {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    margin-bottom: 20px;
}
#footer-section{
  padding-bottom: 80px;
  padding-top: 80px;
  background-color:#141414;
  
    color: #fff;
    padding: 40px 0;
    text-align: center;
margin-top: 0px;
background-image:url(../img/icon2.png);
background-size: 10%;
 background-repeat: no-repeat;
   background-position: right bottom;


}

.footer-section h2 {
    font-size: 1.8rem;
    margin-bottom: 15px;
}

.footer-section h3 {
    font-size: 1.2rem;
    margin-bottom: 10px;
    color: #e5e5e5;
}

.footer-menu ul {
        list-style: none;
        display: flex;
        justify-content: left;
       margin-bottom: 0px;
        border-top: 1px solid #444;
        padding-top: 30px;
      float: left;
      
      }


    .footer-menu ul li {
        margin: 0 20px;
        position: relative;
    }

    .footer-menu ul li a {
        text-decoration: none;
        color: white;
        font-size: 16px;
        font-family: "Urbanist", sans-serif;}

    .footer-menu ul li a:hover {
        color: #ccc;
    }

.footer-details{
  color: white!important;
  font-family: "Gilda Display", serif;
  font-size: 30px!important;
margin-top: 15px;
margin-bottom: 25px!important;
}


.footer-section a {
  color: white;
  text-decoration: none; 
     color: rgba(255, 255, 255, 0.66);
     line-height: 32px!important;
}

.footer-section a:hover {
  color: white;
  text-decoration: underline; 
     color: rgba(255, 255, 255, 0.797);
     text-decoration: none;
}

.services-card{
margin-left: 50px;
      background-color: white;
      
}

.services-row{
   
    margin-bottom: 50px;
    margin-top: 50px;
}

#services{
  background-color:#f1f1f1;
}

.footer-logo{
  float: left; 
  margin-left: 20px;
  font-size: 30px;
  font-family: "Gilda Display", serif;
  color: white;
  margin-top: 20px;

}

#gallery-section{
margin-top: 0px;
}

.carousel-1{
    background: url('../img/nav-background.jpg')rgba(0, 0, 0, 0.3);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-blend-mode: multiply;
    height: 100vh;
}

.carousel-2{
    background: url('../img/nav-background1.jpg')rgba(0, 0, 0, 0.3);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-blend-mode: multiply;
    height: 100vh;
}


.carousel-3{
    background: url('../img/nav-background2.jpg')rgba(0, 0, 0, 0.3);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-blend-mode: multiply;
    height: 100vh;
}

.gallery{
   color:#ab8a62;
    margin-top: 50px;
    margin-bottom: 10px;
  font-family: "Gilda Display", serif;
}

.gallery-p{
   font-family: "Jost", sans-serif;
    font-size: 20px;
    color: RGB(101, 103, 107);
}

.gallery-link{
 margin-bottom: 50px;
}

.clients-review{
font-family: "Gilda Display", serif;
  font-size: 20px;
  color:white;

 
}

.testimonials{
    background: url('../img/testimonial.jpg') rgba(0, 0, 0, 0.45);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
      background-blend-mode: multiply; 

    padding: 4em 0em;
}

#testimonal-heading{
  color: white;
font-family: "Gilda Display", serif;
  font-size: 32px;
}


.clients-country{
  color: RGB(106, 110, 113);
  font-size: 15px;
  font-family: "Poppins", sans-serif;
  margin-bottom: 0 !important;
}


.header-section2{
  height: 50vh;
    background:url(../img/about-us.jpg)rgba(0, 0, 0, 0.30);
      background-size: cover;
  background-position: center;
  background-blend-mode: multiply; 
  align-items: center;
}

.header-section3{
  height: 50vh;
    background:url(../img/aboutus-section.jpg)rgba(0, 0, 0, 0.30);
      background-size: cover;
  background-position: center;
  background-blend-mode: multiply; 
  align-items: center;
}

.header-section4{
  height: 50vh;
    background:url(../img/aboutus-section.jpg)rgba(0, 0, 0, 0.30);
      background-size: cover;
  background-position: center;
  background-blend-mode: multiply; 
  align-items: center;
}
 
.header-section5{
  height: 50vh;
    background:url(../img/contactus-section.jpg)rgba(0, 0, 0, 0.40);
      background-size: cover;
  background-position: center;
  background-blend-mode: multiply; 
  align-items: center;
}


#apartment-header{
  color: white;
 text-align: center;
padding-top: 90px;
  font-family: "Gilda Display", serif;
}

#room-1{
  margin-top: 75px;
  margin-bottom: 75px;
  }

.room1-tittle{
  color: black;
  font-family: "Gilda Display", serif;
  font-size: 36px;
  padding-top: 60px;
  padding-bottom: 20px;

}
.room-img{
background-color: #f4f1ed;
}

.room1-p{
  color:#707070;
  font-size: 17px;
     font-family: "Urbanist", sans-serif;

}

.room1-bed{
    font-family: "Urbanist", sans-serif; 
    color: #707070;
     font-size: 17px;
     padding-right: 120px;
   } 

.room2-bed{
    font-family: "Urbanist", sans-serif; 
    color: #707070;
     font-size: 17px;
     padding-right: 37px;
   

} 
.room1-details{
  height: 500px;
}


.room2-details{
  height: 500px;
}

.room1-space{
   font-family: "Urbanist", sans-serif; 
    color: #707070;
     font-size: 17px;
     padding-bottom: 30px;
     margin-right:6px;
}

.room2-space{
   font-family: "Urbanist", sans-serif; 
    color: #707070;
     font-size: 17px;
     padding-bottom: 30px;
     margin-right:1px;
}
.room1-bath{
   font-family: "Urbanist", sans-serif; 
    color: #707070;
     font-size: 17px;
     padding-right: 82px;
     padding-bottom: 30px;
     padding-top: 20px!important;
}


.room2-bath{
   font-family: "Urbanist", sans-serif; 
    color: #707070;
     font-size: 17px;
     padding-right: 82px;
     padding-bottom: 30px;
     padding-top: 20px!important;
}
.room1-air{
   font-family: "Urbanist", sans-serif; 
    color: #707070;
     font-size: 17px;
     padding-bottom: 30px;
}

.room2-air{
   font-family: "Urbanist", sans-serif; 
    color: #707070;
     font-size: 17px;
     padding-bottom: 30px;
   
}

.room1-details{
  background-color: #f4f1ed;
  padding-left: 35px;
}

.room2-details{
  background-color: #f4f1ed;
  padding-left: 35px;
}
#room-2{
  margin-top: 5px;
  margin-bottom: 20px;
}

.info{
  margin-left:60px;
  margin-bottom:20px;
}

.map{
  margin-bottom:60px;
}

@media only screen and (max-width: 870px) {
.aboutus-h{
margin-top: 25px!important;
    margin-bottom: 5px!important;
    margin-left: 10px;
 }

 .room-h1{
 color:#ab8a62;
}

.carousel-caption {

  top: 50%;
  left: 50%;

}



 .room1-bed{  
     padding-right: 57px!important;
   } 

 .room2-bath{
     padding-right: 30px;
     padding-bottom: 30px;
     padding-top: 20px!important;
}

 .room1-details{
  margin-bottom: 0!important;
}

.room1-bath{
     padding-right: 50px;
     padding-bottom: 30px;
     padding-top: 20px!important;
}

 
.room1-bed{
   
     font-size: 17px;
     padding-right: 12px;
  
} 

.room1-space{
margin-left: 10px;
}

#room-1{
  margin-top: 10px;
  margin-bottom:55px;
  }

  .room1-img{
    margin-top: 20px;
  
  }
  .footer-details{

  font-size: 30px!important;
margin-top: 20px;

}

.footer-image{
margin-left: 35px;
}
  
 .footer-caption{
 float: left;
 margin-top: 10px;
 margin-left: 7px;
    }

.room1-details{
  margin-top: 0px;
}

 .about-caption{
    margin-left: 10px;
 }
 #aboutButton{
margin-bottom: 12px;
}

.facilities-h{
font-size: 25px;
margin-top: 170px;
margin-left:15px!important;
}

.hotel-services{

font-size: 40px;
margin-left:50px;
}

#services{
    height:180vh;
  }

.item1{
  margin-bottom: 10px;
}

.item2{
  margin-bottom: 25px!important;
}

.rooms-button{
float: left;
margin-left: 0px!important;
margin-bottom: 20px;
margin-top: 10px!important
}  

.room-tittle{
      text-align: left!important;
      margin-right: 17px;
      margin-bottom: 40px;
}

.room-tittle1{

      text-align: left!important;
      margin-right: 75px;
      margin-bottom: 40px;
   
}

#testimonialCarousel .carousel-item {
   
    height: 75vh;
}

.fa-star{
  font-size: 21px;
}
 .fa-star-half-stroke{
 font-size: 21px;
}



.footer-container {
    flex-direction: column;
    align-items: flex-start;
    padding: 0 1rem;
  }

.contact-details{
   font-family: "Urbanist", sans-serif;
   font-size: 17px;
   color:rgba(255, 255, 255, 0.779)!important;
   color: white!important;
}


.adress-details{
    font-family: "Urbanist", sans-serif;
   font-size: 17px;
}
  .footer-section {
    text-align: left;
    margin-left: 20px;
  }


  .contact-email{
  color: #ffffff;
  padding-left: 45px;

}

.contact-phone{
  color: #fafafa;
 margin-left: 20px!important;
}
  .footer-menu ul {
    justify-content: flex-start;
    margin-left: 0;
    padding-left: 0;
     margin-left: 20px;
  }
   .footer-menu ul li {
    margin-right: 0px;
    margin-left: 10px;
  
  }
  .nav-menu {
margin-right: 60px!important;
}
.carousel-1{
    height: 80vh;
}
.carousel-2{
    height: 80vh;
}
.carousel-3{
    height: 80vh;
}
.nav-link{
  float: left!important;
  margin-top: 10px;
}
#nav-button{

 float: left;
 margin-left: 15px;
 margin-bottom: 15px;
}

#aboutus-section{
    margin-top: 4px!important;
   height: 80vh;
   background-color:white;
}

#apartment-header{

padding-top:200px;
  font-family: "Gilda Display", serif;
}

}




.language-selector li {
  display: inline-block;
  margin: 0 5px;
  position: relative;
}

.language-selector {
  list-style: none;

  display: flex;
  align-items: center;
}

