* {
	padding: 0;
	margin: 0;
}	
*, *:before, *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
 }
 body, html {
	width: 100%;
	height: 100%;
}
body {
	overflow-x: hidden;
	overflow-y: scroll;
	background-image: none !important;
	/*background: url(../img/sky/Sky4.jpg);*/
	/*background-attachment: fixed;*/
	/*background-size: auto 100%;*/
	font-family: 'Crimson Text', serif;
	height: 30000px;
}
#mega-container div, #mega-container img {
	position: absolute;
}
#mega-container {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
  -webkit-transition: all 0.2s ease-out; 
     -moz-transition: all 0.2s ease-out; 
       -o-transition: all 0.2s ease-out; 
          transition: all 0.2s ease-out; 
}
#overlay {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	text-align: center;
}
#overlay-text {
	position: fixed;
	top: 130px;
	width: 570px;
	max-width: 80%;
	margin-bottom: 20px;
	text-align: center;
}
#intro-text {
	color: #fff;
	font-size: 19px;
}
#controls {
	text-align: center;
    font-family: 'Pathway Gothic One', sans-serif;
    margin-top: 30px;
}
#controls div {
	display: inline-block;
	vertical-align: top;
}
#controls p {
	width: 100%;
	color: #00386b;
	font-size: 20px;
	font-weight: 600;
}
.controls-inbetween {
	width: 2px;
	height: 18px;
	overflow: hidden;
	background-color: #d4e70f;
	margin-top: 27px;
}
#controls .controls-icons p {
	color: #ffffff;
	font-size: 16px;
}
.controls-icons {
	margin: 10px 15px;
	color: #fff;
}
#footer {
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 80px;
}
#timeline {
	background-color: #b0ada1;
	height: 7px;
	width: 70%;
	display: none;
	position: relative;
	margin: 26px auto 0;
	border: 1px solid #444;
}
#timeline-inner {
	background-image: url(../img/overlay/timeline-inner2.png);
	background-repeat: repeat-x;
	overflow: hidden;
	position: absolute;
	left: 0;
	top: 0;
	width: 10px;
	height: 7px;
}
.timeline-hash:hover {
	background-position: 0 -60px !important;
}
.timeline-hash.visited {
	background-position: 0 -30px;
}
.timeline-hash {
	top: -12px;
	/*width: 7px;*/
	/*background-color: blue;*/
	background-image: url(../img/overlay/timeline2.png);
	background-position: 0 0;
	width: 30px;
	height: 30px;
	overflow: hidden;
	z-index: 10;
	/*height: 17px;*/
	position: absolute;
	overflow: hidden;
	cursor: pointer;
  -webkit-transition: opacity 0.2s ease-out; 
     -moz-transition: opacity 0.2s ease-out; 
       -o-transition: opacity 0.2s ease-out; 
          transition: opacity 0.2s ease-out; 
}
#timeline-yah {
	bottom: 9px;
	position: absolute;
	cursor: pointer;
}
#overlay-bottom-left {
	position: absolute;
	left: 0;
	bottom: 0;
	color: #adaa9d;
    font-family: 'Pathway Gothic One', sans-serif;
	padding: 0 0 33px 53px;
}
#overlay-bottom-right {
	position: absolute;
	right: 0;
	bottom: 0;
    font-family: 'Pathway Gothic One', sans-serif;
	color: #adaa9d;
	padding: 0 53px 33px 0;
}
#overlay-bottom-right a, #overlay-bottom-right img {
	display: inline-block;
	vertical-align: middle;
	border: 0;
	margin: 10px 2px 0 0;
}
#overlay-bottom-right a {
	color: #adaa9d;
	text-decoration: none;
}
#yah {
	display: inline-block;
}
#menu-pulldown {
	position: fixed;
	left: 20px;
	top: 20px;
	z-index: 199 !important;
	opacity: 0.8;
	cursor: pointer;
  -webkit-transition: all 0.2s ease-out; 
     -moz-transition: all 0.2s ease-out; 
       -o-transition: all 0.2s ease-out; 
          transition: all 0.2s ease-out; 
}
#menu-pulldown.invert {
	-webkit-filter: invert();
	-moz-filter: invert();
	-ms-filter: invert();
	filter: invert();
}
#menu-pulldown:hover {
	opacity: 1;
}
#header-logo {
	z-index: 5;
	position: relative;
  -webkit-transition: all 0.4s ease-out; 
     -moz-transition: all 0.4s ease-out; 
       -o-transition: all 0.4s ease-out; 
          transition: all 0.4s ease-out; 
}
header#masthead {
  -webkit-transition: all 0.4s ease-out; 
     -moz-transition: all 0.4s ease-out; 
       -o-transition: all 0.4s ease-out; 
          transition: all 0.4s ease-out; 
          z-index: 99;
          position: fixed;
}
header.user-closed {
	top: -100px !important;
}
header.user-opened {
	top: 0 !important;
}
header.site-closed {
	top: -100px;
}
header.user-closed #header-logo, header.site-closed #header-logo {
	display: none;
}
header.user-opened #header-logo {
	display: block !important;
}

