body,form,figure{margin:0;padding:0}img{border:0}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font-size:100.01%}select,input,textarea{font-size:99%}#container,.inside{position:relative}#main,#left,#right{float:left;position:relative}#main{width:100%}#left{margin-left:-100%}#right{margin-right:-100%}#footer{clear:both}#main .inside{min-height:1px}.ce_gallery>ul,.content-gallery>ul{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li,.content-gallery>ul li{float:left}.ce_gallery>ul li.col_first,.content-gallery>ul li.col_first{clear:left}.float_left,.media--left>figure{float:left}.float_right,.media--right>figure{float:right}.block{overflow:hidden}.media{display:flow-root}.clear,#clear{height:.1px;font-size:.1px;line-height:.1px;clear:both}.invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.custom{display:block}#container:after,.custom:after{content:"";display:table;clear:both}
@media (max-width:767px){#wrapper{margin:0;width:auto}#container{padding-left:0;padding-right:0}#main,#left,#right{float:none;width:auto}#left{right:0;margin-left:0}#right{margin-right:0}}img{max-width:100%;height:auto}.audio_container audio{max-width:100%}.video_container video{max-width:100%;height:auto}.aspect,.responsive{position:relative;height:0}.aspect iframe,.responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%}.aspect--16\:9,.responsive.ratio-169{padding-bottom:56.25%}.aspect--16\:10,.responsive.ratio-1610{padding-bottom:62.5%}.aspect--21\:9,.responsive.ratio-219{padding-bottom:42.8571%}.aspect--4\:3,.responsive.ratio-43{padding-bottom:75%}.aspect--3\:2,.responsive.ratio-32{padding-bottom:66.6666%}.aspect--9\:16,.responsive.ratio-916{padding-bottom:177.7777%}.aspect--1\:1,.responsive.ratio-11{padding-bottom:100%}
/* * * * * ehemalige interne Styles * * * * */

/*

Lustat Contao Theme - Seitenlayouts und Styles

Gemäss Auswertung binden alle Seitenlayouts, die noch auf die internen Styles zurückgreifen, auch die Datei layout.css ein. Deshalb können die internen Styles in den Anfang übernommen werden (die internen Styles wurden jeweils vor den externen geladen)

Betroffene Layouts:
- Analysen - Querschnittsthemen - Regionale Disparitäten 2020
- Analysen - Webartikel - Corona Reporting
- Analysen - Webartikel (Seitenspalte für Navigation und andere Webartikel)
- Erhebung Gemeindefinanzen
- Homepage
- Homepage Kopie für Eckdaten (Kombination mit altem Layout)
- Indikatoren (angepasste Navigation ab der dritten Ebene)
- Indikatoren statische Seiten (angepasste Navigation ab der dritten Ebene)
- Inhalte - Kontakte
- Inhalte - Team
- Inhalte (Navigation auf der linken Seite)
- Mobile App - Artikel
- Spitex
- Startseite

*/


/* * * ehemalige interne Styles: Inhalte * * */

a.tooltips {
    position: relative;
}

a.tooltips span {
    width: 400px;
    position: absolute;
    display: none;
    padding: .5em 1em;
    background-color: rgba(111, 111, 111, .95);
    border: 1px solid rgba(196, 196, 196, .95);
    border-radius: 6px;
    color: #fff;
}

a.tooltips span:after {
    width: 0;
    height: 0;
    left: 10%;
    top: 100%;
    position: absolute;
    content: '';
    border-top: 8px solid rgba(111, 111, 111, .95);
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
}

a:hover.tooltips span {
    bottom: 100%;
    display: block;
    margin-bottom: .5em;
    margin-left: -2em;
    z-index: 999;
}

div.ce_lustat_indikator div.highchart {
    width: 100%;
    margin: 2em auto;
}

img {
    display: block;
}

.ce_gallery img,
p img {
    border: 1px solid #c4c4c4;
    box-sizing: border-box;
}

div.ce_indikatoren_icon {
    float: left;
    padding: .5em 1.5em 1em 1em;
}

div.ce_image.block + div.ce_text > p:first-child {
    margin-top: 2em;
}


/* * * ehemalige interne Styles: Layout_Desktop_0000 * * */

#container {
    margin-top: 20px;
}

#header {
    padding-top: 10px;
    border-bottom: 1px solid #c4c4c4;
}

div#main div.inside {
    font-size: 100%;
    line-height: 1.7em;
    font-weight: normal;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}

aside#left div.inside {
    margin-top: 68px;
    padding-right: 40px;
}

*[class*="grid"],
.mod_article *[class*="ce_"],
.mod_article *[class*="mod_"] {
    margin-right: 10px;
    margin-left: 10px;
}

.mod_article div.ce_table {
    margin: 0;
}

#header-slider [class*="ce_"] {
    margin: 0;
}

.slider-wrapper .ce_text {
    margin-right: 0;
    margin-left: 0;
}

ul,
li {
    margin: 0;
    padding: 0;
}

ul {
    list-style-type: square;
}

li {
    margin-left: 2em;
}

#wrapper-footer {
    padding-top: 20px;
    padding-bottom: 30px;
}

