@font-face {
    font-family: 'nunito_sanslight';
    src: url('../fonts/nunitosans-light-webfont.woff2') format('woff2'),
         url('../fonts/nunitosans-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'nunito_sanssemibold';
    src: url('../fonts/nunitosans-semibold-webfont.woff2') format('woff2'),
         url('../fonts/nunitosans-semibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'rift_softdemi';
    src: url('../fonts/rift_soft_demi-webfont.woff2') format('woff2'),
         url('../fonts/rift_soft_demi-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'rift_softregular';
    src: url('../fonts/rift_soft_regular-webfont.woff2') format('woff2'),
         url('../fonts/rift_soft_regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'rift_softlight';
    src: url('../fonts/rift_soft_light-webfont.woff2') format('woff2'),
         url('../fonts/rift_soft_light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

html {
  height: 100%;
  line-height: 1.5;
  width: 100%; 
  }

body {
  height: 100%;
  width: 100%;
  font-family:'nunito_sanslight';
  font-size:0.98rem;
  color: rgb(0 98 66);
  }

h1, h2 { color: rgb(0 98 66); text-transform:uppercase; font-family: 'rift_softdemi'; }

ul { font-weight: bold; list-style:none; padding-left:0; }

section .col-xs-12 h2,
.accordion-body h2,
section#galerie h2 {position:relative;font-size: 1.3rem;letter-spacing: 0.18em;padding-bottom:1em;margin-bottom:1em;}
section .col-xs-12 h2:after,
.accordion-body h2:after { content:''; position:absolute; left:0; bottom:-0.05em; width:86%; height:2px; background: rgb(222 40 128 / 1);  }

section:not(#galerie) img {width: 100%;height:auto;max-width: 656px;}

.clear { clear:both; }

header { position:relative; display:block; }
header a.aktionstag {position:absolute;bottom:5rem;right:2rem;text-decoration:none;font-weight:bold;color: #fff;background: #de2880;padding:0.5rem;z-index: 1;}
header.start a.aktionstag {position:absolute;bottom:3rem;right:2rem;text-decoration:none;font-weight:bold;color:#186647;background:#ccded5;padding:0.5rem;z-index: 1;}
header.artikel .aktionstag { width:150px; text-align:center;}

header.artikel { padding-bottom:0.5rem; background:#f2f7f4;}
header.artikel img {position:relative;/* left:-0.6rem; */padding: 1rem 0;}
header.artikel img.headline {margin-left: 0.5rem;margin-top: 3.25rem;}
header video { display:block; width:100%; height:auto; }
header .logo { position: absolute;top: 0.5rem;left: 0.5rem;z-index:2;}
header .logo img { width:40vW; max-width:400px; height:auto; }
header .stoerer {display:none;position:absolute;bottom: 3rem;right: 0.5rem;}
header .stoerer img { width:20vW; max-width:200px; height:auto; }
header .stoerer2 {
  position:absolute;
  bottom: 6rem;
  right: 2.5rem;
  background:#e0d019;
  border-radius:50%;
  /* line-height:7.5; */
  padding-left:1em;
  padding-right:1em;
  width: 25vmin; 
  height: 25vmin;
  transform: rotateZ(9deg);
  text-align:center;
  /* display:none; */
}

header .stoerer2 a {
  font-size:1.75em;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:4px;
  text-decoration:none;
  color:#225b3b;
  position:relative;
  top: 2.5em;
}
header .suche { margin-bottom:2rem;}

nav { margin-top:-0.45em; padding:0; font-family:'rift_softdemi'; font-size:1.1rem;  letter-spacing:0.18em; }
.navbar { padding:0; }
.bg-dark { background:#ccded5 !important; padding:0; }
nav ul { list-style: none; padding-left:1em; margin:0; }
nav li { float:left; padding:0 1em; border-left:4px solid #fff;}
nav ul li ul.dropdown-menu {margin:0;background: none;left: 0rem;/* margin-top: 0.25rem; */padding: 0;}
nav ul li ul li {padding: 0; border:0; /* background:red; *//* display: block; */width: 100%;}
nav ul li ul li a { display: block; }
.dropdown-item.active, .dropdown-item:active { background:rgb(222 40 128 / 0.5); }


nav .active { background:rgb(222 40 128 / 1); }
nav .active a.nav-link { color:#fff !important; }
nav a.nav-link {text-decoration:none;color: rgb(222 40 128 / 1) !important;text-transform: uppercase;padding-left: 1em;padding-right: 1em;/* padding-top: 0.5em; *//* padding-bottom: 0.5em; */line-height: 2;display: block;}
nav .nav-item:hover { background:#9dc2b4;}
nav svg { margin-top:-0.5rem; }
nav .container { position:relative; }
nav img { width:54px; height:auto; position:absolute; right:0.5rem; top:0.16rem; opacity:0; transition:0.5s opacity ease-in-out; }
nav.fixed-top { margin-top:0; }
nav.fixed-top img { opacity:1; }
.navbar-toggler { margin-left:-0.75rem;}

.navbar-collapse.show {/* margin-top: 1.2rem; *//* padding-bottom: 1em; */}

section { padding: 2em 0; }

section ul:not(.pagination) li { padding-left:1.25rem; position:relative; }
section ul:not(.pagination) li:after { content:''; position:absolute; top:0.25rem; left:0; width:15px; height:15px; display:block; background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'><path fill-rule='evenodd' d='M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8z'/></svg>"); }

section#start, section#start h1 { font-family:'rift_softlight'; color:rgb(222 40 128 /1); letter-spacing:0.18em; }
section#start h1 { font-family:'rift_softdemi'; font-size:1.5rem; }
section#start ul li { padding-left:2rem; position:relative; font-size:1.3rem; }
section#start ul li:after { content:''; position:absolute; top:0.55rem; left:0; width:20px; height:20px; display:block; background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23de2880'><path fill-rule='evenodd' d='M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8z'/></svg>"); }
section#start img { width:200px; height:auto; margin:2em auto; display:block;}

section#info { background: rgb(240 244 242 / 1); margin-bottom:-2em; }

section#collapse { padding-bottom:0; }
.collapsing { transition: height .5s ease; }
.accordion { background:#fff; }
.accordion-body { padding:2em 0; position:relative; min-height:795px; }
.accordion-body img {/* margin-left:50%; *//* transform: translate(-50%, 0); */padding:2em 0;margin: auto;display: block;}
.accordion-body p a { background:#086242; padding:1rem 2rem; margin-top:1rem;display:inline-block; color:#fff; text-transform: uppercase; text-decoration:none; font-weight:bold; letter-spacing:2.5px;}
.accordion-body p a:hover { background:#d7c400; color:#000; } 
.accordion-item { border:0; }
.accordion-item:first-of-type { border-top-left-radius:0 !important; border-top-right-radius:0 !important; }
.accordion-item:last-of-type { border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important; }
.accordion-button .container { margin:-5px; }
.accordion-button { color:#fff; padding: 1rem 0.75rem; font-size: 1.3rem; letter-spacing: 0.18em; background:transparent !important; }
.accordion-button:not(.collapsed) { color: #fff; }
.accordion-button:after { background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'><path fill-rule='evenodd' d='M8 1a.5.5 0 0 1 .5.5v11.793l3.146-3.147a.5.5 0 0 1 .708.708l-4 4a.5.5 0 0 1-.708 0l-4-4a.5.5 0 0 1 .708-.708L7.5 13.293V1.5A.5.5 0 0 1 8 1z'/></svg>") !important; }

#entscheider .accordion-header { background:rgb(222 40 128 / 1); color:#fff; }
#entscheider .accordion-collapse, .magenta {background: rgb(252 232 241);}

#lehrkraefte .accordion-header { background:rgb(215 196 0 / 1); color:#fff; }
#lehrkraefte .accordion-collapse, .gelb {background: rgb(247 240 185);}
#lehrkraefte h2:after { background:rgb(215 196 0 / 1); }

#lernende .accordion-header { background:rgb(8 98 66 / 1); color:#fff; }
#lernende .accordion-collapse, .gruen {background: rgb(207 224 216);}
#lernende h2:after { background:rgb(8 98 66 / 1); }

section#galerie, .grau { background: #efefef; }
section#galerie h2 { display:inline; color:rgb(8 98 66 / 1); text-transform: uppercase; }
section#galerie .galerie { width:auto; float:left; }
section#galerie .galerie img { width:100%; height:auto; }
section#galerie .galerie div { display:none; }
section#galerie .galerie div:nth-child(1) { display:block; }
section#galerie button { transform:scale(1.5); }

.projekt h1 {   
  position:relative;letter-spacing: 0.18em;padding-bottom:1em;margin-bottom:1em;
}

.projekt h1::after  {
  content:""; display:block; position:absolute; left:0; bottom:-0.05em; width:86%; height:2px; background: rgb(222 40 128 / 1);  }
}

section#kontakt { text-align:center; }
section#kontakt a {text-decoration:none;color: rgb(8 98 66 / 1);}
section#kontakt a:hover { color:rgb(222 40 128 / 1); }
section#kontakt h2 {color:rgb(222 40 128 / 1);text-transform: uppercase;width: 70%;text-align: center;margin: auto;margin-bottom: 1em;}
section#kontakt h2:after {width: 100%;}
section#kontakt h5 { font-weight:bold; font-size:1rem; font-family:'rift_softdemi'; margin-bottom:1.5rem; color:rgb(222 40 128 / 1); letter-spacing:2px; text-align:center;}
section#kontakt img { height:auto; width:90px;}
.ansprechpartner { text-align:center; }

section#partner div { color:rgb(222 40 128 / 1); font-weight:bold; letter-spacing:0.18em; } 
section#partner div:nth-child(2) {margin-top:4em; }
section#partner .col-lg-6 div { width: auto; display: inline-block; position: relative; left: 50%; transform: translateX(-50%); text-align:center;}
section#partner h6 { font-weight:bold; font-size:1rem; font-family:'rift_softdemi'; margin-bottom:1rem; color:rgb(8 98 66 /1); }
section#partner img {height: 38px;width:auto;margin-right:2rem;}
 
#partner a { float:left; }
 
footer { padding:1rem 0; background: rgb(177 208 199 / 1); color:#fff; font-family:'rift_softdemi'; color:rgb(8 98 66 / 1); letter-spacing: 0.2em; text-align: center; }
footer a { color:rgb(8 98 66 / 1); text-decoration:none; font-weight:bold; margin-left:1rem; margin-right:1rem; }
footer a:hover { color: #fff; }
footer img { height:80px; width:auto; }

.modal {
    text-align: center
}

.modal a {
    text-decoration: none;
    color:#000;
}

.modal .whatsapp {
    display: none
}

.modal .col {
    padding: 2em 0
}

.modal:not(#onload) img {
    width: 50px;
    display: block;
    margin: auto;
    margin-bottom: 1em
}

.modal#onload { width:100%; }
.modal#onload .modal-dialog { max-width:90%; }
.modal#onload img { width:100%; height:auto; }

.modal input {
    color: #fff;
    position: absolute;
    left: -200em;
    opycity: 0
}

    header .stoerer2 {
        bottom: 2rem;
        right: 1.5rem;
        width: 18vmin; 
        height: 18vmin;
        line-height:0.3;
    }

    header .stoerer2 a {
        font-size:1.2vW;
        letter-spacing:2px;        
        top: 7vW;        
    }   

#news {
  
}

#news .container {
  position:relative;
  /* background: rgb(204 222 213 / 25%); */
}

#news .news {
  /* background:red; */
  /* padding-right: 2.75rem; */
}

#news .news .empty { margin-left:-0.75rem;}

.sidebar {
    background: rgb(204 222 213 / 25%);
    padding-top: 2rem;
    position:relative;
    /* top: -4.3rem; */
    padding-bottom:3rem;
    padding-left: 1.5rem;
    order: -1;
    margin-bottom: 0.5rem;
}

#artikel .news {
  /* background:red; */
  padding:0;
}

#artikel .sidebar {
  top:0;
  padding-right: 1rem;
  margin-bottom: 1.5rem;
}

#artikel .text { padding:0; }

.sidebar .suche h3 {
  padding-top:1.5rem;
}

.sidebar a,
.newsArtikel a.button,
.pagination a {
  color:rgb(222 40 128 / 1);
  text-decoration:none;
}

.sidebar a.active { text-decoration:underline;}

.newsArtikel a {
  text-decoration:none;
  color:rgb(8 98 66 / 1);
}

.newsArtikel a.filter {
  font-weight:bold;
}

.newsArtikel a.fliesstext {
  padding-bottom:1rem;
  display:block;
  /* background:red; */
}

.sidebar a:hover {
  text-decoration:underline;
}

.newsArtikel a.button {
  position:absolute;
  bottom:0
}

.sidebar li {
  line-height:1.7;
  margin-left: 0.25rem;
}

.artikel,
.newsArtikel {
    position: relative;
    /* background:red; */
    display:block;
}

.newsArtikel .text {
  margin-top: 0.5rem;
  margin-left: -0.75rem;
  padding-right: 0;
}

.artikel .bild,
.newsArtikel .bild {
    position: relative;
    overflow: hidden;
    padding-left: 0;
    padding-right: 0;
    /* left: 0.75rem; */
}

#artikel .artikel .bild { padding-bottom:1rem; }

.artikel .bild img,
.newsArtikel .bild img {
  max-width:100% !important;
  height:auto;  
  transition:all 0.5s ease-in-out;
}

.newsArtikel .bild:hover  img {
  transform:scale(1.1);
  border:1px solid red;
}

.newsArtikel .kategorie {
  position:absolute;
  right:1rem;
  bottom:0rem;
}

.datum {
    color: rgb(255, 255, 255);
    position: absolute;
    left: 0;
    text-align: center;
    font-family: rift_softdemi;
    background: rgb(0, 98, 66);
    padding: 0.5rem 0.5rem 0px;
    z-index: 2;
}

.artikel a {
  color:rgb(222 40 128 / 1);
}

.datum .tag {
    font-size: 2rem;
    font-weight: bold;
    margin-top: -0.75rem;
}

.datum .monat {
    font-size: 1.25rem;
    font-weight: bold;
    margin-top: -0.75rem;
}

.datum .jahr {
    font-size: 1.25rem;
    font-weight: bold;
    margin-top: -0.5rem;
}

.pagination {
  position:relative;
  top:3.1rem;
  /* background:#f2f7f4; */
  padding:1rem;
}

.pagination .page-item.active .page-link {
  background:#006242;
  border:0;
}

.pagination a:hover {
  color:#006242;
}

.neighbors {
  /* background:red; */
  margin-top:1rem;
}

.neighbors a {
  text-decoration:none;
  color:rgb(222 40 128 / 1);
}

.downloads .poster { border-bottom: 1px solid #ccded5; }

.poster {
  padding: 1rem;
  padding-bottom: 1.0rem;
  /* padding-left: 0; */
  /* margin-bottom:2rem; */
  text-align:center;
}

.poster a {
  text-decoration:none;
  color:rgb(222 40 128 / 1);
  display:block;  
}

.disclaimer img {width: 88px !important;}

.poster a .disclaimer {
  opacity:0;
  color:#006242;
  font-weight:bold;
  margin-top:1rem;
-webkit-transition: opacity 0.5s ease-in-out;
  -moz-transition: opacity 0.5s ease-in-out;
  -ms-transition: opacity 0.5s ease-in-out;
  -o-transition: opacity 0.5s ease-in-out;
  transition: opacity 0.5s ease-in-out;  
  font-size:0.8rem;
}

.poster a:hover .disclaimer {
  opacity:1;
}

.poster a .disclaimer img.copyright {
  width:88px !important;
  height:auto;
  display:block;
  margin:auto;
  padding:0.5rem 0;
}

.poster .beschreibung p {
  line-height:1.2;
}

.poster .beschreibung i {
  font-weight:normal;
}

.unterseiten .col-4 {
  /* border:1px solid; */
  padding:1rem;
}

.unterseiten a {
  display:block;
  /* background:red; */
  padding:1rem 1rem;
  font-size: 1.25rem;
  text-transform:uppercase;
  color: #006242;
  text-decoration:none;
  font-weight: bold;
  letter-spacing: 0.18em;
}

.unterseiten a:hover {
  text-decoration:underline;
}

.simplesearch-results-list { padding:2rem 0; }
.simplesearch-results-list h3 a { color:#006242; }

@media only screen and (min-width: 375px) {
    section#start ul li {font-size: 1.5rem;}
    section .col-xs-12 h2,
    .accordion-body h2,
    section#galerie h2 {font-size: 1.5rem;} 
    .accordion-button { font-size: 1.6rem; }   
    section#partner img {height: 48px;}
}

@media only screen and (min-width: 425px) {

    header .stoerer2 {
        bottom: 2rem;
        right: 1.5rem;
        width: 20vmin; 
        height: 20vmin;
        line-height:0.8;
    }

    header .stoerer2 a {
        font-size:1.5vW;        
        top: 6.25vW;           
    }     

    header .logo {top: 0.75rem;left: 0.75rem;}  
    section .col-xs-12 h2,
    .accordion-body h2,
    section#galerie h2 {font-size: 1.8rem;}  
    .accordion-button { font-size: 1.9rem; }   
    section#partner img {height: 52px;}
}

@media only screen and (min-width: 576px) {

    header.artikel img.headline {margin-left: 0;margin-top: -1.3rem;}
  header a.aktionstag {position:absolute;bottom:2rem;right:1.26rem;text-decoration:none;font-weight:bold;color: #fff;background: #de2880;padding:0.5rem;z-index: 1;}
  
    header .stoerer2 {
        bottom: 2rem;
        right: 1.5rem;
        width: 20vmin; 
        height: 20vmin;
        line-height:0.8;
    }

    header .stoerer2 a {
        font-size:1.5vW;
        letter-spacing:4px;        
        top: 7vW;           
    }   

    header .logo { top: 1rem;left: 1rem;}  
    header .suche { margin-bottom:1rem;}
    header .suche input[type=text] { width:60%; }
    section .col-xs-12 h2,
    .accordion-body h2,
    section#galerie h2 {font-size: 2.3rem;}
    .accordion-button { font-size: 2.5rem; }
    #kontakt div.col-xs-12 > div:nth-child(3) > div > div.col-md-2 img { position:relative; top:0.75rem; }
    section#kontakt , section#kontakt h2, section#kontakt h5, .ansprechpartner { text-align:left; }
    section#kontakt h2 { margin:0; margin-bottom:1em;}
    section#partner .col-lg-6 div { text-align:left; margin:0; left:0; transform:translateX(0); }
    section#partner img {height: 65px;}
}

@media only screen and (min-width: 768px) {
    body {font-size:0.98rem;/* background:yellow; */}    
    header.artikel img.headline { margin-left:0.5rem; margin-top:3.3rem;}
  header a.aktionstag {position:absolute;bottom:5rem;right:2rem;text-decoration:none;font-weight:bold;color: #f2f7f4;background: #de2880;padding:0.5rem;z-index: 1;}
    header .stoerer2 {
        bottom: 4rem;
        right: 2.5rem;
        width: 20vmin; 
        height: 20vmin;
        line-height:1;
    }

    header .stoerer2 a {
        font-size:2.0vW;
        letter-spacing:4px;
        line-height:1.5;
    }    

  header .suche {margin-bottom:0rem;padding-left:1.2rem;padding-top: 3.15rem !important;}
  header .suche input[type=text] { width:auto; }
  
  .sidebar .suche h3 { padding-top:0rem; }
}

@media only screen and (min-width: 992px) {
    header .stoerer {bottom: 5.5rem;right: 2.5rem;}
    header .logo { top: 1.5rem;left: 1.5rem;}  
    body {font-size:0.98rem;/* background:blue; */}   
    .navbar-collapse { margin-top:0;}
    nav ul li ul.dropdown-menu {background: #fff;}
    nav img { width:70px; }
    section#start img { width:200px; height:auto; float:right; margin-right:7rem; margin-top:1.5rem;}
    section .col-xs-12 h2 { font-size:1.8rem;}
    section#partner div { color:rgb(222 40 128 / 1); font-weight:bold; letter-spacing:0.18em; } 
    section#partner div:nth-child(2) { border-left:2px solid; padding-left:3em; margin-top:0; }    
    footer { text-align:left; } 
    footer .pt-4 { margin-top:0.2em; }
    footer .pt-4:nth-child(2) { text-align:center; }
    footer .pt-4:nth-child(3) { text-align:right; }
    header .stoerer2 {
        bottom: 6rem;
        right: 2.5rem;
        width: 25vmin; 
        height: 25vmin;
    }

    header .stoerer2 a {
        font-size:1.75em;
        letter-spacing:4px;
        top: 2.5em;
    }    
}

@media only screen and (min-width: 1200px) {
    body {font-size:0.98rem;/* background:green; */}
    section .col-xs-12 h2,
    .accordion-body h2,
    section#galerie h2 { font-size:2.2rem; }
    .accordion-body img {position:absolute;right:0;top: 46.5%;transform: translate(0, -50%);}
    section#kontakt .col-xxl-10 { padding-left:2em;}

#news .news {
  /* background:red; */
  padding-right:2.25rem;
  }

#artikel .news {
  /* background:red; */
  padding-right:0.75rem;
}  

  .sidebar {
    order:1;
  }

#artikel .text {padding-right: 1.75rem;}  

  .newsArtikel .text {margin-top:-0.5rem;margin-left: 0;}
  .sidebar .suche h3 { padding-top:1.5rem; }

  .artikel .bild { padding-right: 1rem; }
  #artikel .artikel .bild {padding-right: 1.5rem;}
}

@media only screen and (min-width: 1400px) {
    body {font-size:0.98rem;/* background:red; */} 
}
 