*{font-family: 'Roboto',sans-serif; font-weight: 300;}
body{height: 100%;margin: 0; font-family: 'Roboto',sans-serif;}

.wrapper{background: url("/tpl/basic/img/bgi.png") no-repeat 0 60%;-webkit-background-size: cover;background-size: cover;width: 100%;height: 100%;position: absolute;}
.container{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(235,235,235,.3);background-image:  url("/tpl/basic/img/dotted.png");background-repeat: repeat;-webkit-background-size: 603px 609px;background-size: 603px 609px;background-position: 50% -150px;}


.logo {text-align: center; margin: 0px 0 15px 0;height: 100px;}
.form-group{width: 280px;margin: 100px auto 0 auto;text-align: center; background: #00000078; padding: 30px; border-radius: 10px; box-shadow: 0 0 30px 17px #0a0a0a;;}

input[type=text],input[type=password] {padding:15px;border:thin solid #ddd;font-weight: 300;display: inline-block;width: calc(100% - 30px);}
.auth-form > div:not(.auth-err) {margin:15px 0; background: #fa6927;}
.auth-form div:not(.auth-err) > i {color:#555;font-size:12px;display: inline-block;width:30px;text-align: center;}


::-webkit-input-placeholder {color:#8494a7;}
::-moz-placeholder          {color:#8494a7;}
:-moz-placeholder           {color:#8494a7;}
:-ms-input-placeholder      {color:#8494a7;}
input:focus{outline: none;}


input[type=submit] {background: #fa6927; color:#fff;border:0; cursor: pointer;width:100%;padding:15px 0;margin:10px 0}
input[type=submit]:active {background:#d64706;}


.auth-err {background:#cc5d58 !important; color:#fff; padding:15px;font-size: 14px; text-align: left !important;}
.auth-err i {margin:0 5px 0 0; color:#fff !important;}