/*-------------
 	General
-------------*/
/*COLOURS---------------------------------*/
/*
red: #b40835 
yellow: #faa93d 
blue: #004179
blue_light: #a0cfeb - 204,229,238
grey_dark: #404040 - 64,64,64
grey_light: #d2d2d2 - 210,210,210
grey_medium: #707070 - 112,112,112
#17286d
#17286d
#0072ce
*/

*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html{
	font-family: 'Hanuman', serif;
	color: #fff;
}
body{font-size:16px;line-height:24px;}
#map{
	background:url("/assets/img/intro-background.jpg");
	background-size: cover;
}
.mobile_only{display:none;color: #000;}
.desktop_only{display:block;}
h1{	
	font-weight:700;
	color:#b40835;
	width:100%;
	letter-spacing:0em;
}
h2{
	font-size: 4.5em;
	line-height: 1.1em; 
	font-weight:700;
	color:#faa93d;
	letter-spacing:-0.01em;
	text-shadow: 1px 1px 5px #000;
}
.half-screen-left h2{
	font-size: 3em;
}
h3{
	font-size: 3em;
	line-height: 2.3em; 
	font-weight:700;
	color:#faa93d;
	letter-spacing:-0.01em;
	text-transform:uppercase;
	text-shadow: 1px 1px 3px #004179;
}
h4{
	font-size: 2.5em;
	line-height: 1em;
	font-weight:700;
	color:#fff;
	letter-spacing:-0.01em;
	text-shadow: 1px 1px 3px #333;
}
h4 a {
	border:3px solid #fff;
	border-radius:.5em;
	padding:.25em .5em;
}
h4 a:hover {
	border:3px solid #faa93d;

}

a{
	text-decoration: none;
	color: inherit;
	cursor: pointer;
	margin-bottom:0;
	outline: none;
}

a:hover{
	background-color: #faa93d;
}

a.btn{
	font-size:2em;
	line-height:2em;
	color: #fff;
	border-radius: .75em;
	background-color: #b40835;
	font-weight: 700;
	text-align: center;
	padding:0 1em .5em 1em;
	border:5px solid #b40835;
	align-items: center;
    justify-content: center;
}
a.btn:hover{
	background-color: #faa93d;
}
a.circle-btn{
	border-radius: 50%;
	background-color: #6a858e;
	padding:1em;
	opacity:1;
}
a.circle-btn:hover{
	opacity:.5;
}
.btn, .circle-btn{position:absolute;}
.bg-image{
	position:relative;

}
.full-width{
	width:100%;
	height:auto;
}

.icon{
	position:relative;
	top:.5em;
	width:2em;
	height:2em;
	display:inline-block;	
	background-size: cover;
}
.icon2{
	position:relative;
	/*top:.55em;*/
	width:4em;
	height:4em;
	display:inline-block;	
	background-size: cover;
}
.i-footprints,.i-fish,.i-chair,.i-dive,.i-swim,.i-home,.i-ncn,.i-arrow,.i-teepee{background-repeat: no-repeat;}
.i-footprints{background:url("/assets/img/icon_feet.svg");}
.i-fish{background:url("/assets/img/icon_fish.svg");}
.i-chair{background:url("/assets/img/icon_chair.svg");}
.i-dive{background:url("/assets/img/icon_diver.svg");}
.i-swim{background:url("/assets/img/icon_swimmer.svg");}
.i-home{background:url("/assets/img/icon_home.svg");}
.i-ncn{background:url("/assets/img/icon_FCWC.svg");}
.i-arrow{background:url("/assets/img/icon_arrow.svg");}
.i-teepee{background:url("/assets/img/icon_cabin.svg");}

.home{				top:19%;	left:3%;}
.ncn{				top:10%;	left:3%;}
.arrow{				top:10%;	left:3%;}

.main-title{
	position:absolute;
	top:10%;
	left:12%;
	width:25%;
}
.page-title{
	position:absolute;
	top:10%;
	left:12%;
}
.footprints-box{
	position:absolute;
	top:32%;
	left:19%;
	width: 12%;
	height:12%;
	border-radius:2em;
	background-color:rgba(250,168,61,.5);
	background-blend-mode: multiply;
	display:none;
	border:5px solid white;
}
.footprints{
	position:absolute;
	top:25%;
	left:15%;
}
.canoe-box{
	position:absolute;
	top:51%;
	left:24%;
	width: 12%;
	height:12%;
	border-radius:2em;
	background-color:rgba(250,168,61,.5);
	background-blend-mode: multiply;
	display:none;
	border:5px solid white;
}
.canoe{
	position:absolute;
	top:67%;
	left:23.6%;
}
.footprints a:hover,
.canoe a:hover{
	background-color:transparent;
}
a.felix{
	position:absolute;
	bottom:8%;
	left:3%;
	width:20%;
	opacity:1;
}
a.felix:hover{
	opacity:.7;
	background-color:transparent;
}
.rcpoint{position:absolute;
	top:60%;
	left:50%;
	transform:translateX(-50%);
	width:80%;
	text-align:center;}
.rcpoint a:hover, .icon3d a:hover, .iconvr a:hover{background-color:transparent;}

.icon3d{
	position:absolute;
	top:13%;
	left:50%;
	transform:translateX(-50%);
	width:25%;
	text-align:center;
}
.iconvr{
	position:absolute;
	top:46%;
	right:10%;
	transform:translateX(-50%);
	width:25%;
	text-align:center;
}
.vr-note{
	color:#fff;
	font-size:16px;
	position:absolute;
	text-align:right;
	bottom:10%;
	right:3%;
}
.icon-360{
	width:110px;
	height:93px;
}
.box,.box2{
    position:absolute;
	top:0;
	right:0;
    overflow: hidden;
	display:none;
}
/* Add padding and border to inner content
for better animation effect */
.box-inner-video{
	position:relative;
    width: 100vw;
	height:100vh;
    padding: 2% 10%;
    background:url("/assets/img/blue-80.png");
	background-blend-mode: multiply;
}
.box-inner{
	position:relative;
    width: 100vw;
	height:100vh;
    padding: 8% 10%;
    background:url("/assets/img/blue-80.png");
	background-blend-mode: multiply;
}

.video-responsive{
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}
.video-responsive iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}
.close{
	position:absolute;
	top:3%;
	left:3%;
	font-weight:900;
	font-size:2em;
	line-height:2em;
}
a.close:hover{background-color:transparent;
color:#faa93d;}

.float_left{
	float:left;
	padding-right:20px;
}
.float_right{
	float:right;
	padding-left:20px;
}
.clear{clear:both;}
.pad_bottom{padding-bottom:20px;}
.pad_top{padding-top:20px;}
.pad_b_0{padding-bottom:0px;}
.pad_b_5{padding-bottom:5px;}
.pad_b_10{padding-bottom:10px;}
.pad_b_20{padding-bottom:20px;}
.pad_b_30{padding-bottom:30px;}
.pad_b_40{padding-bottom:40px;}
.pad_b_50{padding-bottom:50px;}
.pad_b_60{padding-bottom:60px;}
.pad_b_80{padding-bottom:80px;}
.pad_t_5{padding-top:5px;}
.pad_t_10{padding-top:10px;}
.pad_t_20{padding-top:20px;}
.pad_t_30{padding-top:30px;}
.pad_t_40{padding-top:40px;}
.pad_t_50{padding-top:50px;}
.pad_t_60{padding-top:60px;}
.pad_t_80{padding-top:80px;}
.margin_b_0{margin-bottom:0;}
.margin_b_5{margin-bottom:5px;}
.margin_b_10{margin-bottom:10px;}
.margin_b_20{margin-bottom:20px;}
.margin_b_30{margin-bottom:30px;}
.margin_b_40{margin-bottom:40px;}
.margin_b_50{margin-bottom:50px;}
.margin_b_60{margin-bottom:60px;}
.margin_b_80{margin-bottom:80px;}
.margin_t_5{margin-top:5px;}
.margin_t_10{margin-top:10px;}
.margin_t_20{margin-top:20px;}
.margin_t_30{margin-top:30px;}
.margin_t_40{margin-top:40px;}
.margin_t_50{margin-top:50px;}
.margin_t_60{margin-top:60px;}
.margin_t_80{margin-top:80px;}
.no_pad{padding:0;margin:0;}
.photo_holder{
	width:100%;
	text-align:center;
	position:relative;
}
.inline{
	height:auto;
	position:relative;	
	margin: 0 auto;
	display:table;
	text-align:center;
}
.ten{ width:10%; }
.fifteen{ width:15%; }
.twenty{ width:20%; }
.twentyfive{ width:25%; }
.thirty{ width:30%; }
.thirtyfive{ width:35%; }
.fourty{ width:40%; }
.fifty{ width:50%; }
.sixty{ width:60%; }
.seventy{ width:70%; }
.eighty{ width:80%; }
.ninety{ width:90%; }
.center{text-align:center;margin:0 auto;}
.half-screen-left{
	float:left;
	width:48%;
	margin-right:2%;
	position:relative;
	font-size: 1.6em;
	line-height: 1.5em;
}
.half-screen-right{
	float:right;
	width:48%;
	margin-left:2%;
	position:relative;
	font-size: 21px;
	line-height: 31px;
}
.view360 {
		text-align:center;
	  font-size: 24px;
	font-weight:600;
	  line-height: 28px;
		text-shadow: 1px 1px 2px #000;
	}

@media (max-width: 3840px){
	h1{font-size: 108px; line-height: 110px;}
	.footprints-canoe{	top:13%;	left:67%;}
	.three-point-lake{	top:38%;	left:59%;}
	.rc-point{			top:27%;	left:67%;}
	.poplar-point{		top:47%;	left:15%;}
	.chair{				top:63%;	left:32%;}
	.wuskwatim{			top:82%;	left:49%;}
}

@media (max-width: 3200px){
	h1{font-size: 90px; line-height: 92px;}
	.wuskwatim{			top:81.75%;	left:46%;}
}
@media (max-width: 2560px){
	h1{font-size: 74px; line-height: 76px;}

	.footprints-canoe{	top:12%;	left:67.5%;}
	.rc-point{			top:27%;	left:67%;}
	.wuskwatim{			top:80%;	left:46%;}
}

@media (max-width: 2391px){
	h1{font-size: 70px; line-height: 72px;}
	h2{font-size: 4em; line-height: 1.2em;}
	.half-screen-left h2{font-size: 2.5em; line-height: 1.2em;}
	.home{top:23%;}
	
}
@media (max-width: 1920px){
	.icon-360{
		width:100px;
		height:84px;
	}
}
@media (max-width: 1842px){
	h1{font-size: 60px; line-height: 62px;}
	h2{font-size: 3.5em;line-height: 1.1em; }	
	.half-screen-left{font-size: 1.3em;line-height: 1.5em;}
	h4{font-size: 2em;line-height: 1em;}
	.footprints{top:25%;left:13%;}
	.canoe{top:67%;left:22%;}

	a.btn{
		font-size:1.5em;
		line-height:1.5em;
		border-radius: .6em;
	}
	.three-point-lake{	top:39%;	left:59%;}
	.footprints-canoe{	top:14%;	left:67.5%;}
	.rc-point{			top:27%;	left:67%;}
	.poplar-point{		top:47%;	left:12%;}
	.chair{				top:63%;	left:29%;}
	.wuskwatim{			top:81.75%;	left:46%;}
}
@media (max-width: 1600px){
	h2{font-size: 3em;line-height: 1.3em; }
	.half-screen-left h2{font-size: 2em; line-height: 1.3em;}
	.icon3d{
		top:13%;
	}
	.icon-360{
		width:90px;
		height:76px;
	}
	
}
@media (max-width: 1450px){
	h1{font-size: 48px; line-height: 50px;}
	h3{font-size: 2.8em;line-height: 2.3em; }

	.half-screen-left{width:58%;font-size: 1.3em;line-height: 1.5em;}
	.fifty{ width:40%; }
	.close {
	  top: 2%;
	  left: 2%;
	  font-size: 1.5em;
	  line-height: 1.5em;
	}
	.box-inner {padding: 5% 10%;}
	a.btn{
		font-size:1.25em;
		line-height:1.25em;
		border-radius: .5em;
	}
	a.circle-btn {padding: .7em;}	
	
	.footprints-canoe{	top:12%;	left:67.5%;}
	.rc-point{			top:26%;	left:67%;}
	.poplar-point{		top:47%;	left:12%;}
	.chair{				top:63%;	left:29%;}
	.wuskwatim{			top:80%;	left:40%;}
	.icon3d{
		top:12%;
	}
	.icon-360{
		width:80px;
		height:67px;
	}
}
@media (max-width: 1350px){
	h2{font-size: 2.3em;line-height: 1.5em; }
	.half-screen-left{font-size: 1.1em;line-height: 1.5em;}
	.close {font-size: 1.3em;line-height: 1.3em;}
	.box-inner {padding: 4% 10%;}
	a.btn{
		font-size:1.25em;
		line-height:1.25em;
		border-radius: .5em;
	}
	.icon-360{
		width:70px;
		height:59px;
	}
	.icon3d{
		top:10%;
	}
	.view360 {
		text-align:center;
	  font-size: 14px;
	  line-height: 20px;
		text-shadow: 1px 1px 2px #000;
	}
}
@media (max-width: 1200px){
	h1{font-size: 40px; line-height: 42px;}
	h4{font-size: 1.1em;line-height: 2.5em;}
	.footprints{top:24%;left:15%;}
	.canoe{top:64.5%;left:23.5%;}

	a.circle-btn{
		padding:.6em;
	}
	.footprints-canoe{	top:12%;	left:67.5%;}
	.rc-point{			top:26%;	left:67%;}
	.poplar-point{		top:45%;	left:12%;}
	.chair{				top:63%;	left:29%;}
	.wuskwatim{			top:78%;	left:36%;}
	.icon2{
		width:3em;
		height:3em;
	}
	.footprints-box,.canoe-box{
		border-radius:1em;
		border:3px solid white;
	}
	
	.icon3d{
		top:8%;
	}
	.icon-360{
		width:60px;
		height:51px;
	}
}

@media (max-width: 1050px){
	h1{font-size: 38px; line-height: 40px;}
	h3{font-size: 2em;line-height: 1.8em; }
	
	h2{font-size: 2em;line-height: 1.6em; }
	.half-screen-left{width:68%;font-size: 1em;line-height: 1.4em;}
	.fifty{ width:30%; }
	.close {top: 1.5%;left: 1.5%;font-size: 1.2em;line-height: 1.2em;}
	.box-inner {padding: 3.5% 10%;}

	a.btn{
		font-size:1.1em;
		line-height:1.1em;
		border-radius: .5em;
		border:3px solid #b40835;
	}
	a.circle-btn{
		padding:.5em;
	}
	.footprints-canoe{	top:12%;	left:67.5%;}
	.rc-point{			top:26%;	left:67%;}
	.poplar-point{		top:45%;	left:8%;}
	.chair{				top:63%;	left:29%;}
	.wuskwatim{			top:78%;	left:34%;}
	.main-title{		top:10%;	left:8%;}
	.icon2{
		width:2em;
		height:2em;
	}
	.footprints{top:23%;left:15%;}
	.canoe{top:64.5%;left:23%;}
	.icon-360{
		width:50px;
		height:42px;
	}
	.view360 {
	  font-size: 13px;
	  line-height: 20px;
		text-shadow: 1px 1px 2px #000;
	}
	.iconvr{
		top:40%;
		right:6%;
	}
	.vr-note{
		font-size:11px;
		bottom:5%;
		right:2%;
	}
		
}
@media (max-width: 900px){
	h1{font-size: 32px; line-height: 34px;}
	h2{font-size: 1.7em;line-height: 1.8em; }
	.half-screen-left{width:68%;font-size: .9em;line-height: 1.3em;}
	a.btn{
		font-size:1em;
		line-height:1em;
		border-radius: .4em;
	}
	a.circle-btn{
		padding:.3em;
	}
	.footprints-canoe{	top:12%;	left:67.5%;}
	.rc-point{			top:26%;	left:67%;}
	.poplar-point{		top:45%;	left:8%;}
	.chair{				top:63%;	left:29%;}
	.wuskwatim{			top:78%;	left:34%;}
	.main-title{		top:10%;	left:8%;}
	.home{				top:25%;	left:1.5%;}
	.ncn{				top:10%;	left:1.5%;}

}
@media (max-width: 768px){
	h2{font-size: 1.5em;line-height: 1.8em; }
	.half-screen-left{font-size: .8em;line-height: 1.3em;}
	.close {top: 1.2%;left: 1.2%;font-size: 1.1em;line-height: 1.1em;}
	.footprints-canoe{	top:8%;	left:64%;}
	.rc-point{			top:21%;	left:67%;}
	.three-point-lake{	top:35%;	left:53%;}
	.icon-360{
		width:42px;
		height:35px;
	}
	.view360 {
		text-align:center;
	  font-size: 12px;
	  line-height: 18px;
	}
	.icon3d{
		top:9%;
	}
	.vr-note{

		font-size:10px;
		bottom:2%;
		right:2%;
	}
}
@media (max-width: 640px){
	h1{font-size: 14px; line-height: 16px;}
	h3{font-size: 1.5em;line-height: 1.8em; }
	h4{font-size: 1em;line-height: 2.5em;}
	.close {top: 1%;left: 1%;font-size: 1em;line-height: 1em;}
	a.btn{
		font-size:.6em;
		line-height:.6em;
		border-radius: .4em;
		padding:0 1em 1em 1em;
		border:1px solid #b40835;
	}
	a.circle-btn{
		padding: .2em .3em 0em;
	}
	.footprints-canoe{	top:9%;	left:64%;}
	.rc-point{			top:22%;	left:67%;}
	.poplar-point{		top:42%;	left:6%;}
	.chair{				top:56%;	left:29%;}
	.wuskwatim{			top:70%;	left:34%;}
	.main-title{		top:10%;	left:12%;}
	.three-point-lake{	top:35%;	left:54%;}
	a.felix {			bottom: 12%;left: 3%;}
	.ncn{				top:10%;	left:1.5%;}
	.home{				top:30%;	left:1.5%;}
	.footprints{top:21%;left:12%;}
	.canoe{top:64.5%;left:21%;}

	.float_right,
	.float_left,
	.half-screen-left{
		float:none;
		padding-left:0px;
		display:block;
	}	
	.inline{display:block;}
	.ten,
	.fifteen,
	.twenty,
	.twentyfive,
	.thirty,
	.thirtyfive,
	.fourty,
	.fifty,
	.sixty,
	.seventy,
	.eighty,
	.ninety{ width:100%; }
	.half-screen-left{margin-right:0;width:100%;margin-bottom:20px;}
	.mobile_only{display:block;}
	.desktop_only{display:none;}
	.icon3d{
		width:80%;
	}
	.view360 {
	  font-size: 10px;
	  line-height: 14px;
	}
	.icon-360{
		width:36px;
		height:30px;
	}
	.vr-note{
		font-size:9px;
		bottom:1.5%;
		right:1.5%;
	}
}

@media (max-width: 480px){
	h3{font-size: 1.5em;line-height: 1.8em; }
	h4{font-size: .9em;line-height: 2.5em;}
}

/*-------------
 	Footer
-------------*/

footer{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	color: #fff;
	background-color: #414a4f;
	padding: 60px 0;
}

footer ul{
	display: flex;
	margin-bottom: 25px;
	font-size: 32px;
}

footer ul li{
	margin: 0 8px;	
}

footer ul li:first-child{
	margin-left: 0;	
}

footer ul li:last-child{
	margin-right: 0;	
}

footer p{
	text-transform: uppercase;
	font-size: 14px;
	color: rgba(255,255,255,0.6);
	margin-bottom: 10px;
}

footer p a{
	color: #fff;
}

@media (max-width: 700px){

	footer{
		padding: 80px 15px;
	}

}