@import "room.css";
@import "gallery.css";
@import "about.css";
@import "auth.css";


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

body {
    overflow-x:hidden; 
    font-family: 'Tai Heritage Pro', serif;    
}

h3 {
    letter-spacing:3px;
    font-size: 3rem;
    font-family: 'Tai Heritage Pro', serif;}

p {
    font-size: 1.2rem;
    text-align: justify;
    text-justify: inter-word; 
}

h4 {
    font-size: 3rem;
    font-family: 'Tai Heritage Pro', serif;
        letter-spacing: 1.6px;
}

h5,
h2 {
    font-size:30px;
    font-family: 'Tai Heritage Pro', serif;
        letter-spacing: 1.6px;
    color:#2c3e50;
}

span {
    color:#e1b12c;
    font-size:2rem;
    font-family: 'Tai Heritage Pro', serif;
        letter-spacing:1.6px;
}

h3,
h4 {
    color: #30336b;
}

.read {
    font-size: 1.2rem;
    color:#2f3640;
    text-decoration-color: #e1b12c;
    padding:4px;
}

a:hover {
    color:#487eb0;
}


.text-area {
    font-size: 1.2rem;
    letter-spacing: 1px;
}

input {
    outline:none;
    border:none;
}

.form-box {
    border-bottom: 1px solid #eccc68;
}




/* css design for navigation */
.link{
    letter-spacing: 2px;
    color:#30336b;
    font-size:10px;
    margin-right: 20px;
}

.head-navigation {
    letter-spacing:2px;
}

.head-navigation:hover {
    border-bottom:2px solid #30336b;
}

.nav-link:hover {
    color:#30336b;
}


.contact-button {
    background-color:#CAD3C8;
    color:#563268;;
    text-decoration:none;
    padding: 10px;
    font-weight:500;
    letter-spacing:2px;
    transition:all 1s ease-in-out;
}

.contact-button:hover {
    background-color:#30336b;
    color:#fff;
}

#navigation:hover {
    padding-top: 5px;
}

/* end of navigation */

.wallpaper-section {
    background-size: cover;
    background-color: grey;
    background-blend-mode: multiply;
    background-repeat: no-repeat;
    background-position: center;
    animation: breath 2s ease-in-out;
    height: 60vh;
    width: 100%;
    position: relative;
    overflow-x:hidden;
}

.social {
    background-size: cover;
    background-color: #3742fa;
    opacity: 0.8;
    background-blend-mode: multiply;
    background-repeat: no-repeat;
    background-position: center;
    animation: breath 2s ease-in-out;
}

.wallpaper-text {
    animation: fade 4s ease-in-out;
}


.wallpaper-box {
    margin:9% auto;
}
.input-field{
    position:relative;
}

.calender {
    position:absolute;
    top: 8px;
    left:85%;
}

.check-button {
    background-color:#30336b;
}

.check-button:hover {
   background-color:#192a56;
   transition: all 0.5s ease-in-out;
}


/* slide show animation */
@keyframes breath {
    from { 
      transform: scale(1.5);
    }
    to {
      transform: scale(1)
    }
  }

 @keyframes slide {
    0% {
      transform: translateX(0);
    }
    50% {
      transform: translateX(100%);
    }
    100% {
      transform: translateX(0);
    }
 }

  @keyframes fade {
    0% {
      opacity:0;
    }
    50% {
      opacity:0.5;
    }
    100% {
      opacity:1;
    }
  }

/* end of animation  */

.about p,
.about h3 {
    animation: fade 4s ease-in-out;
}

.about img {
    animation: breath 2s ease-in-out;
}



/* amenities */
.amenity img {
    animation: fade 2s ease-in-out;
}

.view-button {
    border: 1px dashed #30336b;
    color: #30336b;
    animation: slide 3s ease-in-out;
}

.view-button:hover {
    background-color: #30336b;
    color: white;
    opacity: 0.85;
    transition: all 0.5s ease-in-out;
}

.services li {
    line-height: 2rem;
}