/* --------------------------------------------------------------------
   Reset - modified from http://meyerweb.com/eric/tools/css/reset/
-------------------------------------------------------------------- */

html, body, div, span, object, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, cite, code, em, img, strong, sup, var, b, u, i, center, ol, ul, li, fieldset, form, label, article, aside, figure, figcaption, footer, header, hgroup,  menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after { content: ''; content: none; }
strong { font-weight: bold; }
/*  font-family: 'Squada One', cursive;
  font-family: 'Teko', sans-serif;*/
html {
  font-size: 16px;
  color: #fff;
  -webkit-font-smoothing: antialiased;
}
body {
  font-family: 'Source Sans Pro', sans-serif;

    /*font-family: 'Teko', Helvetica, Arial, sans-serif; font-weight: 400;*/
  font-size: 62.5%;
  background-color: #181818;
}
img {
  max-width: 100%;
}
textarea {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  resize: none;
  font-family: 'Source Sans Pro', sans-serif;
}
/* Typography */
h1 {
  /*display: block;*/
  text-transform: uppercase;
  text-align: center;
  font-family: 'Teko';
  font-weight: 400;
  /*font-size: 3.5em;*/
  font-size: 2em;
  letter-spacing: 0.1em;
  /*line-height: 40px;*/
  line-height: 2em;
}
h2 {
	padding-top: 0.8em;
  font-family: 'Teko';
  /*font-family: 'Source Sans Pro', sans-serif;*/
  font-weight: 400;
  /*line-height: 40em;*/
  font-size: 1.8em;
}
h3 {
  font-family: 'Teko';
  /*font-family: 'Source Sans Pro', sans-serif;*/
  font-weight: 400;
  line-height: 1.8em;
  font-size: 1.8em;
}
p {
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 1.6em;
  line-height: 1.2em;
  padding-bottom: 0.5em;
}
a {
  color: #FFF;
  text-decoration: none;
}
/* Utilities */
.group:after {
  clear: both;
  content: " ";
  display: block;
  font-size: 0;
  height: 0;
  visibility: hidden;
}
/* Element Design rules */
header {
  /*position: fixed;
  width: 16%;
  min-width: 13em;
  height: 100%;
  left: 0;
  top: 0;
  padding-top: 2.5em;*/
  text-align: center;
}
#main_site_nav {
	position: fixed;
  width: 16%;
  min-width: 13em;
  height: 100%;
  left: 0;
  top: 0;
  padding-top: 2.5em;
}
nav {
}
.navItem {
  padding: 0.05em 0em;
}
header a:hover {
  display: block;
  /*color: #000;*/
  background-color: #333;
}

.navContainer {
  /*max-width: 220px;*/
  max-width: 16em;
  position: relative;
  float:right;
  margin: 2em;
}
#navLogo {
  max-width: 65%;
  max-height: 65%;
  margin-bottom: 5%;
  /*margin: auto;
  max-width: 20%;
  border-bottom: solid #fff 1px;
  padding-right: 40%;*/
}
/*#navLogo:hover {
  max-width: 70%;
  max-height: 70%;
  margin-bottom: 5%;
}*/
#down_arrow {
  fill: white;
}

