
/* stand-up-participate.de
------------------------------------------------ */



/* inter
------------------------------------------------ */

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  src: url(../fonts/inter-300-light.woff2) format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 300;
  src: url(../fonts/inter-300-light-italic.woff2) format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  src: url(../fonts/inter-600-semibold.woff2) format('woff2');
}



/* color
------------------------------------------------ */

:root {
  --white: rgb(255, 255, 255);
  --gray-light: rgb(170, 170, 170);
  --gray-medium: rgb(85, 85, 85);
  --gray-heavy: rgb(0, 0, 0);
  --yellow: rgb(255, 204, 0);
}



/* basics
------------------------------------------------ */

*,
*::before,
*::after {
  box-sizing: border-box;
}

* {
  margin: 0;
  padding: 0; /* lists */
}

html {
  font-size: 100%; /* rem */
  -webkit-text-size-adjust: none;
  -moz-text-size-adjust: none;
  text-size-adjust: none;
  scroll-behavior: smooth;
}

body {
  font-family: 'Inter', sans-serif;
  line-height: 1.75; /* 28 */
}

img, video, audio {
  display: block;
  width: 100%;
}



/* font
------------------------------------------------ */

body {
  font-weight: 300;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 600;
}

strong {
  font-weight: 600;
}

h1, h2 {
  word-break: break-word;
}

p  {
  word-break: break-word;
}



/* font
------------------------------------------------ */

h1 {
  font-size: 2.25rem; /* 36 */
  line-height: 1.167; /* 42 */
}

h2 {
  font-size: 1.5625rem; /* 25 */
  line-height: 1.4; /* 35 */
}

h3, h4, h5, h6 {
  font-size: 1.25rem; /* 20 */
  line-height: 1.4; /* 28 */
}

@media screen and (min-width: 48em) { /* 768 */
 h1 {
    font-size: 3.75rem; /* 60 */
    line-height: 1.167; /* 70 */
  }
 h2 {
    font-size: 2.25rem; /* 36 */
    line-height: 1.167; /* 42 */
  }
}



/* margin
------------------------------------------------ */

h1, h2, h3, h4, h5, h6 {
  margin: 1.75rem 0; /* 28 */
}

figure, dl, ol, ul, p, pre {
  margin: 0.875rem 0; /* 14 */
}

figcaption {
  margin: 0.875rem 0; /* 14 */
}

.feed figcaption {
  margin: 1.75rem 0; /* 28 */
}



/* lists
------------------------------------------------ */

ul {
  list-style: none;
}

.copy-column ul,
.topics-item ul {
  padding: 0 0 0 2.625rem;
  list-style: "\2014\0020";
}

.copy-column ol,
.topics-item ol {
  padding: 0 0 0 2.625rem;
}

.copy-column li,
.topics-item li {
  margin: .4375rem 0;
}



/* rule
------------------------------------------------ */

hr {
  border: none;
  border-top: 1px solid var(--gray-medium);
}



/* focus
------------------------------------------------ */

*:focus:not(:focus-visible) {
  outline: none;
}

*:focus-visible {
  outline: 4px solid var(--gray-light);
  outline-offset: .21875rem; /* 3.5 */
}



/* links
------------------------------------------------ */

a {
  color: currentcolor;
  text-decoration: underline;
}

.header-menu a,
.pagination-menu a,
.block-headline a,
.block-featured a,
.block-related a,
.footer-contents a {
  text-decoration: none;
}

.header-menu a:hover,
.footer-contents a:hover {
  text-decoration: underline;
}



/* layout
------------------------------------------------ */

.header {
  padding: 0.875rem 0;
}

.main,
.main > * {
  padding: 1.75rem 0;
}

.footer {
  padding: 0.875rem 0;
  background: var(--yellow);
}



/* block-audios (div)
------------------------------------------------ */

.audios-columns {
  display: flex;
  flex-wrap: wrap;
  padding: 0;
}

.audios-column {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) { /* 768 */
  .audios-columns {
    padding: 0 1.75rem;
  }
}

