.homeSlide {overflow: hidden; background: rgba(0,0,0,.6);}
.homeSlide .slides img.mslide {display: none;}
.slides li {max-height: -webkit-calc(100vh - 50px); max-height: calc(100vh - 50px); overflow: hidden;}
.slideContent {
	width: 100%; height: 100%;
	background: rgba(0,0,0,.3);
	position: absolute;
	top: 0; left: 0; padding: 20px;
	 color: #fff;
}
.sbox {height: 100%;}
.slideitem {width: 100%; max-width: 520px; padding: 20px; overflow: hidden;}
.slideContent h1 {
	font-size: 4.8rem; margin: 10px 0 0; color: #c4d600;
	padding: 0 0 6px; border-bottom: 1px solid #c4d600;
	text-shadow: 0 0 10px rgba(0,0,0,.2);
}
.slideContent h2 {
	font: normal 3rem Arial; margin: 5px 0;
	text-shadow: 0 0 10px rgba(0,0,0,.3);
}
.call {
	display: inline-block; padding: 15px 45px;
	font-size: 1.8rem; color: #006341; background: #c4d600;
	text-transform: uppercase; margin: 25px 0;
	border: 2px solid #c4d600;
}
.call:hover {background: transparent; color: #fff;}

@keyframes down {
	from {margin-bottom: 20px;}
	to {margin-top: 20px;}
}

.down:hover {opacity: 1; animation-play-state: paused;}

@media screen and (max-width: 860px) {
	.slideContent h1 {font-size: 6.8rem;}
}
@media screen and (max-width: 768px) {
	.down {display: none;}
	.slideContent h1 {font-size: 5.4rem; margin: 10px 0 15px;}
}
@media screen and (max-width: 640px) {
	.flexslider .slides img.mslide {display: block;}
	.flexslider .slides img.dslide {display: none;}
	.slideContent h1 {font-size: 4.6rem;}
	.call {font-size: 1.6rem; padding: 10px 35px;}
}
@media screen and (max-width: 568px) {
	.slideitem {padding: 10px 20px;}
	.slideContent h1 {font-size: 4rem; margin: 8px 0;}
	.slideContent a {margin: 10px 0;}
	.slideContent h2 {font-size: 1.6rem; margin: 5px 0 10px;}

}
@media screen and (max-width: 480px) {
	.slideContent h1 {font-size: 2.6rem;}
	h2 {font-size: 1.6rem; margin: 5px 0;}
	.slideContent a {margin: 5px 0; padding: 8px 30px;}
}