/* Individual-CSS für das Projekt "Kap.8" */



/* SCHRIFTFORMATIERUNG (inkl. Icons) ALLER BEREICHE (Schriftart, -groesse, -dekoration, -gewicht und -farbe, Ausrichtung, line-height, letter-spacing, etc.; KEINE Abstände) und HINTERGRUNDFARBEN */


  /* Reihenfolge für Pseudo-Klassen beachten :link :visited :hover :focus :active */

  a
  {
    color:        #333333;        /* Farbe der Links - wird im Navigationsbereich überschrieben. */
  }

  #brot a::before /* Breadcrumbs */
  {
    color:        #495678;
  }

  /* Icons für Links IM TEXT (also KEINE Linklisten) */
  a.intern::before,
  a.extern::before,
  a.pdf::before,
  a.mail::before,
  a.top::before,
  p.csc-linkToTop a::before,
  a.pagetotop_link::before, /* Workaround (Altlast aufgrund der alten HTML-Struktur innerer Elemente) für u.a. Presseamt */
  a.back::before,
  .dekobild /* > p:after*/ .enlarge::before    /* Für Bilder im Text mit Bildunterschrift, geändert am 3.2. E.E. */
  {
    color:      #495678;
  }

  /* Icons für Listen/Linklisten */
  ul li::before,    /* "normaler" Listenpunkt */
  ul li.intern::before,
  ul li.extern::before,
  ul li.pdf::before,
  ul li.punkt::before,
  ul li.mail::before,
  ul li.sprung::before
  {
    color:      #495678;
  }

  /* Rolli-Icons */
  .rolli-picto i
  {
    color:    #495678;
  }


  header .header-overlay  /* transparenter Hintergrund für Overlay-Logo */
  {
    background:      rgba(255, 255, 255, 0.8);
  }

  .streifen  /* Trennstreifen zwischen Kopf und Inhalt */
  {
    background-color:  #85aac7;
  }

  #navi-spalte  /* Hintergrundfarbe Navi-Spalte */
  {
    background-color:  #e1e1e1;  /* Bei Änderungen nicht vergessen den responsive-Border der Info-Spalte anzupassen! */
    background-image:  none;
    background-position:top left;
    background-repeat:  repeat;
  }

  #inhalts-spalte  /* Hintergrundfarbe Inhalts-Spalte */
  {
    background-color:  #ffffff;
    background-image:  none;
    background-position:top left;
    background-repeat:  repeat;
  }

  #info-spalte  /* Hintergrundfarbe Info-Spalte */
  {
    background-color:  #e1e1e1;
    background-image:  none;
    background-position:top left;
    background-repeat:  repeat;
  }

  @media screen and (min-width: 785px) and (max-width: 1024px) {
    #info-spalte
    {  /* WICHTIG: die Farbe MUSS der Hintergrundfarbe der Navi-Spalte entsprechen! */
      border-left: 220px solid #e1e1e1;
    }
  }


  /* Navigation 1. Ebene */

  #navi-spalte nav li
  {
    background-color:  #cccccc;
  }

  #navi-spalte nav li a
  {
    color:    #495678;
  }

  #navi-spalte nav a.aktiv,
  #navi-spalte nav li a:hover,
  #navi-spalte nav li a:focus,
  #navi-spalte nav li a:active
  {
    background-color:  #495678;
    color: #ffffff;
  }

  /* Navigation 2. Ebene */

  #navi-spalte nav li ul li
  {
    background-color:  #D5DBA0;
  }

  #navi-spalte nav li ul li a
  {
    color:    #444;
  }

  #navi-spalte nav li ul a.aktiv,
  #navi-spalte nav li ul li a:hover,
  #navi-spalte nav li ul li a:focus,
  #navi-spalte nav li ul li a:active
  {
    background-color:  #C7C8CA;/*#dde0a2;*/
  }

  /* Navigation 3. Ebene */

  #navi-spalte nav li ul li ul li
  {
    background-color:  #E3E8CE;
  }

  #navi-spalte nav li ul li ul li a
  {
    color:    #444;
  }

  #navi-spalte nav li ul li ul a.aktiv,
  #navi-spalte nav li ul li ul li a:hover,
  #navi-spalte nav li ul li ul li a:focus,
  #navi-spalte nav li ul li ul li a:active
  {
    background-color:  #E3E8CE;
  }

  /* Für den Pömpel - ALT - IST GGF. UNNÖTIG
  #navi-spalte nav li ul li ul a.aktiv,
  #navi-spalte nav li ul li ul li a:hover,
  #navi-spalte nav li ul li ul li a:focus,
  #navi-spalte nav li ul li ul li a:active
  {
    background-color:  #f2f2f2;
    background-image:  url(images/subnav.gif);
    background-position:1.45em center;
    background-repeat:  no-repeat;
  }*/

  /* Für das Aussehen des Pömpels. Achtung: Werden Größe oder vertical-align geändert, muss auch die Positionierung angepasst werden! */
  #navi-spalte nav li ul li ul a.aktiv::before,
  #navi-spalte nav li ul li ul li a:hover::before,
  #navi-spalte nav li ul li ul li a:focus::before,
  #navi-spalte nav li ul li ul li a:active::before
  {
    color:      #aaa;
  }

  /* Zwischenueberschrift */

  #navi-spalte nav h2
  {
    color:    #444;
  }

  /* Navigation Sprachen 1. Ebene */

  #navi-spalte nav.sprachennavigation ul li
  {
    background-color:  #E3E8CE;
  }

  #navi-spalte nav.sprachennavigation ul li a
  {
    color:        #495678;
  }

  #navi-spalte nav.sprachennavigation ul li a.aktiv,
  #navi-spalte nav.sprachennavigation ul li a:hover,
  #navi-spalte nav.sprachennavigation ul li a:focus,
  #navi-spalte nav.sprachennavigation ul li a:active
  {
    color:        #495678;
    background-color:  #C6CD71;
  }


  main a:hover,
  main a:focus,
  main a:active,
  aside a:hover, /* Hovern auch in der rechten Spalte */
  aside a:focus,
  aside a:active
  {
    background-color: #e5e5e5;
  }


  main
  {
    color:    #444;
  }

  main h1,
  main h2,
  main h3,
  main h4
  {
    color:    #495678;
  }

  main h2.aktuell
  {
    background-color:  #e1e1e1;
  }

  main h2.marker,
  main h3.marker,
  main h4.marker
  {
    background-color:  #e1e1e1;  /* entspricht standardmäßig der Hintergrundfarbe der Navigation */
  }
  div#c100841 > h3,
  div#c100843 > h3,
  div#c106655 > h3,
  div#c106657 > h3,
  div#c106661 > h3 {
      margin-top: 1em;
      border-top: 3px dotted #85AAC7;
      padding-top: 1em;
      }

      div#c100841 > h3:nth-child(2),
      div#c100843 > h3:nth-child(2),
      div#c106655 > h3:nth-child(2),
      div#c106657 > h3:nth-child(2),
      div#c106661 > h3:nth-child(2) {
  border-top: none;
  padding-top: 0;
  }


  /* Zitate */
  main .zitat
  {
    background-color:  #ebebeb;
  }

  main .zitat h3
  {
    color:    #00639d;
  }

  main th /* Spaltenueberschriften von Tabellen im Inhaltsbereich */
  {
    color:        #333333;
    background-color:  #d9d9d9;
  }

  main th.zwischentitel
  {
    color:        #333333;
    background-color:  #E9E9E9;
  }

  main th,
  main td
  {
    background-color:  #eeeeee;
  }

  main .dekobild /* Workaround aufgrund alter HTML-Struktur der inneren Elemente. Im Dummy: .bild */
  {
    background-color:  #f0f0f0;
  }

  /* Zitate */
  main .zitat
  {
    background-color:  #ebebeb;
  }

  main .zitat h3
  {
    color:    #00639d;
  }

  /* ABC-Listen (inkl. Navigation) */
  main #abc
  {
    text-align:  center;  /* zentriert die Liste, wenn diese ein inline-block Element ist */
  }

  main #abc ul li
  {
    background-color:  #005b79;
  }

  main #abc ul li a
  {
    color:    #fff;
  }

  main #abc ul li a.aktiv,
  main #abc ul li a:hover,
  main #abc ul li a:focus,
  main #abc ul li a:active
  {
    background-color:  #AAB315;/*#a2a800;*/
  }
