:root {
    --color-gray-100: #f5f5f5;
    --color-gray-200: #dcdcdc;
    --color-gray-300: #bfbfbf;
    --color-gray-400: #999999;
    --color-gray-500: #747474;
    --color-gray-600: #454545;
    --color-gray-900: #1a1a1a;
    --color-green-100: #eeffe2;
    --color-green-700: #358000;
    --color-orange-100: #ffeecc;
    --color-orange-700: #febb30;
    --color-red-100: #ffe0e0;
    --color-red-700: #cc0000;
    --color-blue-100: #e2f2fb;
    --color-blue-700: #1b86c3;
    --color-blue-800: #004d99;
    --color-blue-900: #000040;
    --color-purple-700: #800080;
    --color-black: var(--color-gray-900);
    --color-white: #fff;
    --color-transparent: transparent;
    --color-primary: var(--color-gray-500);
    --color-primary-dark: var(--color-gray-600);
    --color-primary-darker: var(--color-gray-900);
    --color-logo-blue: #015ab3;
    --color-button-primary: #0059b3;
    --color-ink: var(--color-black);
    --color-ink-light: var(--color-gray-500);
    --color-success: var(--color-green-700);
    --color-success-light: var(--color-green-100);
    --color-warning: var(--color-orange-700);
    --color-warning-light: var(--color-orange-100);
    --color-error: var(--color-red-700);
    --color-error-light: var(--color-red-100);
    --color-info: var(--color-blue-700);
    --color-info-light: var(--color-blue-100)
}

*,*::before,*::after {
    box-sizing: border-box
}

* {
    margin: 0
}

body {
    line-height: 1.5;
    -webkit-font-smoothing: antialiased
}

img,picture,video,canvas,svg {
    display: block;
    max-width: 100%
}

input,button,textarea,select {
    font: inherit
}

p,h1,h2,h3,h4,h5,h6 {
    overflow-wrap: break-word
}

p {
    text-wrap: pretty
}

h1,h2,h3,h4,h5,h6 {
    text-wrap: balance
}

#root,#__next {
    isolation: isolate
}

[hidden] {
    display: none !important
}

.uni_logo {
    margin-top: 0
}

.uni_logo_c {
    color: var(--color-logo-blue)
}

.contentbox {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: minmax(100vh, 1fr);
    place-content: center;
    place-items: center
}

.contentbox-shadow {
    box-shadow: 11px 30px 154px 2px rgba(0,0,0,.34)
}

.contentbox-inner {
    background: var(--color-white);
    padding: 70px 80px 20px;
    max-width: 463px;
    width: 100%;
    align-self: center;
    justify-self: center
}

/* Uniformly scale the entire login box on larger screens without changing proportions */
@media (min-width: 768px) {
    .contentbox-inner {
        transform: scale(1.4);
        transform-origin: center center;
    }
}

@media(max-width: 576px) {
    .contentbox-shadow {
        box-shadow:none
    }

    .contentbox-inner {
        padding: 25px;
        /* Avoid scaling on very small screens */
        transform: none;
    }
}

.hide,.hidden,.d-none {
    display: none
}

footer {
    margin-top: 2.4rem
}

.footerlogo {
    width: 180px;
    margin: 0 auto;
    display: block
}

.page-navigation {
    margin-top: 16px
}

.page-navigation .button {
    margin-bottom: .7rem
}

html {
    font-family: system-ui;
    font-size: 77%;
    line-height: 1.6;
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    text-size-adjust: 100%
}

body {
    font-size: 1.3rem;
    color: var(--color-primary-darker);
    letter-spacing: -0.03rem;
    text-rendering: optimizeLegibility
}

h1,.h1,h2,.h2,h3,.h3,h4,.h4,h5,.h5,h6,.h6 {
    font-weight: 600;
    max-width: 66ch;
    margin-bottom: .25rem
}

h1,.h1 {
    font-size: 2.5rem;
    margin-bottom: 0
}

h2,.h2 {
    font-size: 2rem
}

h5,.h5 {
    font-size: 1.4rem;
    font-weight: 500;
    margin-top: 2.4rem
}

