.loginContainer,.logo,.login,.login input{ -webkit-box-sizing:border-box;  -moz-box-sizing:border-box;  -o-box-sizing:border-box;  -ms-box-sizing:border-box;  box-sizing:border-box;   }

.loginContainer{ position:fixed; left:0; top:0; width:100%; height:100%; background:#333c52; } 
/*.loginContainer p{ color:white; text-align:center; text-transform:capitalize; }*/
.loginContainer .img{  
	/* Set up positioning */
	position: absolute;
	top: 0;
	left: 0;
    opacity:0.0;
    z-index:1;
    
	/* Set rules to fill background */
	min-height: 100%;
	min-width: 1024px;
			
	/* Set up proportionate scaling */
	width: 100%;
	height: auto; 
} 
.loginContainer  .img.active {
    z-index:10;
    opacity:1.0;
} 
.loginContainer  .img.last-active {
    z-index:9;
}
 
@media screen and (max-width: 1024px){
	.loginContainer .img{
        width: auto;
        height: 100%;
        left: 50%;
        margin-left: -512px; 
    }
}

.footer,.logo{ text-shadow:0 1px 0 rgba(0,0,0,.3); }

.loginContainer,.logo{ -webkit-user-select:none; -moz-user-select:none; -o-user-select:none; -ms-user-select:none; user-select:none; }


.logo{ position:relative; margin:0 3em; top:6%; color:white; font-weight:bold; font-size:1.5em; letter-spacing: .1em;}
.logo img{ height:2.0em; vertical-align:middle; margin:0 5px 0 0; } 

.logo.center{ text-align:center;top:15%; font-size:2.3em;}
.logo.center img{ height: 1.2em; }

@media screen and (max-width: 640px) {

    .logo {
        margin: 0 0.1em;
    }
}

.login{z-index:999; position:fixed; width:300px; padding:2em 1em; background:rgba(255,255,255,.5); border-radius:.2em; right:6%; top:50%; margin:-150px 0; /*right:0%; top:50%;-webkit-transform:translate(-20%, -50%); -moz-transform:translate(-20%, -50%); -o-transform:translate(-20%, -50%); -ms-transform:translate(-20%, -50%); transform:translate(-20%, -50%);*/ }
.login input{ -webkit-transition:border 200ms ease; -moz-transition:border 200ms ease; -o-transition:border 200ms ease; -ms-transition:border 200ms ease; transition:border 200ms ease;  }
.login button{ -webkit-transition:background 200ms ease; -moz-transition:background 200ms ease; -o-transition:background 200ms ease; -ms-transition:background 200ms ease; transition:background 200ms ease;  }
.login button{ cursor:pointer; }
 .login .validCode { width: 105px;float: left; }
 .login .reload-vify {  float: left; }

.login.center{ left:50%; margin:-150px -180px; }
	
.login.gray{ background:#064066; background:rgba(6,64,102,.6);  color:white; border:solid 8px rgba(23, 67, 113, 0.1); } 
.login.gray input{ background:none; color:white; /*border-color:#2577a3;*/ border-color:#aaa; } 
.login.gray input:focus ~ span{ color:white; } 
.login.gray input:focus{ border-color:white; } 
.login.gray button{ background:rgba(10,127,181,.5); border:solid 1px #20a0fe;  } 
.login.gray button:hover{ background:#20a0fe; } 

.login.gray input:focus::-webkit-input-placeholder{ color:white; } 
.login.gray input:focus::-moz-placeholder{  color:white; } 
.login.gray input:focus:-ms-input-placeholder{ color:white; } 

.login.gray input::-webkit-input-placeholder{ color:#ccc; } 
.login.gray input::-moz-placeholder{  color:#ccc; } 
.login.gray input:-ms-input-placeholder{ color:#ccc; } 
  
.login.gray #slider{ background:rgba(120, 120, 120, .75); color:white;}
	
	
.login h3{ font-weight:normal;  }

.login ul{ padding:1em 0;  font-size:.9em; }
.login ul li{ padding:8px 0; position:relative; min-height:40px; }	
.login ul li i{ position:absolute; left:.7em; top:1.6em; color:silver; } 

.login ul li:last-child{ padding:0; }

.login input{ width:100%; padding:.8em .8em .8em 2em; border:solid 1px silver; border-radius:.3em; }
.login input:focus{ border-color:gray; }
.login input:focus ~ span{ color:gray; }

.login button{ font-size:1.1em; width:100%; padding:.5em 0; background:#41a7e0; color:white; border-radius:.2em; }
.login button:hover{ background:#1b2b36; }
	

.login input::-webkit-input-placeholder{ text-transform:uppercase; }
.login input::-moz-placeholder{ text-transform:uppercase;  }
.login input:-ms-input-placeholder{ text-transform:uppercase; }

.footer{ position:fixed; left:0; bottom:0; width:100%; text-align:center; color:white; text-transform:capitalize; font-size:.8em;  }
.footer p{ padding:2em 0; } 
.footer a{ color:white; } 

/* Outer css */
.ani{transition:all .3s;}
.wrap{ width:300px; text-align:center;}
.inner{ padding:15px; }
.clearfix{ overflow:hidden; _zoom:1; }
.none{ display:none; }
#slider{ position:relative; border:solid 1px rgba(255,255,255,.2); background-color:#e8e8e8; width:calc(100% - 2px); height:34px; line-height:32px; text-align:center; overflow:hidden; border-radius:.3em; }
#slider .handler{position:absolute;top:0px;left:0px;width:40px;height:100%;cursor:move;}
.handler_bg{ background:#fff url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NTc3MiwgMjAxNC8wMS8xMy0xOTo0NDowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo0ZDhlNWY5My05NmI0LTRlNWQtOGFjYi03ZTY4OGYyMTU2ZTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NTEyNTVEMURGMkVFMTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NTEyNTVEMUNGMkVFMTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo2MTc5NzNmZS02OTQxLTQyOTYtYTIwNi02NDI2YTNkOWU5YmUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NGQ4ZTVmOTMtOTZiNC00ZTVkLThhY2ItN2U2ODhmMjE1NmU2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+YiRG4AAAALFJREFUeNpi/P//PwMlgImBQkA9A+bOnfsIiBOxKcInh+yCaCDuByoswaIOpxwjciACFegBqZ1AvBSIS5OTk/8TkmNEjwWgQiUgtQuIjwAxUF3yX3xyGIEIFLwHpKyAWB+I1xGSwxULIGf9A7mQkBwTlhBXAFLHgPgqEAcTkmNCU6AL9d8WII4HOvk3ITkWJAXWUMlOoGQHmsE45ViQ2KuBuASoYC4Wf+OUYxz6mQkgwAAN9mIrUReCXgAAAABJRU5ErkJggg==") no-repeat center;}
.handler_ok_bg{ background:#fff url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NTc3MiwgMjAxNC8wMS8xMy0xOTo0NDowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo0ZDhlNWY5My05NmI0LTRlNWQtOGFjYi03ZTY4OGYyMTU2ZTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDlBRDI3NjVGMkQ2MTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDlBRDI3NjRGMkQ2MTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDphNWEzMWNhMC1hYmViLTQxNWEtYTEwZS04Y2U5NzRlN2Q4YTEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NGQ4ZTVmOTMtOTZiNC00ZTVkLThhY2ItN2U2ODhmMjE1NmU2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+k+sHwwAAASZJREFUeNpi/P//PwMyKD8uZw+kUoDYEYgloMIvgHg/EM/ptHx0EFk9I8wAoEZ+IDUPiIMY8IN1QJwENOgj3ACo5gNAbMBAHLgAxA4gQ5igAnNJ0MwAVTsX7IKyY7L2UNuJAf+AmAmJ78AEDTBiwGYg5gbifCSxFCZoaBMCy4A4GOjnH0D6DpK4IxNSVIHAfSDOAeLraJrjgJp/AwPbHMhejiQnwYRmUzNQ4VQgDQqXK0ia/0I17wJiPmQNTNBEAgMlQIWiQA2vgWw7QppBekGxsAjIiEUSBNnsBDWEAY9mEFgMMgBk00E0iZtA7AHEctDQ58MRuA6wlLgGFMoMpIG1QFeGwAIxGZo8GUhIysmwQGSAZgwHaEZhICIzOaBkJkqyM0CAAQDGx279Jf50AAAAAABJRU5ErkJggg==") no-repeat center;}
#slider .drag_bg{background-color:#7ac23c; height:100%; width:0px;}
#slider .drag_text{position:absolute;top:0px; width:100%; height:100%; -moz-user-select:none;-webkit-user-select:none;user-select:none;-o-user-select:none;-ms-user-select:none;}
.unselect{-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;}
.slide_no{color: #635e5e;}
.slide_ok{color:#fff;}