@font-face {
    font-family: 'Open Sans Condensed';
    src: url('../font/OpenSansCondensed/OpenSansCondensed-Light.woff2') format('woff2'),
        url('../font/OpenSansCondensed/OpenSansCondensed-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
  font-family: 'FA-Regular';
  font-style: normal;
  font-weight: 400;
  font-display: auto;
  src: url("../font/fontAwesome/fa-regular-400.eot");
  src: url("../font/fontAwesome/fa-regular-400.eot?#iefix") format("embedded-opentype"), url("../font/fontAwesome/fa-regular-400.woff2") format("woff2"), url("../font/fontAwesome/fa-regular-400.woff") format("woff"), url("../font/fontAwesome/fa-regular-400.ttf") format("truetype"), url("../font/fontAwesome/fa-regular-400.svg#fontawesome") format("svg"); }


@font-face {
  font-family: 'FA-Brands';
  font-style: normal;
  font-weight: normal;
  font-display: auto;
  src: url("../font/fontAwesome/fa-brands-400.eot");
  src: url("../font/fontAwesome/fa-brands-400.eot?#iefix") format("embedded-opentype"), url("../font/fontAwesome/fa-brands-400.woff2") format("woff2"), url("../font/fontAwesome/fa-brands-400.woff") format("woff"), url("../font/fontAwesome/fa-brands-400.ttf") format("truetype"), url("../font/fontAwesome/fa-brands-400.svg#fontawesome") format("svg"); }

@font-face {
  font-family: 'FA-Solid';
  font-style: normal;
  font-weight: 900;
  font-display: auto;
  src: url("../font/fontAwesome/fa-solid-900.eot");
  src: url("../font/fontAwesome/fa-solid-900.eot?#iefix") format("embedded-opentype"), url("../font/fontAwesome/fa-solid-900.woff2") format("woff2"), url("../font/fontAwesome/fa-solid-900.woff") format("woff"), url("../font/fontAwesome/fa-solid-900.ttf") format("truetype"), url("../font/fontAwesome/fa-solid-900.svg#fontawesome") format("svg"); }


:root {
  --bg-header            : white;
  --headerfarbe          : white;

  --text-info            : #8F8F8F;
  --logo-text            : white;
  --footer-bg            : #0552BC;
  --footer-text          : white;
  --footer-link          : #0050A0;
  --link                 : #0070C0;
  --link-hover           : #0050A0; /*dklblau*/
  --link-active          : #0050A0;
  --link-focus           : #0050A0;

  --footer-text          : #FFFFFF;
  --footer-link          : #FFFFFF;
  --footer-link-hover    : #FFFFFF;
  --footer-link-active   : #FFFFFF;
  --rahmen               : #0070C0;
  --bg-submenu           : #ACD1E9;
  --bg-submenu-color     : white;
  --tabellenheader-bg    : #62c2cc;
  --tabellenheader-text  : #000000;
  --tabellenzeile-bg     : #cfecef;
  --tabellen-rahmen      : #BFBFBF;

/* Module */
  --mod-rahmen           : #7F7F7F;
  --mod-bg               : #EFEFEF;
  --mod-bg-h3            : #5F5F5F;
  --mod-bg-text          : #000000;

  --download-icon        : #FF9F00;
  --download-text        : #0C499A;



/* Farben Texte*/
  --text                 : #0C499A;
  --text-h-1ink          : #0552BC;
  --h1-rahmen            : #62c2cc;
  --h2-rahmen            : #5F5F5F;
  --h3-rahmen            : #5F5F5F;
  --h4-rahmen            : #5F5F5F;
  --h5-rahmen            : #5F5F5F;
  --h6-rahmen            : #5F5F5F;

  --input-text           : #5F5F5F;
  --highlight            : #62c2cc;

/* Desktop Menue 1. Ebene*/
  --menu-bg              : #0C499A;
  --menu-text            : #0C499A;
  --menu-text-hover      : #0C499A;
  --menu-text-active     : #0C499A;
  --menu-text-border     : #0C499A;
  --menu-btn             : #5E9DC8;
  --menu-btn-hover       : #5E9DC8;
  --menu-btn-active      : #5E9DC8;

  --menu-sub-text        : white;
  --menu-sub-text-hover  : #1F1F1F;
  --menu-sub-text-active : #1F1F1F;
  --menu-sub-bg          : #5E9DC8;
  --menu-sub-bg-hover    : #62c2cc;
  --menu-sub-bg-active   : #62c2cc;
  --menu-sub-border      : white;


/* Mobiles Menue 1. Ebene*/
  --mobil-button-bg              : white;
  --mobil-button-text            : white;
  --mobil-menu-bg                : #0552BC;
  --mobil-menu-bg-hover          : white;
  --mobil-menu-bg-active         : #5E9DC8;
  --mobil-menu-text              : #FFFFFF;
  --mobil-menu-text-hover        : #0552BC;
  --mobil-menu-text-active       : white;
  --mobil-menu-border            : white;
/* Mobiles Menue 2. Ebene*/
  --mobil-menu-sub-bg            : white;
  --mobil-menu-sub-bg-hover      : white;
  --mobil-menu-sub-bg-active     : white;
  --mobil-menu-sub-text          : #5E9DC8;
  --mobil-menu-sub-text-hover    : #5E9DC8;
  --mobil-menu-sub-text-active   : #5E9DC8;
  --mobil-menu-sub-border        : #5E9DC8;
/* Buttons*/
  --btn-text             : white;
  --btn-text-hover       : black;
  --btn-bg               : #62c2cc;
  --btn-bg-hover         : white;
  --btn-border           : #62c2cc;
  --btn-border-hover     : #62c2cc;
    }


/* ##################################################*/
* {margin : 0; padding : 0;}
/* Fuer Sticky Menue */
html { scroll-behavior: smooth;}
html, body {height: 100vh;}

/* ##################################################*/
/*         Format Schriften                          */
/* ##################################################*/

body {
         color           : var(--text);
         line-height     : 1.5;
         font-size       : 1.3em;}

body, input {
font-family: 'Open Sans Condensed';
         }


@media screen and (max-width: 700px) {
body {
    font-size            : 1.2em;}
    }

article h1,
.com-finder__search-legend  {
         margin-bottom   : 0.5em;
         border-bottom   : 3px solid var(--h1-rahmen)}


article h2 {
         font-size       : 180%;
         }

article h3 {
         font-size       : 140%;
         margin-bottom   : 0.5em}
article h4 {
         font-size       : 120%; }

article h5 {
         font-size       : 120%; }

article h6 {
         font-size       : 120%; }



footer h3  {
    font-size            : 200%;
}

article p {
         margin-bottom   : 1em;}




article {
         margin-bottom   : 2em;
         }



article ul, article ol {
         margin-left             : 5%;
         margin-bottom           : 1em;}
article li {
         padding-bottom          : 0.25em;}

address {
         font-style              : normal;
         }

/* links */
article a, .breadcrumbs a{
         text-decoration : none;
         color           : var(--link);}
article a:hover, .breadcrumbs a:hover, .kiosk h3 a:hover {
         text-decoration : underline;
         color           : var(--link-hover);}
article a:focus, .breadcrumbs a:focus {
         text-decoration : underline;
         border          : 1px solid var(--link-focus);}



/* Breadcrumbs */
.breadcrumb {
         padding         : 0.5em 0em 1em 0em;
         margin-bottom   : 0.25em;
         font-size       : 90%}

ol.breadcrumb  {
         margin          : 0;
         padding         : 0; }

.breadcrumb li {
         display         : inline; /* li nebeneinander anzeigen */
         list-style-type : none; /* ohne Aufzählungspunkte */ }

.breadcrumb li a {
         padding-right   : 0.5em}


.breadcrumb li:nth-child(2):before,
.breadcrumb li:nth-child(3):before,
.breadcrumb li:nth-child(4):before  {
         content         : '\00a0\f054\00a0\00a0';
         font-family     : 'FA-Solid';
         font-size       : 80% }

/* Footer */

.footer-bg {
         background-color        : var(--footer-bg);
}
footer {
         color                   : var(--footer-text);
}
footer h3{
         color                   : var(--footer-text);
         font-weight             : bold;
         margin-top              : 0.25em;
         margin-bottom           : 0.25em;
         }


footer a {
         color           : var(--footer-link);
         text-decoration : none;}

footer a:hover {
         color           : var(--footer-link-hover);
         text-decoration : underline;}

footer .mod-menu li {
         list-style      : none;
         }





/* Bilder */

article img {
         box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
         border-radius : 0.5em;
         }


@media screen and (max-width: 700px){
article img {
         width           : 100%;
         height          : auto;
         }
         }



article img.noshadow  {
         box-shadow: none;
         border-radius : 0em;
         }

/* Tabellen */
article table {
         border-collapse         : collapse;
         width                   : 100%;
         max-width               : 100%;
         margin-bottom           : 1.5em;}

article th {
         background              : var(--tabellenheader-bg);
         color                   : var(--tabellenheader-text);
         text-align              : left;
         font-size               : 110%}

article th, td {
         padding                 : 0.25em 0.45em;  }

article table, article th, article tr, article td {
         border                  : 1px solid var(--tabellen-rahmen);}

article tr:nth-child(odd) {
         background              : var(--tabellenzeile-bg);}



/* Artikel Info zB Datum */
.article-info {
         margin                  : 0.25em 0 0.5em 0;
         text-align              : right;
         color                   : var(--text-info);
         }



/* Blog*/








@media screen and (min-width: 700px) {
.blog-item {
         display                 : flex;
         justify-content         : space-between;
         margin-bottom           : 2em;}

.blog-item .item-image   {
         width                   : 35%; }

.blog-item .item-content  {
         width                   : 60%;}
}

@media screen and (max-width: 700px) {
.blog-item {
         display                 : flex;
         flex-wrap               : wrap;
         margin-bottom           : 6em;}


.blog-item .item-image   {
         width                   : 100%;
         }


.blog-item .item-content  {
         width                   : 100%;

}

.blog-item .item-content p {
         width                   : 100%;
         text-align              : justify;
}
}



@media screen and (min-width: 1200px) {
.blog-item .item-image img   {
         width               : 100%;
         height              : auto;
         }
         }

@media screen and (min-width: 1000px) and (max-width: 1200px) {
.blog-item .item-image img   {
         max-width               : 300px;
         height                  : auto;
         }
         }

@media screen and (min-width: 800px) and (max-width: 1000px) {
.blog-item .item-image img   {
         max-width               : 250px;
         height                  : auto;
         }
         }

@media screen and (min-width: 700px) and (max-width: 800px) {
 .blog-item .item-image img   {
         max-width               : 200px;
         height                  : auto;
         }
         }









/* ICONS */
#osmap ul li {
         list-style      : none;
         padding         : 0.35em 0;
         }
