/* The box-sizing method */
* {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

html {
	height: 100%;
}

.clear {
	clear: both;
}


/* =============================================================================
   FONTS
   ========================================================================== */
@font-face {
    font-family: 'helioscondregular';
    src: url('../fonts/helioscondregular-webfont.eot');
    src: url('../fonts/helioscondregular-webfont.eot?#iefix') format('embedded-opentype'),
				url('../fonts/helioscondregular-webfont.svg#helioscondregular') format('svg'),
         url('../fonts/helioscondregular-webfont.woff') format('woff'),
         url('../fonts/helioscondregular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'helioscondbold';
    src: url('../fonts/helioscondbold-webfont.eot');
    src: url('../fonts/helioscondbold-webfont.eot?#iefix') format('embedded-opentype'),
		     url('../fonts/helioscondbold-webfont.svg#helioscondbold') format('svg'),
         url('../fonts/helioscondbold-webfont.woff') format('woff'),
         url('../fonts/helioscondbold-webfont.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'eurostilebold';
    src: url('../fonts/eurostile-bold-webfont.eot');
    src: url('../fonts/eurostile-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/eurostile-bold-webfont.woff2') format('woff2'),
         url('../fonts/eurostile-bold-webfont.woff') format('woff'),
         url('../fonts/eurostile-bold-webfont.ttf') format('truetype'),
         url('../fonts/eurostile-bold-webfont.svg#eurostilebold') format('svg');
    font-weight: normal;
    font-style: normal;

}

/* =============================================================================
   BODY
   ========================================================================== */
   
body {	
	background:#000;
	position: relative;
	overflow-x:hidden;
	overflow-y:auto;
  width:100%;
  margin: 0 auto;
  padding:0;
  color: #fff;
  text-align: center;   
}

/* =============================================================================
   MAIN
   ========================================================================== */
	 
#container {
  position:relative;
	width:100%;		
	padding:0;
	margin:auto;
}
#main {
  position:relative;
	width: 100%;
	height:auto;
  text-align:center;
	margin:auto;
	overflow:hidden;
}


/* =============================================================================
   BACK MOBILE
   ========================================================================== */
#back_mobile {
	display:none;	
}

/* =============================================================================
   LOGO
   ========================================================================== */
#logo {
  position:relative;
	z-index:10;
	margin-top:24px;	
}


/* =============================================================================
   FORMULAIRE ALPHA
   ========================================================================== */
#alpha {
	display:block;
	position: relative;
	margin:auto;
	width:700px;
	margin:20px auto 50px auto;
	font-family: 'helioscondbold', Arial, "Helvetica CY", Helvetica, sans-serif;	
	font-size:18px;
}
#alpha a {
	color:#f39100;
}
#alpha a:hover {
	color:#fff;
}

#alpha-title {
	position: relative;
	z-index:100;
	width:100%;
	height:136px;			
	text-align:center;
	padding:0;
}
#alpha-title h1 {
	position: relative;
	display: inline-block;
	z-index: 11;
	font-family: 'eurostilebold', Arial, "Helvetica CY", Helvetica, sans-serif;	
	font-size:22px;
	font-weight: normal;
	font-style: normal;		
	text-transform:uppercase;	
	color: #fff;
	text-shadow: 2px 2px 2px rgba(0,0,0,.8);		
	margin:0;
	padding:0;
}

#alpha-content {
	position: relative;
	display: inline-block;
	float: left;	
	width: 100%;
	padding:40px 15px 15px 15px;
	margin:0;
	margin-top:-60px;
	-moz-box-shadow: 0px 3px 12px #000; 
	-webkit-box-shadow: 0px 3px 12px #000; 
	box-shadow: 0px 3px 12px #000;
	background: rgba(0,0,0,0.9);
	border: #E99B53 1px solid;
}

#alpha-back {
	width:100%;
	padding:0;
	margin:0;
} 

.alpha-step {
  position:absolute;
	bottom:0px;
	right:0px;
	width:60px;
  text-align:center;
	color:#f39100;
	font-family: 'helioscondbold', Arial, "Helvetica CY", Helvetica, sans-serif;	
	font-size:21px;	
}

