
	:root {
	  --main: #007c85; /*teal*/
	  --acdent: #D31245; /*red*/
	  --ltteal: #5BA1A8;
	  --dkteal: #0B2729; /*dk teal */
	  --pale: #e8f3f5;
	  --font: #0b2729;
	  --maxW: 1200px;
	  }

	section.inside.first {padding-top: 0; padding-bottom: 0}
	section.inside.first section.photobanner:first-child{margin-top: 0}

	 a.ctaSG, a.ctaSR {	color: white; display: inline-block; text-decoration: none; cursor: pointer;line-height: 1; text-align: center; border-radius: 20px;	font-weight: 700; padding: 13px 20px;}
 

	 a.ctaSR{background-image: linear-gradient(to bottom, #d31245, #810828);}
	 a.ctaSR:hover,  a.ctaSR:focus {background-image: linear-gradient(to bottom, #ee3366, #be0c3d);}

	 a.ctaSG{background: linear-gradient(to bottom, #007c85, #0b2729);}
	 a.ctaSG:hover,  a.ctaSG:focus {background: linear-gradient(to bottom, #00b5c4, #175357);}

	 .spacer{ width: 100%; height: 80px;}

	/*XL*/
	@media only screen and (min-width: 1200px) {
	 .spacer{height: 120px;}
	}


/** HEADER ******************/
	
	header{background: linear-gradient(to bottom, rgba(0, 0, 0, 0.8) 15%, rgba(0, 0, 0, 0) 98%); position: absolute; top: 0; right: 0; transition: all .5s !important; box-shadow: none;}

	header.stuck{background: linear-gradient(to bottom, rgba(0, 0, 0, 1) 15%, rgba(0, 0, 0, 1) 98%); 		box-shadow: 0 3px 6px 0 rgba(0, 0, 0, .16)}

	a.homelink img {width: 189px;height: 77px}

	a.CMitem,	a.CMitem:visited,	button.CMitem {color: white;}
	a.CMitem:after,	button.CMitem:after {background-image: linear-gradient(to right, var(--main), var(--ltteal));}


	.toplinks a, .toplinks .TL a, .toplinks .notalink{color: white; text-decoration: none;}
	.toplinks .TL a:hover, .toplinks .TL a:focus, .toplinks a:hover, .toplinks a:focus{color: var(--ltteal); text-decoration: underline}
	#sitesearch {color: white}
	#sitesearch:hover, #sitesearch:focus{color: var(--ltteal);}

	a.apptCTA{color: #d31245;border: 2px solid #d31245;	display: inline-block;	text-decoration: none;		cursor: pointer;line-height: 1;text-align: center;border-radius: 20px;	font-weight: 700; position: absolute;top: 46px;right: 230px;width: 230px;padding: 11px 0;z-index: 102; background-image: linear-gradient(to bottom, white, white);}

	a.apptCTA:focus, a.apptCTA:hover {text-decoration: none;background-image: linear-gradient(to bottom, #d31245, #810828);	color: #fff;	border: 2px solid transparent;	border-top: 2px solid #d31245;	border-bottom: 2px solid #810828; }

	a.ctaR{ background-image: linear-gradient(to bottom, white, white);}

	a.ctaR:hover, section.rc-container a.ctaR:focus {background-image: linear-gradient(to bottom, #d31245, #810828);}


	.Bimg img{object-fit: cover; object-position: center;width: 100%;  height: 100%;}
	.Bimg{aspect-ratio: 796 / 465; height: auto;}
/*aspect ratio: {aspect-ratio: 3 / 2;} W/H*/



	@media only screen and (max-width:1199px) {
		header{ background-image: linear-gradient(to bottom, #000 78%, rgba(0, 0, 0, 0) 100%); position: relative; margin-bottom: -50px;}
		header .liner {	height: 190px}
		a.apptCTA {	position: relative;	left: -120px;top: 104px}
		header.stuck a.apptCTA, header.stuck #hb_bttn{display: none;}
	}

	@media only screen and (max-width:1199px) {
			header.stuck a.homelink img {
				width: 154px
			}
	}


	@media only screen and (max-width:575px) {
		header .liner {	height: 240px}
		a.apptCTA {position: relative;top: 130px; left: 0; width: 100%}
		a.homelink{left: 50%;	margin-left: -65px}
		header a.homelink img {width: 130px !important;}
	}

	@media only screen and (max-width:575px) {
			a.homelink img,
			header.stuck a.homelink img {
				width: 100px
			}
	}

/** PROMOS ******************************/

	section.hp_promos{position: relative;  z-index: 99; margin-top: -30px; max-width: calc(var(--maxW) + 30px);}
	.HPPbox{position: relative;border-radius: 15px;  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.25);width: 100%;  overflow: hidden; transition: all .25s; height: 265px}
	
	div.hp_promos{padding: 70px 30px; margin: 0 auto; position: relative; width: 100%}


	.HPPbox:hover{ box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.5);-moz-transform: translateY(-7px);-webkit-transform: translateY(-7px);-o-transform: translateY(-7px);-ms-transform: translateY(-7px);transform: translateY(-7px);}

	.HPPimg{width: 100%;  height: 100%; position: absolute; top: 0; right: 0; z-index: 1}
	.HPPimg img{object-fit: cover; object-position: center;width: 100%;  height: 100%;}
	
	.HPPtext{width: 100%;  height: 265px; position: relative;  z-index: 99;background: linear-gradient(to right, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 33%,rgba(255,255,255,0.8) 67%,rgba(255,255,255,0) 100%); text-align: left; padding: 50px 33% 20px 30px; font-size: 16px;  font-weight: 600;}
	.HPPtext h3{margin-top: 0; padding-top: 0;  font-weight: bold;font-size: 24px}
	.HPPtext a.ctaR{position: absolute; bottom: 30px; left: 30px;}

	@media only screen and (max-width: 1270px) {
		section.hp_promos{width: calc(100% - 30px);}
	}

	@media only screen and (max-width:1199px) {
		.HPPtext{ padding: 30px 33% 20px 30px; font-size: 16px;  font-weight: 600;}
	}


	@media only screen and (max-width:991px) {
		section.hp_promos, div.hp_promos{max-width: 351px; margin: 50px auto;}
		.HPPbox{margin-bottom: 30px; height: auto; }
		.HPPtext{height: auto;padding: 30px 33% 20px 30px;}
		.HPPtext a.ctaR{position: static;}

	}

	
/** HOME- RATES ***************************************/

	section.rc-container{background-color: var(--main); width: 100%;  max-width: var(--maxW); margin: 70px  auto; position: relative;  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.3);border-radius: 15px;height: 400px; padding: 30px;}

	section.rc-container h2{color: white; padding-bottom: 0; font-family: bebas-neue, sans-serif;font-size: 40px; line-height: 1}
	section.rc-container a.ctaR{position: relative; top: -10px}


	.rates-carousel{ width: 100%;position: relative; height: 250px; margin: -10px 0 0 0 ; }
	.slick-slider{padding: 0;  margin: 0 auto; width: 100% !important; position: absolute;   border: solid 0px green}
	.slick-track{position:relative;top:0;left:0;display:block;margin-left:auto;margin-right:auto; display: flex; justify-content: center;   align-items: center; }

	.slick-slide{display:none;min-height:1px;  padding: 15px;height: 100% !important;}
	.slick-slide a{display: block; background-color: white; border-radius: 15px; padding: 30px 10px 20px 10px; height: 100%; text-decoration: none; transition: all .25s}

	.slick-slide a:hover, .slick-slide a:focus{box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.5);-moz-transform: translateY(-5px);-webkit-transform: translateY(-5px);-o-transform: translateY(-5px);-ms-transform: translateY(-5px);transform: translateY(-5px);}


	.Rtext{font-size: 18px; line-height: 1.33; font-weight: bold; color: var(--font)}
	.Rapr{font-size: 12px;line-height: 1.42;}
	.Rnumber{ font-size: 63px; color: #d31245;font-family: bebas-neue, sans-serif;line-height: 1.3;}

	.ctalike{color: var(--main);border: 2px solid var(--main);	display: inline-block;	text-decoration: none;		cursor: pointer;line-height: 1;text-align: center;border-radius: 20px;	font-weight: 700; padding: 12px 19px; }

	.ctalike:hover {text-decoration: none;background-image: linear-gradient(to bottom, var(--main), var(--dkteal));	color: #fff;	border: 2px solid transparent;	border-top: 2px solid var(--main);	border-bottom: 2px solid var(--dkteal); }



	/* arrows nav */
	.slick-arrow.slick-hidden{display:none}
	.slick-prev, .slick-next{z-index: 99; position: absolute; top: -76px; display: block;  width: 44px; height: 44px; cursor: pointer; background: transparent; opacity: .7; font-size: 30px; color: white;left: calc(50% + 140px); }
	.slick-prev{left: auto; right:calc(50% + 140px);}
	.slick-next{}
	.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus{opacity: 1; font-size: 30px;}

	/*L*/
	@media only screen and (max-width: 1270px) {

		section.rc-container{max-width: calc(100% - 60px); }
	}

	/*M*/
	@media only screen and (max-width: 992px) {
	}

	/*S*/
	@media only screen and  (max-width: 768px) {
	}

	/*XS*/
	@media only screen and  (max-width: 576px) {
	}

/** INSIDE HERO *******************************/

	section.hero{position: relative; padding: 0; height: 400px; margin-top: 0px;  }

	.hero_image{height: 400px; width: 100%; position: absolute; top: 0; right: 0; z-index: 1}
	.hero_image img{object-fit: cover; object-position: center;width: 100%; height: 100%}


	.hero_caption {width: 100%; height: 100%;  display: flex; justify-content: center; align-items: center;color: white; position: relative; /*position: relative; z-index: 10; bottom: 0; right: 0; top: auto; left: auto; */ padding: 50px 30px; z-index: 99; background: rgba(0,0,0,.46);}
	.hero_caption h1{margin-top: 0; font-size: 72px; color: white;}

	.hero_caption_text{width: 100%; max-width: var(--maxW);text-align: left;text-shadow: 0 0 10px #000000; font-size: 20px;}

	.hero_overlay{}



	/*S*/
	@media only screen and  (min-width: 576px) {

	}
	
	/*M*/
	@media only screen and  (min-width: 768px) {
	}

	/*L*/
	@media only screen and (min-width: 992px) {

	}
	
	/*XL*/
	@media only screen and (min-width: 1200px) {
		section.hero, .hero_image{ height: 666px;  }
	}

	/*XL*/
	@media only screen and (min-width: 1640px) {
	}

	.iconbutton a .Itxt {font-size: 16px}

/** PHOTO BG SECTION *****/

		.photobanner{border: solid 0px blue;position: relative; width: 100%;   padding: 50px 30px}
		.PBimage{width: 100%; height: 100%; position: absolute; top: 0; right: 0; z-index: 9;}
		.PBimage img{object-fit: cover; object-position: center;width: 100%;  height: 100%;}

		.PBtext{border: solid 0px red; position: relative;  z-index: 99; color: white; display: flex;  align-items: center; width: 100%; min-height: 300px;  font-size: 20px; line-height: 1.5 }
		.PBtext h2{color: white;font-size:32px; font-weight: 500}
		.PBtext{}
		.PBtextinner{ border: solid 0px lime; text-align: left;}


		a.ctaW {display:inline-block ;text-decoration:none ;border:2px solid white; cursor:pointer; line-height:1; background: transparent; text-align:center; color:white; padding:12px 19px; border-radius:20px; font-weight:700}

		a.ctaW:hover, a.ctaW:focus{text-decoration:none; background-image:linear-gradient(to bottom,#007c85,#0b2729); color:#fff; border:2px solid #fff}

		@media only screen and  (min-width: 992px) {
			.photobanner{padding: 50px 50% 50px 30px}
			.photobanner.R{padding: 50px 30px 50px calc(50% + 30px)}
			.PBtext h2{font-size: 42px;}

		}
		@media only screen and  (min-width: 1200px) {
			.photobanner{padding: 50px calc(50% + 30px) 50px 30px }
			.photobanner.R{padding: 50px 30px 50px calc(50% + 30px)}
			.PBtext{ min-height: 566px;}
			.PBtext h2{font-size: 72px;}
		}
		@media only screen and  (min-width: 1400px) {
			.PBimage img{object-fit: none; max-height: 666px;}
		}
		@media only screen and  (min-width: 1520px) {
			.photobanner{padding: 50px calc(50% + 30px) 50px calc(50% - 720px) }
			.photobanner.R{padding: 50px calc(50% - 720px) 50px calc(50% + 30px)}
		}
