.slideContainer {
	margin:0 auto;
	position: relative;
	width: 100%;
	height: 0;

	/* 33% being the ratio we are maintaining
	    * calculated by looking at the image
	    * ratio: 320/900 = ~0.33 */
	padding: 0 0 40% 0;
	background: #e8e8e0;
	border-bottom: 1px solid #d6d6d6;
	min-height: 30em;
	overflow: hidden
}
.iosSlider {
	width: 100%;

	/* this height ends up being your maximum height,
	    * if you want it to scale forever, set it to
	    * a very high number */
	height: 7000px;
}
/* slider */
.iosSlider .slider {
	/* required */
	width: 100%;
	height: 100%;
}

/* slide */
.iosSlider .slider .slide {
	/* required */
	width: 100%;
	position:relative;
	height: 100%;
}
.iosSlider .slider .slide img {
	width: 70%;
	height: auto;
	float: right;
	position: relative;
	top:50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%)
}

.iosSlider .slider .slide:first-child .body {text-align: center; width:100%; max-width: 42em; top:calc(50% - 4.5em); left:50%; transform: translate(-50%, -50%)}

.iosSlider .slider .slide:first-child img {
	width: auto !important;
	height: 100% !important;
	position: absolute !important;
	top: 50% !important;
	left: 50% !important;
	transform: translate(-50%, -50%) !important;
}

.iosSlider .slider .slide .body {
	position: relative;
	top: 50%;
	left: 3%;
	z-index:1;
	opacity: 0;
	filter: alpha(opacity:0);
	width:25%;
	transform: translateY(-60%);
	-webkit-transform: translateY(-60%)
}

.iosSlider h1 {text-transform: uppercase}
.iosSlider .slider .slide:first-child .body h1 {margin-bottom: 0.25em}
.iosSlider p {font-size: 1.188em; color:#666; margin-bottom: 2.5em}
.iosSlider .button:after {content: url(/images/icons/misc/button-arrow.svg); display: inline-block; margin-left:0.5em}

.iosSlider .slider .slide .on { opacity: 1;	filter: alpha(opacity:100); -webkit-transition: all 500ms linear;transition: all 500ms linear;  }

/* slide selectors */
.slideContainer .slideSelectors {
	position: absolute;
	bottom:1.875em;
	margin: 7px auto 0;
	z-index: 1;
	text-align:left;
	width:25%;
	left:3%
}

.slideContainer .slideSelectors .item {
	width: 0.875em;
	height: 0.875em;
	background:#666;
	display:inline-block;
	border-radius: 0.143em
}
.slideContainer .slideSelectors .item:first-child {
		margin-left:0;
}
.slideContainer .slideSelectors .selected {
	background:#001222;
}

@media screen and (max-width: 1300px) {
	.iosSlider .slider .slide:first-child img {
		width: 1380px !important;
		height: auto !important;}
		.iosSlider .slider .slide:first-child .body {top: calc(50% - 3em)}
		.iosSlider .slider .slide:first-child .body::before {height: 16em; margin: 0 auto -3em}
}