/* Galerie */
main .galerie_rahmen .galerie {
    border: 1px solid #898888;
    padding: 0;
    border-radius: 0;
margin-left: 0;
}

/* ENDE Galerie */

/* Veranstaltungen */
.news .article {
  padding-bottom: 0.5em;
  margin-bottom: 0;
  margin-top: 0.2em;
  border-bottom: 3px dotted #85AAC7;
  /* border-top: 1px solid #005b79;*/
  }
.news .article:last-child {
  border-bottom: none;
  }

.news.news-single .article{
  border-bottom: none;
  }



.header .news-list-date {
   width: 300px !important;
   display: block;
   margin-top: 1em;
   /* padding: 1em 0 0 0;*/
   font-style: normal;
   font-family: "Vesta W01 Bold", Verdana, Geneva, Arial, Helvetica, sans-serif;
}
.header h2.anreisser {
    font-size:  16px;
    font-size:  1.6rem;
  }

.header h2 a,
.header h3 a {
  text-decoration: none;
  color: #005b79;
 }
.event-tags {
  color: #cc0000;
  font-weight: normal;
  font-style: normal;
  font-family: "Vesta W01 Bold", Verdana, Geneva, Arial, Helvetica, sans-serif;
}
.news-single .footer .event-tags {
margin-left: 1em;
padding-left: 1em;
border-left: 1px solid grey;
}
.news .article .news-img-wrap {
    float: right;
    margin: 1.1em 0 0.5em 0.5em;
    background: #fff;
}
.news .article .news-img-wrap a {
    padding: 0;
    border: none;
}
.news.news-single .news-img-wrap {
    float: right !important;
    margin: 6px 0 12px 15px;
    background: #fff;
}


