:root {
    --main-color: #182C7C;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: visbycf-regular, sans-serif;
    scroll-behavior: smooth;
}

@font-face {
    font-family: 'meine-schrift';
    src:    url('../font/visbycf-bold.otf')  format('otf'),
            url('../font/visbycf-demibold.otf')  format('otf'),
            url('../font/visbycf-thin.otf')  format('otf'),
            url('../font/visbycf-regularoblique.otf')  format('otf'),
            url('../font/visbycf-regular.otf')  format('otf');
}

body {
    width: 100vw;
    height: 100vh;
    overflow-x: hidden;
    overflow-y: auto;
}

.overflow-y {
    overflow-y: hidden;
}

.hidden {
    display: none;
}

article {
    max-width: 85%;
    margin: 0 auto;
}

article section p, article section ul {
    font-size: 1.5vw;
    list-style: inside;
}

/* Fancy Headline with number in background */
article section .headline {
    justify-self: center;
    grid-column: 1 / 3;
}

article section .headline h3 {
    position: relative;
    color: var(--main-color);
    font-size: 8vw;
    text-shadow: 0 0 .5vw rgba(0, 0, 0, 0.3);
    font-family: visbycf-regular, sans-serif;
}

article section .headline h3:before {
    font-family: visbycf-regular, sans-serif;
    color: white;
    font-size: 3vw;
    position: absolute;
    top: 31%;
}

/* Thin blue line spacer */
article .spacer {
    max-width: 70vw;
    margin: 5vh auto;
    height: .2vh;
    background: var(--main-color);
}



/* Login */
article.login section {
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

article.login section img {
    width: 20vw;
}

article.login section .text {
    margin-top: 4vh;
}

article.login section .btn {
    padding: 2vh 3vw;
    border: 1px solid white;
    background: var(--main-color);
    color: white;
    transition: .5s;
    border-radius: .8vw;
}

article.login section .btn:hover {
    border: 1px solid var(--main-color);
    background: white;
    color: var(--main-color);
}

span.textauszeichnung {
    color: var(--main-color);
    font-weight: bold;
}



@media screen and (max-width: 1200px) {
    article section p {
        font-size: 3.5vw;
    }

    article section ul li {
        font-size: 3.5vw;
    }
}

p.ie_warning {
    display: none;
    position: absolute;
    bottom: 30vh;
    left: 50vw;
    transform: translateX(-50%);
    text-align: center;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    
    p#ieexplorer {
        display: block;
    }

    /*
    .loadingscreen {
        display: none;
    }

    html body {
        overflow-y: auto;
    }
    */
}