/* =============================================================================
   FORM
   ========================================================================== */
.alpha-form {
  position:relative;
	width:100%;
	float:left;
	padding:20px 20px 30px 20px;
  text-align:center;
	margin:auto;
	font-family: 'helioscondregular', Arial, "Helvetica CY", Helvetica, sans-serif;	
}
#alpha-formRegister {
	padding:0;
}

.alpha-form b {
	color:#f39100;  
}
.alpha-form p {
  margin:0;
	padding:0;	
}
.alpha-form p#alpha-txt1 {
	/*margin-bottom:20px;*/
	font-size:19px;
}
.alpha-form p#alpha-txt2 {	
	font-size:17px;
	padding-top:20px;
}
.alpha-form p#alpha-txt2 a {
	font-size:19px;
}
#alpha-login, 
#alpha-email, 
#alpha-captcha, 
#alpha-name, 
#alpha-country, 
#alpha-timezone, 
#alpha-genre, 
#alpha-gamer, 
#alpha-warhammer, 
#alpha-universe, 
#alpha-aboutyou,
#alpha-boardgame, 
#alpha-weekend, 
#alpha-closedalpha, 
#alpha-closedalphaname {
	margin:auto;
	padding:0;
	width:62%;
	height:80px;
	text-align:left;
	display:block;
}

#alpha-aboutyou {
	height:250px;
}


#alpha-captcha {
	text-align:center;
	height:94px;
}
#alpha-captcha div {
	margin:auto;	
}


.alpha-error {
	position:relative;
	float:left;
	width:100%;
	color:#ff0000;
	font-size:14px;
	line-height:15px;
	padding-left:0px;
}
.alpha-form label {
	display:block;
	margin-top:3px;
	color:#fff;
	font-size:16px; 
}
.alpha-form input, .alpha-form textarea, .alpha-form select  {
	width:100%;
	height:36px;
	padding:8px;
	font-size:15px;
	color: #333;
	background: #f1eae8;
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #EEEEEE), to(#FFFFFF));
	background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 25px);
	border: 1px solid #000;
}
::selection {
  background: #f39100; /* WebKit/Blink Browsers */
}
::-moz-selection {
  background: #f39100; /* Gecko Browsers */
}
.alpha-form select {
 background: #f1eae8;
 padding:3px;
 line-height:16px;
 border: 0;
 border-radius: 0;
 -webkit-appearance: none;
 -moz-appearance: none;
 appearance: none;
}

.alpha-form textarea {
	height:200px;
}

.alpha-form input:hover, .alpha-form textarea:hover, 
.alpha-form input:focus, .alpha-form textarea:focus { 
	border: 1px solid #f39100;
}

/* BTN SUBMIT */
.alpha-form input#submit {
	position: relative;
	margin:auto;
	width:200px;
	margin-top:10px; 
	height: 42px;
	cursor: pointer;
	font-family: 'helioscondbold', Arial, "Helvetica CY", Helvetica, sans-serif;	
	font-size:18px;
	line-height:18px;
	font-weight:bold;
	color: #000;
	text-transform:uppercase;
	text-decoration:none;	              
	background:#f39100;  
}
.alpha-form input#submit:hover {
	background:#fff;  
}



/* CHECKBOX */
#alpha-nda {
	 position:relative;
	 float:left;
	 width:100%;
	 margin-bottom:15px;
	 padding:0% 20%;
}
.alpha-form input[type="checkbox"] {
    display:none;
}
.alpha-form input[type="checkbox"] + label span {   
		display:inline-block;
    width:19px;
    height:19px;
    margin:-1px 4px 0 0;
    vertical-align:middle;
    background:url(../img/check.png) left top no-repeat;
    cursor:pointer;
}
.alpha-form input[type="checkbox"]:checked + label span {
    background:url(../img/check.png) left -20px no-repeat;
}
#alpha-nda label  {
	font-size:15px;
}

