/*--------------------------------------------------
	Showcase Slider
---------------------------------------------------*/	

	#showcase-holder {
		width:100%;
		height:100vh;
		position:fixed;
		overflow:hidden;
		box-sizing:border-box;
		z-index:2;
	}
	
	#showcase-holder.disabled {
		pointer-events:none;
	}

	#showcase-slider {
		height: 100%;
		width: 100%;
	}
	
	.scale-up #showcase-slider {
		cursor:grabbing!important;
	}
	
	.swiper-slide {
		text-align: center;
        font-size: 18px;
        background: transparent;
        width: auto!important;
		padding:0 80px;
		box-sizing:border-box;
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;		
		opacity:0;
	}
	
	.split-slider .swiper-slide {
		-webkit-transform: translateX(500px);
		transform: translateX(500px);
	}
	
	.split-slider .swiper-slide.swiper-slide-prev {
		-webkit-transform: translateX(0px);
		transform: translateX(0px);
	}
	
	.centered-slider .swiper-slide {
		-webkit-transform: scale(1.1);
		transform: scale(1.1);
	}
	
	.centered-slider .swiper-slide.swiper-slide-prev, .centered-slider .swiper-slide.swiper-slide-next {
		-webkit-transform: scale(1.2);
		transform: scale(1.2);
	}
	
	.centered-slider .swiper-slide.swiper-slide-active {
		-webkit-transform: scale(1.3);
		transform: scale(1.3);
	}	
	
	.slide-title {
		font-size:80px;
		line-height:90px;
		color:#000;
		font-weight:600;
		position:relative;
	}
	
	.light-content .slide-title {
		color:#fff;
	}
	
	.slide-title::before {
		position: absolute;
		font-size:12px;
		font-weight:500;
		line-height:10px;
		width:20px;
		top: 12px;
		left:-30px;
		content: attr(data-number);
	}
	
	.slide-title span {
		position:relative;
		color:transparent;
		-webkit-text-stroke: 1px #000;
		-webkit-transition: color 0.2s ease-in-out;
		transition: color 0.2s ease-in-out;
	}
	
	.light-content .slide-title span {
		color:transparent;
		-webkit-text-stroke: 1px #fff;
	}
	
	.slide-title span {
		display: inline-block;
		margin: 0;
		min-width: 30px;
		width:auto;
		line-height: 50px;
		height: 50px;
		box-sizing: border-box;
	}
	
	.swiper-slide.active span {
		color:#000;
	}
	
	.light-content .swiper-slide.active span {
		color:#fff;
	}
	
	#external-caption {
		position:fixed;
		left:80px;
		top:70vh;
		z-index:10;
		width:calc(35% - 240px);
		opacity:0;
		-webkit-transform: translateX(150px);
		transform: translateX(150px);
		pointer-events:none;		
	}
	
	#external-caption:before {
		content:'';
		position:absolute;
		width:20px;
		height:2px;
		background-color:#000;
		left:0;
		top:-20px;
	}
	
	.light-content #external-caption:before {
		background-color:#fff;
	}
	
	#external-caption .slide-caption {
		position:absolute;
		left:0;
		top:0;
		font-size:12px;
		line-height:24px;
		color:#000;
		font-weight:600;
		opacity:0;
		overflow: hidden;
	}
	
	.light-content #external-caption .slide-caption {
		color:#fff;
	}
	
	#external-caption .slide-caption:first-child {
		opacity:1;
	}
	
	.centered-slider .slide-caption {
		position:absolute;
		font-size:12px;
		line-height:24px;
		color:#000;
		font-weight:600;
		opacity:0;
		padding:0 90px;
		width:100%;
		left:0;
		top:48%;
		box-sizing:border-box;
		-webkit-transform: translateY(130px);
		transform: translateY(130px);
		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
	}
	
	.light-content .centered-slider .slide-caption {
		color:#fff;
	}
	
	.centered-slider .swiper-slide:hover .slide-caption {
		opacity:1;
		-webkit-transform: translateY(100px);
		transform: translateY(100px);
	}
	
	.centered-slider .slide-caption:before {
		content:'';
		position:absolute;
		width:20px;
		height:2px;
		background-color:#000;
		left:50%;
		margin-left:-10px;
		top:-20px;
	}
	
	.light-content .centered-slider .slide-caption:before {
		background-color:#fff;
	}
	
	.slide-subtitle span::before {
		position: absolute;
		width:140px;
		top: 100%;
		left:0;
		content: attr(data-hover);
	}
	
	#image-slider {
		width:100%;
		height:100vh;
		position:fixed;
		top:0;
		right:0;
		overflow:hidden;
		opacity:0;
		border-radius:0px;		
	}
	
	.split-slider #image-slider {
		left:36%;
		width:100%;
		-webkit-transform: translateX(50%) scale(1.1);
		transform: translateX(50%) scale(1.1);
	}
	
	.split-slider #image-slider .image-slider-wrapper {
		-webkit-transform: translateX(-18%);
		transform: translateX(-18%);
	}
	
	.split-slider.full #image-slider {
		width:100%;
		left:0;
		-webkit-transform: translateX(15%) scale(1.1);
		transform: translateX(15%) scale(1.1);
	}
	
	.split-slider.full #image-slider .image-slider-wrapper {
		-webkit-transform: translateX(0%);
		transform: translateX(0%);
	}
	
	.centered-slider #image-slider {
		width:100%;
		-webkit-transform: scale(0.8);
		transform: scale(0.8);
		border-radius:4px;
		-webkit-box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.7);
		box-shadow: 0px 0px 50px 0px rgba(0,0,0,0.7);
	}
	
	.image-slider-wrapper {
		position: absolute;
		height: 100%;
		width: 100%;
	}
	
	#image-slider::after {
		content: "";
		width: 100%;
		height: 60%;
		position: absolute;
		bottom: 0;
		left: 0;
		pointer-events: none;
		background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.5) 100%);
		background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 100%);
		background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 );
	}
	
	#image-slider .slider-img {
		position: absolute;
		height:100%;
		width:100%;
		background-size:cover;
		background-position:center center;
		background-color:#222;
		visibility:hidden;
		top: 0;
		left: 0;
		z-index: 0;
		opacity: 0;
		-webkit-transform: scale(1.03);
		transform: scale(1.03);
		-webkit-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;		
	}
	
	#image-slider .slider-img.active {
	  opacity: 1;
	  visibility: visible;
	  -webkit-transform: scale(1);
		transform: scale(1);
	}	
	
