*{-webkit-box-sizing:border-box;box-sizing:border-box}body{font-family:Montserrat,sans-serif;background:#f6f5f7;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:100vh;margin:-20px 0 50px}h1{font-weight:700;margin:0}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:14px;text-decoration:none;margin:15px 0}.container{background:#fff;border-radius:10px;-webkit-box-shadow:0 14px 28px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.22);box-shadow:0 14px 28px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.22);position:relative;overflow:hidden;width:768px;max-width:100%;min-height:480px}.form-container form{background:#fff;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;padding:0 50px;height:100%;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;text-align:center}.form-container input{background:#eee;border:none;padding:12px 15px;margin:8px 0;width:100%}.form-container{position:absolute;top:0;height:100%;-webkit-transition:all .6s ease-in-out;transition:all .6s ease-in-out}.social-container{margin:20px 0}.social-container a{border:1px solid #ddd;border-radius:50%;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:0 5px;height:40px;width:40px}button{border-radius:20px;border:1px solid #00bdaa;background:#00bdaa;color:#fff;font-size:12px;font-weight:700;padding:12px 45px;letter-spacing:1px;text-transform:uppercase;-webkit-transition:-webkit-transform 80ms ease-in;transition:-webkit-transform 80ms ease-in;transition:transform 80ms ease-in;transition:transform 80ms ease-in,-webkit-transform 80ms ease-in}.button-signup-margin{margin-top:16px}button:active{-webkit-transform:scale(.95);transform:scale(.95)}button:focus{outline:none}button.ghost{background:transparent;border-color:#fff}.sign-in-container{left:0;width:50%;z-index:2}.sign-up-container{left:0;width:50%;opacity:0;z-index:1}.overlay-container{position:absolute;top:0;left:50%;width:50%;overflow:hidden;z-index:100}.overlay,.overlay-container{height:100%;-webkit-transition:-webkit-transform .6s ease-in-out;transition:-webkit-transform .6s ease-in-out;transition:transform .6s ease-in-out;transition:transform .6s ease-in-out,-webkit-transform .6s ease-in-out}.overlay{background:#00bd56;background:-webkit-gradient(linear,left top,right top,from(#0e9577),to(#00bd56)) no-repeat 0 0/cover;background:linear-gradient(90deg,#0e9577,#00bd56) no-repeat 0 0/cover;color:#fff;position:relative;left:-100%;width:200%}.overlay,.overlay-panel{-webkit-transform:translateX(0);transform:translateX(0)}.overlay-panel{position:absolute;top:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:0 40px;height:100%;width:50%;text-align:center;-webkit-transition:-webkit-transform .6s ease-in-out;transition:-webkit-transform .6s ease-in-out;transition:transform .6s ease-in-out;transition:transform .6s ease-in-out,-webkit-transform .6s ease-in-out}.overlay-right{right:0;-webkit-transform:translateX(0);transform:translateX(0)}.overlay-left{-webkit-transform:translateX(-20%);transform:translateX(-20%)}.container.right-panel-active .sign-in-container{-webkit-transform:translateX(100%);transform:translateX(100%)}.container.right-panel-active .overlay-container{-webkit-transform:translateX(-100%);transform:translateX(-100%)}.container.container.right-panel-active .sign-up-container{-webkit-transform:translateX(100%);transform:translateX(100%);opacity:1;z-index:5}.container.container.right-panel-active .overlay{-webkit-transform:translateX(50%);transform:translateX(50%)}.container.container.right-panel-active .overlay-left{-webkit-transform:translateX(0);transform:translateX(0)}.container.container.right-panel-active .overlay-right{-webkit-transform:translateX(20%);transform:translateX(20%)}