*{color:#fff;font-family:Arial,Helvetica,sans-serif}html,body{background-color:#151515;justify-content:center;align-items:center;width:100vw;height:100vh;margin:0;padding:0;display:flex;position:relative;overflow:hidden}main{width:100%;max-width:400px}input{color:#fff;box-sizing:border-box;text-align:center;background-color:#2c2c2c;border:none;border-radius:20px;outline:none;height:40px;padding-left:10px;padding-right:10px;font-size:20px;transition:all .2s}input::placeholder{color:gray}input[type=button],input[type=submit]{color:#fff;cursor:pointer}input[type=button]:hover:not(:disabled),input[type=submit]:hover:not(:disabled){color:#2c2c2c;background-color:#fff}input:disabled{opacity:.5;cursor:unset!important}input.red{color:#f33}input.red:hover{background-color:#f33!important}