html, body {
	background-color: #fff;
	color: #111111;
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	width: 100vw;
	height: 100vh;
	margin: 0;
}

.extrabold {
	font-family: 'Open Sans', sans-serif;
	font-weight: 800;
}
.bold {
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
}
.regular {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
}
.light {
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
}

.siteorange {
	color:#e87407;
}
.sitesecondary {
	color:#f5b333;
}
.sitebtn_primary {
	color: #fff;
    background-color: #e87407;
    border-color: #e87407;
}
.sitebtn_secondary {
	color: #fff;
    background-color: #f5b333;
    border-color: #f5b333;
}
.buttonbar{
	position:relative;
	width:100%;
	display:flex;
}
.sitebtn_primary:hover {
	color: #fff;
    background-color: #e87407;
    border-color: #e87407;
}
.sitebtn_secondary:hover {
	color: #fff;
    background-color: #f5b333;
    border-color: #f5b333;
}

.sitebtn_primary:focus, .sitebtn_primary.focus {
    box-shadow: 0 0 0 0.2rem #f5b333;
}

.sitebtn_primary.disabled, .sitebtn_primary:disabled {
    color: #ccc;
    background-color: #94d60a;
    border-color: #94d60a;
}

.sitebtn_primary:not(:disabled):not(.disabled):active, .sitebtn_primary:not(:disabled):not(.disabled).active, .show > .sitebtn_primary.dropdown-toggle {
    color: #fff;
    background-color: #f5b333;
    border-color: #f5b333;
}

.sitebtn_kioskdd {
	color: #000;
    background-color: #fff !important;
    border: none !important;
	width: 140px !important;
	line-height: 1.1rem;
	font-size: 1.1rem;
}
.sitebtnWidth {
	width: 180px !important;
}
.sitebtntxt {
	line-height: 1.15rem;
	font-size: 1.15rem;
}

.sitebtn_kioskdd:hover {
	color: #000;
    background-color: #fff !important;
    border: none !important;
		width: 140px !important;
}

.sitebtn_kioskdd:focus, .sitebtn_kioskdd.focus {
    box-shadow: 0 0 0 0.2rem #f5b333;
		width: 140px !important;
}

.sitebtn_kioskdd.disabled, .sitebtn_kioskdd:disabled {
    color: #777;
    background-color: #fff !important;
    border: none !important;
		width: 140px !important;
}

.sitebtn_kioskdd:not(:disabled):not(.disabled):active, .sitebtn_kioskdd:not(:disabled):not(.disabled).active, .show > .sitebtn_kioskdd.dropdown-toggle {
    color: #fff;
    background-color: #e87407 !important;
    border: none !important;
		width: 140px !important;
}
--
.orange {
	color:#ffa200;
}
.yellow {
	color:#fdd20b;
}
.blue {
	color:#1d3cf5;
}
.green {
	color:#3ed815;
}
.red {
	color:#eb0e0e;
}
.black {
	color:#000000;
}

.full-height {
	height: 100vh;
}

/* Override Laravel/Bootstrap Basics */

.flex-center {
	align-items: center;
	display: flex;
	justify-content: center;
}

.position-ref {
	position: relative;
}

/*CORNER TRIANGLES OVERLAY*/

@media screen and (orientation:landscape) {
	/* Top Left Triangle and back button */
	.TLLogo_triangle{
		position: absolute;
		top:0;
		left:0;
		width:14vw;	
	    z-index:2;		
	}
	/* bottom right triangle - More trails search front screen */
	.BR_triangle{
		position: absolute;
		bottom:0;
		right:0;
		width:18vw;
			z-index:2;
	}
	.TLLogo_triangle img{
		width:9vw;
		padding-top:1.2vw;
		padding-left:1.2vw;
	}
	.BR_triangle img{
		width:15.4vw;
		padding-bottom:1.8vw;
		padding-left:1.9vw;
	}
}
@media screen and (orientation:portrait) {
	/* Top Left Triangle and back button */
	.TLLogo_triangle{
		position: absolute;
		top:0;
		left:0;
		width:14vh;
		z-index:2;
	}
	/* bottom right triangle - More trails search front screen */
	.BR_triangle{
		position: absolute;
		bottom:0;
		right:0;
		width:18vh;
			z-index:2;
	}
	.TLLogo_triangle img{
		width:9vh;
		padding-top:1.2vh;
		padding-left:1.2vh;
	}
	.BR_triangle img{
		width:15.4vh;
		padding-bottom:1.8vh;
		padding-left:1.9vh;
	}
}




/* HEADER BAR - NOT ON FRONT PAGE*/
@media screen and (orientation:landscape) {
	.HeaderBar {
		position: absolute;
		width: 100vw;
		height:16vh;
		top:0;
		left:0;
		right:0;
		background-color:#fff;
		-webkit-filter: drop-shadow(-1vh 1vh 0.5vh rgba(0,0,0,0.2));
		filter: drop-shadow(-1vh 1vh 0.5vh rgba(0,0,0,0.2));
	}
		
	.HeaderBarSearchPlacement {
		position: absolute;
		display: inline-block;
		left:14vw;
		top:3vh;
		width:65vw;
		height:10vh;
		white-space: nowrap;
		vertical-align: middle;		
		font-family: 'Open Sans', sans-serif;
		font-weight: 400;
		color: #fff;
	}	
}
@media screen and (orientation:portrait) {
	.HeaderBar {
		position: absolute;
		width: 100vw;
		height:22vh;
		top:0;
		left:0;
		right:0;
		background-color:#fff;
		-webkit-filter: drop-shadow(-1vh 1vh 0.5vh rgba(0,0,0,0.2));
		filter: drop-shadow(-1vh 1vh 0.5vh rgba(0,0,0,0.2));
	}
	.HeaderBarSearchPlacement {
		position: absolute;
		display: inline-block;
		left:6vh;
		top:12vh;
		width:89vw;
		height:8vh;
		white-space: nowrap;
		vertical-align: middle;		
		font-family: 'Open Sans', sans-serif;
		font-weight: 400;
		color: #fff;
	}
}

.HeaderBarSearchBarContainer {
	width:100%;
	height:100%;
	position:relative;
	vertical-align: middle;
	display: inline-block;
	border-radius: 50vh;
	background-color:#e87407;
}