.news-single .teaser-text {
    font-size: inherit;
    color: #000;
    overflow: visible;
}
.news-single .news-text-wrap {
  overflow: visible;
  }
.news .footer {
    clear: both;
    padding: 0;
    border-top: none;
    margin-top: 10px;
    color: #000000;
}
.news .footer span {
  font-weight: normal;
  font-style: normal;
  font-family: "Vesta W01 Bold", Verdana, Geneva, Arial, Helvetica, sans-serif;
  }
.news-single .footer {
margin-bottom: 1em;
}
.news-backlink-wrap {
margin-top: 1em;
}
.news-backlink-wrap a:before,
a.more:before {
    font-family:  'ms-icons', sans-serif !important;
    font-size:    1em;
    font-weight:  normal;
    font-style:    normal;
    font-variant:  normal;
    text-decoration:none;
    text-transform: none;
    color:      #495678;
    vertical-align:  baseline;
    /* Better Font Rendering */
    -webkit-font-smoothing:  antialiased;
    -moz-osx-font-smoothing:grayscale;
    /*line-height: 0.9em;*/
    display: inline-block;
margin-right: 0.3em;
}
.news-backlink-wrap a:before {
    content: "\e913";
}
a.more:before {
    content: "\e914";
}


div#c107594 .article {
  border-bottom: 3px dotted #85AAC7;
  }
div#c107594 .article:last-child {
  border-bottom: 3px dotted #85AAC7;
  }

div#c107594 .header .news-list-date:first-child {
  background-color: #ffffff;
  margin-top: 1em;
  border-top: none;
  padding: 0;
  }
.header h2,
.header h3
div#c107594 .header h3 {
  margin: 0;
  padding: 0;
  }

/* Ansicht S */
@media screen and (max-width: 500px) {

.news.news-single .news-img-wrap {
    display: block;
    overflow: hidden;
    float: none! important;
    margin: 6px 0 12px 0;
   }

}



