
/* Mobile  */
@media only screen and (max-width: 600px) {
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */



/* Variablen */
:root {
  --unit: calc(12px + (15 - 12) * ((100vw - 300px) / (600 - 300)));

  --font-size-small: var(--unit);
  --font-size-normal: calc(var(--unit) * 1.25);
  --font-size-big: calc(var(--unit) * 1.5);

  --button-height: calc(var(--unit) * 2.5);
  --subpage-height: calc(var(--button-height) * 2);


  --padding-small: calc(var(--unit));
  --padding-normal: calc(var(--font-size-small) * 2);
  --padding-medium: calc(var(--unit) * 4 );
  --padding-big: calc(var(--unit) * 6);
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Klassen */

/* Typografie */
.type-small, .type-small p
{
  font-family: var(--font-family);
  font-size: var(--font-size-small);
  line-height: 1.35;
  letter-spacing: 0.01em;
}
.type-normal, .type-normal p, .type-normal li
{
  font-family: var(--font-family);
  font-size: var(--font-size-normal);
  line-height: 1.35;
  letter-spacing: 0;
}
.type-big
{
  font-family: var(--font-family);
  font-size: var(--font-size-big);
  letter-spacing: -0.01em;
  line-height: 1.25;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Startseite */
.startmoment{
  height: 75vh;
}

.startmoment-logo{
  grid-column: 1 / -1; 
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Hauptseite */
.main-block{
  grid-template-columns: repeat(4, 1fr);
  gap: var(--padding-small);
}
.main-block-text{
  grid-column: 1 / -1; 
}
.main-block-header{
  grid-column: 1 / -1; 
}

/* Link Hauptseite */

/* Link Unterseite */
.link-subpage-link{
  grid-column: 1 / -1; 
}

/* Downloads */
.downloads-list-title{
}
.downloads-list-container{
  grid-column: 1 / -1; 
}
.downloads-list{
}
.downloads-list-link{
  grid-template-columns: repeat(2, 1fr);
}


/* Verbände */
.verbaende{
}
.verbaende-list-title{
}
.verbaende-list-container{
  grid-column: 1 / -1; 
}
.verbaende-list{
}
.verbaende-list-link{
}


/* Verein des Monats */
.main-block.verein{
}
.verein-link{
}
.article-swiper{
}
.article-swiper .swiper-slide{
  width: calc((100vw - var(--padding-small) * 2 - var(--padding-small)) / 8 * 7);
}
.js-media-touch .article-swiper .swiper-button-next,
.js-media-touch .article-swiper .swiper-button-prev
{
  display: none !important;
}



/* Veranstaltung */
.event-preview-block{
  grid-column: 1 / -1; 
}
.event-preview-state{
  grid-column: 1 / -1; 
}
.event-preview-text{
  grid-template-columns: repeat(4, 1fr);
 } 
.event-preview-text > *{
  /* padding: var(--padding-small); */
}
.event-preview-date{
  grid-column: 1 / span 2;
  order: 1;
}
.event-preview-title{
  grid-column: 1 / -1; 
  order: 3;
  padding-bottom: var(--padding-small);
}
.event-preview-place + .event-preview-lead{
  padding-top: 0;
}
.event-preview-place{
  grid-column: 3 / span 2;
  order: 2;
}
.event-preview-lead{
  padding: var(--padding-small);
  grid-column: 1 / -1; 
  order: 5;
}
.event-preview-image{
  grid-column: 1 / -1; 
  max-height: 50vh;
  order: 4;
}  


/* Liste */
.main-block-list{
  grid-column: 1 / -1; 
}

/* Personenliste */
.person-container{
  grid-column: span 4;
  display: flex;
  flex-direction: column;
}
.person-role{
  position: relative;
  display: block flex;
  align-items: center;
  padding: var(--padding-small);
}
.person-item{
  display: flex;
  flex-direction: column;
  border-radius: var(--border-radius);
  background-color: var(--color-button);
}
.person-name{
  padding: var(--padding-small);
  text-align: center;
}
.person-beschrieb{
  padding: var(--padding-small);
  padding-top: 0;
}
.person-liste .list-link{
  padding-left: var(--padding-small);
  padding-right: var(--button-height);
}
.person-liste .list-item {
  border-top: var(--border-weight) solid var(--color-white);
}
.personenliste-hidden{
  grid-column: 1 / -1;
}
.personenliste-hidden-grid{
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--padding-small);
  /* padding: 0 var(--padding-small); */
}






/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Overlay / Fragment */
#overlay.fragment-open{
  grid-template-columns: repeat(2, 1fr);
}
#overlay-container{
  grid-column: 1 / -1;
}

/* Artikel */

.article-text,
.overlay-big .article-text,
.article-list,
.overlay-big .article-list
{
  grid-template-columns: repeat(6, 1fr);
}
.article-text p,
.article-text ul,
.article-list .matrix-list,
.overlay-big .article-list .matrix-list,
.overlay-big p.ck-frage,
.overlay-big .article-text p,
.overlay-big .article-text ul,
.page-impressum .impressum-text p
{
  grid-column: 1 / -1;
}
.article-image.article-image-small,
.article-image.article-image-medium,
.article-image.article-image-small-center,
.page-impressum .impressum-text
{
  grid-template-columns: 1fr;
}
.article-image.article-image-medium .article-image-inner,
.article-image.article-image-small-center .article-image-inner
{
  grid-column: 1 / -1;
}

/* grosser Overlay */
.overlay-big .article-title{
  max-width: 100%;
  margin-left: 0; margin-right: 0%;
}
.overlay-big p.ck-antwort{
  grid-column: 2 / -1;
}
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

}
