html {
    font-size: 1vw;
    scroll-behavior: smooth;
    /* overflow: hidden; */
}

body {
    font-size: var(--f1);
    line-height: var(--lineHeight);
    font-family: unica, serif;
    font-variation-settings: "wght" 350, "wdth" 900, "slnt" 0;
    color: var(--contrast);
    background-color: var(--color);
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    min-height: 100vh;
    /* background-color: red; */
    /* font-variation-settings: 'wght' 300; */
}

/* html {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

html::-webkit-scrollbar {
    display: none;
} */
.main {
    z-index: 2;
    position: relative;
    background-color: var(--color);
    /* margin-top: calc(6 * var(--m)); */
    /* margin-top: calc(var(--nav) + var(--header)); */
}

header {
    padding: var(--m);
    /* position: fixed; */
    /* height: var(--header); */
    line-height: 1em;
    /* background-color: var(--color); */
    z-index: 1;
    position: sticky;
    top: 0px;
}

footer {
    border: 1px solid var(--contrast);
    border-width: 1px 0px 0px 0px;
    padding: var(--m);
    font-size: 1rem;
    line-height: var(--lineHeight);
}

nav {
    z-index: 3;
    line-height: 1em;
    position: sticky;
    top: 0px;
    /* position: fixed; */
    background-color: var(--color);
    /* height: var(--nav); */
    /* height: calc(3 * var(--m)); */
    /* top: var(--header); */
    /* background-color: var(--color); */
}

a {
    color: var(--link);
}

.noEvents {
    pointer-events: none;
}

.fullEvents {
    pointer-events: all;
}

/* ---------------------------------------------------- a */

header a,
.leftMenu a {
    text-decoration: none;
    color: var(--contrast);
    white-space: nowrap;

}

nav a {
    text-decoration: none;
    color: var(--contrast);
}

/* icici */
.leftMenu .anchorLink.selected {
    /* color: blue; */
    /* font-variation-settings: "wght" 100; */
    font-variation-settings: "wght" 600, "wdth" 900, "slnt" 0;
}

/* ---------------------------------------------------- tabs */
.tabs {
    /* background-color: red; */
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.tab {
    position: relative;
    padding: var(--hm) 0;
    /* --w: calc(100% - 1 * var(--dm)); */
}

.tab a {
    cursor: pointer;
}

.download {
    position: relative;
    top: -0.15em;
    float: right;
    border-bottom: 1px solid var(--contrast);
}

.tab:nth-child(1) {
    width: calc(3 * var(--c) + 2 * var(--m) - var(--fix));
    /* flex-grow: 1; */
    /* width: calc(24% - 0.5 * var(--dm)); */
    padding-left: var(--m);
}

.tab:nth-child(3) {
    width: calc(3 * var(--c) + 1 * var(--m) - var(--fix));
    /* flex-grow: 1; */
    /* width: calc(24% - 1 * var(--dm)); */
    /* padding-left: 0; */
}

.tab:nth-child(5) {
    width: calc(3 * var(--c) + 1 * var(--m) - var(--fix));
    /* flex-grow: 1; */
    /* width: calc(24% - 1 * var(--dm)); */
    /* padding-left: 0; */
}

.tab:nth-child(7) {
    width: calc(3 * var(--c) + 3 * var(--m) - var(--fix));
    /* flex-grow: 1; */
    /* width: calc(24% - 0.5 * var(--dm)); */
    /* width: calc(var(--w) *0.17); */
    /* font-size: var(--f3); */
    /* padding-top: var(--qm); */
    /* padding-left: 0; */
}


.page {
    position: relative;
    flex-grow: 1;
    /* background-color: blue; */
}

.page.hidden {
    display: none;
}

img {
    display: block;
    width: 100%;
}

.smallText {
    font-size: var(--f3);
    line-height: var(--lineHeight);
}

.leftMenu {
    padding-top: var(--m);
    /* font-size: var(--f4); */
    line-height: var(--lineHeight);
    position: fixed;
    /* height: 100vh; */
    /* top: 0; */
    z-index: 1;
}

.vLine {
    position: absolute;
    height: calc(100% - 2 * var(--m));
    border-right: 1px solid var(--contrast);
    left: calc(6 * var(--c) + 6 * var(--m) - var(--fix));
    top: var(--m);
}

.leftMenu a {
    margin-bottom: var(--m);
}

.leftMenu a::before {
    content: "\00a0";
    float: left;
    display: block;
    width: var(--m);
    font-size: 1rem;
    line-height: var(--lineHeight);
    border-bottom: 1px solid var(--contrast)
}

.buttonDownload {
    display: block;
    position: fixed;
    bottom: var(--m);
    left: var(--m);
    background-color: var(--contrast);
    color: var(--color);
    z-index: 1;
    text-decoration: none;
    padding: var(--hm) var(--m);
    border-radius: var(--dm);
}

.buttonDownload:hover {
    color: var(--contrast);
    background-color: var(--color);
    border: 1px solid var(--contrast);
}

.buttonDownload::after {

    position: relative;
    float: right;
    margin-left: var(--m);
    content: "↓";
    text-decoration: underline;
    margin-top: -0.15em;
}

.impressum,
.mediumText {
    font-size: var(--f1);
    line-height: var(--lineHeight);
}

.page a {
    text-decoration: none;
    color: inherit;
}

.page a:after {
    content: "↗";
    /* text-decoration: underline; */
    border-bottom: 1px solid var(--contrast);
    top: -0.18em;
    position: relative;
    margin-left: var(--hm);
}

.page .anchor {
    position: absolute;
    /* top: calc(-1 * (var(--m))); */
    top: calc(-1 * (var(--nav) + var(--m)));
    /* background-color: red; */
    /* top: -9rem; */
}

.page:first-of-type .anchor {
    top: calc(-1 * (var(--nav) + var(--header) + var(--m)));
}


@media screen and (orientation: portrait) {
    .vLine {
        display: none;
    }

    /* html {
        font-size: 3vw;
    } */

    /* .tab:nth-child(1) {
        width: calc(40.0% - 0.5 * var(--dm));
    }

    .tab:nth-child(3) {
        width: calc(40.0% - 1 * var(--dm));
    }

    .tab:nth-child(5) {
        width: calc(20% - 0.5 * var(--dm));
    } */
}