body { font: 300 15px/28px "Poppins",sans-serif; }
.text-input { height: 50px; position: relative; }
.text-input__placeholder { top: 8px; left: 25px; font-size: 12px; }
.text-input .text-input__placeholder { position: absolute; top: calc(50% - (14px/2)); left: 25px; font-size: 14px; font-weight: 400; color: #555; pointer-events: none; line-height: 1; }
.text-input input:placeholder-shown~label { display: none; }
.text-input input:not(:placeholder-shown)~label { padding-top: calc(var(0.75rem)/100); padding-bottom: calc(var(0.75rem)/3); font-size: 12px; color: #555; display: block; }
.text-input label { position: absolute; top: 3px; left: 15px; display: block; width: 100%; margin-bottom: 0; line-height: 1.5; color: #555; pointer-events: none; cursor: text; border: 1px solid transparent; border-radius: .25rem; transition: all .1s ease-in-out; font-size: .875rem; }
.text-input span { position: absolute; top: 12px; right: 15px; }
.text-input input { height: 50px; }
.text-input input:not(:placeholder-shown) { padding-top: calc(0.75rem + 0.75rem*(1/3)); padding-bottom: calc(0.75rem/3); }

.select-input { height: 50px; position:relative; }
.select-input label { position: absolute; top: 3px; left: 15px; display: block; width: 100%; margin-bottom: 0; line-height: 1.5; color: #555; pointer-events: none; cursor: text; border: 1px solid transparent; border-radius: .25rem; transition: all .1s ease-in-out; font-size: .75rem; }
.select-input select { height: 50px; padding-top: calc(0.75rem + 0.75rem*(1/3)); padding-bottom: calc(0.75rem/3); }

.hide-recaptcha-error { visibility: hidden; height: 0; }
.grecaptcha-badge { opacity:0;}

.navigation-bar { position: absolute; left:0; top: 0; width:100%; height:60px; background-color:#fff; border-bottom: solid 1px rgba(200,200,200,0.5); }
.navigation-bar img { height: 50px; }

.frame {
    position: absolute;
    top: calc(60px + 0px);
    left: 0;
    width: 100%;
    height: calc(100vh - 60px - 0px);
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
}
.frame-content {
    min-height: calc(100vh - (80px + 60px) );
}

#footer { height: 80px; font-size: 0.8em; }


@media (prefers-color-scheme: light) {
    body {
        background-color: white;
        color: black;
    }
}

@media (prefers-color-scheme: dark) {
    body {
        background-color: black;
        color: white;
    }
    #toplogo { filter: brightness(0) invert(1); }
}