/*
We highly recommend you use SASS and write your custom styles in sass/_custom.scss.
However, this blank file is available if you prefer
*/


/*    Navigation container and title image/logo    */ 
.nav-top {position:fixed; width:100%; top:90px; z-index:9999999999998 !important; opacity:.92; }
.logo-wrap {position: relative; margin-right: 2.12766%; margin-left: 0;}
.title {position:absolute; width:242px; height:242px; top:-70px; left:0; right:0; margin: auto; text-align:center; transition: all 0.4s ease; }
.nav-top a {z-index:99999999999 !important; display:block;}
.nav-bar {background-color: rgba(255,255,255, 1); width:100%; max-width:1300px !important; height: 82px; text-transform:uppercase; text-align:center; z-index:999 !important; box-shadow: 0 0 20px 2px rgba(125,125,125, .5); }
.nav-bar li {display:inline-block; padding: 30px 5px; margin-right: 10px; font-family: "museo-sans";  font-size:18px; width: 150px; text-align: center;}
.nav-bar li a {color:#333;}
.top, .right {margin-bottom: 0px;}

/*    Dropdown Menu for Things To Do (hover handled by Jquery in inc/footer.php) */
.things {position: relative;}
.things-nav {position:absolute; margin:auto; width:210px; left:-25px; top: 82px; right: 0; padding:0 20px 10px 20px; display: none;}
.things-nav li {width:auto; padding:16px 10px; background-color:#32445b; text-align: center; width: 100%;}
.things-nav li a {color:white; margin-left:5px;}

.about {position: relative;}
.about-nav {position:absolute; margin:auto; width:210px; left:-30px; top: 82px; right: 0; padding:0 20px 10px 20px; display: none;}
.about-nav li {width:auto; padding:16px 10px; background-color:#32445b; text-align: center; width: 100%;}
.about-nav li a {color:white; margin-left:5px;}



/*    Base element styles    */ 
a {color:#83bcbd;}
a:hover {color:#32445b;}
h1 {font-family: "adelle"; text-transform:uppercase; text-align:center; font-size:40px; margin-top:25px;}
h1::after {border-top: 3px solid #9b8662; width: 70px; margin-left: auto; margin-right: auto; margin-top: 10px; margin-bottom: 20px; display: block; content: '';}
h3 { font-family: "museo-sans-condensed"; text-transform:uppercase; padding-bottom:28px; margin-top:28px;}
h4 {font-family: "museo-sans-condensed"; text-transform:uppercase; font-size:22px; }
p {font-family: "adelle"; font-weight:300; line-height:32px; margin:30px 5px;}
ul {font-family: "adelle"; font-weight:300; line-height:22px;}
span {font-family: "adelle";}
ol {font-family: "adelle";}
.intro {font-family: "museo-sans-condensed"; text-align:center; font-size:26px; margin-bottom:30px; padding-bottom:25px; line-height:40px; }
.border-bottom {border-bottom:3px solid #f2f2f2; padding-bottom:35px; margin-bottom:35px;}


/*    Wider rows    */ 
.wide {max-width:1300px !important; }
.medium {max-width:1100px !important; }


/*   Sticky styles for navigation bar when you scroll down   */ 
.title.sticky {transition: all 0.6s ease; width:222px; height:222px; padding-top:10px; padding-left:10px;}



/*    Slider content container styles for homepage   */ 
.slider-wrap {position:relative;}
.overlay{display:flex; display: -webkit-flex; position:absolute; top: -15%; bottom: 0; left: 0; right: 0;}
.welcome {margin:auto; position:relative;}
.welcome h2 {text-transform:uppercase; color:white; font-size:50px; margin-bottom:30px; font-family: "museo-sans-condensed"; text-align:center;}
.welcome img {display:block; margin:auto; padding-top:70px;}


/*    Owl Carousel slider styles  */ 
.owl-controls {position:relative;  z-index:999999 !important; margin-top:-550px;}
.owl-controls i {font-size:90px;}
.owl-page {display:inline-block;}
.owl-theme .owl-controls {position:absolute;  top:55%; margin-bottom:160px; text-align: center; opacity: 1; width:100%;}
.owl-pagination {margin:auto;}
.owl-theme .owl-controls .owl-page span {background-image: url('assets/img/white-diamond.png'); background-repeat:no-repeat; background-color: rgba(0,0,0,0.01); background-opacity:0; border-radius:0px; display: block; margin:auto; width: 40px; height:40px; margin: 15px 27px; text-align: center;}
.owl-theme .owl-controls .owl-page.active span {opacity: 1;}
.owl-prev {position:absolute; left:0;  top:0;  }
.owl-next {position:absolute; right:0; top:0; }
.owl-theme .owl-controls .owl-buttons div {background-color:transparent; opacity: 1;}


/*    Call-to-action hover buttons   */ 
.button {background-color: rgba(40,56,73,0.7); width:50%; padding:18px 10px; text-align:center; margin:auto; font-size:23px; font-family: "adelle"; transition: all 0.8s ease;}
.button a {color:white; text-transform:uppercase;}
.button:hover {background-color:rgba(255,255,255, .8); transition: all 0.8s ease;}
.button:hover a {color:#2f383f; transition: all 0.8s ease;}
.button a:hover {color:#2f383f; transition: all 0.8s ease;}


/*   Graphic light blue buttons    */ 

.buttons {position:absolute; bottom:15%; width:100%; display:block;  font-family: "adelle";}
.lt-blue-btn img {float:left;}
.lt-blue-btn {background-color:#83bcbd; box-shadow: 0 0 10px 3px rgba(65,65,65, .6);}
.lt-blue-btn p {color:white; text-transform:uppercase; padding-top:19px;  text-align:center; font-size:20px; font-family: "adelle"; margin:10px 5px;}


/*    Dark blue home intro text   */ 
.home-intro {position:relative; margin-top:-35px; display:block; background-color:#32445b; color:white; z-index:-1; padding-bottom:80px;}
.home-intro img {text-align:center; display:flex; display: -webkit-flex; margin:auto; padding-top:30px;}
.home-intro h3 {color:white; text-align:center; padding-top:80px; text-transform:uppercase; font-family: "museo-sans-condensed"; line-height:45px;}
.home-intro h3 span {font-family: "adelle"; margin-top:20px;}
.home-intro h3::after {border-top: 4px solid #9b8662; width: 80px; margin-left: auto; margin-right: auto; margin-top: 10px; margin-bottom: 18px; display: block; content: '';}
.home-intro p {text-align:center; font-family: "museo-sans-condensed"; font-size:20px;}


/*    White navigation above the footer    */ 
.bottom-nav {background-color:white; margin:auto; text-align:center;  margin-bottom:-3px;}
.bottom-nav li {display:inline-block; margin-right:40px; padding:40px 15px; text-transform:uppercase; font-family: "museo-sans-condensed"; font-size:18px;  font-size:22px;}
.bottom-nav li a {color:#333;}


/*    Footer   */ 
.footer {background-image: url("assets/img/footer.jpg"); background-repeat:no-repeat; position:relative; height:450px; background-position: center; color:white;}
.footer h3 {color:white; text-transform:uppercase; font-size:20px; font-family: "museo-sans"; padding:45px 0px;}
.footer .left img {float:left; padding:10px 10px; clear:both;}
.footer .right {text-align:right;}
.footer .right img {float:right; padding:10px 10px;}
.footer .row {padding-top:120px;}
.footer p { line-height:50px; font-size:16px; margin: 0px 5px 13px 0px;}
.footer img {display:block;  padding-top:80px;}
.footer .row {background-image: url("assets/img/logo.png"); background-repeat:no-repeat; background-position:center bottom;}


/*    Sticky bottom footer   */ 
.bottom-footer {background-color:#a1c4b3; bottom:0; height:90px; display:block; margin:auto; width:100%;}
.bottom-footer h2 {font-size:25px; color:#d9ede2; text-transform:uppercase; text-align:center; padding-top:35px; font-family: "museo-sans";}
.bottom-footer form {padding-top:30px; font-family: "museo-sans";}
.bottom-footer input[type="submit"] {font-family: "museo-sans"; width: 100%;  padding: 5px 15px; color: #d9ede2; border:solid 2px #d9ede2; background-color:#a1c4b3; text-transform: uppercase;    font-size: 1.3em !important; transition: all 0.9s ease;}
.bottom-footer input[type="submit"]:hover { width: 100%;  padding: 5px 15px; color: #a1c4b3; background-color: #d9ede2; text-transform: uppercase;    font-size: 1.5em; transition: all 0.9s ease;}
.bottom-footer input[type="text"] { font-family: "museo-sans"; width:100%; height:39px; border:none; background-color: #d9ede2;}
.bottom-footer input[placeholder] {font-family: "museo-sans"; font-size:18px; text-transform:uppercase;}


/*    Main page container   */ 
.secondary {background-color:#f2f2f2;}
.page-content {background-color:white; position:relative; top:10; width:100%; padding:30px; margin-bottom:30px; box-shadow: 0 0 35px 2px rgba(145,145,145, .2);}
.the-content {margin-top:40px; padding:20px;}

/*    Special secondary page header 2   */ 
.page-content h2::before {display: block; content: url('assets/img/diamond-2.png'); position:absolute; margin-left:-55px;}
.page-content h2 {text-align:center; font-family: "museo-sans-condensed"; color:white; background-color:#32445B; width:44%; display:block; margin:auto; text-transform:uppercase; font-size:28px; margin-top:40px; margin-bottom:60px;}
.page-content h2::after {display: block; content: url('assets/img/diamond-2.png'); position:absolute; margin-right:-250px; right:50%; margin-top:-32px;}


/*    Footer fact at the bottom of the content sections  */ 
.footer-fact {background-color:#83bcbd; padding:17px 20px 7px 15px; margin-bottom:40px;}
.footer-fact p {text-transform:uppercase; color:white; font-family: "adelle"; text-align:center;  border-right:solid 3px white; border-left:solid 3px white; font-size:20px; margin:20px 5px;}


/*    Table with rows alternating colors */ 
.member-options {width:55%; border:solid 7px #f2f2f2; display:block; margin:auto;}
.member-options li {padding:7px 10px;}
.member-options span {float:right;}
.member-options li:nth-child(even) {background:#f2f2f2;}
.member-options li:nth-child(odd){background:white;}​


/*   Toggle Boxes - being used on Contact page for FAQ */ 
/*   Before clicked */ 
.toggle {background-color:#83bcbd; padding: 20px; padding-left: 50px; position: relative; margin-bottom: 12px;}
.toggle::before {content: '+'; font-family: "entypo"; color: white; font-size: 28px; position: absolute; top: 10px; left: 20px;}
.toggle-title p {text-transform:uppercase; width:100%;  clear:both; font-family: "museo-sans-condensed"; font-size:19px; color: #fff; margin-bottom: 0; margin-top:5px;}
.toggle .toggle-content {display: none;}
.toggle-content p {margin:5px 5px;}

/*  After clicked */ 
.graybg {background-color:#f2f2f2 !important;}
.graybg .toggle-title p {color:#83bcbd; padding-bottom: 10px;}
.graybg .toggle-content {display: block; padding:0px 10px 5px 0px;}
.graybg.toggle::before {content: '-'; font-family: "entypo"; color: #83bcbd; font-size: 32px; position: absolute; top: 18px; left: 20px;}
.toggle {background-color:#83bcbd; padding: 10px; padding-left: 50px; position: relative; margin-bottom: 12px;}


/*  Things To Do list */
.thing-to-do {display:flex;}
.thing-to-do h3 {padding-top:17px; font-family: "adelle"; font-size:19px; margin-bottom:0px; padding-bottom:0px;}
.thing-to-do p {margin:8px 0px 0px 0px;}


/*  Style of main things to do - the trails */
.trail h3 {font-size:35px;}
.trail-desc {border-left:solid 15px #32445b; padding-left:55px; margin-left:20px;}


/*  New Page styles, Round 2 of options */
.round-2 { background-color: rgba(47,56,63,0.9);  padding:3px 5px; text-align:center; margin:auto; font-size:23px; font-family: "adelle"; transition: all 0.8s ease; display:block; position:relative; margin-bottom:90px; margin-top:-300px; width:20%;}
.round-2 h1 {color:white; text-transform:uppercase; margin-top:15px;}
.round-2 h1::after {border-top: 3px solid #9b8662; width: 70px; margin-left: auto; margin-right: auto; margin-top: 10px; margin-bottom: 20px; display: block; content: ''; }
.the-page {padding-top:400px; position: relative; z-index: 1;}


/*  New Page styles, Round 3 of options */
.round-3 {background-color: rgba(40,56,73,0.9);  padding:3px 5px; text-align:center; margin:auto; font-size:23px; font-family: "adelle"; transition: all 0.8s ease; display:block; position:relative; width:100%;}
.round-3 h1 {color:white; text-transform:uppercase; margin-top:19px;}
.round-3 h1::after {border-top: 3px solid #9b8662; width: 70px; margin-left: auto; margin-right: auto; margin-top: 10px; margin-bottom: 20px; display: block; content: ''; }


/*  Blurred page background image */
.blurred {position: absolute; top: 0; right: 0; left:0; z-index: 0; background-repeat:no-repeat; -webkit-filter: blur(2px); -moz-filter: blur(2px); -o-filter: blur(2px); -ms-filter: blur(2px); filter: blur(2px);}
.show {display:block;}
.middle {border:solid 15px #f2f2f2;}


/*  Become a member button - eventually it was moved to the top right hand side of the screen */
.member-bottom {position:fixed; top:0; right:0; background-color: rgba(40,56,73,0.9); padding:10px 15px; margin:0px 20px; box-shadow: 0 0 20px 2px rgba(25,25,25, .3); z-index:999999999; transition: .2s linear all;}
.member-bottom a {color:white; padding:20px; text-transform:uppercase; font-family: "adelle"; font-size:15px;}
.member-bottom:hover {background-color:#83bcbd; transition: .2s linear all;}


/*  Membership pricing options table */
.membership li {margin-left:20px; padding-left:20px;}
.membership p {margin-bottom:0px !important; padding-bottom:0px;}
.greybg {background-color:#f2f2f2;}
.membership-table {border:6px solid #f2f2f2;}
.membership-table .row {padding:10px;}


.gallery-button {text-align:left !important;}
.gallery-button a {border:solid 2px #d9ede2;; text-align:center; color:#d9ede2; padding:5px 15px; font-size:20px; transition: .2s linear all; text-align:left;}
.gallery-button:hover a {background-color:#d9ede2; color:#a1c4b3; transition: .2s linear all;}




/*  Mobile menu styles */

.mobile-nav-trigger {
	display: block;
	position: fixed;
	right: 20px;
	top: 30px;
	color: #fff;
	font-size: 24px;
	z-index: 9999;
}

.mobile-nav-trigger:hover {
	color: #fff;
}

.mobile-nav-wrapper {
	position: fixed;
	right: 0;
	top: 0;
	background: rgba(0,0,0, .8);
	width: 100%;
	max-width: 500px;
	height: 8000px;
	display: none;
	z-index: 9998;
}

.mobile-nav-wrapper ul {
	padding: 80px 20px;
	width: 100%;
}

.mobile-nav-wrapper ul li {
	list-style: none;
	list-style-type: none;
}

.mobile-nav-wrapper a {
	color: #fff;
	font-size: 21px;
	display: block;
	width: 100%;
	padding: 20px;
	transition: .2s linear all;
}

.mobile-nav-wrapper a:hover {
	color: #85afaf;
	background: #fff;
}

.nav-close {
	display: none;
	color: #fff;
}

.navigation-mobile {
	display: none;
	background: rgba(40,56,73,0.97);
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	height: 100px;
	text-align: center;
	z-index: 99999;
	padding-top: 5px;
}



.navigation-mobile img {position:absolute; width:20%; margin-top:-300px;}
.navigation-mobile h2 {color:white; font-size:30px;  font-family: "adelle"; margin-top:20px; text-transform:uppercase;}


.mobile-only {display:none;}



@media only screen and (max-width:1250px) {
	.nav-bar li {width:130px; padding: 30px 0px; margin-right: 0px; font-size:18px;}
	.nav-bar img {width:70%;}
	.logo-wrap img {padding-top:20px; margin-left:-40px; }
	.buttons {bottom:5%;}
	.overlay {top: -5%;}
	.owl-theme .owl-controls { top:65%;}
	


}




@media only screen and (max-width:1024px) {
	.nav-bar li {width:120px; padding: 30px 0px; margin-right: 0px; font-size:17px;}
	.logo-wrap img {padding-top:20px; margin-left:-60px; }
	.buttons {display:none;}
	.overlay {top: 9%;}
	.owl-theme .owl-controls {top:69%;}

	.navigation-full {display:none;}
	.navigation-mobile {display: block;}

	.bottom-footer h2 {text-align:center;}
	.member-bottom {display:none;}

}

@media only screen and (max-width:980px) {

	.bottom-nav {text-align:center;}
	.bottom-nav li {margin-right:20px; padding:20px 5px; display:block; text-align:center;}
	.mobile-only {display:block;}
	.footer p { line-height:30px;}
	.footer  h3 {margin-bottom:30px;}
	.footer {padding-bottom:40px;}




}


@media only screen and (max-width:800px) {
	.left {border-bottom:1px solid #f2f2f2; padding-bottom:20px; margin-bottom:30px;}
	.footer p {text-align:center;}
	.footer a {color:white;}
	.footer {height:auto; }
	.footer h3 {text-align:center; padding:5px 0px;}
	.footer .row {background-image: none;}
	.owl-controls {display:none;}
	.owl-pagination {display:none;}
	.owl-buttons {display:none;}
	.welcome h2 {font-size:45px;}



	}

@media only screen and (max-width:760px) {
	.bottom-footer {height:auto; text-align:center;}
	.navigation-mobile h2 {font-size:22px;}
	.page-content h2::after { margin-right:-200px;}
	.round-3 {margin-top:-100px;}
	.thing-to-do .two {text-align: center;}
	.thing-to-do img {width:50%; }
	.thing-to-do {display:block;}
	.welcome {padding-top:30px;}
	.page-content h2 {width:70%;}
	.toggle-content p {padding:10px 20px;}
	.toggle-title {padding:20px 10px; margin-left:40px;}
	.toggle::before {margin-right:20px; padding-top:10px;}





}	

@media only screen and (max-width:560px) {
	.page-content h2::after { margin-right:-140px;}
	.round-3 {margin-top:-200px;}
	.welcome h2 {padding-top:60px; font-size:40px;}
	.button {display:none;}
	.page-content h2::after {display:none;}
	.page-content h2::before {display:none;}

	}






