#intro{
	position: fixed ;
	display: block ;
	width: 100% ;
	height: 100% ;
	top: 0px ;
	left: 0px ;
	background: #FFF ;
	z-index: 2000 ;
	overflow: hidden ;
/*	display: none ;*/
}

#intro:after, #intro:before{
	content: "" ;
	position: absolute ;
	display: block ;
	width: 100% ;
	top: 0px ;
	left: 0px ;
	height: 46px ;
	background: rgba( 255, 255, 255, 0.75 ) ;
	z-index: 2 ;
	
	transition: height 0.35s ;
}

#intro:before{
	top: auto ;
	bottom: 0px ;
}

#intro #video_holder{
	position: relative ;
	top: 50% ;
	left: 50% ;
	
	transform: translate( -50%, -50% ) ;
}

#promo{
	width: 100% ;
	height: 100% ;
}

#timeLeft{
	position: absolute ;
	bottom: 5% ;
	right: 12px ;
	font-size: 14px ;
	color: #FFF ;
	
	border-radius: 50% ;
	background-color: rgba( 0, 0, 0, .5 ) ;
	display: inline-block;
	height: 35px ;
	width: 35px ;
	padding-top: 7px ;
	text-align: center ;
	display: none ;
}

#intro .skip{
	position: absolute;
	top: 15px;
	left: 50%;
	transform: translateX( -50% );
	border-radius: 12px;
	font-size: 16px;
	text-transform: uppercase;
	font-family: HN, Arial, Helvetica, sans-serif;
	font-weight: 700;
	color: #008db2;
	cursor: pointer;
	z-index: 3;
	
	transition: font-size 0.35s ;
}

#intro .skip:hover{
	color: #f8b52d;
	transition: color .25s;
}

.circle {
	top:50%;
	left:50%;
	transform: translate( -50%, -50% );
	position:absolute;
	min-width: 100px;
	min-height: 100px;
	background-color: rgba( 128, 128, 128, 0.5 ) ;
	border-radius: 50% ;
	opacity: 0.5 ;
	
	border:0px ;
	cursor: pointer ;
	
	transition: min-width .25s, min-height .25s ;
}

.circle:after{
	content: "";
	left: inherit;
	top: inherit;
	transform: inherit;
	position: absolute;
	font-size: 30px ;
	border-top-style: solid;
	border-left-style: solid;
	border-bottom-style: solid;
	border-top-width: 20px;
	border-left-width: 40px;
	border-bottom-width: 20px;
	border-top-color: transparent;
	border-left-color: #FFF;
	border-bottom-color: transparent;
	
	opacity: 0.5 ;
	
	transition: border-width .25s;
}

.circle:hover, .circle:hover:after{
	opacity: 1 ;
}


@media ( max-width: 915px ){
	.circle{
		min-width: 75px;
		min-height: 75px;	
	}
	
	.circle:after{
		border-top-width: 15px;
		border-left-width: 30px;
		border-bottom-width: 15px;
	}
	
	#intro .skip{
		font-size: 14px ;
	}
	
	#intro:after, #intro:before{
		height: 40px ;
	}
}