html,body{height:100%;min-height:100%;font-family: "Lato",Helvetica,Verdana,sans-serif;}
body{background-color:#f5f5f5}
.clear{clear:both}
#parent{width:100%;min-height:100%;height:100%;display:table;text-align:center;background-image:url(../images/login-bg.jpg);background-size:cover;background-repeat:no-repeat;background-position:center}
#content{position:relative;display:table-cell;vertical-align:middle;margin:0;padding:0}
#loginMessage{background-color:rgba(255,255,255,0.7);border-radius:3px;color:#fb8635;font-size:14px;font-weight:400;margin:30px auto auto;line-gheight:25px;text-align:center;padding:20px 0;width:550px}
#center{margin:15px auto;text-align:center;width:650px;position:relative;height:100%}
.base_box{width:550px;margin:auto;background_color:#fff;height:auto}
.box_header{width:100%;height:55px;background-color:#4F4F4F;text-align:left}
.box_header_img{float:left;width:45px;height:45px;margin:5px 20px 5px 5px;background-size:45px;background-position:center;background-repeat:no-repeat}
.box_header_title{color:#FFF;font-size:18px;font-weight:700;display:block;padding-top:10px}
.box_header_subtitle{color:#FFF;font-size:14px;font-weight:300;display:block;line-height:12px}
.box_body{width:100%;margin:auto;background-color:#FFF;padding:40px 0 20px;height:195px}
.loginbutton{background-color:#4285F4;color:#fff;font-size:13px;height:30px;line-height:30px;margin:30px 0 0;width:150px;text-transform:uppercase;border:0;transition:background-color .2s linear;font-weight:400}
.loginbutton:hover{background-color:#699EF5;color:#fff}
#footer{position:absolute;bottom:0}
.group{position:relative;margin:0 40px 30px}
.group input{font-size:18px;padding:10px 10px 5px 5px;display:block;width:440px;border:none;border-bottom:1px solid #757575}
.group input:focus{outline:none}
.group label{color:#999;font-size:18px;font-weight:400;position:absolute;pointer-events:none;left:5px;top:10px;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}
input:focus ~ label,input:valid ~ label{top:-20px;font-size:14px;color:#4285F4}
.bar{position:relative;display:block;width:455px}
.bar:before,.bar:after{content:'';height:2px;width:0;bottom:1px;position:absolute;background:#5264AE;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}
.bar:before{left:50%}
.bar:after{right:50%}
input:focus ~ .bar:before,input:focus ~ .bar:after{width:50%}
.highlight{position:absolute;height:60%;width:100px;top:25%;left:0;pointer-events:none;opacity:.5}
input:focus ~ .highlight{-webkit-animation:inputHighlighter .3s ease;-moz-animation:inputHighlighter .3s ease;animation:inputHighlighter .3s ease}

@-webkit-keyframes inputHighlighter {from{background:#5264AE} to {width:0;background:transparent}}
@-moz-keyframes inputHighlighter {from{background:#5264AE} to {width:0;background:transparent}}
@keyframes inputHighlighter {from{background:#5264AE} to {width:0;background:transparent}}