@charset 'UTF-8';
/*CSS Document*/

/*------------ 
font-family: 'Raleway', sans-serif;
font-family: 'Playfair Display', serif;
font-family: 'Mr De Haviland', cursive; 
----------*/
*{margin:0; padding:0;}
:root
{
	--raleway:'Raleway', sans-serif;
	--playfair:'Playfair Display', serif; 
    --sans-serif: sans-serif;
	--Haviland:'Mr De Haviland', cursive; 
} 
body
{
	font-family: 'Raleway', sans-serif;
    color:#000000;
    border:none;
    margin:0;
	background:url(../images/body-bg.jpg) no-repeat center top;
	background-attachment:fixed;
	background-size:cover;
}
.pagination_style
{
    padding: 0.5rem;
    background: #003264;
    margin-left: 0.5rem;
    color: #ffffff;
    border-radius: 4px;
    font-size: 1rem;
	cursor:pointer;
}
/*-------- Common Flex ----------*/
	.common-flex
	{
		display:flex;
		flex-flow:row wrap;
		/*padding:0rem 0 1rem;*/
	}
	.container-width>.container
	{
		max-width:1200px;
	}
	.padding-0
	{
		padding:0;
	}
	a.common-btn.btn-info
	{		
		background: #003664 ;
		border-radius: 0;
		text-transform: uppercase;
		border: none;
		position:relative;
		z-index:1;
		box-shadow:none;
	}
	a.common-btn.btn-info:after
	{
		content:'';
		position:absolute;
		width: 100%;
		height: 100%;
		background: #0057a2;
		left: 0;
		top: 0;
		z-index: -1;
		transform: scaleX(0);
		transition: all 0.2s linear;
	}
	a.common-btn.btn-info:hover:after
	{
		transform: scaleX(1);
	}
	.common-h1
	{
		font-size: 3rem;
		color: #003364;
		padding: 1.5rem 0 0.5rem;
		font-family: var(--playfair);
	}
	.common-h2
	{
		font-weight: 600;
		color: #16365d;
		text-transform: capitalize;
		font-family: var(--playfair);
	}
	.common-h4
	{			
		text-transform: uppercase;
		font-size: 1.3rem;
		color: #000000;
		padding: 0 0 0.5rem;
		font-family: var(--playfair);
		font-weight: 600;
		letter-spacing: 0.5px;
		word-spacing: 2px;
		line-height: 2rem;
	}
	.common-p
	{
		color: #000000;
		line-height: 2rem;
		letter-spacing: 0.2px;
		word-spacing: 1px;
		box-sizing: border-box;
		font-size:1.2rem;
	}
	.common-p:first-letter
	{
		text-transform:uppercase;
	}
	ul.common-li 
	{
		margin-bottom: 0px;
		/*list-style: url(../images/ul-arrow.png);*/
		list-style: none;
		padding-left: 0;
	}
	.common-li>li 
	{
		font-size: 0.95rem;
		padding-bottom: 0.3rem;
		position: relative;
		margin-left: 20px; 
		padding-left: 12px;
		line-height: 1.65rem;
	}
	.common-li>li>span 
	{
		color: #000000;
		font-weight: 500;
	}
	.common-li>li:after 
	{
		content: '>';
		position: absolute;
		top: 0%;
		width: 10px;
		height: 10px;
		color: #153764;
		left: 0;
		font-weight: 700;
	}
	.telno,.head-book
	{
		display: inline-block!important;
		padding: 0.4rem 1.12rem !important;
	}
	.telno
	{
		/*background: #6ca198 !important;*/
	}
	.read-more
	{
		display: none;
		transition: all ease-in-out 0.5s;
	}
	span#read-more
	{
		text-transform: capitalize;
		background: #003364;
		color: #ffffff;
		padding: 1rem 2rem;
		margin: 1rem auto;
		display: table;
		cursor: pointer;
		position:relative;
		min-height:50px;
		width: 150px;
        line-heigh:50px;
	}
	span#read-more:after
	{
		content:'Read More';
		position:absolute;
		display:block;
        width:100%;
        left:50%;
        top:50%;
        transform:translate(-50%, -50%);
	}
	span.read-less
	{
		position:relative;
	}
	span.read-less:after
	{
		content:''!important;
	}
	span.read-less:before
	{
		content:'read less';
		position:absolute;
		display:contents;
	}
/*----------------- Top left panel CSS ----------------*/
	.left-flex-block
	{
		border:0px solid;
		width:25%;
		padding:0rem 0;
		background: rgb(3, 58, 103);
		position: relative;
	}
	.right-flex-block
	{
		border:0px solid #ff0000;
		width:75%;
		padding:rem 0;
	}
	
