/*Index.html specific parallax on adjustments*/

@import "parallaxon.css";


.plx-index1 {
	z-index: 3;
}

.plx-index2 {
	z-index: 1;
}

.plx-index3 {
	z-index: 2;
}

.plx-index4 {
	z-index: 1;
}

.plx-footer {
	z-index: 2;
}

@media screen and (max-width: 768px) {
	
	/*Many of these index1 element adjustments are to de-adjust stuff for parallax to look cleaner with parallaxon applied
	i.e: These adjustments are set in index.css or responsive.css but look strange with parallax enabled, so the values are set here again.*/
	.slidercontainer {
		margin-top: max(114vh, 855px) !important;
		padding-left: 0.5em;
		padding-right: 0.5em;
	}
	
	.plx-index1 {
		height: max(109vh, 812px) !important;
	}
	
	.plx-index1 .plx-layer_base {
		height: max(119vh, 892px) !important;
	}
	
	.plx-index1 .plx-layer_superfore {
		top: max(156vh, 1170px) !important;
	}
	
	.plx-index2 .plx-layer_background {
		height: max(90vh, 675px);
	}
	
	.plx-index3 .i3b1 {
		height: max(51vh, 382px);
	}
	
	.whyuscontainer {
		top: 0 !important;
}

@media screen and (max-width: 601px) {
	
	/*Many of these index1 element adjustments are to de-adjust stuff for parallax to look cleaner with parallaxon applied
	i.e: These adjustments are set in index.css or responsive.css but look strange with parallax enabled, so the values are set here again.*/
	.slidercontainer {
		margin-top: max(134vh, 1005px) !important;
		padding-left: 0.5em;
		padding-right: 0.5em;
	}
	
	.plx-index1 {
		height: max(139vh, 1042px) !important;
	}
	
	.plx-index1 .plx-layer_base {
		height: max(149vh, 1118px) !important;
	}
	
	.plx-index1 .plx-layer_superfore {
		top: max(180vh, 1350px) !important;
	}
}