.text-sm {
    font-size: .9rem
}

.text-muted {
    color: var(--color-gray-400)
}

hr {
    border-bottom-width: 0;
    margin: 2.4rem 0 1.6rem
}

html {
    font-family: "IBM Plex Sans",system-ui
}

body {
    letter-spacing: inherit
}

h5,.h5 {
    font-weight: 600
}

@font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: normal;
    src: url("../fonts/complete/eot/IBMPlexSans-Regular.eot"),url("../fonts/complete/woff/IBMPlexSans-Regular.woff") format("woff"),url("../fonts/complete/woff2/IBMPlexSans-Regular.woff2") format("woff2"),url("../fonts/complete/ttf/IBMPlexSans-Regular.ttf") format("truetype");
    font-display: swap
}

@font-face {
    font-family: "IBM Plex Sans";
    font-style: normal;
    font-weight: 600;
    src: url("../fonts/complete/woff2/IBMPlexSans-SemiBold.woff2") format("woff2"),url("../fonts/complete/woff/IBMPlexSans-SemiBold.woff") format("woff");
    font-display: swap
}

ul {
    padding-left: 1rem
}

ul li {
    margin-top: 8px;
    padding-left: 0
}

.nobullet-list {
    list-style-type: none;
    padding-left: 0
}

.nobullet-list>li {
    padding-left: 0;
    margin-top: 0
}

.list-with-checkmark svg {
    display: none
}

.list-with-checkmark .active {
    list-style-type: none;
    margin-left: -1rem
}

.list-with-checkmark .active svg {
    display: inline-block
}

.button {
    appearance: none;
    display: inline-block;
    width: 100%;
    border-radius: 4px;
    border: 2px solid #454545;
    padding: 6px;
    font-weight: 500;
    min-height: 40px;
    max-height: 40px;
    color: #fff;
    line-height: 1.9rem;
    text-align: center;
    justify-content: center;
    cursor: pointer;
    overflow: hidden
}

.button:focus {
    outline-width: 3px;
    outline-style: solid
}

.button.button-primary {
    color: #fff;
    background-color: #0059b3;
    border-color: #454545
}

.button.button-primary:active {
    background-color: #00597e;
    border-color: #00597e
}

.button.button-primary.focus,.button.button-primary:focus {
    background-color: #0059b3;
    border-color: #454545;
    outline-color: var(--color-gray-500)
}

