@import url('demo.css');
@import url('font-awesome.css');

/* GLOBALS */
*,*:after,*:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;box-sizing:border-box;padding:0;margin:0}.clearfix:after{content:"";display:table;clear:both}.form-1{width:300px;margin:60px auto 30px;padding:10px;position:relative;box-shadow:0 0 1px rgba(0, 0, 0, 0.3), 0 3px 7px rgba(0, 0, 0, 0.3), inset 0 1px rgba(255, 255, 255, 1), inset 0 -3px 2px rgba(0, 0, 0, 0.25);border-radius:5px;background:white;background:-moz-linear-gradient(#eeefef, #fff 10%);background:-ms-linear-gradient(#eeefef, #fff 10%);background:-o-linear-gradient(#eeefef, #fff 10%);background:-webkit-gradient(linear, 0 0, 0 100%, from(#eeefef), color-stop(0.1, #ffffff));background:-webkit-linear-gradient(#eeefef, #fff 10%);background:linear-gradient(#eeefef, #fff 10%)}.form-1 .field{position:relative}.form-1 .field i{left:0px;top:0px;position:absolute;height:36px;width:36px;border-right:1px solid rgba(0, 0, 0, 0.1);box-shadow:1px 0 0 rgba(255, 255, 255, 0.7);color:#777;text-align:center;line-height:42px;-webkit-transition:all 0.3s ease-out;-moz-transition:all 0.3s ease-out;-ms-transition:all 0.3s ease-out;-o-transition:all 0.3s ease-out;transition:all 0.3s ease-out;pointer-events:none}.form-1 input[type=text], .form-1 input[type=password]{font-family:'Lato',Calibri,Arial,sans-serif;font-size:13px;font-weight:400;text-shadow:0 1px 0 rgba(255, 255, 255, 0.8);width:100%;padding:10px 18px 10px 45px;border:none;box-shadow:inset 0 0 5px rgba(0, 0, 0, 0.1), inset 0 3px 2px rgba(0, 0, 0, 0.1);border-radius:3px;background:#f9f9f9;color:#777;-webkit-transition:color 0.3s ease-out;-moz-transition:color 0.3s ease-out;-ms-transition:color 0.3s ease-out;-o-transition:color 0.3s ease-out;transition:color 0.3s ease-out}.form-1 input[type=text]{margin-bottom:10px}.form-1 input[type=text]:hover~i, .form-1 input[type=password]:hover~i{color:#52cfeb}.form-1 input[type=text]:focus~i, .form-1 input[type=password]:focus~i{color:#42A2BC}.form-1 input[type=text]:focus, .form-1 input[type=password]:focus, .form-1 button[type=submit]:focus{outline:none}.form-1 .submit{width:65px;height:65px;position:absolute;top:17px;right:-25px;padding:10px;z-index:2;background:#fff;border-radius:50%;box-shadow:0 0 2px rgba(0, 0, 0, 0.1), 0 3px 2px rgba(0, 0, 0, 0.1), inset 0 -3px 2px rgba(0, 0, 0, 0.2)}.form-1 .submit:after{content:"";width:10px;height:10px;position:absolute;top:-2px;left:30px;background:#fff;box-shadow:0 62px white, -32px 31px white}.form-1 button{width:100%;height:100%;margin-top:-1px;font-size:1.4em;line-height:1.75;color:white;border:none;border-radius:inherit;background:#52cfeb;background:-moz-linear-gradient(#52cfeb, #42A2BC);background:-ms-linear-gradient(#52cfeb, #42A2BC);background:-o-linear-gradient(#52cfeb, #42A2BC);background:-webkit-gradient(linear, 0 0, 0 100%, from(#52cfeb), to(#42A2BC));background:-webkit-linear-gradient(#52cfeb, #42A2BC);background:linear-gradient(#52cfeb, #42A2BC);box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.35), inset 0 3px 2px rgba(255, 255, 255, 0.2), inset 0 -3px 2px rgba(0, 0, 0, 0.1);cursor:pointer}.form-1 button:hover, .form-1 button[type=submit]:focus{background:#52cfeb;-webkit-transition:all 0.3s ease-out;-moz-transition:all 0.3s ease-out;-ms-transition:all 0.3s ease-out;-o-transition:all 0.3s ease-out;transition:all 0.3s ease-out}.form-1 button:active{background:#42A2BC;box-shadow:inset 0 0 5px rgba(0, 0, 0, 0.3), inset 0 3px 4px rgba(0,0,0,0.3)}.fa-spin{-webkit-animation:fa-spin 2s infinite linear;animation:fa-spin 2s infinite linear}.fa-pulse{-webkit-animation:fa-spin 1s infinite steps(8);animation:fa-spin 1s infinite steps(8)}@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}