/*

	Template Name 	: The Grand Hotel and Resort Site Template

	Author 			: Awaiken Theme

	Author Url 		: http://awaikenthemes.com

*/



body{

	font-size: 16px;

	font-family: 'Poppins', sans-serif;

}



h1,

h2,

h3,

h4,

h5,

h6{

	margin-top:0;

	font-weight: 700;

}



img{

	max-width: 100%;

}



a:hover{

	text-decoration: none;

	outline: 0;

}



a:focus{

	text-decoration: none;

	outline: 0;

}



::-moz-selection {

    color: #fff;

    background: #518597;

}



::selection {

	color: #fff;

    background: #518597;

}



.preloader{

    background: #518597;

    bottom: 0;

    left: 0;

    position: fixed;

    right: 0;

    top: 0;

    z-index: 99999;

}



.browser-screen-loading-content {

    text-align: center;

    height: 2em;

    max-width: 100%;

    position: absolute;

    top: 0;

    right: 0;

    bottom: 3em;

    left: 0;

    margin: auto;

}



.loading-dots {

    margin-left: -1.5em;

    opacity: 0;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";

    filter: alpha(opacity=0);

    -webkit-animation: loading-dots-fadein .5s linear forwards;

    -moz-animation: loading-dots-fadein .5s linear forwards;

    -o-animation: loading-dots-fadein .5s linear forwards;

    -ms-animation: loading-dots-fadein .5s linear forwards;

    animation: loading-dots-fadein .5s linear forwards;

}



.loading-dots i {

    width: .5em;

    height: .5em;

    display: inline-block;

    vertical-align: middle;

    background: #e0e0e0;

    -webkit-border-radius: 50%;

    border-radius: 50%;

    margin: 0 .125em;

    -webkit-animation: loading-dots-middle-dots .5s linear infinite;

    -moz-animation: loading-dots-middle-dots .5s linear infinite;

    -o-animation: loading-dots-middle-dots .5s linear infinite;

    -ms-animation: loading-dots-middle-dots .5s linear infinite;

    animation: loading-dots-middle-dots .5s linear infinite;

}



.loading-dots.dark-gray i {

    background: #fff;

}



.loading-dots i:first-child {

    -webkit-animation: loading-dots-first-dot .5s infinite;

    -moz-animation: loading-dots-first-dot .5s linear infinite;

    -o-animation: loading-dots-first-dot .5s linear infinite;

    -ms-animation: loading-dots-first-dot .5s linear infinite;

    animation: loading-dots-first-dot .5s linear infinite;

    opacity: 0;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";

    filter: alpha(opacity=0);

    -webkit-transform: translate(-1em);

    -moz-transform: translate(-1em);

    -o-transform: translate(-1em);

    -ms-transform: translate(-1em);

    transform: translate(-1em);

}



.loading-dots i:last-child {

    -webkit-animation: loading-dots-last-dot .5s linear infinite;

    -moz-animation: loading-dots-last-dot .5s linear infinite;

    -o-animation: loading-dots-last-dot .5s linear infinite;

    -ms-animation: loading-dots-last-dot .5s linear infinite;

    animation: loading-dots-last-dot .5s linear infinite;

}



.loading-text{

	color: #fff;

	margin-top: 20px;

	letter-spacing: 0.1em;

}



@-moz-keyframes loading-dots-fadein {

    100% {

        opacity: 1;

        -ms-filter: none;

        filter: none

    }

}



@-webkit-keyframes loading-dots-fadein {

    100% {

        opacity: 1;

        -ms-filter: none;

        filter: none

    }

}



@-o-keyframes loading-dots-fadein {

    100% {

        opacity: 1;

        -ms-filter: none;

        filter: none

    }

}



@keyframes loading-dots-fadein {

    100% {

        opacity: 1;

        -ms-filter: none;

        filter: none

    }

}



