html,body{height:100%}body{min-height:185px;background:#f5fbff;margin:0;display:flex;align-items:center;justify-content:center;flex-direction:column;font-family:Arial,Helvetica,sans-serif}form#login{max-width:320px;width:100%;background:#fff;padding:20px;box-shadow:1px 1px 5px #46464011;border-radius:24px}form#login>img{display:block;width:100%;max-width:180px;margin:0 auto;padding:20px}form#login #selector{border-bottom:solid 2px #3965a4;display:flex;position:relative;background:#fff1;margin:0 20px;border-radius:8px;overflow:hidden}form#login #selector>.opt{width:0;flex-grow:1;text-align:center;padding:10px 0;z-index:1;color:#bfc9d6}form#login #selector #switch{background:#3965a4;position:absolute;width:50%;top:0;height:100%;left:0;z-index:0;border-radius:28px 32px 0 0}form#login #selector #switch .opt2{left:50%}form#login input{box-sizing:border-box;border:none;padding:15px;color:#000;width:100%;outline:none;display:block;margin-top:15px;margin-bottom:0;transition:all .3s ease;background:#f1f4fa;border-radius:55px}form#login input:hover{background:#fff2}form#login input[type=submit]{color:#f5f5f5;border:none;background:#2e578a;width:100%}form#login input[type=submit]:disabled{background:#3965a4aa;cursor:not-allowed}form#login input[type=submit]:hover{color:#fff;background:#3965a4}form#login.error input{background:#fcc}form#login.error input[type=submit]{background:#950808cf;color:#fff3f3}form#login.error input[type=submit]:hover{background:#b50b0bcf}