/* SCENE 4 ANIMATIONS */

@-webkit-keyframes TelescopeRise {
	 0% {
	   margin-top: 250px;
	 }
	 75% {
	   margin-top: 250px;
	 }
	 100% {
	  margin-top: 0px;
	 }
}

@-webkit-keyframes PlatformSink {
	 0% {
	   margin-top: 0px;
	 }
	 60% {
	   margin-top: 0px;
	 }
	 75% {
	  margin-top: 200px;
	 }
	 100% {
	  margin-top: 200px;
	 }
}


/* SCENE 4 DIVs */

#ScreenOne {
	position: absolute;
	left: 0px;
	top: 0px;
	padding: 0px;
	z-index: 101;
	height: 475px;
	width: 1024px;
	visibility: visible;
	-webkit-animation-name: FadeInDelay;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-duration: 5s;
	background-image: url(../../content/sc4-observatory/sc4-screen1.png);
}

#Stage {
	position: absolute;
	left: 0px;
	top: 475px;
	padding: 0px;
	z-index: 300;
	height: 275px;
	width: 1024px;
	visibility: visible;
	-webkit-animation-name: FadeIn;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-duration: 3s;
	background-image: url(../../content/sc4-observatory/sc4-stage1.png);
}

#screen-slider {
	position: absolute;
	left: 268px;
	top: 60px;
	padding-bottom: 5px;
	z-index: 199;
	width: 500px;
	height: 300px;
	visibility: visible;
	overflow: hidden;
	-webkit-animation-name: FadeInDelay;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-duration: 25s;
}


/* Sceme4 Link DIVs and Classes */

#setRockWall {
	position: absolute;
	left: 163px;
	top: 340px;
	padding: 0px;
	z-index: 320;
	width: 700px;
	height: 225px;
	visibility: visible;
	-webkit-animation-name: FadeInDelay;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-duration: 5s;
	background-image: url(../../content/sc4-observatory/sc4-set-rock-wall@x2.png);
	background-size: 700px 225px;
}

#setLeftTree {
	position: absolute;
	left: 48px;
	top: 165px;
	padding: 0px;
	z-index: 321;
	width: 175px;
	height: 425px;
	visibility: visible;
	-webkit-animation-name: FadeInDelay;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-duration: 5s;
	background-image: url(../../content/global/blue-tree-md@x2.png);
	background-size: 175px 425px;
}

#setRightTree {
	position: absolute;
	left: 785px;
	top: 70px;
	padding: 0px;
	z-index: 322;
	width: 215px;
	height: 525px;
	visibility: visible;
	-webkit-animation-name: FadeInDelay;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-duration: 5s;
	background-image: url(../../content/global/blue-tree-lg@x2.png);
	background-size: 215px 525px;
}

#setRocksMiddle {
	position: absolute;
	left: 107px;
	top: 453px;
	padding: 0px;
	z-index: 323;
	width: 750px;
	height: 225px;
	visibility: visible;
	-webkit-animation-name: FadeInDelay;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-duration: 5s;
	background-image: url(../../content/sc4-observatory/sc4-set-rocks-middle@x2.png);
	background-size: 750px 225px;
}

#setTorch {
	position: absolute;
	left: 220px;
	top: 375px;
	padding: 0px;
	z-index: 325;
	width: 70px;
	height: 180px;
	visibility: visible;
	-webkit-animation-name: FadeIn;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-duration: 3s;
	background-image: url(../../content/global/torch@x2.png);
	background-size: 70px 180px;
}

#setFire {
	position: absolute;
	left: 243px;
	top: 337px;
	padding: 0px;
	z-index: 326;
	width: 24px;
	height: 40px;
	visibility: visible;
	background-image: url(../../content/global/fire-b.gif);
	background-size: 24px 40px;
}

#setFireGlow {
	position: absolute;
	left: 238px;
	top: 333px;
	padding: 0px;
	z-index: 327;
	width: 35px;
	height: 50px;
	visibility: visible;
	-webkit-animation-name: FadeIn;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-duration: 3s;
	background-image: url(../../content/global/fire-glow-b.png);
	background-size: 35px 50px;
	opacity: 0.7;
}

