@charset "utf-8";

/* ==========================================================================
   1. WEBFONTS (Source Sans Pro & Vollkorn)
   ========================================================================== */

/* --- Source Sans Pro --- */
@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/sourcesanspro-extralight-webfont.woff2') format('woff2'),
         url('../fonts/sourcesanspro-extralight-webfont.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/sourcesanspro-extralightitalic-webfont.woff2') format('woff2'),
         url('../fonts/sourcesanspro-extralightitalic-webfont.woff') format('woff');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/sourcesanspro-light-webfont.woff2') format('woff2'),
         url('../fonts/sourcesanspro-light-webfont.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/sourcesanspro-lightitalic-webfont.woff2') format('woff2'),
         url('../fonts/sourcesanspro-lightitalic-webfont.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/sourcesanspro-regular-webfont.woff2') format('woff2'),
         url('../fonts/sourcesanspro-regular-webfont.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/sourcesanspro-italic-webfont.woff2') format('woff2'),
         url('../fonts/sourcesanspro-italic-webfont.woff') format('woff');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/sourcesanspro-semibold-webfont.woff2') format('woff2'),
         url('../fonts/sourcesanspro-semibold-webfont.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/sourcesanspro-semibolditalic-webfont.woff2') format('woff2'),
         url('../fonts/sourcesanspro-semibolditalic-webfont.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/sourcesanspro-bold-webfont.woff2') format('woff2'),
         url('../fonts/sourcesanspro-bold-webfont.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/sourcesanspro-bolditalic-webfont.woff2') format('woff2'),
         url('../fonts/sourcesanspro-bolditalic-webfont.woff') format('woff');
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/sourcesanspro-black-webfont.woff2') format('woff2'),
         url('../fonts/sourcesanspro-black-webfont.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans Pro';
    src: url('../fonts/sourcesanspro-blackitalic-webfont.woff2') format('woff2'),
         url('../fonts/sourcesanspro-blackitalic-webfont.woff') format('woff');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

/* --- Vollkorn --- */
@font-face {
    font-family: 'Vollkorn';
    src: url('../fonts/vollkorn-regular-webfont.woff2') format('woff2'),
         url('../fonts/vollkorn-regular-webfont.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Vollkorn';
    src: url('../fonts/vollkorn-italic-webfont.woff2') format('woff2'),
         url('../fonts/vollkorn-italic-webfont.woff') format('woff');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Vollkorn';
    src: url('../fonts/vollkorn-semibold-webfont.woff2') format('woff2'),
         url('../fonts/vollkorn-semibold-webfont.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Vollkorn';
    src: url('../fonts/vollkorn-semibolditalic-webfont.woff2') format('woff2'),
         url('../fonts/vollkorn-semibolditalic-webfont.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Vollkorn';
    src: url('../fonts/vollkorn-bold-webfont.woff2') format('woff2'),
         url('../fonts/vollkorn-bold-webfont.woff') format('woff');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Vollkorn';
    src: url('../fonts/vollkorn-bolditalic-webfont.woff2') format('woff2'),
         url('../fonts/vollkorn-bolditalic-webfont.woff') format('woff');
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Vollkorn';
    src: url('../fonts/vollkorn-black-webfont.woff2') format('woff2'),
         url('../fonts/vollkorn-black-webfont.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Vollkorn';
    src: url('../fonts/vollkorn-blackitalic-webfont.woff2') format('woff2'),
         url('../fonts/vollkorn-blackitalic-webfont.woff') format('woff');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}


/* ==========================================================================
   2. BASIS-LAYOUT & TYPOGRAFIE
   ========================================================================== */

:root {
    background-color: #fff;
}

html {
    font-size: 110%;
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
    font-family: 'Source Sans Pro', sans-serif;
    font-size: 100%;
    line-height: 1.3;
    font-weight: 400;
    background-color: #F7F7F7;
    color: #3b3a3a;
}

.container {
    max-width: 1276px;
}

header {
    margin: 0;
    padding: 0;
}

main {
    min-height: 400px; 
    max-width: 1400px;
    margin: 0 auto; 
    padding: 0 15px 80px 15px; 
}

footer {
    background: url(../images/hnt_footer.jpg) repeat !important;
}

section {
    margin: 0 auto;
    width: 100%;
    overflow: hidden;
}

.top {
    margin: 0;
    background-color: #fff;
}

.shadow {
    box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.25);
}

img {
    border: 0;
    max-width: 100%;
    height: auto;
}

/* ==========================================================================
   3. RESPONSIVE BREAKPOINTS
   ========================================================================== */

/* Mobile (<= 767px) */
@media (max-width: 767px) {
    main {
        padding:0 10px;
    }

    footer {
        color:#ffffff;
        font-size: 85%;
        margin:0 auto;
        max-width: 767px;
        padding: 20px 15px;
        overflow: hidden;
    }

    #mediahead {
        position: relative;
        top: 62px;
        left: 0;
        z-index: 1;
    }

    #top {
        display: none;
    }

    #header {
        width: 100%;
        background-color: #fff;
        position: fixed;
        border-bottom: 5px solid #056733;
        z-index: 2;
    }

    .siteBody {
        margin-top: 62px;
    }

    .formResponsive input[type="text"], 
    .formResponsive input[type="password"], 
    .formResponsive textarea {
        width: 86% !important;
    }

    .formResponsive select {
        width: 90% !important;
    }

    .mitarbeiterliste {
        width: 100%;
    }

    .mitarbeiter {
        width: 80%; 
        clear: left; 
    }

    .masp {
        margin-bottom: 30px;
    }

    .mitarbeiter img {
        float: left; 
        margin: 0 20px 10px 0; 
    }

    h1 {font-size: 160%; font-family: 'Vollkorn', sans-serif; font-weight: 400; color: #056733; margin: 20px 0; line-height: 1.2;}
    h2 {font-size: 160%; font-family: 'Vollkorn', sans-serif; font-weight: 400; color: #056733; margin: 0 0 20px 0; line-height: 1;}
    footer h3 {font-size: 120%; font-family: 'Vollkorn', sans-serif; font-weight: 500; font-style: italic; color: #fff; margin: 0 0 20px 0; line-height: 1;}
    h3 {font-size: 120%; font-family: 'Source Sans Pro', sans-serif; font-weight: 600; color: #000; margin: 0 0 20px 0; line-height: 1;}
    h4 {font-size: 100%; font-family: 'Vollkorn', sans-serif; font-weight: 600; color: #007fb3; margin: 20px 0; line-height: normal;}
    h5 {font-size: 100%; font-family: 'Vollkorn', sans-serif; font-weight: 600; color: #fff !important; margin: 0 0 20px 0; line-height: 1;}

    form {margin: 0 0 0 20px !important;}

    #mod-custom157 {
        position: fixed;
        top: -2px;
        right: 50%;
        z-index: 40000;
    }

    .toptable {width: 130px; margin: 0; padding: 5px 0 0 0; display: table; font-size: 80%;}
    .toptablecell1, .toptablecell2, .toptablecell4 {display: table-cell; vertical-align: top;}
    .toptablecell1 img, .toptablecell2 img, .toptablecell4 img {float: right; margin: 8px 5px 0 10px; width: 25px; height: auto;}

    #mod-custom156 {
        position: fixed;
        top: 8px;
        right: 40px;
        z-index: 40000;
        max-width: 100px;
        height: auto;
    }
    #mod-custom156 img {max-width: 130px; height: auto;}

    #mod-custom129, #mod-custom126, #mod-custom114 {
        max-height: 250px;
        overflow: hidden;
    }

    #mod-custom104, #mod-custom105 {color: #fff;}
    .blog-featured .blog-items .blog-item .item-content img {max-width: 100%; height: auto;}
}

/* Tablet (768px - 979px) */
@media (min-width: 768px) and (max-width: 979px) {
    main {
        padding:0 15px;
    }

    footer {
        color:#ffffff;
        font-size: 85%;
        margin:0 auto;
        max-width: 979px;
        padding: 30px 50px;
        overflow: hidden;
    }

    #mediahead {
        position: relative;
        top: 62px;
        left: 0;
        z-index: 1;
    }

    #top {
        display: none;
    }

    #header {
        width: 100%;
        background-color: #fff;
        position: fixed;
        border-bottom: 5px solid #056733;
        z-index: 2;
    }

    .siteBody {margin-top: 62px;}

    .navi-li {
        width: 73%;
        float: left;
        padding: 2.2% 0 0 2% !important;
        font-size: 60%;  
    }

    .nav-pills li a {padding: 0 5px !important;}
    .navi-re {
        float: left;
        width: 22%;
        padding: 1% 0 0 0;
    }

    table.menu99 a {
        padding-right: 10px !important;
        padding-left: 2px !important;
        font-size: 14px !important;
    }

    .logoimg {margin: 5px 0 0 0;}
    .bild {margin-top: -20px;}
    .custom-bild, .newsflash-bild {margin-top: -30px;}

    .formResponsive input, .formResponsive textarea {width: 290px;}
    .mitarbeiterliste {width: 100%;}
    .mitarbeiter {width: 85%; max-height: 140px; clear: left;}
    .masp {margin-bottom: 10px;}
    .mitarbeiter img {float: left; margin: 0 10px 10px 0;}

    h1 {font-size: 160%; font-family: 'Vollkorn', sans-serif; font-weight: 400; color: #056733; margin: 20px 0; line-height: 1.2;}
    h2 {font-size: 160%; font-family: 'Vollkorn', sans-serif; font-weight: 400; color: #056733; margin: 0 0 20px 0; line-height: 1;}
    footer h3 {font-size: 150%; font-family: 'Vollkorn', sans-serif; font-weight: 500; font-style: italic; color: #fff; margin: 0 0 20px 0; line-height: 1;}
    h3 {font-size: 120%; font-family: 'Source Sans Pro', sans-serif; font-weight: 600; color: #000; margin: 0 0 20px 0; line-height: 1;}
    h4 {font-size: 100%; font-family: 'Vollkorn', sans-serif; font-weight: 600; color: #007fb3; margin: 20px 0; line-height: normal;}
    h5 {font-size: 100%; font-family: 'Vollkorn', sans-serif; font-weight: 600; color: #056733; margin: 0 0 20px 0; line-height: 1;}

    #mod-custom157 {
        position: fixed;
        top: -2px;
        right: 50%;
        z-index: 40000;
    }

    .toptable {width: 130px; margin: 0; padding: 0; display: table; font-size: 80%;}
    .toptablecell1, .toptablecell2, .toptablecell4 {display: table-cell; vertical-align: top;}
    .toptablecell1 img, .toptablecell2 img, .toptablecell4 img {float: right; margin: 8px 10px 0 10px; width: 35px; height: auto;}

    #mod-custom156 {
        position: fixed;
        top: 4px;
        right: 10px;
        z-index: 40000;
    }

    #mod-custom104 {color: #fff; font-size: 80%; line-height: 1.1;}
    #mod-custom105 {color: #fff; font-size: 80%; line-height: 1.1; padding-left: 170px;}
    #mod-custom119 {margin-top: -99px;}
    #mod-custom129, #mod-custom114 {max-height: 300px; overflow: hidden;}
    #cf_1 {margin-left: -30px; padding-right: 5px;}
    .blog-featured .blog-items .blog-item .item-content img {max-width: 100%; height: auto;}
}

/* Small Desktop (980px - 1199px) */
@media (min-width: 980px) and (max-width: 1199px) {
    main {
        padding:0 15px;
    }

    footer {
        color:#ffffff;
        font-size: 85%;
        margin:0 auto;
        max-width: 1199px;
        padding: 0 180px;
        overflow: hidden;
    }
    
    .navi-li {
        width: 73%;
        float: left;
        padding: 2.2% 0 0 1%;    
        font-size: 80%;  
    }

    .nav-pills li a {padding: 0 7px !important;}
    .navi-re {
        float: left;
        width: 22%;
        padding: 1% 0 0 0;
    }

    table.menu99 a {
        padding-right: 15px !important;
        padding-left: 0 !important;
        font-size: 16px !important;
    }

    .logoimg {margin: 4px 0 0 0;}
    .bild {margin-top: -50px;}
    .custom-bild, .newsflash-bild {margin-top: -10px;}
    .formResponsive input, .formResponsive textarea {width: 290px;}
    p {font-size: 90%;}

    .mitarbeiterliste {width: 100%;}
    .mitarbeiter {float: left; width: 45%; max-height: 140px; line-height: 1.1;}
    .mitarbeiter img {float: left; margin: 0 10px 10px 0; width: 40%;}

    .headerueberuns {margin-top: 110px;}
    .headerregietische {margin-top: 99px;}

    h1 {font-size: 200%; font-family: 'Vollkorn', sans-serif; font-weight: 400; color: #056733; margin: 20px 0; line-height: 1.2;}
    h2 {font-size: 150%; font-family: 'Vollkorn', sans-serif; font-weight: 400; color: #056733; margin: 0 0 20px 0; line-height: 1;}
    footer h3 {font-size: 120%; font-family: 'Vollkorn', sans-serif; font-weight: 500; font-style: italic; color: #fff; margin: 20px 0; line-height: 1;}
    h3 {font-size: 120%; font-family: 'Source Sans Pro', sans-serif; font-weight: 600; color: #000; margin: 0 0 20px 0; line-height: 1;}
    h4 {font-size: 100%; font-family: 'Vollkorn', sans-serif; font-weight: 600; color: #007fb3; margin: 20px 0; line-height: normal;}
    h5 {font-size: 100%; font-family: 'Vollkorn', sans-serif; font-weight: 600; color: #056733; margin: 0 0 20px 0; line-height: 1;}

    .blog-featured .blog-items .blog-item .item-content img {max-width: 100%; height: auto;}

    #mod-custom94 {padding: 20px 0 30px 20px; width: 100%; font-size: 75%;}
    .toptable {width: 100%; margin: 0; padding: 0; display: table; color: #056733;}
    .toptablecell1 {display: table-cell; width: 22%; vertical-align: top; padding-top: 30px;}
    .toptablecell1 img {float: left; margin: 5px 15px 0 10px; max-width: 25px; height: auto;}
    .toptablecell1 p {line-height: 1; padding-top: 20px;}
    .toptablecell2 {display: table-cell; width: 35%; text-align: left; vertical-align: top; padding-top: 30px;}
    .toptablecell2 img {float: left; margin: 5px 15px 10px 10px; max-width: 25px; height: auto;}
    .toptablecell2 p {line-height: 1; padding-top: 10px;}
    .toptablecell3 {display: table-cell; width: 22%; text-align: left; vertical-align: top; padding-top: 30px;}
    .toptablecell3 img {float: left; margin: 5px 15px 10px 10px; max-width: 25px; height: auto;}
    .toptablecell3 p {line-height: 1; padding-top: 10px;}
    .toptablecell4 {display: table-cell; width: 10%; vertical-align: top; padding-top: 30px;}
    .toptablecell4 img {float: left; margin: 5px 15px 0 10px; max-width: 25px; height: auto;}
    .toptablecell5 {display: table-cell; width: auto; text-align: right; vertical-align: top;}
    .toptablecell5 img {float: right; margin: 25px 20px 0 10px; max-width: 200px; height: auto;}

    #mod-custom104 {color: #fff; font-size: 80%; line-height: 1.1;}
    #mod-custom105 {color: #fff; font-size: 80%; line-height: 1.1; padding-left: 170px;}
    #mod-custom119 {margin-top: -99px;}
    #mod-custom155 {margin-top: 49px;}
    #mod-custom129 {max-height: 350px; overflow: hidden;}
    #mod-custom126 {margin-top: -110px;}
    #mediahead {}
    #cf_1 {margin-left: -30px; padding-right: 5px;}
    #mod-custom157, #mod-custom156 {display: none;}
}

/* Standard Desktop (1200px - 1649px) */
@media (min-width: 1200px) and (max-width: 1649px) {

    main {
        padding:0 15px;
    }

    footer {
        color:#ffffff;
        font-size: 85%;
        margin:0 auto;
        max-width: 1649px;
        padding: 40px 180px;
        overflow: hidden;
    }

    .navi-li {
        width: 73%;
        float: left;
        padding: 2.2% 0 0 5%;    
    }
    .navi-re {
        float: left;
        width: 22%;
        padding: 1% 0 0 0;
    }

    table.menu99 a {
        padding-left: 0 !important;
        font-size: 20px !important;
    }

    .logoimg {margin: 0 15px 10px 0;}
    .bild {margin-top: -50px;}
    .custom-bild, .newsflash-bild {margin-top: -6px;}
    .formResponsive input, .formResponsive textarea {width: 290px;}

    .mitarbeiterliste {width: 100%;}
    .mitarbeiter {float: left; width: 45%; max-height: 140px;}
    .mitarbeiter img {float: left; margin-right: 15px;}

    .headerueberuns, .headerregietische {margin-top: 81px;}

    h1 {font-size: 250%; font-family: 'Vollkorn', sans-serif; font-weight: 400; color: #056733; margin: 20px 0; line-height: 1.2;}
    h2 {font-size: 200%; font-family: 'Vollkorn', sans-serif; font-weight: 400; color: #056733; margin: 0 0 20px 0; line-height: 1;}
    footer h3 {font-size: 150%; font-family: 'Vollkorn', sans-serif; font-weight: 500; font-style: italic; color: #fff; margin: 0 0 20px 0; line-height: 1;}
    h3 {font-size: 150%; font-family: 'Source Sans Pro', sans-serif; font-weight: 600; color: #000; margin: 0 0 20px 0; line-height: 1;}
    h4 {font-size: 120%; font-family: 'Vollkorn', sans-serif; font-weight: 600; color: #007fb3; margin: 20px 0; line-height: normal;}
    h5 {font-size: 120%; font-family: 'Vollkorn', sans-serif; font-weight: 600; color: #056733; margin: 0 0 20px 0; line-height: 1;}

    #mod-custom94 {padding: 20px 0 30px 20px; width: 100%; font-size: 80%;}
    .toptable {width: 100%; margin: 0; padding: 0; display: table; color: #056733;}
    .toptablecell1 {display: table-cell; width: 22%; vertical-align: top; padding-top: 30px;}
    .toptablecell1 img {float: left; margin: 5px 15px 0 10px;}
    .toptablecell1 p {line-height: 1; padding-top: 20px;}
    .toptablecell2 {display: table-cell; width: 35%; text-align: left; vertical-align: top; padding-top: 30px;}
    .toptablecell2 img {float: left; margin: 5px 15px 10px 10px;}
    .toptablecell2 p {line-height: 1; padding-top: 10px;}
    .toptablecell3 {display: table-cell; width: 22%; text-align: left; vertical-align: top; padding-top: 30px;}
    .toptablecell3 img {float: left; margin: 5px 15px 10px 10px;}
    .toptablecell3 p {line-height: 1; padding-top: 10px;}
    .toptablecell4 {display: table-cell; width: 10%; vertical-align: top; padding-top: 30px;}
    .toptablecell4 img {float: left; margin: 5px 15px 0 10px;}
    .toptablecell5 {display: table-cell; width: auto; text-align: right; vertical-align: top;}
    .toptablecell5 img {float: right; margin: 30px 20px 0 10px; max-width: 200px; height: auto;}

    #mod-custom104 {color: #fff; font-size: 80%; line-height: 1.1;}
    #mod-custom105 {color: #fff; font-size: 80%; line-height: 1.1; padding-left: 220px;}
    #mod-custom129 {max-height: 350px; overflow: hidden;}
    #mod-custom126 {margin-top: -110px;}
    #cf_1 {margin-left: -30px; padding-right: 5px;}
    #mod-custom157, #mod-custom156 {display: none;}
}

/* Large Screens (>= 1650px) */
@media (min-width: 1650px) {

    footer {
        color:#ffffff;
        font-size: 80%;
        margin:0 auto;
        max-width: 1920px;
        padding: 50px 250px;
        overflow: hidden;
    }

    .navi-li {
        width: 73%;
        float: left;
        padding: 2.2% 0 0 5%;    
    }
    .navi-re {
        float: left;
        width: 22%;
        padding: 1% 0 0 0;
    }

    .logoimg {margin: 0 15px 20px 0;}
    .bild {margin-top: -12px;}
    .custom-bild, .newsflash-bild {margin-top: -6px;}
    .formResponsive input, .formResponsive textarea {width: 290px;}

    .mitarbeiterliste {width: 100%;}
    .mitarbeiter {float: left; width: 45%; max-height: 140px;}
    .mitarbeiter img {float: left; margin-right: 15px;}

    .headerueberuns {margin-top: 59px;}
    .headerregietische {margin-top: 59px;}

    h1 {font-size: 250%; font-family: 'Vollkorn', sans-serif; font-weight: 400; color: #056733; margin: 20px 0; line-height: 1.2;}
    h2 {font-size: 200%; font-family: 'Vollkorn', sans-serif; font-weight: 400; color: #056733; margin: 0 0 20px 0; line-height: 1;}
    footer h3 {font-size: 150%; font-family: 'Vollkorn', sans-serif; font-weight: 500; font-style: italic; color: #fff; margin: 0 0 20px 0; line-height: 1;}
    h3 {font-size: 150%; font-family: 'Source Sans Pro', sans-serif; font-weight: 600; color: #000; margin: 0 0 20px 0; line-height: 1;}
    h4 {font-size: 120%; font-family: 'Vollkorn', sans-serif; font-weight: 600; color: #007fb3; margin: 20px 0; line-height: normal;}
    h5 {font-size: 120%; font-family: 'Vollkorn', sans-serif; font-weight: 600; color: #056733; margin: 0 0 20px 0; line-height: 1;}

    #mod-custom94 {padding: 20px 0 30px 100px; width: 100%; font-size: 90%;}
    .toptable {width: 100%; margin: 0; padding: 0; display: table; color: #056733;}
    .toptablecell1 {display: table-cell; width: 17%; vertical-align: top; padding-top: 30px;}
    .toptablecell1 img {float: left; margin: 5px 15px 0 10px;}
    .toptablecell1 p {line-height: 1; padding-top: 20px;}
    .toptablecell2 {display: table-cell; width: 25%; text-align: left; vertical-align: top; padding-top: 30px;}
    .toptablecell2 img {float: left; margin: 5px 15px 10px 10px;}
    .toptablecell2 p {line-height: 1; padding-top: 10px;}
    .toptablecell3 {display: table-cell; width: 17%; text-align: left; vertical-align: top; padding-top: 30px;}
    .toptablecell3 img {float: left; margin: 5px 15px 10px 10px;}
    .toptablecell3 p {line-height: 1; padding-top: 10px;}
    .toptablecell4 {display: table-cell; width: 10%; vertical-align: top; padding-top: 30px;}
    .toptablecell4 img {float: left; margin: 5px 15px 0 10px;}
    .toptablecell5 {display: table-cell; width: auto; text-align: right; vertical-align: top;}
    .toptablecell5 img {float: right; margin: 5px 100px 0 10px;}

    #mod-custom104 {color: #fff; font-size: 80%; line-height: 1.1;}
    #mod-custom105 {color: #fff; font-size: 80%; line-height: 1.1; padding-left: 220px;}
    #mod-custom129 {max-height: 350px; overflow: hidden;}
    #mod-custom126 {margin-top: -110px;}
    #cf_1 {margin-left: -30px; padding-right: 5px;}
    #mod-custom157, #mod-custom156 {display: none;}

    footer {
    padding: 40px 270px;
    margin: 0 auto;
    max-width: 1400px;
    color:#ffffff;
    font-size:80%;
    }
}


/* ==========================================================================
   4. WEITERE LAYOUT-ELEMENTE & JOOMLA-STANDARDS
   ========================================================================== */

.logo-sm {
    text-align: right;
    margin: 0;
    padding: 2% 3% 0 0;
}

.logo-sm img {
    max-width: 62%;
}

.bildkl {
    margin: 0 0 -10px 0;
}

.strich {
    margin-top: 1px;
    border-top: 7px solid #056733;
}

.strich2 {
    font-size: 70%;
    margin-top: 3%;
    color: #c8cac9;
    border-top: 1px solid #c8cac9;
    background-color: #fff;
    margin-bottom: -1.5%;
    padding-bottom: 2%;
}

/* Breadcrumbs (Joomla modern) */
.breadcrumbs, .breadcrumb {
    font-size: 80%;
    padding: 8px 0;
    background-color: #F7F7F7;
}

.breadcrumb .active {
    color: #3b3a3a;
}

.bottom {
    width: 100%;
    display: table;
    margin: 0;
    color: #056733;
    line-height: 1.1;
}

.bottom-sm p {
    color: #fff;
}

.custom-bottom-sm {
    margin-bottom: 10%;
    color: #056733;
    font-size: 75%;
    line-height: 1.2;
}

.custom-leer {
    display: table-cell;
}

.phocamaps-box {
    text-align: left;
    line-height: 1;
}

/* Navigation */
.nav {
    text-transform: uppercase;
}

.navi-li a {
    color: #056733;
    text-decoration: none;
}

.nav-pills .nav-link.active,
.nav-pills > .active > a {
    color: #fff;
    background-color: #056733;
}

.nav > li > a:hover, 
.nav > li > a:focus,
.nav-link:hover {
    text-decoration: none;
    background-color: #eee;
}

a:hover, a:focus {
    color: #056733;
}

/* Links */
.breadcrumbs a:link, .breadcrumbs a:visited {
    color: #056733 !important;
    text-decoration: none;
    font-weight: 500;
}
.breadcrumbs a:hover, .breadcrumbs a:focus {
    color: #000 !important;
    text-decoration: none;
    font-weight: 500;
}

main a:link, main a:visited {
    color: #000 !important;
    text-decoration: none;
    font-weight: 700;
}
main a:hover, main a:focus {
    color: #056733 !important;
    text-decoration: none;
    font-weight: 700;
}

footer a:link, footer a:visited {
    color: #fff;
    text-decoration: none;
}
footer a:hover, footer a:focus {
    color: #a2a1a1;
    text-decoration: none;
}

/* Hilfsklassen */
.hidden {
    display: none !important;
}

.unsichtbar, .u2, .invisible, .unseen {
    display: inline;
    height: 0;
    left: -3000px;
    position: absolute;
    top: -2000px;
    width: 0;
    z-index: 250;
}

/* Formulare */
.formContainer {
    margin: 0 0 0 -20px;
}

.formContainer ul li,
.rsform-block li {
    list-style-type: none;
}

.formResponsive select {
    width: 300px;
}

.formBody a:link {font-size: 100%; font-family: 'Source Sans Pro', sans-serif; font-weight: 300; margin: 0; text-decoration: none;}
.formBody a:visited {font-size: 100%; font-family: 'Source Sans Pro', sans-serif; font-style: italic; font-weight: 300; color: #fff; margin: 0; text-decoration: none;}
.formBody a:hover {font-size: 100%; font-family: 'Source Sans Pro', sans-serif; font-style: normal; font-weight: 300; color: #fff; margin: 0; text-decoration: none;}

/* Buttons (Modernisierter Gradient ohne IE-Filter) */
p.readmore .btn,
.btn-form {
    color: #ffffff;
    background-color: #ec7902;
    background-image: linear-gradient(to bottom, #f3ac62, #ec7902);
    border: 1px solid #ec7902;
    border-radius: 15px;
    padding: 3px 12px;
    text-decoration: none;
    display: inline-block;
}

p.readmore .btn:hover,
.btn-form:hover {
    color: #ffffff;
    background-color: #d66d02;
    background-image: none;
}

p.readmore a .icon-chevron-right {
    display: none;
}

/* Sonstiges */
.row {
    margin-left: 0;
}

.infobox {
    width: 300px;
    padding: 15px;
    background-color: #DBDBDB;
    font-size: 90%;
}

.seitenanfang {
    margin-top: 40px;
    color: #5c5c5a;
    font-size: 70%;
}

.olwidgetPopupPage h1 {font-size: 110%; font-family: 'Vollkorn', sans-serif; font-weight: 600; color: #056733; margin: 0 0 20px 0; line-height: 1;}
.olwidgetPopupPage p {font-size: 80%; line-height: 1;}