body {
    font-family: "Work Sans", sans-serif;
    color: #0c141d;
    background-color: #f7f6ff;
    margin: 0;
}

#form1, div.loginbox > form[name=form1] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0.5em;
}

h2 {
    text-align: center;
    margin-top: 0.5em;
    margin-bottom: 0.5em;;
}

.forgot {
    display: none;
}

.formline:has(input) {
    height: 2.2em;
}

input {
    appearance: none;
    border-width: 0.0625em;
    border-style: solid;
    border-radius: 0.75em;
    padding: 0.75em;
    cursor: text;
}

input:read-write {
    border-color: #695fff;
    color: #695fff;
}

input:read-write::placeholder {
    color: rgba(24, 24, 75, 0.5);
}

input:read-only {
    border-color: #ced0d2;
    color: #ced0d2;
}
input:read-only::placeholder {
    color: #ced0d2;
}

input:focus {
    outline: none;
}

input:not([readonly], [disabled]) {
    background-color: #e1dfff;
}

button {
    border-width: 0.125em;
    border-style: solid;
    border-radius: 0.75em;
    padding: 1em 2em;
    font-weight: 600;
    border-color: #abf5d1;
    background-color: #abf5d1;
    color: #0c141d;
}

button:enabled {
    cursor: pointer;
}

button:hover {
    background-color: #57eba3;
    border-color: #57eba3;
}

button:active {
    background-color: #2de68c;
    border-color: #2de68c;
}

button:disabled {
    background-color: #c4c5c8;
    border-color: #c4c5c8;
}

a {
    text-decoration: none;
    color: #695fff;
}

div.formline > p {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}

.lineseparator {
    height: 0;
}

input {
    appearance: none;
    border-width: 0.0625em;
    border-style: solid;
    border-radius: 0.75em;
    padding: 0.75em;
    cursor: text;
}

input:read-write {
    border-color: #695fff;
    color: #695fff;
}

input:read-write::placeholder {
    color: rgba(24, 24, 75, 0.5);
}

input:read-only {
    border-color: #ced0d2;
    color: #ced0d2;
}

input:read-only::placeholder {
    color: #ced0d2;
}

input:focus {
    outline: none;
}

input:not([readonly], [disabled]) {
    background-color: #e1dfff;
}

input[type=submit] {
    border-width: 0.125em;
    border-style: solid;
    border-radius: 0.75em;
    padding: 1em 2em;
    font-weight: 600;
}

input[type=submit]:enabled {
    cursor: pointer;
}

input[type=submit] {
    border-color: #abf5d1;
    background-color: #abf5d1;
    color: #0c141d;
}

input[type=submit]:hover {
    background-color: #57eba3;
    border-color: #57eba3;
}

input[type=submit]:active {
    background-color: #2de68c;
    border-color: #2de68c;
}

input[type=submit]:disabled {
    background-color: #c4c5c8;
    border-color: #c4c5c8;
}


input[type='button'] {
    border-width: 0.125em;
    border-style: solid;
    border-radius: 0.75em;
    padding: 1em 2em;
    font-weight: 600;
    border-color: #81f0ba;
    background-color: #fff;
    color: #0c141d;
}

input[type='button']:enabled {
    cursor: pointer;
}

input[type='button']:hover {
    border-color: #57eba3;
}

input[type='button']:active {
    border-color: #2de68c;
}

input[type='button']:disabled {
    border-color: #c4c5c8;
}

select {
    appearance: none;
    border-width: 0.0625em;
    border-style: solid;
    border-radius: 0.75em;
}

select:enabled {
    border-color: #695fff !important;
    background-color: #fff !important;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 17 8"><path stroke="#695fff" d="M1.5 0.811523L7.71905 6.14214C8.16844 6.52733 8.83156 6.52733 9.28095 6.14214L15.5 0.811524" stroke-width="1.5" stroke-linecap="round" fill="none" /></svg>');
    background-position: right 0.75em center;
    background-repeat: no-repeat;
    background-size: 1em;
    padding: 0.75em 2.5em 0.75em 0.75em;
    color: #695fff !important;
    cursor: pointer;
}

select:disabled {
    border-color: #ced0d2;
    padding: 0.75em;
    color: #ced0d2;
}

select:focus {
    outline: none;
    background-color: #e1dfff;
}

#B1_fake {
    border-width: 0.125em;
    border-style: solid;
    border-radius: 0.75em;
    padding: 1em 2em;
    font-weight: 600;
    border-color: #abf5d1;
    background-color: #abf5d1;
    color: #0c141d;
}

#B1_fake:enabled {
    cursor: pointer;
}

#B1_fake:hover {
    background-color: #57eba3;
    border-color: #57eba3;
}

#B1_fake:active {
    background-color: #2de68c;
    border-color: #2de68c;
}

#B1_fake:disabled {
    background-color: #c4c5c8;
    border-color: #c4c5c8;
}

div.mobilapp > button {
    border-width: 0.125em;
    border-style: solid;
    border-radius: 0.75em;
    padding: 1em 2em;
    font-weight: 600;
    border-color: transparent;
    background-color: transparent;
    color: #695fff;
}

div.mobilapp > button:enabled {
    cursor: pointer;
}

div.mobilapp > button:hover {
    color: #877fff;
}

div.mobilapp > button:active {
    color: #554dd2;
}

div.mobilapp > button:disabled {
    color: #c4c5c8;
}

h1:not(.green) {
    display: none;
}

.formline.bottomaligned {
    margin-top: 1em;
}

.title-box > h1, .title-box > p {
    text-align: center;
}