@import url('https://fonts.googleapis.com/css2?family=Artifika&display=swap');

@import url("https://p.typekit.net/p.css?s=1&k=zxb0cdo&ht=tk&f=47876.47878.47879.47880.47881.47884.47885&a=61849065&app=typekit&e=css");

body{
margin:0;
font-family:Poppins,sans-serif;
}
.title3 {

font-size:36px; color:#333;
padding-bottom:60px; text-align:Center; line-height:34px;
}
.title2 {

font-size:30px; color:#333; padding-bottom:10px; margin:15px 0; font-weight:normal;
 text-align:left; line-height:34px; border-bottom:1px solid #f4c109; 
}
/* HEADER */

.header-wrap{
position:absolute;
top:0;
width:100%;
z-index:999;
background: rgba(0,0,0,.65);
}

.header{
max-width:1200px;
width:90%;
margin:0 auto;
display:flex;
align-items:center;
justify-content:space-between;
padding:15px 0;
color:white;
}

/* LEFT */

.left-area{
display:flex;
align-items:center;
gap:20px;
}

.hamburger{
font-size:19px; letter-spacing:4px;
cursor:pointer;
}

.social a{
color:white;
margin-right:10px;
font-size:16px;
}

/* LOGO */

.logo{
position:absolute;
left:50%; top:5px;
transform:translateX(-50%);
}

.logo img{
height:94px;
}

/* RIGHT */

.right-area{
display:flex;
align-items:center;
gap:18px;
}

.phone {
font-size:15px;
}