@-moz-keyframes loading-dots-first-dot {

    100% {

        -webkit-transform: translate(1em);

        -moz-transform: translate(1em);

        -o-transform: translate(1em);

        -ms-transform: translate(1em);

        transform: translate(1em);

        opacity: 1;

        -ms-filter: none;

        filter: none

    }

}



@-webkit-keyframes loading-dots-first-dot {

    100% {

        -webkit-transform: translate(1em);

        -moz-transform: translate(1em);

        -o-transform: translate(1em);

        -ms-transform: translate(1em);

        transform: translate(1em);

        opacity: 1;

        -ms-filter: none;

        filter: none

    }

}



@-o-keyframes loading-dots-first-dot {

    100% {

        -webkit-transform: translate(1em);

        -moz-transform: translate(1em);

        -o-transform: translate(1em);

        -ms-transform: translate(1em);

        transform: translate(1em);

        opacity: 1;

        -ms-filter: none;

        filter: none

    }

}



@keyframes loading-dots-first-dot {

    100% {

        -webkit-transform: translate(1em);

        -moz-transform: translate(1em);

        -o-transform: translate(1em);

        -ms-transform: translate(1em);

        transform: translate(1em);

        opacity: 1;

        -ms-filter: none;

        filter: none

    }

}



@-moz-keyframes loading-dots-middle-dots {

    100% {

        -webkit-transform: translate(1em);

        -moz-transform: translate(1em);

        -o-transform: translate(1em);

        -ms-transform: translate(1em);

        transform: translate(1em)

    }

}



@-webkit-keyframes loading-dots-middle-dots {

    100% {

        -webkit-transform: translate(1em);

        -moz-transform: translate(1em);

        -o-transform: translate(1em);

        -ms-transform: translate(1em);

        transform: translate(1em)

    }

}



@-o-keyframes loading-dots-middle-dots {

    100% {

        -webkit-transform: translate(1em);

        -moz-transform: translate(1em);

        -o-transform: translate(1em);

        -ms-transform: translate(1em);

        transform: translate(1em)

    }

}



@keyframes loading-dots-middle-dots {

    100% {

        -webkit-transform: translate(1em);

        -moz-transform: translate(1em);

        -o-transform: translate(1em);

        -ms-transform: translate(1em);

        transform: translate(1em)

    }

}



@-moz-keyframes loading-dots-last-dot {

    100% {

        -webkit-transform: translate(2em);

        -moz-transform: translate(2em);

        -o-transform: translate(2em);

        -ms-transform: translate(2em);

        transform: translate(2em);

        opacity: 0;

        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";

        filter: alpha(opacity=0)

    }

}



@-webkit-keyframes loading-dots-last-dot {

    100% {

        -webkit-transform: translate(2em);

        -moz-transform: translate(2em);

        -o-transform: translate(2em);

        -ms-transform: translate(2em);

        transform: translate(2em);

        opacity: 0;

        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";

        filter: alpha(opacity=0)

    }

}



@-o-keyframes loading-dots-last-dot {

    100% {

        -webkit-transform: translate(2em);

        -moz-transform: translate(2em);

        -o-transform: translate(2em);

        -ms-transform: translate(2em);

        transform: translate(2em);

        opacity: 0;

        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";

        filter: alpha(opacity=0)

    }

}



@keyframes loading-dots-last-dot {

    100% {

        -webkit-transform: translate(2em);

        -moz-transform: translate(2em);

        -o-transform: translate(2em);

        -ms-transform: translate(2em);

        transform: translate(2em);

        opacity: 0;

        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";

        filter: alpha(opacity=0)

    }

}



/************************************/

/*****    Navigation area css   *****/

/************************************/



.navbar{

	margin-bottom: 0;

}



.navbar-brand{

	padding: 0;

	transition: all 0.3s;

}



.navbar-brand img{

	height: 68px;

	transition: all 0.3s;

}



.navbar-brand h1{

	font-size: 30px;

	margin: 0;

	color: #8bc34a;

	font-family: 'Berkshire Swash', cursive;

	font-weight: normal;

	transition: all 0.5s;

	-webkit-transition: all 0.5s;

	-moz-transition: all 0.5s;

}



