@font-face {
    font-family: 'Montserrat';
    src: url('./fonts/Montserrat-VariableFont_wght.ttf')
}
@font-face {
    font-family: 'Crimson';
    src: url('./fonts/CrimsonText-Regular.ttf')
}

a:link{
    text-decoration: none
}

a:hover{
    text-decoration: none;
}

a:visited{
}

div.overall-background {
    height: 100vh;
    background-color: rgb(191,211,230);
}

div.top-background {
    background-color: rgb(158,188,218);
    padding-bottom: 0.5em;
    padding-top: 0.5em;
}

div.center-background {
    background-color: rgb(140,150,198);
    padding-bottom: 0.5em;
    padding-top: 0.5em
}

div.bottom-background {
    background-color: rgb(191,211,230);
    padding-bottom: 0.5em;
    padding-top: 0.5em
}

@media (max-width: 1500px) {
    span.headline {
        font-family: Montserrat, Arial, sans-serif;
        font-weight: 600;
        font-size: 1em;
    }
    div.last-updated {
        width: 95%;
        margin-left: auto;
        margin-right: auto;
        color: rgb(2,56,88);
        margin-top: 0.5em;
        padding-left: 1em;
        padding-right: 1em;
    }
    div.top-panel {
        width: 95%;
        margin-left: auto;
        margin-right: auto;
        background-color: rgb(77,0,75);
        background-image: linear-gradient(rgb(140,150,198) 0%, rgb(77,0,75) 50%, rgb(140,150,198) 100%);
        color: rgb(224,236,244);
        padding: 1em;
        margin-top: 0.5em
    }
    div.center-panel {
        width: 95%;
        margin-left: auto;
        margin-right: auto;
        background-color: rgb(224,236,244);
        color: rgb(77,0,75);
        padding: 1em;
    }
    div.bottom-panel {
        width: 95%;
        margin-left: auto;
        margin-right: auto;
        background-color: rgb(5,112,176);
        color: rgb(191,211,230);
        padding: 1em;
    }
}

@media (min-width: 1501px) {
    span.headline {
        font-family: Montserrat, Arial, sans-serif;
        font-weight: 600;
        font-size: 1em;
    }
    div.last-updated {
        width: 70%;
        margin-left: auto;
        margin-right: auto;
        color: rgb(2,56,88);
        margin-top: 0.5em;
        padding-left: 1em;
        padding-right: 1em;
    }
    div.top-panel {
        width: 70%;
        margin-left: auto;
        margin-right: auto;
        background-color: rgb(77,0,75);
        background-image: linear-gradient(rgb(140,150,198) 0%, rgb(77,0,75) 50%, rgb(140,150,198) 100%);
        color: rgb(224,236,244);
        padding: 1em;
        margin-top: 0.5em
    }
    div.center-panel {
        width: 70%;
        margin-left: auto;
        margin-right: auto;
        background-color: rgb(224,236,244);
        color: rgb(77,0,75);
        padding: 1em;
    }
    div.bottom-panel {
        width: 70%;
        margin-left: auto;
        margin-right: auto;
        background-color: rgb(5,112,176);
        color: rgb(191,211,230);
        padding: 1em;
    }
}

span.title {
    font-family: Montserrat, Arial, sans-serif;
    font-weight: 500;
    font-size: 2.5em;
    background-color: rgb(158,188,218);
    background-image: linear-gradient(rgb(158,188,218) 0%, rgb(224,236,244) 50%, rgb(158,188,218) 100%);
    color: rgb(77,0,75);
    padding-left: 0.5em;
    padding-right: 0.5em;
    border: outset 1px;
}

span.title-de {
    font-family: Montserrat, Arial, sans-serif;
    font-weight: 500;
    font-size: 2.5em;
    color: rgb(158,188,218);
}

div.links-header-panel {
    border-bottom: solid rgb(77,0,75) 0.1em;
    color: rgb(77,0,75);
}

div.links-panel {
    margin-top: 1em;
}

table.links {
    width: 92.5%;
    border: none 1px;
    margin-top: 0.5em;
}

caption.topic {
    font-weight: 700;
    font-family: Montserrat, Arial, sans-serif;
    font-size: 1.1em;
    background-color: rgb(140,107,177);
    color: rgb(224,236,244);
    text-align: left;
    padding-left: 1em;
    padding-bottom: 0.2em;
    padding-top: 0.2em;
    margin-bottom: 0.2em;
}

