@font-face {
  font-display: swap;
  font-family: 'helvetica_neue';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/helveticaneue-roman-webfont.eot');
  src: url('../fonts/helveticaneue-roman-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/helveticaneue-roman-webfont.woff2') format('woff2'),
    url('../fonts/helveticaneue-roman-webfont.woff') format('woff'),
    url('../fonts/helveticaneue-roman-webfont.ttf') format('truetype'),
    url('../fonts/helveticaneue-roman-webfont.svg#helvetica_neue55_roman') format('svg');
}

@font-face {
  font-display: swap;
  font-family: 'helvetica_neue';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/helveticaneue-bold-webfont.eot');
  src: url('../fonts/helveticaneue-bold-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/helveticaneue-bold-webfont.woff2') format('woff2'),
    url('../fonts/helveticaneue-bold-webfont.woff') format('woff'),
    url('../fonts/helveticaneue-bold-webfont.ttf') format('truetype'),
    url('../fonts/helveticaneue-bold-webfont.svg#helvetica_neue75_bold') format('svg');
}

html {
  font-family: 'helvetica_neue', Helvetica, Arial, sans-serif;
  font-size: 18px;
  line-height: 25px;
  scroll-behavior: smooth;
}


.onepage_start {
  margin-top: 150px;
}

/* Für Medium Devices */
@media screen and (min-width: 641px) and (max-width: 960px) {

}

/* Für Small Devices */
@media screen and (max-width: 640px) {

}


/* backbutton und nav-anpassungen für startseite */

a.backbutton {
  display: none;
}

/* backbutton + nav-anpassungen // */

html {
  overflow: scroll;
}

.templatename {
  font-size: 9px;
  color: #808080;
  display: none;
}

.text-outline {
  text-shadow:
    -1px -1px 0 rgba(0, 0, 0, 0.1),
    1px -1px 0 rgba(0, 0, 0, 0.1),
    -1px 1px 0 rgba(0, 0, 0, 0.1),
    1px 1px 0 rgba(0, 0, 0, 0.1);
}




/* Für Medium Devices */
@media screen and (min-width: 641px) and (max-width: 960px) {

  div.uk-grid {
    padding: 0 20px;
  }

  div.uk-grid div.uk-grid {
    padding: 0 !important;
  }
}

/* Für Small Devices */
@media screen and (max-width: 640px) {

  div.uk-grid {
    padding: 0 20px;
  }

  div.uk-grid div.uk-grid {
    padding: 0 !important;
  }
}





h1, h2, h3, h4, h5, h6 {
  font-family: 'helvetica_neue', Helvetica, Arial, sans-serif;
  overflow-wrap: break-word;
  /* hyphens: auto; */
  color: #1d1e1c;
}


h1 {
  font-size: 74px;
  font-weight: bold;
  margin-bottom: 0;
  margin-top: 0;
  text-transform: uppercase;
  line-height: 1;
  background-repeat: re;
}

h2 {
  font-size: 28px;
  font-weight: bold;
  text-transform: uppercase;
}

h3 {
  font-size: 28px;
  font-weight: normal;
}

h2, h3 {
  margin-top: 0;
  margin-bottom: 0;
}


/* Für Medium Devices */
@media screen and (min-width: 641px) and (max-width: 960px) {

  h1 {
    font-size: 9vw;
    line-height: 9.5vw;
  }

  .headlineSubheadline h1 {
    margin-top: 0vw;
    margin-bottom: 0vw;
  }

  h2, .headlineSubheadline h2 {
    font-size: 5vw;
    line-height: 5.5vw;
  }

  .headlineSubheadline {
    position: absolute;
    bottom: 35px;
    left: 0;
    background-color: transparent;
    width: 100%;
    text-align: center;
  }

}

/* Für Small Devices */
@media screen and (max-width: 640px) {

  .bodyContent p {
    margin: 0;
    padding: 0;
  }

  h1, .bodyContent h1 {
    font-size: 9vw;
    line-height: 10vw;
    margin-bottom: 0vw;
    margin-top: 0vw;
  }

  h2.start_subline {}

  .headlineSubheadline h1 {
    margin-top: 0;
    margin-bottom: 0;
  }

  h2, .headlineSubheadline h2 {
    font-size: 5vw;
    line-height: 5.5vw;
  }

}








a:link, a:visited {
  color: #E2361F !important;
}

a:hover, a:active {
  text-decoration: none;
  color: #1d1e1c !important;
}

a:hover h3, a:active h3 {
  text-decoration: none;
  color: #E2361F !important;
}