ul {
  list-style:none;
  /*margin: 2.3em 0;*/
  /*border: solid #fff 1px;*/
}
li {
  font-family: 'Teko';
  font-weight: 400;
  font-size: 2em;
  line-height: 1em;
  letter-spacing: 0.1em;
  display: block;
  text-transform: uppercase;
  text-align: center;
  /*padding: 0.2em 0 0 0; */
  margin: 0.2em 0 0.1em 0;

}
main {
  /*background-color: #333;*/
  position: absolute;
  /*left: 220px;*/
  left: 16%;
  width: 74%;
  max-width: 1600px;
  /*height: 100%;*/
}
footer {
	padding-top: 3em;
}
footer a {
	text-decoration: underline;
}
article {
  margin: 2em;
  padding-bottom: 3em;
	padding-top: 1.5em;
  border-bottom: 1px solid #333;
}
article:last-child {
  border-bottom: 0px solid #000;
}
article header {
	position: relative;
	display: block;
  text-transform: uppercase;
  text-align: center;
  font-family: 'Teko';
  font-weight: 400;
  font-size: 2em;
  letter-spacing: 0.1em;
  line-height: 2em;
	/*padding-top: 0.5em;*/
	width: inherit;
	/*min-width: 13em;
	height: 100%;
	left: 0;
	top: 0;

	text-align: center;*/
}
textarea {
  /*width: 600px;*/
}
input[type:text] {
  width: 100%;
}
.sample_collection {
  text-align: center;
}
.sample_group_collection {
	background-color: #272727;
	margin-bottom: 2.5em;
	padding-bottom: 2.5em;
}
.sample {
  display: inline-block;
  width: 17em;
  /*height: 220px;*/
  margin: 5px 15px;
  /*border: 3px solid #73AD21;*/
  font-family: 'Teko';
}
/*.sample:hover ~ .sample h2{
  visibility: visible;
  opacity: 1;
}*/
.sample_subheader {
	display: inline-block;
}
.sample h2 {
  font-family: 'Teko';
  line-height: 1em;
  visibility: hidden;
  opacity: 0;
}
.sample_info {
  font-size: 2.1em;
  text-transform: capitalize;
  visibility: hidden;
  display: none;
}
.sample_type {
  margin: auto;
  font-size: 1em;
  width: 150px;
}
.sample img {
  max-width: 150px;
  cursor: pointer;
  border: 0.2em solid white;
  /*box-shadow: 7px 7px 5px #888888;*/
  margin-bottom: 3px;
}
.play_project {
	display: inline-block;
	max-width: 58em;
	margin: 5px 15px;
	margin-top: 35px;
}
.play_project img {
	  display: inline-block;
	  max-width: 25em;
	  margin: 5px 15px;
		cursor: pointer;
		border: 0.2em solid white;
}
.left_aligned_text {
	text-align: left;
}
#play_wrapper {
	display: block;
}
/*.sample img:active ~ .parent {
  visibility: visible;
  opacity: 1;
}*/

/* S A M P L  M O D A L  G E N E R A T E D  C O N T E N T  */
#dynamicSample {
	padding-top: 3.5em;
	display: block;
	text-align: center;
	background-color: #181818;
}
#dynamicSample header  {
	padding-top: 0;
	position: relative;
	display: block;
	width: 100%;
	/*border: 1px solid green;*/
}
#dynamicSample .sample_main_header h2 {
	font-size: 3em;
	padding-top: 0.2em;
}
#dynamicSample .article_sample_iframe {
	display: inline-block;
	margin-top: 3em;
	margin-left: 0;
	margin-right: 0;
	padding: 0;
	border-bottom: 0;
}
#dynamicSample .article_sample_slides p {
			line-height: 120%;
		}

#dynamicSample .sample_top_text{
	margin: 0 auto;
	width: 100%;
	padding-bottom: 0.1em;
	text-align: left;
}
#dynamicSample .article_sample_slides {

	border-bottom: none;
	margin-left: 0;
	margin-right: 0;
	margin-bottom: 0;
	padding-bottom: 0;
}

#dynamicSample .article_sample_slides p {
	line-height: 120%;
}

#dynamicSample figcaption {
	text-align: center;
	font-size: 1.2em;
}
#dynamicSample .slides_figcaption {
	text-align: left;
}
#dynamicSample figcaption a {
	text-decoration: underline;
}
#dynamicSample aside {
	display: block;
	margin-top: 3em;
	vertical-align: top;
}
#dynamicSample aside p a {
	/*text-align: left;*/
	text-decoration: underline;
}
#dynamicSample .figureWrapper {
	display: block;
}
#unit_iFrame {}
#slide_content {
	/*min-height: 100%;
	min-width: 100%;*/
}

#dynamicSample .sample_slides_points {
		font-family: 'Source Sans Pro', sans-serif;
		text-transform: none;
		font-weight: 400;
		font-size: 1.4em;
		line-height: 1em;
		letter-spacing: 0em;
		display: block;
		text-align: center;
		/*padding: 0.2em 0 0 0; */
		margin: 0.5em 1em;
	}