#wrapper-footer .clear {
    height: 40px;
    margin-right: 10px;
    margin-left: 10px;
    border-bottom: 1px solid #c4c4c4;
}

.ce_gallery > ul > li {
    float: none;
    clear: both;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 0;
}


/* * * ehemalige interne Styles: Layout_Desktop_0768 * * */

@media (min-width: 768px) {

    #wrapper,
    #wrapper-header,
    #wrapper-footer {
        width: 744px;
        margin: 0 auto;
    }

    #wrapper-header .inside {
        margin-right: 10px;
        margin-left: 10px;
    }

    *[class*="grid"] {
        float: left;
        display: inline;
    }

    .grid2 {
        width: 228px;
        min-height: 220px;
    }

    .grid4 {
        width: 352px;
    }

    .grid6 {
        width: 724px;
    }

    .mod_article.grid1,
    .mod_article.grid2,
    .mod_article.grid3,
    .mod_article.grid4,
    .mod_article.grid5,
    .mod_article.grid6,
    .mod_article.grid7,
    .mod_article.grid8,
    .mod_article.grid9,
    .mod_article.grid10,
    .mod_article.grid11,
    .mod_article.grid12 {
        margin-right: 0;
        margin-left: 0;
    }

    .ce_gallery > ul {
        margin-right: -10px;
        margin-left: -10px;
    }

    .ce_gallery > ul > li,
    .ce_gallery > ul > li.col_first {
        float: left;
        clear: none;
        margin-right: 10px;
        margin-left: 10px;
    }

    .ce_gallery > ul > li {
        width: 212px;
    }
}


/* * * ehemalige interne Styles: Layout_Desktop_0960 * * */

@media (min-width: 960px) {

    #wrapper,
    #wrapper-header,
    #wrapper-footer {
        width: 960px;
    }

    .grid2,
    .grid4 {
        width: 300px;
    }

    .grid6 {
        width: 460px;
    }

    #footer div.anmeldung > p {
        text-align: right;
    }

    .ce_gallery > ul > li {
        width: 206px;
    }
}


/* * * ehemalige interne Styles: Layout_Desktop_1200 * * */

@media (min-width: 1200px) {

    #wrapper,
    #wrapper-header,
    #wrapper-footer {
        width: 1200px;
    }

    .grid2 {
        width: 180px;
    }

    .grid4 {
        width: 380px;
    }

    .grid6 {
        width: 580px;
    }

    .ce_gallery > ul > li {
        width: 210px;
    }
}


/* * * * * bestehende externe Styles * * * * */

/* * * * * * * * * * Schrift: Source Sans Pro * * * * * * * * * */

/* source-sans-pro-200italic - latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: italic;
    font-weight: 200;
    src: local(''),
    url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-200italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-200italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-200 - latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 200;
    src: local(''),
    url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-200.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-200.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-300 - latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 300;
    src: local(''),
    url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-300italic - latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: italic;
    font-weight: 300;
    src: local(''),
    url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-300italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-300italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-regular - latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 400;
    src: local(''),
    url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-italic - latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: italic;
    font-weight: 400;
    src: local(''),
    url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-600 - latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: normal;
    font-weight: 600;
    src: local(''),
    url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-600.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-600.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-600italic - latin */
@font-face {
    font-family: 'Source Sans Pro';
    font-style: italic;
    font-weight: 600;
    src: local(''),
    url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-600italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */ url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-600italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-700 - latin */
/*@font-face {*/
/*    font-family: 'Source Sans Pro';*/
/*    font-style: normal;*/
/*    font-weight: 700;*/
/*    src: local(''),*/
/*    url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-700.woff2') format('woff2'), !* Chrome 26+, Opera 23+, Firefox 39+ *! url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-700.woff') format('woff'); !* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ *!*/
/*}*/

/* source-sans-pro-700italic - latin */
/*@font-face {*/
/*    font-family: 'Source Sans Pro';*/
/*    font-style: italic;*/
/*    font-weight: 700;*/
/*    src: local(''),*/
/*    url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-700italic.woff2') format('woff2'), !* Chrome 26+, Opera 23+, Firefox 39+ *! url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-700italic.woff') format('woff'); !* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ *!*/
/*}*/

/* source-sans-pro-900 - latin */
/*@font-face {*/
/*    font-family: 'Source Sans Pro';*/
/*    font-style: normal;*/
/*    font-weight: 900;*/
/*    src: local(''),*/
/*    url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-900.woff2') format('woff2'), !* Chrome 26+, Opera 23+, Firefox 39+ *! url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-900.woff') format('woff'); !* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ *!*/
/*}*/

/* source-sans-pro-900italic - latin */
/*@font-face {*/
/*    font-family: 'Source Sans Pro';*/
/*    font-style: italic;*/
/*    font-weight: 900;*/
/*    src: local(''),*/
/*    url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-900italic.woff2') format('woff2'), !* Chrome 26+, Opera 23+, Firefox 39+ *! url('../../files/themes/lustat/fonts/source-sans-pro-v14-latin-900italic.woff') format('woff'); !* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ *!*/
/*}*/


/* * * * * * * * * * LUSTAT Logo * * * * * * * * * */

/* Header: Bereich für das Logo */
#header #logo {
    height: 59px;
    margin: auto;
    width: 77px;
}

