/*

Slider Boxes: 3.
Slider Height: 320px.
Real Slider Height: 960px.
Slider Time: 45 seconds per circuit.
200ms as a % of animation time: 0.44444444444444.

*/

.cta {
	padding: 8px 0;
}

#slider {
	height: 320px;
}

.fixsize {
	height: 320px;
}


#slider h2 {
	line-height: 32px;
	font-size: 32px;

	padding: 0 0 16px 0;

	overflow: hidden;
}

#slider p {
	color: #aaa;
	line-height: 16px;
	font-size: 16px;
	font-weight: bold;
}


#slider:hover #bar {
	-webkit-animation-play-state: paused;
	-moz-animation-play-state: paused;
	-ms-animation-play-state: paused;
	-o-animation-play-state: paused;
	animation-play-state: paused;
}

#slider:hover #shifter {
	-webkit-animation-play-state: paused;
	-moz-animation-play-state: paused;
	-ms-animation-play-state: paused;
	-o-animation-play-state: paused;
	animation-play-state: paused;
}


@-webkit-keyframes timer { from { height: 0; } } to { height: 960px; } }
@-moz-keyframes timer { from { height: 0; } } to { height: 960px; } }
@-ms-keyframes timer { from { height: 0; } } to { height: 960px; } }
@-o-keyframes timer { from { height: 0; } } to { height: 960px; } }
@keyframes timer { from { height: 0; } } to { height: 960px; } }

#bar {
	width: 1px;
	height: 0;
	margin-left: 10px;
	background: #E9C267;


	-moz-animation-iteration-count: infinite;
	-moz-animation-timing-function: linear;
	-moz-animation-name: timer;
	-moz-animation-duration: 45s;

	-ms-animation-iteration-count: infinite;
	-ms-animation-timing-function: linear;
	-ms-animation-name: timer;
	-ms-animation-duration: 45s;
	
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: linear;
	-webkit-animation-name: timer;
	-webkit-animation-duration: 45s;

	-o-animation-iteration-count: infinite;
	-o-animation-timing-function: linear;
	-o-animation-name: timer;
	-o-animation-duration: 45s;

	animation-iteration-count: infinite;
	animation-timing-function: linear;
	animation-name: timer;
	animation-duration: 45s;
}

/*
@-moz-keyframes slider {
	0% { margin-top: 0; }
	49% { margin-top: 0; }
	50% {margin-top: -320px;}
	99% {margin-top: -320px; }
	100% { margin-top: 0; }
}
*/


@-webkit-keyframes slider {
	0% { margin-top: 0; }

	32.888888888889% { margin-top: -0px; }
	33.333333333333% {margin-top: -320px;}
	66.222222222222% { margin-top: -320px; }
	66.666666666667% {margin-top: -640px;}

	99.555555555556% { margin-top: -640px; }
	100% { margin-top: 0; }
}
@-moz-keyframes slider {
	0% { margin-top: 0; }

	32.888888888889% { margin-top: -0px; }
	33.333333333333% {margin-top: -320px;}
	66.222222222222% { margin-top: -320px; }
	66.666666666667% {margin-top: -640px;}

	99.555555555556% { margin-top: -640px; }
	100% { margin-top: 0; }
}
@-ms-keyframes slider {
	0% { margin-top: 0; }

	32.888888888889% { margin-top: -0px; }
	33.333333333333% {margin-top: -320px;}
	66.222222222222% { margin-top: -320px; }
	66.666666666667% {margin-top: -640px;}

	99.555555555556% { margin-top: -640px; }
	100% { margin-top: 0; }
}
@-o-keyframes slider {
	0% { margin-top: 0; }

	32.888888888889% { margin-top: -0px; }
	33.333333333333% {margin-top: -320px;}
	66.222222222222% { margin-top: -320px; }
	66.666666666667% {margin-top: -640px;}

	99.555555555556% { margin-top: -640px; }
	100% { margin-top: 0; }
}
@keyframes slider {
	0% { margin-top: 0; }

	32.888888888889% { margin-top: -0px; }
	33.333333333333% {margin-top: -320px;}
	66.222222222222% { margin-top: -320px; }
	66.666666666667% {margin-top: -640px;}

	99.555555555556% { margin-top: -640px; }
	100% { margin-top: 0; }
}

#shifter {
	-moz-animation-iteration-count:infinite;
	-moz-animation-name:slider;
	-moz-animation-duration:45s;

	-ms-animation-iteration-count:infinite;
	-ms-animation-name:slider;
	-ms-animation-duration:45s;
	
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-name:slider;
	-webkit-animation-duration:45s;

	-o-animation-iteration-count:infinite;
	-o-animation-name:slider;
	-o-animation-duration:45s;

	animation-iteration-count:infinite;
	animation-name:slider;
	animation-duration:45s;
}
