/* *********************************************************************
 * *********************************************************************
 *
 * Primary Styles
 * Author: Brian Dodson, Creative Navigation www.creativenavigation.com
 *
 * *********************************************************************
 * *********************************************************************/

@font-face {
    font-family: 'Sketch Block';
    src: url('../../includes/css/fonts/sketch_block-webfont.eot');
    src: url('../../includes/css/fonts/sketch_block-webfont.eot?#iefix') format('embedded-opentype'),
         url('../../includes/css/fonts/sketch_block-webfont.woff2') format('woff2'),
         url('../../includes/css/fonts/sketch_block-webfont.woff') format('woff'),
         url('../../includes/css/fonts/sketch_block-webfont.ttf') format('truetype'),
         url('../../includes/css/fonts/sketch_block-webfont.svg#sketch_blockbold') format('svg');
    font-weight: normal;
    font-style: normal;

}

html, html a, *, *:before, *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
  text-rendering: optimizeLegibility !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-font-smoothing: antialiased !important;
  font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale;
 }

* {font-size:13px;line-height:17px;}
#content {width:976px;height:766px; position:relative;}
.slide {color:#3d6a0e;padding:20px 20px 20px;left:0;width:100%;height:530px; z-index:11; background: -moz-linear-gradient(-45deg,  rgba(0,110,41,1) 0%, rgba(0,93,37,0.72) 18%, rgba(0,64,30,0.83) 49%, rgba(0,101,54,0.98) 93%, rgba(0,101,54,1) 100%);
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(0,110,41,1)), color-stop(18%,rgba(0,93,37,0.72)), color-stop(49%,rgba(0,64,30,0.83)), color-stop(93%,rgba(0,101,54,0.98)), color-stop(100%,rgba(0,101,54,1)));
background: -webkit-linear-gradient(-45deg,  rgba(0,110,41,1) 0%,rgba(0,93,37,0.72) 18%,rgba(0,64,30,0.83) 49%,rgba(0,101,54,0.98) 93%,rgba(0,101,54,1) 100%);
background: -o-linear-gradient(-45deg,  rgba(0,110,41,1) 0%,rgba(0,93,37,0.72) 18%,rgba(0,64,30,0.83) 49%,rgba(0,101,54,0.98) 93%,rgba(0,101,54,1) 100%);
background: -ms-linear-gradient(-45deg,  rgba(0,110,41,1) 0%,rgba(0,93,37,0.72) 18%,rgba(0,64,30,0.83) 49%,rgba(0,101,54,0.98) 93%,rgba(0,101,54,1) 100%);
background: linear-gradient(135deg,  rgba(0,110,41,1) 0%,rgba(0,93,37,0.72) 18%,rgba(0,64,30,0.83) 49%,rgba(0,101,54,0.98) 93%,rgba(0,101,54,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#006e29', endColorstr='#006536',GradientType=1 );


}
	.slide h1 {font-size:34px;line-height:1em;margin:1em 0 .5em; font-weight:400; font-family:"Sketch Block", Arial, sans-serif; width: 33%; line-height:1.2em; color:#FFF;}
	.slide .description {height:394px;margin-bottom:15px;width:290px; font-family:Arial, Helvetica, sans-serif; color:#FFF;}
		.description p {margin-top:0; font-size:18px; line-height:1.3em; margin:0 0 1em 0; color:#FFF;}
	.read-less {top:64px;left:246px;}
	.read-more {bottom:182px;left:246px;}
		.read-less:hover, .read-more:hover {opacity:0.8;filter:alpha(opacity=80);}
	.slide .ssp, .slide #ssp-i, .slide #ssp-v, .slide .ssp .inner, .slide .singleimg, .slide .singleimg img, .slide .ssp .inner img, #ssp-v video {height:455px;width:610px; background:#FFF;}
	
	.slide #ssp-i, .slide #ssp-v, .slide .singleimg {position:absolute; top:-4px; right:25px;}
	.slide #ssp-i, .slide #ssp-v {border:5px solid #572c0b; width:620px; height:465px;}
	
		.ssp-play, .ssp-pause, .ssp-control {margin-right:380px; margin-top:10px; padding:5px 10px; background:url('/images/bgs/light-paper.jpg'); -moz-border-radius:25px; -webkit-border-radius:25px; border-radius:25px; display:block; width:140px; height:auto; left:30px;}
		.ssp-play.with-video, .ssp-pause.with-video {margin-right:268px;}
		.ssp-control.next {left:260px; margin-right:0; top: 6px;}
		.ssp-control.prev {left:-130px; margin-right:-266px; top: 6px;}
		.ssp-play img, .ssp-pause img, .ssp-control img, .ssp-control.next img, .ssp-control.prev img, .ssp-pause img, .ssp-play img {display:block; width:80%; margin:0 auto; float:none;}
			.ssp-play:hover, .ssp-pause:hover, .ssp-control:hover {opacity:0.8;filter:alpha(opacity=80);}
		.ssp-play, .ssp-pause {padding:10px; width:58px; position:relative; top:6px;}
		.ssp-play {width:50px; margin-right:388px; left:33px; padding-left:0; padding-right:0;}
		.ssp-play img, .ssp-pause img {width:50%;}
		.ssp-play {display:none;}
		.view-ssp-i, .view-ssp-v { position:absolute; bottom:105px;}
		.view-ssp-i {margin-right:240px;}
			.view-ssp-i:hover, .view-ssp-i:active, .view-ssp-i:focus, .view-ssp-v:hover, .view-ssp-v:active, .view-ssp-v:focus {opacity:0.8;filter:alpha(opacity=80);}
		.counter {position:absolute; right:5px; top:408px; background:rgba(255,255,255,0.8); padding:5px; -moz-border-radius:5px;-webkit-border-radius:5px;-o-border-radius:5px; border-radius:5px; }
	#locate {color:#451e02; text-indent:100%; white-space:nowrap; overflow:hidden; background:url(/map/img/ui/locate-on-map.png) top left no-repeat; background-size:100%; width:250px; height:45px; bottom:5px; display:block; cursor:pointer;}
	
	#locate:hover {opacity:.8;filter:alpha(opacity=80);}
	
		#locate:hover, #locate:focus, #locate:active {text-decoration:underline;}
	.slide .close {bottom:5px;right:15px; width:50px;}
	.slide a.close:hover { opacity:.8;filter:alpha(opacity=80);}
	
.bubble, .bubblePerm, .bubble-select {background:#FFF;-moz-border-radius:10px;-webkit-border-radius:5px;-o-border-radius:5px; border-radius:5px;color:#3d6b10;padding:5px 15px;font-size:14px; font-family:Arial, Helvetica, sans-serif; font-weight:bold;}
.bubble a, .bubblePerm a, .bubble-select a {color:#3d6b10;}

	.bubble-select a:hover {opacity:0.8; filter:alpha(opacity=80); text-decoration:none;}
	.bubble h1, .bubblePerm h1, .bubble-select h1 {font-size:14px;margin:5px; font-weight:normal;}
	.bubble p, .bubblePerm p, .bubble-select p {font-size:10px;line-height:1.6em;margin:5px 0;}
	.bubble span, .bubblePerm span, .bubble-select span {display:block;font-size:12px;font-weight:bold;}
.map_buttons {padding:0 !important;height:500px; margin:0; position:absolute; top:-500px; background: rgb(0,101,54);
background: -moz-linear-gradient(-45deg,  rgba(0,101,54,1) 0%, rgba(1,71,34,1) 38%, rgba(0,101,54,1) 68%, rgba(1,71,34,1) 100%);
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(0,101,54,1)), color-stop(38%,rgba(1,71,34,1)), color-stop(68%,rgba(0,101,54,1)), color-stop(100%,rgba(1,71,34,1)));
background: -webkit-linear-gradient(-45deg,  rgba(0,101,54,1) 0%,rgba(1,71,34,1) 38%,rgba(0,101,54,1) 68%,rgba(1,71,34,1) 100%);
background: -o-linear-gradient(-45deg,  rgba(0,101,54,1) 0%,rgba(1,71,34,1) 38%,rgba(0,101,54,1) 68%,rgba(1,71,34,1) 100%);
background: -ms-linear-gradient(-45deg,  rgba(0,101,54,1) 0%,rgba(1,71,34,1) 38%,rgba(0,101,54,1) 68%,rgba(1,71,34,1) 100%);
background: linear-gradient(135deg,  rgba(0,101,54,1) 0%,rgba(1,71,34,1) 38%,rgba(0,101,54,1) 68%,rgba(1,71,34,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#006536', endColorstr='#014722',GradientType=1 );
}
	.map_buttons li {margin:5px 15px; left:70px; top:25px;}
		.map_buttons a {color:#442803; text-shadow: 0 0 5px #FFF; line-height:20px;width:250px;font-size:16px; font-weight:bold; font-family:Arial, Helvetica, sans-serif; -moz-border-radius:10px; -webkit-border-radius:10px; -ms-border-radius:10px; border-radius:10px; background: -moz-linear-gradient(-45deg,  rgba(239,207,170,0.74) 0%, rgba(232,207,171,0.53) 37%, rgba(227,207,171,0.61) 65%, rgba(239,207,170,0.7) 100%);
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(239,207,170,0.74)), color-stop(37%,rgba(232,207,171,0.53)), color-stop(65%,rgba(227,207,171,0.61)), color-stop(100%,rgba(239,207,170,0.7)));
background: -webkit-linear-gradient(-45deg,  rgba(239,207,170,0.74) 0%,rgba(232,207,171,0.53) 37%,rgba(227,207,171,0.61) 65%,rgba(239,207,170,0.7) 100%);
background: -o-linear-gradient(-45deg,  rgba(239,207,170,0.74) 0%,rgba(232,207,171,0.53) 37%,rgba(227,207,171,0.61) 65%,rgba(239,207,170,0.7) 100%);
background: -ms-linear-gradient(-45deg,  rgba(239,207,170,0.74) 0%,rgba(232,207,171,0.53) 37%,rgba(227,207,171,0.61) 65%,rgba(239,207,170,0.7) 100%);
background: linear-gradient(135deg,  rgba(239,207,170,0.74) 0%,rgba(232,207,171,0.53) 37%,rgba(227,207,171,0.61) 65%,rgba(239,207,170,0.7) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bdefcfaa', endColorstr='#b3efcfaa',GradientType=1 );
}
			.map_buttons a:hover, .map_buttons a:focus, .map_buttons a:active {color:#FFF; text-decoration:none; color:#000; background:rgba(255,255,255,0.6);}
			.map_buttons a span.new {color:#ffc900; text-shadow:none;}
	.map_buttons li.keyBtn {margin:-60px 10px 0px 0px;left:auto;top:0;}
		.map_buttons li.keyBtn a {width:200px; background:transparent; -moz-border-radius:0; -webkit-border-radius:0; -ms-border-radius:0; border-radius:0; margin-top:570px;}
				.map_buttons li.keyBtn a.keyCloseBtn {top:-80px; width:50px;}
			.map_buttons li.keyBtn a img {position:relative; top:3px;}
	
		
#map_zoom {left:30px;top:20px;right:auto;}
	#map_zoom li {margin:0 5px 0 0;}
	#map_zoom a {display:block; width:30px; margin:8px 0 0 0;}

.zoomtxt {display:block; width:100px;}

/* We may need this if using the same image for all platforms, but need to control size because it is large for hi-res mobile?? */
ul.map_buttons li.keyBtn a img {width:100%; display: block;}