#dynamicSample .slide_nav {
		padding-top: 1em;
		font-size: 1.6em;
		line-height: 120%;
	}
	#dynamicSample .slide_nav p {
		font-size: 1.6em;
	}
	#slide_image {}

/*   E N D   O F    S A M P L  M O D A L  G E N E R A T E D  C O N T E N T  */



.contact_content {
  margin: auto;
}
.horizontalWrapper {
  /*float: left;*/
  display: inline-block;
  margin: 3em;
  vertical-align: middle;
}
.contact_content li {

  font-family: 'Source Sans Pro', sans-serif;
  font-size: 1.6em;
  line-height: 1em;
  /*padding-bottom: 0.5em;*/

  /*font-weight: 400;*/
  line-height: 1em;
  letter-spacing: 0.1em;
  display: block;
  text-transform: none;
  text-align: center;
  /*padding: 0.2em 0 0 0;*/
  margin: 0.2em auto 0.1em auto;

}
.contact {
  text-align: center;
}
.contact_block {
  margin: 0 auto 0 auto;
  max-width: 450px;
}
.contact_top {
}
/*#game_iframe_wrapper {
	position: relative;
	width: 100%;
	height: 0;
	padding-bottom: 51%;
}
#game_iframe_wrapper game_iframe{
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}*/
#game_iframe{
	width: 100%;

}

#sender_email {
  float: left;
  width: 45%;
}
#message_subject {
  float: right;
  width: 45%;
}
#message_text {
  width: 100%;
}
#contact_button {
  float: right;
}
#modal {
  position: fixed;
  background-color: #181818;
  color: white;
  width: 100%;
  height: 100%;
  visibility: hidden;
  opacity: 0;
  z-index: 500;
}
#adBlockerAlert {
  margin-top: 3em;
  text-align: center;
  font-size: 1.3em;
  line-height: 0em;
  z-index: 511;
}
#adBlockerAlert h3 {
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 3em;
  line-height: 1.2em;
}

#modal_close {
  position: absolute;
  font-size: 3em;
  font-family: 'Teko';
  font-weight: 800;
  /*background: url(../img/modal_close.png) no-repeat;*/
  right: 0px;
  top: 0px;
  margin: 0.7em;
  /*width: 50px;
  height: 50px;*/
  cursor: pointer;
  /*visibility: visible;*/
  /*opacity: 1;*/
  z-index: 1510;
}
#modal_content {
  /*position: static;
  width: 300px;
  height: 250px;*/
  /*background-color: white;*/
  position: relative;

  margin: auto;
  /*vertical-align: 10%;*/
  top: 0%;
  /*left: 50%;*/
  z-index: 520;
}

#base_button {
  margin-top: 1.2em;
  width: 4em;
  padding: 0.4em 1em;
  font-size: 1.6em;
  background: #111;
  color: #fff;
  border: 1px solid #333;
  border-radius: 4px;
  text-decoration: none;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
  -webkit-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  user-select:none;
  cursor: pointer;
}

#base_button:hover {
  background: #222;
  border: 1px solid #444;
  text-decoration: none;
}

#base_button:active {
  border: 1px solid #333;
  -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.2);
  background: #333;
}
#mapWrapper {
	height:13em;
	width:20em;
	max-width:100%;
	list-style:none;
	transition:	none;
	overflow:hidden;
}
#iframe_viewSample {
	border: 0;
	background-color: #000;
}

/*  M E D I A   Q U E R I E S  */
@media only screen and (max-width: 451px) {
	li {
	  font-family: 'Teko';
	  font-weight: 400;
	  font-size: 2em;

	  line-height: 1em;
	  letter-spacing: 0.1em;
	  display: block;
	  text-transform: uppercase;
	  margin: 0.2em 2em 0.1em 2em;
	}
	nav {
		display: inline;
		text-align: center;
	}
	#navLogo {
		display: inline;
		text-align: left;
		max-width: 25%;
		max-height: auto;
		margin-bottom: 1em;
	}
}