/* Header: Logo als Blockelement und Grösse definieren */
#header #logo img {
    display: block;
    width: 100%;
}


/* Vertikalen Scroll-Balken immer zeigen */
html {
    overflow-y: scroll;
}

/* * * * * * * * * * Schriftart und Schriftfarbe * * * * * * * * * */
body {
    font: 100% 'Source Sans Pro';
    color: #3e3e3e;
}


/* * * * * * * * * * Überschriften * * * * * * * * * */

/* Ebene 1 */
h1 {
    margin-top: 1.5em;
    margin-bottom: .5em;
    font-size: 200%;
    line-height: 1em;
    font-weight: bold;
}

/* Spezielles Titelformat aus kombinierten Überschriften der Ebene 3 über der Ebene 1 */
h3 + h1 {
    margin-top: 0;
}

/* Ebene 2 */
h2 {
    margin-top: 3em;
    padding-bottom: .5em;
    border-bottom: 1px solid #c4c4c4;
    font-size: 100%;
    font-weight: bold;
}

/* Ebene 2 im Footer */
footer h2 {
    border-bottom: 0;
}

/* Ebene 3 */
h3 {
    margin-top: 2em;
    margin-bottom: .5em;
    padding: 0;
    font-size: 1rem;
    font-weight: bold;
}

/* Ebene 3 - Abstand direkt nach einer H2-Überschrift verkleinern */
h2 + div > h3,
h2 + h3 {
    margin-top: 0;
}


/* * * * * * * * * * Text * * * * * * * * * */

/* Abstände bei Absätzen */
p {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}

/* Abstände bei sortierten Listen */
ol {
    margin: 0;
    padding: 0;
}


/* * * * * * * * * * Tabellen * * * * * * * * * */

div.ce_basis_mitarbeiterKontaktinformationen {
    overflow-x: auto;
}

div.ce_table.ce_basis_mitarbeiterKontaktinformationen {
    margin-top: 3em;
}

table#kontaktinformationen {
    margin-left: 10px;
    white-space: nowrap;
    width: calc(100% - 20px);
}

table#kontaktinformationen th {
    cursor: pointer;
    padding-left: 0.5em;
    padding-right: 1em;
    text-align: left;
}

table#kontaktinformationen > tbody > tr {
    transition: 0.5s;
}

table#kontaktinformationen > tbody > tr:hover {
    background-color: #86bce1;
    cursor: default;
}

table.webartikel {
    margin-bottom: 2em;
    width: calc(100% - 2px);
}

table.webartikel th {
    background-color: #e4e4e4;
    border: 1px solid #c4c4c4;
    padding-left: 0.5em;
    padding-right: 0.5em;
    vertical-align: top;
}

table.webartikel td.zweispalten {
    width: 50%;
}

table.webartikel td.dreispalten {
    width: 30%;
}

table.webartikel td.vierspalten {
    width: 25%;
}

table.webartikel td.entwicklung-positiv {
    color: #00b400;
}

table.webartikel td.entwicklung-negativ {
    color: #e80000;
}

table.webartikel th.text,
table.webartikel td.text {
    text-align: left;
}

table.webartikel th.zahl,
table.webartikel td.zahl {
    text-align: right;
}

table.webartikel td.abstand {
    column-span: 2;
    border: none;
    height: 10px;
}

/* * * * * * * * * * Links * * * * * * * * * */

a {
    text-decoration: none;
    color: #0072ba;
}

a.ohnelink {
    color: #3e3e3e;
}

a:hover {
    text-decoration: underline;
}

a.ohnelink:hover {
    text-decoration: none;
}


/* * * * * * * * * * Links mit Symbolen * * * * * * * * * */

/* Grösse, Abstände und Farbe */
div.content-download a,
div.content-downloads a,
div.content-hyperlink a,
div.download a,
div.link > a {
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 38px;
    vertical-align: baseline;
    background-repeat: no-repeat;
    line-height: 40px;
    text-decoration: none;
    color: #3e3e3e;
    background-size: 30px;
    background-position: left center;
}

/* Farbe (Hover) */
div.content-download a:hover,
div.content-downloads a:hover,
div.content-hyperlink a:hover,
div.download a:hover,
div.link > a:hover {
    color: #0072ba;
}

/* Formatierung der Dateigrösse */
div.content-download a span,
div.content-downloads a span {
    font-size: 70%;
}

/* Liste: Abstände und Listensymbol */
div.content-downloads ul {
    margin: 0;
    list-style-type: none;
}

/* Listenelemente: Abstände */
div.content-downloads ul li {
    margin: 0;
}


/* * * * * * * * * * * * * * * * * * * * Media Queries * * * * * * * * * * * * * * * * * * * */

@media (min-width: 768px) {

    /* * * * * * * * * * LUSTAT Logo * * * * * * * * * */
    /* Header: Bereich für das Logo */
    #header #logo {
        float: left;
        height: 84px;
        margin-left: 0;
        width: 110px;
    }
}