/* HEADER BAR PLANE */
.HeaderBarNoSearch {
	position: absolute;
	width: 100vw;
	height:14vh;
	top:0;
	left:0;
	right:0;
	background-color:#fff;
	-webkit-filter: drop-shadow(-1vh 1vh 0.5vh rgba(0,0,0,0.2));
	filter: drop-shadow(-1vh 1vh 0.5vh rgba(0,0,0,0.2));
}
	
.HeaderBarOffset {
	position: absolute;
	display: inline-block;
	left:14vw;
	top:2vh;
	width:86vw;
	height:10vh;
	white-space: nowrap;
	vertical-align: middle;		
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	color: #fff;
}


/* VIEW YOUR TRAIL BUTTON */
.YourTrail {
	position: absolute;
	display: block;
	background-color: Transparent;
	top:2vh;
	right:1vh;
	width:20vw;
	height:12vh;
}
.YourTrailVCenter {
	top:auto;
	bottom:auto;
	height:14vh;
}
.YourTrailArrow {
	position: absolute;
	display: block;
	top:0;
	left:0;
	width:22%;
	height:100%;
	background:transparent;
	background: url(/img/rightarroworange.png);
	background-repeat: no-repeat;
	background-position: right;
	background-size:contain;
}
.YourTrailDetails {
	margin: auto 0 auto 0; /* Important */ 
	position: absolute;
	display: block;
	top:0;
	left:22%;
	width:78%;
	height:100%;
}
.VCenter {
	position: relative;
	margin: auto 0 auto 0; /* Important */ 
	width:100%;
	height:100%;
}
.YourTrailTitle {	
	left:0;
	width:100%;
	height:40%;
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	line-height: 2.5vh;
	font-size: 2.5vh;
	word-break: normal;
	white-space: nowrap;
	overflow: visible;
	color:#e87407;
	overflow: visible;
	display: flex;
}
.YourTrailTitle p{
	display: flex-end;
	height: 2.5vh;
	margin: auto 0 0 0;
}
@media screen and (orientation:portrait) {
	.YourTrailTitle {
		line-height: 2.5vw;
		font-size: 2.5vw;
	}
	.YourTrailTitle p{
		height: 2.5vw;
	}
}
.YourTrailItems {
	left:0;
	width:100%;
	height:2.4vmin;
	font-family: 'Open Sans', sans-serif;
	font-weight: 500;
	line-height: 2.3vmin;
	font-size: 2.3vmin;
	color:#e87407;
	word-break: normal;
	white-space: nowrap;
	overflow: visible;
	display: flex;
}
.YourTrailTime {
	left:0;
	width:100%;
	height:25%;
	font-family: 'Open Sans', sans-serif;
	font-weight: 500;
	line-height: 1.5vmin;
	font-size: 1.5vmin;
	color:#777;
	word-break: normal;
	white-space: nowrap;
	overflow: visible;
	display: flex;
}
.YourTrailTime p{
	height: 2.8vmin;
	margin: 0.3vmin 0 auto 0;
}
@media screen and (orientation:portrait) {
	.YourTrail {
		top:0.5vh;
		right:0.5vw;
		width:33vw;
		height:11vh;
	}
	.YourTrailVCenter {
		top:auto;
		bottom:auto;
		height:14vh;
	}
}




/* SEARCH BAR*/
		
@media screen and (orientation:landscape) {
	.SearchContainer {
		position: absolute;
		display: inline-block;
		right:10vh;
		top:5vh;
		width:80vw;
		height:20vh;
		white-space: nowrap;
		vertical-align: middle;
		
		font-family: 'Open Sans', sans-serif;
		font-weight: 400;
		color: #fff;

	}
	.SearchLabel {
		width:20vh;
		height:100%;
		vertical-align: middle;
		position:relative;
		display: inline-block;
		color: #000;
	}
	.SearchLabel img{
		position: absolute;
		top: 0;
		bottom: 0;
		margin: auto;
		width:100%;
	}
	.SearchBarContainer {
		width:78%;
		height:50%;
		position:relative;
		vertical-align: middle;
		display: inline-block;
		border-radius: 50vh;
		background-color:#e87407;
	}

}
@media screen and (orientation:portrait) {
	.SearchContainer {
		position: absolute;
		display: block;
		left:20vw;
		top:5vh;
		width:80vw;
		height:20vh;
		white-space: nowrap;							
		font-family: 'Open Sans', sans-serif;
		font-weight: 400;
		color: #fff;
	}
	.SearchLabel {	
		width:25vw;	
		height:50%;					
		display: block;
		position:relative;
		color: #000;
	}
	.SearchLabel img{
		bottom:1vh;
		position: absolute;
		width:100%;
	}
	.SearchBarContainer {
		width:78vw;
		height:30%;
		display: table;
		position:relative;
		border-radius: 50vh;
		background-color:#e87407;
	}
}


/*search bar elements*/
.SearchBarTable {
	position:absolute;
	top:0;
	left:0;
	display:table;
	width:100%;
	height:100%;
	vertical-align:middle;
	margin:0;
}


.SearchBar{
	width:60%;
	height:100%;
	vertical-align: middle;
	display: table-cell;
	border-radius: 50vh;
	background-color:#fff;
	border-style: solid;
	border: 4px solid #e87407;
	white-space: nowrap;
}
.SearchBar input {
	flex: 1 1 auto;
	margin: 0 4% 0 4%;
	padding: 0;
	border: none;
	box-shadow: none;
	height: 100%;
	width:94%;
	background: transparent;
	
	font-size:2.5vh;
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	color: #333;
}
.SearchBar input:focus {
		outline: none;
}
.SearchBarSubmit{	
	vertical-align: middle;
	display: table-cell;
	height: 100%;
	width:10%;
	margin: 0;
	color: #fff;
	background-color: Transparent;
	background-repeat:no-repeat;
	border: none;

	
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	line-height: 3vh;
	font-size: 3vh;
	z-index: 1000;
}
.SearchBarSubmit:focus{	
	outline: none;
	width:10%;
}

