.login_wapper { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 400px; border: 1px solid #666; border-radius: 2px; padding: 5px; }
.login_wapper table strong { display: block; text-align: right; text-transform: capitalize; font-family: arial; font-size: 15px; }
.login_wapper table input[type=text], .login_wapper table input[type=password] { padding: 10px 15px; border: 1px solid #999; border-radius: 2px; font-size: 18px; font-family: monospace; color: #666; }
.login_wapper table input[type=text]:focus, .login_wapper table input[type=password]:focus, .login_wapper table input[type=submit]:focus { outline: none; }
input[type=checkbox] { display: none; }
input[type=checkbox] + label:before { font-family: FontAwesome; display: inline-block; cursor: pointer; content: "\f096"; cursor: pointer; letter-spacing: 5px; }
input[type=checkbox]:checked + label:before { content: "\f14a"; letter-spacing: 4px; }
.login_wapper table input[type=submit] { background: #77b1ff; border: none; color: #fff; padding: 8px 18px; text-transform: uppercase; border-radius: 2px; cursor: pointer; font-weight: bold; transition: all 0.3s; }
.login_wapper table input[type=submit]:hover { background: #77ff88; color: #333; transition: all 0.3s; }