/* * * * * Cookie-Hinweis * * * * */

.cookiebar {
    z-index: 100;
}


/* * * * * Fixed Footer * * * * */

#footer {
    background-color: #f3f3f3;
    border-top: 1px solid #c4c4c4;
    font-size: 0.8rem;
    margin-top: 100px;
    padding-bottom: 20px;
}

/* * * * * * * * * * Navigation * * * * * * * * * */

/* Listensymbol für alle Navigationselemente deaktivieren */
nav ul {
    list-style-type: none;
}

/* Abstände zurücksetzen */
nav li {
    margin: 0;
    padding: 0;
    text-align: left;
}


/* * * * * * * * * * Hauptnavigation (Ebenen 1 und 2) * * * * * * * * * */

/* Hintergrundfarbe */
#hauptnavigation {
    margin-top: 10px;
    background-color: #6f6f6f;
}

/* Ebene 1: Elemente als Block, mit Innenabständen und ohne Unterstreichung */
#hauptnavigation a,
#hauptnavigation strong {
    display: block;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    text-decoration: none;
}

/* Ebene 1: Schriftgrösse und Schriftstil */
#hauptnavigation ul.level_1 > li {
    border-top: 1px solid #c4c4c4;
    font-size: 1.2rem;
    font-weight: bold;
    letter-spacing: 0.1em;
    margin: 0;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
}

/* Ebene 1: Schriftfarbe */
#hauptnavigation ul.level_1 > li > a,
#hauptnavigation ul.level_1 > li > strong {
    color: #c4c4c4;
    font-weight: bold;
}

/* Ebene 1: Schriftfarbe (Hover) */
#hauptnavigation ul.level_1 > li > a:focus,
#hauptnavigation ul.level_1 > li > a:hover,
#hauptnavigation ul.level_1 > li > a.trail,
#hauptnavigation ul.level_1 > li > strong.active,
#hauptnavigation ul.level_1 > li > strong.forward {
    background-color: #5f5f5f;
    color: #ffffff;
}

/* Ebene 2: ausblenden */
#hauptnavigation ul.level_2 {
    display: none;
}


/* * * * * * * * * * Navigation Links * * * * * * * * * */

/* Linker Abstand */
#left {
    padding-left: 10px;
}

/* Menüpunkte gestalten */
#left nav.mod_navigation a,
#left nav.mod_navigation strong {
    color: #3e3e3e;
    display: block;
    font-weight: normal;
    margin: 0;
    padding: 0.5em 0;
    text-decoration: none;
}

/* Aktiven Menüpunkt hervorheben */
#left nav.mod_navigation a:focus,
#left nav.mod_navigation a:hover,
#left nav.mod_navigation a.trail,
#left nav.mod_navigation strong.active,
#left nav.mod_navigation strong.forward {
    color: #0072ba;
}

/* Liste gestalten */
#left nav.mod_navigation ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

/* Listenelemente gestalten */
#left nav.mod_navigation li {
    border-top: 1px solid #c4c4c4;
}


/* * * * * Navigation Links Ebene 1 * * * * */

/* Ebene 1: Erstes Listenelement gestalten */
#left nav.mod_navigation ul.level_1 > li.first {
    border-top: 0;
}


/* * * * * Navigation Links Ebene 2 * * * * */

/* Ebene 2: Ebene ausblenden */
#left nav.mod_navigation ul.level_2 {
    display: none;
}

/* Ebene 2: Ebene einblenden, wenn Element selbst oder Eltern-Element aktiv ist */
#left nav.mod_navigation li.active ul.level_2,
#left nav.mod_navigation li.trail ul.level_2 {
    display: block;
}

/* Ebene 2: Unterpunkte links einrücken */
#left nav.mod_navigation ul.level_2 > li > a,
#left nav.mod_navigation ul.level_2 > li > strong {
    font-size: 0.9rem;
    font-weight: normal;
    margin-left: 1em;
}


/* * * * * Navigation Links Ebene 3 * * * * */

/* Ebene 3: Ebene ausblenden */
#left nav.mod_navigation ul.level_3 {
    display: none;
}

/* Ebene 3: Ebene einblenden, wenn Element selbst oder Elternelement aktiv ist */
#left nav.mod_navigation ul.level_2 > li.active > ul.level_3,
#left nav.mod_navigation ul.level_2 > li.trail > ul.level_3 {
    display: block;
}

/* Ebene 3: Unterpunkte links einrücken */
#left nav.mod_navigation ul.level_3 > li > a,
#left nav.mod_navigation ul.level_3 > li > strong {
    font-size: 0.8rem;
    margin-left: 2em;
}


/* * * * * * * * * * Navigation Service (Header) * * * * * * * * * */

/* Liste mit den Navigationselementen */
#header nav.mod_customnav ul {
    float: right;
    list-style-type: none;
    padding: 0;
    width: auto;
}

/* Listenelemente nebeneinander ausrichten */
#header .mod_customnav li {
    float: left;
    list-style-type: none;
    margin: 0;
    padding: 0;
}