.navbar-brand h1 span{

	color: #fff;

	font-family: 'Saira Semi Condensed', sans-serif;

	transition: all 0.5s;

	-webkit-transition: all 0.5s;

	-moz-transition: all 0.5s;

}



.navbar-nav{

	padding: 15px 0;

}



.navbar-default{

	background: rgba(0,0,0,0.12);

	border: none;

	border-bottom: none;

	padding: 20px 0;

	border-radius: 0;

	z-index: 12;

	transition: all 1s;

	-webkit-transition: all 1s;

	-moz-transition: all 1s;

}



.navbar-default .navbar-nav>li>a:hover{

	color: #fff !important;

}



.navbar-default .navbar-nav>li>a:focus{

	color: #fff !important;

}



.sticky-header{

	background: #518597;

	padding: 10px 0;

	border-bottom: none;

	transition: all 0.3s ease-out;

    -webkit-transition: all 0.3s ease-out;

}



.sticky-header .navbar-brand{

	padding-top: 8px;

}



.navbar-default .navbar-nav>li>a{

	font-size: 15px;

	text-transform: uppercase;

	color: #fff;

	letter-spacing: 0.025em;

	padding: 8px 15px 6px;

	position: relative;

	font-weight: 400;

	border: 1px solid transparent;

}



.active a{

	background: none !important;

	color: #fff !important;

	border: 1px solid #fff !important;

}



.sticky-header .active a{

	background: none !important;

	color: #fff !important;

}



.sticky-header .navbar-brand img{

	filter: brightness(0) invert(1);

	height: 50px;

}



.navbar-default .active a:after{

	transform: scale(1) !important;

	-webkit-transform: scale(1) !important;

	-moz-transform: scale(1) !important;

}



.slicknav_nav .active a{

	border: none !important;

}



.btn-custom{

	display: inline-block;

	min-width: 140px;

	text-align: center;

	background: #518597;

	color: #fff;

	text-transform: uppercase;

	font-size: 14px;

	padding: 12px 20px;

	letter-spacing: 0.08em;

	transition: all 0.4s;

}



.btn-custom:hover{

	background: #212121;

	color: #fff;

}



.btn-custom:focus{

	color: #fff;

}



.navbar-default .navbar-toggle{

	border-radius: 0;

	border-color: #fff;

	padding: 0;

}



.navbar-default .navbar-toggle .icon-bar{

	background: #fff;

}



.navbar-default .navbar-toggle:hover{

	background: none;

}



/************************************/

/*****     Slider area css      *****/

/************************************/



.banner{

	position: relative;

	top: 0px;

	left: 0;

	width: 100%;

	background: url(../images/banner.jpg) no-repeat bottom center fixed;

	background-size: cover;

	padding: 246px 0 140px;

}



.banner:after{

	content: '';

	display: block;

	position: absolute;

	left: 0;

	top: 0;

	width: 100%;

	height: 100%;

	background: rgba(18,173,142,0.30);

}



.banner .row{

	position: relative;

	z-index: 1;

}



.offter-container{

	text-align: center;

	max-width: 556px;

	margin: 0 auto;

	background: rgba(0,0,0,0.40);

	padding: 20px;

}



.banner-offter-box{

	border: 1px solid rgba(255,255,255,0.24);

	padding: 50px 40px;

}



.banner-offter-box h2{

	color: #fff;

	font-size: 28px;

	margin-bottom: 1.2em;

}



.banner-offter-box h2 span{

	color: #518597;

}



.banner-offter-box p{

	color: #fff;

	font-size: 14px;

	line-height: 1.5em;

	margin-bottom: 1.5em;

}



.main-title{

	margin-bottom: 30px;

	text-align: center;

}



.main-title h2{

	font-size: 36px;

	color: #518597;

	text-transform: uppercase;

	margin-bottom: 6px;

}



.main-titles h2{

	font-size: 36px;

	color: #518597;

	text-transform: uppercase;

	margin-bottom: 6px;

}