/*----------- Booking panel CSS --------------*/
	.book_now
	{
		width:100%;
		display:block;
	}
	.book_now>a.common-btn.btn-info
	{
		display: block !important;
		font-weight: 600;
		letter-spacing: 3px;
	}
			
/*############ Booking widget ################*/
	.bookingwidget {
    width: 100%;
    display: block;
    border: 0px solid green;
    background: rgba(0, 51, 100,0.7);
    position: relative;
    padding-top: 2px;
	}
	#b247SearchBoxContainer
	{
		padding: 4px 0 0px !important;
	}
	.sbx-container > input
	{
		border-radius:0px !important;
		border:none !important;
	}
	.searchbox__title
	{
		font-family: 'Roboto Condensed', sans-serif !important;
	}
	.sbx-container > input
	{
		color: #2c2d32 !important;
	}
	.b247-nights
	{
		font-family: 'Roboto Condensed', sans-serif !important;
	}
	span#b247Nights
	{
		color:#feb000 !important;
	}
	.searchbox__clickable a
	{
		border-radius: 0px!important;
		border: 1px solid;
		background-color: transparent!important;
		padding: 7px 15px!important;
	}
	.searchbox__clickable a:hover
	{
		border: 1px solid #bd9459 !important;
		background: #000000 !important;
		color:#ffffff;
	}
/*----------- Logo panel CSS --------------*/ 
	.logo-panel
	{
		width:100%;
		display:block;
		background: rgb(0, 54, 100,0.5);
	}
	.logo-panel>figure
	{		
		/*padding: 0.6rem 0;*/
		margin-bottom: 0;		
	}
	.logo-panel>figure>a>img
	{
		display:block;
		margin:0 auto; 
		max-width:100%;
	}

/*----------- Main menu -----------------*/
	.left-menu
	{
		width: 100%;
		display: block;
		padding: 0rem 0 0.35rem;
		text-align: center;
		/*background: rgb(0, 54, 100,0.8);*/
	}
	.left-menu>.navbar
	{
		padding-top: 2px;		
	}
	.menu-li
	{
		width:100%;
		margin-bottom: 0;
	}
	.menu-li>li
	{
		display: block;
		width: 100%;
		text-transform: capitalize;
		font-size: 1.583rem;
		padding: 0 0;
		position: relative;
		font-family:var(--Haviland);
		word-spacing: 0.5rem;
	}
	.menu-li>li>a
	{
		color:#ffffff;
		text-decoration:none;
	}
	.menu-li>li>a>i
	{
		display:none;
	}
	.li-active
	{
		background: #0b87ad;
	}
	.menu-li>li>ul
	{
		list-style:none;
		/*display:none;
		position: absolute;
		background: #0b81d0;*/
		width: 100%;
		z-index: 999;
	}
	.menu-li>li>ul>li
	{
		display: block;
		width: 100%;
		text-transform: uppercase;
		/*font-size: 0.7rem;*/
		padding: 0.2rem 0;
	}
	.menu-li>li>ul>li>a
	{
		color:#ffffff;
		text-decoration:none;
	}
	.left-menu>a
	{		
		bottom: -3px;
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
	}
	.left-menu>a:before
	{
		content:'';
		position:absolute;
		background: #0057c7;
		height: 1px;
		width: 50%;
		left: 50%;
		top: 0;
		transform: translateX(-50%);		
	}
	.left-menu>a:after
	{
		content:'';
		position:absolute;
		background: #0057c7;
		height: 1px;
		width: 50%;
		left: 50%;
		bottom: 0;
		transform: translateX(-50%);		
	}
	#arrow
	{
		transition:all ease-in-out 0.5s;
	}
	
/*----------- Hover Effect ---------------*/
	/*.menu-li>li:hover ul
	{		
		display: block;
	}
	.menu-li>li:hover #arrow
	{
		opacity:0;
	}
	*/
	.menu-li>li:hover
	{
		background: #0b87ad;
	}
	
	.left-menu>a>i
	{
		font-size: 2rem;
		color: rgba(255,255,255,0.5);
	}
	
	.left-menu>a:hover>i
	{
		color: rgba(255,255,255,1);
	}
	
