/* FONT Meddon */
@font-face {
    font-family: 'Meddon';
    src: url('/css/fonts/Meddon-Regular.ttf');
    src: url('/css/fonts/Meddon-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

/* FONT Inter */
@font-face {
    font-family: 'Inter';
    src: url('/css/fonts/Inter-Light.ttf');
    src: url('/css/fonts/Inter-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Inter';
    src: url('/css/fonts/Inter-LightItalic.ttf');
    src: url('/css/fonts/Inter-LightItalic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Inter';
    src: url('/css/fonts/Inter-Regular.ttf');
    src: url('/css/fonts/Inter-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Inter';
    src: url('/css/fonts/Inter-Italic.ttf');
    src: url('/css/fonts/Inter-Italic.ttf') format('truetype');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: 'Inter';
    src: url('/css/fonts/Inter-Medium.ttf');
    src: url('/css/fonts/Inter-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Inter';
    src: url('/css/fonts/Inter-MediumItalic.ttf');
    src: url('/css/fonts/Inter-MediumItalic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
}

/* FONT Poppins */
@font-face {
    font-family: 'Poppins';
    src: url('/css/fonts/Poppins-Regular.ttf');
    src: url('/css/fonts/Poppins-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Poppins';
    src: url('/css/fonts/Poppins-Italic.ttf');
    src: url('/css/fonts/Poppins-Italic.ttf') format('truetype');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: 'Poppins';
    src: url('/css/fonts/Poppins-Medium.ttf');
    src: url('/css/fonts/Poppins-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Poppins';
    src: url('/css/fonts/Poppins-MediumItalic.ttf');
    src: url('/css/fonts/Poppins-MediumItalic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Poppins';
    src: url('/css/fonts/Poppins-SemiBold.ttf');
    src: url('/css/fonts/Poppins-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Poppins';
    src: url('/css/fonts/Poppins-SemiBoldItalic.ttf');
    src: url('/css/fonts/Poppins-SemiBoldItalic.ttf') format('truetype');
    font-weight: 600;
    font-style: italic;
}

@font-face {
    font-family: 'Poppins';
    src: url('/css/fonts/Poppins-Bold.ttf');
    src: url('/css/fonts/Poppins-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Poppins';
    src: url('/css/fonts/Poppins-BoldItalic.ttf');
    src: url('/css/fonts/Poppins-BoldItalic.ttf') format('truetype');
    font-weight: 700;
    font-style: italic;
}

* {
    font-family: Inter;
}

html {
    overflow-x: hidden;
}

html, body {
    height: 100%;
    margin: 0px;
    padding: 0px;
    font-size: 16px;
}

/*form {
	display:table;}
*/

h1, h2 {
    font-family: Poppins;
    font-weight: 700;
    display: none;
    visibility: hidden;
}

h3 {
    position: relative;
    font-family: Poppins;
    font-weight: 500;
    font-size: 1.5rem;
    display: inline-block;
}

    h3::before {
        content: "";
        position: absolute;
        display: block;
        width: 60px;
        height: 4px;
        bottom: -4px;
        left: 0;
        background-color: #004f9e;
        transform: scaleX(1);
        transform-origin: top left;
        transition: transform 0.3s ease;
    }

h4 {
    font-family: Poppins;
    font-weight: 600;
    font-size: 1.0rem;
    padding: 0px;
    margin: 25px 0px 5px 0px;
}

table, table tbody {
    padding: 0px;
    margin: 0px;
}

img {
    max-width: 100%;
    height: auto !important;
}

.cssoff {
    display: none;
}

.disable-content {
    display: none;
    visibility: hidden;
}

#wrap-title-image {
    position: absolute;
    top: 90px;
    height: 650px;
    width: 100%;
    overflow: hidden;
    z-index: -2;
}

.layout-start #wrap-title-image {
    height: 800px;
}


#wrap-title-image #title-image {
    position: absolute;
    top: -150px;
    overflow: hidden;
    height: 800px;
    width: 100%;
}

.layout-start #wrap-title-image #title-image {
    top: 0px;
}

#wrap-title-image #title-image .bannerImageBackground {
    height: 800px;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position-x: center;
}

#wrap-title-image #title-image-overlay {
    position: absolute;
    bottom: 0px;
    overflow: hidden;
    height: 800px;
    width: 100%;
}


    #wrap-title-image #title-image-overlay .bannerImageBackgroundOverlay {
        height: 800px;
        width: 100%;
        background-image: url('/img/HeaderPicture_Overlay_left.png'), url('/img/HeaderPicture_Overlay_right.png');
        background-size: 100% 1000px;
        background-position: left bottom, right bottom;
        background-repeat: no-repeat;
    }

@media all and (max-width: 1490px) {
    #wrap-title-image #title-image-overlay .bannerImageBackgroundOverlay {
        background-size: auto 1000px;
    }
}


#wrap-title-image div img {
    width: 100%;
}

#wrap-title-image #title-image img.bannerImage {
    display: none;
    visibility: hidden;
}


.grid-container {
    position: relative;
    top: 0px;
    display: grid;
    width: 100%;
    min-height: 100vh;
    grid-template-columns: repeat(12, minmax(0, 1fr));
}

.layout-start .grid-container {
    grid-template-areas:
        'wapp wapp wapp mnav mnav mnav mnav mnav mnav mnav sear sear'
        'head head head head head head head head head head head head'
        '.    .    qlin qlin qlin qlin qlin qlin qlin qlin .    .   '
        '.    .    main main main main main main main main .    .   '
        'fwap fwap fol2 oeff oeff oeff oeff addr addr addr folb folb'
        'copy copy copy copy flnk flnk flnk flnk flnk flnk fodb fodb';
    grid-template-rows: min-content min-content min-content auto min-content min-content;
}

.layout-standard .grid-container {
    grid-template-areas:
        'wapp wapp wapp mnav mnav mnav mnav mnav mnav mnav sear sear'
        'head head head head head head head head head head head head'
        '.    main main main main main main main main main main .   '
        'fwap fwap fol2 oeff oeff oeff oeff addr addr addr folb folb'
        'copy copy copy copy flnk flnk flnk flnk flnk flnk fodb fodb';
    grid-template-rows: min-content min-content auto min-content min-content;
}

    .wrap-wappen {
        grid-area: wapp;
        color: #000;
        text-decoration: none;
    }

        .wrap-wappen a {
            color: #000;
            text-decoration: none;
            display: inline-block;
        }

        .wrap-wappen #title-wappen {
            width: 55px;
            vertical-align: top;
            margin: 15px 5px 15px 30px;
        }

        .wrap-wappen #title-text {
            display: inline-block;
            padding: 17px 0 0 0;
        }

            .wrap-wappen #title-text #title-text-gemeinde {
                font-family: Inter;
                font-weight: 300;
                font-size: 1.375rem;
            }

            .wrap-wappen #title-text #title-text-irchenrieth {
                font-family: Inter;
                font-weight: 400;
                font-size: 1.75rem;
            }

    .wrap-mainnav {
        grid-area: mnav;
        text-align: right;
    }

    .wrap-search {
        grid-area: sear;
        text-align: right;
    }

        .wrap-search .search-searchbutton {
            visibility: hidden;
        }

        .wrap-search .search-searchbutton span {
            margin: 28px 40px;
            font-size: 2rem;
        }

        .wrap-search .search-menubutton {
            display: none;
            visibility: hidden;
            margin: 2px 0px 0 0;
        }
            .wrap-search .search-menubutton .navmenu-burgerx {
                width: 85px;
                height: 85px;
                display: flex;
                align-items: center;
                justify-content: center;
                cursor: pointer;
                position: absolute;
                top: 5px;
                right: 10px;
                z-index: 99998;
            }

            .wrap-search .search-menubutton svg {
                width: 85px;
                height: 85px;
            }

            .wrap-search .search-menubutton path {
                fill: none;
                stroke: #000000;
                stroke-width: 3;
                stroke-linecap: round;
                stroke-linejoin: round;
                --length: 24;
                --offset: -38;
                stroke-dasharray: var(--length) var(--total-length);
                stroke-dashoffset: var(--offset);
                transition: all 0.8s cubic-bezier(0.645, 0.045, 0.355, 1);
            }

            .wrap-search .search-menubutton circle {
                fill: #e8e8e8;
                opacity: 0;
                transition: opacity 0.3s;
            }

            .wrap-search .search-menubutton .navmenu-burgerx:hover circle {
                opacity: 1;
            }

