/* General Settings */

html {
    line-height: 1em;   }

body {
	background-color:#E1DB84;
	font-family: "Arial", Helvetica, sans-serif;
    font-size: 16px;
    margin: 0;
    color: #000; 
}
h1 { font-size: 24px; color:white;}
h2 {color:yellow; font-size:20px; text-align:center; line-height: 1.3em;}
p { color:black; font-size:22px; text-align:left;}
p1 { color:white; font-size:14px; text-align:left; }
p2 { color:black; font-size:22px; text-align:left;}
p3 { font-size:20px; text-height:1.5em;}

img { opacity: 1; /* initial opacity */
transition: opacity 0.5s ease; /* transition effect */ }
img:hover { opacity: .5; /* final opacity */ }

           /*-- HEADER  --*/


.row-1 { width:99vw; display: block; position: relative; 
	text-align: center; }
.row-2 { width:99%; display:inline-block; margin: 5px 0 0 5px; 
	padding: 2px 0 10px 2px; position: relative; text-align: center;
	background: #3F4313 ; max-width:1100px;}

header { position: relative; display: block; margin: 5px 0 0 5px; 
	  text-align: center;}

.Logo { grid-area: Logo; }
.Social { grid-area: Social; }
.TBG { grid-area: TBG; }
.Nav { grid-area: Nav; }

.HeaderContainer { display: grid; grid-gap: 2px;  
	grid-template-columns: 24% 24% 45%;
    grid-template-areas: "Logo Social Nav"
	"TBG TBG Nav"; }

.hbx1 { margin: 0; padding: 0 ;  }
.hbx2 { margin: 0; padding: 0 0 0 15px; }
.hbx3 { color: #fff; padding: 0; margin: 0;
  font-size: 20px; text-align:center;}
.hbx4 { color: #fff; padding: 0 ; margin: 0 0 0 0;
  font-size: 12px; line-height:1.6em; text-align:left; }

#Logo { position: relative; padding: 0; width: 90%; height:auto; 
	display: inline-block; }

#Social { position: relative; padding: 0;
			width: 90%; height:auto; display: inline-block; }

/*-- HEADER NAVIGATION --*/

.nv {float:right;}
.nv ul {display: block !important; margin: 0; width:180px;
	padding: 0; position: relative; }

.nv ul li { color: #fff; display: inline-block; position: relative; 
	padding: 0 0 0 8px; }

