.parallax-slider{
	position: relative;
	width: 100%;
	height: 612px;
	display: block;
	overflow: hidden;
	top: 0;
	left: 0;
	-ms-transform: translateZ(0);
	transform: translateZ(0);
		.baseList{
			display: none;
		}
		#mainImageHolder{
			position: relative;
			width: 100%;
			height: 150%;
			top: 0;
			z-index: 1;
				.primaryHolder{
					position: absolute;
					width: 100%;
					height: 100%;
					top: 0;
					left: 0;
					z-index: 2;
						img{
							position: absolute;
							max-width: inherit;
						}
				}
				.secondaryHolder{
					position: absolute;
					width: 100%;
					height: 100%;
					top: 0px;
					left: 0px;
					z-index: 1;
						img{
							position: absolute;
							max-width: inherit;
						}
				}
		}
		#mainCaptionHolder{
			position: absolute;
			width: 100%;
			height: 150%;
			top: 0;
			left: 0;
			text-align: right;
			background: transparent;
			z-index: 2;
				.container{
					position: relative;
					top: 37%;
						.primaryCaption{
							position: absolute;
							width: 100%;
							.title1, .title2{
								font: 300 94px/1em @OpenSansFontFamily;
								letter-spacing: 0;
								position: relative;
								display: block;
								color: @white;
								@media (max-width: 979px) {
									font-size: 80px;
								}
								@media (max-width: 767px) {
									font-size: 50px;
									text-align: center;
								}
							}
							.title2{
								font-weight: 600;
								font-size: 38px;
								padding-top: 7px;
								@media (max-width: 979px) {
									font-size: 30px
								}
								@media (max-width: 767px) {
									font-size: 20px
								}
							}
						}
						.secondaryCaption{
							position: absolute;
							width: 100%;
							.title1, .title2{
								font: 300 94px/1em @OpenSansFontFamily;
								letter-spacing: 0;
								position: relative;
								display: block;
								color: @white;
								@media (max-width: 979px) {
									font-size: 80px;
								}
								@media (max-width: 767px) {
									font-size: 50px;
									text-align: center;
								}
							}
							.title2{
								font-weight: 600;
								font-size: 38px;
								padding-top: 7px;
								@media (max-width: 979px) {
									font-size: 30px
								}
								@media (max-width: 767px) {
									font-size: 20px
								}
							}
						}
						h2{
							font-size: 80px;
							line-height: 80px;
							color: #fff;
							font-weight: bold;
							text-transform: uppercase;
							margin-bottom: 40px;
						}
						h3{
							font-size: 40px;
							line-height: 40px;
							color: #fff;
							font-weight: bold;
							text-transform: uppercase;
							margin-bottom: 25px;
						}
						p{
							font-size: 20px;
							line-height: 28px;
							color: #fff;
							margin-bottom: 30px;
						}
						.morebtn{
							font-size: 20px;
							line-height: 28px;
							color: #fff;
							padding: 8px 14px;
							border: 2px solid #fff;
							background: #08C;
							.transition(all 0.5s ease);
								&:hover{
									text-decoration: none;
									background: #363636;
								}
						}
				}
		}
		&.zoom-fade-eff{
			#mainImageHolder{
				.primaryHolder{
					.opacity(100);
					.scale(1);
						&.animateState{
							.opacity(0);
							.scale(3);
						}
				}
				.secondaryHolder{
					.opacity(100);
						&.animateState{
							.opacity(0);
						}
				}
			}
			#mainCaptionHolder{
				.primaryCaption{
					.opacity(100);
						&.animateState{
							.opacity(0);
						}
				}
				.secondaryCaption{
					.opacity(100);
						&.animateState{
							.opacity(0);
						}
				}
			}
		}
		&.simple-fade-eff{
			#mainImageHolder{
				.primaryHolder{
					.opacity(100);
						&.animateState{
							.opacity(0);
						}
				}
				.secondaryHolder{
					&.animateState{
						.opacity(100);
							&.animateState{
								.opacity(0);
							}
					}
				}
			}
			#mainCaptionHolder{
				.primaryCaption{
					.opacity(100);
					.scale(1);
						&.animateState{
							.opacity(0);
						}
				}
				.secondaryCaption{
					.opacity(100);
						&.animateState{
							.opacity(0);
						}
				}
			}
		}
		&.slide-top-eff{
			#mainImageHolder{
				.primaryHolder{
					top: 0;
						&.animateState{
							top: -100%;
						}
				}
				.secondaryHolder{
					&.animateState{
						top: 0;
							&.animateState{
								top: 100%;
							}
					}
				}
			}
			#mainCaptionHolder{
				.primaryCaption{
					.opacity(100);
					.scale(1);
						&.animateState{
							.opacity(0);
						}
				}
				.secondaryCaption{
					.opacity(100);
						&.animateState{
							.opacity(0);
						}
				}
			}
		}
		.controlBtn{
			width: 40px;
			height: 60px;
			display: block;
			position: absolute;
			top: 50%;
			margin-top: -30px;
			cursor: pointer;
			z-index: 2;
				.innerBtn{
					width: 40px;
					height: 60px;
					font-size: 25px;
					line-height: 63px;
					text-align: center;
					color: #fff;
					display: block;
					position: relative;
					z-index: 1;
					background: #2f3837;
					.transition(all 0.3s ease);
				}
				.slidesCounter{
					width: 40px;
					height: 60px;
					background: #2f3837;
					display: block;
					position: absolute;
					top: 0;
					color: #fff;
					text-align: center;
					font-size: 16px;
					line-height: 60px;
					.transition(all 0.3s ease);
				}
				&.parallaxPrevBtn{
					left: 0;
						.innerBtn{
							border-radius: 0;
						}
						.slidesCounter{
							left: 0%;
							border-radius: 0;
						}
						&:hover{
							.innerBtn{
								background: #ff5434;
								border-radius: 0;
							}
							.slidesCounter{
								left: 100%;
							}
						}
				}
				&.parallaxNextBtn{
					right: 0;
						.innerBtn{
							border-radius: 0;
						}
						.slidesCounter{
							right: 0%;
							border-radius: 0;
						}
						&:hover{
							.innerBtn{
								background: #ff5434;
								border-radius: 0;
							}
							.slidesCounter{
								right: 100%;
							}
						}
				}
		}
		#paralaxSliderPagination{
			position: absolute;
			bottom: 5%;
			width: 100%;
			text-align: center;
			z-index: 2;
				ul{
					list-style: none;
					margin: 0;
						li{
							width: 10px;
							height: 10px;
							display: inline-block;
							margin: 3px;
							border-radius: 10px;
							border: 2px solid #ff5434;
							cursor: pointer;
							.transition(all 0.5s ease);
								&:hover{
									background: #fff;
								}
								&.active{
									background: #fff;
								}
						}
				}
		}
		#previewSpinner{
			position: absolute;
			width: 50px;
			height: 50px;
			display: block;
			top: 50%;
			left: 50%;
			margin-left: -25px;
			margin-top: -25px;
			border-radius: 25px;
			z-index: 99;
			background: url(images/spinner.gif) 50% 50% no-repeat #08C;
		}
}
@media (max-width: 767px) {
	.parallax-slider{
		height: 300px;
		#mainCaptionHolder{
				.container{
					top: 30%;
				}
			}
	}
}
@media (max-width: 650px) {
	.parallax-slider .controlBtn{
		top: 30px!important;
	}
}