body, html  { height: 100%}
html, body, div, span, applet, object, iframe,
blockquote, pre, a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
caption{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	}
body { line-height: 1}
ol, ul { list-style: none}
blockquote, q { quotes: none}
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none}
:focus { outline: 0}
del { text-decoration: line-through}

/*----------------------------------------------*/
/* 3.0 General Styles */
/*----------------------------------------------*/
html{-webkit-text-size-adjust: none;}
body {
  font-family: 'Open Sans', sans-serif, Arial, sans-serif;
  font-smoothing: antialiased;
  font-weight: normal;
  background: #151618;
  color: #FFF;
  margin: 0;
  text-align:center;
  overflow: hidden; 
}

h1 {
  text-transform: uppercase;
  letter-spacing: 4px;
  font-weight: normal;
  font-size: 22px;
}

h2 {
  text-transform: uppercase;
  letter-spacing: 5px;
  font-size: 24px;
  margin:0;
  text-align:center;
  color:#f1ca00;
}

p {
  line-height: 1.2em;
  text-align: center;
  font-size: 15px;
  color:#fff;
}

a {
  transition: color 0.2s ease-out;
  color: #fff;
  text-decoration:underline;
}

a:hover {
  color: #fff;
}

h2 span{margin:0px;}

/*----------------------------------------------*/
/* 4.0 Content Styles */
/*----------------------------------------------*/
.brand-name {
	max-width:550px;
	min-width:300px;
	width: 40%; 
	margin:10px auto 0 auto;

	
}
.brand-name img{
	width:80%;
}

.container {
  position: relative;
  width: 100%;
  z-index:9999;
}

.content{
	max-width:550px;
	min-width:300px;
	width: 40%; margin:0 auto 0 auto;
	color: #fff;
	text-shadow: 0 1px #000;
	background: #000 url(../images/backbg.png) repeat;
	
	-webkit-box-shadow: 0px 0px 6px 1px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 0px 6px 1px rgba(0,0,0,0.75);
	box-shadow: 0px 0px 6px 1px rgba(0,0,0,0.75);
}
.box_form{
	width:100%;
	border-radius:5px;
	padding:30px 0;
	border:1px solid #3e3e3e;
	/*background: url("../images/light.png") no-repeat center top;*/
	background-size:200% 100%;
	-moz-box-shadow: 0 .125em .125em rgba(0,0,0,.09), inset 0 .0625em 0 rgba(255,255,255,.5);
	-webkit-box-shadow: 0 .125em .125em rgba(0,0,0,.09), inset 0 .0625em 0 rgba(255,255,255,.5);
	box-shadow: 0 .125em .125em rgba(0,0,0,.09), inset 0 .0625em 0 rgba(255,255,255,.5);
}