#setPlatform {
	position: absolute;
	left: 170px;
	top: 508px;
	padding: 0px;
	z-index: 330;
	width: 600px;
	height: 150px;
	visibility: visible;
	-webkit-animation-name: FadeInDelay;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-duration: 5s;
	background-image: url(../../content/sc4-observatory/sc4-set-platform@x2.png);
	background-size: 600px 150px;
}

#setPlatformCover {
	position: absolute;
	left: 413px;
	top: 533px;
	padding: 0px;
	z-index: 331;
	width: 210px;
	height: 40px;
	visibility: visible;
	-webkit-animation-name: FadeInDelay;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-duration: 5s;
	-webkit-mask-box-image: url(../../content/sc4-observatory/sc4-set-platform-mask.png);
}

.PlatformCover {
	position: absolute;
	width: 210px;
	height: 40px;
	margin-top: -40px;
	-webkit-animation-name: PlatformSink;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-duration: 18s;
	/*-moz-animation-name: PlatformSink;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-iteration-count: 1;
	-moz-animation-duration: 18s;*/
	background-image: url(../../content/sc4-observatory/sc4-set-platform-cover.png);
}

#setTelescope {
	position: absolute;
	left: 405px;
	top: 330px;
	padding: 0px;
	z-index: 332;
	width: 225px;
	height: 250px;
	visibility: visible;
	-webkit-mask-box-image: url(../../content/sc4-observatory/sc4-set-telescope-mask.png);
}

.TelescopeRise {
	position: absolute;
	width: 225px;
	height: 250px;
	-webkit-animation-name: TelescopeRise;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-duration: 17s;
	/*-moz-animation-name: TelescopeRise;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-iteration-count: 1;
	-moz-animation-duration: 17s;*/
	background-image: url(../../content/sc4-observatory/sc4-set-telescope@x2.png);
	background-size: 225px 250px;
}

#setFlower1 {
	position: absolute;
	left: 750px;
	top: 490px;
	z-index: 335;
	width: 50px;
	height: 100px;
	overflow: hidden;
}

#setFlower2 {
	position: absolute;
	left: 807px;
	top: 530px;
	z-index: 336;
	width: 50px;
	height: 100px;
	overflow: hidden;
}


/* BODY-Observations Styles */


.observations {
	margin-top: 200px;
}

@media (max-width: 900px) {
  .observations {
    text-align: center;
    margin-top: 15px;
  }
}


/* Content Slider Styles */

.contentSlider {
  width: 100%;
}

.contentSlider,
.contentSlider .rsOverflow,
.contentSlider .rsSlide,
.contentSlider .rsVideoFrameHolder,
.contentSlider .rsThumbs {
  background-color: rgba(255,255,255,0);
  color: #FFF;
}

.contentSlider .rsSlide,
.contentSlider .rsOverflow {
  background-color: rgba(255,255,255,0);
}

.contentSlider img {
  max-width: 100%;
  height: auto;
  display: block;
}

.content-slider-bg {
  width: 86%;
  padding: 24px 7%;
}

.rsDefault .rsBullets {
	position: absolute;
	z-index: 35;
	left: 0;
	bottom: 0;
	width: 100%;
	height: auto;
	margin: 0 auto; 

	background: #000;
	background: rgba(255,255,255,0);

	text-align: center;
	line-height: 8px;
	overflow: visible;
}
.rsDefault .rsBullet {
	width: 8px;
	height: 8px;
	display: inline-block;
	*display:inline; 
	*zoom:1;
	padding: 6px 5px 6px;
}
.rsDefault .rsBullet span {
	display: block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #777;
	background: rgba(0,0,0,0.25);
}
.rsDefault .rsBullet.rsNavSelected span {
	background: rgba(0,0,0,0.7);
}


/* YOU ARE HERE */

#you-are-here {
	position: absolute;
	left: 157px;
	top: 123px;
	width: 115px;
	height: 115px;
	z-index: 603;
}