/* Inhalte der einzelnen Navigationselemente */
#header .mod_customnav a,
#header .mod_customnav strong {
    color: #6f6f6f;
    display: block;
    font-size: 80%;
    font-weight: normal;
    line-height: 1.7em;
    margin-right: 2em;
    text-decoration: none;
}

/* Rechten Abstand für das letzte Navigationselements entfernen */
#header nav.mod_customnav li a.last,
#header nav.mod_customnav li strong.last {
    margin-right: 0;
}

/* Aktive Elemente durch Unterstreichung hervorheben */
#header .mod_customnav a:focus,
#header .mod_customnav a:hover,
#header .mod_customnav a.trail,
#header .mod_customnav strong.active,
#header .mod_customnav strong.trail {
    text-decoration: underline;
}


/* * * * * * * * * * Footer: Allgemein * * * * * * * * * */

/* Schriftfarbe im Footer */
footer p,
footer a,
footer span,
footer h2 {
    color: #6f6f6f;
}

/* Überschrift 2 im Footer */
footer h2 {
    border-bottom: 0;
}

/* Aktiven Menüpunkt hervorheben */
footer a:hover {
    text-decoration: none;
    color: #0072ba;
}


/* * * * * * * * * * Footer: Navigation * * * * * * * * * */

/* Liste gestalten */
footer nav ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

/* Listenelemente gestalten */
footer nav li {
    border-top: 1px solid #c4c4c4;
    margin: 0;
}

footer nav li a,
footer nav li strong {
    padding: 0.5em 0;
    display: block;
}

/* Erstes Listenelement gestalten */
footer nav li.first {
    border-top: 0;
}

/* Aktiven Menüpunkt hervorheben */
footer nav li a:focus span,
footer nav li a:hover span,
footer nav li a.trail span,
footer nav li strong.active,
footer nav li strong.forward {
    color: #0072ba;
    font-weight: normal;
}


/* * * * * * * * * * * * * * * * * * * * Media Queries * * * * * * * * * * * * * * * * * * * */

@media (max-width: 767px) {

    /* * * * * * * * * * Servicenavigation (Header) * * * * * * * * * */
    /* Auf Mobiles nicht anzeigen */
    #header nav.mod_customnav {
        display: none;
    }
}


@media (min-width: 768px) {

    /* * * * * * * * * * Hauptnavigation (Ebenen 1 und 2) * * * * * * * * * */
    /* Hintergrundfarbe und Abstand nach oben */
    #hauptnavigation {
        background-color: #ffffff;
        margin-top: 69px;
    }

    /* Ebene 1: Liste Navigationselementen rechts ausrichten */
    #hauptnavigation ul.level_1 {
        float: right;
    }

    /* Ebene 1: Listenelemente nebeneinander ausrichten sowie Schriftgrösse, Abstand der Navigationselemente und Rahmen entfernen */
    #hauptnavigation ul.level_1 > li {
        border: 0;
        float: left;
        font-size: 0.9rem;
        margin-right: 1.5em;
        width: auto;
    }

    /* Ebene 1: rechten Abstand des letzten Navigationselements entfernen */
    #hauptnavigation ul.level_1 > li.last {
        margin-right: 0;
    }

    /* Ebene 1: Schriftfarbe und Abstände gegenüber Mobile anpassen */
    #hauptnavigation ul.level_1 > li > a,
    #hauptnavigation ul.level_1 > li > strong {
        color: #6f6f6f;
        padding: 0 0 10px;
    }

    /* Ebene 1: Hintergrund und Schriftfarbe (Hover) gegenüber Mobile anpassen */
    #hauptnavigation ul.level_1 > li > a:focus,
    #hauptnavigation ul.level_1 > li > a:hover,
    #hauptnavigation ul.level_1 > li > a.trail,
    #hauptnavigation ul.level_1 > li > strong.active,
    #hauptnavigation ul.level_1 > li > strong.forward {
        background-color: #ffffff;
        color: #0072ba;
    }

    /* Ebene 1: Zweite Ebene bei Mouse Over einblenden */
    #hauptnavigation ul.level_1 > li:hover ul.level_2 {
        background-color: rgba(111, 111, 111, .95);
        border: 1px solid rgba(196, 196, 196, .95);
        border-radius: 6px;
        display: block;
        margin-left: -142px;
        padding: 5px;
        position: absolute;
        width: 270px;
        z-index: 1000;
    }

    /* Ebene 1: Für zweite Pfeil an der der Box */
    #hauptnavigation ul.level_1 > li:hover ul.level_2:after {
        border-bottom: 8px solid rgba(111, 111, 111, .95);
        border-left: 8px solid transparent;
        border-right: 8px solid transparent;
        content: '';
        height: 0;
        left: 138px;
        position: absolute;
        top: -8px;
        width: 0;
    }

    /* Ebene 2: Aussenabstand auf der rechten Seite zurücksetzen, Elemente untereinander, Trennlinien zwischen den Elementen, Schriftgrössen */
    #hauptnavigation ul.level_2 > li {
        border-top: 1px solid #c4c4c4;
        clear: both;
        font-size: 1rem;
        font-weight: normal;
        letter-spacing: 0;
        margin-right: 0;
        text-transform: none;
        width: 100%;
    }

    /* Ebene 2: Trennlinie vor dem ersten Element entfernen */
    #hauptnavigation ul.level_2 > li.first {
        border-top: 0;
    }

    /* Ebene 2: Schriftfarbe und Abstände gegenüber Mobile anpassen */
    #hauptnavigation ul.level_2 > li > a,
    #hauptnavigation ul.level_2 > li > strong {
        color: #e4e4e4;
        font-weight: normal;
        padding-left: 0.5em;
        padding-right: 0.5em;
    }

    /* Ebene 2: Hintergrund und Schriftfarbe (Hover) gegenüber Mobile anpassen */
    #hauptnavigation ul.level_2 > li > a:focus,
    #hauptnavigation ul.level_2 > li > a:hover,
    #hauptnavigation ul.level_2 > li > a.trail,
    #hauptnavigation ul.level_2 > li > strong.active,
    #hauptnavigation ul.level_2 > li > strong.forward {
        background-color: #5f5f5f;
        color: #ffffff;
    }
}