.button.button-primary:disabled,.button.button-primary .disabled {
    opacity: .5;
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

.button.button-secondary {
    color: #1a1a1a;
    background-color: #f5f5f5;
    border-color: #747474
}

.button.button-secondary:active {
    background-color: #bfbfbf;
    border-color: #1a1a1a
}

.button.button-secondary.focus,.button.button-secondary:focus {
    background-color: #f5f5f5;
    border-color: #747474;
    outline-color: var(--color-gray-500)
}

.button.button-secondary:disabled,.button.button-secondary .disabled {
    opacity: .5;
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

.icon-svg {
    width: 2rem;
    height: 2rem;
    display: inline-block;
    fill: currentColor
}

.button .idp-nemid-img,.button img {
    height: 1.3em;
    vertical-align: middle;
    display: inline-block;
    margin-right: -0.5rem
}

.button .icon-svg {
    height: 1.3em;
    vertical-align: middle;
    display: inline-block;
    margin-right: -0.5rem
}

.button.w-auto {
    width: auto
}

a.button {
    text-decoration: none
}

button.function-link,button.button-as-link {
    background: none;
    border: none;
    padding: 0;
    text-decoration: underline;
    text-align: left;
    color: #0059b3
}

.function-link {
    border: none;
    cursor: pointer;
    display: inline-block;
    overflow-wrap: break-word;
    max-width: 100% !important
}

.form-group {
    margin-top: 24px
}

.form-group:first-child {
    margin-top: 16px
}

.form-group.form-error {
    border-left: 4px solid #c00;
    padding-top: 8px;
    padding-left: 12px;
    padding-bottom: 8px
}

.form-error-message {
    font-size: 1.3rem;
    display: block;
    color: var(--color-error);
    margin-top: 4px
}

.form-label {
    display: inline-block;
    font-weight: 500
}

.form-label,.form-hint,.form-error-message {
    font-weight: 600;
    max-width: 66ch
}

.form-input {
    border: 1px solid var(--color-primary);
    border-radius: 4px;
    display: block;
    font-size: 1.3rem;
    line-height: 2rem;
    padding: 7px 15px;
    width: 100%;
    max-width: 32rem;
    margin-top: 8px
}

input {
    max-width: none;
    height: 38px;
    line-height: 2rem
}

.m-0 {
    margin: 0 !important
}

.mt-0,.my-0 {
    margin-top: 0 !important
}

.mr-0,.mx-0 {
    margin-right: 0 !important
}

.mb-0,.my-0 {
    margin-bottom: 0 !important
}

.ml-0,.mx-0 {
    margin-left: 0 !important
}

.m-1 {
    margin: 2px !important
}

.mt-1,.my-1 {
    margin-top: 2px !important
}

.mr-1,.mx-1 {
    margin-right: 2px !important
}

.mb-1,.my-1 {
    margin-bottom: 2px !important
}

.ml-1,.mx-1 {
    margin-left: 2px !important
}

.m-2 {
    margin: 4px !important
}

.mt-2,.my-2 {
    margin-top: 4px !important
}

.mr-2,.mx-2 {
    margin-right: 4px !important
}

.mb-2,.my-2 {
    margin-bottom: 4px !important
}

.ml-2,.mx-2 {
    margin-left: 4px !important
}

.m-3 {
    margin: 8px !important
}

.mt-3,.my-3 {
    margin-top: 8px !important
}

.mr-3,.mx-3 {
    margin-right: 8px !important
}

.mb-3,.my-3 {
    margin-bottom: 8px !important
}

.ml-3,.mx-3 {
    margin-left: 8px !important
}

.m-305 {
    margin: 12px !important
}

.mt-305,.my-305 {
    margin-top: 12px !important
}

.mr-305,.mx-305 {
    margin-right: 12px !important
}

.mb-305,.my-305 {
    margin-bottom: 12px !important
}

.ml-305,.mx-305 {
    margin-left: 12px !important
}

.m-4 {
    margin: 16px !important
}

.mt-4,.my-4 {
    margin-top: 16px !important
}

.mr-4,.mx-4 {
    margin-right: 16px !important
}

.mb-4,.my-4 {
    margin-bottom: 16px !important
}

.ml-4,.mx-4 {
    margin-left: 16px !important
}

.m-405 {
    margin: 20px !important
}

.mt-405,.my-405 {
    margin-top: 20px !important
}

.mr-405,.mx-405 {
    margin-right: 20px !important
}

.mb-405,.my-405 {
    margin-bottom: 20px !important
}

.ml-405,.mx-405 {
    margin-left: 20px !important
}

.m-5 {
    margin: 24px !important
}

.mt-5,.my-5 {
    margin-top: 24px !important
}

.mr-5,.mx-5 {
    margin-right: 24px !important
}

.mb-5,.my-5 {
    margin-bottom: 24px !important
}

.ml-5,.mx-5 {
    margin-left: 24px !important
}

.m-505 {
    margin: 28px !important
}

.mt-505,.my-505 {
    margin-top: 28px !important
}

.mr-505,.mx-505 {
    margin-right: 28px !important
}

.mb-505,.my-505 {
    margin-bottom: 28px !important
}

.ml-505,.mx-505 {
    margin-left: 28px !important
}

.m-6 {
    margin: 32px !important
}

.mt-6,.my-6 {
    margin-top: 32px !important
}

.mr-6,.mx-6 {
    margin-right: 32px !important
}

.mb-6,.my-6 {
    margin-bottom: 32px !important
}

.ml-6,.mx-6 {
    margin-left: 32px !important
}

.m-605 {
    margin: 36px !important
}

.mt-605,.my-605 {
    margin-top: 36px !important
}

.mr-605,.mx-605 {
    margin-right: 36px !important
}

.mb-605,.my-605 {
    margin-bottom: 36px !important
}

.ml-605,.mx-605 {
    margin-left: 36px !important
}

.m-7 {
    margin: 40px !important
}

.mt-7,.my-7 {
    margin-top: 40px !important
}

.mr-7,.mx-7 {
    margin-right: 40px !important
}

.mb-7,.my-7 {
    margin-bottom: 40px !important
}

.ml-7,.mx-7 {
    margin-left: 40px !important
}

.m-705 {
    margin: 44px !important
}

.mt-705,.my-705 {
    margin-top: 44px !important
}

.mr-705,.mx-705 {
    margin-right: 44px !important
}

.mb-705,.my-705 {
    margin-bottom: 44px !important
}

.ml-705,.mx-705 {
    margin-left: 44px !important
}

.m-8 {
    margin: 48px !important
}

.mt-8,.my-8 {
    margin-top: 48px !important
}

.mr-8,.mx-8 {
    margin-right: 48px !important
}

.mb-8,.my-8 {
    margin-bottom: 48px !important
}

.ml-8,.mx-8 {
    margin-left: 48px !important
}

.m-805 {
    margin: 52px !important
}

.mt-805,.my-805 {
    margin-top: 52px !important
}

.mr-805,.mx-805 {
    margin-right: 52px !important
}

.mb-805,.my-805 {
    margin-bottom: 52px !important
}

.ml-805,.mx-805 {
    margin-left: 52px !important
}

.m-9 {
    margin: 56px !important
}

.mt-9,.my-9 {
    margin-top: 56px !important
}

.mr-9,.mx-9 {
    margin-right: 56px !important
}

.mb-9,.my-9 {
    margin-bottom: 56px !important
}

.ml-9,.mx-9 {
    margin-left: 56px !important
}

.m-905 {
    margin: 60px !important
}

.mt-905,.my-905 {
    margin-top: 60px !important
}

.mr-905,.mx-905 {
    margin-right: 60px !important
}

.mb-905,.my-905 {
    margin-bottom: 60px !important
}

.ml-905,.mx-905 {
    margin-left: 60px !important
}

.p-0 {
    padding: 0 !important
}

.pt-0,.py-0 {
    padding-top: 0 !important
}

.pr-0,.px-0 {
    padding-right: 0 !important
}

.pb-0,.py-0 {
    padding-bottom: 0 !important
}

.pl-0,.px-0 {
    padding-left: 0 !important
}

.p-1 {
    padding: 2px !important
}

.pt-1,.py-1 {
    padding-top: 2px !important
}

.pr-1,.px-1 {
    padding-right: 2px !important
}

.pb-1,.py-1 {
    padding-bottom: 2px !important
}

.pl-1,.px-1 {
    padding-left: 2px !important
}

.p-2 {
    padding: 4px !important
}

.pt-2,.py-2 {
    padding-top: 4px !important
}

.pr-2,.px-2 {
    padding-right: 4px !important
}

.pb-2,.py-2 {
    padding-bottom: 4px !important
}

.pl-2,.px-2 {
    padding-left: 4px !important
}

.p-3 {
    padding: 8px !important
}

.pt-3,.py-3 {
    padding-top: 8px !important
}

.pr-3,.px-3 {
    padding-right: 8px !important
}

.pb-3,.py-3 {
    padding-bottom: 8px !important
}

.pl-3,.px-3 {
    padding-left: 8px !important
}

.p-305 {
    padding: 12px !important
}

.pt-305,.py-305 {
    padding-top: 12px !important
}

.pr-305,.px-305 {
    padding-right: 12px !important
}

.pb-305,.py-305 {
    padding-bottom: 12px !important
}

.pl-305,.px-305 {
    padding-left: 12px !important
}

.p-4 {
    padding: 16px !important
}

.pt-4,.py-4 {
    padding-top: 16px !important
}

.pr-4,.px-4 {
    padding-right: 16px !important
}

.pb-4,.py-4 {
    padding-bottom: 16px !important
}

.pl-4,.px-4 {
    padding-left: 16px !important
}

.p-405 {
    padding: 20px !important
}

.pt-405,.py-405 {
    padding-top: 20px !important
}

.pr-405,.px-405 {
    padding-right: 20px !important
}

.pb-405,.py-405 {
    padding-bottom: 20px !important
}

.pl-405,.px-405 {
    padding-left: 20px !important
}

.p-5 {
    padding: 24px !important
}

.pt-5,.py-5 {
    padding-top: 24px !important
}

.pr-5,.px-5 {
    padding-right: 24px !important
}

.pb-5,.py-5 {
    padding-bottom: 24px !important
}

.pl-5,.px-5 {
    padding-left: 24px !important
}

.p-505 {
    padding: 28px !important
}

.pt-505,.py-505 {
    padding-top: 28px !important
}

.pr-505,.px-505 {
    padding-right: 28px !important
}

.pb-505,.py-505 {
    padding-bottom: 28px !important
}

.pl-505,.px-505 {
    padding-left: 28px !important
}

.p-6 {
    padding: 32px !important
}

.pt-6,.py-6 {
    padding-top: 32px !important
}

.pr-6,.px-6 {
    padding-right: 32px !important
}

.pb-6,.py-6 {
    padding-bottom: 32px !important
}

.pl-6,.px-6 {
    padding-left: 32px !important
}

.p-605 {
    padding: 36px !important
}

.pt-605,.py-605 {
    padding-top: 36px !important
}

.pr-605,.px-605 {
    padding-right: 36px !important
}

.pb-605,.py-605 {
    padding-bottom: 36px !important
}

.pl-605,.px-605 {
    padding-left: 36px !important
}

.p-7 {
    padding: 40px !important
}

.pt-7,.py-7 {
    padding-top: 40px !important
}

.pr-7,.px-7 {
    padding-right: 40px !important
}

.pb-7,.py-7 {
    padding-bottom: 40px !important
}

.pl-7,.px-7 {
    padding-left: 40px !important
}

.p-705 {
    padding: 44px !important
}

.pt-705,.py-705 {
    padding-top: 44px !important
}

.pr-705,.px-705 {
    padding-right: 44px !important
}

.pb-705,.py-705 {
    padding-bottom: 44px !important
}

.pl-705,.px-705 {
    padding-left: 44px !important
}

.p-8 {
    padding: 48px !important
}

.pt-8,.py-8 {
    padding-top: 48px !important
}

.pr-8,.px-8 {
    padding-right: 48px !important
}

.pb-8,.py-8 {
    padding-bottom: 48px !important
}

.pl-8,.px-8 {
    padding-left: 48px !important
}

.p-805 {
    padding: 52px !important
}

.pt-805,.py-805 {
    padding-top: 52px !important
}

.pr-805,.px-805 {
    padding-right: 52px !important
}

.pb-805,.py-805 {
    padding-bottom: 52px !important
}

.pl-805,.px-805 {
    padding-left: 52px !important
}

.p-9 {
    padding: 56px !important
}

.pt-9,.py-9 {
    padding-top: 56px !important
}

.pr-9,.px-9 {
    padding-right: 56px !important
}

.pb-9,.py-9 {
    padding-bottom: 56px !important
}

.pl-9,.px-9 {
    padding-left: 56px !important
}

.p-905 {
    padding: 60px !important
}

.pt-905,.py-905 {
    padding-top: 60px !important
}

.pr-905,.px-905 {
    padding-right: 60px !important
}

.pb-905,.py-905 {
    padding-bottom: 60px !important
}

.pl-905,.px-905 {
    padding-left: 60px !important
}

.row {
    display: flex;
    flex-wrap: wrap;
    row-gap: 8px;
    margin: auto -4px
}

.row>* {
    flex-shrink: 0;
    width: 100%;
    max-width: 100%
}

[class*=col-] {
    box-sizing: border-box;
    padding-left: 4px;
    padding-right: 4px
}

.col-1 {
    flex: 0 0 auto;
    width: 8.3333333333%
}

.col-2 {
    flex: 0 0 auto;
    width: 16.6666666667%
}

.col-3 {
    flex: 0 0 auto;
    width: 25%
}

.col-4 {
    flex: 0 0 auto;
    width: 33.3333333333%
}

.col-5 {
    flex: 0 0 auto;
    width: 41.6666666667%
}

.col-6 {
    flex: 0 0 auto;
    width: 50%
}

.col-7 {
    flex: 0 0 auto;
    width: 58.3333333333%
}

.col-8 {
    flex: 0 0 auto;
    width: 66.6666666667%
}

.col-9 {
    flex: 0 0 auto;
    width: 75%
}

.col-10 {
    flex: 0 0 auto;
    width: 83.3333333333%
}

.col-11 {
    flex: 0 0 auto;
    width: 91.6666666667%
}

.col-12 {
    flex: 0 0 auto;
    width: 100%
}

.order-1 {
    order: 1
}

.order-2 {
    order: 2
}

.alert {
    padding: 16px;
    margin-top: 16px;
    margin-bottom: 16px;
    border-left: 8px solid var(--color-primary)
}

.alert ul {
    font-size: 1.3rem
}

.alert:first-child {
    margin-top: 0
}

.alert-info {
    background-color: var(--color-info-light);
    border-color: var(--color-info)
}

.alert-error {
    background-color: var(--color-error-light);
    border-color: var(--color-error)
}

.alert-warning {
    background-color: var(--color-warning-light);
    border-color: var(--color-warning)
}

.alert .alert-heading {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 1.3rem;
    font-weight: 600
}

.approved {
    color: var(--color-success);
    height: 10rem;
    width: 10rem;
    margin-bottom: -10px;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
    display: block;
    fill: currentColor
}

.password {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 3%;
    justify-items: center;
    align-items: center
}

.password .item {
    aspect-ratio: 1;
    align-content: space-around;
    border: solid 1px var(--color-gray-300);
    border-radius: 5px;
    height: 100%;
    width: 100%;
    box-shadow: rgba(0,0,0,.1) 1px 1px 10px 0
}

.password .item:focus.js-icon {
    outline: 3px solid var(--color-gray-500)
}

.password .item:active {
    transform: scale(1.1);
    background: rgba(225,225,225,.36);
    box-shadow: rgba(0,0,0,.2) 1px 1px 10px 0
}

.img_icon,.icon-stil-9,.icon-stil-8,.icon-stil-7,.icon-stil-6,.icon-stil-5,.icon-stil-4,.icon-stil-3,.icon-stil-2,.icon-stil-1 {
    text-align: center;
    height: 5rem;
    width: 5rem;
    margin: auto
}

.icon-stil-1 {
    background-image: url("../img/icons/bird.svg")
}

.icon-stil-2 {
    background-image: url("../img/icons/boat.svg")
}

.icon-stil-3 {
    background-image: url("../img/icons/car.svg")
}

.icon-stil-4 {
    background-image: url("../img/icons/shoes.svg")
}

.icon-stil-5 {
    background-image: url("../img/icons/cup.svg")
}

.icon-stil-6 {
    background-image: url("../img/icons/sun.svg")
}

.icon-stil-7 {
    background-image: url("../img/icons/horse.svg")
}

.icon-stil-8 {
    background-image: url("../img/icons/house.svg")
}

.icon-stil-9 {
    background-image: url("../img/icons/icecream.svg")
}

.images {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    align-items: center;
    justify-content: center;
    border: solid 1px var(--color-gray-300);
    border-radius: 5px;
    height: 100%;
    min-height: 70px
}

.images.none-border {
    border: none
}

.images.error {
    border: 2px solid var(--color-error)
}

.images .item {
    cursor: pointer;
    align-content: center;
    text-align: center;
    width: 100%;
    height: 100%
}

.images .item:focus.js-reset-passw {
    outline: 3px solid var(--color-gray-500);
    outline-offset: -3px
}

.placecode,.placecode--active,.placecode--active.setblack {
    margin: auto;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: solid 1px var(--color-gray-600);
    transition: all .2s ease-in-out
}

.placecode--active,.placecode--active.setblack {
    background: var(--color-blue-700)
}

.placecode--active.setblack {
    background: var(--color-gray-600)
}

.color-success {
    color: var(--color-success)
}

@-webkit-keyframes fadeIn {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes fadeIn {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn
}