a.btn_playdemo{
  padding:10px 35px 6px;
  margin:20px 0 10px 0;

  text-decoration:none;
  display:inline-block;
  -moz-border-radius: 3px;
  border-radius: 3px;
    cursor: pointer;

  color: #000;
	text-shadow: 0 .0625em .0625em #FFDD9F;
	border: 1px solid #cfa32e;
	background-color: #f1c243;
	-moz-box-shadow: 0 .125em .125em rgba(0,0,0,.09), inset 0 .0625em 0 rgba(255,255,255,.5);
	-webkit-box-shadow: 0 .125em .125em rgba(0,0,0,.09), inset 0 .0625em 0 rgba(255,255,255,.5);
	box-shadow: 0 .125em .125em rgba(0,0,0,.09), inset 0 .0625em 0 rgba(255,255,255,.5);
	background-image: -moz-linear-gradient(bottom, #e2aa23 0%, #ffd564 100%);
	background-image: -o-linear-gradient(bottom, #e2aa23 0%, #ffd564 100%);
	background-image: -webkit-linear-gradient(bottom, #e2aa23 0%, #ffd564 100%);
	background-image: linear-gradient(bottom, #e2aa23 0%, #ffd564 100%);
}

a:hover.btn_playdemo{
	-moz-box-shadow: inset 0 2px 3px rgba(0,0,0,.2);
	-webkit-box-shadow: inset 0 2px 3px rgba(0,0,0,.2);
	box-shadow: inset 0 2px 3px rgba(0,0,0,.2);
	background-image: -moz-linear-gradient(bottom, #ffd564 0%, #e9b937 100%);
	background-image: -o-linear-gradient(bottom, #ffd564 0%, #e9b937 100%);
	background-image: -webkit-linear-gradient(bottom, #ffd564 0%, #e9b937 100%);
	background-image: linear-gradient(bottom, #ffd564 0%, #e9b937 100%);
}

/*----------------------------------------------*/
/* 5.0 Footer */
/*----------------------------------------------*/
.footer {padding:20px 10px 0px;}
.footer .handle {
  font-style: italic;
  text-decoration:none;
  text-transform: uppercase;
  font-size: 11px;
}

/*----------------------------------------------*/
/* 6.0 Background Images */
/*----------------------------------------------*/
.mask {
position:fixed;
z-index:999;
top:0;
left:0;
bottom:0;
right:0;
background-color: rgba(0,0,0,.8);
}

.image-grid {
position:fixed;
overflow:hidden;
z-index:9;
width:100%;
height:100%;
top:0;
}

.image-grid ul {
display:block;
width:100%;
zoom:1;
margin:0;
padding:0;
}

.image-grid ul:before,.image-grid ul:after {
content:'';
display:table;
}

.image-grid ul:after {
clear:both;
}

.image-grid ul li {
-webkit-perspective:400px;
-moz-perspective:400px;
-o-perspective:400px;
-ms-perspective:400px;
perspective:400px;
float:left;
position:relative;
display:block;
overflow:hidden;
background:#000;
margin:0;
padding:0;
}

.image-grid ul li a {
display:block;
outline:0;
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
-webkit-backface-visibility:hidden;
-moz-backface-visibility:hidden;
-o-backface-visibility:hidden;
-ms-backface-visibility:hidden;
backface-visibility:hidden;
-webkit-transform-style:preserve-3d;
-moz-transform-style:preserve-3d;
-o-transform-style:preserve-3d;
-ms-transform-style:preserve-3d;
transform-style:preserve-3d;
-webkit-background-size:100% 100%;
-moz-background-size:100% 100%;
background-size:100% 100%;
background-position:center center;
background-repeat:no-repeat;
background-color:#333;
-webkit-box-sizing:content-box;
-moz-box-sizing:content-box;
box-sizing:content-box;
}


.validation_demo{
	margin: 0 auto;
	
}


.validation_demo img{
	width:125px; height:36px;
	border-radius:4px;
	margin-bottom:4px;
	-webkit-box-shadow: 0px 0px 3px 1px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 0px 3px 1px rgba(0,0,0,0.75);
	box-shadow: 0px 0px 3px 1px rgba(0,0,0,0.75);
}

.validation_demo input[type=text] {
	margin: 0 auto;
	width: 127px; 
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	background: rgba(0,0,0,.5);
	border: 1px solid #555;
	color: #fff;
	font-size:20px; font-weight:bold;
	vertical-align:middle;
	text-align:center;
	padding:5px 0 8px 0;
	-webkit-box-shadow: 0px 0px 3px 1px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 0px 3px 1px rgba(0,0,0,0.75);
	box-shadow: 0px 0px 3px 1px rgba(0,0,0,0.75);
}

.validation_demo input[type=text]:focus {
	
    outline: 0;
    /* IE6-9 */
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(240,255,0,.6);
    -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(240,255,0,.6);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(240,255,0,.6);
}

.error_mes p{
 margin:0 auto;
 position: relative;
 text-align:center; display:block;
 color:#F00 !important;
}

.loader {
    display:    none;
    position:   fixed;
    z-index:    1000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: #000000
url('../images/ajax-loader.gif')                 50% 50% 
                no-repeat;
    opacity: 0.5;
}

body.loading {
    overflow: hidden;   
}

body.loading .loader {
    display: block;
}