.main-title p{

	font-size: 17px

	    color: #5d8b94;



}



.main-titles p{

	font-size: 22px;

	    color: #5d8b94;

	    font-weight: 600;

}

.aboutus{

	position: relative;

	padding: 100px 0;

	background: url(../images/about-bg.jpg) no-repeat top center fixed;

	background-size: cover;

}



.aboutus:before{

	content: '';

	display: block;

	position: absolute;

	top: 0;

	left: 0;

	right: 0;

	bottom: 0;

	background: rgba(255,255,255,0.9);

}



.aboutus-image{



}



.aboutus-image img{

	border-radius: 50%;

	border: 1px solid #e8e8e8;

	padding: 14px;

	background: #fff;

}



.aboutus-content .main-title{

	text-align: left;

	margin-bottom: 30px;

}



.aboutus-content{

	padding-top: 20px;

}



.aboutus-entry p{

	font-size: 16px;

	color: #535353;

	line-height: 1.5em;

	margin-bottom: 1.5em;

}



.about-social{

	margin: 30px 0 0;

}



.about-social a{

	font-size: 18px;

	color: #518597;

	display: inline-block;

	margin-right: 20px;

	transition: all 0.3s;

}



.about-social a:hover{

	color: #2f2f2f;

}



#myVideo {

  position: fixed;

  right: 0;

  bottom: 0;

  min-width: 100%;

  min-height: 100%;

}



.content {

  position: fixed;

  bottom: 0;

  background: rgba(0, 0, 0, 0.5);

  color: #f1f1f1;

  width: 100%;

  padding: 20px;

}



#myBtn {

  width: 200px;

  font-size: 18px;

  padding: 10px;

  border: none;

  background: #000;

  color: #fff;

  cursor: pointer;

}



#myBtn:hover {

  background: #ddd;

  color: black;

}









.videoWrapper {

  position: relative;

  padding-bottom: 56.25%;

  /* 16:9 */

  padding-top: 25px;

  height: 0;

}



.videoWrapper iframe {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

}

#myFrame{

position:relative;

top:0;

left:0;

width:100%;

height:100%;

}





.back-to-top {

    position: fixed;

    bottom: 25px;

    right: 25px;

    display: none;

}

#text{

  position: absolute;

  color: #FFFFFF;

  left: 50%;

  top: 50%;

  transform: translate(-50%, -50%);

}



@media (min-aspect-ratio: 16/9) {

  .video-container iframe {

    height: 56.25vw;

  }

}

@media (max-aspect-ratio: 16/9) {

  .video-container iframe {

    width: 177.78vh;

  }

}

.services{

	background: #f9f9f9;

	padding: 80px 0;

}



.service-single{

	background: #fff;

	position: relative;

	margin-bottom: 30px;

}



.service-single:after{

	content: '';

	display: block;

	clear: both;

}



.service-single .service-image{

	width: 50%;

}



.right-service .service-content,

.left-service .service-image{

	float: left;

}



.left-service .service-content,

.right-service .service-image{

	float: right;

}



.service-single .service-content{

	padding: 24px;

	width: 50%;

}



.service-content h3{

	color: #212121;

	font-size: 16px;

	text-transform: uppercase;

	font-weight: 600;

	position: relative;

	padding-bottom: 10px;

	margin-bottom: 1em;

}



.service-content h3:after{

	content: '';

	display: block;

	width: 50px;

	height: 3px;

	background: #518597;

	position: absolute;

	bottom: 0;

	left: 0;

}



.service-content p{

	font-size: 14px;

	line-height: 1.5em;

	color: #737373;

}



.contact-bar{

	background: #518597;

	padding: 50px 0;

}



.contact-barinfo h3{

	font-size: 36px;

	color: #fff;

}



.contact-barinfo h3 span{

	color: #212121;

}



.contact-barinfo p{

	color: #fff;

	font-size: 16px;

	margin-bottom: 0;

}



.contact-bar-button{

	text-align: right;

}