/* Gesamtlänge der Pfade */
.navmenu-burgerx .line--1,
.navmenu-burgerx .line--3 {
    --total-length: 126.64183044433594;
}

.navmenu-burgerx .line--2 {
    --total-length: 70;
}

/* Aktivzustand */
.navmenu-burgerx.active .line--1,
.navmenu-burgerx.active .line--3 {
    --length: 22.627416998;
    --offset: -94.1149185097;
}

.navmenu-burgerx.active .line--2 {
    --length: 0;
    --offset: -50;
}

    .wrap-header {
        grid-area: head;
    }

        .wrap-header #header-text {
            display: block;
            margin: 300px 0 50px 50px;
            line-height: 1;
            color: #fff;
            text-shadow: #000 2px 2px 20px;
        }

        .wrap-header #header-space {
            height: 450px;
        }

        .wrap-header #header-text #header-text-willkommen {
            font-family: Meddon;
            font-weight: 400;
            font-size: 4.5rem;
        }

        .wrap-header #header-text #header-text-irchenrieth {
            font-family: Poppins;
            font-weight: 700;
            font-size: 4.5rem;
        }

    .wrap-quicklinks {
        grid-area: qlin;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        box-sizing: border-box;
        justify-content: center;
        margin: 0 0 40px 0;
    }

        .wrap-quicklinks a {
            position: relative;
            box-sizing: border-box;
            flex-grow: 1;
            flex-shrink: 1;
            flex-basis: 0;
            background-color: #004f9e;
            margin: 0.3rem 1rem;
            min-height: 130px;
            border-radius: 10px;
            color: #fff;
            text-decoration: none;
            max-width: 350px;
        }

            .wrap-quicklinks a div.quicklink-icon {
                font-size: 5rem;
                margin: 20px 40px 0 40px;
            }

            .wrap-quicklinks a div.quicklink-text {
                text-align: right;
                margin: 0 30px 10px 15px;
                transition: margin 0.7s;
                font-family: Poppins;
                white-space: nowrap;
            }

            .wrap-quicklinks a:hover div.quicklink-text {
                margin-right: 15px;
                margin-left: 30px;
            }