/* Veranstaltungen ENDE */

/* Kreativmarkt */
hr.line {
color: #495678;
size: 2px;
display: block;
visibility: visible;
width: 100%;
margin-bottom: 1em;
}

#c200119,
#c200121,
#c200129,
#c200131,
#c200314,
#c200316,
#c200318,
#c200320,
#c200322,
#c200324,
#c200326,
#c200328,
#c200330,
#c200332,
#c200334,
#c200336,
#c200338,
#c200340,
#c200342,
#c200344,
#c200346,
#c200348,
#c200350,
#c200352,
#c200354,
#c200356,
#c200358,
#c200360,
#c200362,
#c200364,
#c200366,
#c200368,
#c200370,
#c200372,
#c200374,
#c200376,
#c200378,
#c200380,
#c200382,
#c200384,
#c200386,
#c200388,
#c200390,
#c200392,
#c200394,
#c200396,
#c200398,
#c200400,
#c200402,
#c200404 {
float: left;
margin-right: 15px;
margin-bottom: 10px;
border: 1px solid #cccccc;
}

#c200119 p,
#c200121 p,
#c200129 p,
#c200131 p,
#c200314 p,
#c200316 p,
#c200318 p,
#c200320 p,
#c200322 p,
#c200324 p,
#c200326 p,
#c200328 p,
#c200330 p,
#c200332 p,
#c200334 p,
#c200336 p,
#c200338 p,
#c200340 p,
#c200342 p,
#c200344 p,
#c200346 p,
#c200348 p,
#c200350 p,
#c200352 p,
#c200354 p,
#c200356 p,
#c200358 p,
#c200360 p,
#c200362 p,
#c200364 p,
#c200366 p,
#c200368 p,
#c200370 p,
#c200372 p,
#c200374 p,
#c200376 p,
#c200378 p,
#c200380 p,
#c200382 p,
#c200384 p,
#c200386 p,
#c200388 p,
#c200390 p,
#c200392 p,
#c200394 p,
#c200396 p,
#c200398 p,
#c200400 p,
#c200402 p,
#c200404 p{
display: none;
}
/* Kreativmarkt ENDE */


  /* CSS für SCHRIFTFORMATIERUNG Formulare (alleinstehende und integrierte) */
  /* Ehemalige form.css, ergänzt um Work-Around für Presseamt Galerie-Extension (die Formularstruktur in dieser Extension ist veraltet) und CSS für alte, integrierte Formulare. */

    main form
    {
      background-color:  #e5e5e5;  /* Muss der Farbe der checkbox-/radiobutton-Umrandung entsprechen. */
    }

    main form .type-text input:focus,      /* Hierdurch wird das aktive Eingabeelement hervorgehoben */
    main form .type-text textarea:focus,
    main form .type-check textarea:focus,
    main form .type-select select:focus,
    main form .formular-element input:focus,  /* input-Eingabefeld alter, integrierter Formulare (vor Form-Handler) */
    main form .formular-element textarea:focus,  /* textarea-Eingabefeld alter, integrierter Formulare (vor Form-Handler) */
    main form .formular-element select:focus,  /* selectbox-Auswahlfeld alter, integrierter Formulare (vor Form-Handler) */
    main .tx-cq-image-gallery form input:focus  /* Work-Around für Presseamt Galerie-Extension (die Formularstruktur in dieser Extension ist veraltet) */
    {
      background-color:  #fff8d1;
    }

    /* Buttons (auch im Bestätigungs-Schritt) */
    main form .submit-buttons .type-button .submit,  /* Submit-/Abschicken-Button */
    main .last-step .buttons .type-button .print,  /* Print-Button in last-step */
    main form .buttons input.submit,        /* Submit-Button alter, integrierter Formulare (vor Form-Handler) */
    main .tx-cq-image-gallery form .submit-buttons .submit-button /* Work-Around für Presseamt Galerie-Extension (die Formularstruktur in dieser Extension ist veraltet) */
    {
      background-color:  #005395;      /* wichtig bei last-step */
      color:        #ffffff;      /* wichtig bei last-step */
    }

    main form .submit-buttons .type-button .reset,  /* Reset-/Löschen-Button */
    main form .buttons input.reset,          /* Reset-Button alter, integrierter Formulare (vor Form-Handler) */
    main .tx-cq-image-gallery form .submit-buttons .reset-button /* Work-Around für Presseamt Galerie-Extension (die Formularstruktur in dieser Extension ist veraltet) */
    {
      color:        #323232;
      background-color:  #ffffff;
    }
    /* ENDE Buttons (auch im Bestätigungs-Schritt) */

  /* ENDE ehemalige form.css, ergänzt um Work-Around für Presseamt Galerie-Extension (die Formularstruktur in dieser Extension ist veraltet) und CSS für alte, integrierte Formulare. */
  /* ENDE CSS für SCHRIFTFORMATIERUNG Formulare (alleinstehende und integrierte) */


  aside h3
  {
    color:        #fff;
    background-color:  #495678;
  }

  aside > div > div  /* Kasten-Element */
  {
    background-color:  #fff;  /* Hintergrundfarbe */
  }

  /* Formular-Style Info-Spalte (inkl. Buttons) */

  aside form input,
  aside form select,
  aside form textarea
  {
    background-color:  #fff;
  }

  aside form input:focus,
  aside form select:focus,
  aside form textarea:focus
  {
    background-color:  #fff8d1;
    border:        1px solid #495678;
  }

  aside form .buttons input.submit
  {
    color:        #ffffff;
    background-color:  #005395;
  }

  aside form .buttons input.reset
  {
    color:        #323232;
  }