/*--------------------------------------------------
	Project Page Navigation
---------------------------------------------------*/	
	
	#project-nav {
		height: 50vh;
		width: 100%;
		color: #000;
		position: absolute;
		margin-bottom: 0;
		bottom: -48vh;		
	}
	
	.light-content #project-nav {
		color: #fff;
	}
	
	.next-project-wrap {
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		height: 100%;
		overflow: hidden;
		z-index: 3;
	}
	
	.next-project-image {
		position: absolute;
		top: 100%;
		left: 0;
		height: 100vh;
		width: 100%;
		background-size: cover;
		background-position:center center;
		background-repeat: no-repeat;
		opacity:0.8;
		-webkit-transform: scale(1) translateY(0%);
		transform: scale(1) translateY(0%);
	}
	
	.next-project-image::after {
		content: "";
		width: 100%;
		height: 60%;
		position: absolute;
		bottom: 0;
		left: 0;
		pointer-events: none;
		background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.5) 100%);
		background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 100%);
		background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 );
	}
	
	
	.next-project-title {
		position: absolute;
		z-index: 2;
		top: 50%;
		transform: translateY(-50%);
		width: 100%;
		height: 90px;
		text-align: center;
		cursor: pointer;
		margin: 0 auto;
		padding: 0 20px;
		box-sizing: border-box;
		max-width: 800px;
		left: 0;
		right: 0;
	}

	.main-title {
		font-size:80px;
		line-height:90px;		
		color:#000;
		-webkit-text-stroke: 1px #000;
		font-weight:600;
		position:relative;
		margin-left:-4px;
		-webkit-transform: translateY(15px);
		transform: translateY(15px);
		-webkit-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	.light-content .main-title {
		color:#fff;
		-webkit-text-stroke: 1px #fff;
	}
	
	.main-title span {
		color:transparent;
	}
	
	.next-project-title:hover .main-title {
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
	}
	
	.main-subtitle {
		font-size: 12px;
		font-weight: 600;
		line-height: 20px;
		color: #000;
		-webkit-transform: translateY(80px);
		transform: translateY(80px);
		opacity:0;
		-webkit-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	.light-content .main-subtitle {
		color: #fff;
	}
	
	.main-subtitle:before {
		content:'';
		position:absolute;
		width:20px;
		height:2px;
		background-color:#000;
		left:50%;
		margin-left:-10px;
		top:-20px;
	}
	
	.light-content .main-subtitle:before {
		background-color:#fff;
	}
	
	.next-project-title:hover .main-subtitle {
		-webkit-transform: translateY(40px);
		transform: translateY(40px);
		opacity:1;
	}


/*--------------------------------------------------
	Responsive
---------------------------------------------------*/	

@media only screen and (max-width: 1466px) {	

	.swiper-slide {
    	padding: 0 60px;
	}
	
	#external-caption {
		left: 60px;
		width: calc(35% - 120px);
	}
	
	.centered-slider .slide-caption {
		padding:0 70px;
	}

}

@media only screen and (max-width: 1024px) {	

	.swiper-slide {
    	padding: 0 50px;
	}
	
	#external-caption {
		left: 50px;
		width: calc(35% - 100px);
	}
	
	.centered-slider .slide-caption {
		padding:0 60px;
	}

	
	.slide-title {
		font-size: 60px;
		line-height: 70px;
	}
	
	.next-project-title {
    	height: 70px;
	}
	
	.main-title {
		font-size: 60px;
		line-height: 70px;
	}
	
}