.btn-booknow{

	display: inline-block;

	background: #212121;

	color: #fff;

	letter-spacing: 0.08em;

	text-transform: uppercase;

	font-size: 18px;

	padding: 12px 40px;

	margin-top: 10px;

	transition: all 0.3s;

}



.btn-booknow:hover{

	background: #2f5461;

	color: #fff;

}



.rooms{

	padding: 30px 0;

}



.room-single{

	border: 1px solid #e2e2e2;

	background: #fff;

	padding: 14px;

	margin-bottom: 30px;

}



.room-info{

	padding: 24px 14px 14px;

}



.room-info h3{

	position: relative;

	font-size: 17px;

	font-weight: 600;

	color: #518597;

	letter-spacing: 0.04em;

	text-transform: uppercase;

	padding-left: 26px;

	margin-bottom: 18px;

}



.room-info h3:before{

	content: '\f005';

	display: block;

	font-size: 18px;

	color: #518597;

	position: absolute;

	top: 0;

	left: 0;

	font-family: FontAwesome;

}



.room-info ul{

	padding: 0;

	margin: 0;

	list-style: none;

}



.room-info ul li{

	position: relative;

	display: block;

	font-size: 17px;

	color: #737373;

	padding: 4px 0 4px 20px;



}



.room-info ul li:before{

	content: '\e66c';

	font-size: 17px;

	font-family: 'Pe-icon-7-stroke';

	color: ;

	position: absolute;

	left: 0;

	top: 4px;

	list-style: none;

	display: none;

}







.btn-bookroom{

	display: inline-block;

	background: #518597;

	color: #fff;

	font-size: 14px;

	letter-spacing: 0.04em;

	padding: 10px 30px;

	margin-top: 18px;

	transition: all 0.3s;

}



.btn-bookroom:hover{

	background: #212121;

	color: #fff;

}



.intro-video{

	position: relative;

	padding: 140px 0;

	background: url(../images/video-bg.jpg) no-repeat center center;

}



.intro-video:before{

	content: '';

	display: block;

	position: absolute;

	top: 0;

	left: 0;

	bottom: 0;

	right: 0;

	background: rgba(18,173,142,0.65);

}



.paly-button{

	width: 110px;

	height: 110px;

	border: 1px solid #fff;

	border-radius: 50%;

	text-align: center;

	padding: 8px;

	margin: 0 auto;

}



.paly-button a{

	display: block;

	width: 92px;

	height: 92px;

	background: #fff;

	border-radius: 50%;

	font-size: 36px;

	color: #518597;

	padding-top: 20px;

	padding-left: 10px;

	transition: all 0.3s;

}



.paly-button a:hover{

	background: #518597;

	color: #fff;

}



.photo-gallery{

	padding: 80px 0;

}



.gallery-box{

	border: 1px solid #e2e2e2;

	padding: 14px;

	margin-bottom: 30px;

}



.mega-footer{

	background: #2f5461;

	padding: 80px 0;

}



.mega-footer .main-title{
	text-align: left;

	margin-bottom: 40px;

}



.mega-footer .main-title p{

	color: #fff;

}



.booknow-form{



}



.booknow-form .form-control{

	background: #373737;

	border: none;

	border-radius: 0;

	box-shadow: none;

	font-size: 12px;

	text-transform: uppercase;

	height: auto;

	padding: 10px;

	margin-bottom: 20px;

}



.btn-check{

	border: none;

	background: #518597;

	color: #fff;

	font-size: 14px;

	letter-spacing: 0.08em;

	text-transform: uppercase;

	padding: 12px 30px;

	transition: all 0.3s;

}



.btn-check:hover{

	background: #0b8f75;

}



.contactinfo-single{

	margin-bottom: 30px;

}



.contactinfo-single h3{

	color: #518597;

	font-size: 16px;

	font-weight: 400;

	position: relative;

	padding-left: 24px;

	margin-bottom: 4px;

}



.contactinfo-single h3:before{

	font-family: FontAwesome;

	position: absolute;

	top: 0;

	left: 0;

}