@media (min-width: 960px) {

    /* * * * * * * * * * Hauptnavigation (Ebenen 1 und 2) * * * * * * * * * */
    /* Abstand nach oben */
    #hauptnavigation {
        margin-top: 65px;
    }

    /* Ebene 1: Schriftgrösse */
    #hauptnavigation ul.level_1 > li {
        font-size: 1.1rem;
    }
}


@media (min-width: 1200px) {

    /* * * * * * * * * * Hauptnavigation (Ebenen 1 und 2) * * * * * * * * * */
    /* Abstand nach oben */
    #hauptnavigation {
        margin-top: 62px;
    }

    /* Ebene 1: Schriftgrösse */
    #hauptnavigation ul.level_1 > li {
        font-size: 1.3rem;
    }
}

/* Volle Breite */
table {
    width: 100%;
    border-collapse: collapse;
}

/* Rahmen und Abstände der Zellen */
table td {
    padding-right: .5em;
    padding-left: .5em;
    vertical-align: top;
    text-align: left;
    border: 1px solid #c4c4c4;
}

/* Rahmen pro Zelle */
table.streifen {
    width: 100%;
    border-collapse: separate;
}

/* Ungerade Zeilen */
table.streifen > tbody > tr:nth-child(odd) {
    background-color: rgba(228, 228, 228, .2);
}

/* Gerade Zeilen */
table.streifen > tbody > tr:nth-child(even) {
    background-color: rgba(228, 228, 228, .6);
}

/* Zellen im Tabellenkopf */
table.streifen > thead > tr > td {
    padding-right: .5em;
    padding-left: .5em;
    text-align: left;
    background-color: #7f7f7f;
    border: 0;
    color: #fff;
}

/* Zellen im Tabellenrumpf */
table.streifen > tbody > tr > td {
    padding-right: .5em;
    padding-left: .5em;
    vertical-align: middle;
    text-align: left;
    border: 0;
}

/* * * * * * * * * * Download CSV * * * * * * * * * */

div.content-download a.csv,
div.content-downloads a.csv,
div.link > a.csv {
    background-image: url("/files/themes/lustat/symbole/download_csv_3e3e3e.svg");
}

div.content-download a.csv:hover,
div.content-downloads a.csv:hover,
div.link > a.csv:hover {
    background-image: url("/files/themes/lustat/symbole/download_csv_0072ba.svg");
}


/* * * * * * * * * * Download PDF * * * * * * * * * */

.download-element.ext-pdf a,
div.content-downloads a.pdf,
div.download > a.pdf,
div.link > a.pdf {
    background-image: url("/files/themes/lustat/symbole/download_pdf_3e3e3e.svg");
}

.download-element.ext-pdf a:hover,
div.content-downloads a.pdf:hover,
div.download > a.pdf:hover,
div.link > a.pdf:hover {
    background-image: url("/files/themes/lustat/symbole/download_pdf_0072ba.svg");
}


/* * * * * * * * * * Download XSD * * * * * * * * * */

div.content-download a.xsd,
div.content-downloads a.xsd,
div.link > a.xsd {
    background-image: url("/files/themes/lustat/symbole/download_xsd_3e3e3e.svg");
}

div.content-download a.xsd:hover,
div.content-downloads a.xsd:hover,
div.link > a.xsd:hover {
    background-image: url("/files/themes/lustat/symbole/download_xsd_0072ba.svg");
}


/* * * * * * * * * * Link Allgemein (Pfeil nach rechts) * * * * * * * * * */

div.content-hyperlink.allgemein a,
div.link > a.allgemein {
    background-image: url("/files/themes/lustat/symbole/link_allgemein_rechts_3e3e3e.svg");
}

div.content-hyperlink.allgemein a:hover,
div.link > a.allgemein:hover {
    background-image: url("/files/themes/lustat/symbole/link_allgemein_rechts_0072ba.svg");
}


/* * * * * * * * * * Link Anker in derselben Seite (Pfeil nach oben) * * * * * * * * * */

div.content-hyperlink.top a,
div.link > a.top {
    background-image: url("/files/themes/lustat/symbole/link_top_3e3e3e.svg");
}