.nv a { display: inline-block; 
	 text-decoration: none;
	letter-spacing: .1em; color: #fff; }

.nv a:hover { display: inline-block;
	outline: none; color: #BB44E1 ; font-weight: bold;
	 padding: 0; border-bottom: 2px solid #BB44E1; }



	/*-- Adventure Introduction  --*/

.row-10 {width:99vw; display: block; margin: 5px 0 0 5px; position: relative; 
	text-align: center; }
.row-11 {width:99%; display: inline-block; padding: 0 0 10px 0; 
	position: relative; background-color:black; max-width:1100px;}

.bnv  { text-height:2em;}
.bnv a { display:inline-block;  text-decoration: none;
	 color: #57FFF7; border-bottom: 2px solid #57FFF7;}

.bnv a:hover { display: inline-block; outline: none; color: #AB27F8 ; 
	font-weight: bold; padding: 0; border-bottom: 2px solid #AB27F8; }

.St1 { grid-area: St1; }
.St2 { grid-area: St2; }
.St3 { grid-area: St3; }

.ActivityContainer { display: grid; grid-gap: 1px; 
	grid-template-columns: 48% 48% ;
    grid-template-areas: "St1 St2" 
			"St3 St3 "	; }

.dbx1 { margin: 0; padding: 0 ; text-align:center; }
.dbx2 { margin: 0; padding: 20px 0 0 0 ; text-align:center; }
.dbx3 { margin: 0; padding: 10px 10px 0 10px ; text-align:left;}

#Pic { position: relative; padding: 0; float:right;
			width: 45%; height:auto; display: block; }



 	/*-- Adventure Links  --*/

.row-20 {width:99vw; display:block; position: relative; text-align: center; }

.row-21 {width:99%; display: inline-block; padding: 0 0 5px 0; 
	margin:5px 0 0 5px;	background-color:#402347; position: relative; 
	max-width:1100px; text-align: center;}

.Anv {display:inline-block; position: relative; font-size: 16px;}
.Anv a { text-decoration: none;	color: #fff; }
.Anv a:hover { outline: none; color: #E1DB84;font-weight: bold; padding: 0;
	border-bottom: 2px solid #E1DB84; }


.Oa01 { grid-area: Oa01; }
.Oa02 { grid-area: Oa02; }
.Oa03 { grid-area: Oa03; }
.Oa04 { grid-area: Oa04; }
.Oa05 { grid-area: Oa05; }
.Oa06 { grid-area: Oa06; }
.Oa07 { grid-area: Oa07; }
.Oa08 { grid-area: Oa08; }
.Oa09 { grid-area: Oa09; }
.Oa10 { grid-area: Oa10; }
.Oa11 { grid-area: Oa11; }
.Oa12 { grid-area: Oa12; }
.Oa13 { grid-area: Oa13; }
.Oa14 { grid-area: Oa14; }
.Oa15 { grid-area: Oa15; }
.Oa16 { grid-area: Oa16; }
.Oa17 { grid-area: Oa17; }
.Oa18 { grid-area: Oa18; }
.Oa19 { grid-area: Oa19; }
.Oa20 { grid-area: Oa20; }


.LinkContainer { display: grid; grid-gap: 1px; position: relative;
	grid-template-columns: 16% 17% 16% 16% 17% 16% ;
    grid-template-areas: 
	"Oa01 Oa01 Oa01 Oa02 Oa02 Oa02"
	"Oa03 Oa03 Oa03 Oa04 Oa04 Oa04" 
	"Oa05 Oa05 Oa05 Oa06 Oa06 Oa06"
	"Oa07 Oa07 Oa07 Oa08 Oa08 Oa08"
	"Oa09 Oa09 Oa09 Oa10 Oa10 Oa10"
	"Oa11 Oa11 Oa11 Oa12 Oa12 Oa12"
	"Oa13 Oa13 Oa13 Oa14 Oa14 Oa14" 
	"Oa15 Oa15 Oa15 Oa16 Oa16 Oa16"
	"Oa17 Oa17 Oa17 Oa18 Oa18 Oa18"
	"Oa19 Oa19 Oa19 Oa20 Oa20 Oa20"; }

.abx01 { margin: 0; padding: 10px 0 0 0 ; }
.abx02 { margin: 0; padding: 10px 0 0 0 ; }
.abx03 { margin: 0; padding: 10px 0 0 0 ; }
.abx04 { margin: 0; padding: 10px 0 0 0 ; }
.abx05 { margin: 0; padding: 10px 0 0 0 ; }
.abx06 { margin: 0; padding: 10px 0 0 0 ; }
.abx07 { margin: 0; padding: 10px 0 0 0 ; }
.abx08 { margin: 0; padding: 10px 0 0 0 ; }
.abx09 { margin: 0; padding: 10px 0 0 0 ; }
.abx10 { margin: 0; padding: 10px 0 0 0 ; }
.abx11 { margin: 0; padding: 10px 0 0 0 ; }
.abx12 { margin: 0; padding: 10px 0 0 0 ; }
.abx13 { margin: 0; padding: 10px 0 0 0 ; }
.abx14 { margin: 0; padding: 10px 0 0 0 ; }
.abx15 { margin: 0; padding: 10px 0 0 0 ; }
.abx16 { margin: 0; padding: 10px 0 0 0 ; }
.abx17 { margin: 0; padding: 10px 0 0 0 ; }
.abx18 { margin: 0; padding: 10px 0 0 0 ; }
.abx19 { margin: 0; padding: 10px 0 0 0 ; }
.abx20 { margin: 0; padding: 10px 0 0 0 ; }


#Pc01 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }
#Pc02 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }
#Pc03 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }
#Pc04 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }
#Pc05 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }
#Pc06 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }
#Pc07 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }
#Pc08 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }
#Pc09 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }
#Pc10 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }
#Pc11 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }
#Pc12 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }
#Pc13 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }
#Pc14 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }
#Pc15 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }
#Pc16 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }
#Pc17 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }
#Pc18 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }
#Pc19 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }
#Pc20 { position: relative; padding: 10px 0 0 5px;
			width: 90%; height:auto;	display: inline-block; }




.row-22 {width:99vw; display:block; position: relative; text-align:center;}

.row-23 {width:95%; display: inline-block; padding: 5px 0 0 10px; 
	position: relative; line-height:1.6em; text-align:left; 
	background:#F5AEDA; max-width:1100px; margin:5px 0 0 5px; }



		/* Horizontal Cell View */
@media (min-width: 600px){

            /*--  Header update  --*/ 
	
.nv ul { width: 240px; }	
#Logo {  padding: 10px 0 0 5px;	width: 130px; height:auto; }

#Social { padding: 6px 0 0 10px; width: 130px; height:auto;	}
	
	
.hbx3 { padding: 5px 0 0 0; margin: 0 0 0 10px;
  font-size: 26px;}	
.hbx4 { padding: 8px 0 0 20px; font-size: 14px; }	
.nv ul li {  padding: 0 0 0 10px; }	
	

	
.LinkContainer { display: grid; grid-gap: 5px; position: relative;
	grid-template-columns: 16% 17% 16% 16% 17% 16% ;
    grid-template-areas: 
	"Oa01 Oa01 Oa02 Oa02 Oa03 Oa03"
	"Oa04 Oa04 Oa05 Oa05 Oa06 Oa06" 
	"Oa07 Oa07 Oa08 Oa08 Oa09 Oa09"
	"Oa10 Oa10 Oa11 Oa11 Oa12 Oa12"
	"Oa13 Oa13 Oa14 Oa14 Oa15 Oa15" 
	"Oa16 Oa16 Oa17 Oa17 Oa18 Oa18"
	"Oa19 Oa19 Oa21 Oa21 Oa20 Oa20"; }	
	
}	
	
	
/* Vertical Tablet View */
@media (min-width: 700px){


#Social {  width: 150px; height:auto;	}
	
.hbx4 { font-size: 16px; }	
.nv ul li {  padding: 0 0 0 12px; }
	
.Anv {display:inline-block; position: relative; font-size: 18px;}	
	

	
.LinkContainer { display: grid; grid-gap: 5px; position: relative;
	grid-template-columns: 12% 12% 24% 24% 12% 12% ;
    grid-template-areas: 
	"Oa01 Oa01 Oa02 Oa03 Oa04 Oa04"
	"Oa05 Oa05 Oa06 Oa07 Oa08 Oa08"
	"Oa09 Oa09 Oa10 Oa11 Oa12 Oa12"
	"Oa13 Oa13 Oa14 Oa15 Oa16 Oa16" 
	"Oa17 Oa17 Oa18 Oa19 Oa20 Oa20"	; }		
	




}

/*  Horizontal Tablet View */

@media (min-width: 830px){
	
h1 { font-size: 32px;}	
	
/*--  Header update  --*/ 
	
.nv ul { width: 240px; }	
	
#Logo { position: relative; padding: 0;
			width: 20vw; height:auto; max-width:180px;  }

#Social { position: relative; padding: 0;
			width: 20vw; height:auto;  max-width:200px;; }
	
.HeaderContainer { display: grid; grid-gap: 2px;  
	grid-template-columns: 24% 30% 40%;
    grid-template-areas: "Logo Social Nav"
	"Logo TBG Nav"; }	
	
	
.hbx3 { padding: 10px 0 0 0; margin: 0 0 0 10px;
  font-size: 28px;}	
.hbx4 { padding: 8px 0 0 20px; font-size: 16px; }	
.nv ul li {  padding: 0 0 0 10px; font-weight: bold;}	
	
	            /*--  Intro update  --*/
.IntroContainer { display: grid; grid-gap: 5px; color: black; width:400px;
	grid-template-columns: 80vw 18vw;
    grid-template-areas: "Mtn Ptnrs " 
	"Vid Prdct"	;  }
	
p1 { font-size:16px; }	
	
.LinkContainer { display: grid; grid-gap: 5px; position: relative;
	grid-template-columns: 19% 19% 10% 10% 19% 19% ;
    grid-template-areas: 
	"Oa01 Oa02 Oa03 Oa03 Oa04 Oa05"
	"Oa06 Oa07 Oa08 Oa08 Oa09 Oa10"
	"Oa11 Oa12 Oa13 Oa13 Oa14 Oa15"
	"Oa16 Oa17 Oa18 Oa18 Oa19 Oa20"	; }		
	


.row-23 {width:85vw; }


}


/*  Desktop View  --*/
@media (min-width: 1240px){
	
	            /*--  Header update  --*/ 
	
	

.nv ul { width: 240px; }
	

.LinkContainer { display: grid; grid-gap: 3px; position: relative;
	grid-template-columns: 16% 16% 16% 16% 16% 16% ;
    grid-template-areas: 
	"Oa01 Oa02 Oa03 Oa04 Oa05 Oa06"
	"Oa07 Oa08 Oa09 Oa10 Oa11 Oa12" 
	"Oa13 Oa14 Oa15 Oa16 Oa17 Oa18"
	"Oa19 Oa21 Oa21 Oa21 Oa21 Oa20"  ; }		
	
	
.Anv {font-size:20px;}
	

	
}