@import url('https://fonts.googleapis.com/css?family=Raleway&display=swap');
@import url('https://fonts.googleapis.com/css?family=Quicksand&display=swap');
@import url('https://fonts.googleapis.com/css?family=Dancing+Script&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Inconsolata:wght@200..900&family=Jost:ital,wght@0,100..900;1,100..900&family=Kalnia:wght@100..700&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');

html, body {
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    overflow-x: hidden !important;
}
h1,h2,h3,h4,h5,h6{
    font-family: "Playfair Display", serif;
}

p{
    font-family: Quicksand;
}

.navbar{
    padding: 2px;
    background: white;
}

.navbar li a{
    margin: 0 15px;
    font-family: Raleway;
    color: rgb(173, 129, 78);
    font-weight: 500;
}

.carousel-caption {
    margin-bottom: 250px;
}

.carousel-1{
    background: url('../img/img1.jpg') rgba(0, 0, 0, 0.7);
    background-size: cover;
    height: 750px;
    background-position: center;
    background-blend-mode: multiply;
}

.carousel-2{
    background: url('../img/room1.jpg') rgba(0, 0, 0, 0.7);
    background-size: cover;
    height: 750px;
    background-position: center;
    background-blend-mode: multiply;
}
.carousel-3{
    background: url('../img/img2.jpg') rgba(0, 0, 0, 0.7);
    background-size: cover;
    height: 750px;
    background-position: center;
    background-blend-mode: multiply;
}

.cap-btn{
    background-color: #b99470;
    padding: 15px 40px;
    border-radius: 0;
    color: white;
    font-size: 17px;
    transition-duration: 0.6s;
}

.cap-btn:hover{
    background-color: #8f6d4c;
    scale: 0.9;
    transition-duration: 0.6s;
    color: white;
    
}

#header-service{
    
    z-index: 1!important;
   
    background-color: white;
}

.btn-contact{
    background-color: #b99470;
    padding: 30px 50px;
    border-radius: 0;
    color: white;
    font-size: 17px;
}


.service-box{
    border: 5px solid #ca9c6e;
    border-style: groove;
    padding: 10px 18px;
    transition-duration:0.5s ;
}

.service-box:hover{
    scale: 0.85;
    transition-duration:0.5s ;
    border-style: dashed;
}

.cards-wrapper{
    display: flex;
}

.card{
    margin: 0 20px auto;
    width: calc(100%3);
    border: 1px solid #ca9c6ea8;
    border-radius: 0;
}

.card-img-top{
    border-radius: 0;
}
.ratings {
    margin-top: 70px;
    margin-bottom: 0px;
  }
     .ratings h1{
  font-size: 90px;
  font-family: 'Cormorant Garamond', serif;
  color: #B78932;
     }
     .facilities h1{

        font-size: 130px;
        color: #b9947037;
        font-weight: 900;
        position: relative;
      }
    
      .rooms-text1{
        margin-top: -80px;
        color: white;
        z-index: 10;
      }
      .facilities{
        padding-top: 100px;
        padding-bottom: 100px;
        background: url('../photos/4e8d5dca-6904-488f-b059-ca7b3fe0e881.jpg') rgba(20, 19, 19, 0.733) ;
        background-attachment: fixed;
        background-position:center;
        background-size: cover;
        background-repeat: no-repeat;
        background-blend-mode: multiply;
    
        justify-content: center !important;
        text-align: center !important;
        align-items: center !important;
      
      }
      
      div.facility-box{
        position: relative;
        margin-left: 70px;
        height: 150px;
        width: 150px;
        background: white !important;
       justify-content: center ;
      padding: 30px;
       align-items: center;
       text-align: center;
    
        -webkit-box-shadow: 3px 3px 10px 3px #dddddd;
        -moz-box-shadow: 3px 3px 10px 3px #dddddd;
        box-shadow: 3px 3px 10px 3px #dddddd;
      }
      .circle-icon{
        background: #b9947077;
        padding: 30px;
        border-radius: 50px;
        border-top-left-radius: 0px !important;
        
      }
      .circle-icon1{
        background: #b9947077;
        padding: 20px;
        border-radius: 50px;
      }
      .circle-icon2{
        background: #b9947077;
        padding: 30px;
        border-radius: 50px;
        border-top-right-radius: 0px !important;
      }
      .circle-icon:hover{
        background: #3e565abd;
        color: white;
        transition: background 0.4s ease-in-out;
        transition: color 0.4s ease-in-out;
          }
          .circle-icon1:hover{
            background: #3e565abd;
            color: white;
            transition: background 0.4s ease-in-out;
            transition: color 0.4s ease-in-out;
              }
     .circle-icon2:hover{
      background: #3e565abd;
      color: white;
      transition: background 0.4s ease-in-out;
      transition: color 0.4s ease-in-out;
      }
        
    
@media screen and (max-width: 567px) {

    .card:not(:first-child){
        display: none;
    }
    .card{
        width: 100%;
    }
}

.prev-1{
    background-color: #ca9c6e;
    width: 6vh;
    height: 6vh;
    padding-bottom: 8px;
    border-radius: 50%;
    top: 50%;
    margin-right: 45px;
}

.next-1{
    background-color: #ca9c6e;
    width: 6vh;
    height: 6vh;
    padding-bottom: 8px;
    border-radius: 50%;
    top: 50%;
    margin-left: 45px;
}

#testimonials{
    background: url('../img/testimonials-side.jpg');
    background-attachment: scroll;
    background-position: left;
    background-repeat: no-repeat;
    background-color:#f0f8ffc5 ;
    
}
@media only screen and (max-width: 600px) {
    #testimonials {
        background: none;
    }
  }

#gallery{
    padding-top: 100px;
    background-color: #f2f2f3;
    text-align: center;
}


.gallery{
    text-shadow: -50px 20px 5px rgba(230, 230, 230, 0.26);
}


.shadow-room{
     
    box-shadow: inset  10px #f8a100;
  
}

@media(max-width:990px){
     
  .facilities h1{
    font-size:80px; 
  }
    .ratings h1{
        font-size: 30px;
        font-family: 'Cormorant Garamond', serif;
           }
           .ratings h6{
            font-size: 11px;
            font-family: 'Cormorant Garamond', serif;
            font-weight: normal;
               }
}  
.img-box {
  box-sizing: content-box;

  overflow: hidden;
  display: inline-block;
  color: white;
  position: relative;
  background-color: white;
}
.img-box:hover img { 
  transform: scale(1.1);
  transition: 1s;
} 

.room-content{
  background: #ffffff;
  color: #000000;
  padding: 30px;
}

.testimonial-box{
    padding: 30px !important;
    background-color: #dddddd78;
    color: white !important;
}


@keyframes scroll {
    0% {
      transform: translateX(0);
   }
    100% {
      transform: translateX(calc(-250px * 7));
   }
 }
  .slider {
    background: #211C18;
    height: 300px;
    margin: auto;
    overflow: hidden;
    position: relative;
 }
  .slider::before, .slider::after {
    content: "";
    height: 300px;
    position: absolute;
    width: 300px;
    z-index: 2;
 }
  .slider::after {
    right: 0;
    top: 0;
    transform: rotateZ(180deg);
 }
  .slider::before {
    left: 0;
    top: 0;
 }
  .slider .slide-track {
    animation: scroll 60s linear infinite;
    display: flex;
 }
  .slider .slide {
    height: 300px;
    width: 300px;
 }