html,body{ height: 100%; }

.login .flex{ display: flex; height: 100%;
    align-items: center; justify-content: center; }
.login .flex .content{  }

.login form, .login .logo{max-width: 340px;}

.login input{ display: block; width: 340px;  margin-bottom: 15px; padding: 5px; border: none; border-bottom: 1px solid #ccc; font-size: 16px; }
.login input:last-child{ margin-bottom: 0; background: #333; color: #fff; border: none; }

.login .logo{ display: block; margin: 0 auto 40px; }
.login .btn{ padding: 15px; background: #333; color: #fff; border: none; transition: background 0.3s; }
.login .btn:hover{ cursor: pointer; background: #444; }

.login form .lead{ font-size: 100%; margin-bottom: 40px; }
.login form .lead h4{ font-size: 20px; text-transform: uppercase; }

.errors ul{ list-style-type: none; color: #ac2925; text-align: center; background: #f2dede; border: 1px solid #ac2925; padding: 10px; }
.success{ color: #00a953; border: 1px solid #00a953; padding: 10px; text-align: center; background: #d0e9c6; margin-bottom: 10px; }

.newpw{ font-size: 32px; text-align: center; font-weight: lighter; padding: 10px; border: 1px solid #333; margin-bottom: 10px; }

form a{ color: #333 !important; }

.clipmsg{ background: #d0e9c6; color: #00a953; border: 1px solid #00a953; border-radius: 5px; padding: 10px; position: absolute; top: 50%; left: 50%; transition-property: opacity;transition-duration: 1.5s;
    transition-delay: 1s; margin-top: -23px; margin-left: -81px;}