@media screen and (min-width: 60em) { /* 960 */
  .audios-columns {
    padding: 0 calc(50% - 25rem) 0; /* 1.2 */
  }
}

/* block-copy (div)
------------------------------------------------ */

.copy-column {
  padding: 0;
}

.copy-column .column-text {
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) { /* 768 */
  .copy-column {
    padding: 0 1.75rem;
  }
}

@media screen and (min-width: 60em) { /* 960 */
  .copy-column {
    padding: 0 calc(50% - 25rem) 0; /* 1.2 */
  }
}

/* block-featured (div)
------------------------------------------------ */

.featured-column {
  display: flex;
  flex-wrap: wrap;
  padding: 0;
}

.featured-column .column-media,
.featured-column .column-text {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) { /* 768 */
  .featured-column {
    padding: 0 1.75rem;
  }
}

@media screen and (min-width: 84em) { /* 1344 */
  .featured-column {
    padding: 0 calc(50% - 36rem) 0;
  }
}

@media screen and (min-width: 48em) { /* 768 */
  .featured-column .column-media,
  .featured-column .column-text {
    flex-basis: 50%;
  }
}

.block-featured {
  position: relative;
}

.block-featured a::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}

/* block-gotop (div)
------------------------------------------------ */

.gotop-column {
  padding: 0;
}

.gotop-column .column-text {
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) { /* 768 */
  .gotop-column {
    padding: 0 1.75rem;
  }
}

@media screen and (min-width: 60em) { /* 960 */
  .gotop-column {
    padding: 0 calc(50% - 25rem) 0; /* 1.2 */
  }
}

/* block-heading (div)
------------------------------------------------ */

.heading-column {
  padding: 0;
}

.heading-column .column-text {
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) { /* 768 */
  .heading-column {
    padding: 0 1.75rem;
  }
}

@media screen and (min-width: 60em) { /* 960 */
  .heading-column {
    padding: 0 calc(50% - 25rem) 0; /* 1.2 */
  }
}

/* block-headline (div)
------------------------------------------------ */

.headline-column {
  padding: 0;
}

.headline-column .column-text {
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) { /* 768 */
  .headline-column {
    padding: 0 1.75rem;
  }
}

@media screen and (min-width: 60em) { /* 960 */
  .headline-column {
    padding: 0 calc(50% - 25rem) 0; /* 1.2 */
  }
}

/* block-heroes (div)
------------------------------------------------ */

.heroes-columns figure {
  margin: 0; /* figure reset */
}

.heroes-columns {
  display: flex;
  flex-wrap: wrap;
  padding: 0;
}

.heroes-column {
  flex-basis: 100%;
  padding: 0.21875rem 0.21875rem;
}

@media screen and (min-width: 84em) { /* 1344 */
  .heroes-columns {
    padding: 0 calc(50% - 35rem) 0; /* 1.2 */
  }
}

@media screen and (min-width: 48em) { /* 768 */
  .heroes-column--medium {
    flex-basis: 50%;
  }
}

.heroes-column figure {
  position: relative;
}

.heroes-column figcaption {
  position: absolute;
  bottom: 0;
  right: 0;
  background: var(--white);
  padding: 0 0.4375rem;
}

/* block-images (div)
------------------------------------------------ */

.images-columns figure {
  margin: 0; /* figure reset */
}

.images-columns {
  display: flex;
  flex-wrap: wrap;
  padding: 0;
}

.images-column {
  flex-basis: 100%;
  padding: 0.875rem 1.75rem;
}

@media screen and (min-width: 48em) { /* 768 */
  .images-columns {
    padding: 0 1.75rem;
  }
}

@media screen and (min-width: 60em) { /* 960 */
  .images-columns {
    padding: 0 calc(50% - 25rem) 0; /* 1.2 */
  }
}

@media screen and (min-width: 48em) { /* 768 */
  .images-column--medium {
    flex-basis: 50%;
  }
}

/* block-onpage (div)
------------------------------------------------ */

.onpage-list {
  padding: 0;
}

