a {
  color:white;
  text-decoration:none;
  margin:0;
  padding:0;
  font-size:100%;
  vertical-align:top;
  background:transparent;
}

body {
  margin: 0;
  background: #151515;
  font-family: Oswald;
  text-transform: uppercase;
}

.container {
  margin: 0 auto;
}

/* wrapper */
.wrap {
	position: relative;
	margin: 10px 0;
}

/* Frame */
.frame {
	height: 600px;
	line-height: 600px;
	overflow: hidden;
}
.frame ul {
	list-style: none;
	margin: 0;
	padding: 0;
	height: 100%;
	font-size: 50px;
}
.frame ul li {
	float: left;
	width: 227px;
	height: 100%;
	margin: 0 1px 0 0;
	padding: 0;
	background: #333;
	color: #ddd;
	text-align: center;
}
.frame ul li.active {
	color: #fff;
	background: #a03232;
}

/* Scrollbar */
.scrollbar {
	margin: 0 0 1em 0;
	height: 2px;
	background: #ccc;
	line-height: 0;
}
.scrollbar .handle {
	width: 100px;
	height: 100%;
	background: #292a33;
}
.scrollbar .handle .mousearea {
	position: absolute;
	top: -9px;
	left: 0;
	width: 100%;
	height: 20px;
}


/* Controls */
.controls { margin: 25px 0; text-align: center; }

/* One Item Per Frame example*/
.oneperframe { height: 600px; line-height: 600px; }
.oneperframe ul li { width: 900px; }
.oneperframe ul li.active { background: #151515; }

/*
 * Experimental
 *
 *
 */

.text-overlay {
	position: absolute;
	color: white;
}

.arrow {
	top: 300px;
	left: 600px;		
  height:40px;
  width:240px;
  padding:15px;
  font-size:27px;
}

.move-on {
  top: 300px;
  left: 50px;   
  height:40px;
  width:240px;
  padding:15px;
  font-size:27px;
}

.footer {
  font-size:16px;
  top: 530px;
  left: 30px;   
  height:25px;
  width:260px;
}

.footer img {
  padding-left: 5px;
}

.progress {
  font-size:16px;
  top: 40px;
  left: 660px;   
  height:25px;
  width:180px;
}

.elem {
  position:absolute;
  background-color:black;
  color: white;
  text-align: center;
  padding:10px;
  z-index:9000;
  opacity:0.7;
  border: 1px solid #888;
  opacity: 0.6;
  text-align: center;
  vertical-align: top;
}

.elem:hover {
  background-color: #111;
  cursor: pointer;
}

#absolute-overlay {
  display: none;
  top: 10px;

  /* center */
  left:0;
  right:0;
  margin-left:auto;
  margin-right:auto;



  width: 900px;
  height: 600px;
  position: absolute;
  z-index: 1000;
}

#final-timelapse {
  width: 100% !important;
  height: auto !important;
  overflow:hidden;
}


/*
From OSPB

*/

/* Sets the page width */
.pagespan { width: 900px; }

.clearfix:before,
.clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }



#final-overlay {
  top: 30%;

  /* center */
  left:0;
  right:0;
  margin-left:auto;
  margin-right:auto;


  background-color:black;
  color: white;
  text-align: center;
  padding:40px;
  width: 30rem;

  border: 1px solid #888;
  opacity: 0.6;
  position: absolute;
  z-index:9000;
}