/***********************************/
/**        BASE STYLES         **/
/***********************************/

body {margin: 0; padding: 0;}
h1, h2, h3, p {margin: 15px 0; padding: 0;}
img {border: none;}

/*************/
/*   FONTS   */
/*************/
/* GLOBAL FONTS */
body {font-family: Calibri, Arial, Helvetica, Verdana, sans-serif; font-size: 93.8%; font-style: normal; font-weight: normal;}

body{
	font-size /*\**/:93.8%\9;
}

/* FONT SIZE */
h1 {font-size: 1.5em;}
h2 {font-size: 1.3em;}
h3, h4 {font-size: 1.1em;}
input, select, textarea {font-size: 90%;}


/********/
/* TEXT */
/********/
body, a {color:#FFF;}
p{line-height: 18px;}

/* TEXT DECORATION */
a {text-decoration: none; cursor: pointer;}
a:hover {text-decoration: underline;}

/* TEXT ALIGN */
table th, table td {text-align: center;}
table th{border-right: 1px solid #AAA;}


/***********/
/*  LISTS  */
/***********/
ul {margin: 0; padding: 0; list-style: none;}


/***********/
/* BORDERS */
/***********/
h1 {border-color:#000;}
fieldset {border-color:transparent;}


#wrapper {margin:0 auto; padding-top:0; text-align: left; position: relative;}
#col-two-three {text-align: left; /* ie4 fix needed due to float:right; */}

/******************/
/*     FORMS      */
/******************/
form {display: inline; margin: 0;}
input, select {vertical-align: middle;}
radio, checkbox {vertical-align: middle; float: left;}
legend {display: none;}
fieldset {margin: 0; border-style: solid; border-width: 0; margin-bottom: 1em; clear: both; padding: 0;}
fieldset label {float: left;}
fieldset div div {clear: none; float: left;}
fieldset div {clear: both;}

/******************/
/* COMMON CLASSES */
/******************/
.bold {font-weight: bold;}
.first {border-left: 0;}
.hide {display: none;}
.left {float: left;}
.right {float: right;}
.clear-all {clear: both; height: 0; line-height: 0; font-size: 0;}
.re-waiHide {position:absolute;left:0px;top:-500px;width:1px;height:1px;overflow:hidden;}


/***** HACKS *****/
/* IE7 - Moz */
html > body table.wizrtable th {font-size:1.1em;width:250px;vertical-align:top;}
html > body table.wizrtable td {font-size: 1.1em;}

/* IE IE 5 - 6 - see "html > body table.wizrtable th" below */
table.wizrtable th {font-size: 90%;}
table.wizrtable td {font-size: 80%;}
/* END IE 5 - 6 */

/***********************************/
/**          PAGE STYLES          **/
/***********************************/
body{background: url(../images/bg_body.jpg);}
#inner-wrapper {width: 940px; margin: 0 auto;}
#headerwrapper{width: 100%; height: 131px; background: url(../images/bg_header.png) repeat-x;}
#header {
	width: 940px;
	height: 131px;
	margin: 0 auto;
}
#col-one-two-three{
	width: 940px;
}
#col-two-three {
	width: 620px;
	float: left;
	padding: 0 15px 20px 15px;
}
#content, #content a{
	padding: 0;
	color: #000;
}
#col-one{
	width: 246px;
	float: right;
	margin: 0;
	padding: 0;
}
#footer, #footer2{
	width: 940;
	margin: 0;
}
div.dotline{ border-bottom-style: solid; border-bottom-color: #b9cf5d; margin:0 0 20px 0; border-bottom-width: 1px; width:100% !important; }
/***********************************/
/**        LAYOUT STYLES         **/
/***********************************/

/* HEADER */
#header .logo{margin: 20px 0 0 0; float: left;}
#header .bookdirect {float: right; margin: 35px 0 0 0;}
#header .topnav{height: 31px; margin: 0; background: url(../images/bg_content.png); margin: 12px 0 0 0;}
#header .topnav ul{margin: 0;}
#header .topnav ul.topmenu1 li {float:left;margin: auto; padding: 0; font-family: Arial; font-size: 0.733em; line-height: 31px; text-transform: uppercase;}
#header .topnav ul.topmenu1 li.first {border: none;}
#header .topnav ul.topmenu1 li a{color: #000; height: 31px; display: block; text-align: center;background: #ffffff77}
#header .topnav ul.topmenu1 li.home a{width: 134px;}
#header .topnav ul.topmenu1 li.special a{width: 110px;}
#header .topnav ul.topmenu1 li.reserv a{width: 134px;}
#header .topnav ul.topmenu1 li.accom a{width: 134px;}
#header .topnav ul.topmenu1 li.rates a{width: 134px;}
#header .topnav ul.topmenu1 li.restaurant a{width: 130px;}
#header .topnav ul.topmenu1 li.location a{width: 134px;}
#header .topnav ul.topmenu1 li.gallery a{width: 134px;}
#header .topnav ul.topmenu1 li.contact a{width: 134px;}
#header .topnav ul.topmenu1 li.active a{color: #FFF; background: #000; text-decoration: none;}
#header .topnav ul.topmenu1 li a:hover{color: #FFF; background: #000; text-decoration: none;} 

/* COL-ONE */
#quickbook {width: 246px; height: 225px; background: url(../images/bg_quickreservation.jpg) no-repeat left top;  padding-top:20px;}
#quickbook h3{margin: 0; color: #F60; font-size: 1.5em; text-align: center; text-transform: uppercase;}
#quickbook h3 span{color: #FFF;}
#quickbook .engine{padding: 0;}
#quickbook .engine div.txtin, #quickbook .engine div.txtout{}
#quickbook .engine div.txtin img, #quickbook .engine div.txtout img{float: left; display: block; width: 20px; height: 20px; margin: 0 0 0 6px;}
#quickbook .engine .frminput{float: left; font-size: 0.9em; margin-top: 5px; padding: 5px 0 0 55px ;}
#quickbook .engine .calendar{margin: 0 0 0 5px;}
#quickbook .engine .frminput .label{ margin-right:8px; color: #000; font-weight: normal; font-size: 1.2em; width: 140px;}
#quickbook .engine .frminput input.txtinput{float: left; width: 120px; font-size: 0.8em; border: 1px solid # 999; margin: 0; height: 15px;}
#quickbook .engine .frminput select{width: 40px; margin: 2px 9px 0 0px;}
#quickbook .engine .checkin {margin: 5px 8px 0 8px;}
#quickbook .engine .checkout {margin: 5px 8px 0 8px;}
#quickbook .engine .booknow {margin: 15px 0 0 67px; float: left;}
#quickbook .engine .chart img{margin: 0 5px 0 0;}
#quickbook .engine .chart a{margin: 10px 0 0 45px; float:left; text-decoration:underline; color:#000; }
#col-one .homepromo{float: none; margin: 15px 0 0 0;}
#col-one .imgbanner{margin: 15px 0 0 0;}
#col-one .imgbanner img.bannernewsletter{border: 3px solid #B9CF5D;}

/* FOOTER */
#footer, #footer2{font-size: 0.8em; color: #FFF; background: #000;}
#footer .footerlink{height: 55px; width: 500px; float: left; margin: 10px;}
#footer .footerlink ul li{float: left; padding: 0 6px; margin: 3px 0; border-right: 1px solid; line-height: 10px;}
#footer .footerlink ul li.last{border: none;}
#footer .footerlink ul li a{text-decoration: underline; color: #FFF;}
#footer .footerlink ul{margin: 10px 0 0 0;}
#footer .social{float: right; margin: 25px 10px 0 0; }
#footer .social span{text-transform: uppercase; text-decoration: underline;}
#footer .social img{margin: 0 0 0 5px; vertical-align: middle;}
#footer .social .youtube{display: none;}
#footer2 {border-top: 1px solid #5c5b5b; padding: 0; margin: 0 0 15px 0;}
#footer2 p{padding: 0 10px;}
#footer2 .add{float: left;}
#footer2 .copyright{float: right;}

/* HOME PAGE */
#checkroom{height: 35px; margin: 15px 0;}
#checkroom .engine{height: 35px; margin: 0; padding: 0 0 0 25px; width: 755px; background: url(../images/bg_engine.png);}
#checkroom .engine div.txtin, #checkroom .engine div.txtout{float: left;}
#checkroom .engine div.txtin img, #checkroom .engine div.txtout img{float: left; display: block; width: 20px; height: 20px; margin: 0 0 0 6px;}
#checkroom .engine .frminput{float: left; font-size: 0.933em; margin-top: 7px; padding-right:5px;}
#checkroom .engine .calendar{margin: 0 0 0 5px;}
#checkroom .engine .frminput .label{float: left; margin: 4px 8px 0 0; color: #FFF; font-weight: bold; font-size: 0.933em;}
#checkroom .engine .frminput input.txtinput{float: left; width: 72px; font-size: 0.8em; border: 1px solid # 999; margin: 0; height: 15px;}
#checkroom .engine .frminput select{width: 40px; margin: 2px 9px 0 0px;}
#checkroom .engine .checkout {margin: 7px 8px 0 15px;}
#checkroom .engine .booknow {margin: 7px 0 0 10px; float: left;}
#checkroom .engine .chart a{margin: 9px 0 0 15px; float:left; text-decoration:underline; color:#FFF; font-size: 0.8em;}
.homecontent, .content{color: #000; padding: 20px 50px; background: url(../images/bg_inner_new.gif);}
.homecontent h1{font-size: 3em; border-bottom: 1px solid #b9cf5d; padding: 0 0 10px 0;}
#homebox{margin: 15px 0; height: 179px;}
.homepromo{width: 246px; margin: 0 10px 0 0; float: left;}
.homepromo h3{width: 246px; height: 28px; background: url(../images/bg_title.png); margin: 0; padding: 0; font-weight: normal; text-transform: uppercase; }
.homepromo h3 span{color: #FFF; padding: 4px 0 0 10px; display: block;}
#col-one .homepromo h3 span{padding: 7px 0 0 10px;}
.homepromo #offer{width: 246px; position: relative;}
.homepromo #offer .head {
	width: 246px;
	height: 35px;
	background: url(../images/bg_promo.png);
	position: absolute;
	bottom: -1px;
	left: 0;
	background:rgba(190, 67, 36, 0.363) ;
}
.homepromo #offer .head h4{font-size: 0.9em; text-transform: uppercase; color: rgb(243, 238, 235); margin: 0; padding: 10px 15px 0 15px; float:left;}
.homepromo #offer .head h4 a{color: rgb(3, 3, 3);background:rgba(194, 159, 151, 0.781)}
.homepromo #offer .head p{color: #FFF; margin: 0; padding: 10px 15px 10px 15px; font-size: 0.8em; line-height: 15px; float:right;}
.homepromo .offer-img {width: 246px; height: 151px;}
.homepromo .offer-img img{margin: 0;}
.homenote{width: 170px; height: 179px; position: relative; float: right;}
.homenote h3{width: 170px; height: 28px; background: url(../images/bg_title.png); margin: 0; padding: 0; font-weight: normal; text-transform: uppercase; }
.homenote h3 span{padding: 4px 0 0 10px; display: block;}
.homenote .wifi{background: #FFF; padding: 10px 3px; border: 2px solid #1677B9;}
.newsletter{position: absolute; bottom: 0;}


/* CONTENT AREA */
#content{margin: 15px 0; padding: 10px 10px 20px 15px;}
#content a{text-decoration: underline;}
#content h1{font-size: 3em; color:#f26522; margin: 10px 0 0 0; padding: 0;}
#content h2{font-size: 1.2em; margin: 0; padding: 0;}
#content h3{margin: 0; padding: 0;}
#content table{margin-bottom:5px;}
#content table td{text-align: left; padding-left:10px;}
#content table td.heading{padding: 0; text-align: center;}
#content table td.heading span.line1{font-size: 1.2em; text-transform: uppercase; color: #000;}
#content table td.heading span.line2{font-size: 0.8em;color: #000;}
#content table td.title{font-size: 1em; font-weight:bold; text-align:center; color: #000; padding:10px;}
#content table td.date{text-align: center; vertical-align: top;}
#content table td.date p.season{font-weight: bold; margin: 15px 0 0 0;}
#content table td.date p.period{font-size: 0.83em; margin: 0 0 15px 0;}
#content table td.roomtype{font-size: 1em;font-weight: bold; line-height:2.0em;text-align: left;padding-left: 6px;color: #f06eaa;}
#content table td.SDT{width: 60px; font-size:0.9em; text-align: right;}
#content table td.period{font-size: 1em; text-align: center;}
#content table td.center{ text-align:center;}
#content table tr.color2{background: #FFF;}
#content .rates li, #content .services li {list-style: disc; margin-left:20px; line-height:1.4em; font-size:0.95em;}
.contact label{width: 70px; display: block; float: left;}

/* ACCOMMODATION */
#roombody{margin: 30px 0 30px 0;}
#roombody .roomimage{width: 450px; float: left;}
#roombody .roomdetails{width: 410px; float: right; padding-right: 10px; text-align:justify;}
#roombody h2{margin: 0 0 5px 0; font-size: 1.1em;}
#roombody h2 span{color: #f26522; font-size: 1.4em;}
#roombody h4{margin: 0; padding: 0;}
#roombody .button{margin: 25px 0 0 0;}
#roombody .roomdetails ul li{list-style: disc;
margin: 3px 0 0 20px;
width: 185px;
text-align: left; float:left; font-size:12px; }
#roombody .note{width: text-align: left; font-size:12px; color:#999; font-style:italic;}
.detail ul li{list-style: disc;
margin: 3px 0 0 20px;
width: 600px;
text-align: left; float:left; font-size:12px; }
#roombody div.vr{margin: 10px 0 0 0; text-align: center;}


/* GALLERY */
#gallerybody{margin: 30px 0 0 0;}
#gallerybody h2{margin: 10px 0 5px 0; font-size: 1.3em; float: left;}
#gallerybody h2 span{color: #C0B400;}
#gallerybody div.vr{float: right; margin: 0 0 3px 0;}
#download{margin-top: 5px;}


/* LOCATIONS */
p.address a{text-decoration: underline;}
.mapimg{margin: 20px 0 0 0;}


.offer-excerpt {
padding-bottom: 18px;
}
.offer-excerpt div.floatleft {
padding-right: 0px;
}
.offer-excerpt div.img {
width: 260px;
}
.offer-excerpt div.excerpt {
width: 360px;
}
.floatleft {
float: left;
}
tr.ui-widget-header {
background: #cccccc url(../images/ui-bg_highlight-soft_75_cccccc_1x100.png) 50% 50% repeat-x;
color: #222222; height:60px;  border-right: 1px solid #aaaaaa;
}

table{border: 1px solid #aaaaaa;}
td{border-bottom: 1px solid #aaaaaa; background: #e6e6e6 url(../images/ui-bg_glass_75_e6e6e6_1x400.png) 50% 50% repeat-x;
font-weight: normal;
color: #555555; line-height:26px; border-right: 1px solid #aaaaaa;  text-align:right; padding-right:10px;}
td.last{border-bottom:none;}
td.last2{border-right:none;}

.vr-360 { height: 138px; margin-top:0px;}
.vr-360 div.show {
padding-right: 11px; width: 199px; float:left;}
.vr-360 div.last {
padding-right: 0; width: 199px; float:left;}
.vr-360 div.image img  {
}

.vr-360  p{text-align:center; line-height:8px;}


.mini-block-title{
background-color: rgb(64, 129, 250);
}

.mini-block{
background: rgba(139, 47, 24, 0.24);
}

#slider1 {
  width: 100%;
  height: 50vw; /* Adjust height relative to viewport width */
  max-height: 800px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  transition: background-image 1s ease-in-out;
}
@media (min-width: 600px) {
  #slider1 {
	height: 800px; /* Fixed height for larger screens */
  }
}
@media (max-width: 600px) {
  #slider1 {
    height: 60vw;
  }
}

/* Responsive Gallery Grid */
.all-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 10px;
  padding: 10px;
}

.all-gallery img {
  width: 100%;
  height: auto;
  cursor: pointer;
  border-radius: 5px;
}

/* Modal Styling */
.modal {
  display: none;
  position: fixed;
  z-index: 999;
  padding: 0px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background: rgba(0, 0, 0, 0.75);
}

.modal-content {
  margin: auto;
  display: block;
  max-width: 90%;
  max-height: 80vh;
}

.close, .prev, .next {
  color: white;
  position: absolute;
  top: 50%;
  font-size: 2rem;
  cursor: pointer;
  user-select: none;
}

.close {
  top: 20px;
  right: 35px;
  font-size: 30px;
}

.prev { left: 20px; transform: translateY(-50%); }
.next { right: 20px; transform: translateY(-50%); }