#osmap ul li li {
         list-style      : circle;
         padding         : 0.35em 0;
         }

#osmap  a[href*="http"]:before {
    font-family: 'FA-Solid';
    content: ''!important;}

#osmap  a[href*="http"]:after {
    font-family: 'FA-Solid';
    content: '\00a0\00a0\f061';}

article a[href*="mailto"]:before,
footer a[href*="mailto"]:before    {
         font-family     : 'FA-Solid';
         content         : '\f0e0\00a0' ;         }
article a[href*="tel:+"]:before,
footer a[href*="tel:+"]:before   {
         font-family     : 'FA-Solid';
         content         : '\f095\00a0';}
/* Mobil */
article a[href*="tel:+491"]:before {
         font-family     : 'FA-Solid';
         content         : '\f3cd\00a0'!important ;}

.backbutton > a:before{
         font-family     : 'FA-Solid';
         content         : '\f060\00a0\00a0';
         }
.print-button:before {
         font-family     : "FA-Solid";
         content         : '\f02f\00a0' ;
}
.icon-calendar:before {
         font-family     : "FA-Solid";
         content         : '\f073\00a0' ;
}

/* Buttons + Readmore und Backbutton */
.readmore,
.backbutton{
         text-align      : right!important;
         }
.btn,
.backbutton a {
         background              : var(--btn-bg);
         color                   : var(--btn-text);
         border                  : 1px solid var(--btn-border);
         line-height             : 1.5;
         border-radius           : .25em;
         font-size               : 1em;
         text-decoration         : none;
         padding                 : 0.5em 0.8em;
         }

