body{
	color: #444;
}

#loader,
.wait:before, 
.wait:after  {
	background: #00acf1;
}

.wait i {
	/* 2nd colour */
	border-color: #fed136;
	/* 4th colour */
	background: #903f98;
}

.wait i:after {
}

.wait i:before {
	/* 6th colour */
	background: #fed136;
}

/* end loader background template */

.navbar {
	background: #009bd5;
}

.navbar .navbar-toggle {
	color: #009bd5;
}

h1 {
	font: 400 60px/36px Lobster, sans-serif;
	background: url(../img/dfdfdf.gif) 0 50% repeat-x;
	color: #2a2a2a;
}

h1 span {
	display: inline-block;
	padding: 0 20px;
	margin-left: -20px;
}

.hero {
	background: #00aeef;
	color: #fff;
	padding-bottom: 50px;
}

.hero h1 {
	background: transparent;
	font-size: 90px;
	line-height: 79px;
	color: #fff;
}

.hero img {
	margin-top: -20px;
}

h2.lead {
	font-size: 30px;
	line-height: 36px;
	color: #000;
	margin-bottom: 5px;
}

.overlay {
	background: url(../img/santatracker/browser.png) 0 0 no-repeat;	
}

.detail {
	border-top: 1px solid #fff;
}

.detail .inner {
	padding-top: 55px;
}

.detail .box:first-child {
	width: 65.25073457394711%;
}

.detail .box:first-child + .box {
	width: 34.74926542605289%;
}

.detail .box:first-child .inner {
	padding-right: 60px;
}

.detail .box:last-child .inner {
	padding-left: 0;
}

.skinny {
	max-width: 515px;
}

.media {
	padding: 55px 0 120px;
	background: url(../img/santatracker/media.png) 0 0 no-repeat;
}

.media  iframe {
	width: 1021px;
	height: 575px;
	max-width: 100%;
}

.carousel {
	margin-bottom: 80px;
}

.overlay {
}

.carousel-indicators li.active {
	background: #ea4437;
	border-color: #ea4437;
}

.garble {
	display: inline-block;
	width: 84px;
	height: 14px;
	margin-top: -1px;
	vertical-align: middle;
	overflow: hidden;
	text-align: left;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	background: url(../img/santatracker/garble.png) 0 0 no-repeat;
}

.sprite[src*="/img/santatracker/balloon"] {
	top: -50px;
	right: 26px;
	z-index: 4;
}

.pin {
	position: absolute;
	-webkit-border-radius: 50%;
	   -moz-border-radius: 50%;
	     -o-border-radius: 50%;
		    border-radius: 50%;
	width: 20px;
	height: 20px;
	box-shadow: inset -4px -2px 1px 0 rgba(0,0,0,0.05);
	background: #ffda21;
	/* box-shadow: inset -3px -4px 0 -1px rgba(0,0,0,0.05); */
}

.purple,
.green,
.red,
.blue {
	box-shadow: inset -4px -2px 1px 0 rgba(0,0,0,0.15);
}

.purple {
	background: #7847b2;
}

.green {
	background: #22b129;
}

.mint {
	background: #7dd8c9;
}

.blue {
	background: #5e94ff;
}

.red {
	background: #ea4437;
}

.cssanimations .pin {
	width: 0;
	height: 0;
}

.active .pin {
	-webkit-animation: pinpop .4s ease-in 1 forwards;
	   -moz-animation: pinpop .4s ease-in 1 forwards;
	     -o-animation: pinpop .4s ease-in 1 forwards;
	        animation: pinpop .4s ease-in 1 forwards;
}

.pin:nth-of-type(1)	{
	-webkit-animation-delay: .6s;
	   -moz-animation-delay: .6s;
	     -o-animation-delay: .6s;
		    animation-delay: .6s;
	left: 11.65523996082272%;
	top: 42.29452054794521%;
}

.pin:nth-of-type(2) {
	-webkit-animation-delay: .7s;
	   -moz-animation-delay: .7s;
	     -o-animation-delay: .7s;
		    animation-delay: .7s;
	left: 19.68658178256611%;
	top: 39.72602739726027%;
}

.pin:nth-of-type(3) {
	-webkit-animation-delay: .8s;
	   -moz-animation-delay: .8s;
	     -o-animation-delay: .8s;
		    animation-delay: .8s;
	left: 23.21253672869736%;
	top: 40.58219178082192%;
}

.pin:nth-of-type(4) {
	-webkit-animation-delay: .9s;
	   -moz-animation-delay: .9s;
	     -o-animation-delay: .9s;
		    animation-delay: .9s;
	left: 38.88344760039177%;
	top: 18.66438356164384%;
}

.pin:nth-of-type(5) {
	-webkit-animation-delay: 1s;
	   -moz-animation-delay: 1s;
	     -o-animation-delay: 1s;
		    animation-delay: 1s;
	left: 43.87855044074437%;
	top: 30.99315068493151%;
}

.pin:nth-of-type(6) {
	-webkit-animation-delay: 1.1s;
	   -moz-animation-delay: 1.1s;
	     -o-animation-delay: 1.1s;
		    animation-delay: 1.1s;
	left: 47.40450538687561%;
	top: 24.31506849315068%;
}

.pin:nth-of-type(7) {
	-webkit-animation-delay: 1.2s;
	   -moz-animation-delay: 1.2s;
	     -o-animation-delay: 1.2s;
		    animation-delay: 1.2s;
	left: 47.5024485798237%;
	top: 32.53424657534247%;
}