tbody.links {
    text-align: center;
    font-family: Crimson, Times New Roman, serif;
    background-color: rgb(191,211,230);
}

a.cell-link {
    color: rgb(2,56,88);
    font-weight: 500;
    font-size: 1em;
    width: 100%;
    display: block;
}

@media (max-width: 760px) {
    span.headline {
        font-family: Montserrat, Arial, sans-serif;
        font-weight: 600;
        font-size: 0.9em;
    }
    div.last-updated {
        width: 90%;
        margin-left: auto;
        margin-right: auto;
        color: rgb(2,56,88);
        margin-top: 0.5em;
        padding-left: 1em;
        padding-right: 1em;
    }
    div.top-panel {
        width: 90%;
        margin-left: auto;
        margin-right: auto;
        background-color: rgb(77,0,75);
        background-image: linear-gradient(rgb(140,150,198) 0%, rgb(77,0,75) 100%);
        color: rgb(224,236,244);
        padding: 1em;
        margin-top: 0.5em
    }
    div.center-panel {
        width: 90%;
        margin-left: auto;
        margin-right: auto;
        background-color: rgb(224,236,244);
        color: rgb(77,0,75);
        padding: 1em;
    }
    div.bottom-panel {
        width: 90%;
        margin-left: auto;
        margin-right: auto;
        background-color: rgb(5,112,176);
        color: rgb(191,211,230);
        padding: 1em;
    }

    div.left-links {
        width: 96%;
        border: none 1px;
        float: left;
        margin-left: 5%
    }
    div.right-links {
        width: 96%;
        border: none 1px;
        float: left;
        margin-left: 5%
    }
    span.title {
        font-family: Montserrat, Arial, sans-serif;
        font-weight: 500;
        font-size: 2em;
        background-color: rgb(158,188,218);
        color: rgb(77,0,75);
        padding-left: 0.25em;
        padding-right: 0.25em;
    }
    span.title-de {
        font-family: Montserrat, Arial, sans-serif;
        font-weight: 500;
        font-size: 2em;
        color: rgb(158,188,218);
    }
    div.kontakt {
        background-image: url('./images/kontakt-slim.gif');
        background-position: center;
        height: 7em;
        background-repeat: no-repeat
    }
}

@media (min-width: 761px) {
    div.left-links {
        width: 48%;
        border: none 1px;
        float: left;
        margin-left: 3%
    }
    div.right-links {
        width: 48%;
        border: none 1px;
        float: right;
    }
    span.title {
        font-family: Montserrat, Arial, sans-serif;
        font-weight: 500;
        font-size: 2.5em;
        background-color: rgb(158,188,218);
        color: rgb(77,0,75);
        padding-left: 0.5em;
        padding-right: 0.5em;
    }
    span.title-de {
        font-family: Montserrat, Arial, sans-serif;
        font-weight: 500;
        font-size: 2.5em;
        color: rgb(158,188,218);
    }
    div.kontakt {
        text-align: center;
        background-image: url('./images/kontakt-wide.gif');
        background-position: center;
        height: 3em;
        background-repeat: no-repeat
    }
}

div.text {
    width: 96%;
    border: none 1px;
    margin-top: 1em;
    color: rgb(2,56,88);
    padding-left: 2%;
    padding-right: 2%;
    font-size: 1em;
    font-family: Crimson, Times New Roman, serif;
}

a.text {
    color: rgb(2,56,88); 
    text-decoration: underline
}

div.tile {
    border-style: outset; 
    border-radius: 0.5em; 
    border-width: 2px; 
    background-color: rgb(253,187,132);
}

div.caption {
    font-weight: 700;
    font-family: Montserrat, Arial, sans-serif;
    font-size: 1.1em;
    background-color: rgb(140,107,177);
    color: rgb(224,236,244);
    text-align: left;
    padding-left: 2%;
    padding-bottom: 0.2%;
    padding-top: 0.2%;
    margin-bottom: 0%;
    margin-left: 1%;
    width: 95%
}

div.cell {
    width: 93%;
    border: none 1px;
    margin-top: 0.5em;
    color: rgb(2,56,88);
    padding-left: 2%;
    padding-right: 2%;
    padding-bottom: 0.2%;
    padding-top: 0.2%;
    margin-left: 1%;
    font-size: 1em;
    font-family: Crimson, Times New Roman, serif;
    background-color: rgb(191,211,230);
}