@media only screen and (max-width: 767px) {
	
	
	.swiper-slide {
    	padding: 0 40px;
	}
	
	.split-slider .swiper-slide {
		-webkit-transform: translateX(300px);
		transform: translateX(300px);
	}
	
	#external-caption {
		left: 40px;
		width: calc(50% - 80px);
	}
	
	.centered-slider .slide-caption {
		padding:0 30px;
	}
	
	.slide-title {
		font-size: 40px;
		line-height: 50px;
	}
	
	.split-slider #image-slider {
		left:0%;
	}
	
	.split-slider #image-slider .image-slider-wrapper {
		-webkit-transform: translateX(0);
		transform: translateX(0);
	}
	
	.centered-slider #image-slider {
		-webkit-transform: scale(0.8) !important;
		transform: scale(1) !important;
	}
	
	.next-project-title {
    	height: 50px;
	}
	
	.main-title {
		font-size: 40px;
		line-height: 50px;
		-webkit-transform: translateY(0px);
		transform: translateY(0px);	
	}
	
	.main-subtitle {
		display:none;
	}
	
}

@media only screen and (max-width: 479px) {
	
	.swiper-slide {
    	padding: 0 20px;
	}
	
	.split-slider .swiper-slide {
		-webkit-transform: translateX(200px);
		transform: translateX(200px);
	}
	
	.slide-title::before {
		display: none;
	}
	
	#external-caption {
		left: 20px;
		width: calc(100% - 40px);
		-webkit-transform: translateX(100px);
		transform: translateX(100px);
	}
	
	.centered-slider .slide-caption {
		padding:0 10px;
	}
		
}			
	