.pin:nth-of-type(8) {
	-webkit-animation-delay: 1.3s;
	   -moz-animation-delay: 1.3s;
	     -o-animation-delay: 1.3s;
		    animation-delay: 1.3s;
	left: 84.03525954946131%;
	top: 44.34931506849315%;
}

.pin:nth-of-type(9) {
	-webkit-animation-delay: 1.4s;
	   -moz-animation-delay: 1.4s;
	     -o-animation-delay: 1.4s;
		    animation-delay: 1.4s;
	left: 85.79823702252693%;
	top: 84.07534246575342%;
}

.pin:nth-of-type(10) {
	-webkit-animation-delay: 1.5s;
	   -moz-animation-delay: 1.5s;
	     -o-animation-delay: 1.5s;
		    animation-delay: 1.5s;
	left: 92.65426052889324%;
	top: 89.04109589041096%;
}

del {
	position: relative;
	display: inline-block;
	text-decoration: none;
}

del:before {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	border: solid #e94436;
	border-width: 1px 0;
	height: 1px;
	width: 100%;
}

.tracker {
	/* height: 438px; */
}

.tracker .static {
	position: relative;
	left: 6px;
	z-index: 3;
}

.tracker .anime {
	position: absolute;
}

.tracker .anime {
	top: 9.589041095890411%;
	left: 41%;
	width: 19.98041136141038%;
	z-index: 2;
	-webkit-transition: left .5s ease-in-out 1s;
	-moz-transition: left .5s ease-in-out 1s;
	-o-transition: left .5s ease-in-out 1s;
	transition: left .5s ease-in-out 1s;
}

.tracker.active .anime:nth-of-type(1) {
	left: 0;
}
 
.tracker.active .anime:nth-of-type(2) {
	left: 19.98041136141038%;
	-webkit-transition-duration: .3s;
}


.tracker.active .anime:nth-of-type(3) {
	left: 59.94123408423115%;
	-webkit-transition-duration: .3s;
}

.tracker.active .anime:nth-of-type(4) {
	left: 79.95%;
	right: 0;
	z-index: 1;
}


@-webkit-keyframes pinpop {
	0%		{width: 0; height: 0;}
	50% 	{width: 44px; height: 44px; margin-left: -22px; margin-top: -22px; box-shadow: inset -16px -4px 0 0 rgba(0,0,0,0.1); }
	100%	{width: 22px; height: 22px; margin-left: -11px; margin-top: -11px;}
}

@-moz-keyframes pinpop {
	0%		{width: 0; height: 0;}
	50% 	{width: 46px; height: 46px; margin-left: -23px; margin-top: -23px;}
	100%	{width: 22px; height: 22px; margin-left: -11px; margin-top: -11px;}
}

@-o-keyframes pinpop {
	0%		{width: 0; height: 0;}
	50% 	{width: 46px; height: 46px; margin-left: -23px; margin-top: -23px;}
	100%	{width: 22px; height: 22px; margin-left: -11px; margin-top: -11px;}
}

@keyframes pinpop {
	0%		{width: 0; height: 0;}
	50% 	{width: 46px; height: 46px; margin-left: -23px; margin-top: -23px;}
	100%	{width: 22px; height: 22px; margin-left: -11px; margin-top: -11px;}
}


@media ( min-width: 1021px ) {
	.carousel {
		height: 647px;
	}
	
	.hero {
		min-height: 900px;
	}
	
	.csstransitions .sprite[src*="/img/santatracker/balloon"] {
		top: 741px; 
	}

	.active .sprite[src*="/img/santatracker/balloon"] {
		top: -50px;
		-webkit-transition: top 8s ease-in-out;
		   -moz-transition: top 8s ease-in-out;
		     -o-transition: top 8s ease-in-out;
		        transition: top 8s ease-in-out;
	}
}

@media ( max-width: 1020px ) {
	
	/*tracker header */
	img.top-minus-40 {
		margin-top: 0;
	}
	
	.media {
		padding-top: 0;
		background-position: 50% 100%;
		background-size: 100% 100%;
	}
	
	.media iframe {
	}
}

@media  ( max-width: 768px ) {
	
	.skinny {
		max-width: none;
		text-align: center;
	}
	
	.skinny + hr {
		margin: 40px 0 0 0;
	}
	
	.media {
		padding-bottom: 70px;
	}
	
	.media iframe {
		height: 420px;
	}
	
	.sprite[src="/img/google-plus.png"] {
		margin-bottom: 14px;
	}
	
	.tracker {
		margin-top: 20px;
	}
	
	.tracker .static {
		width: 19.98041136141038%;
		left: 0;
		top: 0;
	}
	
	.tracker img.anime {
		margin-top: -10px;
		-webkit-transition: none !important;
		-moz-transition: none !important;
		-o-transition: none !important;
		transition: none !important;
	}
}

@media  ( max-width: 568px ) {
	
	h1 {
		line-height: 50px;
		background: none;
	}
	
	h1 span {
		margin: 0;
		padding: 0;
	}

	.hero h1 {
		font-size: 60px;
		line-height: 46px;
		margin-bottom: 10px;
	}
	
	.media {
		background: none;
		padding-bottom: 30px;
	}

	.media iframe {
		height: 260px;
	}
	
	.level {
		padding-top: 40px;
	}
}

@media  ( max-width: 320px ) {

	.media iframe {
		height: 170px;
	}
}