* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
}

body {
    padding: 1rem 5%;
    font-family: helvetica, sans-serif;
}

/* form styles */
form {
    width: 30rem;
}
form .form-group {
    margin-bottom: 1rem;
}

form label,
form button,
form textarea,
form input {
    display: block;

}

form input,
form textarea {
    width: 100%
}

form textarea {
    height: 5rem;
}

form input[type=checkbox],
form input[type=radio] {
    display: inline;
    width: auto;
    margin-bottom: 0.5rem;
}

form input[type=text],
form input[type=date],
form input[type=email],
form input[type=number],
form textarea {
    font-size: 1.25rem;
}

form label:has(input[type=radio]),
form label:has(input[type=checkbox]) {
    margin-bottom: 0;
}

form fieldset {
    margin-bottom: 1rem;
}

form button[type=submit] {
    font-size: 1.5rem;
    padding: 0.25rem;
}

footer {
    margin-top: 2rem;
    border-top: 2px solid black;
}

a:link,
a:visited {
    color: blue;
    text-decoration: none;
}

a:hover,
a:active {
    text-decoration: underline;
}

ul li {
    margin-bottom: 0.5rem;
}
/* styles for validatejs */
.form-group { padding-left: 0.5rem;}
p.help-block { margin-block-start: 0.25rem;}
.help-block.error::before {
    content: "\274C";
    padding-left: 5px;
    padding-right: 3px;
}

.has-success::after {
    content: "\2714";
    padding-left: 0px;
    padding-right: 0px;
    color: green;
}

.error  {
    color: #dc1d34;
}

.form-group.has-error {
    border-left: 2px solid #dc1d34;
}
.form-group.has-success {
    border-left: 2px solid green;
}