a.extern::after {
  content: "";
  width: 11px;
  height: 11px;
  margin-left: 4px;
  background-image: url("data:image/svg+xml,%3Csvg id='externalLink' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 23.11 23.11'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:none;stroke:%23e2361f;stroke-miterlimit:10;stroke-width:2px;%7D%3C/style%3E%3C/defs%3E%3Cline class='cls-1' x1='22.11' y1='1' x2='0.71' y2='22.4'/%3E%3Cpolyline class='cls-1' points='2.71 1 22.11 1 22.11 20.24'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  display: inline-block;

}




/* ########################################## 
                  ROUNDBUTTON               */

.roundbutton:link, .roundbutton:visited {
  border: 2px solid #1d1e1c;
  border-radius: 100px;
  padding: 10px 8vw;
  margin: 18px 10px 0 0;
  display: inline-block;
  font-size: 17px;
  color: #1d1e1c !important;
  font-weight: bold;
  transition: all 0.2s;
}

a.roundbutton:hover, a.roundbutton:active {
  text-decoration: none;
  color: #E2361F !important;
  border: 2px solid #E2361F;
}

.roundbutton-start {
  border: 2px solid;
  border-radius: 100px;
  padding: 10px 8vw;
  margin: 41px 10px 0 0;
  display: inline-block;
  font-size: 17px;
  font-weight: bold;
}

.roundbutton-start p {
  margin: 0;
  padding: 0;
}


.roundbutton-red {
  border: 2px solid #E2361F;
  border-radius: 100px;
  padding: 12px 8vw;
  margin: 18px 10px 0 0;
  display: inline-block;
  font-size: 17px;
  color: #E2361F !important;
  font-weight: bold;
}

a.roundbutton-red:hover {
  text-decoration: none;
  color: #1d1e1c !important;
  border: 2px solid #1d1e1c;
}

#content .roundbutton-lila {
  border: 2px solid #3c2e83;
  border-radius: 100px;
  padding: 12px 8vw;
  margin: 18px 10px 0 0;
  display: inline-block;
  font-size: 17px;
  color: #3c2e83 !important;
  font-weight: bold;
}

#content a.roundbutton-lila:hover {
  text-decoration: none;
  color: #1d1e1c !important;
}

li a.roundbutton-festival {
  border: 2px solid #fff;
  border-radius: 100px;
  padding: 10px 8vw;
  margin: 18px 10px 0 0;
  display: inline-block;
  color: #1d1e1c !important;
  font-size: 17px !important;
  font-weight: normal;
  background-color: white !important;
  text-transform: none !important;
}

li a.roundbutton-festival:hover {
  border: 2px solid #3c2e83;
  color: #3c2e83 !important;
  font-weight: normal;
  background-color: white !important;
  text-transform: none !important;
}

li.uk-active a.roundbutton-festival {
  background-color: #3c2e83 !important;
  color: white !important;
  font-weight: bold;
  text-transform: none;
}

.roundbutton-small {
  border: 1px solid #1d1e1c;
  border-radius: 100px;
  padding: 0px 19px;
  margin: 18px 10px 0 0;
  display: inline-block;
  font-size: 15px;
  color: #1d1e1c;
}

.roundbutton-xsmall {
  border: 1px solid #1d1e1c;
  border-radius: 100px;
  padding: 0px 19px;
  margin: 22px 10px 0 0;
  display: inline-block;
  font-size: 12px;
  color: #1d1e1c;
  line-height: 21px;
}

.roundbutton-big {
  border: 1px solid #1d1e1c;
  border-radius: 100px;
  padding: 0px 19px;
  margin: 18px 10px 0 0;
  display: inline-block;
  font-size: 23px;
  color: #1d1e1c;
}


/* Für Small Devices */
@media screen and (max-width: 640px) {

  .roundbutton {
    margin: 20px 0 20px 0 !important;
  }

}



/* ============================================
   footer */

footer {
  background: #fff;
  height: auto;
  padding: 0 1em;
}

footer div div.footer {
  padding-top: 8rem;
}



/* ============================================
   footer // */


/* ###################################
background-size to cover  | background-fixed to normal*/

/* Für Small Devices */
@media screen and (max-width: 640px) {

  .uk-background-width-1-1 {
    background-size: cover !important;
}

.uk-background-fixed {
  background-attachment: initial;
}

}
/* ###################################
background-size to cover  // */


/* ###################################
teilnehmer - detailseiten */

/* logo einbindung */

.logointegration {
  padding-right: 60px !important;
  margin-top: -30px !important;
}


/* imagecarousel */
#content .uk-slidenav {
  background: transparent;
  height: 90%;
  width: 15%;
  margin: 0;
  padding: 0;
}

#content .uk-slidenav svg {
  display: none;
}

.ipk-sliderhoehe.uk-panel {
  /*height: 636px;*/
}

.ipk-dotnav.uk-slider-nav.uk-dotnav.uk-flex-center.uk-margin {
  top: -85px;
  position: relative;
}

.uk-dotnav>*>* {
  width: 60px;
  height: 1px;

  padding-top: 1px;
  padding-bottom: 1px;

  border-radius: 5px;

  background-color: #E2361F !important;
  border-color: white !important;

  transition: 0.2s ease-in-out;
  transition-property: all;
  transition-property: background-color, border-color;
}


.uk-dotnav>.uk-active>* {
  background-color: #E2361F !important;
  border-color: #E2361F !important;

}

.uk-dotnav>*> :hover {
  background-color: #E2361F !important;
  border-color: #E2361F !important;
}



figure {
  position: relative;
}


p.fig-title {
  margin: 0;
  padding: 0;
  font-weight: bold;
  font-size: 13px;
  line-height: 20px;
  letter-spacing: 0.61px;
  text-transform: uppercase;
}

p.fig-copy {
  margin: 0;
  padding: 0;
  font-weight: normal;
  font-size: 13px;
  line-height: 20px;
  letter-spacing: 0.61px;
}

figcaption.captioncarousel {
  position: absolute;
  text-align: center;
  width: 100%;
  top: 640px;
}

div.img-carousel {
  margin-bottom: 0;
}

div.carouselContainer {
  height: 740px;
}


figure.img-panorama figcaption {
  position: absolute;
  text-align: left;
  font-size: 10px;
  line-height: 13px;
  bottom: 0px;
  left: 2px;
  background-color: transparent;
  padding: 0;
  color: white;
  text-shadow:
    -1px -1px 0 rgba(0, 0, 0, 0.25),
    1px -1px 0 rgba(0, 0, 0, 0.25),
    -1px 1px 0 rgba(0, 0, 0, 0.25),
    1px 1px 0 rgba(0, 0, 0, 0.25);
}

