/* General Settings */

html {
    line-height: 1em;   }

body {
	background-color:#5695A3;
	font-family: "Arial", Helvetica, sans-serif;
    margin: 0;
    color: #000; 
}


/*-- HEADER  --*/

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

.Ht1 { grid-area: Ht1; }
.Ht2 { grid-area: Ht2; }
.Ht3 { grid-area: Ht3; }
.Ht4 { grid-area: Ht4; }

.HeaderContainer { display: grid; grid-gap: 1px;  
	grid-template-columns: 32% 38% 28%;
    grid-template-areas: "Ht1 Ht2 Ht3"	
				"Ht1 Ht4 Ht3" ; }

.hbx1 { margin: 0; padding: 0 ;  }
.hbx2 { margin: 0; padding: 10px 0 0 0; text-align:center; }
.hbx3 { text-align:left; }
.hbx4 { margin: 0; padding: 0 ; text-align:center; }

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

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

/*-- HEADER NAVIGATION --*/


.nv { display: inline-block; position: relative; text-align:left;
	 font-size:14px; line-height:1.5em; float:right;}

.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; }

p {color:white; font-size:14px; line-height: 1.4em;}
p1 {color:white; font-size:14px; line-height: 1.0em;}
p2 {color:black; font-size:18px; line-height: 1.5em;}
h1 {font-size:20px; color:white; text-align: center; line-height: 1.0em;}
h2 {color:black; font-size:20px;}
h3 {color:white; font-size:16px;}




/*-- Hiking Man Title --*/

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

.Tt1 { grid-area: Tt1; }
.Tt2 { grid-area: Tt2; }
.Tt3 { grid-area: Tt3; }

.THMContainer { display: grid; grid-gap: 1px; 
	grid-template-columns: 34% 23% 23% 16%;
    grid-template-areas: "Tt1 Tt3 Tt3 Tt2" 
	"Tt1 Tt3 Tt3 Tt2"; }

.hbx1 { margin: 0; }
.hbx2 { margin: 0; }
.hbx3 { margin: 0;  text-align: center; padding: 20px 0 0 0; }




#Thm { position: relative; padding: 0; width: 98%; height:auto; 
	display: inline-block; }
#htw { position: relative; padding: 0 0 0 10px;
			width: 98%; height:auto; display: block; }

 /*-- Content  --*/

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

.Dsc { grid-area: Dsc; }
.St1 { grid-area: St1; }
.St2 { grid-area: St2; }
.St3 { grid-area: St3; }
.St4 { grid-area: St4; }
.Thm { grid-area: Thm; }

.DiscoverContainer { display: grid; grid-gap: 1px; 
	grid-template-columns: 16% 16% 16% 16% 16% 16%;
    grid-template-areas: "Dsc Dsc Dsc Dsc Thm Thm" 
	"St1 St2 St3 St4 Thm Thm"; }

.dbx1 { margin: 0; text-align: left; padding: 0 0 0 10px}
.dbx2 { margin: 0; }
.dbx3 { margin: 0; }
.dbx4 { margin: 0; }
.dbx5 { margin: 0; }
.dbx6 { margin: 0; }

.row-20 {width:99vw; display: block; margin: 5px 0 0 5px; 
	padding: 0; position: relative; text-align: center; }

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

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

.Lst1 { grid-area: Lst1; }
.Lst2 { grid-area: Lst2; }
.Lst3 { grid-area: Lst3; }

.ListContainer { display: grid; grid-gap: 1px; 
	grid-template-columns: 23% 23% 25% 25%;
    grid-template-areas: "Lst1 Lst1 Lst3 Lst3"
		"Lst2 Lst2 Lst4 Lst4" 	; }

.cbx1 { margin: 0; padding: 2px 0 0 10px; text-align:left;}
.cbx2 { margin: 0; padding: 2px 0 0 10px ; text-align:left;}
.cbx3 { padding:0; margin: 2px 0 0 10px;  text-align:left;}
.cbx4 { padding:0; margin: 2px 0 0 10px;  text-align:left;}

.snv a { display:inline-block;  text-decoration: none; text-align:left;
	 color: #FFF500; line-height: 1.5em; font-size:14px;}

.snv a:hover { display:inline-block; outline: none; color: #9AFFFA ; 
	text-align:left; padding: 0; 
	border-bottom: 2px solid #9AFFFA; }

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

.Gst1 { grid-area: Gst1; }
.Gst2 { grid-area: Gst2; }
.Gst3 { grid-area: Gst3; }

.GlobeContainer { display: grid; grid-gap: 1px; 
	grid-template-columns: 23% 23% 25% 25%;
    grid-template-areas: "Gst1 Gst1 Gst3 Gst3"
		"Gst2 Gst2 Gst4 Gst4" 	; }

.gbx1 { margin: 0; padding: 2px 0 0 10px; text-align:left;}
.gbx2 { margin: 0; padding: 2px 0 0 10px ; text-align:left;}
.gbx3 { padding:0; margin: 2px 0 0 10px;  text-align:left;}
.gbx4 { padding:0; margin: 2px 0 0 10px;  text-align:left;}



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

            /*--  Header update  --*/ 
	
	

	
	
.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; }

p {color:white; font-size:16px; line-height: 1.4em;}
p1 {color:white; font-size:18px; line-height: 1.0em;}
p2 {color:black; font-size:16px; }
h1 {font-size:22px; color:white; text-align: center; line-height: 1.3em;}
h2 {color:black; font-size:22px;}

	.ListContainer { display: grid; grid-gap: 1px; 
	grid-template-columns: 23% 23% 25% 25%;
    grid-template-areas: "Lst1 Lst2 Lst3 Lst4"
		"Lst1 Lst2 Lst3 Lst4" 	; }
		.GlobeContainer { display: grid; grid-gap: 1px; 
	grid-template-columns: 23% 23% 25% 25%;
    grid-template-areas: "Gst1 Gst2 Gst3 Gst4"
		"Gst1 Gst2 Gst3 Gst4" 	; }
}

/* Vertical Tablet View */
@media (min-width: 750px){

.HeaderContainer { display: grid; grid-gap: 1px;  
	grid-template-columns: 32% 32% 32%;
    grid-template-areas: "Ht1 Ht2 Ht3"	
				"Ht1 Ht4 Ht4" ; }
	
.nv ul li { color: #fff; display: inline-block; position: relative; 
	padding: 0 0 0 8px; font-size:16px;}

p1 {color:white; font-size:22px; line-height: 1.3em;}
h1 {color:white; font-size:34px;}
	
#Thm { position: relative; padding: 0;
			width: 80%; height:auto; display: block; }	
	
}



/* Horizontal Tablet View */
@media (min-width: 830px){

	
	            /*--  Header update  --*/ 
	



p1 {color:white; font-size:22px; line-height: 1.3em;}
p2 {color:black; font-size:16px; }
h1 {font-size:30px; color:white; text-align: center;}
h2 {color:black; font-size:20px;}	

#Thm { position: relative; padding: 0;
			width: 75%; height:auto; display: block; }	

}


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

	
	
.nv ul { width: 240px; }		

#Thm { position: relative; padding: 0;
			width: 92%; height:auto; display: block; }


}