.contactinfo-single .address:before{

	content: '\f041';

}



.contactinfo-single .email:before{

	content: '\f0e0';

}



.contactinfo-single .contact:before{

	content: '\f025';

}



.contactinfo-single p{

	color: #a1a1a1;

	font-size: 14px;

	line-height: 1.6em;

	padding-left: 24px;

}



footer{

	background: #373737;

	padding: 40px 0;

	text-align: center;

}



.siteinfo p{

	color: #a1a1a1;

	margin: 0;

	font-size: 14px;

}



.siteinfo p a{

	color: #518597;

	transition: all 0.3s;

}



.siteinfo p a:hover{

	color: #fff;

}





.bg--gerybox {

    background-image: url(../images/greybox.jpg);

    background-repeat: repeat-y;

}

/************************************/

/*****        Media Screens     *****/

/************************************/



@media only screen and (max-width: 991px) {

	.navbar-default .navbar-nav>li>a{

		padding: 6px 10px 4px;

		font-size: 12px;

	}



	.aboutus-image{

		margin-bottom: 30px;

	}



	.contact-barinfo{

		text-align: center;

		margin-bottom: 20px;

	}



	.contact-bar-button{

		text-align: center;

	}

}



/* Mobile Layout */

@media only screen and (max-width: 767px){



	#responsive-menu{

		display: block;

	}



	.navbar-brand{

		padding-left: 15px;

		position: relative;

		top: -8px;

	}



	.slicknav_menu{

		margin-left: -15px;

		margin-right: -15px;

		padding: 0;

		background: none;

	}



	.slicknav_menu ul{

		background: #518597;

		position: relative;

		top: 16px;

	}



	.slicknav_menu li{

		padding: 0 10px;

	}



	.slicknav_menu .active a{

		color: #24292f;

	}



	.slicknav_menu a{

		color: #fff;

		padding-top: 6px;

		padding-bottom: 6px;

		text-transform: uppercase;

		border: 1px solid transparent;

	}



	.slicknav_menu a a{

		border: none !important;

	}



	.slicknav_nav .slicknav_row:hover,

	.slicknav_nav a:hover{

		color: #24292f;

	}



	.slicknav_menu  .active a{

		color: #24292f !important;

	}



	.slicknav_btn{

		padding: 4px 4px;

		background: none;

	}



	.slicknav_icon-bar{

		box-shadow: none;

		border-radius: 0;

		margin: 2px 0;

	}



	.banner{

		padding: 180px 0 100px;

	}



	.offter-container{

		padding: 12px;

	}



	.banner-offter-box{

		padding: 20px;

	}



	.banner-offter-box h2{

		font-size: 20px;

	}



	.banner-offter-box p{

		font-size: 12px;

	}



	.main-title{

		margin-bottom: 60px;

	}



	.main-title h2{

		font-size: 26px;

	}



	.aboutus,

	.services,

	.rooms,

	.photo-gallery,

	.mega-footer{

		padding: 60px 0;

	}



	.contact-barinfo h3{

		font-size: 26px;

	}



	.contact-barinfo p{

		font-size: 14px;

	}



	.btn-booknow{

		font-size: 14px;

	}



	.room-single{

		max-width: 340px;

		margin: 0 auto 30px;

	}



	.booknow-form{

		margin-bottom: 40px;

	}

}



/* Small Mobile Layout */

@media only screen and (max-width: 480px) {

	.navbar-brand img{

		height: 50px;

	}



	.navbar-default{

		padding: 10px 0;

	}



	.sticky-header .navbar-brand{

		top: -8px;

	}



	.navbar-brand{

		top: 0;

	}



	.banner{

		padding: 120px 0 60px;

	}



	.main-title h2{

		font-size: 22px;

	}



	.aboutus-entry p{

		font-size: 14px;

	}



	.service-single .service-image{

		float: none;

		width: 100%;

	}



	.service-single .service-content{

		width: 100%;

		float: none;

	}



	.intro-video{

		padding: 80px 0;

	}

}

