div.overlay {
background-color: rgba(0,0,0,.25);
bottom: 0;
display: flex;
justify-content: center;
left: 0;
position: fixed;
top: 0;
width: 100%;
}
div.overlay > div.login-wrapper {
align-self: center;
background-color: rgba(0,0,0,.25);
border-radius: 2px;
padding: 6px;
width: 450px;
}
div.overlay > div.login-wrapper > div.login-content {
background-color: rgb(255,255,255);
border-radius: 2px;
padding: 24px;
position: relative;
}
div.overlay > div.login-wrapper > div.login-content > h3 {
color: rgb(0,0,0);
font-family: 'Varela Round', sans-serif;
font-size: 1.8em;
margin: 0 0 1.25em;
padding: 0;
}
form label {
color: rgb(0,0,0);
display: block;
font-family: 'Varela Round', sans-serif;
font-size: 1.25em;
margin: .75em 0;
}
form input[type="text"],
form input[type="email"],
form input[type="number"],
form input[type="search"],
form input[type="password"],
form textarea {
background-color: rgb(255,255,255);
border: 1px solid rgb( 186, 186, 186 );
border-radius: 1px;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.08);
display: block;
font-size: .65em;
margin: 6px 0 12px 0;
padding: .8em .55em;
text-shadow: 0 1px 1px rgba(255, 255, 255, 1);
transition: all 400ms ease;
width: 90%;
}
form input[type="text"]:focus,
form input[type="email"]:focus,
form input[type="number"]:focus,
form input[type="search"]:focus,
form input[type="password"]:focus,
form textarea:focus,
form select:focus {
border-color: #4195fc;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 0 8px #4195fc;
}
form input[type="text"]:invalid:focus,
form input[type="email"]:invalid:focus,
form input[type="number"]:invalid:focus,
form input[type="search"]:invalid:focus,
form input[type="password"]:invalid:focus,
form textarea:invalid:focus,
form select:invalid:focus {
border-color: rgb(248,66,66);
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 0 8px rgb(248,66,66);
}
form button {
background-color: #50c1e9;
border: 1px solid rgba(0,0,0,.1);
color: rgb(255,255,255);
font-family: 'Varela Round', sans-serif;
font-size: .85em;
padding: .55em .9em;
transition: all 400ms ease;
}
form button:hover {
background-color: #1bc5b3;
cursor: pointer;
}