@font-face {
    font-family: 'bebasregular';
    src: url('fonts/BEBAS___-webfont.eot');
    src: url('fonts/BEBAS___-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/BEBAS___-webfont.woff') format('woff'),
         url('fonts/BEBAS___-webfont.ttf') format('truetype'),
         url('fonts/BEBAS___-webfont.svg#bebasregular') format('svg');
    font-weight: normal;
    font-style: normal;
}



html, body {
	height: 100%;
	width: 100%;
}

.leftMenu {
	float: left;
	display: inline-block;
	width: 300px; /* must match .filmstrip width! */
	height: 100%;
	left: 0; /* FF hack */
	color: #EEE;
	z-index: 1000;
	position: fixed;
	font-family: 'Economica', sans-serif;

	/* IE9 SVG, needs conditional override of 'filter' to 'none' */
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjYiLz4KICAgIDxzdG9wIG9mZnNldD0iOTUlIiBzdG9wLWNvbG9yPSIjMDAwMDAwIiBzdG9wLW9wYWNpdHk9IjAuNiIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjMDAwMDAwIiBzdG9wLW9wYWNpdHk9IjAiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
	background: -moz-linear-gradient(left,  rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.6) 95%, rgba(0,0,0,0) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0.6)), color-stop(95%,rgba(0,0,0,0.6)), color-stop(100%,rgba(0,0,0,0))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  rgba(0,0,0,0.6) 0%,rgba(0,0,0,0.6) 95%,rgba(0,0,0,0) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  rgba(0,0,0,0.6) 0%,rgba(0,0,0,0.6) 95%,rgba(0,0,0,0) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  rgba(0,0,0,0.6) 0%,rgba(0,0,0,0.6) 95%,rgba(0,0,0,0) 100%); /* IE10+ */
	background: linear-gradient(to right,  rgba(0,0,0,0.6) 0%,rgba(0,0,0,0.6) 95%,rgba(0,0,0,0) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#99000000', endColorstr='#00000000',GradientType=1 ); /* IE6-8 */
}

.leftMenu h1, h2, h3 {
	font-family: 'bebasregular', sans-serif;
	text-align: center;
	font-weight: 500;
}

.leftMenu h1 {
	font-size: 2.3em;
}

.leftMenu h2 {
	font-size: 1.05em;
	visibility: hidden;
}

.leftMenu h3 {
	position: relative;
	top: -24px;
	font-size: 1.0em;
}

.leftMenu a {
	color: #EEE;
}

.leftMenu hr {
	width: 80%;
	margin: 0 auto;
}

.leftMenu ul {

}

.leftMenu li {
	list-style: none;
}

.leftMenuBottom {
	text-align: center;
	width: 100%;
	margin: 0 auto;
	position: absolute;
	bottom: 1em;
}

.leftMenuBottom a {
	font-family: 'bebasregular', sans-serif;
	text-align: center;
	font-size: 2.0em;
	text-decoration: none;
}


#rhonda {
	display: block;
	width: 128px;
	height: 128px;
	border-radius: 	50%;
	background-image: url("../img/rhonda.jpg");
	background-size: 440px;
	background-position: -152px -16px;
	margin: 0 auto;
}

.rightFade{
	width: 200px;
	height: 100%;
	position: fixed;
	right: 0;
	
	/* IE9 SVG, needs conditional override of 'filter' to 'none' */
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC42NSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(left,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.65) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.65))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* IE10+ */
	background: linear-gradient(to right,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=1 ); /* IE6-8 */

	z-index: 1000;
}

.filmstrip {
	height: 100%;
	width: auto;			/* Must use auto width to shrink-wrap filmstrip to images size */
	white-space: nowrap;	/* Must nowrap white-space so that images are not bumped to the next horizontal line */
	float: left;			/* Must float to the left to allow the background-color to expand all width(auto), otherwise it is limited to the width of initial viewport */
	position: relative;
	padding-left: 300px;     /* Must match .leftMenu width */
	background-color: #1F1F1F; /* Initial background color; not def in JS */
}

.picturecontainer {
	display: inline-block;
	position: relative;
	top: 5%;
	height: 90%;
	margin: 0 75px;
}

.picturecontainer img {
	height: 100%;
	max-height: 1200px;
	border: 0px solid #222222;
	
	transition: 0.25s;
	-webkit-box-shadow: 0 0 30px 0 rgba(00,00,00,0.6);
	box-shadow: 0 0 30px 0 rgba(00,00,00,0.6);
}

.debugImg {
	display: inline-block;
	position: relative;
	height: 90%;
	top: 5%;
	max-height: 1200px;
	border: 0px solid #222222;
	margin: 0 75px;
	-webkit-box-shadow: 0 0 30px 0 rgba(00,00,00,0.6);
	box-shadow: 0 0 30px 0 rgba(00,00,00,0.6);
}

.picturecontainer img:hover {
	top: -10px;
	transition: 0.25s;
}

.trigger {
	display: inline-block;
}

.ScrollSceneIndicators {
	z-index: 1000;
}