@import url('https://fonts.googleapis.com/css?family=Montserrat:400,800');*{box-sizing:border-box}body{background:#f6f5f7;justify-content:center;align-items:center;flex-direction:column;font-family:'Montserrat',sans-serif}h1{font-weight:bold;margin:0}h2{text-align:center}.signin-top-title{position:absolute;padding:12px 50px 10px 23px;font-size:12px;letter-spacing:-.3px;width:100%;border-bottom:1px solid #ccc}.signin-top-title img{position:relative;top:0;padding-right:2px}.signin-title{font-size:25px;line-height:1.14286;font-family:Open Sans,sans-serif;font-weight:500;margin-top:65px;color:#333}.user-image{padding:20px}.user-image .icon>i{font-size:7em;color:#999}.app-name{color:#32be8f;font-weight:500}p{font-size:14px;font-weight:100;line-height:20px;letter-spacing:.5px;margin:20px 0 30px}span{font-size:12px}a{color:#333;font-size:12px;text-decoration:none;margin:15px 0}.btn{display:block;width:100%;border-radius:20px;outline:none;border:none;background-image:linear-gradient(to right,#32be8f,#38d39f,#32be8f);background-color:#32be8f;background-size:200%;font-size:12px;color:#fff;font-family:sans-serif;text-transform:uppercase;margin:1rem 0;cursor:pointer;transition:.5s;padding:12px 45px;letter-spacing:1px}.btn:hover{background-position:right;color:#fff}button:active{transform:scale(.95)}button:focus{outline:none}button.ghost{background-color:transparent;border-color:#fff}form{background-color:#fff;align-items:center;justify-content:center;flex-direction:column;padding:0 50px;height:100%;text-align:center}.input-txt{border:solid 2px #fff;border-radius:20px;font-size:12px}.input-txt:focus,.input-txt:hover{transition:all 1.2s;border:solid 2px #31aaa8}input{background-color:#eee;border:none;padding:12px 15px;margin:8px 0;width:100%;outline:none}.container{background-color:#fff;border-radius:10px;box-shadow:0 14px 28px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.22);position:relative;overflow:hidden;width:384px;max-width:100%;min-height:550px}.form-container{position:absolute;top:0;height:100%;transition:all .6s ease-in-out}.sign-in-container{left:0;width:100%;z-index:2}.container.right-panel-active .sign-in-container{transform:translateX(100%)}.overlay-container{position:absolute;top:0;left:50%;width:50%;height:100%;overflow:hidden;transition:transform .6s ease-in-out;z-index:100}.overlay{background:#ff416c;background:-webkit-linear-gradient(to right,#ff4b2b,#ff416c);background:linear-gradient(to right,#ff4b2b,#ff416c);background-repeat:no-repeat;background-size:cover;background-position:0 0;color:#fff;position:relative;left:-100%;height:100%;width:200%;transform:translateX(0);transition:transform .6s ease-in-out}.container.right-panel-active .overlay{transform:translateX(50%)}.overlay-panel{position:absolute;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:0 40px;text-align:center;top:0;height:100%;width:50%;transform:translateX(0);transition:transform .6s ease-in-out}.overlay-left{transform:translateX(-20%)}.container.right-panel-active .overlay-left{transform:translateX(0)}.overlay-right{right:0;transform:translateX(0)}.container.right-panel-active .overlay-right{transform:translateX(20%)}.social-container{margin:20px 0}.social-container a{border:1px solid #ddd;border-radius:50%;display:inline-flex;justify-content:center;align-items:center;margin:0 5px;height:40px;width:40px}footer{background-color:#222;color:#fff;font-size:14px;bottom:0;position:fixed;left:0;right:0;text-align:center;z-index:999}footer p{margin:10px 0}footer i{color:red}footer a{color:#3c97bf;text-decoration:none}.card-login{-webkit-transition:all 300ms linear;-moz-transition:all 300ms linear;-o-transition:all 300ms linear;-ms-transition:all 300ms linear;transition:all 300ms linear}.card-login{-webkit-transform:translate3d(0,60px,0);-moz-transform:translate3d(0,60px,0);-o-transform:translate3d(0,60px,0);-ms-transform:translate3d(0,60px,0);transform:translate3d(0,60px,0)}.card-login.card-hidden{opacity:0;-webkit-transform:translate3d(0,-60px,0);-moz-transform:translate3d(0,-60px,0);-o-transform:translate3d(0,-60px,0);-ms-transform:translate3d(0,-60px,0);transform:translate3d(0,-60px,0)}form.login span.error{color:#ff2633;font-size:13px}.thumb_img{overflow:hidden;position:relative;width:110px;height:110px;margin:0 auto;background-color:#fff;border-radius:50%;transition:all .5s}.thumb_img img{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;width:100%;height:100%}.text-name{display:block;font-size:18px;margin-top:20px}.center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}.animated{-webkit-animation-duration:1.7s;animation-duration:1.7s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.flipInX{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX}@-webkit-keyframes flipInX{from{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(1,0,0,10deg);transform:perspective(400px) rotate3d(1,0,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-5deg);transform:perspective(400px) rotate3d(1,0,0,-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInX{from{-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotate3d(1,0,0,10deg);transform:perspective(400px) rotate3d(1,0,0,10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotate3d(1,0,0,-5deg);transform:perspective(400px) rotate3d(1,0,0,-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}.fadeInUp{animation-name:fadeInUp;animation-fill-mode:forwards;animation-duration:1s;visibility:hidden}@keyframes fadeInUp{from{transform:translate3d(0,100%,0);visibility:visible;opacity:0}to{transform:translate3d(0,0,0);visibility:visible;opacity:1}}.fadeInDownText{-webkit-animation-name:fadeInDownText;animation-name:fadeInDownText;animation-duration:1s}@-webkit-keyframes fadeInDownText{from{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInDownText{from{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}to{opacity:1;-webkit-transform:none;transform:none}}.uk-alert{font-size:12px}