a.btn:hover,
.btn:hover,
.backbutton a:hover {
         background              : var(--btn-bg-hover);
         color                   : var(--btn-text-hover);
         border                  : 1px solid var(--btn-border-hover);
         transition              : all .6s ease;               }



ul.pagination {
         display                         : flex;
         align-items                     : center;
         justify-content                 : center;
         margin                          : 0;
         padding                         : 0;
}

.pagination li {
         text-align          : center;
         list-style          : none;
         margin-right        : 1em;
         border              : 1px solid #3F3F3F;
         border-radius       : 50%;
         width               : 40px;
         height              : 35px;
         line-height         : 1;
         display             : flex}

.pagination a {
         width                   : 100%;
         text-decoration         : none;
         text-align              : center;
         align-self              : center;
         }

.pagination li.active a {
         color                   : white;
         }

.pagination li.active {
         background              : #0050A0;
         }

.pagination li.disabled {
         border                  : 1px solid #CFCFCF;;   }

.pagination li.disabled span{
         color                   : #CFCFCF;
         pointer-events          : none;
         cursor                  : default;
         width                   : 100%;
         text-decoration         : none;
         text-align              : center;
         align-self              : center;

         }

.icon-angle-double-left:before {
         font-family     : 'FA-Solid';
         content         : '\f100';
         }

.icon-angle-left:before {
         font-family     : 'FA-Solid';
         content         : '\f104';
         }
.icon-angle-double-right:before {
         font-family     : 'FA-Solid';
         content         : '\f101';
         }

.icon-angle-right:before {
         font-family     : 'FA-Solid';
         content         : '\f105';
         }

/* Suche */
fieldset {
         border                  : 0px solid transparent;
         }
.suchen {
 text-align              : right;
 margin: 0.25em 0}

.footer-suche input,
input {
     padding: 0.25em;
     font-size: 0.8em;
     border-width: 1px;
     border-style: solid;
     border-radius: .5em;
     box-shadow: 0px 0px 2px rgba(66,66,66,.30);
     text-shadow: -50px 0px 0px rgba(66,66,66,.0);
     color               : var(--input-text);
     }


.footer-suche input:focus {
     outline:none;
}

.com-finder__search-legend {
         display         : block;
         width           : 100%;
         font-size       : 150%;}

ol#search-result-list {
         margin-left     : 1em;
         }