#masthead .blip-container {
  -webkit-transition: all 0.2s ease-out; 
     -moz-transition: all 0.2s ease-out; 
       -o-transition: all 0.2s ease-out; 
          transition: all 0.2s ease-out; 
}
#ground {
	top: 0;
	left: 0;
	height: 100%;
	width: 33000px;
}
#inner-container {
	width: 100%;
	height: 100%;
}
#grass {
	background: url(../img/2d/grassinvert.jpg);
	background-size: auto 100%;
	top: 50%;
	left: 0;
	width: 100%;
	height: 25%;
}
#street {
	background: url(../img/2d/street2.jpg);
	background-size: auto 100%;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 25%;
}
#sky {
	background: url(../img/2d/NewHills.jpg);
	background-size: auto 100%;
	top: 0;
	left: 0;
	width: 100%;
	height: 50%;
}
.cloud {
	position: absolute;
	height: 10%;
}

#fireengine-headlight-left, #fireengine-headlight-right {
	position: absolute;
	top: 78px;
}
#fireengine-headlight-left {
	left: 8px;
	display: none;
}
.even #fireengine-headlight-left {
	display: block;
}
#fireengine-headlight-right {
	right: 8px;
	display: block;
}
.even #fireengine-headlight-right {
	display: none;
}
#fireengine-redlight-left, #fireengine-redlight-right {
	position: absolute;
	top: -16px;
}
#fireengine-redlight-left {
	left: 8px;
	display: block;
}
.even #fireengine-redlight-left {
	display: none;
}
#fireengine-redlight-right {
	right: 8px;
	display: none;
}
.even #fireengine-redlight-right {
	display: block;
}
.active #tractor {
	-webkit-animation: tractor 30s linear infinite;
	-moz-animation: tractor 30s linear infinite;
	-o-animation: tractor 30s linear infinite;
	animation: tractor 30s linear infinite;
}
.vehicle.driving {
	-webkit-animation: driveby 65s linear;
	-moz-animation: driveby 65s linear;
	-o-animation: driveby 65s linear;
	animation: driveby 65s linear;
	-webkit-animation-play-state: paused;
	-moz-animation-play-state: paused;
	-o-animation-play-state: paused;
	animation-play-state: paused;
	-webkit-animation-play-state: running;
	-moz-animation-play-state: running;
	-o-animation-play-state: running;
	animation-play-state: running;
}
.vehicle.driving.reverse {
	-webkit-animation: driveby 65s linear infinite reverse;
	-moz-animation: driveby 65s linear infinite reverse;
	-o-animation: driveby 65s linear infinite reverse;
	animation: driveby 65s linear infinite reverse;
}
.vehicle.stopped {
	-webkit-animation-play-state: paused !important;
	-moz-animation-play-state: paused !important;
	-o-animation-play-state: paused !important;
	animation-play-state: paused !important;
}
.driving .recycletruck-wheel, .driving .bus-wheel, .driving .car-wheel, .driving .ambulance-wheel,.driving .car-bride-wheel {
    -webkit-animation: rotating 2s linear infinite;	
    -moz-animation: rotating 2s linear infinite;	
    -o-animation: rotating 2s linear infinite;	
    animation: rotating 2s linear infinite;	
    -webkit-backface-visibility: hidden;
}
.driving .truck-wheel {
    -webkit-animation: rotating 2s linear infinite reverse;	
    -moz-animation: rotating 2s linear infinite reverse;	
    -o-animation: rotating 2s linear infinite reverse;	
    animation: rotating 2s linear infinite reverse;	
}
.drivingright, .drivingleft {
	display: none;	
}
.bike-wheel {
    -webkit-animation: rotating 1.6s linear infinite reverse;	
    -moz-animation: rotating 1.6s linear infinite reverse;	
    -o-animation: rotating 1.6s linear infinite reverse;	
    animation: rotating 1.6s linear infinite reverse;	
}
#bike {
	-webkit-animation: driveby 115s linear infinite reverse;
	-moz-animation: driveby 115s linear infinite reverse;
	-o-animation: driveby 115s linear infinite reverse;
	animation: driveby 115s linear infinite reverse;
}
#plane {
	-webkit-animation: driveby 135s linear infinite reverse;
	-moz-animation: driveby 135s linear infinite reverse;
	-o-animation: driveby 135s linear infinite reverse;
	animation: driveby 135s linear infinite reverse;
}
#flag { 
  -webkit-transition: all 4s ease-out; 
     -moz-transition: all 4s ease-out; 
       -o-transition: all 4s ease-out; 
          transition: all 4s ease-out; 
}
.popup-bg {
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	position: absolute;
}
.popup-bubble {
	/*background: url(../img/overlay/popup2.png);*/
	position: absolute;
	/*background-size: 100% 100%;*/
	width: 40px;
	height: 95px;
	cursor: pointer;
	padding: 40px 45px;
	overflow: hidden;
	z-index: 2;
  -webkit-transition: all 0.4s linear; 
     -moz-transition: all 0.4s linear; 
       -o-transition: all 0.4s linear; 
          transition: all 0.4s linear; 
}
.popup-bubble h3, .popup-bubble p {
	position: relative;
	display: none;
}
.popup-bubble h3 {
	text-transform: uppercase;
	padding: 2px 0 4px;
	margin: 0;
	font-size: 23px;
}
.popup-bubble p {
	line-height: 22px;
	font-size: 20px;
}
.popup-inner {
	width: 80%;
	height: 100%;
	position: absolute;
	display: block;
	left: 7px;
	top: 6px;
  -webkit-transition: all 0.4s linear; 
     -moz-transition: all 0.4s linear; 
       -o-transition: all 0.4s linear; 
          transition: all 0.4s linear; 
}
.focusing .active .popup-inner {
	display: none;
}
.focusing .active .popup-bubble h3, .focusing .active .popup-bubble p {
	display: block;
}
.focusing .active .popup-bubble {
	width: 314px;
	height: 371px;
	bottom: 61% !important;
}
.minor-popup-control {
	position: absolute;
	cursor: pointer;
}
.active .minor-popup-control {
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
}
.active .minor-popup {
	display: block;
}
.minor-popup {
	position: absolute;
	background: url(../img/objects/minor-popup-bubble2.png);
	width: 270px;
	height: 163px;
	display: none;
	padding: 18px 20px;
}
.minor-popup h3 {
	text-transform: uppercase;
	font-size: 20px;
	line-height: 24px;
	margin: 0;
	padding: 0;
}
.minor-popup p {
	line-height: 16px;
	font-size: 15px;
	width: 242px;
}

