/*Fonts*/
@font-face {
    font-family: 'source_sans_proregular';
    src: url('../fonts/sourcesanspro-regular-webfont.woff2') format('woff2'),
         url('../fonts/sourcesanspro-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

/*---Elements---*/
html,
body { margin:0; padding:0; height:100%; font-family: 'source_sans_proregular'; }
a{cursor: pointer; text-decoration: none; color: inherit;}
h1, h2, p { margin: 0; font-weight: normal;}

/*Lifesaver*/
.btn {cursor: pointer; text-decoration: none;}
.btn, .smooth{transition-timing-function: linear; transition: .3s; -webkit-transition-timing-function: linear; -webkit-transition: .3s; }

.disabled { cursor: no-drop; opacity: 0.5; }

.clearfix:before, .clearfix:after {content: " "; display: table;}
.clearfix:after {clear: both;}

.full-width {width: 100%!important;}
.fr {float: right!important;}
.fl { float: left!important;}
.text-ar { text-align: right;}
.page-padding { padding: 115px 0; }
.opacity { opacity: 0.9!important; }

.ultra-wrapper { position: relative; float: left; width: 100%; min-height:100%;}
.ultra-content-wrapper { position: relative; float: left; width: 100%;}	

.fullscreen-wrapper { position: relative; float: left; width: 100%;}
.outer-wrapper{position: relative; margin: auto; width: 100%; max-width: 1350px; }
.wrapper{position: relative; margin: auto; width: 95%; }

.title-big { font-size: 24px; font-weight: normal; text-transform: uppercase;}
.title {  font-size: 16px; font-weight: normal; }
.text { font-size: 15px; }

.bg-dark-grey { background-color: #111111; }
.bg-grey { background-color: #333333; }
.bg-light-grey { background-color: #ededed; }
.bg-7d7c7a {background-color: #7d7c7a; }

.color-grey { color: #ccc; }
.color-light-grey { color: #ededed; }
.color-333 { color: #333333; }
.color-7878 { color: #787878; }


.grey-btn { border: thin solid #ccc; position: relative; padding: 5px 15px; margin-top: 85px; border-radius: 5px; margin-top: 8px;}
.grey-btn:hover { background-color: #ccc; color: #333333; }


/*Hover*/
.hover-effect:hover { opacity: 0.5; }

/*---Header--------*/
.main-header { position: absolute; top: 0; left: 0; background-color: #111111; opacity: 0.7; z-index: 6;}
.main-header .wrapper { padding-top: 15px; height: 80px}
.logo { position: relative; float: left; width: 124px;}
.logo img { width: 100%; }
.nav-wrapper { position: relative; float: right; /*width: 75%;*/ display: table; height: 100%; padding-top: 20px;}
.nav { position: relative; display: table-cell; vertical-align: middle; /*width: 16.5%;*/ text-align: center; height: 100%;}
.nav a { margin: 0 45px; }
.nav .active { border-bottom: thin solid #ccc; }
.nav-pipe { position: relative; display: table-cell; vertical-align: middle; /*width: 1%;*/ text-align: center; height: 100%;}
.book-now-btn-wrap { position: relative; float: right; /*width: 11%;*/ display: table; height: 100%;}
.book-now-btn { position: relative; display: table-cell; vertical-align: middle; height: 100%; padding-top: 20px; }
.book-now-btn a { float: right; background: none; border-style: none; border: 1px solid #ccc; padding: 5px 10px; margin-left: 45px; box-sizing: border-box; color: #ccc;}

.fixed-main-header {opacity: 1; padding-bottom: 5px; position: fixed; top: 0; left: 0;}
.fixed-main-header .wrapper { height: 60px;}
.fixed-main-header .nav-wrapper { padding-top: 15px; }
.fixed-main-header .book-now-btn { padding-top: 15px; }
.fixed-main-header .logo { width: 100px; }
.fixed-main-header .title { font-size: 15px; }

/*Mobile header*/
.mobile-header-icon { position: relative; float: right; width: 35px; display: none; }
.mobile-header-icon img { width: 100%; margin-top: 20px; }
.mobile-header-wrapper { position: absolute; left: 0; top: 79px; width: 180px; min-height: 87.5%; background-color: #111111; opacity: 0.9; z-index: 5; display: none;}
.mobile-header {padding: 20px 15px; box-sizing: border-box; }
.mobile-header-nav, .mobile-header-book-now { position: relative; float: left; width: 100%; }
.mobile-header-nav a { display: block; width: 100%; padding: 15px 0;}
.mobile-header-book-now .book-now-btn { padding-top: 20px; }
/*.mobile-header-nav:nth-child(5) { border-bottom: thin solid #ccc;}*/
.mobile-header-book-now a { margin-left: 0; }
.mobile-header-icon .close-menu, .mobile-header { display: none;}


/*---Footer--------*/
.footer-wrapper {width:100%; position:absolute; bottom:0; left:0;}
	.footer { position: relative; max-width: 1350px; width: 95%; margin: auto; padding: 20px 0;}
		.footer-socialmedia-wrap { position: relative; float: left; width: 15%;}
			.socialmedia-icon { position: relative; float: left; width: 17.5%; margin-right: 10%;}
			.socialmedia-icon:last-child { margin-right: 0; }
			.socialmedia-icon img { width: 100%; float: left; }
			.footer-text { position: relative; float: left; width: 70%; margin-left: 15%; line-height: 2; text-align: center; font-size: 14px; color: #ccc;}




/* - - - - - - - -  - - - -- - - - - - - - - - - - - Responsive - - - - -- - - - - - - - - - - - - - - - - - -- - - - - - - -*/

@media only all and (min-width: 1200px) and (max-width: 1300px) { 

	/*header*/
	.nav a { margin: 0 40px; } 
	.book-now-btn a { margin-left: 40px; }


}


@media only all and (min-width: 1024px) and (max-width: 1200px) { 

	/*header*/
	.nav a { margin: 0 28px; } 
	/*.book-now-btn a { margin-left: 28px; }*/

	/*footer*/
	/*.footer-text { width: 69%; margin-left: 13%; }
	.footer-socialmedia-wrap { width: 18%; }*/


}


@media only all and (min-width: 240px) and (max-width: 1024px) { 

	/*header*/
	/*.logo { float: right;}*/
	.nav-wrapper { display: none;}
	.book-now-btn-wrap { display: none;}

	/*mobile header*/
	.mobile-header-icon { display: block; }


	/*footer*/
	.footer-text { width: 69%; margin-left: 13%; line-height: normal; margin-top: 12px; font-size: 12px; }
	.footer-socialmedia-wrap { width: 18%; }

	/*layout*/
	.title-big { font-size: 22px; }
	.text { font-size: 14px; }
	.page-padding { padding: 100px 0;}

}

@media only all and (min-width: 820px) and (max-width: 920px) {

	/*footer*/
	.footer-text { width: 67%; margin-left: 13%; line-height: normal; margin-top: 12px; font-size: 12px; }
	.footer-socialmedia-wrap { width: 20%; }


}


@media only all and (min-width: 768px) and (max-width: 820px) {

	/*footer*/
	.footer-text { width: 66%; margin-left: 12%; line-height: normal; margin-top: 12px; font-size: 12px; }
	.footer-socialmedia-wrap { width: 22%; }


}


@media only all and (min-width: 240px) and (max-width: 768px) {

	/*footer*/
	.footer-text { width: 64%; margin-left: 11%; line-height: normal; margin-top: 10px; font-size: 12px; }
	.footer-socialmedia-wrap { width: 25%; }

	/*layout*/
	.title-big { font-size: 20px; }
	.text { font-size: 14px; }
	.page-padding { padding: 80px 0;}


}

@media only all and (min-width: 540px) and (max-width: 640px) {

	/*footer*/
	.footer-text { width: 70%; margin-left: 0%; text-align: left; line-height: normal; margin-top: 10px; font-size: 12px; }
	.footer-socialmedia-wrap { width: 30%; }

	/*header*/
	.fixed-main-header .logo { width: 75px; }
	.mobile-header-icon img { width: 30px; margin-top: 12px; }
	.fixed-main-header .wrapper { height: 48px;}
	.mobile-header-wrapper {top: 67px;}



}

@media only all and (min-width: 440px) and (max-width: 540px) {

	/*footer*/
	.footer-text { width: 68%; margin-left: 0%; text-align: left; line-height: normal; margin-top: 8px; font-size: 12px; }
	.footer-socialmedia-wrap { width: 32%; }

	/*header*/
	.fixed-main-header .logo { width: 75px; }
	.mobile-header-icon img { width: 30px; margin-top: 12px; }
	.fixed-main-header .wrapper { height: 48px;}
	.mobile-header-wrapper {top: 67px;}



}

@media only all and (min-width: 240px) and (max-width: 440px) {

	/*footer*/
	.footer-text { width: 100%; margin-left: 0%; text-align: center; line-height: normal; margin-top: 8px; margin-bottom: 10px; font-size: 12px; }
	.footer-socialmedia-wrap { width: 45%; margin: auto; float: none; margin-top: 10px; }

	/*layout*/
	.title-big { font-size: 18px; }
	.text { font-size: 13px; }
	.page-padding { padding: 60px 0;}

	/*header*/
	.fixed-main-header .logo { width: 75px; }
	.mobile-header-icon img { width: 30px; margin-top: 12px; }
	.fixed-main-header .wrapper { height: 48px;}
	.mobile-header-wrapper {top: 67px;}

}

@media only all and (min-width: 240px) and (max-width: 340px) {

	/*footer*/
	.footer-text { width: 100%; margin-left: 0%; text-align: center; line-height: normal; margin-top: 8px; margin-bottom: 10px; font-size: 12px; }
	.footer-socialmedia-wrap { width: 55%; margin: auto; float: none; margin-top: 10px; }

}

