79 lines
1.4 KiB
CSS
79 lines
1.4 KiB
CSS
.form {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
body {
|
|
background-color: var(--clr-secondary);
|
|
}
|
|
|
|
.form .header-form {
|
|
display: flex;
|
|
align-items: center;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.form .header-form img {
|
|
height: 5rem;
|
|
}
|
|
|
|
.form form {
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding: 1rem;
|
|
background-color: var(--clr-tertiary);
|
|
gap: .5rem;
|
|
border-radius: var(--border-radious);
|
|
border: var(--borderWidth-thin) solid var(--clr-border);
|
|
}
|
|
|
|
.form form input,
|
|
select {
|
|
background-color: var(--clr-secondary);
|
|
caret-color: white;
|
|
color: white;
|
|
padding: .3rem;
|
|
border-radius: var(--border-radious);
|
|
border: var(--borderWidth-thin) solid var(--clr-border);
|
|
width: 15rem;
|
|
}
|
|
|
|
.form form input[type="submit"] {
|
|
background-color: var(--clr-green);
|
|
color: white;
|
|
}
|
|
|
|
.form .error {
|
|
width: 17rem;
|
|
padding: 1rem;
|
|
background-color: var(--clr-danger-muted);
|
|
border-radius: var(--border-radious);
|
|
border: var(--borderWidth-thin) solid var(--clr-border-danger);
|
|
margin-bottom: 1rem;
|
|
color: white;
|
|
}
|
|
|
|
.form small.error {
|
|
width: 15rem;
|
|
}
|
|
|
|
.form .bordered {
|
|
border-radius: var(--border-radious);
|
|
border: var(--borderWidth-thin) solid var(--clr-border);
|
|
width: 17rem;
|
|
padding: 1rem;
|
|
margin-top: 1rem;
|
|
text-align: center;
|
|
}
|
|
|
|
.form .bordered a {
|
|
text-decoration: none;
|
|
color: var(--clr-link-blue);
|
|
}
|
|
|
|
.form .bordered a:hover {
|
|
text-decoration: underline;
|
|
}
|