@charset "UTF-8";
html, body { overflow: hidden;}
*{margin:0;padding:0;}
body{
	width:100%;
	height:100%;
	background-image: url("../images/inflicted.png");
    background-repeat: repeat;
	}
::-webkit-scrollbar {
    width: 12px;
	height:12px;
}
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 10px;
}
::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
	background-color:rgba(0,0,0,0.2);
}
::-webkit-scrollbar-thumb:hover {
	background-color:rgba(0,0,0,0.4);
}
#grad {
position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background: -webkit-linear-gradient(
						top,
						rgba(0,0,0,1) 85%,
						rgba(0,0,0,0.3) 20%, 
						rgba(40,40,40,0) 0%
						); /*Safari 5.1-6*/
  background: -o-linear-gradient(
						bottom,
						rgba(40,40,40,0) 0%, 
						rgba(0,0,0,0.3) 20%, 
						rgba(0,0,0,1) 85%
						); /*Opera 11.1-12*/
  background: -moz-linear-gradient(
						bottom,
						rgba(40,40,40,0) 0%, 
						rgba(0,0,0,0.3) 20%, 
						rgba(0,0,0,1) 85%
						); /*Fx 3.6-15*/
  background: linear-gradient(
						to bottom, 
						rgba(40,40,40,0) 0%, 
						rgba(0,0,0,0.3) 20%, 
						rgba(0,0,0,1) 85%
						); /*Standard*/
}
#wrapper{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	
	}
#content{
	position:relative;
	width:300px;
	/*height:80px;*/
	margin:60px auto 0 auto;
	}	
#preloader{
	position:relative;
	width:72px;height:72px;
	margin:70px auto 0 auto;
	}
h1{
	font-size:46pt;
	letter-spacing: -2px;
	font-family: 'Roboto', sans-serif; font-weight:400 ;
	color:white;
	}
h1:first-letter{font-size:50pt;}
.blue{
	color:#1EB4FF; 
	font-size:50pt; 
	letter-spacing: -5px;
}
h5{
	font-size:16pt;
	color:#1EB4FF;
	font-family: 'Pragati Narrow', sans-serif; font-weight:400 ;
	text-align:center;
	margin:0 auto 0 auto;
	padding:0;
	}
#build{
	position:relative;
	width:75%;
	height:100px;
	margin:20px auto 0 auto;
	}
#build p{
	color:#EAEAEA;
	font-size:22pt;
	font-family: 'Pragati Narrow', sans-serif;
	text-align:center;
	line-height:100%;
	padding:0;
	margin:0;
	}
.dispo{
	font-size:26pt;
	}
#counter {
	width: 400px;
	color: #fff;
	text-align: center;
	margin: 18px auto 0;
}
#counter span {
	font: 40px/1em 'Roboto', sans-serif;
	display: block;
	padding: 12px 0 30px;
	min-width: 24%;
	float: left;	
	text-shadow: 0px 1px 3px rgba(0, 0, 0, .5);	
	border-left: 1px dotted rgba(255, 255, 255, .5);	
}
#counter span:first-child { border-left: none; }
#counter span em {
	font: 11px/18px 'Roboto', sans-serif;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	margin-top: 12px;	
	display: block;
	color: #BCBCBC;
	color: rgba(255, 255, 255,.6);
	text-shadow: 0px 1px 2px rgba(0, 0, 0, .7);	
}
.cf:before,
.cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
footer{
	display:block;
	position:fixed;
	left:0;
	bottom:0;
	width:100%;
	height:40px;
	background-color:#1EB4FF;
	}
footer p{
	color:white;
	font-family: 'Roboto', sans-serif;
	font-size:13pt;
	text-align:center;
	line-height:100%;
	margin:12px 5% 0 5%;
	}
footer p a:link { color: white;text-decoration:none; }	
footer p a:visited { color: white; } 
footer p a:hover   { color: white; text-decoration:underline;}   
.text{
	font-family: 'Roboto', sans-serif;
	font-family: 'Pragati Narrow', sans-serif;
	}	
@media only screen and (max-width:645px ){
html, body{
	height:660px;
	}
#wrapper{
	overflow-x:hidden;
	position:aboslute;
	overflow-y:auto;
	width:100%;
    }	
footer p{
	font-size:12pt;
	margin:8px 2% 0 2%;
	}
}
@media only screen and (max-width:520px ) and (max-height:660px){
#counter {
	width: 360px;
	color: #fff;
	text-align: center;
	margin: 18px auto 0;
}
footer{
	display:block;
	position:relative;
	width:100%;
	height:40px;
	background-color:#1EB4FF;
	}
footer p{
	color:white;
	font-family: 'Roboto', sans-serif;
	font-size:12pt;
	text-align:center;
	line-height:100%;
	margin:8px 5% 0 5%;
	padding-top:5px;
	}
}
@media only screen and (max-height:600px){
html, body{
	height:660px;
	}
#wrapper{
	overflow-x:hidden;
	position:aboslute;
	overflow-y:auto;
	width:100%;
    }	
#content{
	position:relative;
	margin:15px auto 0 auto;
	}	
#preloader{
	position:relative;
	margin:30px auto 0 auto;
	}
footer{
	display:block;
	position:relative;
	width:100%;
	height:40px;
	background-color:#1EB4FF;
	}
footer p{
	padding-top:10px;
	font-size:11pt;
}
@media only screen and (max-width:500px){
footer p{
	padding-top:7px;
	font-size:11pt;
}
@media only screen and (max-width:340px){
#content{
	position:relative;
	width:260px;
	margin:20px auto 0 auto;
	}		
h1{
	font-size:36pt;
	letter-spacing: -2px;
	font-family: 'Roboto', sans-serif; font-weight:400 ;
	color:white;
	}
h1:first-letter{font-size:42pt;}
.blue{
	color:#1EB4FF; 
	font-size:42pt; 
	letter-spacing: -7px;
}
h5{
	font-size:14pt;
	color:#1EB4FF;
	font-family: 'Pragati Narrow', sans-serif; font-weight:400 ;
	text-align:center;
	margin:0 auto 0 auto;
	padding:0;
	}
#build{
	position:relative;
	width:75%;
	height:100px;
	margin:20px auto 0 auto;
	}
#build p{
	color:#EAEAEA;
	font-size:18pt;
	font-family: 'Pragati Narrow', sans-serif;
	text-align:center;
	line-height:100%;
	padding:0;
	margin:0;
	}
.dispo{
	font-size:22pt;
	}
#counter {
	width: 320px;
	color: #fff;
	text-align: center;
	margin: 18px auto 0;
}
#counter span {
	min-width: 22%;
	float: left;	
	border-left: 1px dotted rgba(255, 255, 255, .5);	
}
footer p{
	padding-top:7px;
	font-size:10pt;
}	
}