figcaption.img-carousel {
  text-align: center;
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.caption-container {
  position: relative;
  max-width: 100%;
  width: 100%;
}

.caption-container figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 10px;
  background-color: rgba(0, 0, 0, 0.5);
  color: #fff;
  max-width: 100%;
  word-wrap: break-word;
}



/* headergrafik //*/


/* ===================================================
================ STARTSEITE ONEPAGER ================= */

/* #########################################################
                    EDITION PHOTOS 2er                    */

section.m_edition, section.m_edition.hellgrau {
  background-color: #e8e8e8 !important;
  color: #000;
  padding-top: 9em !important;
}

/* farbanpassung an mittelgrau und dunkelgrau */
section.m_edition.mittelgrau {
  background-color: #b4b4b4 !important;
  color: #000;

}

section.m_edition.dunkelgrau {
  background-color: #808080 !important;
  color: #fff;
  
}

/* farbanpassung an mittelgrau und dunkelgrau // */

/* .edition-landscape1 {
  background-color: lightcoral;
}

.edition-landscape2 {
  background-color: red;
}

.edition-portrait1 {
  background-color: lightblue;
}

.edition-portrait2 {
  background-color: blue;
} */

.landscape-margin1 {
  margin-top: 3em;
}

.landscape-margin2 {
  margin-top: 6em;
}


.m_edition h2.headline {
  margin-top: 22px;
  font-size: 23px;
  line-height: 27px;
  letter-spacing: 1.08px;
}

/* farbanpassung an dunkelgrau */
.m_edition.dunkelgrau h1, .m_edition.dunkelgrau h2.headline, .m_edition.dunkelgrau p.subheadline, .m_edition.dunkelgrau h2.start_subline2 {
color: #fff !important;
}

.m_edition.dunkelgrau .roundbutton-red, .m_edition.dunkelgrau .roundbutton-start {
  border-color: black;
  color: black !important;
}

.m_edition.dunkelgrau .roundbutton-red:hover, .m_edition.dunkelgrau .roundbutton-start:hover {
  border-color: white;
  color: white !important;
}

.m_edition.dunkelgrau a figure h2, .m_edition.dunkelgrau a figure p {
  color: #fff !important;
}

.m_edition.dunkelgrau a:hover figure h2, .m_edition.dunkelgrau a:hover figure p {
  color: black  !important;
}

/* farbanpassung an dunkelgrau // */

.m_edition p.subheadline {
  margin-top: 10px;
  font-size: 13px;
  line-height: 15px;
  letter-spacing: 0.61px;
}

.m_edition .roundbutton-start {
  margin-top: 20px;
  margin-bottom: 50px;
}

.m_edition .roundbutton-red {
  margin-top: 20px;
  margin-bottom: 160px;
}

.m_edition .roundbutton-red p {
  margin: 0;
  padding: 0;
}

.m_edition a figure h2, .m_edition a figure p {
  color: #000 !important;
}

.m_edition a:hover figure h2, .m_edition a:hover figure p {
  color: #E2361F  !important;
}





/* Für Medium Devices */
@media screen and (min-width: 641px) and (max-width: 960px) {}

/* Für Small Devices */
@media screen and (max-width: 640px) {

  section.m_edition{
    padding-top: 2em !important;
  }

  .m_edition .roundbutton-red {
    margin-top: 20px;
    margin-bottom: 2em;
  }

}


/* #########################################################
                       imageTeaser 2:1                    */

.uk-height-imageTeaser {
  height: 700px;
}

.start_imageTeaser {
  position: relative;
}

.start_headlines {
  position: absolute;
  bottom: 17%;
  left: 5%;
}

.start_kat {
  text-transform: uppercase;
  font-size: 16px;
  letter-spacing: 0.5px;
  margin: 0;
  padding: 0;
  margin-bottom: 7px;
}

h2.start_subline {
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0.94px;
  margin: 0;
  padding: 0;
  margin-top: 7px;
}


/* Für Medium Devices */
@media screen and (min-width: 641px) and (max-width: 960px) {

  .start_kat {
    margin-bottom: 0vw;
  }

  .roundbutton-start {
    padding: 10px 15px;
    margin: 41px 10px 0 0;
    text-align: center;
  }
  

}



/* Für Small Devices */
@media screen and (max-width: 640px) {

  .start_kat {
    margin-bottom: 0vw;
  }

  .roundbutton-start {
    padding: 10px 15px;
    margin: 41px 10px 0 0;
    text-align: center;
  }

  .uk-height-imageTeaser {
    height: auto;
  }

  .start_headlines {
    position: relative;
    left: 0;
  }

  .start_headlines div.uk-grid {
    padding: 0;
  }

 

}

/* ######## 16px Uppercase headline z.b. für instagram und hängung ###### */
.sectionHeadline {
  padding-top: 7em;
  padding-bottom: 3em;
}

.sectionHeadline H1 {
  font-size: 16px;
  text-align: center;
  font-weight: normal;
  letter-spacing: 1px;
}

/* #########################################################
                        INSTAGRAM                         */
.start_instagram {
  position: relative;
  padding-bottom: 10em;
}



/* Für Small Devices */
@media screen and (max-width: 640px) {

  .start_instagram {
    margin-bottom: 3em !important;
  }

  .start_instagram>div>a>img {
    width: 100%;
  }

  .sectionHeadline {
    padding-top: 2em;
    padding-bottom: 2em;
  }

}