.phone a{
font-size:15px;color:#fff; text-decoration:none;}

.phone i{
margin-right:6px;
}

/* BOOK BUTTON */

.book-btn{

background:#E31B23;
padding:10px 22px;
border-radius:30px;
color:white;
text-decoration:none;
font-weight:500;
transition:.3s;
}

.book-btn:hover{
background:linear-gradient(45deg, #f4c109 0%, #f4c12a 100%);
}

/* SLIDE MENU */

.side-menu{
position:fixed;
top:0;
left:-320px;

height:100%;
background:white;
padding:40px;
transition:.4s;
z-index:1000;
}

.side-menu.active{
left:0;
}

.close-btn{
font-size:22px;
cursor:pointer;
margin-bottom:30px;
}

.side-menu a{
display:block;
padding:12px 0;
color:#333;
text-decoration:none;
font-size:18px;
border-bottom:1px solid #eee;
}

/* HERO */

.hero-slider{
position:relative;
height:90vh;
overflow:hidden;
}

.slide{
position:absolute;
width:100%;
height:100%;
opacity:0;
transition:opacity 1.4s ease;
}

.slide.active{
opacity:1;
z-index:2;
}

.slide img{
width:100%;
height:100%;
object-fit:cover;
transform:scale(1);
transition:transform 8s ease;
}

.slide.active img{
transform:scale(1.08);
}

.overlay{
position:absolute;
width:100%;
height:100%;
background:rgba(0,0,0,.35);
}

/* TEXT */

.slider-text{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
text-align:center;
color:white;
width:90%;
max-width:800px;
}

.slider-text-title{
font-family:'Playfair Display',serif;
font-size:54px;
margin-bottom:10px;
}

.slider-text p{
font-size:20px;
}

/* NAV */

.nav{
position:absolute;
top:50%;
transform:translateY(-50%);
background:rgba(255,255,255,.3);
border:none;
color:white;
font-size:28px; z-index:99;
padding:10px 16px;
cursor:pointer;
}

.prev{ right:90px; }
.next{ right:20px; }

/* MOBILE */

@media(max-width:768px){

.logo img{
height:36px;
}

.phone{
display:none;
}

.slider-text h1{
font-size:30px;
}

.slider-text p{
font-size:16px;
}

.hero-slider{
height:70vh;
}

}

.welcome-section{
padding:90px 20px;
 margin-top:3%;
}

.container{
max-width:1200px;
margin:auto;
display:flex;
align-items:center;
gap:60px;
flex-wrap:wrap;
}

/* Image */

.image-box{
flex:2;
background:#fff;
padding:5px;
box-shadow:0 12px 30px rgba(0,0,0,0.15);
}

.image-box img{
width:100%;
display:block;
transition:0.4s;
}

.image-box img:hover{
transform:scale(1.05);
}

/* Content */

.content{
flex:1.5;
}

.title1,  .title1 a{
font-size:36px;
font-weight:600;
color:#2c2c2c;
margin-bottom:10px;
}

.divider{
width:80px;
height:2px;
background:linear-gradient(90deg,#f4c109,#f4c12a);
margin:15px 0 20px;
border-radius:2px;
}

.subtitle{
font-size:18px;
color:#6b7280;
margin-bottom:20px;
font-weight:500;
}

.content p{
font-size:16px;
line-height:1.7;
color:#444;
margin-bottom:15px;
}
.content p a{ text-decoration:none;    color: #f4c12a; }	
	
.subtitle1 {color:#f4c12a; font-size:17px; padding-bottom:2%;}
/* Button */

.read-btn{
margin-top:10px;
padding:12px 28px;
background:#4b4e6f;
color:#fff;
border:none;
border-radius:30px;
font-weight:500;
cursor:pointer;
transition:0.3s;
}

.read-btn:hover{
background:#2f3250;
transform:translateY(-2px);
}

/* Hidden Content Smooth Animation */

.more-content{
max-height:0;
overflow:hidden;
transition:max-height 0.6s ease;
}

.more-content.open{
max-height:200px;
margin-top:15px;
}

/* Mobile */

@media(max-width:768px){

.container{
flex-direction:column;
}

.divider{
margin:15px auto;
}

.subtitle{
text-align:center;
}

.read-btn{
display:block;
margin:15px auto;
}

}

.accordion-slider{
padding:0px 20px; background:#f7f8fb;
}

.slider-wrapper{
max-width:1200px;
margin:auto;
position:relative;
}

.accordion{
display:flex;
gap:10px;
overflow:hidden;
}

/* Panels */

.panel{
flex:1;
transition:flex 0.6s ease;
background:#f7f8fb;
overflow:hidden;
cursor:pointer;
}

.panel.active{
flex:6;
}

/* Panel layout */

.panel-inner{
display:flex;
height:450px;
}

.panel-image{
flex:1;
}

.panel-image img{
width:100%;
height:100%;
object-fit:cover;
}

.panel-content{
flex:1;
padding:20px;
display:flex;
flex-direction:column;
justify-content:center;
}

.panel-content-title {
font-size:20px;
margin-bottom:10px;
}

.panel-content p{
font-size:14px;
color:#555;
line-height:1.6;
}

/* Arrows */

.arrow{
position:absolute;
top:50%;
transform:translateY(-50%);
background:#4b4e6f;
color:#fff;
border:none;
width:45px;
height:45px;
border-radius:50%;
cursor:pointer;
z-index:10;
}

.arrow.left{
left:-25px;
}

.arrow.right{
right:-25px;
}

.arrow:hover{
background:#2f3250;
}

/* Mobile */

@media(max-width:768px){

.accordion{
flex-direction:column;
}

.panel{
flex:1 !important;
}

.panel-inner{
flex-direction:column;
height:auto;
}

}
.rooms-section{
padding:90px 20px;
background:#fff;
}

.rooms-container{
max-width:1200px;
margin:auto;
display:flex;
align-items:center;
gap:60px;
flex-wrap:wrap;
}

/* Images */

.room-images{
flex:2;
display:flex;
gap:20px;
align-items:flex-end;
}

.img-box{
flex:1;
box-shadow:0 15px 35px rgba(0,0,0,0.15);
}

.img-box img{
width:100%;
object-fit:cover;
}

/* Different heights */

.big img{
height:360px;
}

.small img{
height:480px;
}

/* Content */

.room-content{
flex:1;
}

.room-content-title {
font-size:36px;
margin-bottom:10px;
}



.room-content p{
color:#555;
line-height:1.7;
margin-bottom:15px;
}

/* Roll Hover Button */

.roll-btn{
display:inline-block;
position:relative;
overflow:hidden;
padding:14px 32px;
background:#4b4e6f;
color:#fff;
text-decoration:none;
border-radius:30px;
font-weight:500;
}

.roll-btn span{
position:relative;
z-index:2;
}

.roll-btn::before{
content:"Book Now";
position:absolute;
left:0;
top:100%;
width:100%;
height:100%;
background:#2f3250;
display:flex;
align-items:center;
justify-content:center;
transition:0.35s;
}

.roll-btn:hover::before{
top:0;
}

/* Mobile */

@media(max-width:768px){

.rooms-container{
flex-direction:column;
}

.room-images{
width:100%;
}

.big img{
height:260px;
}

.small img{
height:220px;
}

.room-content h2{
text-align:center;
}

.divider{
margin:15px auto;
}

.roll-btn{
display:block;
text-align:center;
margin:auto;
}

}

.hotel-info{
padding:20px 20px;
background:#f7f8fb;
font-family:'Poppins',sans-serif;
}

.info-container{
max-width:1200px;
margin:auto;
}

/* Heading */

.section-title{
text-align:center;
font-size:36px;
margin-bottom:50px;
}

/* Grid */

.info-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
}

/* Box */

.info-box{
text-align:center;
padding:30px 25px;
border-right:1px solid #ddd;
}

.info-box.last{
border-right:none;
}

/* Icon */

.icon{
font-size:32px;
color:#4b4e6f;
margin-bottom:15px;
}

/* Text */

.info-box-title {
font-size:19px; font-weight:500;
margin-bottom:10px;
}

.info-box p{
font-size:14px;
line-height:1.6;
color:#555;
}

/* Mobile */

@media(max-width:900px){

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

.info-box{
border-right:none;
border-bottom:1px solid #ddd;
}

}

@media(max-width:500px){

.info-grid{
grid-template-columns:1fr;
}

}
.hotel-footer{
background:#1e1f2f;
color:#ddd;
padding:50px 20px;
font-family:'Poppins',sans-serif;
}

.footer-container{
max-width:1200px;
margin:auto;
}

/* Top Columns */

.footer-top{
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:wrap;
margin-bottom:30px;
}

.footer-title, .footer-title a{
margin-bottom: 10px;
    color: #fff;
    font-size: 21px;
    font-weight: 500;
}

.footer-contact p a{ color:#ddd; text-decoration:none;}
	
.footer-contact p{
line-height:1.7;
font-size:14px;
}

/* Social Icons */

.footer-social { margin-top:-60px;}

.footer-social a{
display:inline-block;
width:45px;
height:45px;
line-height:45px;
text-align:center;
border-radius:50%;
margin-left:10px;
background:#2e3046;
color:#fff;
font-size:18px;
transition:all .7s ease;
}

/* Roll Hover Effect */

.footer-social a:hover{
transform:rotate(360deg);
background:#4b4e6f;
}

/* Links Row */

.footer-links{
display:flex;
flex-wrap:wrap;
gap:18px;
margin-bottom:30px;
border-top:1px solid #333;
border-bottom:1px solid #333;
padding:15px 0;
}

.footer-links a{
color:#ccc;
text-decoration:none;
font-size:14px;
transition:.3s;
}

.footer-links a:hover{
color:#fff;
}

/* Bottom */

.footer-bottom{
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:wrap;
gap:20px;
}

.footer-text{
max-width:700px;
font-size:13px;
line-height:1.7;
}

.footer-text a{
color:#ddd;
text-decoration:none;
}

.footer-text a:hover{
text-decoration:underline;
}

.footer-logo img{
max-width:150px;
}

/* Mobile */

@media(max-width:768px){

.footer-top{
flex-direction:column;
align-items:flex-start;
gap:20px;
}

.footer-links{
justify-content:center;
text-align:center;
}

.footer-bottom{
flex-direction:column;
align-items:flex-start;
}

.footer-logo{
margin-top:10px;
}

}
#w2b-StoTop{display: block;position: fixed;top:90%;padding: 10px; color:#fff; font-size:14px; right:0; margin-right:20px; text-decoration:none; cursor:pointer; background:#0280b5;}
#w2b-StoTop a{color:#fff; text-decoration:none; font-size:14px;}
.col1{ width:32%; font-size:15px; color:#111010;  margin:18px 22px; float:left;}
.col1 ul li{list-style:circle; line-height:28px;}
.col1 ul li a{color:#111010; text-decoration:none; list-style:circle;}
.col{ width:34%; font-size:15px; color:#111010;  margin:15px 22px; float:left;}
.col ul li{list-style:circle; line-height:28px;}
.col ul li a{color:#111010; text-decoration:none; list-style:circle;}
.vid { float:none; width:98%;  margin:0 auto;  position: relative;    height: 0;
    padding-bottom:70%;  }
 
.vid iframe {
    width: 100% !important; height:100% !important;
	position: absolute;
   top: 0;
    left: 0;
  }
a.toggleLink { font-size:14px;
color : #006ba3; border:#006ba3 solid 1px;
text-decoration : none; font-weight:bold;
margin:14px 0; float:left;
padding:2px 14px;} 
label { display:none;}
.rw {  width:260px; float:left; }
#contentp {width:86%; margin:0 auto; padding:4% 0;}
#contentp p{font-size:15px; color:#111010; font-weight:normal; line-height:28px; text-align:center;}
#contentp p a {color:#192e7c; text-decoration:none;}
.cc_dialog.simple {
    left: 0 !important;
    top: auto;
    bottom: 0;
    right: auto !important;
    max-width: 60% !important;
    position: fixed;
    padding: 0.8em !important;
    background: #f2f2f2a1 !important;
}

.light.cc_dialog .cc_dialog_headline {
    color: #111;
    text-align: left;
}
.ada { width:100%; margin:0 auto; padding:12px 0; text-align:center; color:#fff; font-size:19px; background:#666; line-height:32px;}
.ada a { color:#fff; text-decoration:none;}
.fq{text-align:left; text-decoration: none; color:#333; font-weight:bold;  font-size:18px;  line-height:34px; margin-top:6px; list-style:none;}
.fqa{font-size:16px; color:#424242; font-weight:normal; line-height:28px; text-align:left;}
.fqa a{font-size:16px; color:#c8050a; text-decoration:none;}
.rmtx { float:left; width:56%;}
.room { float:right; margin:10px 0 10px 0; width:36%; border: solid 5px #ededed;
    box-shadow: 1px 1px 5px #999;}
.room img, .glpic img { width:100%;}
hr.style-four {
    height: 12px;
    border: 0;
    box-shadow: inset 0 12px 12px -12px rgba(0, 0, 0, 0.5);
}
hr {margin: 20px 0;}
.blogo { margin:0 auto; float:none; width:180px; padding:5px 0;}
.gallery { margin:0 auto; float:none; width:100%; margin-top:25px;}
.glpic { float:left; margin:10px 10px; width:18%;}
.gallery-container {
    display: flex;
    align-items: center;
}

.photo-strip {
    display: flex;
    overflow: hidden;
    width: 100%;
    margin: 20px 0;
}

.galleryImage {
    width: 23%;
    height: auto;
    margin-right: 12px;
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.nav-btn {
    background-color: #333;
    color: white; position:absolute;
    border: none;
    padding: 8px 8px;
    font-size: 18px;
    cursor: pointer;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.nav-btn:hover {
    background-color: #cb1f1f;
}
element.style {
    cursor: pointer;
    margin-top: 20px;
}

.amenitypg {
      width:40%; float:left; 
      margin: 10px 10px 0 60px;
      padding: 20px; 
      
    }
  
    .amenitypg ul {
      list-style: none;
      padding: 0;
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      gap: 15px 30px;
    }
    .amenitypg li {
      font-size: 17px;
      color: #333; padding:8px 0;
      display: flex;
      align-items: center; text-align:left;
    }
    .amenitypg li i {
       color: #333;
      margin-right: 10px;
      font-size: 18px;
      min-width: 20px;
      text-align: center;
    }
.amenitypg-list li {
  position: relative;
  padding-left: 8px;
  margin-bottom: 10px;
}

.amenitypg-list li::before {
  content: "";
  position: absolute;
  left: 0;
   color: #333; /* Blue checkmark */
  font-size: 17px;
}
.col1 {  width:40%; float:left; text-align:left; padding: 10px;  font-size: 17px;  color: #333; margin-left:30px; }
.col1 ul li {list-style:circle; line-height:36px;}
.col1 ul li a {color: #333; text-decoration:none; list-style:none;}	

.top { margin-top:60px;}

.att2 {
  max-width: 1200px;
  margin: 40px auto;
  padding: 0 15px;
}

.att2-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 30px;
}

.att2-card {
  background: #ffffff;
  border-radius: 2px;
  overflow: hidden;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
  height: 100%;
}

.att2-img img {
  width: 100%;
  height: 360px;
  object-fit: cover;
}

.att2-content {
  padding: 22px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.title7 {
  font-size: 22px;
  margin-bottom: 12px;
  color: #1a1a1a;
}



.att2-content p {
  font-size: 19px; text-align:Left;
  line-height: 1.7;
  color: #555;
}

/* Desktop 2-Column Layout */
@media (min-width: 768px) {
  .att2-grid {
    grid-template-columns: repeat(2, 1fr);
    align-items: stretch;
  }
}

.vid { float:none; width:98%;  margin:0 auto;  position: relative;    height: 0;
    padding-bottom:70%;  }
 
.vid iframe {
    width: 100% !important; height:100% !important;
	position: absolute;
   top: 0;
    left: 0;
  }
  
 html {
    scroll-behavior: smooth;
  }

  #scrollTopBtn {
    position: fixed;
    bottom: 25px;
    right: 25px;
    width: 50px;
    height: 50px;
    border: none;
    outline: none;
    background: #E31B23;
    color: #fff;
    font-size: 22px;
    border-radius: 50%;
    cursor: pointer;
    display: none;
    z-index: 9999;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
    transition: all 0.3s ease;
  }

  #scrollTopBtn:hover {
    background: #F4C11F; color: #000;
    transform: translateY(-4px);
  }

  @media (max-width: 767px) {
    #scrollTopBtn {
      width: 45px;
      height: 45px;
      font-size: 20px;
      bottom: 20px;
      right: 20px;
    }
  }