.SearchBarFilter{	
	vertical-align: middle;
	display: table-cell;
	height: 100%;
	width:30%;
	padding-left:2%;
	padding-right:2%;
	font-family: 'Open Sans', sans-serif;
	font-weight: 500;
	line-height: 1.8vw;
	font-size: 1.8vw;
}
.SearchBarFilter select{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;       
	background-image: url('/img/down.png');   
	background-position: center right;
	background-size: 1.4vw;
	background-repeat: no-repeat;
	color: #fff;
	background-color: Transparent;
	background-repeat:no-repeat;
	border: none;
	outline: none;
	width:100%;
	scroll-behavior: smooth;
	cursor:pointer;
	line-height: 1.8vw;
	font-size: 1.8vw;
}
.SearchBarFilter select::-ms-expand {
	display: none;
}
.SearchBarFilter option {
	background-color: #e87407 !important; /* for IE */
	color:fff;
	font-size: 2vh;
	outline: none;
	border: none;
}
.SearchBarFilter hover, .SearchBarFilter focus .SearchBarFilter active {
	background: linear-gradient(#f5b333, #f5b333);
	background-color: #f5b333 !important; /* for IE */
	
	font-size: 2vh;
	outline: none;
	border: none;
}
.SearchBarFilter select option:checked {
	background: linear-gradient(#f5b333, #f5b333);
	background-color: #f5b333 !important; /* for IE */
	color: #fff;
	font-weight: 500;
}

/* loc bar filter */
.LocationBarHolder {
		display: table-cell;
	flex: 1 1 auto;
	margin: 0;
	padding: 0 20px 0 20px;
	border: none;
	box-shadow: none;
	height: 100%;
	width:94%;
	background: transparent;
}
.LocationBarFilter{	
	vertical-align: middle;
	display: table-cell;
	height: 100%;
	width:auto;
	padding-left:2%;
	padding-right:2%;
	font-family: 'Open Sans', sans-serif;
	font-weight: 500;
	line-height: 1.6vw;
	font-size: 1.6vw;
	border: none;
	outline: none;
}
.LocationBarFilter select{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;       
	background-image: url('/img/down.png');   
	background-position: center right;
	background-size: 1.6vw;
	background-repeat: no-repeat;
	color: #fff;
	width: 100%;
	background-color: Transparent;
	background-repeat:no-repeat;
	border: none;
	outline: none;
	scroll-behavior: smooth;
	cursor:pointer;
	line-height: 1.6vw;
	font-size: 1.6vw;
}
.LocationBarFilter select::-ms-expand {
	display: none;
}
.LocationBarFilter option {
	background-color: #fff !important; /* for IE */
	color:fff;
	font-size: 2vh;
	outline: none;
	border: none;
}
.LocationBarFilter hover, .LocationBarFilter focus .LocationBarFilter active {
	background: linear-gradient(#f5b333, #f5b333);
	background-color: #f5b333 !important; /* for IE */
	
	font-size: 2vh;
	outline: none;
	border: none;
}
.LocationBarFilter select option:checked {
	background: linear-gradient(#f5b333, #f5b333);
	background-color: #f5b333 !important; /* for IE */
	color: #fff;
	font-weight: 500;
}


/* TRAIL SCROLL BG */

.TrailScrollBG {
	position:absolute;
	display:block;
	height:56vh;
	width:100%;
	left:0;
	top:25vh;
	margin:0;
	padding:0;
	border:0;
	background-color: #ebebeb;
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	line-height: 2.5vh;
	font-size: 2.5vh;
	color:#ababab;
}

@media screen and (orientation:landscape) {
	.TrailScrollBG p{
		margin-top:3.5vh;
		margin-left:9vw;
	}
}
@media screen and (orientation:portrait) {
	.TrailScrollBG p{
		margin-top:3.5vh;
		margin-left:4vw;
	}
}

/* HORIZONTAL TRAIL SCROLL */
.TrailScrollContainer{
	position:absolute;
	top:34vh;
	width:100vw;
	height:42vh;
	overflow: hidden;
}

.TrailScroll {
  height:42vh;
  overflow-x: scroll;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  display: flex;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: -ms-autohiding-scrollbar;
  white-space: nowrap;
	/* Remove the default scrollbar for WebKit implementations */
	&::-webkit-scrollbar {
		display: none;
	}  		  
}
.TrailScroll::-webkit-scrollbar {
	width: 0px;
	background: transparent; /* make scrollbar transparent */
}
.TrailScroll section {
	scroll-snap-align: center;
}

.TrailScrollItem {
	vertical-align: middle;
	height:42vh;
	width:42vh;
	background-color:transparent;
	padding: 0 2vh 0 2vh;
}

.TrailItemBox {
	position:relative;
	margin-bottom: 3vh;
	height:38vh;
	width:38vh;
	
}
.TrailItemBG{
	position:absolute;
	top:0;
	left:0;
	height:100%;
	width:86%;
	background-color:#fff;
	filter: drop-shadow(-1vh 1vh 0.5vh rgba(0,0,0,0.2));
}
.TrailItemTop{
	position:absolute;
	top:0;
	left:0;
	height:80%;
	width:100%;
	background-color:#fff;
	/*overflow: hidden;*/

}
.TrailItemTop img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}


.TrailItemBottom{
	position:absolute;
	top:80%;
	left:0;
	height:20%;
	width:100%;
	display: flex; 
	background: linear-gradient(315deg, transparent 4vh, #e87407 4vh);
}
.TrailItemBottom p{
	margin: auto 0 auto 0; /* Important */ 
	padding-left: 1vh;
	width:78%;
	word-break: break-word;
	white-space: normal;
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	font-size: 2.0vh;
	color:#fff;
}
.TrailItemBottomImg{
	position:absolute;
	margin: auto 0 auto 0; /* Important */ 
	right:4vh;
	width:4vh;
	height:100%;
	background: url(/img/rightarrow.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size:contain;
}




/* PAGE SCROLL BG AND GENERAL */



@media screen and (orientation:landscape) {
	.PageScrollBG {
		position:absolute;
		display:block;
		height:84vh;
		width:100%;
		left:0;
		top:16vh;
		margin:0;
		padding:0;
		border:0;
		background-color: #ebebeb;
	}
	
	.PageScrollContainer{
		position:absolute;
		top:16vh;
		width:84vw;
		left:5vw;
	
		height:84vh;
		overflow: hidden;
	}
	
	.PageScroll {
	  width:84vw;
	  height:83vh;
	  overflow-x: hidden;
	  overflow-y: scroll;
	  scroll-snap-type: y mandatory;
	  display: block;
	  -webkit-overflow-scrolling: touch;
	  -ms-overflow-style: -ms-autohiding-scrollbar;

		/* Remove the default scrollbar for WebKit implementations */
		&::-webkit-scrollbar {
			display: none;
		}  		  
	}
}

@media screen and (orientation:portrait) {
	.PageScrollBG {
		position:absolute;
		display:block;
		height:78vh;
		width:100%;
		left:0;
		top:22vh;
		margin:0;
		padding:0;
		border:0;
		background-color: #ebebeb;
	}
	
	.PageScrollContainer{
		position:absolute;
		top:22vh;
		width:90vw;
		left:0;

		height:78vh;
		overflow: hidden;
	}
	
	.PageScroll {
	  width:90vw;
	  height:77vh;
	  overflow-x: hidden;
	  overflow-y: scroll;
	  scroll-snap-type: y mandatory;
	  display: block;
	  -webkit-overflow-scrolling: touch;
	  -ms-overflow-style: -ms-autohiding-scrollbar;

		/* Remove the default scrollbar for WebKit implementations */
		&::-webkit-scrollbar {
			display: none;
		}  		  
	}
}

/* PAGE SCROLL GENERAL */

.PageScroll::-webkit-scrollbar {
	width: 0px;
	background: transparent; /* make scrollbar transparent */
}
.PageScroll section {
	scroll-snap-align: start;
}

/* PAGE SCROLL RESULTS */
.PageScrollResultsItem {
	vertical-align: middle;
	height:25vh;
	width:84vw;
	background-color:transparent;
}
.PageScrollResultsBox {
	position:relative;
	margin-top: 1vh;
	margin-left: 2vw;
	height:24vh;
	width:84vw;
	background-color:transparent;
}
.PageResultBoxContent{
	position:absolute;
	top:0;
	left:0;
	height:18.5vh;
	width:84vw;
	background-color:#fff;
}
.PageResultBoxBottomBar{
	position:absolute;
	top:0;
	left:0;
	height:24vh;
	width:77vw;
	background-color:#fff;
	-webkit-filter: drop-shadow(-1vh 1vh 0.5vh rgba(0,0,0,0.2));
	filter: drop-shadow(-1vh 1vh 0.5vh rgba(0,0,0,0.2));
}
.PageResultImageContainer{
  position:absolute;
  overflow: hidden;
  top:0;
  left:0;
  width: 24vh;
  height:24vh;
}
.PageResultImageContainer img {
  object-fit: cover;
  width: 100%;
  min-height: 100%;
}
.PageResultTitle {
  position:absolute;
  overflow: hidden;
  display: flex; 
  top:0;
  left:24vh;
  width: 42vw;
  height:6.6vh;
}
.PageResultTitle p{
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
  line-height: 2.7vh;
  font-size: 2.6vh;
  color:#e87407;
  margin: auto 0 auto 0; /* Important */ 
  padding-left: 1vh;
  word-break: break-word;
  white-space: normal;
}
.PageResultInfo {
  position:absolute;
  overflow: hidden;
  display: flex;
  flex-wrap: wrap;
  top:6.6vh;
  left:24vh;
  width: -moz-calc(78vw - 24vh);
  width: -webkit-calc(78vw - 24vh);
  width: calc(78vw - 24vh);
  height: 11.8vh;
  padding-left: 1vh;
  padding-right: 1vh;
  margin: auto 0 auto 0; /* Important */ 
}
	
.PageResultTick {
	position:absolute;
	overflow: hidden;
	display: flex; 
	top:6.6vh;
	right:2.3vw;
	width:5vh;
	height:5vh;
}

.PageResultTick img{
	object-fit:contain;
	width:100%;
	min-height:100%;
}	
	
	
.PageResultInfoCell {
  font-family: 'Open Sans', sans-serif;
  font-weight: 500;
  line-height: 2.4vh;
  font-size: 2.4vh;
  color:#777;
  width:49%;
  margin: 0.7vh 0 auto 0; /* Important */ 
  text-align: left;
  word-break: break-word;
  white-space: normal;
}

.PageResultLocation {
  position:absolute;
  overflow: hidden;
  display: flex; 
  top:0;
  right:2.3vw;
  width: calc(82vw - 24vh);
  width: 22vw;
  height:6.6vh;
}
.PageResultLocation p{
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
  line-height: 2.5vmin;
  font-size: 2.5vmin;
  color:#777;
  margin: auto 0 auto 0; /* Important */ 
  padding-left: 0.5vh;
  padding-right: 0.5vh;
  text-align: right;
  word-break: break-word;
  white-space: normal;
}

.ResultButtonOne {
  position:absolute;
  top:18.5vh;
  height:5.5vh;
  width:16vw;
  right:13vw;
  cursor: pointer;
}
.ResultButtonTwo {
  position:absolute;
  top:18.5vh;
  height:5.5vh;
  width:16vw;
  right:2vw;
  cursor: pointer;
}


.ResultButtonOne img{
	  position:absolute;
	  top:0;
	  right:0;
	  width: 100%;
	  min-width: 100%;
	  height: 100%;
}
.ResultButtonTwo img{
	position:absolute;
	top:0;
	right:0;
	width: 100%;
	min-width: 100%;
	height: 100%;
}

.ResultButtonOneTrail {
  position:absolute;
  top:0;
  height:2.6rem;
  width:16vw;
  right:11vw;
  cursor: pointer;
}
.ResultButtonTwoTrail {
  position:absolute;
  top:0;
  height:2.6rem;
  width:16vw;
  right:0vw;
  cursor: pointer;
}

.ResultButtonOneTrail img{
	  position:absolute;
	  top:0;
	  right:0;
	  width: 100%;
	  min-width: 100%;
	  height: 100%;
}
.ResultButtonTwoTrail img{
	position:absolute;
	top:0;
	right:0;
	width: 100%;
	min-width: 100%;
	height: 100%;
}


.BtnContent {
	position:absolute;
	top: 10%; /* Important */ 
	right: 10%; /* Important */ 
	width: 80%;
	height: 80%;
	background:transparent;
}

.BtnContentTrail {
	position:absolute;
top:15%;
	right: 10%; /* Important */ 

	width: 80%;
	height: 80%;
	background:transparent;
}

.Add {
	background: url(/img/btn_add.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size:contain;
}
.Remove {
	background: url(/img/btn_remove.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size:contain;
}
.More {
	background: url(/img/btn_more.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size:contain;
}
.Back {
	background: url(/img/btn_back.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size:contain;
}
.View {
	background: url(/img/btn_view.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size:contain;
}
.Menu {
	background: url(/img/btn_menu.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size:contain;
}
.Logout {
	background: url(/img/btn_logout.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size:contain;
}
.Comment {
	background: url(/img/btn_comment.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size:contain;
}

@media screen and (orientation:portrait) {
	.TrailOverrideOne {
		top:0;bottom:0;right:0;height:4vh;
	}
	.PageScrollResultsItem {
		height:33vh;
		width:90vw;
	}
	.PageScrollResultsBox {
		height:33vh;
		width:88vw;
	}
	.PageResultBoxContent{
		width:88vw;
		height:26.4vh;
	}
	.PageResultBoxBottomBar{
		top:0vh;
		height:33vh;
		width:79vw;
	}
	.ResultButtonOne {
	  position:absolute;
	  top:26.4vh;
	  height:6.6vh;
	  width:24vw;
	  right:16vw;
	}
	.ResultButtonRel {
			  position:relative;
		top:0 !important;
		height:2.6rem !important;
	}
	
	.ResultButtonTwo {
	  position:absolute;
	  top:26.4vh;
	  height:6.6vh;
	  width:24vw;
	  right:0vw;
	}
	.ResultButtonOneTrail {
	  position:absolute;
	  top:0;
	  height:2.6rem;
	  width:24vw;
	  right:16vw;
	}
	.ResultButtonTwoTrail {
	  position:absolute;
	  top:0;
	  height:2.6rem;
	  width:24vw;
	  right:0vw;
	}
	.PageResultImageContainer{
		width:19.8vh;
		height:19.8vh;
		top:6.6vh;
	}
	.PageResultTitle {
		left:0vh;
		width: 81vw;
	}
	
	.PageResultTick {
		position:absolute;
		overflow: hidden;
		display: flex; 
		top:0.8vw;
		right:0.8vw;
		width:5vw;
		height:5vw;
	}

	.PageResultInfo {
	  left:19.8vh;
	  width: calc(88vw - 19.8vh);
	  height: 19.8vh;
	}

	
	
	.PageResultInfoCell {
	  		line-height: 1.8vh;
		font-size: 1.8vh;
	  width:100%;
	  margin: auto 0 auto 0; /* Important */ 
	  text-align: left;
	  word-break: break-word;
	  white-space: normal;
	}
	.PageResultLocation {
	  position:absolute;
	  overflow: hidden;
	  display: flex; 
	  top:auto;
	  bottom:0;
	  right:auto;
	  left:1vh;
	  width: 40vw;
	  height:6.6vh;
	}
	.PageResultLocation p{
		 text-align: left;
	}
	
	.Comment {
		background: url(/img/btn_comment_p.png);
		background-repeat: no-repeat;
		background-position: center;
		background-size:contain;
	}
	
}

/* TRAIL VIEW PAGE overiddes*/
.TrailHeaderDiv {
	position:absolute;
	display:table;
	top:2vh;
	height:10vh;
	left:14vw;
	width:82vw;
}
@media screen and (orientation:portrait) {
	.TrailHeaderDiv {
		top:5vh;
		left:12vh;
		width:80vw;
	}
}

.TrailHeadArrow {
	display: table-cell;
	width:5.5vh;
	height:100%;
	background:transparent;
	background: url(/img/rightarroworange.png);
	background-repeat: no-repeat;
	background-position: right;
	background-size:contain;
}
.TrailHeaderTitle{
	margin: auto 0 auto 0; /* Important */ 
	display:table-cell;
	vertical-align: middle;
	height:100%;
}
.TrailHeaderTitle p{
	margin: auto 0 auto 1vh; /* Important */ 
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	line-height: 5.5vh;
	font-size: 5.5vh;
	color:#e87407;
}

.TrailHeaderEnd {
	position:absolute;
	top:2vh;
	height:10vh;	
	right:5vw;
	display:flex;
}

.TrailHeadCell{
	position:relative;
	display:flex;
	align-items: right;
	padding-left:0.5vh;
	padding-right:0.5vh;
	width:9vh;
	height:10vh;
}

.TrailHeadCell img {
  position:absolute;
  top:0;
  object-fit: contain;
  width: 8vh;
  height: 8vh;
}

.TrailHeadCell p{
	position:absolute;
	top:8vh;
	height: 2vh;
	width:8vh;
	text-align:center;
	font-family: 'Open Sans', sans-serif;
	font-weight: 500;
	line-height: 1.6vh;
	font-size: 1.6vh;
	color:#888;
}

/*
.TrailHeaderImage {
	display: table-cell;
	width:5.5vh;
	height:8vh;
	background:transparent;
	background: url(/img/rightarroworange.png);
	background-repeat: no-repeat;
	background-position: right;
	background-size:contain;
}
*/


@media screen and (orientation:portrait) {
	.TrailHeaderEnd {
		position:absolute;
		top:0.5vw;
		height:10vw;	
		right:5vh;
		display:flex;
	}
	.TrailHeadCell{
		position:relative;
		display:flex;
		align-items: right;
		padding-left:0.5vw;
		padding-right:0.5vw;
		width:9vw;
		height:10vw;
	}

	.TrailHeadCell img {
		  width: 8vw;
		  height: 8vw;
	}

	.TrailHeadCell p{
		top:8vw;
		height: 2vw;
		width:8vw;
		line-height: 1.6vw;
		font-size: 1.6vw;

	}
	
	.TrailHeadArrow {
		width:5vw;
	}
	
	
	.TrailHeaderTitle p{
		line-height: 5vw;
		font-size: 5vw;
	}
}

/*
.TrailHeadRight{
	position:relative;
	display:flex;
	align:right;
	height:100%;
}
.TrailLeft{
	display:table-cell;
	align:center;
	width:10%;
	height:100%;
	background-color:#ff0;
}
*/

.TrailPageScrollBG {
	position:absolute;
	display:block;
	height:86vh;
	width:100%;
	left:0;
	top:14vh;
	margin:0;
	padding:0;
	border:0;
	background-color: #ebebeb;
}
	
.TrailPageScrollContainer{
	position:absolute;
	top:14vh;
	width:84vw;
	left:5vw;
	height:86vh;
	overflow: hidden;
}

.TrailPageScroll {
  width:84vw;
  height:85vh;
  overflow-x: hidden;
  overflow-y: scroll;
  scroll-snap-type: y mandatory;
  display: block;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: -ms-autohiding-scrollbar;
	/* Remove the default scrollbar for WebKit implementations */
	&::-webkit-scrollbar {
		display: none;
	}  		  
}
/* PAGE SCROLL GENERAL */

.TrailPageScroll::-webkit-scrollbar {
	width: 0px;
	background: transparent; /* make scrollbar transparent */
}
.TrailPageScroll section {
	scroll-snap-align: start;
}



@media screen and (orientation:portrait) {
	.TrailPageScrollContainer {
		width:90vw;
		left:0;
	}
	.TrailPageScroll {
	  width:90vw;
	  	scroll-snap-type: none;
	}
}

.TrailHOver {
	height:38vh;
}
.TrailHOverp1 {
	height:39vh;
}
.TrailHOverMinusBottom {
	height:32.5vh;
}
.TrailButtonTop {
  top:32.5vh;
}



.TrailLocation {
  position:absolute;
  overflow: hidden;
  display: flex; 
  top:0;
  right:2.3vw;

  height:6.6vh;
}
.TrailLocation p{
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
  line-height: 2.5vmin;
  font-size: 2.5vmin;
  color:#777;
  margin: auto 0 auto 0; /* Important */ 
  padding-left: 0.5vh;
  padding-right: 0.5vh;
  text-align: right;
  word-break: break-word;
  white-space: normal;
}


.TrailImageContainer{
  position:absolute;
  overflow: hidden;
  top:0;
  left:0;
  width: 30vw;
  height: 38vh;
}
.TrailImageContainer img{
  object-position: 50% 50%; 
  object-fit: contain;
  width: 100%;
  height: 100%;
}
.TrailResultTitle {
  position:absolute;
  overflow: hidden;
  display: block; 
  top:4.5vh;
  left:30vw;
  width:51vw;
  /*height:6.6vh;*/
}
.TrailResultTitle p{
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
  line-height: 4vmin;
  font-size: 3.2vmin;
  color:#e87407;
  text-align:left;
  margin: auto 0 auto 0; /* Important */ 
  padding-left: 10px;
  word-break: break-word;
  white-space: normal;
}

.TrailResult {
	font-family: 'Open Sans', sans-serif;
    font-weight: 500;
	line-height: 2.8vh;
	padding-right:5px;
	font-size: 2.8vh;
    color:#777;
	word-break: break-word;
	white-space: normal;
	display:block;	
}
.TrailResult p{
	font-family: 'Open Sans', sans-serif;
    font-weight: 500;
	line-height: 2.8vh;
	padding-right:5px;
	font-size: 2.4vh;
    color:#777;
	word-break: break-word;
	white-space: normal;
}

@media screen and (orientation:portrait) {
	.TrailHOver {
		height:45vh;
	}
	.TrailHOverp1 {
		height:46vh;
	}
	.TrailHOverMinusBottom {
		height:38.4vh;
	}
	.TrailButtonTop {
		top:38.4vh;
	}
	.TrailLocation {
		top:10px; 
	}
	.TrailLocation p{	
		line-height: 3.0vmin;
		font-size: 3.0vmin;
		height:8vh;
	}
	.TrailImageContainer{
		height:45vh;
	}
	.TrailResultTitle {
		 width: 60vw;
	}
	.TrailResultTitle p{
		 line-height: 5vmin;
		font-size: 3.8vmin;
	}
	.TrailResult {
		width:58vw;
		height:31.8vh;
	}
	.TrailResult p{
		line-height: 2.6vh;
		font-size: 2.2vh;
	}
}



/* ITEM HEADER VIEW */

.ItemViewHeader {
	position: absolute;
	display: table;
	top:2vh;
	height:10vh;
	left:14vw;
	width:66vw;
}
.ItemHeaderTitle{
	margin: auto 0 auto 0; /* Important */ 
	display:table-cell;
	vertical-align: middle;
	height:100%;
}
.ItemHeaderTitle p{
	margin: auto 0 auto 1vh; /* Important */ 
	font-family: 'Open Sans', sans-serif;
	font-weight: 700;
	line-height: 4.5vh;
	font-size: 4.5vh;
	color:#e87407;
}

.YourTrailItemMod {
	top:1vh;
}

/* Main Page */
.ItemScroll {
	scroll-snap-type: none;
}

.ItemHOver {
	/*height:114vh;*/
	height:auto;
}
.ItemHOverp1 {
	height:auto;
}
.ItemHOverMinusBottom {
	/*height:107.4vh;*/
	height:100%;
	-webkit-filter: drop-shadow(-1vh 1vh 0.5vh rgba(0,0,0,0.2));
	filter: drop-shadow(-1vh 1vh 0.5vh rgba(0,0,0,0.2));
}
.ItemBline {
	position:relative;
	margin-top: 0;
	margin-left: 2vw;
	height:6.6vh;
	width:84vw;
	background-color:transparent;
}

.ItemButtonBLine {
  position:relative;
  display:block;
  height:3vh;
  width:16vw;
  height:100%;
  right:2vw;
}
.ItemButtonBLine img{
	position:absolute;
	top:0;
	right:0;
	width: 100%;
	min-width: 100%;
	height: 100%;
}


.ItemLocation{
  position:relative;
  /*overflow: hidden;*/
  display: block; 
  align-items:right;
  top:10px;
  right:2.3vw;
  /*height:4vh;*/
}
.ItemLocation p{
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
 /* line-height: 2.5vmin;*/
  font-size: 2.5vmin;
  color:#777;
 /* margin: auto 0 auto 0; // Important */ 
  padding-left: 0.5vh;
  padding-right: 0.5vh;
  text-align: right;
  word-break: break-word;
  white-space: normal;
}
.ItemImageContainer {
  position:absolute;
  top:5vh;
  left:5vh;
  width:55vh;
  height:55vh;
  border-style:solid;
  border-width:8px;
  border-color:#eee;
}
.ItemImageContainer img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}


.ItemImageContainerRel {
  /*display:inline-block;*/
  position:relative;
  margin: 0 0 0 2vh;
  width:45vh;
  height:auto;
  border-style:solid;
  border-width:8px;
  border-color:#eee;
}
.ItemImageContainerRel img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.ItemDetails {
	/*position:relative;*/
	display:inline-block;
    width:50vw;
	padding: 20px 0 0 0;
	margin: 0 0 0 2vh;
	text-align: left;
	font-size: 1.1rem;
	line-height: 1.1rem;
	top:2vh;	
}

.ItemDetails p{
	font-family: 'Open Sans', sans-serif;
    font-weight: 500;
	/*line-height: 1.9vw;*/
	padding-right:5px;
	/*font-size: 2vw;*/
    color:#777;
	word-break: break-word;
	white-space: normal;
}

.ItemDescriptionStrip {
	display:block;
	position:relative;
	left:-1px;
	margin-top:3vh;
	width:40vw;
	height:7vh;
	background: linear-gradient(315deg, transparent 6vh, #f5b333 6vh);
}
.ItemDescriptionStrip p{
	margin: auto 0 auto 1.5vh;
	font-family: 'Open Sans', sans-serif;
    font-weight: 700;
	line-height: 5vh;
	padding-right:5px;
	font-size: 3.5vh;
    color:#FFF;
	word-break: break-word;
	white-space: normal;
}

.ItemDescription {
	display:block;
	position:relative;
	left:-1px;
	width:82vw;
}
.ItemDescription p{
	margin: auto 1vh auto 2vh;
			padding-top:3vh;
		padding-bottom:3vh;
	font-family: 'Open Sans', sans-serif;
    font-weight: 500;
	
	padding-right:5px;
	font-size: 1.2rem;
		line-height: 1.2rem;
    color:#777;
	word-break: break-word;
	white-space: normal;
}

@media screen and (orientation:portrait) {
	/*Header*/
	.ItemViewHeader {
		left:12vh;
		width:40vw;
	}
	.ItemHeaderTitle p{
		line-height: 3.5vw;
		font-size: 3.5vw;
	}
	.YourTrailItemMod {
		top:2vh;
		height:10vh;
	}
	/*Main page*/
	.ItemHOver {
		/*height:249vw;*/
		height:auto;
	}
	.ItemHOverp1 {
		height:auto;
	}
	.ItemHOverMinusBottom {
		height:100%;
		/*height:242.4vw;*/
	}
	.ItemBline {
		width:88vw;
	}
	.ItemButtonBLine {
	  position:relative;
	  display:block;
	  height:3vh;
	  width:24vw;
	  right:0vw;
	}
	.ItemButtonTop {
		position: relative;
		display: block;
		height:auto;
	}
	.ItemImageContainer {
	  position:absolute;
	  display:block;
	  top:9vw;
	  left:6vw;
	  width:75vw;
	  height:75vw;
	  border-style:solid;
	  border-width:8px;
	  border-color:#eee;
	}
	
	.ItemImageContainerRel {
	  position:relative;
	  margin: 2vh 0 0 2vh;
	  width:80vw;
	  height:auto;
	  border-style:solid;
	  border-width:8px;
	  border-color:#eee;
	}
	
	.ItemLocation {
		top:10px;
	}
	
	.ItemLocation p{
		line-height: 3vh;
		font-size: 2vh;
		/*height:9vh;*/
	}
	
	.ItemDetails {
		/*position:relative;*/
		display:block;
		width:80vw;
			padding: 20px 0 0 0;
		margin: 0 2vh 0 2vh; /* Important */ 
		/*height:75vw;*/
		font-size: 0.7rem;
		line-height: 0.7rem;
		text-align: left;
	}

	.ItemDetails p{
		font-family: 'Open Sans', sans-serif;
		font-weight: 500;

		padding-right:5px;
		padding-bottom:5px;
		
		color:#777;
		word-break: break-word;
		white-space: normal;
	}

	.ItemDescriptionStrip {
		left:-1px;
		width:60vw;
		height:7vw;
		margin-top:0;
		background: linear-gradient(315deg, transparent 7vw, #f5b333 7vw);
	}
	.ItemDescriptionStrip p{
		line-height: 7vw;
		font-size: 4vw;
	}
	
	.ItemDescription {
		display:block;
		position:relative;
		left:-1px;
		width:88vw;
							font-size: 1.0rem;
	line-height: 1.0rem;
	}
	.ItemDescription p{
		padding-top:3vh;
		padding-bottom:3vh;
		margin: auto 1vw auto 2vw;
		font-family: 'Open Sans', sans-serif;
		font-weight: 500;
		font-size: 1.3rem;
		line-height: 1.3rem;
		padding-right:5px;

		color:#777;
		word-break: break-word;
		white-space: normal;
	}
}

/* ITEM VIEW BOTTOM BUTTONS */

.ItemImageBottomButtons {
	position:absolute;
	width:22vw;
	height:3vw;
	bottom:1vw;
	right:1vw;
}
.ItemButtonOne {
  position:absolute;
  top:0;
  height:3vw;
  width:11vw;
  right:7.5vw;
}
.ItemButtonTwo {
  position:absolute;
  top:0;
  height:3vw;
  width:11vw;
  right:0;
}
.ItemButtonOne img{
  position:absolute;
  top:0;
  right:0;
  width: 100%;
  min-width: 100%;
  height: 100%;
}
.ItemButtonTwo img{
	position:absolute;
	top:0;
	right:0;
	width: 100%;
	min-width: 100%;
	height: 100%;
}

.UserBackendButtons {
	position:absolute;
	width:22vw;
	height:3vw;
	bottom:1vw;
	left:1vw;
	z-index:1;
}

@media screen and (orientation:portrait) {
	.UserBackendButtons {
		position:absolute;
		width:28vh;
		height:4vh;
		bottom:1vh;
		left:1vh;
		z-index:1;
	}
	
	.ItemImageBottomButtons {
		position:absolute;
		width:28vh;
		height:4vh;
		bottom:1vh;
		right:1vh;
	}
	.ItemButtonOne {
	  position:absolute;
	  top:0;
	  height:4vh;
	  width:14vh;
	  right:9.5vh;
	}
	.ItemButtonTwo {
	  position:absolute;
	  top:0;
	  height:4vh;
	  width:14vh;
	  right:0;
	}
}

/* Comment section */
.CommentsSection {
	display:block;
	vertical-align: middle;
	width:84vw;
	background-color:transparent;
}

.CommentsContainer {
	position:relative;
	margin-top: 1vh;
	margin-left: 2vw;
	width:82vw;
	background-color:#fff;
	-webkit-filter: drop-shadow(-1vh 1vh 0.5vh rgba(0,0,0,0.2));
	filter: drop-shadow(-1vh 1vh 0.5vh rgba(0,0,0,0.2));
}

.CommentStrip {
	position:relative;
	display:flex;
	top:0;
	left:-1px;
	width:40vw;
	height:7vh;
	background: linear-gradient(315deg, transparent 6vh, #f5b333 6vh);
}

	
.CommentStrip p{
	margin: auto 0 auto 1.5vh;
	font-family: 'Open Sans', sans-serif;
    font-weight: 700;
	line-height: 5vh;
	padding-right:5px;
	font-size: 3.5vh;
    color:#FFF;
	word-break: break-word;
	white-space: normal;
}
.CommentHeader{
	padding: 25px 0 25px 0;
	background-color: #fff;
}
.CommentStyle1{
	padding: 25px 0 25px 0;
	background-color: #fff;
}
.CommentStyle2{
	padding: 25px 0 25px 0;
	background-color: #f4f4f4;
}
.CommentsPerson{
	font-weight: 700;
	color:#e87407;
}
.CommentReply1 {
	padding: 0px 0 25px 0;
	background-color: #fff;
}
.CommentReply2 {
	padding: 0px 0 25px 0;
	background-color: #f4f4f4;
}
.CommentsReplyTitle{
	font-weight: 700;
	color:#f5b333;
}
.time{
	font-weight: 500;
	color:#777;
	font-size:60%;
}
.CommentHeader p {
	margin: 0 1vh 0 2vh;
	font-family: 'Open Sans', sans-serif;
    font-weight: 500;
	line-height: 2.0vh; 
	padding-right:5px;
	font-size: 2.2vh;
    color:#555;
	word-break: break-word;
	white-space: normal;
}

.CommentStyle1 p {
	margin: 0 1vh 0 2vh;
	font-family: 'Open Sans', sans-serif;
    font-weight: 500;
	line-height: 2.8vh;
	padding-right:5px;
	font-size: 2.6vh;
    color:#777;
	word-break: break-word;
	white-space: normal;
}
.CommentStyle2 p {
	margin: 0 1vh 0 2vh;
	font-family: 'Open Sans', sans-serif;
    font-weight: 500;
	line-height: 2.8vh;
	padding-right:5px;
	font-size: 2.6vh;
    color:#777;
	word-break: break-word;
	white-space: normal;
}

.CommentReply1 p {
	margin: 0 3vh 0 2vh;
	font-family: 'Open Sans', sans-serif;
    font-weight: 500;
	line-height: 2.8vh;
	padding-left:40px;
	padding-right:5px;
	font-size: 2.6vh;
    color:#777;
	word-break: break-word;
	white-space: normal;
}
.CommentReply2 p {
	margin: 0 3vh 0 2vh;
	font-family: 'Open Sans', sans-serif;
    font-weight: 500;
	line-height: 2.8vh;
	padding-left:40px;
	padding-right:5px;
	font-size: 2.6vh;
    color:#777;
	word-break: break-word;
	white-space: normal;
}

.CommentsEnd {
	position:relative;
	top:0;
	left:2vw;
	height:2.6rem;
	width:82vw;
	background: linear-gradient(315deg, transparent 1.8rem, #fff 1.8rem);
	-webkit-filter: drop-shadow(-1vh 1vh 0.5vh rgba(0,0,0,0.2));
	filter: drop-shadow(-1vh 1vh 0.5vh rgba(0,0,0,0.2));
}

.CommentsEndTrail {
	position:relative;
	top:0;
	left:2vw;
	height:2.6rem;
	width:82vw;
	background: linear-gradient(270deg, transparent 5rem, #fff 5rem);
	-webkit-filter: drop-shadow(-1vh 1vh 0.5vh rgba(0,0,0,0.2));
	filter: drop-shadow(-1vh 1vh 0.5vh rgba(0,0,0,0.2));
}


@media screen and (orientation:portrait) {
	.CommentsSection {
		width:90vw;
	}
	.CommentsContainer {
		width:88vw;
	}
	.CommentStrip {
		left:-1px;
		width:60vw;
		height:7vw;
		background: linear-gradient(315deg, transparent 7vw, #f5b333 7vw);
	}
	.CommentStrip p{
		line-height: 7vw;
		font-size: 4vw;
	}
	.CommentsEnd{
		height:2.6rem;
		width:88vw;
	    background: linear-gradient(315deg, transparent 1.8rem, #fff 1.8rem);
	}
	.CommentsEndTrail{
		height:2.6rem;
		width:88vw;
	    background: linear-gradient(270deg, transparent 5rem, #fff 5rem);
	}
}


/* TRAIL SEARCH */

.TrailsViewTitle {
  position:absolute;
  display: block; 
  top:0;
  left:24vh;
  width: 42vw;
  height:18.5vh;
  align:center;
}
.TrailsViewTitleText {
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
  line-height: 4.0vh;
  font-size: 4.0vh;
  color:#e87407;
 
  padding-left: 1vh;
  word-break: break-word;
  white-space: normal;
}
.TrailsViewTitle p{
  font-family: 'Open Sans', sans-serif;
  font-weight: 500;
  line-height: 2.0vh;
  font-size: 1.8vh;
  color:#777;

  padding-left: 1vh;
  word-break: break-word;
  white-space: normal;
}

/* Submission form overlays */

.SubmissionFormOverlay {
	position:absolute;
	display:none;
	visible:hidden;
	top:14vh;
	left:0;
	width:100%;
	height:86vh;
	padding-left:12vw;
	padding-right:12vw;
	 background-color: #f5b333; /*#e87407;*/
	 z-index:2;
}

@media screen and (orientation:portrait) {
	.SubmissionFormOverlay {
		height:86vh;
	}
}