#thanks {
	text-align: center;
}
#thanks-text {
	bottom: 0;
	color: #fff;
	font-size: 45px;
	font-family: 'Pathway Gothic One', sans-serif;
	display: block;
	margin: 20px auto;
}
#thanks .logo {
	display: block;
	margin: 2% auto;
	position: static;
}
#thanks p {
	font-size: 81%;
}
#exit {
	text-align: center;
}
#exit p {
	width: 65%;
	position: relative;
	display: block;
	margin: 2% auto;
}
#exit .blue {
	font-size: 25px;
	color: #337896;
}
#exit .copy {
	font-size: 15px;
}
#exit a {
	display: block;
	margin: 0 auto;
	width: 40%;
}
#exit a img {
	width: 40%;
	display: block;
	margin: 0 auto;
	top: 29%;
}
#exit img {
}
#exit .section-bg {
	position: absolute;
	left: -1%;
}
#mega-container .thanks-sponsors {
	position: static;
}
#airplane-logo {
	margin: 0 auto;
	height: 90%;
}

@-webkit-keyframes tractor {
    0% {
        -webkit-transform: scaleX(-1) translateX(0);
    }
    50% {
        -webkit-transform: scaleX(-1) translateX(-370%);
    }
    50.1% {
        -webkit-transform: scaleX(1) translateX(370%);
    }
    to{
        -webkit-transform: scaleX(1) translateX(0);
    }
}
@-moz-keyframes tractor {
    0% {
        -moz-transform: scaleX(-1) translateX(0);
    }
    50% {
        -moz-transform: scaleX(-1) translateX(-370%);
    }
    50.1% {
        -moz-transform: scaleX(1) translateX(370%);
    }
    to{
        -moz-transform: scaleX(1) translateX(0);
    }
}
@-o-keyframes tractor {
    0% {
        -o-transform: scaleX(-1) translateX(0);
    }
    50% {
        -o-transform: scaleX(-1) translateX(-370%);
    }
    50.1% {
        -o-transform: scaleX(1) translateX(370%);
    }
    to{
        -o-transform: scaleX(1) translateX(0);
    }
}
@keyframes tractor {
    0% {
        transform: scaleX(-1) translateX(0);
    }
    50% {
        transform: scaleX(-1) translateX(-370%);
    }
    50.1% {
        transform: scaleX(1) translateX(370%);
    }
    to{
        transform: scaleX(1) translateX(0);
    }
}
@-webkit-keyframes driveby {
	from {
		left: -2%;
	}
	to {
		left: 90%;
	}
}
@-moz-keyframes driveby {
	from {
		left: -2%;
	}
	to {
		left: 90%;
	}
}
/*@-moz-keyframes driveby {
	from {
		-moz-transform: rotateX(-83deg) translateX(0);
	}
	to {
		-moz-transform: rotateX(-83deg) translateX(34800px);
	}
}
*/
@keyframes driveby {
	from {
		left: -2%;
	}
	to {
		left: 90%;
	}
}
@-webkit-keyframes rotating {
    from{
        -webkit-transform: rotate(0deg);
    }
    to{
        -webkit-transform: rotate(360deg);
    }
}
@-moz-keyframes rotating {
    from{
        -moz-transform: rotate(0deg);
    }
    to{
        -moz-transform: rotate(360deg);
    }
}
@keyframes rotating {
    from{
        transform: rotate(0deg);
    }
    to{
        transform: rotate(360deg);
    }
}
@-webkit-keyframes bouncing {
    0% {
        -webkit-transform: rotate(0deg);
    }
    50% {
        -webkit-transform: rotate(-9deg);
    }
    100% {
    	-webkit-transform: rotate(0deg);
    }
}
@-moz-keyframes bouncing {
    0% {
        -moz-transform: rotate(0deg);
    }
    50% {
        -moz-transform: rotate(-9deg);
    }
    100% {
    	-webkit-transform: rotate(0deg);
    }
}
@keyframes bouncing {
    0% {
        transform: rotate(0deg);
    }
    50% {
        transform: rotate(-9deg);
    }
    100% {
    	-webkit-transform: rotate(0deg);
    }
}


@media screen and (max-width: 500px) {
	#intro-text {
		font-size: 13px;
	}
	#masthead .blip-container {
		left: 16%;
	}
}
@media screen and (max-height: 650px) {
	#timeline {
		display: none;
	}
}
@media screen and (max-height: 500px) {
	.popup-bubble {
		
	}
	#mega-container .active .popup-bubble {
		width: 214px;
		height: 271px;
		padding: 25px 30px;
		bottom: -40% !important;
	}
	#mega-container .active .popup-bubble h3 {
		font-size: 15px;
	}
	#mega-container .active .popup-bubble p {
		font-size: 13px;
	}
	.popup-bubble p {
		font-size: 14px;
		line-height: 18px;
	}
}