.onpage-list .onpage-item {
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) { /* 768 */
  .onpage-list {
    padding: 0 1.75rem;
  }
}

@media screen and (min-width: 60em) { /* 960 */
  .onpage-list {
    padding: 0 calc(50% - 25rem) 0; /* 1.2 */
  }
}

/* block-pagination (div)
------------------------------------------------ */

.pagination-menu {
  display: flex;
  flex-wrap: wrap;
  padding: 0;
}

.pagination-menu .menu-link {
  flex-basis: 50%;
  padding: 0 1.75rem;
}

.pagination-menu .menu-link--prev {
  text-align: right;
}

@media screen and (min-width: 48em) { /* 768 */
  .pagination-menu {
    padding: 0 1.75rem;
  }
}

@media screen and (min-width: 84em) { /* 1344 */
  .pagination-menu {
    padding: 0 calc(50% - 35rem) 0; /* 1.2 */
  }
}

/* block-partners (ul)
------------------------------------------------ */

.partners-list {
  display: flex;
  flex-wrap: wrap;
  margin: 0; /* ul reset */
  padding: 0;
}

.partners-item {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) { /* 768 */
  .partners-list {
    padding: 0 1.75rem;
  }
}

@media screen and (min-width: 60em) { /* 960 */
  .partners-list {
    padding: 0 calc(50% - 25rem) 0; /* 1.2 */
  }
}

@media screen and (min-width: 36em) { /* 576 */
  .partners-item {
    flex-basis: 50%;
  }
}

/* block-persons (div)
------------------------------------------------ */

.persons-columns {
  display: flex;
  flex-wrap: wrap;
  padding: 0;
}

.persons-column {
  flex-basis: 100%;
  padding: 1.75rem 1.75rem;
}

@media screen and (min-width: 48em) { /* 768 */
  .persons-columns {
    padding: 0 1.75rem;
  }
}

@media screen and (min-width: 60em) { /* 960 */
  .persons-columns {
    padding: 0 calc(50% - 25rem) 0; /* 1.2 */
  }
}

@media screen and (min-width: 48em) { /* 768 */
  .persons-column {
    flex-basis: 50%;
  }
}

.persons-column figure {
  position: relative;
}

.persons-column figcaption {
  position: absolute;
  bottom: 0;
  right: 0;
  background: var(--white);
  padding: 0 0.4375rem;
}

/* block-publication (div)
------------------------------------------------ */

.publication-column {
  display: flex;
  flex-wrap: wrap;
  padding: 0;
}

.publication-column > * {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) { /* 768 */
  .publication-column {
    padding: 0 1.75rem;
  }
}

@media screen and (min-width: 60em) { /* 960 */
  .publication-column {
    padding: 0 calc(50% - 25rem) 0; /* 1.2 */
  }
}

@media screen and (min-width: 48em) { /* 768 */
  .publication-column > * {
    flex-basis: 50%;
  }
}

/* block-reels (div)
------------------------------------------------ */

.reels-columns figure {
  margin: 0; /* figure reset */
}

.reels-columns {
  display: flex;
  flex-wrap: wrap;
  padding: 0;
}