.result__title-url {
         color           : var(--link);
         }

 mark, .mark {
        background-color: var(--highlight);
}














/* Systemeinstellungen */
html {
         -webkit-text-size-adjust: none;
         text-size-adjust: none;
}

body {
         hyphens: auto;
         hyphenate-limit-chars: auto 5;
         hyphenate-limit-lines: 2;
         -webkit-hyphens: auto;
         -webkit-hyphenate-limit-chars: 2;
         -webkit-hyphenate-limit-lines: 4;
         -ms-hyphens: auto;
         -ms-hyphenate-limit-chars: 2;
         -ms-hyphenate-limit-lines: 4;}


.unseen {
         position        : absolute;
         height          : 1px;
         width           : 1px;
         overflow        : hidden;
         clip            : rect(0 0 0 0);
         clip-path       : inset(100%);
         white-space     : nowrap;
}

/* Definition Skiplink */
.skiplinks,
.skiplink a,
.skiplink a:hover,
.skiplink a:visited {
        position: absolute;
        overflow: hidden;
        top: -1000px;
        left: -1000px;
        font-size: 1.25rem;
}

.skiplink a:focus,
.skiplink a:active {
        position: absolute;
        top: 0;
        left: 0;
}

.skiplink a:focus,
.skiplink a:active {
         position: absolute;
         top: 1em;
         left: 0;
         border-right: 3px solid #000000!important;
         border-top: 3px solid #000000!important;
         border-bottom: 3px solid #000000!important;
         padding: 0.5em 0.75em;
         color: #000000;
         background-color: white;
         z-index:1000;
}
/* Ende Skiplink */



@media print {
    /* styles here */
body {
         font-size               : 1em;
         color                   : black!important;
         }
.footer-kontakt, a, .footer-copy  {
         color                   : black!important;
}

.footer-copy {
         font-size               : 0.8em;
         }
.logo-zitat, .footer-suche, .footer-rechtliches, .cookie {
         display                 : none; }

.header-normal{
         height                  : 5em;}

.logo   {
         width                   : 100%;}

.logo-kostello {
         display : flex;
         width   : 100%;  }

.header-header-bild {
         height  : 130px; }

.header-normal h1 {
         font-size               : 1.3em;}
.header-normal h2 {
         font-size               : 1.1em; }

article{
         padding-top              : 6em;}

.component img {
         display                 : none!important;}



}

















}

