/*
Theme Name: Falconweb Theme
Theme URI: https://kielteam.com
Description: Theme für Falconweb. Basierend auf TwentyTwentyOne
Author: KielTeam
Author URI: https://kielteam.com
Template: twentytwentyone
Version: 1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

/* Fonts, Colors */
@font-face {
    font-family: 'Glacial Indifference';
    src: url('./fonts//twentytwentyone-child/') format('woff2'),
        url('./fonts//GlacialIndifference-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Glacial Indifference';
    src: url('./fonts//GlacialIndifference-Regular.woff2') format('woff2'),
        url('./fonts//GlacialIndifference-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Glacial Indifference';
    src: url('./fonts/GlacialIndifference-Italic.woff2') format('woff2'),
        url('./fonts/GlacialIndifference-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

h1, h2, h3, h4, h5, p, ul, li, span {
    line-height: 1.1;
}

:root {
    --global--font-secondary: 'Glacial Indifference', sans-serif;
}

h4 {
    color: #c31228;
    margin: 0 !important;
}


#mainContentTable h4 {
    margin-bottom: .5rem !important;
}

#mainContentTable p {
    font-size: 1rem;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

h4 + p {
    margin-top: 0 !important;
}

.mainText {
    color: black;
}

/* Header, Body, Footer */

.site-info {
    display: flex;
    flex-direction: column;
}

header#masthead {
    margin-bottom: 0;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.fwAdress {
    width: 100%;
}

.fwBottomLinks {
    display: flex;
    justify-content: center;
    background-color: #33474d;
    width: 100vw !important;
    max-width: none;
    gap:2rem;
}

.fwBottomLine {
    display: flex;
    justify-content: center;
    background-color: #c31228;
    width: 100vw !important;
    max-width: none;
    gap:2rem;
    height: 2.5rem;
}

.fwBottomLineWhite {
    display: flex;
    justify-content: center;
    background-color: white;
    width: 100vw !important;
    max-width: none;
    gap:2rem;
    height: .5rem;
}

.fwBottomLinks a {
    color: white !important;
    text-decoration: none;
    font-size: 16px;
}

/* SCRAMBLED WORDS */

.word {
    font-weight: bold;
    color: #c31228;
    transition: color 0.3s ease-in-out;
    cursor: pointer;
}

.custom-logo {
    cursor: pointer;
}

div#contentStorage {
    display: none;
}

div#rightContent {
    text-align: right;
}

footer#colophon {
    margin-top: 0;
    margin-bottom: 0;
}

.site-info {
    border: none !important;
}

.fwAdress {
    width: 100vw;
    font-size: 13px;
    text-align: center;
    background-color: white;
    border-top: 1px solid #c31228;
}

footer#colophon {
    margin-top: 0;
    margin-bottom: 0;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding-bottom: 0;
}

.site-info {
    margin-bottom: 0;
    font-size: 16px;
}

a.emailContent {
    text-decoration: none;
    padding: .5rem 1rem;
    background: white;
    margin-top: 1rem;
    display: inline-block;
    border-radius: 24px;
    border: 1px solid #c31228;
    color: black;
    transition-duration: 300ms;
}

div#mainContentTable {
    margin-bottom: 8rem;
}

a.emailContent:hover {
    background: #c31228;
    color: white;
}

a.emailfooter {text-decoration: none;
    background: white;
    display: inline-block;
    border-radius: 24px;
    border: 1px solid #c31228;
    color: black;
    transition-duration: 300ms;
    padding: .1rem .4rem;              
               margin: .25rem 0rem
              }

a.emailfooter:hover {
   background: #c31228;
    color: white !important;
}

.fwBottomLinks span {
    color: white;
    font-size: 16px !important;
    padding: .1rem .25rem;
    cursor: pointer;
}

#middleContent {
    min-width: 340px;
}

.fwAdressmobile {
    display: none;
}

@media (min-width: 1151px) {

div#page {
    margin-top: 5rem;
}
}
@media (max-width: 1150px) {
    #mainContentTable {
        flex-direction: column;
        margin-bottom: 8rem;
    }

    .fwAdressmobile {
        display: block;
        width: 100vw;
        font-size: 13px;
        text-align: center;
        background-color: white;
        border-top: 3px solid #c31228;
        align-items: center;
        justify-content: center;
        padding-top: .5rem !important;
        padding-bottom: .5rem;
        line-height: 1.2;
    }

    .fwAdress {
        display: none;
    }

    #middleContent {
        order: -1; /* Move middleContent to the top */
    }

    div#mainContentTable {
        margin-bottom: 15rem;
        gap: 0;
    }

    div#mainContentTable p {
        margin: 0;
        margin-bottom: 1rem;
    }
    
    div#leftContent {
        margin-bottom: 0;
    }

    div#leftContent #mainContentTable h4,
    div#rightContent #mainContentTable h4 {
        margin-bottom: .5rem !important;
        margin-top: 1rem !important;
    }

    div#rightContent {
        text-align: left;
    }
}

@media (max-width: 822px) {
    footer#colophon {
        margin: 0 !important;
        width: 100vw;
        max-width: none;
    }

    .fwAdress {
        width: 100%;
        padding: 0rem 1rem;
        font-size: 13px;
        text-align: center;
    }

    .site-logo .custom-logo {
        margin-left: auto;
        margin-right: auto;
        max-width: 192px;
        height: auto;
        display: inline-block;
        width: auto;
    }
    
}