.reels-column {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

@media screen and (min-width: 36em) { /* 576 */
  .reels-columns {
    padding: 0 calc(50% - 15rem) 0; /* 1.2 */
  }
}

/* block-related (div)
------------------------------------------------ */

.related-column {
  display: flex;
  flex-wrap: wrap;
  padding: 1.75rem 0;
}

.related-column .column-media,
.related-column .column-text {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) { /* 768 */
  .related-column {
    padding: 0 1.75rem;
  }
}

@media screen and (min-width: 84em) { /* 1344 */
  .related-column {
    padding: 0 calc(50% - 35rem) 0; /* 1.2 */
  }
}

@media screen and (min-width: 48em) { /* 768 */
  .related-column .column-media {
    flex-basis: 50%;
    order: 2;
  }
  .related-column .column-text {
    flex-basis: 50%;
    order: 1;
  }
}

/* block-reviews (ul)
------------------------------------------------ */

.reviews-list {
  display: flex;
  flex-wrap: wrap;
  margin: 0; /* ul reset */
  padding: 0;
}

.reviews-item {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) { /* 768 */
  .reviews-list {
    padding: 0 1.75rem;
  }
}

@media screen and (min-width: 60em) { /* 960 */
  .reviews-list {
    padding: 0 calc(50% - 25rem) 0; /* 1.2 */
  }
}

@media screen and (min-width: 48em) { /* 768 */
  .reviews-item {
    flex-basis: 50%;
  }
}

/* block-topics
------------------------------------------------ */

.topics-columns {
  display: flex;
  flex-wrap: wrap;
  padding: 0;
}

.topics-column {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) { /* 768 */
  .topics-columns {
    padding: 0 1.75rem;
  }
}

@media screen and (min-width: 60em) { /* 960 */
  .topics-columns {
    padding: 0 calc(50% - 25rem) 0; /* 1.2 */
  }
}

@media screen and (min-width: 48em) { /* 768 */
  .topics-column {
    flex-basis: 50%;
  }
}

/* block-trainings (div)
------------------------------------------------ */

.trainings-columns {
  display: flex;
  flex-wrap: wrap;
  margin: 0; /* ul reset */
  padding: 0;
}

.trainings-column {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) { /* 768 */
  .trainings-columns {
    padding: 0 1.75rem;
  }
}

@media screen and (min-width: 60em) { /* 960 */
  .trainings-columns {
    padding: 0 calc(50% - 25rem) 0; /* 1.2 */
  }
}

/* block-videos (div)
------------------------------------------------ */

.videos-columns figure {
  margin: 0; /* figure reset */
}

.videos-columns {
  display: flex;
  flex-wrap: wrap;
  padding: 0;
}

.videos-column {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

@media screen and (min-width: 48em) { /* 768 */
  .videos-columns {
    padding: 0 1.75rem;
  }
}

@media screen and (min-width: 60em) { /* 960 */
  .videos-columns {
    padding: 0 calc(50% - 25rem) 0; /* 1.2 */
  }
}



/* site-header
------------------------------------------------ */

.site-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding: 0;
}

.header-identity,
.header-menu {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

.header-identity img {
  max-width: 12.5rem; /* 16 - (2 * 1.75) */
}

.menu-list {
  margin: 0; /* ul reset */
}

.menu-item {
  display: inline-block;
  margin: 0 0.875rem 0 0;
}

@media screen and (min-width: 48em) { /* 768 */
  .site-header {
    padding: 0 1.75rem;
  }
  .header-identity {
    flex-basis: 33.333%; /* 16 */
  }
  .header-menu {
    flex-basis: 66.667%; /* 32 */
  }
}

@media screen and (min-width: 48em) { /* 768 */
  .menu-list {
    text-align: right;
  }
  .menu-item {
    margin: 0 0 0 0.875rem;
  }
}

@media screen and (min-width: 84em) { /* 1344 */
  .site-header {
    padding: 0 calc(50% - 35rem) 0; /* 1.2 */
  }
}

/* site-footer
------------------------------------------------ */

.site-footer {
  display: flex;
  flex-wrap: wrap;
  padding: 1.75rem 0;
}

.footer-contents,
.footer-social {
  flex-basis: 100%;
  padding: 0 1.75rem;
}

.footer-contents img {
  max-width: 20.5rem; /* 24 - (2 * 1.75) */
}

.social-list {
  margin: 0;  /* ul reset */
}

.social-item {
  display: inline-block;
  width: 2.625rem;
  margin: 0 0.875rem 0 0;
}

@media screen and (min-width: 48em) { /* 768 */
  .site-footer {
    padding: 0 1.75rem;
  }
}

@media screen and (min-width: 84em) { /* 1344 */
  .site-footer {
    padding: 0 calc(50% - 35rem) 0; /* 1.2 */
  }
}

@media screen and (min-width: 48em) { /* 768 */
  .footer-contents {
    flex-basis: 50%; /* 24 */
  }
}