div.content-hyperlink.top a:hover,
div.link > a.top:hover {
    background-image: url("/files/themes/lustat/symbole/link_top_0072ba.svg");
}


div.content-hyperlink.extern a,
div.link > a.extern {
    background-image: url("/files/themes/lustat/symbole/link_www_3e3e3e.svg");
}

div.content-hyperlink.extern a:hover,
div.link > a.extern:hover {
    background-image: url("/files/themes/lustat/symbole/link_www_0072ba.svg");
}

/* * * * * * * * * * Formular * * * * * * * * * */

button {
    background-color: #f3f3f3;
    border: 1px solid #7f7f7f;
    border-radius: 5px;
    box-sizing: border-box;
    color: #3e3e3e;
    cursor: pointer;
    font-size: 100%;
    height: auto;
    margin-top: 20px;
    padding: 0.5em 1em;
    width: auto;
}

button:not(:disabled):hover {
    border-color: #0072ba
}

button:not(:disabled):active {
    background-color: #c4c4c4
}

/* Rahmen und Abstände (bedingt durch User-Agent-Style-Sheet) entfernen */
fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/* * * * * * * * * * Formular Login Mitglieder * * * * * * * * * */

div.mod_login form,
div.mod_lostPassword form {
    line-height: 2;
    margin: 1em 0;
}

div.mod_login label,
div.mod_lostPassword label,
div.mod_two_factor input.text {
    float: left;
    margin-right: 10px;
    width: 140px;
}

/* Breite der Text-Felder festlegen (für IE) */
div.mod_login input.text,
div.mod_lostPassword input.text,
div.mod_two_factor input.text {
    width: 200px;
}

div.mod_login div.widget-checkbox label,
div.mod_lostPassword div.widget-checkbox label {
    float: none;
    margin-left: 0.5em;
    margin-right: 0;
}

div.mod_login div.widget-checkbox input,
div.mod_login div.widget-submit button,
div.mod_lostPassword div.widget-submit button {
    margin-left: 150px;
}

/* Link zum Passwort-Reset ausrichten */
div.ce_text.passwordreset {
    margin-left: 160px;
}

/* TODO: Wo wird das verwendet? */
div.mod_login div.widget-submit button[value="Abmelden"] {
    margin-left: 0;
}

/* * * * * * * * * * Formular Veranstaltung * * * * * * * * * */

/* Listensymbol für alle Navigationselemente deaktivieren */
form.veranstaltung fieldset {
    border: 1px solid #c4c4c4;
}

/* Rahmen und Abstände für Fieldsets um Radio-Buttons zurücksetzen */
form.veranstaltung fieldset.radio_container,
form.veranstaltung fieldset.checkbox_container {
    border: none;
    margin: 0;
    padding: 0;
}

form.veranstaltung input.text {
    width: 300px;
}

form.veranstaltung div.widget {
    margin-bottom: 1em;
    margin-top: 1em;
}

form.veranstaltung div.widget p.error {
    color: #cc0000;
    display: inline;
    float: right;
    margin: 0;
}

form.veranstaltung fieldset > legend,
form.veranstaltung label {
    float: left;
    margin: 0;
    margin-right: 10px;
    padding: 0;
    width: 185px;
}

form.veranstaltung fieldset.radio_container label,
form.veranstaltung fieldset.checkbox_container label {
    float: none;
    margin-right: auto;
    width: auto;
}

form.veranstaltung fieldset.radio_container span {
    margin-right: 1em;
}


/* * * * * * * * * * Formular Umfrage * * * * * * * * * */

/* Formatierung für Fieldsets mit Ausnahme der Checkbox-Gruppen (Klasse fieldset.checkbox_container) */
form.umfrage fieldset:not(.checkbox_container) {
    background-color: #f3f3f3;
    border: 1px solid #c4c4c4;
    border-radius: 10px;
    margin: 30px 0;
}

form.umfrage fieldset legend {
    background-color: #ffffff;
    border: 1px solid #c4c4c4;
    border-radius: 10px;
    margin-left: 20px;
    padding: 5px 10px;
}

form.umfrage fieldset.radio_container legend {
    margin-left: 0;
}

form.umfrage fieldset.radio_container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 20px;
}

/* Aussenabstand für Widgets mit Ausnahme der Radio-Gruppen */
form.umfrage div.widget {
    margin: 20px;
}

form.umfrage div.widget-radio {
    margin: 0;
}

/* Die Formatierung soll nicht für die Label von Checkbox-Gruppen gelten */
form.umfrage div.widget-select label,
form.umfrage div.widget-text label,
form.umfrage div.widget-textarea label {
    display: inline-block;
    margin: 0;
    margin-right: 10px;
    padding: 0;
    width: 100%;
}

/* Formatierung für die Label von Checkbox-Gruppen */
form.umfrage div.widget-checkbox label {
    margin: 0;
    margin-left: 10px;
    padding: 0;
}

form.umfrage input.text,
form.umfrage select,
form.umfrage textarea {
    border: 1px solid #c4c4c4;
    border-radius: 5px;
    box-sizing: border-box;
    color: #3e3e3e;
    font: 100% 'Source Sans Pro';
    height: 2em;
    width: 100%;
}