@media only screen
  and (min-device-width: 375px)
  and (max-device-width: 667px)
  and (-webkit-min-device-pixel-ratio: 2) {


		h1 {
		  font-size: 6em;
		  letter-spacing: 0.2em;
		  line-height: 2em;
		}
		h2 {
			padding-top: 0.8em;
		  font-weight: 400;
		  font-size: 5em;
		}
		p {
		  font-family: 'Source Sans Pro', sans-serif;
		  font-size: 4em;
		  line-height: 115%;
		  padding-bottom: 1em;
		}
		.sample img {
			max-width: 30em;
			cursor: pointer;
			border: 0.2em solid white;
			/*box-shadow: 7px 7px 5px #888888;*/
			margin-bottom: 0.2em;
		}
		.sample {
		  display: inline-block;
		  width: 30em;
		  /*height: 220px;*/
		  margin: 0.5em 3em;
		  /*border: 3px solid #73AD21;*/
		  font-family: 'Teko';
		}


		li {
			font-family: 'Teko';
			font-weight: 400;
			font-size: 4em;
			line-height: 1em;
			letter-spacing: 0.1em;
			display: inline-block;
			text-transform: uppercase;
			margin: 0.4em 2% 0.2em 2%;
		}

		#main_site_nav {
			position: relative;
			width: 100%;
			min-width: 13em;
			left: 0;
			top: 0;
			padding-top: 1em;
			text-align: center;
		}
		.navContainer {
			/*max-width: 220px;*/
			max-width: 100%;
			position: relative;
			display: block;
			margin: 0 auto;
			float:none;
			/*margin: 2em;*/
		}
		#navLogo {
			display: inline;
			text-align: left;
			max-width: 10%;
			max-height: 10%;
			margin-bottom: 2em;
		}
		nav {
			display: inline;
			text-align: center;
		}

		main {
			position: absolute;
			left: 0;
			width: 100%;
			max-width: 1600px;
		}
		.contact_content li {
		  font-family: 'Source Sans Pro', sans-serif;
		  font-size: 4em;
		  line-height: 1em;
		  line-height: 1em;
		  letter-spacing: 0.1em;
		  display: block;
		  text-transform: none;
		  text-align: center;
		  margin: 0.2em auto 0.1em auto;
		}
		#base_button {
		  margin-top: 1.2em;
		  width: 8em;
		  padding: 0.4em 1em;
		  font-size: 3.5em;
		  background: #111;
		  color: #fff;
		  border: 1px solid #333;
		  border-radius: 4px;
		  text-decoration: none;
		  text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
		  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
		  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
		  -webkit-user-select:none;
		  -moz-user-select:none;
		  -ms-user-select:none;
		  user-select:none;
		  cursor: pointer;
		}
		#mapWrapper {
			height:39em;
			width:60em;
			max-width:100%;
			list-style:none;
			transition:none;
			overflow:hidden;
		}

}
@media screen and (max-width: 690px) {
	li {
	  font-family: 'Teko';
	  font-weight: 400;
	  font-size: 2em;
	  line-height: 1em;
	  letter-spacing: 0.1em;
	  display: inline-block;
	  text-transform: uppercase;
	  margin: 0.2em 2% 0.1em 2%;
	}

	#main_site_nav {
	  position: relative;
	  width: 100%;
	  min-width: 13em;
	  left: 0;
	  top: 0;
	  padding-top: 1em;
	  text-align: center;
	}
	.navContainer {
	  /*max-width: 220px;*/
	  max-width: 100%;
	  position: relative;
		display: block;
		margin: 0 auto;
	  float:none;
	  /*margin: 2em;*/
	}
	#navLogo {
		display: inline;
		text-align: left;
	  max-width: 10%;
	  max-height: 10%;
	  margin-bottom: 2em;
	}
	nav {
		display: inline;
		text-align: center;
	}

	main {
	  /*background-color: #333;*/
	  position: absolute;
	  /*left: 220px;*/
	  left: 0;
	  width: 100%;
	  max-width: 1600px;
	  /*height: 100%;*/
	}


}