/*-----############# Facility top block ###########------------------*/
	.facility-block-left
	{
		width:100%;
		display:block;
		background:rgba(53, 103, 130, 0.7);
		padding:1rem 0;
	}
	.facility-left-ul
	{
	}
	.facility-left-ul>ul
	{
		display: flex;
		flex-flow: row wrap;
		justify-content: center;
		align-items: center;
		list-style:none;
		margin-bottom: 0;
	}
	.facility-left-ul>ul>li
	{
		width:50%;
		text-align: center;
		padding: 0.52rem 0;
	}
	.facility-left-ul>ul>li:nth-of-type(odd)
	{
		border-right: 1px solid #ffffff;
		border-bottom: 1px solid #ffffff;
	}
	.facility-left-ul>ul>li:nth-of-type(even)
	{
		border-bottom: 1px solid #ffffff;
	}
	
	.facility-left-ul>ul>li:last-child 
	{
		border-bottom:none;
	}
	.facility-left-ul>ul>li:nth-last-child(2)
	{
		border-bottom:none;
	}
	.facility-left-ul>ul>li>img
	{
		max-width:100%;
		display:block;
		margin:0 auto;
	}
	.facility-left-ul>ul>li>span
	{
		display:block;
		text-transform:capitalize;
		margin:0.3rem 0;
		font-size: 0.8rem;
		color: #ffffff;
		font-weight: 400;
	}
	