/* #########################################################
             Bildraster AKA Petersburger Hängung          */

a.raster-link:hover .roundbutton-small.untenLinks {
  opacity: 1;
}

.roundbutton-small.untenLinks {
  background: rgba(255, 255, 255, 0.0);
  color: white;
  border-color: white;
  margin: 10px 10px 0px 0;
  text-shadow:
    -1px -1px 0 rgba(0, 0, 0, 0.1),
    1px -1px 0 rgba(0, 0, 0, 0.1),
    -1px 1px 0 rgba(0, 0, 0, 0.1),
    1px 1px 0 rgba(0, 0, 0, 0.1);
  opacity: 0;


  box-shadow: 0px 0px 2px 0px #888;

}

.ulabstand {
  padding: 1em;
}


.grid-container {
  display: grid;
  grid-template-columns: repeat(12, 107px);
  grid-template-rows: repeat(12, 107px);
  gap: 10px;
  border: solid lightgray 0px;
  width: 100%;

}

.item-1,
.item-2,
.item-3,
.item-4,
.item-5,
.item-6,
.item-7,
.item-8,
.item-9,
.item-10 {
  /* background-color: #f9f9f9; */
  position: relative;
}

.raster-link {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.item-1 {
  grid-column: 7/9;
  grid-row: 1/4;
}

.item-2 {
  grid-column: 1/4;
  grid-row: 3/6;

}

.item-3 {
  grid-column: 4/7;
  grid-row: 2/6;

}

.item-4 {
  grid-column: 7/10;
  grid-row: 4/6;
}

.item-5 {
  grid-column: 10/13;
  grid-row: 3/6;
}

.item-6 {
  grid-column: 2/5;
  grid-row: 6/10;
}

.item-7 {
  grid-column: 5/9;
  grid-row: 6/9;
}

.item-8 {
  grid-column: 9/12;
  grid-row: 6/10;
}

.item-9 {
  grid-column: 3/6;
  grid-row: 10/12;
}

.item-10 {
  grid-column: 6/9;
  grid-row: 9/13;
}

/* Für von Desktop - Small */
@media screen and (min-width: 641px) and (max-width: 1400px) {

  .grid-container {
    display: grid;
    grid-template-columns: repeat(12, 7.25vw);
    grid-template-rows: repeat(12, 7.25vw);
    gap: 0.714vw;
    width: 95vw;
    margin-left: 2vw;
    /* background: red; */
  }
}

/* Für Medium Devices */
@media screen and (min-width: 641px) and (max-width: 960px) {
  .grid-container {

    /* background: yellow; */
  }

  div.bildrasterHaengung>div.uk-grid {
    padding: 0;
  }
}

/* Für Small Devices */
@media screen and (max-width: 640px) {

  /* Auflösung des Rasters für schmale Bildschirme */
  .grid-container {
    grid-template-columns: 1fr;
    /* Eine Spalte für schmale Bildschirme */
    grid-template-rows: auto;
    /* Automatische Reihenhöhe */
    gap: 10px;
    /* Kein Abstand zwischen den Elementen */
    border: none;
    /* Entferne die Grenze */
  }

  /* Anpassungen für die einzelnen Elemente */
  .item-1,
  .item-2,
  .item-3,
  .item-4,
  .item-5,
  .item-6,
  .item-7,
  .item-8,
  .item-9,
  .item-10 {
    grid-column: auto;
    /* Automatische Spaltenplatzierung */
    grid-row: auto;
    /* Automatische Reihenplatzierung */
    width: 100%;
    /* Volle Breite für jedes Element */
    height: 300px;
    /* background-size: contain !important; */
  }

}

/* #########################################################
             Bildraster AKA Petersburger Hängung          */
.m_bildraster {
  padding-bottom: 4em !important;
}


/* #########################################################
                 Presenter mit Bildraster                 */

.m_presenterMitBildraster {
  padding-bottom: 12em !important;
}

.m_presenterMitBildraster>.sectionHeadline {
  padding-top: 0em;
  padding-bottom: 2em;
}

.m_presenterMitBildraster>div>div>.start_textTeaser {
  padding-bottom: 6.8em;
}

/* #########################################################
                   contentSlider                          */


ul.uk-dotnav.uk-flex-center.uk-margin.ipk-slider-indikator {
  margin-top: -24px !important;
  position: relative;
}



/* #########################################################
                        textTeaser                        */

.start_textTeaser {
  position: relative;
  padding-top: 12em;
  padding-bottom: 10em;
}

.start_textheadlines {
  position: relative;
  bottom: 17%;
  left: 5%;
}

h2.start_subline2 {
  text-transform: none;
  font-size: 22px;
  line-height: 25px;
  font-weight: bold;
  letter-spacing: 0.94px;
  margin: 0;
  padding: 0;
  margin-top: 7px;
}

p.start_subline3 {
  text-transform: none;
  font-size: 22px;
  font-weight: normal;
  letter-spacing: 0.94px;
  margin: 0;
  padding: 0;
}

.teasertext-start {
  font-size: 18px;
  line-height: 24px;
  margin: 0;
  padding: 0;
  margin-top: 15px;
}

.roundbutton-start-text {
  border: 2px solid;
  border-radius: 100px;
  padding: 10px 80px;
  margin: 41px 10px 0 0;
  display: inline-block;
  font-size: 17px;
  margin-top: 4em;
}

/* Für Medium Devices */
@media screen and (min-width: 641px) and (max-width: 960px) {}

/* Für Small Devices */
@media screen and (max-width: 640px) {

  .start_textTeaser {
    padding-top: 2em;
    padding-bottom: 2em;
  }

}



/* #########################################################
                 bildHeadlineTeaser                       */

.start_bildHeadlineTeaser {
  position: relative;
  padding-top: 12em;
  padding-bottom: 10em;
}

/* Für Medium Devices */
@media screen and (min-width: 641px) and (max-width: 960px) {}

/* Für Small Devices */
@media screen and (max-width: 640px) {
  .start_bildHeadlineTeaser {
    padding-top: 2em;
    padding-bottom: 2em;
  }
}



/* #########################################################
                     presenter                            */


.uk-width-medium400 {
  width: 400px;
}

.start-presentertext {
  font-size: 18px;
  line-height: 24px;
  margin: 0;
  /* padding: 0 6em 0 0; */
  margin-top: 15px;
}


.start-headlineTeaser {
  padding-top: 12em;
}

.Teaser4er {
  padding-bottom: 9em;
}

.headlineSlider {
  padding-top: 8em;
}

.carousel {
  padding-bottom: 8em;
  padding-top: 2em;
}

/* Für Medium Devices */
@media screen and (min-width: 641px) and (max-width: 960px) {}

/* Für Small Devices */
@media screen and (max-width: 640px) {
  .start-headlineTeaser {
    padding-top: 2em;
  }

  .headlineSlider {
    padding-top: 2em;
  }

  .carousel {
    padding-bottom: 2em;
  }
}



/* presenter // */











/* #########################################################
                       stoerer circle                     */

.kreis {
  padding: 0;
}

.circle {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50vw;
  height: 50vw;
  border-radius: 50%;
  background-color: #E2361F;
  overflow: hidden;
  margin-top: 10em;
  margin-bottom: 10em !important;
}

.square {
  width: 65%;
  height: 65%;
  background-color: transparent;
  margin-top: 4vw;
}

.square h1 {
  font-size: 5.3vw;
  line-height: 5.4vw;
}

.square p.text {
  font-size: 1.3vw;
  line-height: 1.9vw;
}

div.m_stoerer a.roundbutton-start {
  margin-top: 0.8vw;
  margin-bottom: 1.2vw;
  padding: 10px 40px;
}

.roundbutton-start .m_stoerer_inside {}

.roundbutton-start.m_stoerer_outside {
  margin: 0;
  margin-bottom: 10em !important;
}

/* Für Medium Devices */
@media screen and (min-width: 641px) and (max-width: 960px) {

  /* stoerer anpassung */
  .circle {
    width: 65vw;
    height: 65vw;
    margin-top: 12vw;
    margin-bottom: 8vw !important;
  }

  .square {
    width: 65%;
    height: 65%;
    background-color: transparent;
    margin-top: 4vw;
  }

  .square h1 {
    font-size: 7vw;
    line-height: 7vw;
  }

  .square p.text {
    font-size: 1.9vw;
    line-height: 2.4vw;
  }

  div.m_stoerer a.roundbutton-start {
    margin-top: 0.8vw;
    margin-bottom: 1.2vw;
  }

  /* stoerer anpassung // */

}

/* Für Small Devices */
@media screen and (max-width: 640px) {

  /* stoerer anpassung */
  .circle {
    width: 90vw;
    height: 90vw;
    margin-top: 2em;
    margin-bottom: 2em !important;
  }

  .roundbutton-start.m_stoerer_outside {
    margin: 0;
    margin-bottom: 0em !important;
  }

  .square {
    width: 65%;
    height: 65%;
    background-color: transparent;
    margin-top: 0vw;
  }

  .square h1 {
    font-size: 8vw;
    line-height: 8vw;
  }

  .square p.text {
    font-size: 3.5vw;
    line-height: 4.5vw;
  }

  div.m_stoerer a.roundbutton-start {
    margin-top: 0.8vw;
    margin-bottom: 1.2vw;
  }

  /* stoerer anpassung // */

}







/* #########################################################
               4er Teaser m_headline4erTeaser             */

.header4erTeaser {
  position: absolute;
  bottom: 2rem;
  left: 1rem;

}

.header4erTeaser h3 {

  font-size: 18px;
  line-height: 23px;
  text-transform: uppercase;
  font-weight: bold;
}

div.header4erTeaser h3 {
  color: white;
}

.spacer {
  display: block;
  height: 1em;
  width: 100%;
}

/* Für Medium Devices */
@media screen and (min-width: 641px) and (max-width: 960px) {

  div.header4erTeaser h3 {
    font-size: 4vw !important;
    line-height: 4vw !important;
  }

}

/* Für Small Devices */
@media screen and (max-width: 640px) {

  .header4erTeaser {
    position: absolute;
    bottom: 5px;
    left: 5px;
  }

  div.header4erTeaser h3 {
    font-size: 12px !important;
    line-height: 14px !important;
    text-transform: uppercase;
    font-weight: bold;
    text-align: left;
  }

  .spacer {
    display: block;
    height: 1em;
    width: 100%;
  }

}

/* 4er Teaser // */








/* Filterebene */

.start_video {

 }


/* Für Medium Devices */
@media screen and (min-width: 641px) and (max-width: 960px) {

  .start_video {

  }

}

/* Für Small Devices */
@media screen and (max-width: 640px) {

  .start_video {
    margin-top: 60px;
  }

}





















/* Für Medium Devices */
@media screen and (min-width: 641px) and (max-width: 960px) {

  .round-no.showMobil {
    float: right;
  }

  div.mainmenu .roundbutton-nav {
    /*  display: none; */
  }


  .generiert div.unterseite-gross a h3, div.generiert div a h3, div.generiert div h3, .generiert div.unterseite-mittel a h3, div.generiert div a h3, .unterseite-gross h3, .unterseite-mittel h3, h3 {
    font-size: 5vw !important;
    line-height: 5.3vw !important;
    text-align: left !important;
  }

}


/* Für Small Devices */
@media screen and (max-width: 640px) {


  .generiert div.unterseite-gross a h3, div.generiert div a h3, div.generiert div h3, .generiert div.unterseite-mittel a h3, div.generiert div a h3, .unterseite-gross h3, .unterseite-mittel h3, h3 {
    font-size: 5vw !important;
    line-height: 5.3vw !important;
    text-align: center;
  }

  .uk-height-largePS {
    height: 200px;
    position: relative;
  }

  .bodyContent, div.img-image {
    margin-bottom: 0;
  }


  .round-no.showMobil {
    float: right;
  }


  .templatename {
    display: none;
  }



  /* tabbed NAV */

  li a.roundbutton-festival {
    width: 100%;
    display: initial;
    margin-bottom: 20px;
    color: black !important;
    border: 2px solid gray;
  }

  li.uk-active a.roundbutton-festival {
    color: white !important;
  }


  /* tabbed NAV // */



  /* event-liste ausstellungen */
  li.gruppe3:hover .event-text h3.event a {
    color: red !important;
  }


  .event-item {
    margin-bottom: 2em;
  }

  .event-text {
    padding: 0 10px;
    background-color: #f5f5f5;
  }

  .event_date {
    margin-bottom: 1em;
  }

  h3.event {
    text-align: left !important;
  }

  .round-label {
    background-color: #E2361F;
    height: 60px;
    width: 60px;
    position: relative;
    display: block;
    text-align: center;
    color: white;
    border-radius: 100px;
    line-height: 60px;
    float: right;
    padding: 0;
    margin-top: -30px;
    font-weight: bold;
    box-sizing: border-box;
    font-size: 24px;
  }

  /* detailseite ausstellungen */

  div.carouselContainer {
    height: 100%;
  }

  p.kuenstlerinnenListe {
    margin-top: 1rem !important;
  }

  .vaDetailsHead {
    margin-bottom: 0 !important;
  }

  .vaDetailsHead+p {
    margin-top: 0;
  }


  /* eventliste / detailsseite // */

  /* unterseiten ausgabe */

  div.generiert {
    margin-top: 15px !important;
  }

  .img-image, .img-panorama, .img-carousel {
    margin-bottom: 15px;
  }


  .us-container {
    margin-bottom: 2em !important;
  }

  .us-container, .text-container {
    background-color: #f5f5f5;
  }

  .us-container.rund, .us-container.rund .text-container {
    background-color: transparent;
  }

  .us-container.rund p.teasertext {
    padding-bottom: 2em !important;
  }


  .text-container {
    padding: 0 10px;
  }

  .us-container a h3, .unterseite-gross .us-container .text-container a h3 {
    text-align: left !important;
  }


  .us-container>.text-container>p {
    text-align: left !important;
    padding-bottom: 1em;
  }

  /* slider anpassungen */
  .uk-dotnav>*>* {
    width: 10px;
    height: 10px;
    border: 2px solid;
  }

  figure.img-panorama figcaption {
    left: auto;
  }


  /* unterseiten ausgabe // */


}


















/* #################################################
                 FARBANPASSUNGEN                  */

/* Rot-Weiss */
section.Rot-Weiss {
  /* color: #E2361F !important; */
  background-color: white;
}

div.Rot-Weiss div div h1,
div.Rot-Weiss div div h2,
div.Rot-Weiss div h1,
div.Rot-Weiss div h2 {
  color: #E2361F !important;
  background-color: transparent !important;
}

section.Rot-Weiss div div a.roundbutton-start {
  color: #E2361F !important;
  border-color: #E2361F !important;
}

section.Rot-Weiss div div a.roundbutton-start:hover {
  color: black !important;
  border-color: black !important;
}

section.Rot-Weiss>.sectionHeadline h1 {
  color: #E2361F !important;
}

/* dotnav anpassungen */
ul.Rot-Weiss.uk-dotnav>*>* {
  background-color: #E2361F !important;
  border-color: #fff !important;
}

ul.Rot-Weiss.uk-dotnav>.uk-active>* {
  background-color: #E2361F !important;
  border-color: #E2361F !important;
}

ul.Rot-Weiss.uk-dotnav>*> :hover {
  background-color: #E2361F !important;
  border-color: #E2361F !important;
}




/* Lila-Rot */
section.Lila-Rot {
  /* color: #3C2E83 !important; */
  background-color: #E2361F;
}

div.Lila-Rot div div h1,
div.Lila-Rot div div h2,
div.Lila-Rot div h1,
div.Lila-Rot div h2,
div.Lila-Rot div p {
  color: #3C2E83 !important;
  background-color: transparent !important;
}

section.Lila-Rot div div a.roundbutton-start {
  color: #3C2E83 !important;
  border-color: #3C2E83 !important;
}

section.Lila-Rot div div a.roundbutton-start:hover {
  color: White !important;
  border-color: White !important;
}

section.Lila-Rot div.circle {
  background-color: white !important;
}

section.Lila-Rot>.sectionHeadline h1 {
  color: #3C2E83 !important;
}

/* dotnav anpassungen */
ul.Lila-Rot.uk-dotnav>*>* {
  background-color: #3C2E83 !important;
  border-color: #E2361F !important;
}

ul.Lila-Rot.uk-dotnav>.uk-active>* {
  background-color: #3C2E83 !important;
  border-color: #3C2E83 !important;
}

ul.Lila-Rot.uk-dotnav>*> :hover {
  background-color: #3C2E83 !important;
  border-color: #3C2E83 !important;
}






/* Lila-Weiss */
section.Lila-Weiss {
  /* color: #3C2E83 !important; */
  background-color: white;
}

div.Lila-Weiss div div h1,
div.Lila-Weiss div div h2,
div.Lila-Weiss div h1,
div.Lila-Weiss div h2,
div.Lila-Weiss div p {
  color: #3C2E83 !important;
  background-color: transparent !important;
}

section.Lila-Weiss div div a.roundbutton-start {
  color: #3C2E83 !important;
  border-color: #3C2E83 !important;
}

section.Lila-Weiss div div a.roundbutton-start:hover {
  color: black !important;
  border-color: black !important;
}

section.Lila-Weiss>.sectionHeadline h1 {
  color: #3C2E83 !important;
}



/* dotnav anpassungen */
ul.Lila-Weiss.uk-dotnav>*>* {
  background-color: #3C2E83 !important;
  border-color: #fff !important;
}

ul.Lila-Weiss.uk-dotnav>.uk-active>* {
  background-color: #3C2E83 !important;
  border-color: #3C2E83 !important;
}

ul.Lila-Weiss.uk-dotnav>*> :hover {
  background-color: #3C2E83 !important;
  border-color: #3C2E83 !important;
}



/* Weiss-Lila */
section.Weiss-Lila {
  /* color: white !important; */
  background-color: #3C2E83;
}

div.Weiss-Lila div div h1,
div.Weiss-Lila div div h2,
div.Weiss-Lila div h1,
div.Weiss-Lila div h2,
div.Weiss-Lila div p {
  color: white !important;
  background-color: transparent !important;
}

section.Weiss-Lila div div a.roundbutton-start {
  color: white !important;
  border-color: white !important;
}

section.Weiss-Lila div div a.roundbutton-start:hover {
  color: black !important;
  border-color: black !important;
}

section.Weiss-Lila>.sectionHeadline h1 {
  color: white !important;
}


/* dotnav anpassungen */
ul.Weiss-Lila.uk-dotnav>*>* {
  background-color: #fff !important;
  border-color: #3C2E83 !important;
}

ul.Weiss-Lila.uk-dotnav>.uk-active>* {
  background-color: #fff !important;
  border-color: #fff !important;
}

ul.Weiss-Lila.uk-dotnav>*> :hover {
  background-color: #fff !important;
  border-color: #fff !important;
}

.m_presenterMitBildraster>.sectionHeadline h1 {
  color: white !important;
}




/* Schwarz-Gelb */
section.Schwarz-Gelb {
  /* color: black !important; */
  background-color: #FFF26E;
}

div.Schwarz-Gelb div div h1,
div.Schwarz-Gelb div div h2,
div.Schwarz-Gelb div h1,
div.Schwarz-Gelb div h2,
div.Schwarz-Gelb div p {
  color: black !important;
  background-color: transparent;
}

section.Schwarz-Gelb div div a.roundbutton-start {
  color: black !important;
  border-color: black !important;
}

section.Schwarz-Gelb div div a.roundbutton-start:hover {
  color: white !important;
  border-color: white !important;
}

section.Schwarz-Gelb>.sectionHeadline h1 {
  color: black !important;
}


/* dotnav anpassungen */
ul.Schwarz-Gelb.uk-dotnav>*>* {
  background-color: #000 !important;
  border-color: #FFF26E !important;
}

ul.Schwarz-Gelb.uk-dotnav>.uk-active>* {
  background-color: #000 !important;
  border-color: #000 !important;
}

ul.Schwarz-Gelb.uk-dotnav>*> :hover {
  background-color: #000 !important;
  border-color: #000 !important;
}




/* Gelb-Weiss */
section.Gelb-Weiss {
  /* color: black !important; */
  background-color: white;
}

div.Gelb-Weiss div div h1,
div.Gelb-Weiss div div h2,
div.Gelb-Weiss div h1,
div.Gelb-Weiss div h2,
div.Gelb-Weiss div p {
  color: #FFF26E !important;
  background-color: transparent;
}

section.Gelb-Weiss div div a.roundbutton-start {
  color: #FFF26E !important;
  border-color: #FFF26E !important;
}

section.Gelb-Weiss div div a.roundbutton-start:hover {
  color: white !important;
  border-color: white !important;
}

section.Gelb-Weiss>.sectionHeadline h1 {
  color: #FFF26E !important;
}

/* dotnav anpassungen */
ul.Gelb-Weiss.uk-dotnav>*>* {
  background-color: #FFF26E !important;
  border-color: #fff !important;
}

ul.Gelb-Weiss.uk-dotnav>.uk-active>* {
  background-color: #FFF26E !important;
  border-color: #FFF26E !important;
}

ul.Gelb-Weiss.uk-dotnav>*> :hover {
  background-color: #FFF26E !important;
  border-color: #FFF26E !important;
}



/* Türkis-Weiss */
section.Tuerkis-Weiss {
  /* color: black !important; */
  background-color: White;
}

div.Tuerkis-Weiss div div h1,
div.Tuerkis-Weiss div div h2,
div.Tuerkis-Weiss div h1,
div.Tuerkis-Weiss div h2,
div.Tuerkis-Weiss div p {
  color: #7DC6AC !important;
  background-color: transparent;
}

section.Tuerkis-Weiss div div a.roundbutton-start {
  color: #7DC6AC !important;
  border-color: #7DC6AC !important;
}

section.Tuerkis-Weiss div div a.roundbutton-start:hover {
  color: black !important;
  border-color: black !important;
}

section.Tuerkis-Weiss>.sectionHeadline h1 {
  color: #7DC6AC !important;
}

/* dotnav anpassungen */
ul.Tuerkis-Weiss.uk-dotnav>*>* {
  background-color: #7DC6AC !important;
  border-color: #fff !important;
}

ul.Tuerkis-Weiss.uk-dotnav>.uk-active>* {
  background-color: #7DC6AC !important;
  border-color: #7DC6AC !important;
}

ul.Tuerkis-Weiss.uk-dotnav>*> :hover {
  background-color: #7DC6AC !important;
  border-color: #7DC6AC !important;
}


/* Lachs-Weiss */
section.Lachs-Weiss {
  /* color: black !important; */
  background-color: White;
}

div.Lachs-Weiss div div h1,
div.Lachs-Weiss div div h2,
div.Lachs-Weiss div h1,
div.Lachs-Weiss div h2,
div.Lachs-Weiss div p {
  color: #ED735d !important;
  background-color: transparent;
}

section.Lachs-Weiss div div a.roundbutton-start {
  color: #ED735d !important;
  border-color: #ED735d !important;
}

section.Lachs-Weiss div div a.roundbutton-start:hover {
  color: black !important;
  border-color: black !important;
}

section.Lachs-Weiss>.sectionHeadline h1 {
  color: #ED735d !important;
}

/* dotnav anpassungen */
ul.Lachs-Weiss.uk-dotnav>*>* {
  background-color: #ED735d !important;
  border-color: #fff !important;
}

ul.Lachs-Weiss.uk-dotnav>.uk-active>* {
  background-color: #ED735d !important;
  border-color: #ED735d !important;
}

ul.Lachs-Weiss.uk-dotnav>*> :hover {
  background-color: #ED735d !important;
  border-color: #ED735d !important;
}



/* Schwarz-Grau */
section.Schwarz-Grau {
  /* color: black !important; */
  background-color: #D3D3D3;
}

div.Schwarz-Grau div div h1,
div.Schwarz-Grau div div h2,
div.Schwarz-Grau div h1,
div.Schwarz-Grau div h2,
div.Schwarz-Grau div p {
  color: black;
}

section div.Schwarz-Grau div a.roundbutton-start {
  color: black !important;
  border-color: black !important;
}

section.Schwarz-Grau div div a.roundbutton-start:hover {
  color: white !important;
  border-color: white !important;
}

section.Schwarz-Grau>.sectionHeadline h1 {
  color: black !important;
}

/* dotnav anpassungen */
ul.Schwarz-Grau.uk-dotnav>*>* {
  background-color: #000 !important;
  border-color: #D3D3D3 !important;
}

ul.Schwarz-Grau.uk-dotnav>.uk-active>* {
  background-color: #000 !important;
  border-color: #000 !important;
}

ul.Schwarz-Grau.uk-dotnav>*> :hover {
  background-color: #000 !important;
  border-color: #000 !important;
}




/* Schwarz-Weiss */
section.Schwarz-Weiss {
  /* color: black !important; */
  background-color: white;
}

div.Schwarz-Weiss div div h1,
div.Schwarz-Weiss div div h2,
div.Schwarz-Weiss div h1,
div.Schwarz-Weiss div h2,
div.Schwarz-Weiss div p {
  color: black;
}

section div.Schwarz-Weiss div a.roundbutton-start {
  color: black !important;
  border-color: black !important;
}

section.Schwarz-Weiss div div a.roundbutton-start:hover {
  color: #E2361F !important;
  border-color: #E2361F !important;
}

section.Schwarz-Weiss>.sectionHeadline h1 {
  color: black !important;
}



/* dotnav anpassungen */
ul.Schwarz-Weiss.uk-dotnav>*>* {
  background-color: #000 !important;
  border-color: #fff !important;
}

ul.Schwarz-Weiss.uk-dotnav>.uk-active>* {
  background-color: #000 !important;
  border-color: #000 !important;
}

ul.Schwarz-Weiss.uk-dotnav>*> :hover {
  background-color: #000 !important;
  border-color: #000 !important;
}



/* Weiss-Schwarz */
section.Weiss-Schwarz {
  /* color: white !important; */
  background-color: black;
}

div.Weiss-Schwarz div div h1,
div.Weiss-Schwarz div div h2,
div.Weiss-Schwarz div h1,
div.Weiss-Schwarz div h2,
div.Weiss-Schwarz div p {
  color: white !important;
  background-color: transparent;
}

section.Weiss-Schwarz div div a.roundbutton-start {
  color: white !important;
  border-color: white !important;
}

section.Weiss-Schwarz div div a.roundbutton-start:hover {
  color: #E2361F !important;
  border-color: #E2361F !important;
}

section.Weiss-Schwarz>.sectionHeadline h1 {
  color: white !important;
}


/* dotnav anpassungen */
ul.Weiss-Schwarz.uk-dotnav>*>* {
  background-color: #fff !important;
  border-color: #000 !important;
}

ul.Weiss-Schwarz.uk-dotnav>.uk-active>* {
  background-color: #fff !important;
  border-color: #fff !important;
}

ul.Weiss-Schwarz.uk-dotnav>*> :hover {
  background-color: #fff !important;
  border-color: #fff !important;
}


/* #################################################
                 FARBANPASSUNGEN //               */