/* RADIO */
#alpha-weekend, 
#alpha-closedalpha  {
  height:65px;
}
#alpha-weekend input[type="radio"], 
#alpha-closedalpha input[type="radio"] {
  display:none;
}
#alpha-weekend input[type=radio] + label span, 
#alpha-closedalpha input[type=radio] + label span {
	position:relative;
	display:inline-block;	
	cursor:pointer;
	width:15px;
	height:15px;
	float:left;
	background:url(../img/radio.png) left top no-repeat;
	margin-right:4px;
	margin-top:2px;
}
#alpha-weekend input[type=radio]:checked + label span, 
#alpha-closedalpha input[type=radio]:checked + label span {
	background-position: 0 -15px;
}
#alpha-weekend input[type=radio] + label, 
#alpha-closedalpha input[type=radio] + label {
	float:left;
	margin-right:20px;
	cursor:pointer;
}

#alpha-closedalphaname {
	display:none;
}

/* BOUTONS */
#alpha-btnback, #alpha-btnforum {
	position: relative;
	margin:auto;
	width:60%;
	margin-top:20px; 
	height:36px;
	cursor: pointer;
	font-family: 'helioscondbold', Arial, "Helvetica CY", Helvetica, sans-serif;	
	font-size:14px;
	line-height:14px;
	font-weight:bold;
	color: #000;
	text-transform:uppercase;
	text-decoration:none;	              
	background:#f39100; 
	padding-top:10px;	
}
#alpha-btnback {
	width:100px;
}
#alpha-btnforum {
	width:200px;
	text-align:center;
	padding-top:12px;
}
#alpha-btnback i, #alpha-btnforum i {
	font-size: 16px;
	padding:0;
}
#alpha-btnback:hover, #alpha-btnforum:hover {
  background-color: #8B1E1E;
	color:#fff;
}

/* =============================================================================
   HEADER SOCIAL
   ========================================================================== */
#header_social {
	position: fixed;
	top: 30px;
	right:35px;
	width: 25px;
	z-index:20;
}
#header_social a {
	display: block;
	height: 35px;
	width: 35px;	
	-webkit-transition: all 0.1s linear;
	-moz-transition: all 0.1s linear;
    -ms-transition: all 0.1s linear;
    -o-transition: all 0.1s linear;
	transition: all 0.1s linear;
	margin: 0px 0px 10px 0px;
	-webkit-border-radius: 2px 2px 2px 2px;
	border-radius: 2px 2px 2px 2px;
}
#header_social a:hover {
	opacity: 0.8;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
	transition: all 0.2s linear;
}
#header_social a img {
	width: 100%;
	padding: 15%;
}
#header_social .facebook {
	background: #3C5998;
}
#header_social .twitter {
	background: #00ABF0;
}
#header_social .youtube {
	background: #EF2C26;
}




/* =============================================================================
   FOOTER
   ========================================================================== */
#footer {
	max-width: 720px;
	margin: 0px auto 12px auto;
}
#footer img {
	margin: 0px 20px 0px 15px;
}
#legal {
	width: 100%;
	max-width: 700px;
	margin: 10px auto 0px auto;
	font-size: 9px;
	line-height: 12px;
	color: #8d8d8d;
	font-family: Arial, Helvetica;
	padding: 0px 0px 20px 0px;
}

/* =============================================================================
   FOOTER SOCIAL
   ========================================================================== */
#footer_social {	
	display: none;
	position:relative;
	z-index:10;		
	margin:35px 0px 40px 0px;
	border-top: rgba(255,255,255, 0.5) 1px solid;
	border-bottom: rgba(255,255,255, 0.5) 1px solid;
	padding: 10px 15px;
}
#footer_social a {
	margin: 0px 15px;
	color: #fff;
	width: 45px;
	display: inline-block;
	text-decoration: none;
}
#footer_social .icon-facebook {
	font-size: 30px;
}
#footer_social .icon-twitter {
	font-size: 25px;
}
#footer_social .icon-youtube-sign {
	font-size: 30px;
}
#footer_social img {
	margin: 0px 5px;
}
#random{
	position: fixed;
	bottom: 0;
	width: 100%;
	margin: auto;
}