@charset "utf-8";
/* CSS Document */
html {
	position: relative;
	height: 100%;
}
body {
	margin: 0;
	padding: 0;
	background-color: #333;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	font-family: 'Open Sans', sans-serif;
	font-size: 16px;
	color: #FFFFFF;
	text-align: center;
	height: 100%;
}
.page {
	width: 100%;
	height: 100%;
	background-color:rgba(0,0,0,0.85);
	padding: 30px;
	box-sizing:border-box;

}
h1  {
	font-size: 58px;
	margin-bottom: 0px;
	margin-top: 50px;
}
h1 img {
	width: 80%;
	max-width: 300px;
	height: auto;
}
h3  {
	font-size: 16px;
	letter-spacing: 2px;
	font-weight: 300;
	text-transform: uppercase;
	margin-bottom: 30px;
	margin-top: 50px;
	color:#40b6e9;
 }
.progress-bar{
	height: 50px;
	position: relative;
	max-width: 460px;
	margin: 0 auto 60px;
	color: rgba(255,255,255,0.41);
	font-size: 12px;
}
.progress-bar .bar {
	height: 10px;
	border:1px solid #40b6e9;
	background-color: #171717;
}
.progress-bar .fill {
	height: 10px;
	background-color: #40b6e9;
	width: 95%;
	
	/*Animate*/
	-webkit-animation-duration: 2s;
	animation-duration: 2s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-name: fadeInTint;
	animation-name: fadeInTint;
}
@-webkit-keyframes fadeInTint {
  from {
   width: 0%;
  }
 
  to {
   width: 75%;
  }
}
@keyframes fadeInTint {
  from {
   width: 0%;
  }
 
  to {
   width: 75%;
  }
}
.progress-bar .m0 {
	position: absolute;
	left: 0;
	top: 15px;
}
.progress-bar .m50 {
	position: absolute;
	left: 49%;
	top: 15px;
}
.progress-bar .m100 {
	position: absolute;
	left: auto;
	right: 0;
	top: 15px;
}
h4  {
	font-size: 20px;
	letter-spacing: 1px;
	font-weight: 300;
		margin: 0 0 8px;
}
p  {
	font-size: 14px;
	letter-spacing: 1px;
	font-weight: 300;
	color: #BBBBBB;

}
a {color: #FFF; text-decoration: none;}