.logintitle,.pleasewait{text-align:center;font-family:sans-serif;font-size:14px}body{margin:0;padding:0;background-color:#282E30}.topheader{width:100%;height:50%;position:absolute;top:0;left:0;right:0;background-color:#282E30;background-position:left top;background-repeat:no-repeat;background-size:100%auto}.logincontain,.logo{width:350px;position:absolute;right:0;margin:auto;background-repeat:no-repeat;left:0}.logo{height:80px;top:20%;background-image:url(../img/logo03.png);background-position:center top;background-size:80% auto}input{-webkit-appearance:none}.logincontain{height:260px;padding:10px 0;background-color:#FFF;top:0;bottom:0;background-image:url(../img/tick.gif);background-position:center;background-size:0;transition:all .5s;-webkit-transition:all .5s;-o-transition:all .5s;-moz-transition:all .5s}.successlogin{padding:0;width:220px;height:220px;border-radius:100%;background-size:auto;transition:all .5s;-webkit-transition:all .5s;-o-transition:all .5s;-moz-transition:all .5s}.pleasewait{width:220px;height:110px;color:#FFF}.toplinh{line-height:80px}.botlinh{line-height:160px}.clear{clear:both}.logintitle{width:348px;height:40px;border:thin solid #fff;line-height:40px;color:#455258;}.logincontain form{width:350px;height:auto;padding:10px 0;position:relative}.password,.username{width:280px;height:30px;background-color:#FFF;border:thin solid #C3C5C9;padding:2px 34px 2px 5px;outline:0}.username{display:block;margin-left:auto;margin-right:auto;margin-top:25px;font-family:sans-serif;font-size:14px;transition:all .3s;-webkit-transition:all .3s;-o-transition:all .3s;-moz-transition:all .3s}.password{display:block;margin-left:auto;margin-right:auto;margin-top:15px;font-family:sans-serif;font-size:14px;transition:all .3s;-webkit-transition:all .3s;-o-transition:all .3s;-moz-transition:all .3s}.errorslogin,.login{width:320px;margin-left:auto;margin-right:auto;font-family:sans-serif;font-size:14px;display:block;text-align:center}.password:focus,.username:focus{border:thin solid #1E7DC4;transition:all .3s;-webkit-transition:all .3s;-o-transition:all .3s;-moz-transition:all .3s}.password:focus+.form-icon,.username:focus+.form-icon{color:#1E7DC4;transition:all .3s;-webkit-transition:all .3s;-o-transition:all .3s;-moz-transition:all .3s}.login{height:35px;background-color:#56aae5;border:thin solid #398dc8;margin-top:15px;line-height:35px;color:#FFF}.errorslogin{height:25px;margin-top:5px;line-height:25px;color:#455258}.green,.red,.yellow{color:#FFF}.red{background-color:#E25863;border:thin solid #DD3946}.yellow{background-color:#E1C659;border:thin solid #E6A731}.green{background-color:#12a96e;border:thin solid #10945F}.form-icon{width:30px;height:30px;display:block;color:#455258;font-size:25px;position:absolute;right:20px;text-align:center;margin-top:-32px}@font-face{font-family:weather;src:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/93/artill_clean_icons-webfont.eot);src:url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/93/artill_clean_icons-webfont.eot?#iefix) format("embedded-opentype"),url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/93/artill_clean_icons-webfont.woff) format("woff"),url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/93/artill_clean_icons-webfont.ttf) format("truetype"),url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/93/artill_clean_icons-webfont.svg#artill_clean_weather_iconsRg) format("svg");font-weight:400;font-style:normal}@media screen and (max-width:1200px){#weather,#weather h2{text-align:center;position:absolute;left:0;right:0}#weather{height:50%;margin:0 auto;bottom:0;text-transform:uppercase;background-position:center;background-repeat:no-repeat;background-size:cover;z-index:0}#weather h2{color:#fff;font-size:80px;font-weight:200;text-shadow:0 1px 3px rgba(0,0,0,.15);bottom:10px}}@media screen and (min-width:1200px){#weather,#weather h2{text-align:center;position:absolute;left:0;right:0}#weather{height:50%;margin:0 auto;bottom:0;text-transform:uppercase;background-image:url(../img/d65885a5-city-3649-54636bc3.jpg);background-position:center;background-repeat:no-repeat;background-size:cover;z-index:0}#weather h2{color:#fff;font-size:80px;font-weight:200;text-shadow:0 1px 3px rgba(0,0,0,.15);bottom:10px}}@media only screen and (min-device-width:375px) and (max-device-width:667px) and (-webkit-min-device-pixel-ratio:2) and (orientation:landscape){#weather,#weather h2{position:absolute;left:0;right:0}#weather{height:50%;margin:0 auto;bottom:0;text-align:center;text-transform:uppercase;background-image:url(../img/d65885a5-city-3649-54636bc3.jpg);background-position:center;background-repeat:no-repeat;background-size:100% auto;z-index:0}.logo{top:2%}#weather h2{color:#fff;font-size:50px;font-weight:100;text-align:left;text-shadow:0 1px 3px rgba(0,0,0,.15);bottom:10px}.details{opacity:0}}i{color:#fff;font-family:weather;font-size:80px;font-weight:400;font-style:normal;line-height:1;text-transform:none}.icon-0:before{content:":"}.icon-1:before{content:"p"}.icon-2:before{content:"S"}.icon-3:before{content:"Q"}.icon-4:before{content:"S"}.icon-5:before,.icon-6:before,.icon-7:before,.icon-8:before{content:"W"}.icon-9:before{content:"I"}.icon-10:before{content:"W"}.icon-11:before,.icon-12:before,.icon-13:before,.icon-14:before{content:"I"}.icon-15:before{content:"W"}.icon-16:before{content:"I"}.icon-17:before{content:"W"}.icon-18:before{content:"U"}.icon-19:before,.icon-20:before,.icon-21:before,.icon-22:before,.icon-23:before{content:"Z"}.icon-24:before,.icon-25:before{content:"E"}.icon-26:before{content:"3"}.icon-27:before{content:"a"}.icon-28:before{content:"A"}.icon-29:before{content:"a"}.icon-30:before{content:"A"}.icon-31:before{content:"6"}.icon-32:before{content:"1"}.icon-33:before{content:"6"}.icon-34:before{content:"1"}.icon-35:before{content:"W"}.icon-36:before{content:"1"}.icon-37:before,.icon-38:before,.icon-39:before{content:"S"}.icon-40:before{content:"M"}.icon-41:before{content:"W"}.icon-42:before{content:"I"}.icon-43:before{content:"W"}.icon-44:before{content:"a"}.icon-45:before{content:"S"}.icon-46:before{content:"U"}.icon-47:before{content:"S"}#weather ul{margin:0;padding:0;position:absolute;bottom:10px;left:0;right:0}#weather li{background:#fff;background:rgba(255,255,255,.9);padding:10px;display:inline-block;border-radius:5px}#weather .currently{margin:0 5px}.bb{position:absolute;top:0;bottom:0;left:0;right:0;margin:8% auto 0 auto;width:340px;height:120px;color:#56aae5}