@charset "utf-8";
body { background:#000; font-family: 'Open Sans', sans-serif; font-weight:normal; font-weight:400; color:#a4c2de; font-size:11px; line-height:17px; }
html, body { margin: 0; padding: 0; border: 0; height: 100%; overflow: hidden; }
a.navigation { color:#7fa4c6 !important; font-family: 'Audiowide', cursive; font-weight:normal; font-size:14px; text-decoration:none; text-transform:uppercase; position:absolute; z-index:805; top:0; left:0; }
a.navigation.hover { color:#a4c2de !important; }
#container { width:100%; height:100%; position:relative; overflow:hidden; }
#surface { width:5000px; height:238px; position:absolute; z-index:990; left:0; bottom:14%; background:url(../img/surface.png) repeat-x 0 55px; }
#surfaceLeft { width:1155px; height:238px; position:absolute; z-index:991; left:0; top:0; background:url(../img/surface-left.png) no-repeat left top; }
#surfaceMid { width:5000px; height:140px; position:absolute; z-index:992; left:0; top:62px; background:url(../img/surface-middle.png) repeat-x top left; }
#surfaceFront { width:5000px; height:100px; position:absolute; z-index:994; left:0; top:183px; background:#000 url(../img/surface-front.jpg) repeat-x top left; }
#underGround { width:5000px; height:3000px; position:absolute; z-index:993; left:0; top:190px; background:#000 url(../img/underground.jpg) repeat top left; }
#starScreenBox { opacity:1; width:100%; height:100%; position:absolute; overflow:hidden; top:0; left:0; z-index:996; background:#000; }
#starScreen { width:300%; height:300%; position:absolute; top:-100%; left:-100%; z-index:997; }
#loadBox { position:absolute; width:100%; height:31px; z-index:998; text-align:center; top:50%; left:0; }
#load { margin:0 auto; }
#starSm { width:100%; height:100%; position:absolute; background:#000 url(../img/star-bg2.jpg) repeat top left; top:0; left:0; z-index:3; }
#starMed { opacity:0.6; width:100%; height:100%; position:absolute; background:url(../img/stars-med.jpg) no-repeat top left; top:0; left:0; z-index:4; }
#starMed.win { opacity:0.6; }
.starClusterBlue { opacity:0.3; width:690px; height:741px; position:absolute; background:url(../img/star-cluster1.png) no-repeat top center; top:0; left:0; z-index:50; }
.starClusterBlue.win { opacity:0.2; }
.nebula { opacity:0.3; width:1995px; height:1750px; position:absolute; background:url(../img/nebula.png) no-repeat top center; top:0; left:0; z-index:10; }
.nebula.win { opacity:0.2; }
.largeStar { width:14px; height:14px; position:absolute; top:0; left:0; z-index:150; }
.smallPlanet { width:40px; height:40px; position:absolute; top:0; left:0; z-index:150; }
#planet { overflow:hidden; position:absolute; top:65px; left:-455px; z-index:501; width:1280px; height:1279px; -moz-border-radius:50%; -webkit-border-radius:50%; -o-border-radius:50%; border-radius:50%; background:url(../img/planet.jpg) no-repeat center top; }
#planetBox { position:absolute; z-index:500; bottom:-1px; left:-1px; width:890px; height:311px; }
#planetShadow { position:absolute; bottom:0; left:0; z-index:502; width:890px; height:311px; background:url(../img/planet-shadow2.png) no-repeat center top; }
#bottomShadow { width:150%; height:50px; position:absolute; z-index:650; bottom:-50px; left:0; -moz-box-shadow: 0 -20px 130px 70px #000000; -ms-box-shadow: 0 -20px 130px 70px #000000; -o-box-shadow: 0 -20px 130px 70px #000000; -webkit-box-shadow: 0 -20px 130px 70px #000000; box-shadow: 0 -20px 130px 70px #000000; }
#shootingStar { opacity:0; background:url(../img/shootingstar.png) no-repeat top left; width:145px; height:43px; z-index:450; position:absolute; top:-200px; left:-200px; opacity:0; }
#viewbox { width:120%; height:120%; position:absolute; }
#moonOne { width:40px; height:40px; position:absolute; z-index:503; bottom:-100px; left:200px; }
#loginContainer { position:absolute; z-index:999; width:100%; height:315px; top:-315px; left:0; text-align:center; }
#login { background:url(../img/login.png) no-repeat top center; opacity:.8; width:539px; height:315px; margin:0 auto; text-align:left; }
#const1 { width:300px; height:300px; position:absolute; z-index:995; top:10%; left:550px; background:url(../img/const-1.png) no-repeat top left; cursor:pointer; display:block; }
#const1 img { display:none; }
#const1 a { top:130px; left:160px; }
.const { display:none; }
#pages { position:absolute; width:100%; text-align:center; z-index:1000; top:-2500px; left:0; }
#pages .page { padding-bottom:40px; }
.close { position:absolute; z-index:1000; top:15px; right:50px; color:#357aba; cursor:pointer; font-family: 'Audiowide', cursive; font-weight:normal; font-size:20px; padding-right:35px; background:url(../img/close.png) right top no-repeat; height:25px; text-transform:uppercase; padding-top:7px; }
.left { float:left; }
.right { float:right; }
.scroll-pane { overflow:hidden; height:400px; }
#resume { width:730px; padding:25px 115px 0 115px;; margin:0 auto; text-align:left; overflow:hidden; }
#resume .left { width:342px; }
#resume .right { width:342px; }
#pages h1 { font-family: 'Audiowide', cursive; font-weight:normal; text-transform:uppercase; color:#357aba; font-size:56px; line-height:56px; margin:0 0 5px 0; padding:0; -moz-text-shadow:0 3px 7px #000; -o-text-shadow:0 3px 7px #000; -webkit-text-shadow:0 3px 7px #000; -ms-text-shadow:0 3px 7px #000; text-shadow:0 3px 7px #000; }
#pages h2 { font-family: 'Audiowide', cursive; font-weight:normal; text-transform:uppercase; color:#2f6496; font-size:15px; line-height:21px; margin:0; padding:0 0 20px 0; -moz-text-shadow:0 3px 7px #000; -o-text-shadow:0 3px 7px #000; -webkit-text-shadow:0 3px 7px #000; -ms-text-shadow:0 3px 7px #000; text-shadow:0 3px 7px #000; }
#pages h3 { clear:both; font-family: 'Open Sans', sans-serif; font-weight:bold; font-weight:700; text-transform:uppercase; color:#7c64a2; font-size:22px; line-height:22px; margin:0; padding:30px 0 10px 0; background:url(../img/h3-hr-bg.png) 0 15px repeat-x; }
#pages h3.contact { background:none; margin:0; padding:3px 0 10px 0; }
#pages h3.contact span { display:block; font-size:16px; }
#pages h3.contact .email { color:#357aba; padding-bottom:3px; }
#pages h3.contact .phone { color:#357aba; padding-bottom:5px; }
#pages h3.contact .location { color:#7c64a2; padding-bottom:22px; }
#pages ul { padding-left:30px; margin:0 0 15px 0; }
#pages ul li { margin-bottom:5px; -moz-text-shadow:0 3px 7px #000; -o-text-shadow:0 3px 7px #000; -webkit-text-shadow:0 3px 7px #000; -ms-text-shadow:0 3px 7px #000; text-shadow:0 3px 7px #000;  }
#pages ul.rating { padding:10px 0 0 0; list-style:none; }
#pages ul.rating li { font-family: 'Open Sans Condensed', sans-serif; font-weight:bold; color:#6c6184; font-size:20px; text-align:right; margin-bottom:10px; padding-right:25px; }
.rateBox { float:right; padding-right:8px; width:17px; height:17px; background:url(../img/rating-bg.png) 0 0 repeat-x; }
.rateBox.first { margin-left:10px; background-position: 9px 0; background-repeat: no-repeat; }
.rateBox.last { background-position: -9px 0; background-repeat: no-repeat; padding-right: 0; }
.rateOn { width:17px; height:17px; display:block; background:url(../img/rating-lg.png) 0 0 no-repeat; }
.rateOff { width:17px; height:17px; display:block; background:url(../img/rating-sm.png) 0 0 no-repeat }
#pages .spanColored li { color:#377fc2; font-size:9px; }
#pages .spanColored li span { color:#a4c2de; font-size:11px; }
#pages p { margin:0; padding:0 0 15px 0; }
.dark { color:#7fa4c6; }
#pages p.dark, #pages span.dark { display:block; }
#pages p em { color:#6f94b6; font-size:10px; font-style:italic; -moz-text-shadow:0 3px 3px #000; -o-text-shadow:0 3px 3px #000; -webkit-text-shadow:0 3px 3px #000; -ms-text-shadow:0 3px 3px #000; text-shadow:0 3px 3px #000; }
#pages h4 { margin:0; padding:0; font-weight:normal; font-weight:600; font-size:12px; color:#a4c2de; -moz-text-shadow:0 3px 3px #000; -o-text-shadow:0 3px 3px #000; -webkit-text-shadow:0 3px 3px #000; -ms-text-shadow:0 3px 3px #000; text-shadow:0 3px 3px #000; }
#resume h4 { padding-left:30px; }
#resume p { padding-left:30px; }
#resume #work h4 { padding-left:0; }
#resume #work p { padding-left:0; }
#pages .social { padding:15px 0 0 0; list-style:none; }
#pages .social li { float:left; width:85px; padding-left:55px; height:33px; padding-top:7px; }
.linkedIn { background:url(../img/linkedIn.png) 4px 0 no-repeat; }
.treehouse { background:url(../img/treehouse.png) 3px 0 no-repeat; }
.deviantART { background:url(../img/deviantart.png) 0 3px no-repeat; }
.twitter { background:url(../img/twitter.png) 0 0 no-repeat; }
.google { background:url(../img/googleplus.png) 9px 0 no-repeat; }
.facebook { background:url(../img/facebook.png) 13px 0 no-repeat; }
a:link, a:visited, a:active { color:#a4c2de; }
a:hover { color:#7fa4c6; }
.clear { clear:both; }
.brands { padding-left:25px; }
/* ANIMATIONS */
@-moz-keyframes rotate360 {
  from {
	-moz-transform: rotate(0deg);
  }
  to {
	-moz-transform: rotate(359deg);
  }
}
@-webkit-keyframes rotate360 {
  from {
	-webkit-transform: rotate(0deg);
  }
  to {
	-webkit-transform: rotate(359deg);
  }
}
@-o-keyframes rotate360 {
  from {
	-o-transform: rotate(0deg);
  }
  to {
	-o-transform: rotate(359deg);
  }
}
@-ms-keyframes rotate360 {
  from {
	-ms-transform: rotate(0deg);
  }
  to {
	-ms-transform: rotate(359deg);
  }
}
@keyframes rotate360 {
  from {
	transform:rotate(0deg);
  }
  to {
	transform:rotate(359deg);
  }
}
@-moz-keyframes rotateBack360 {
  from {
	-moz-transform: rotate(0deg);
  }
  to {
	-moz-transform: rotate(-359deg);
  }
}
@-webkit-keyframes rotateBack360 {
  from {
	-webkit-transform: rotate(0deg);
  }
  to {
	-webkit-transform: rotate(-359deg);
  }
}
@-o-keyframes rotateBack360 {
  from {
	-o-transform: rotate(0deg);
  }
  to {
	-o-transform: rotate(-359deg);
  }
}
@-ms-keyframes rotateBack360 {
  from {
	-ms-transform: rotate(0deg);
  }
  to {
	-ms-transform: rotate(-359deg);
  }
}
@keyframes rotateBack360 {
  from {
	transform:rotate(0deg);
  }
  to {
	transform:rotate(-359deg);
  }
}
#planet.rotate {
	-moz-animation: rotate360 600s infinite linear;
	-webkit-animation: rotate360 600s infinite linear;
	-o-animation: rotate360 600s infinite linear;
	-ms-animation: rotate360 600s infinite linear;
	animation: rotate360 600s infinite linear;
}
@-moz-keyframes starfade {
	0% {
		opacity: .3;
	}
	20% {
		opacity: .6;
	}
	50% {
		opacity: .6;
	}
	70% {
		opacity: .3;
	}
	100% {
		opacity: .3;
	}
}
@-webkit-keyframes starfade {
	0% {
		opacity: .3;
	}
	20% {
		opacity: .6;
	}
	50% {
		opacity: .6;
	}
	70% {
		opacity: .3;
	}
	100% {
		opacity: .3;
	}
}
@-o-keyframes starfade {
	0% {
		opacity: .3;
	}
	20% {
		opacity: .6;
	}
	50% {
		opacity: .6;
	}
	70% {
		opacity: .3;
	}
	100% {
		opacity: .3;
	}
}
@-ms-keyframes starfade {
	0% {
		opacity: .3;
	}
	20% {
		opacity: .6;
	}
	50% {
		opacity: .6;
	}
	70% {
		opacity: .3;
	}
	100% {
		opacity: .3;
	}
}
@keyframes starfade {
	0% {
		opacity: .3;
	}
	20% {
		opacity: .6;
	}
	50% {
		opacity: .6;
	}
	70% {
		opacity: .3;
	}
	100% {
		opacity: .3;
	}
}
#starMed.on {
	-moz-animation: starfade 20s cubic-bezier(0.575, 1, 0.405, 0) infinite;
	-webkit-animation: starfade 20s cubic-bezier(0.575, 1, 0.405, 0) infinite;
	-o-animation: starfade 20s cubic-bezier(0.575, 1, 0.405, 0) infinite;
	-ms-animation: starfade 20s cubic-bezier(0.575, 1, 0.405, 0) infinite;
	animation: starfade 20s cubic-bezier(0.575, 1, 0.405, 0) infinite;
}
@-moz-keyframes winStarfade {
	0% {
		opacity: .45;
	}
	20% {
		opacity: .6;
	}
	50% {
		opacity: .6;
	}
	70% {
		opacity: .45;
	}
	100% {
		opacity: .45;
	}
}
@-webkit-keyframes winStarfade {
	0% {
		opacity: .45;
	}
	20% {
		opacity: .6;
	}
	50% {
		opacity: .6;
	}
	70% {
		opacity: .45;
	}
	100% {
		opacity: .45;
	}
}
@-o-keyframes winStarfade {
	0% {
		opacity: .45;
	}
	20% {
		opacity: .6;
	}
	50% {
		opacity: .6;
	}
	70% {
		opacity: .45;
	}
	100% {
		opacity: .45;
	}
}
@-ms-keyframes winStarfade {
	0% {
		opacity: .45;
	}
	20% {
		opacity: .6;
	}
	50% {
		opacity: .6;
	}
	70% {
		opacity: .45;
	}
	100% {
		opacity: .45;
	}
}
@keyframes winStarfade {
	0% {
		opacity: .45;
	}
	20% {
		opacity: .6;
	}
	50% {
		opacity: .6;
	}
	70% {
		opacity: .45;
	}
	100% {
		opacity: .45;
	}
}
#starMed.win {
	-moz-animation: winStarfade 20s cubic-bezier(0.575, 1, 0.405, 0) infinite;
	-webkit-animation: winStarfade 20s cubic-bezier(0.575, 1, 0.405, 0) infinite;
	-o-animation: winStarfade 20s cubic-bezier(0.575, 1, 0.405, 0) infinite;
	-ms-animation: winStarfade 20s cubic-bezier(0.575, 1, 0.405, 0) infinite;
	animation: winStarfade 20s cubic-bezier(0.575, 1, 0.405, 0) infinite;
}
.rotate10 {
	-moz-animation: rotate360 1000s infinite linear;
	-webkit-animation: rotate360 1000s infinite linear;
	-0-animation: rotate360 1000s infinite linear;
	-ms-animation: rotate360 1000s infinite linear;
	animation: rotate360 1000s infinite linear;
}
.rotate9 {
	-moz-animation: rotateBack360 1000s infinite linear;
	-webkit-animation: rotateBack360 1000s infinite linear;
	-o-animation: rotateBack360 1000s infinite linear;
	-ms-animation: rotateBack360 1000s infinite linear;
	animation: rotateBack360 1000s infinite linear;
}
.rotate8 {
	-moz-animation: rotate360 450s infinite linear;
	-webkit-animation: rotate360 450s infinite linear;
	-o-animation: rotate360 450s infinite linear;
	-ms-animation: rotate360 450s infinite linear;
	animation: rotate360 450s infinite linear;
}
.rotate7 {
	-moz-animation: rotateBack360 450s infinite linear;
	-webkit-animation: rotateBack360 450s infinite linear;
	-o-animation: rotateBack360 450s infinite linear;
	-ms-animation: rotateBack360 450s infinite linear;
	animation: rotateBack360 450s infinite linear;
}
.rotate6 {
	-moz-animation: rotate360 400s infinite linear;
	-webkit-animation: rotate360 400s infinite linear;
	-o-animation: rotate360 400s infinite linear;
	-ms-animation: rotate360 400s infinite linear;
	animation: rotate360 400s infinite linear;
}
.rotate5 {
	-moz-animation: rotateBack360 400s infinite linear;
	-webkit-animation: rotateBack360 400s infinite linear;
	-o-animation: rotateBack360 400s infinite linear;
	-ms-animation: rotateBack360 400s infinite linear;
	animation: rotateBack360 400s infinite linear;
}
.rotate4 {
	-moz-animation: rotate360 350s infinite linear;
	-webkit-animation: rotate360 350s infinite linear;
	-o-animation: rotate360 350s infinite linear;
	-ms-animation: rotate360 350s infinite linear;
	animation: rotate360 350s infinite linear;
}
.rotate3 {
	-moz-animation: rotateBack360 350s infinite linear;
	-webkit-animation: rotateBack360 350s infinite linear;
	-o-animation: rotateBack360 350s infinite linear;
	-ms-animation: rotateBack360 350s infinite linear;
	animation: rotateBack360 350s infinite linear;
}
.rotate2 {
	-moz-animation: rotate360 300s infinite linear;
	-webkit-animation: rotate360 300s infinite linear;
	-o-animation: rotate360 300s infinite linear;
	-ms-animation: rotate360 300s infinite linear;
	animation: rotate360 300s infinite linear;
}
.rotate1 {
	-moz-animation: rotateBack360 300s infinite linear;
	-webkit-animation: rotateBack360 300s infinite linear;
	-o-animation: rotateBack360 300s infinite linear;
	-ms-animation: rotateBack360 300s infinite linear;
	animation: rotateBack360 300s infinite linear;
}
@-moz-keyframes moon {
	0% {
		z-index:503;
		width: 60px;
		height: 60px;
	}
	20% {
		left: 500px;
		bottom: 200px;
		width: 20px;
		height: 20px;
		z-index:503;
	}
	21% {
		z-index:499;
	}
	100% {
		left: 200px;
		bottom: -100px;
		width: 1px;
		height: 1px;
		z-index:499;
	}
}
@-webkit-keyframes moon {
	0% {
		z-index:503;
		width: 60px;
		height: 60px;
	}
	20% {
		left: 500px;
		bottom: 200px;
		width: 20px;
		height: 20px;
		z-index:503;
	}
	21% {
		z-index:499;
	}
	100% {
		left: 200px;
		bottom: -100px;
		width: 1px;
		height: 1px;
		z-index:499;
	}
}
@-o-keyframes moon {
	0% {
		z-index:503;
		width: 60px;
		height: 60px;
	}
	20% {
		left: 500px;
		bottom: 200px;
		width: 20px;
		height: 20px;
		z-index:503;
	}
	21% {
		z-index:499;
	}
	100% {
		left: 200px;
		bottom: -100px;
		width: 1px;
		height: 1px;
		z-index:499;
	}
}
@-ms-keyframes moon {
	0% {
		z-index:503;
		width: 60px;
		height: 60px;
	}
	20% {
		left: 500px;
		bottom: 200px;
		width: 20px;
		height: 20px;
		z-index:503;
	}
	21% {
		z-index:499;
	}
	100% {
		left: 200px;
		bottom: -100px;
		width: 1px;
		height: 1px;
		z-index:499;
	}
}
@keyframes moon {
	0% {
		z-index:503;
		width: 60px;
		height: 60px;
	}
	20% {
		left: 500px;
		bottom: 200px;
		width: 20px;
		height: 20px;
		z-index:503;
	}
	21% {
		z-index:499;
	}
	100% {
		left: 200px;
		bottom: -100px;
		width: 1px;
		height: 1px;
		z-index:499;
	}
}
#moonOne.on {
	-moz-animation: moon 150s infinite linear;
	-webkit-animation: moon 150s infinite linear;
	-o-animation: moon 150s infinite linear;
	-ms-animation: moon 150s infinite linear;
	animation: moon 150s infinite linear;
}
@-moz-keyframes starScreen {
	0% {
		left: -100%;
		top: -100%;
		width: 300%;
		height: 300%;
	}
	100% {
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
	}
}
@-webkit-keyframes starScreen {
	0% {
		left: -100%;
		top: -100%;
		width: 300%;
		height: 300%;
	}
	100% {
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
	}
}
@-o-keyframes starScreen {
	0% {
		left: -100%;
		top: -100%;
		width: 300%;
		height: 300%;
	}
	100% {
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
	}
}
@-ms-keyframes starScreen {
	0% {
		left: -100%;
		top: -100%;
		width: 300%;
		height: 300%;
	}
	100% {
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
	}
}
@keyframes starScreen {
	0% {
		left: -100%;
		top: -100%;
		width: 300%;
		height: 300%;
	}
	100% {
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
	}
}
#starScreen.on {
	-moz-animation: starScreen 6s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	-webkit-animation: starScreen 6s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	-o-animation: starScreen 6s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	-ms-animation: starScreen 6s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	animation: starScreen 6s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
}
@-moz-keyframes fadeOut {
	0% {
		opacity:1;
	}
	100% {
		opacity:0;
	}
}
@-webkit-keyframes fadeOut {
	0% {
		opacity:1;
	}
	100% {
		opacity:0;
	}
}
@-o-keyframes fadeOut {
	0% {
		opacity:1;
	}
	100% {
		opacity:0;
	}
}
@-ms-keyframes fadeOut {
	0% {
		opacity:1;
	}
	100% {
		opacity:0;
	}
}
@keyframes fadeOut {
	0% {
		opacity:1;
	}
	100% {
		opacity:0;
	}
}
#starScreenBox.on {
	-moz-animation: fadeOut 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) 3s forwards;
	-webkit-animation: fadeOut 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) 3s forwards;
	-o-animation: fadeOut 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) 3s forwards;
	-ms-animation: fadeOut 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) 3s forwards;
	animation: fadeOut 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) 3s forwards;
}
#loadBox.on {
	-moz-animation: fadeOut 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	-webkit-animation: fadeOut 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	-o-animation: fadeOut 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	-ms-animation: fadeOut 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	animation: fadeOut 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
}
@-moz-keyframes fadeIn {
	0% {
		opacity:0;
	}
	100% {
		opacity:1;
	}
}
@-webkit-keyframes fadeIn {
	0% {
		opacity:0;
	}
	100% {
		opacity:1;
	}
}
@-o-keyframes fadeIn {
	0% {
		opacity:0;
	}
	100% {
		opacity:1;
	}
}
@-ms-keyframes fadeIn {
	0% {
		opacity:0;
	}
	100% {
		opacity:1;
	}
}
@keyframes fadeIn {
	0% {
		opacity:0;
	}
	100% {
		opacity:1;
	}
}
#planet.on {
	-moz-animation: fadeIn 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	-webkit-animation: fadeIn 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	-o-animation: fadeIn 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	-ms-animation: fadeIn 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	animation: fadeIn 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
}
#planetShadow.on {
	-moz-animation: fadeIn 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	-webkit-animation: fadeIn 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	-o-animation: fadeIn 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	-ms-animation: fadeIn 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	animation: fadeIn 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
}
#viewbox.on {
	-moz-animation: fadeIn 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	-webkit-animation: fadeIn 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	-o-animation: fadeIn 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	-ms-animation: fadeIn 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
	animation: fadeIn 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;
}
@-moz-keyframes loginDrop {
	0% {
		top:-50%;
	}
	100% {
		top:25%;
	}
}
@-webkit-keyframes loginDrop {
	0% {
		top:-50%;
	}
	100% {
		top:25%;
	}
}
@-o-keyframes loginDrop {
	0% {
		top:-50%;
	}
	100% {
		top:25%;
	}
}
@-ms-keyframes loginDrop {
	0% {
		top:-50%;
	}
	100% {
		top:25%;
	}
}
@keyframes loginDrop {
	0% {
		top:-50%;
	}
	100% {
		top:25%;
	}
}
#loginContainer.on {
	-moz-animation: loginDrop 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) 4s forwards;
	-webkit-animation: loginDrop 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) 4s forwards;
	-o-animation: loginDrop 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) 4s forwards;
	-ms-animation: loginDrop 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) 4s forwards;
	animation: loginDrop 3s cubic-bezier(0.075, 0.820, 0.165, 1.000) 4s forwards;
}