/*------------- Facility right block CSS ------------*/
	.facility-block-right
	{
		width:100%;
		display:block;
	}
	.facility-right-ul
	{
		width:100%;
		display:block;
	}
	.facility-right-ul>ul
	{
		list-style: none;
		margin-bottom:0;
	}
	.facility-right-ul>ul>li
	{
		width: 33.333%;
		position:relative;
		z-index:99;
	}
	/*.facility-right-ul>ul>li:after
	{
		content: '';
		position: absolute;
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,0.3);
		top: 0;
		left: 0;
	}*/
	/*.facility-right-ul>ul>li:hover:after
	{
		background: rgba(0,0,0,0);
	}*/
	.facility-right-ul>ul>li>img
	{
		max-width:100%;
		display:block;
		margin:0 auto;
	}
	.facility-right-ul>ul>li>span
	{
	}
	.facility-right-text-wrap
	{
		position: absolute;
		top: 2%;
		left: 50%;
		width: 90%;
		height: 38%;
		padding: 1rem;
		background: rgba(10, 14, 37, 0.5);
		transform: translateX(-50%);
		z-index: 100;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.facility-right-text-wrap>h2
	{
		font-family: var(--playfair);
		text-transform: uppercase;
		box-sizing: border-box;
		font-size: 2rem;
		text-align: center;
		text-shadow: 2px -2px 0px #000000;
	}
	.facility-right-text-wrap>h2>a
	{
		color: #ffffff;
		text-decoration:none;
	}
	.facility-h1
	{
		text-align:center;
		position:relative;
		z-index:1; 
		padding-top: 0;
		text-transform:capitalize;
		margin-bottom:2rem;
	}
	.facility-h1:after,.facility-h1:before	
	{
		content:'';
		width: 41%;
		position:absolute;
		top:50%;
		transform:translateY(-50%);
		padding:0.03rem;
		background:#cccccc;
		z-index:-1;
	}
	.wedding-h1
	{
		position:relative;
	}
	.wedding-h1:after, .wedding-h1:before
	{
		content:'';
		position:absolute;
		width: 35%;
	}
	.facility-h1:after
	{
		left:0;
	}
	.facility-h1:before	
	{
		right:0;
	}
	
/*-----------############ Activity Page #############------------*/
	
	.facility-img-wrap
	{
		display:block;
		position:relative;
	}
	.facility-img-flex
	{
		display:flex;
		justify-content:center;
		flex-flow:wrap row;
		position: relative;
	}
	
	.facility-hover
	{
		display: block;
		position: relative;
		min-height: 200px;
	}
	.facility-img-flex>[class*=col-]>.facility-hover>figure.thumb-img	
	{		
		overflow: hidden;
		backface-visibility: hidden;
		transition: all ease-in-out 0.5s;
		transform-origin: top left;
		transform-style: preserve-3d;
		min-height: 200px;
		box-shadow: 3px 3px 6px;
		z-index: 999;	
	}	
	
	/*.facility-img-flex>[class*=col-]:nth-of-type(even)>.facility-hover>figure.thumb-img	
	{		
		overflow: hidden;
		backface-visibility: hidden;
		transition: all ease-in-out 0.5s;
		transform-origin: right top;
		transform-style: preserve-3d;
		min-height: 200px;
		box-shadow: 3px 3px 6px;
		z-index: 999;	
	}*/
	.facility-hover>figure.thumb-img>img
	{
		max-width:100%;
		display:block;
		margin:0 auto;
	}
	.facility-hover>figure.thumb-img + .orginal-img
	{
		transition: all 0.5s linear;
		position: absolute;
		width: 100%;
		height: 100%;
		opacity: 0;
		top: 0;
		left: 0;
		background: #003363;
		text-align: center;
	}
	.orginal-img>h4.common-h4
	{
		margin-top: 15%;
	}
	.orginal-img>h4.common-h4>a
	{
		color: #ffffff;
		text-decoration:none;
	}
	.facility-hover>figure.thumb-img + .orginal-img>img
	{
		max-width:100%;
		display:block;
		margin:0 auto;
	}
	.facility-img-flex>[class*=col-]>.facility-hover:hover figure.thumb-img
	{
		transform: rotate(90deg);
		position:absolute;
		left:0;
		top:0;
		pointer-event:none;
	}
	
	/*.facility-img-flex>[class*=col-]:nth-of-type(even)>.facility-hover:hover figure.thumb-img
	{
		transform: rotate(90deg);
		position:absolute;
		left:0;
		top:0;
		pointer-event:none;		
	}*/
	
	.facility-img-flex>[class*=col-]>.facility-hover:hover figure.thumb-img + .orginal-img
	{		
		opacity: 1;
	}
/*----------######## Slider CSS ############-----------*/
	/*jssor slider loading skin spin css*/
        .jssorl-009-spin img {
            animation-name: jssorl-009-spin;
            animation-duration: 1.6s;
            animation-iteration-count: infinite;
            animation-timing-function: linear;
        }

        @keyframes jssorl-009-spin {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }

        /*jssor slider arrow skin 106 css*/
        .jssora106 {display:block;position:absolute;cursor:pointer;}
        .jssora106 .c {fill:#fff;opacity:.3;}
        .jssora106 .a {fill:none;stroke:#000;stroke-width:350;stroke-miterlimit:10;}
        .jssora106:hover .c {opacity:.5;}
        .jssora106:hover .a {opacity:.8;}
        .jssora106.jssora106dn .c {opacity:.2;}
        .jssora106.jssora106dn .a {opacity:1;}
        .jssora106.jssora106ds {opacity:.3;pointer-events:none;}
	.slider
	{
		width:100%;
		display:block;
		position:relative;
	}
	.slider img
	{
		max-width:100%;
	}
	.carousel-item>img
	{
		max-width:100%;
	}
	.flash-text
	{
		position:absolute;
		bottom:0%;
		left:0;
		padding:1rem;
		perspective:1000px;
	}
	.flash-text>p
	{
		background: #c98e36;
		color: #ffffff;
		transform-style: preserve-3d;
		padding: 1rem;
		transition: all ease-in-out 0.5s;
		font-size: 1.2rem;
		text-transform:uppercase;
	}
/*----------######## Site Content Panel CSS ############-----------*/
	.main-content
	{
		width:100%;
		display:block;
		padding:1rem 0;
		background:#ffffff;
	}
	.site-address
	{
		width:100%;		
	}
	.site-address>h4
	{
		text-align: left;
		font-size: 1rem;
		font-weight: 400;
		padding: 1rem 0;
	}
	.site-address>h4>a
	{
		color: #000000;
	}
	.site-contact-no
	{
		width:100%;		
	}
	.site-contact-no>h4
	{
		text-align:right;
		font-size: 1rem;
		font-weight: 400;
		padding: 1rem 0;
	}	
	.site-contact-no>h4>a
	{
		color: #000000;
	}
	
	.site-contact-no>h4>a>i, .site-address>h4>a>i
	{
		transition:top 0.5s ease-in-out;
		position:relative;
	}
	.site-address>h4>a:hover i, .site-contact-no>h4>a:hover i
	{
		animation-name:i-ani;
		animation-duration:1s;
		animation-iteration-count:1;
	}
@keyframes i-ani
{
	0%{top:0px;}
	25%{top:-5px;}
	50%{top:0px;}
	75%{top:-3px;}
	100%{top:0;}
}

/*------------------------ text-typography CSS Formating ---------------*/
	.text-typography
	{
		width:100%;
		display:block;
		text-align:center;
	}
	.text-typography>h1>small
	{		
		color: #004e9a;
	}
	.text-typography>h1>small:first-letter
	{
		text-transform:uppercase;
	}
	
/*--------------- reception-clock CSS -----------*/
	.reception-bg
	{		
		padding: 2rem;
		background: rgba(0, 51, 99, 0.5);
	}
	.reception-clock
	{
		width:100%;
		display:block;
		position:relative;
	}
	.reception-clock-img
	{
		display:block;
		position:relative;
	}
	.reception-clock-img>img
	{
		max-width:100%;
		display:block;
		margin:0 auto;
		user-select: none;
		pointer-events: none;
	}
	.img-after
	{
		position:relative;
	}
	.img-after:after
	{content: '';
    position: absolute;
    background: gray;
    width: 100%;
    height: 100%;
    top: 0;
    z-index: -999;
    left: 0;
	}
	.reception-clock-img>h4
	{
		position: absolute;
		bottom: 0;
		left: 50%;
		transform: translateX(-50%);
		font-weight: 700;
	}
	.reception-text
	{
		padding:1rem 0;
	}
	.reception-text>p
	{
		color: #ffffff;
	}
	
/*------------- Apartments Room Layout CSS ----------------*/
	.aprt-wrap 
	{
		background: #f2f2f2;
		padding: 20px 0px;
		position: relative;
	}
	.hotel-facility-wrap
	{
		background:#ffffff !important;
	}
	.aprt-wrap>.container-fluid, .hotel-facility-wrap>.container-fluid,.hotel-location-wrap>.container-fluid
	{		
		max-width: 80%;
	}
	.aprt-block 
	{
		width: 100%;
		border: 0px solid green;
		position: relative;
		z-index: 1;
	}
	.aprt-position-block 
	{
		position: relative;
	}
	.aprt-position-block>img 
	{
		max-width: 100%;
		display: block;
		margin: 0px auto;
		user-select: none;
		pointer-events: none;
	}
	.room-text 
	{
		z-index: 4;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 100%;
		text-align: center;
		color: #ffffff;
		transition: all ease-in-out 0.5s;
	}
	.room-text>a 
	{
		color: #000000;
	}
	.aprt-position-block:hover:after
	{
		transform:scale(0);
	}
	.aprt-position-block:hover .room-text
	{
		top: 0%;
		transform: translate(-50%, 0%);
	   background:#000000;
	}
	.aprt-position-block:hover .room-text>a
	{
		color:#ffffff;
		text-transform:capitalize;
		text-decoration:none;
	}
	.room-text>h2, .room-text>a>h2 
	{
		font-family: var(--Haviland) !important;
		text-transform: capitalize;
		font-weight: 300;
		background: rgba(0,0,0,0.5);
		color: #ffffff;
		padding: 0.5rem 0;
		font-size: 2.5rem;
	}
	.room-text>h4, .room-text>a>h4 
	{
		text-transform: capitalize;
		font-weight: 300;
		display:none;
	}
	.room-price 
	{
		width: 50%;		
		position: absolute;
		padding: 7px;
		/*background: #153764;*/
		text-align: center;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%) scale(0);
		transition: all ease-in-out 0.5s;
	}
	
	.aprt-position-block:after 
	{
		/*content: '';
		position: absolute;
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,0.5);
		top: 0;
		left: 0;
		 transform: scale(1); 
		z-index: 2;
		transition: all ease-in-out 0.5s;*/
	}
	.room-price>a 
	{		
		text-transform: uppercase;
		font-family: var(--playfair);
		text-decoration: none;
		color: #ffffff;
		position: relative;
		display: block;
		margin: 1rem auto;
		background: #153764;
		padding: 0.5rem 0;
	}
	.room-price>a:after
	{
		content:'';
		position:absolute;
		width: 100%;
		height: 100%;
		background: #0057a2;
		left: 0;
		top: 0;
		z-index: -1;
		transform: scaleX(0);
		transition: all 0.2s linear;
	}
	.room-price>a:hover:after
	{
		transform: scaleX(1);
	}
	.room-price>a>span 
	{
		font-size: 1.3rem;
	}
	.aprt-position-block:hover .room-price
	{	
	   top: 90%;
	   transform: translate(-50%, -100%) scale(1);
	}
	
	.aprt-h1
	{
		text-align:center;
	}
	.aprt-h1>h1
	{
		text-align: center;
		font-family: var(--playfair);
		text-transform: uppercase;
	}
	
/*###################### Hotel MAp Location #################*/
.hotel-map img
{
	max-width:100%;
}
	.hotel-map-wrap
	{
		background:#ebebeb;
		padding: 3% 0px;
	}
	.hotel-map-text
	{
		
	}
	.hotel-map-text>a.common-btn
	{
		text-transform: uppercase;
		margin: 20px auto;
		text-align: center;
		padding: 12px 10px;	
	}
	.hotel-map-text>h2
	{
		
	}
	.hotel-map-text>h4
	{
		font-size: 1rem;
		color: #13509b;
	}
	.hotel-map-text>p
	{
	}
	.hotel-map-text>p>a
	{
		color: #16365d;
		font-weight: 600;
	}
	
	.hotel-map-text>a.common-btn 
	{
		text-transform: uppercase;
		margin: 20px auto;
		text-align: center;
		padding: 12px 10px;
		color: #ffffff;
		background: #15365B;
	}
	
/*######################### Guest Comment #################*/
	.guest-comment-wrap
	{
		padding: 3% 0px;
	}
	.guest-comment-text
	{
	}
	.guest-comment-text>blockquote
	{
		font-size:1rem;
	}
	.guest-comment-text>a.common-btn
	{
		text-transform: uppercase;
		padding: 2% 5%;
		background:#15365B;
	}
	.guest-comment-img
	{
	}
	.guest-comment-img>img
	{
		max-width:100%;
	}
	

/*############### Footer CSS ####################*/
	.footer-wrap
	{
		background:#153764;
		padding:1% 0 0;
	}
	.f-scroll
	{
		position: fixed;
		bottom: 1%;
		right: 5%;
		padding: 5px;
		width: 50px;
		height: 50px;
		background: #0e2c51;
		z-index: 999;
		border-radius: 50%;
		cursor: pointer;
		
	}
	.f-scroll:after
	{
			content: '';
		position: absolute;
		clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
		height: 30px;
		background: #ffffff;
		width: 30px;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
	}
	.footer-address
	{
		color:#ffffff;
	}
	.footer-address>a>img
	{
		max-width:100%;
	}
	.footer-address>h4
	{
		text-transform: capitalize;
		font-family: var(--font-family-playfair);
	}
	.footer-address>h4>a
	{
		color:#ffffff;
		text-decoration:none;
	}
	.footer-address>p
	{
		font-size: 0.9rem;
		font-weight: 300;
		margin-bottom: 7px;
	}
	.footer-address>p>a
	{
		color:#ffffff;
		line-height: 0px;
	}
	.footer-address>p>span
	{
		text-transform:capitalize;
	}
	.footer-address>a.common-btn
	{
		text-transform: uppercase;
		border: 2px solid #988155;
		padding: 2% 8%;
		font-size: 1rem;
		margin-top:20px;
	}
	.footer-li>li
	{
		min-height: 24px;
		overflow: hidden;
		text-transform: capitalize;
		font-weight: 300;
		transition:all ease-in-out 0.5s;
	}
	.footer-li>li.f-active
	{
		user-select:none;
		-webkit-user-select:none;
		-ms-user-select:none;
		-moz-user-select:none;
		pointer-events:none;
		transform:scale(1);
	}
	.footer-li>li>a
	{
		color:#ffffff;
		text-decoration:none;
	}

	.footer-li>li:hover
	{
		animation-name:footer-li;
		animation-iteration-count:1;
		animation-fill-mode:forwards;
		animation-duration:0.7s;   
	}
	.f-active
	{
		font-size:0.8rem;
	}
	@keyframes footer-li
	{
		from
		{
			font-size:0.95rem;
		}
		to
		{
			font-size:0.8rem	
		}
	}
	.footer-social
	{
		background:#0f2c51;
	   padding: 7px 0px;
	}

	.f-social-ul>ul
	{
		margin-bottom:0;
	}
	.f-social-ul>ul>li
	{
		color:#ffffff;
		padding:7px;
	}
	.f-social-ul>ul>li>a
	{
		white-space: nowrap;
		color: #8fa3bf;
		text-transform: uppercase;
		font-size: 0.85rem;
	}
	.f-social-ul>ul>li>span	
	{
		font-size: 0.74rem;
		color: #56667d;	
	}
	.f-social-ul>ul>li>a>img
	{
	}
	.f-active
	{		
	}
	#copy-right
	{
		width:100%;
		display:block;
		background: #012d5c;		
	}
	#copy-right>p
	{
		color: #b5b5b5;
		font-size: 0.8rem;
		text-align: center;
		margin-bottom: 0;
		padding: 0.1rem 0;
	}
    #copy-right>p>a
	{
    color: #b5b5b5;
    }
	.extra-menu>li
	{
		font-size: 0.8rem;
		padding: 0.2rem;
	}
	.extra-menu>li>a
	{
		color:#74adf8;
		text-decoration:none;
	}
/*------############# Accommodation page CSS ###########-------*/
	.acc-room-wrap
	{
		width:100%;
		border:1px solid green;
	}
	.acc-room-img
	{
		width:100%;
		border:1px solid red;
	}
	.acc-room-text
	{
		width:100%;
		border:1px solid blue;
	}
	
/*!!!!!!!!---------- Gallery PAge ----------*/
	.gallery-wrapper
	{
		align-items:center;
	}
	.filter-li
	{
		display: flex;
		flex-flow: wrap row;
		justify-content: center;
		align-items: center;
		list-style: none;
	}
	.filter-li>li:first-child 
	{
		margin-left: 0rem;
	}
	.filter-li>li 
	{
		text-transform: uppercase;
		background: #e9aa77;
		margin-left: 1rem;
		padding: 0.5rem 1rem;
		cursor: pointer;
	}
	.filter-active 
	{
		background: #af5003 !important;
		color: #ffffff;
	}
	.filter-li~.common-flex>[class*=col-]
	{
		max-height: 270px;
		overflow: hidden;
		border: 0px solid;
		margin: 0.5rem 0;
	}
	
/*------------ Local Attraction Page CSS -------------*/
	.nearby-town
	{
		position:relative;
		z-index:99;
	}
	.nearby-town:after
	{
		/*content: '';
		position: absolute;
		border: 1px solid #dddddd;
		right: 0;
		top: 0;
		height: 100%;
		z-index:-10;*/
	}
	.nearby-town>li
	{
		position: relative;
		width: 50%;
		margin: 0rem 0rem;
		list-style: none;
		padding: .5rem 1rem;
		z-index: 10;
	}
	.nearby-town>li:nth-of-type(2),.nearby-town>li:nth-of-type(3),.nearby-town>li:nth-of-type(5),.nearby-town>li:nth-of-type(6),.nearby-town>li:nth-of-type(8),.nearby-town>li:nth-of-type(9),.nearby-town>li:nth-of-type(11),.nearby-town>li:nth-of-type(12),.nearby-town>li:nth-of-type(14),.nearby-town>li:nth-of-type(15)
	{
		z-index:-10;
	}
	.nearby-town>li:after
	{
		content: '';
		position: absolute;
		border: 1px solid #dddddd;
		right: 0;
		top: 0;
		height: 100%;
		z-index:-10;
	}
	.nearby-town>li:nth-of-type(even):after
	{
		right: 100%;
		z-index: -10;
	}
	.nearby-town-block
	{		
		background: #d2d2d2;
		position: relative;
		padding: 0.5rem 1rem;
		border-radius: 20px 1px;	
	}
	.nearby-town>li:nth-of-type(odd) .nearby-town-block
	{
		text-align:right;
	}
	.nearby-town>li>.testium
	{
		position: absolute;
		background: #044c97;
		border-radius: 30px;
		padding: 1rem 1rem;
		display:flex;
		flex-flow:row wrap;
		justify-content:center;
		align-items:center;
		text-align: center;
		color:#ffffff;
	}
	.nearby-town>li:nth-of-type(odd) .testium
	{
		top: 50%;
		right: 0%;
		transform: translate(50%, -50%);
	}
	.nearby-town>li:nth-of-type(even) .testium
	{
		top: 50%;
		left: 0%;
		transform: translate(-50%, -50%);
	}
	.nearby-town>li>.testium>i
	{
		width:100%;
	}
	.nearby-town>li>.testium>span
	{
		width:100%;
		font-size:0.9rem;
	}
	
	.local-attraction
	{
		display:block;
		margin: 1rem 0 2rem;
	}
	
	.local-attraction-block
	{
		text-align: center;
	}
	.local-attraction>ul
	{
		list-style:none;
		margin:0;
	}
	.local-attraction>ul>li
	{
		width: 32%;
		border: 0px solid green;
		margin: 1rem 0.3rem;
		position:relative;
		box-shadow: 2px 2px 10px #000000;
		text-align: center;
		text-transform: uppercase;
		padding: 1.4rem 0;
		border-radius: 5px;
		transition: all ease-in-out 0.5s;
	}
	
	.local-attraction>ul>li>h4
	{
		transition: all ease-in-out 0.3s;
		font-size: 1.4rem;
		text-transform: capitalize;		
	}
	.local-attraction>ul>li>.local-attraction-block
	{
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%) scale(0);
		transition: all ease-out 0.5s;
	}
	.local-attraction>ul>li:hover h4
	{
		transform:scale(0);
	}
	.local-attraction>ul>li:hover .local-attraction-block
	{
		transform: translate(-50%, -50%) scale(1);
	}
	.local-attraction-block>p
	{
		font-weight: 600;
	}
	.local-attraction-block>p>i
	{
	}
	.local-attraction-block>a
	{
		text-decoration: none;
		font-size: 0.9rem;
		text-transform: capitalize;
		background: #3b3b3b;
		color: #ffffff;
		padding: 0.3rem 0.4rem;
	}
	.local-attraction-block>a:hover
	{
		background:#000000;
	}
	
/*------############ Contact Us Page CSS ------#########*/
	form#forms
	{
		display:flex;
		flex-flow:wrap row;
		justify-content:center;
		align-items:center;
	}
	form#forms>.form-group
	{
		position:relative;
		z-index: 9;	
	}
	form#forms>.form-group:nth-of-type(1)
	{
		width: 44%;
		margin: 1rem;
	}
	form#forms>.form-group:nth-of-type(2)
	{
		width: 44%;
		margin: 1rem;
	}
	form#forms>.form-group:nth-of-type(3)
	{
		width: 44%;
		margin: 1rem;
	}
	form#forms>.form-group:nth-of-type(4)
	{
		width: 44%;
		margin: 1rem;
	}
	form#forms>.form-group:nth-of-type(5)
	{
		width: 93%;
		margin: 1rem;
	}
	form#forms>.form-group>label
	{
		position: absolute;
		left: 2%;
		top: 50%;
		transform: translateY(-50%);
		opacity:0;
		transition:all ease-in-out 0.5s;
	}
	form#forms>.form-group>input
	{
		height: 40px;
		width: 100%;
		text-transform: capitalize;
		font-family: var(--Raleway);
		padding: 0.5rem 0 0;
	}
	form#forms>.form-group>textarea
	{
		width:100%;
		padding: 0.5rem 0 0;
	}
	form#forms>.form-group>input[type='email']
	{
		text-transform:inherit;
	}
	form#forms>.form-group>input::placeholder, form#forms>.form-group>textarea::placeholder
	{
		font-family: var(--Raleway);
		color: #a4a4a4;
		text-transform:uppercase;
		transition:opacity 0.3s linear;
	}
	form#forms>.form-group>input:hover + label, form#forms>.form-group>textarea:hover + label
	{
		top: 0;
		background: linear-gradient(180deg, #ffffff, #ffffff);
		padding: 0 1rem;
		font-size: 0.9rem;
		text-transform: capitalize;
		font-weight: 600;
		color: #000000;
		z-index: 10;
		opacity:1		
	}
	form#forms>.form-group>input:hover::placeholder, form#forms>.form-group>textarea:hover::placeholder
	{
		opacity:0;
	}
	form#forms>.form-group>input[type='submit']
	{
		background: #000000;
		color: #ffffff;
		border: none;
		padding: 0 1rem;
		border-radius: 3px;
	}
	form#forms>.form-group>input[type='submit']:hover
	{
		background: #373737;
	}
	form#forms>.form-group>input + label + span, form#forms>.form-group>textarea + label+span
	{
		position: absolute;
		left: 1%;
		bottom: -65%;
		text-transform: capitalize;
		color: #ff0000;
		font-size: 0.9rem;
		opacity:0;
		transition:opacity 0.5s linear;
	}
	form#forms>.form-group>textarea + label+span
	{
		bottom:-9%;
	}
	
/*------------- Indicidual Room CSS ------------*/
	.in-room-li
	{
		margin-top: 3rem !important;	
	}
	.in-room-li>[class^='col-']>li
	{
		text-align:left;
		margin-left:20px;
		padding:0.5rem 0;
	}
	.in-room-li>[class^='col-']>h4.common-h4
	{
		font-family: var(--raleway);
		font-weight: 600;
		font-size: 1.2rem;
		text-transform: inherit;
		color: #d4a500;
		line-height: inherit;
	}
/*################ motel-facility CSS ###############*/
	.motel-facility
	{
		padding:0.5rem;
	}
	.motel-facility>li
	{
		width: 32%;
		position: relative;
		min-height: 200px;
		box-shadow: 2px 2px 9px;
		margin: 0.5rem 0.2rem;
		display: flex;
		align-content: center;
		justify-content: center;
		padding: 0.5rem;
		flex-flow:row wrap;
	}
	.motel-facility>li>h4, .motel-facility>li>p
	{
		width:100%;
	}