.slider__content,
.slider__warpper{
		position:relative;
		width:100%;
		height:100vh;
		}
.flex__container{
		position:absolute;
		top:0;
		left:0;
		display:flex;
		flex-flow:row wrap; 
		justify-content:flex-start;
		width:100%;
		height:100vh;
		z-index:1;
		}	
.flex__container.flex--active{
		z-index:2;
		}	
.flex__item{
		height:100vh;
		color:#FFF;
		transition:transform 0.1s linear;
		}
		
.flex__item--left{
		display:flex;
		align-items:center;
		width:100%;
		transform-origin:left bottom;
		transition:transform 0.2s linear 0.4s;
		opacity:0;
		position:relative;
		overflow:hidden;
		background-size:cover !important;
		background-repeat:no-repeat !important;
		background-position:center center !important;
		}	
.flex--preStart .flex__item--left,
.flex--active .flex__item--left{
		opacity:1;
		}
		
.flex__content{
		margin:0 10%;
		width:70%;
		opacity:1;
		transform:translate3d(0,0,0);
		transition:transform 0.2s linear 0.2s, opacity 0.1s linear 0.2s;
		}
		
/* Animate-START point */
.flex__container.animate--start .flex__content{
		transform:translate3d(0,-200%,0);
		opacity:0;
		}
		
/* Animate-END point */
.flex__container.animate--end .flex__item--left{
		transform:scaleY(0);
		}
		
.flex__container.animate--end .flex__content{
		transform:translate3d(0,200%,0);
		opacity:0;
		}			
.text--big{
		font-size:65px;
		font-weight:400;
		line-height:1.2;
		margin-left:-8px;
		color:#FFF;
		font-family:'Lora', serif;
		}		
.text--normal{
		font-size:22px;
		color:rgba(255, 255, 255, 0.8);
		line-height:22px;
		margin-top:25px;
		}
.text--sub{
		font-size:22px;
		letter-spacing:1.2;
		text-transform:none;
		margin-bottom:40px;
		}
.text--sub a{
		display:inline-block;
		background:rgba(255, 255, 255, 0.8);
		padding:15px 25px;
		color:#555;
		transition:all 1s ease-out;
		font-family:'PT Sans', sans-serif;
		margin:15px 0 0 0;
		}		
.text--sub a:hover{
		color:#555;
		background:rgba(254, 214, 118, 0.8);
		}
			
.slider__navi{
		position:absolute;
		top:50%;
		right:20px;
		transform:translateY(-50%);
		z-index:999;
		}	
.slider__navi a{
		display:block;
		height:6px;
		width:20px;
		margin:20px 0;
		text-indent:-9999px;
		box-shadow:none;
		border:none;
		background:#76AAE6;
		}		
.slider__navi a.active{
		background:#FFF;
		}
		
@media only screen and (max-width:768px){
.text--big{
		font-size:45px;
		margin-left:-5px;
		}	
}