/* ENDE SCHRIFTFORMATIERUNG (inkl. Icons) ALLER BEREICHE (Schriftart, -groesse, -dekoration, -gewicht und -farbe, Ausrichtung, line-height, letter-spacing, etc.; KEINE Abstände) und HINTERGRUNDFARBEN */





/* SEITENGERÜST (also auch Header) und ALLGEMEINES */



  /* Blendet die Pager-Punkte des Sliders ein/aus. */
  header .content-header .bx-wrapper .bx-controls .bx-pager
  {
    display:  none;  /* Pager-Punkte aus - wenn sie eingeblendet werden sollen, muss dieser CSS-Block entfernt werden. */
  }

   /* Sonderlocke Sommerakademie */

header #c129967 .bx-wrapper .bx-viewport .srcsetImages {
    max-width: 1220px !important;
    max-height: 215px !important;
   position: absolute;
    right: 0;
  }


/* ENDE SEITENGERÜST (also auch Header) und ALLGEMEINES */





/* HAUPTNAVIGATION */
/* ENDE HAUPTNAVIGATION */





/* INHALTS- und INFOBEREICH allgemein (individ. Format. für die einz. Bereiche weiter unten festlegen) */
/* ENDE INHALTS- und INFOBEREICH allgemein (individ. Format. für die einz. Bereiche weiter unten festlegen) */





/* INHALTSBEREICH */
/* ENDE INHALTSBEREICH */





/* INFOBEREICH ("rechte Spalte") */


  /* Kasten Social Media (Info-Spalte) */
  aside #c107084 div.ce-gallery
  {
    padding: 0.1em 0.4em 0.5em 0.6em;
  }

  /* ENDE Kasten Social Media (Info-Spalte) */


/* ENDE INFOBEREICH ("rechte Spalte") */





/* INDIVIDUAL PRINT-STYLE */


  @media print {

    /*
    SELEKTOR
    {
      CSS-Code
    }
    ...

    */

  }

    /* Template "Firefox-spezifisches CSS" - alles was innnerhalb von @-moz-document url-prefix(){...} steht, */
    /* gilt nur im Firefox. */
    /*
    @-moz-document url-prefix() {
      SELEKTOR
      {
        CSS-ANWEISUNG;
        ...
      }
      ...
    }
    */


/* ENDE INDIVIDUAL PRINT-STYLE */