form.umfrage input.text,
form.umfrage textarea {
    padding: 0.5em;
}

form.umfrage select {
    padding: 0;
    padding-left: 0.5em;
}

form.umfrage textarea {
    height: 100px;
    resize: vertical;
}

/* Fehlermeldung Feld Validierung */
form.umfrage div.error p.error {
    background-color: hsl(0, 100%, 95%);
    border: 1px solid hsl(0, 100%, 85%);
    border-radius: 5px;
    color: hsl(0, 100%, 20%);
    margin: 1em 0;
    padding: 0.5em;
}

@media screen and (min-width: 1200px) {

    /* Die Formatierung soll nicht für die Label von Checkbox-Gruppen gelten */
    form.umfrage div.widget-select label,
    form.umfrage div.widget-text label,
    form.umfrage div.widget-textarea label {
        min-width: 320px;
        vertical-align: top;
        width: 30%;
    }

    form.umfrage input.text,
    form.umfrage select,
    form.umfrage textarea {
        max-width: calc(100% - 360px);
        width: 70%;
    }
}


/* * * * * * * * * * Formular Suche (Header) * * * * * * * * * */

/* Ausrichtung des Formulars */
#header div.mod_form {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 100;
}

#header #suchformular {
    margin: 0;
}

#header #suchformular input.suchfeld {
    color: #6f6f6f;
    font-size: 80%;
    margin: 0;
    padding: 0 0.25em;
    width: 125px;
}

#header #suchformular .lupe {
    height: 90%;
    position: absolute;
    right: 1%;
    top: 5%;
}

/* Suchbegriffe im Text hervorheben */
.mod_search .highlight {
    background-color: rgba(0, 180, 0, .4);
}

/* * * * * * * * * * * * * * * * * * * * Media Queries * * * * * * * * * * * * * * * * * * * */

@media (max-width: 767px) {

    /* * * * * * * * * * Suchformular (Header) * * * * * * * * * */
    /* Auf Mobiles nicht anzeigen */
    #header div.mod_form {
        display: none;
    }
}

/* TODO: Wo wird das verwendet? Eventuell Newsletteranmeldung */
.mod_subscribe,
.mod_unsubscribe {
    margin-bottom: 1em;
}

/* * * * * * * * * * Filter * * * * * * * * * */

/* Filter (schmal): Formular auf Seiten mit Seitennavigation */
form.filter-schmal {
    margin-top: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: #e4e4e4;
    border: 1px solid #c4c4c4;
}

/* Filter (schmal): Container für die Formularelemente */
form.filter-schmal > div.w50 {
    width: 100%;
    padding-right: 20px;
    padding-left: 20px;
    box-sizing: border-box;
}

/* Filter (schmal): Sub-Container für die Formularelemente */
form.filter-schmal > div.w50 > div {
    padding-top: 5px;
    padding-bottom: 5px;
}

/* Filter (schmal): Label über den Formularfelder ausgeben */
form.filter-schmal label {
    display: block;
    font-size: 0.9rem;
}

/* Filter (schmal): Gestaltung der Formularelemente und volle Breite innerhalb des Containers zuweisen */
form.filter-schmal input,
form.filter-schmal select,
form.filter-schmal textarea {
    width: 100%;
    height: 2.4em;
    padding: 5px;
    background-color: #fefefe;
    border: 1px solid #7f7f7f;
    line-height: 1.4em;
    color: #444444;
    box-sizing: border-box;
}

/* Filter (schmal): Gestaltung inaktiver Formularelemente */
form.filter-schmal input[disabled],
form.filter-schmal select[disabled] {
    background-color: #f3f3f3;
    border-color: #c4c4c4;
    color: #7f7f7f;
}

/* Formular: Gestaltung Button */
input[type="submit"],
form.filter-schmal input[type="submit"] {
    width: auto;
    height: auto;
    margin-top: 20px;
    padding: 0.5em 1em;
    background-color: #f3f3f3;
    border: 1px solid #7f7f7f;
    border-radius: 5px;
    color: #444444;
    box-sizing: border-box;
    cursor: pointer;
}

/* Formular: Rahmenfarbe (Hover) */
input[type="submit"]:hover,
form.filter-schmal input[type="submit"]:hover {
    border-color: #86bce1;
}

/* Formular: Gestaltung Button (Active) */
input[type="submit"]:active,
form.filter-schmal input[type="submit"]:active {
    background-color: #c4c4c4;
}

/* Daten: Gestaltung der Formularelemente in den Standardobjekten */
form.daten select {
    width: 30%;
    height: 2em;
    margin-right: 2%;
    background-color: #fefefe;
    border: 1px solid #7f7f7f;
    font-size: 0.8rem;
    line-height: 1.4em;
    color: #444444;
    box-sizing: border-box;
}

@media (min-width: 960px) {

    /* Filter (schmal): zwei Container mit Formularelementen nebeneinander und mit jeweils halber Breite ausgeben */
    form.filter-schmal > div.w50 {
        width: 50%;
        float: left;
        display: inline;
    }
}