.wrap-main {
    grid-area: main;
    margin: 0 auto 50px;
    width: 100%;
    max-width: 2000px;
}

.layout-standard .wrap-main {
    display: flex;
    margin: 0 auto 0px;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    grid-template-areas:
        'lnav lnav lnav lnav cont cont cont cont cont cont cont cont';
}

.layout-start .wrap-main .ModulContent.landingpage-news,
.layout-start .wrap-main .ModulNews.landingpage-news {
    /*background-color: #f5ecda;*/
    position: relative;
}

    .layout-start .wrap-main .ModulContent.landingpage-news::before,
    .layout-start .wrap-main .ModulNews.landingpage-news::before {
        background-color: #f5ecda;
        content: '';
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 100vw; /* Breite des Viewports */
        height: 100%; /* Höhe des Elements */
        z-index: -1; /* Damit das Pseudo-Element hinter dem Inhalt liegt */
    }

    .layout-start .wrap-main .ModulContent.landingpage-news p {
        padding: 0px;
        margin: 0px;
    }

.layout-start .wrap-main .ModulContent p a {
    color: #000;
    text-decoration: none;
    margin: 5px 0px 35px 0;
    padding: 20px;
    display: inline-block;
}

.layout-start .wrap-main .ModulContent.landingpage-news p a:hover {
    text-decoration: underline;
}



    .wrap-main .wrap-leftnav {
        grid-area: lnav;
    }
    .wrap-main .wrap-content {
        grid-area: cont;
        width: 100%
    }

    .wrap-footerwappen {
        grid-area: fwap;
        position: relative;
        background-color: #e5eff5;
    }

        .wrap-footerwappen #footer-wappen {
            position: absolute;
            top: -50px;
            left: -16.3%;
            /*top: -50px;
            left: -50px;*/
            max-height: 100%;
            max-width: 100%;
        }

    .wrap-footeroeffnungszeiten {
        grid-area: oeff;
        padding: 30px 0 50px 0;
        background-color: #e5eff5;
        font-size: 0.875rem;
    }

    .wrap-footeradresse {
        grid-area: addr;
        padding: 30px 0 50px 0;
        background-color: #e5eff5;
        font-size: 0.875rem;
    }

    .wrap-footerlightbackground {
        grid-area: folb;
        background-color: #e5eff5;
    }

    .wrap-footerlightbackground2 {
        grid-area: fol2;
        background-color: #e5eff5;
    }

    .wrap-footercopyright {
        grid-area: copy;
        background-color: #004f9e;
        color: #fff;
        padding: 20px 0 20px 35px;
        font-family: Poppins;
        font-weight: 500;
    }

    .wrap-footerlinks {
        grid-area: flnk;
        background-color: #004f9e;
        text-align: right;
        padding: 20px 25px 20px 0;
        font-family: Poppins;
        font-weight: 500;
    }

        .wrap-footerlinks a {
            color: #fff;
            font-family: Poppins;
            font-weight: 500;
            text-decoration: none;
            margin: 0 0 0 80px;
        }

    .wrap-footerdarfbackground {
        grid-area: fodb;
        background-color: #004f9e;
    }


    /* Active User */
    .activeUserWrapper {
        display: table;
        position: absolute;
        top: 0px;
        left: 0px;
    }

    #activeUserContainer {
        clear: both;
        background: #fff;
        border-right: 1px solid #000;
        border-bottom: 1px solid #000;
        border-bottom-right-radius: 10px;
    }

    .activeUserUsers {
        display: table;
        border-bottom: 1px solid #808080;
    }

    .activeUserRow {
        display: table;
        margin: 5px;
    }

    .activeUserColUsername {
        float: left;
        padding: 0 10px 0 0;
        border-right: 1px dashed #808080;
        min-width: 100px;
    }

    .activeUserColLastActive {
        float: left;
        padding: 0 0 0 10px;
    }

    .activeUserRefTime {
        text-align: center;
        font-size: 7pt;
    }

    #activeUserButton {
        height: 25px;
        width: 25px;
        border-right: 1px solid #000;
        border-bottom: 1px solid #000;
        border-bottom-right-radius: 10px;
        background: #222;
        display: block;
    }

    .activeUserButtonRed {
        background: #c20000 !important;
        border-right-color: #580000 !important;
        border-bottom-color: #580000 !important;
    }

    #activeUserButtonIcon {
        margin: 4px 0 0 2px;
    }

    input.ModernShowInput,
    textarea.ModernShowInput {
        background-color: #e3e8ee;
        border-color: #fff #fff #999;
        border-style: solid;
        border-width: 0 0 1px;
        font-size: 10pt;
        padding: 8px;
    }

        input.ModernShowInput:focus,
        input.ModernShowInput:hover,
        textarea.ModernShowInput:focus,
        textarea.ModernShowInput:hover {
            border-color: #000;
            background-color: #e3eeef;
        }

    .ModernShowButton {
        background-color: #aaa;
        background-image: linear-gradient(#ddd 0%, #999 100%);
        border: 1px solid #999;
        box-sizing: border-box;
        color: #000 !important;
        cursor: pointer;
        display: inline-block;
        min-height: 30px;
        padding: 0 10px 2px;
        text-decoration: none;
        vertical-align: top;
    }

        .ModernShowButton:hover {
            background-color: #222;
            background-image: linear-gradient(#555 0%, #000 100%);
            border: 1px solid #111;
            color: #fff !important;
        }

    .ModernIconBlue:hover .fa {
        color: #9dd0ff;
    }

    .ModernIconRed:hover .fa {
        color: #fb9393;
    }

    .ModernIconOrange:hover .fa {
        color: #fbc493;
    }

    .ModernIconYellow:hover .fa {
        color: #fbfa93;
    }

    .ModernIconGreen:hover .fa {
        color: #a8ee79;
    }

    .ModernIconWhite:hover .fa {
        color: #eeeeee;
    }

    a.ModernShowButton, label.ModernShowButton {
        padding: 5px 13px;
    }

    .ModernShowButton.ModernShowFileinput {
        overflow: hidden;
    }

        .ModernShowButton.ModernShowFileinput input {
            display: none;
            opacity: 0;
            position: absolute;
        }

    input.FileInputHide {
        display: none;
        opacity: 0;
        position: absolute;
    }



@media all and (max-width: 2200px) {
    .layout-start .grid-container {
        grid-template-areas:
            'wapp wapp wapp mnav mnav mnav mnav mnav mnav mnav sear sear'
            'head head head head head head head head head head head head'
            '.    qlin qlin qlin qlin qlin qlin qlin qlin qlin qlin .   '
            '.    main main main main main main main main main main .   '
            'fwap fwap fol2 oeff oeff oeff oeff addr addr addr folb folb'
            'copy copy copy copy flnk flnk flnk flnk flnk flnk fodb fodb';
    }

    .layout-standard .grid-container {
        grid-template-areas:
            'wapp wapp wapp mnav mnav mnav mnav mnav mnav mnav sear sear'
            'head head head head head head head head head head head head'
            '.    main main main main main main main main main main .   '
            'fwap fwap fol2 oeff oeff oeff oeff addr addr addr folb folb'
            'copy copy copy copy flnk flnk flnk flnk flnk flnk fodb fodb';
    }
}

@media all and (max-width: 1400px) {
    .layout-start .grid-container {
        grid-template-areas:
            'wapp wapp wapp mnav mnav mnav mnav mnav mnav mnav sear sear'
            'head head head head head head head head head head head head'
            '.    qlin qlin qlin qlin qlin qlin qlin qlin qlin qlin .   '
            '.    main main main main main main main main main main .   '
            'fwap fwap fol2 oeff oeff oeff oeff addr addr addr folb folb'
            'copy copy copy copy flnk flnk flnk flnk flnk flnk fodb fodb';
    }

    .layout-standard .grid-container {
        grid-template-areas:
            'wapp wapp wapp mnav mnav mnav mnav mnav mnav mnav sear sear'
            'head head head head head head head head head head head head'
            '.    main main main main main main main main main main .   '
            'fwap fwap fol2 oeff oeff oeff oeff addr addr addr folb folb'
            'copy copy copy copy flnk flnk flnk flnk flnk flnk fodb fodb';
    }
}

@media all and (max-width: 1200px) {
    .layout-start .grid-container {
        grid-template-areas:
            'wapp mnav mnav mnav mnav mnav mnav mnav mnav mnav sear sear'
            'head head head head head head head head head head head head'
            'qlin qlin qlin qlin qlin qlin qlin qlin qlin qlin qlin qlin'
            'main main main main main main main main main main main main'
            'fwap fwap oeff oeff oeff oeff oeff oeff addr addr addr addr'
            'copy copy copy copy flnk flnk flnk flnk flnk flnk flnk flnk';
    }

    .layout-standard .grid-container {
        grid-template-areas:
            'wapp mnav mnav mnav mnav mnav mnav mnav mnav mnav sear sear'
            'head head head head head head head head head head head head'
            '.    main main main main main main main main main main .   '
            'fwap fwap oeff oeff oeff oeff oeff addr addr addr addr addr'
            'copy copy copy copy flnk flnk flnk flnk flnk flnk flnk flnk';
    }

    .wrap-wappen #title-text {
        display: none;
        visibility: hidden;
    }

    .wrap-header #header-text #header-text-willkommen {
        font-size: 3rem;
    }

    .wrap-header #header-text #header-text-irchenrieth {
        font-size: 3rem;
    }
}

@media all and (max-width: 1000px) {
    .layout-start .grid-container {
        grid-template-areas:
            'wapp wapp sear sear sear sear sear sear sear sear sear sear'
            'head head head head head head head head head head head head'
            'qlin qlin qlin qlin qlin qlin qlin qlin qlin qlin qlin qlin'
            'main main main main main main main main main main main main'
            'fwap fwap fwap fwap oeff oeff oeff oeff oeff oeff oeff oeff'
            'fwap fwap fwap fwap addr addr addr addr addr addr addr addr'
            'flnk flnk flnk flnk flnk flnk flnk flnk flnk flnk flnk flnk'
            'copy copy copy copy copy copy copy copy copy copy copy copy';
    }

    .layout-standard .grid-container {
        grid-template-areas:
            'wapp wapp sear sear sear sear sear sear sear sear sear sear'
            'head head head head head head head head head head head head'
            'main main main main main main main main main main main main'
            'fwap fwap fwap fwap oeff oeff oeff oeff oeff oeff oeff oeff'
            'fwap fwap fwap fwap addr addr addr addr addr addr addr addr'
            'flnk flnk flnk flnk flnk flnk flnk flnk flnk flnk flnk flnk'
            'copy copy copy copy copy copy copy copy copy copy copy copy';
    }

    .wrap-search .search-menubutton {
        display: inline-block;
        visibility: visible;
        vertical-align: top;
    }

    .wrap-search .search-searchbutton {
        display: inline-block;
        vertical-align: top;
    }
        .wrap-search .search-searchbutton span {
            margin: 28px 3px;
            font-size: 2rem;
        }

    .wrap-mainnav {
        display: none;
        visibility: hidden;
    }

    .wrap-leftnav {
        display: none;
        visibility: hidden;
    }

    .wrap-header #header-text #header-text-willkommen {
        font-size: 2.5rem;
    }

    .wrap-header #header-text #header-text-irchenrieth {
        font-size: 2.5rem;
    }

    .wrap-main .wrap-content {
        padding: 0 0 45px 0;
    }

    .wrap-footerwappen #footer-wappen {
        top: -30px;
        left: -22%;
    }

    .wrap-footercopyright {
        text-align: center;
    }

    .wrap-footerlinks {
        text-align: center;
    }

        .wrap-footerlinks a {
            margin: 0 20px 0 20px;
        }



    body.mobilemenu-noscroll {
        overflow: hidden;
        position: relative;
    }

    body.mobilemenu-noscroll .navmenu-mobile-overlay {
        display: block;
        visibility: visible;
    }

    .wrap-header #header-space {
        height: 400px;
    }


}


@media all and (max-width: 500px) {
    .wrap-search span {
        margin: 27px 27px 27px 0;
    }
}



