:root {
  --orange: #F08328;
  --gelb: #ffd201;
  --dunkles_grau: #323232;
  --hintergrundsgrau: #E9E9E9;
  /* --hintergrundsgrau: #FFFFFF; */

  --font-asap: 'Asap';
  --font-asap-condensed: 'Asap_Condensed';
}

* {
  margin: 0;
  box-sizing: border-box;
}

body {
  background-color: var(--hintergrundsgrau);
  overflow-x: hidden;
}


/* FONTS -----------------------------------------------*/

/* averia-serif-libre-300 - latin */
@font-face {
  font-family: 'Averia Serif Libre';
  font-style: normal;
  font-weight: 300;
  src: url('/wp-content/themes/stopmutilation/assets/fonts/averia-serif-libre-v16-latin-300.eot');
  /* IE9 Compat Modes */
  src: local(''),
    url('/wp-content/themes/stopmutilation/assets/fonts/averia-serif-libre-v16-latin-300.eot?#iefix') format('embedded-opentype'),
    /* IE6-IE8 */
    url('/wp-content/themes/stopmutilation/assets/fonts/averia-serif-libre-v16-latin-300.woff2') format('woff2'),
    /* Super Modern Browsers */
    url('/wp-content/themes/stopmutilation/assets/fonts/averia-serif-libre-v16-latin-300.woff') format('woff'),
    /* Modern Browsers */
    url('/wp-content/themes/stopmutilation/assets/fonts/averia-serif-libre-v16-latin-300.ttf') format('truetype'),
    /* Safari, Android, iOS */
    url('/wp-content/themes/stopmutilation/assets/fonts/averia-serif-libre-v16-latin-300.svg#AveriaSerifLibre') format('svg');
  /* Legacy iOS */
}

/* averia-serif-libre-regular - latin */
@font-face {
  font-family: 'Averia Serif Libre';
  font-style: normal;
  font-weight: 400;
  src: url('/wp-content/themes/stopmutilation/assets/fonts/averia-serif-libre-v16-latin-regular.eot');
  /* IE9 Compat Modes */
  src: local(''),
    url('/wp-content/themes/stopmutilation/assets/fonts/averia-serif-libre-v16-latin-regular.eot?#iefix') format('embedded-opentype'),
    /* IE6-IE8 */
    url('/wp-content/themes/stopmutilation/assets/fonts/averia-serif-libre-v16-latin-regular.woff2') format('woff2'),
    /* Super Modern Browsers */
    url('/wp-content/themes/stopmutilation/assets/fonts/averia-serif-libre-v16-latin-regular.woff') format('woff'),
    /* Modern Browsers */
    url('/wp-content/themes/stopmutilation/assets/fonts/averia-serif-libre-v16-latin-regular.ttf') format('truetype'),
    /* Safari, Android, iOS */
    url('/wp-content/themes/stopmutilation/assets/fonts/averia-serif-libre-v16-latin-regular.svg#AveriaSerifLibre') format('svg');
  /* Legacy iOS */
}

/* averia-serif-libre-700 - latin */
@font-face {
  font-family: 'Averia Serif Libre';
  font-style: normal;
  font-weight: 700;
  src: url('/wp-content/themes/stopmutilation/assets/fonts/averia-serif-libre-v16-latin-700.eot');
  /* IE9 Compat Modes */
  src: local(''),
    url('/wp-content/themes/stopmutilation/assets/fonts/averia-serif-libre-v16-latin-700.eot?#iefix') format('embedded-opentype'),
    /* IE6-IE8 */
    url('/wp-content/themes/stopmutilation/assets/fonts/averia-serif-libre-v16-latin-700.woff2') format('woff2'),
    /* Super Modern Browsers */
    url('/wp-content/themes/stopmutilation/assets/fonts/averia-serif-libre-v16-latin-700.woff') format('woff'),
    /* Modern Browsers */
    url('/wp-content/themes/stopmutilation/assets/fonts/averia-serif-libre-v16-latin-700.ttf') format('truetype'),
    /* Safari, Android, iOS */
    url('/wp-content/themes/stopmutilation/assets/fonts/averia-serif-libre-v16-latin-700.svg#AveriaSerifLibre') format('svg');
  /* Legacy iOS */
}

/* open-sans-regular - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-regular.eot');
  /* IE9 Compat Modes */
  src: local(''),
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-regular.eot?#iefix') format('embedded-opentype'),
    /* IE6-IE8 */
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-regular.woff2') format('woff2'),
    /* Super Modern Browsers */
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-regular.woff') format('woff'),
    /* Modern Browsers */
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-regular.ttf') format('truetype'),
    /* Safari, Android, iOS */
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-regular.svg#OpenSans') format('svg');
  /* Legacy iOS */
}

/* open-sans-500 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 500;
  src: url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-500.eot');
  /* IE9 Compat Modes */
  src: local(''),
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-500.eot?#iefix') format('embedded-opentype'),
    /* IE6-IE8 */
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-500.woff2') format('woff2'),
    /* Super Modern Browsers */
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-500.woff') format('woff'),
    /* Modern Browsers */
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-500.ttf') format('truetype'),
    /* Safari, Android, iOS */
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-500.svg#OpenSans') format('svg');
  /* Legacy iOS */
}

/* open-sans-600 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-600.eot');
  /* IE9 Compat Modes */
  src: local(''),
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-600.eot?#iefix') format('embedded-opentype'),
    /* IE6-IE8 */
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-600.woff2') format('woff2'),
    /* Super Modern Browsers */
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-600.woff') format('woff'),
    /* Modern Browsers */
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-600.ttf') format('truetype'),
    /* Safari, Android, iOS */
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-600.svg#OpenSans') format('svg');
  /* Legacy iOS */
}

/* open-sans-700 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-700.eot');
  /* IE9 Compat Modes */
  src: local(''),
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-700.eot?#iefix') format('embedded-opentype'),
    /* IE6-IE8 */
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-700.woff2') format('woff2'),
    /* Super Modern Browsers */
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-700.woff') format('woff'),
    /* Modern Browsers */
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-700.ttf') format('truetype'),
    /* Safari, Android, iOS */
    url('/wp-content/themes/stopmutilation/assets/fonts/open-sans-v34-latin-700.svg#OpenSans') format('svg');
  /* Legacy iOS */
}



/* Asap_Condensed-300 - light */
@font-face {
  font-family: 'Asap_Condensed';
  font-style: normal;
  font-weight: 300;
  src: url('/wp-content/themes/stopmutilation/assets/fonts/Asap_Condensed/AsapCondensed-Light.ttf');
  /* IE9 Compat Modes */
}

/* Asap_Condensed-400 - regular */
@font-face {
  font-family: 'Asap_Condensed';
  font-style: normal;
  font-weight: 400;
  src: url('/wp-content/themes/stopmutilation/assets/fonts/Asap_Condensed/AsapCondensed-Regular.ttf');
  /* IE9 Compat Modes */
}

/* Asap_Condensed-500 - medium */
@font-face {
  font-family: 'Asap_Condensed';
  font-style: normal;
  font-weight: 500;
  src: url('/wp-content/themes/stopmutilation/assets/fonts/Asap_Condensed/AsapCondensed-Medium.ttf');
  /* IE9 Compat Modes */
}

/* Asap_Condensed-600 - semiBold */
@font-face {
  font-family: 'Asap_Condensed';
  font-style: normal;
  font-weight: 600;
  src: url('/wp-content/themes/stopmutilation/assets/fonts/Asap_Condensed/AsapCondensed-SemiBold.ttf');
  /* IE9 Compat Modes */
}

/* Asap_Condensed-700 - bold */
@font-face {
  font-family: 'Asap_Condensed';
  font-style: normal;
  font-weight: 700;
  src: url('/wp-content/themes/stopmutilation/assets/fonts/Asap_Condensed/AsapCondensed-Bold.ttf');
  /* IE9 Compat Modes */
}

/* Asap_Condensed-800 - bold */
@font-face {
  font-family: 'Asap_Condensed';
  font-style: normal;
  font-weight: 800;
  src: url('/wp-content/themes/stopmutilation/assets/fonts/Asap_Condensed/AsapCondensed-ExtraBold.ttf');
  /* IE9 Compat Modes */
}



/* Asap-300 - light */
@font-face {
  font-family: 'Asap';
  font-style: normal;
  font-weight: 300;
  src: url('/wp-content/themes/stopmutilation/assets/fonts/Asap/static/Asap-Light.ttf');
  /* IE9 Compat Modes */
}

/* Asap-400 - regular */
@font-face {
  font-family: 'Asap';
  font-style: normal;
  font-weight: 400;
  src: url('/wp-content/themes/stopmutilation/assets/fonts/Asap/static/Asap-Regular.ttf');
  /* IE9 Compat Modes */
}

/* Asap-500 - medium */
@font-face {
  font-family: 'Asap';
  font-style: normal;
  font-weight: 500;
  src: url('/wp-content/themes/stopmutilation/assets/fonts/Asap/static/Asap-Medium.ttf');
  /* IE9 Compat Modes */
}

/* Asap-600 - semiBold */
@font-face {
  font-family: 'Asap';
  font-style: normal;
  font-weight: 600;
  src: url('/wp-content/themes/stopmutilation/assets/fonts/Asap/static/Asap-SemiBold.ttf');
  /* IE9 Compat Modes */
}

/* Asap-700 - bold */
@font-face {
  font-family: 'Asap';
  font-style: normal;
  font-weight: 700;
  src: url('/wp-content/themes/stopmutilation/assets/fonts/Asap/static/Asap-Bold.ttf');
  /* IE9 Compat Modes */
}

/* Asap-800 - bold */
@font-face {
  font-family: 'Asap';
  font-style: normal;
  font-weight: 800;
  src: url('/wp-content/themes/stopmutilation/assets/fonts/Asap/static/Asap-ExtraBold.ttf');
  /* IE9 Compat Modes */
}

/* .willkommen h1 {
  font-family: 'Asap_Condensed';
  font-size: 20px;
}

.willkommen h2 {
  font-family: 'Asap';
  font-size: 20px;
} */

/* BLOCK LAYOUT & PADDING -----------------------------------------------*/

/* .width-large {
  margin: 0 auto;
  max-width: 1465px;
  padding: 0 25px;
}

.width-small {
  margin: 0 auto;
  max-width: 1175px;
  padding: 0 25px;
} */

.block_max {
  max-width: 1360px;
  margin-inline: auto;
}

.block_medium {
  max-width: 1150px;
  margin-inline: auto;
}

@media (max-width: 1400px) {
  .content_padding {
    padding-inline: 20px;
  }
}

@media (max-width: 850px) {
  .content_padding {
    padding-inline: 5%;
  }
}


/* MARGIN  BOTTOM -----------------------------------------------*/

.margin-bot-15px {
  margin-bottom: 15px;
}

.margin-bot-30px {
  margin-bottom: 30px;
}

.margin-bot-35px {
  margin-bottom: 35px;
}

.margin-bot-45px {
  margin-bottom: 45px;
}

.margin-bot-80px {
  margin-bottom: 80px;
}

/* ELEMENTE ------------------------------------------------------*/

img {
  display: block;
  width: 100%;
  height: auto;
}

h1,
h2,
h3 {
  font-family: 'Averia Serif Libre', cursive;
  color: var(--dunkles_grau);
}

p,
a,
li,
h4,
input {
  font-family: 'Open Sans', sans-serif;
}

h1 {
  font-size: 60px;
  font-weight: 700;
}

h2 {
  font-size: 52px;
  font-weight: 700;
}

h3 {
  font-size: 36px;
  font-weight: 700;
}

h4 {
  font-size: 14px;
  font-weight: 500;
}

p {
  font-size: 18px;
}

a {
  font-size: 16px;
  text-decoration: none;
  color: black;
}

ul {
  list-style-type: none;
  padding: 0;
}

a {
  font-size: 16px;
  font-weight: 700;
}

li {
  font-size: 18px;
  font-weight: 400;
}

button,
button:hover {
  background-color: transparent;
}

.main-content a,
.willkommen a,
.main-content strong a {
  font-size: 18px;
  color: var(--orange);
  font-weight: 400;
}

.main-content strong a {
  font-weight: 700;
}


.grid-4 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 50px;
}

.grid-6 {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 50px;
}

.grid-8 {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
}

.color-grau {
  color: var(--dunkles_grau);
}

.color-orange {
  color: var(--orange);
}

.text-22px {
  font-size: 22px;
  font-weight: 500;
  color: var(--dunkles_grau);
}

strong {
  color: var(--dunkles_grau);
}

/*----------------------------------------------------------------
 HEADER
-----------------------------------------------------------------*/

header {
  position: fixed;
  top: 0;
  width: 100%;
  background: transparent;
  padding-top: 20px;
  padding-bottom: 20px;
  z-index: 9;
}

header nav {
  display: flex;
  gap: 30px;
  justify-content: space-between;
  position: relative;
  z-index: 10;
  margin-inline: 30px;
}

header::before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, .6) 0%, rgba(0, 0, 0, 0) 100%);
  z-index: 0;
}

header .main_logo {
  max-width: 320px;
  width: 100%;
}

@media(max-width: 1000px) {
  header .main_logo {
    max-width: 280px;
  }
}

@media(max-width: 650px) {
  header .main_logo {
    max-width: 240px;
  }
}

header .right_column {
  display: flex;
  gap: 30px;
}

header .sprache_wrapper {
  display: flex;
  gap: 8px;
  border: none;
  align-items: center;
  cursor: pointer;
}

header .sprache_wrapper .pfeil {
  width: 100%;
  max-width: 14px;
}

header .burger_wrapper {
  display: flex;
  flex-direction: column;
  align-self: center;
  gap: 5px;
  width: 40px;
  border: none;
}

header .patty {
  width: 100%;
  height: 4px;
  background-color: #fff;
  border-radius: 2px;
}

/*----------------------------------------------------------------
 HOME / HEADER
-----------------------------------------------------------------*/

#main_header {
  height: auto;
  /* background-image: url(https://dev.beratungsstelle-stop-mutilation-de.org/wp-content/uploads/2024/10/SM_desktop-grafik.jpg); */
  /* background-repeat: no-repeat;
  background-position: left calc(50% - 270px) center;
  background-size: 2250px; */
  background-image:
    url(https://dev.beratungsstelle-stop-mutilation-de.org/wp-content/uploads/2024/10/stopMutilation_headergrafik_x2.png),
    url(https://dev.beratungsstelle-stop-mutilation-de.org/wp-content/uploads/2024/10/stop_mutilation_header_background.jpg);
  background-size: 650px, 2200px;
  background-repeat: no-repeat, no-repeat;
  background-position: 10% 30%, center;
  color: #fff;
}

#main_header .text_wrapper {
  padding-top: 150px;
  padding-bottom: 120px;
  max-width: 540px;
  margin-left: auto;
}

#main_header_mobile_section {
  background-color: #151312;
  color: #FFFFFF;
}

#main_header_mobile_section .text_wrapper.mobile_only {
  display: none;
  padding-inline: 5%;
  padding-top: 20px;
  padding-bottom: 160px;
}

#main_header_mobile_section .text_wrapper.mobile_only p {
  font-size: 15px !important;
}

#main_header_mobile_section .text_wrapper p:not(:last-of-type) {
  margin-bottom: 30px;
}

#main_header_mobile_section .text_wrapper strong {
  color: #FFFFFF;
}

#main_header .text_wrapper>*:has(+ *) {
  margin-bottom: 30px;
}

#main_header h1 {
  font-family: var(--font-asap-condensed);
  font-size: 42px;
  font-weight: 700;
  line-height: 110%;
  text-transform: uppercase;
  color: #fff;
}

#main_header p {
  font-family: var(--font-asap);
  font-size: 16px;
  font-weight: 400;
  line-height: 140%;
}

#main_header p strong {
  font-weight: 700;
  color: #fff;
}

/* UNTERSEITEN */

.header-content img {
  margin-left: auto;
  margin-right: auto;
  /* margin-top: 75px; */
  max-height: 700px;
}

.header-content img {
  object-fit: cover;
  max-height: 700px;
}

.breadcrumbs {
  display: flex;
  padding: 0;
}

.breadcrumbs * {
  font-weight: 500;
}

.item-parent a,
.separator {
  color: var(--dunkles_grau);
}

.item-current strong {
  color: #000;
}

.separator {
  padding: 0 5px;
}

.breadcrumbs a,
.breadcrumbs li {
  font-size: 16px !important;
}

@media (max-width: 500px) {

  .breadcrumbs a,
  .breadcrumbs li {
    font-size: 14px !important;
  }
}

/* ---------------------------------------------- 
HOMEPAGE
-------------------------------------------------*/

/* WILLKOMMEN */
.willkommen {
  padding-top: 150px;
}

.kacheln-container {
  grid-column: span 2;
  /* height: 400px; */
  background-color: #fff;
  box-shadow: 1px 3px 12px 1px rgba(0, 0, 0, 0.2);
}

.kacheln-container img {
  transform: scale(1);
  transition: all 0.3s ease-in-out;
}

.kacheln-container .image-container {
  overflow: hidden;
}

.kacheln-container p {
  padding: 0 30px;
  transition: all 0.3s ease-in-out;
}

.kacheln-container p:nth-child(2) {
  padding: 0 30px;
  padding-top: 20px;
  padding-bottom: 5px;
  font-size: 16px;
  color: var(--orange);
  text-transform: uppercase;
  font-weight: 700;
}

.kacheln-container p:nth-child(3) {
  padding: 0 30px;
  font-size: 22px;
  font-weight: 700;
  color: #000;
  padding-bottom: 40px;
}

.kacheln-container:hover img {
  transform: scale(1.07);
}

.kacheln-container:hover p:nth-child(3) {
  color: var(--orange);
}

@media (max-width: 1180px) {
  .home .grid-6 {
    gap: calc(-20px + 5vw)
  }
}

@media (max-width: 990px) {
  .kacheln-container p:nth-child(2) {
    font-size: 14px;
  }

  .kacheln-container p:nth-child(3) {
    font-size: 18px;
  }
}

@media (max-width: 845px) {
  .home .grid-6 {
    grid-template-columns: repeat(4, 1fr);
    gap: 20px
  }
}

@media (max-width: 580px) {
  .home .grid-6 {
    grid-template-columns: repeat(2, 1fr);
  }

  .kacheln-container {
    max-width: 350px;
    margin: 0 auto;
  }
}



/* ---------------------------------------------- 
UNTERSEITEN GLOBAL
 -------------------------------------------------*/
.main-content {
  padding-bottom: 80px;
}

.main-content p {
  margin-bottom: 35px;
}

.main-content .margin-bot-15px {
  margin-bottom: 15px;
}

.main-content .margin-bot-45px {
  margin-bottom: 45px;
}

.main-content .margin-bot-80px {
  margin-bottom: 80px;
}

.main-content .margin-zero {
  margin-bottom: 0;
}

.main-content .pdf_container img,
.main-content .pdf_container figure {
  display: inline;
  margin-bottom: 0;
}

.main-content .pdf_container img {
  max-width: 15px;
  margin-right: 10px;
}

@media (max-width: 600px) {
  h2 {
    font-size: 30px;
  }

  h3 {
    font-size: 25px;
  }
}



/* ---------------------------------------------- 
UNTERSEITE THEMA
 -------------------------------------------------*/

.thema-content .formen {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 50px;
}

.thema-content .formen .card {
  grid-column: span 1;
}

.img-platzhalter {
  background-color: var(--dunkles_grau);
  height: 300px;
  width: 100%;
}

.thema-content .wp-image-335 {
  width: inherit;
  margin: 0 auto;
}

.thema-content .christoph {
  display: flex;
  margin-bottom: 45px;
}

.thema-content .chris-text-container {
  background-color: var(--orange);
  padding: 60px;
  width: 60%;
}

.thema-content .chris-text-container p {
  color: #fff;
  font-family: 'Averia Serif Libre', cursive;
  font-size: 23px;
  margin: 0;
  text-align: center;
}

.thema-content .chris-image-container {
  width: 50%;
  background-color: #dcdcdc;
  position: relative;
}

.thema-content .chris-image-container p {
  position: absolute;
  top: 55px;
  left: 60px;
  max-width: 250px;
}

.thema-content .chris-image-container p span {
  font-weight: 700;
  line-height: 2;
}

.thema-content .chris-image-container .chris-image {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 200px;
}

.thema-content .chris-image-container .chris-element-ecke {
  position: absolute;
  top: 68px;
  left: 0;
  width: 50px;
}


/*--------------- MOBILE ----------------------*/

@media (max-width:1125px) {
  .thema-content .formen {
    gap: 20px;
  }
}

@media (max-width:800px) {
  .thema-content .formen {
    grid-template-columns: repeat(2, 1fr);
    gap: 50px;
  }

  .thema-content .christoph {
    flex-direction: column;
  }

  .thema-content .chris-image-container {
    height: 290px;
    width: 100%;
  }

  .thema-content .chris-text-container {
    width: 100%;
  }

  .thema-content .chris-image-container .chris-element-ecke {
    left: inherit;
    top: 0;
    right: 0;
    width: 50px;
    transform: rotatey(200grad);
  }

  .thema-content .chris-image-container p {
    top: 51px;
  }
}

@media (max-width:490px) {
  .thema-content .chris-text-container {
    padding: 30px;
  }

  .thema-content .chris-image-container p {
    left: 30px;
  }

  .thema-content .chris-image-container {
    height: 370px;
  }
}

@media (max-width:400px) {
  .thema-content .formen {
    grid-template-columns: repeat(1, 1fr);
  }
}


/* ---------------------------------------------- 
UNTERSEITE Über uns
 -------------------------------------------------*/

.ueber-uns-content .formen {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 50px;
}

.ueber-uns-content .formen .card {
  grid-column: span 2;
}

.ueber-uns-content ul {
  list-style-type: initial;
  padding-left: 14px;
}


/* ---------------------------------------------- 
UNTERSEITE BEARATUNG
 -------------------------------------------------*/

.beratung-content .formen {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 50px;
}

.beratung-content .formen .card {
  grid-column: span 2;
}

/* ---------------------------------------------- 
UNTERSEITE PRESSE
 -------------------------------------------------*/

.presse-content .formen {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 50px;
}

.presse-content .formen .card {
  grid-column: span 2;
}


/* ---------------------------------------------- 
UNTERSEITE MATERIAL
 -------------------------------------------------*/

.material-content h3 {
  margin-top: 50px;
}

/* ---------------------------------------------- 
UNTERSEITE MATERIAL
 -------------------------------------------------*/

.material-content img {
  width: inherit;
}

/* ---------------------------------------------- 
UNTERSEITE PROJEKTE
 -------------------------------------------------*/

.projekt-content img {
  width: inherit;
}

/* ---------------------------------------------- 
UNTERSEITE Fördermitglied werden
 -------------------------------------------------*/

.foerdermitglied-content a {
  padding: 0;
}

.foerdermitglied-content .wp-block-file {
  display: inline;
}

/* ---------------------------------------------- 
UNTERSEITE Flüchtlinge
 -------------------------------------------------*/

.fluechtlinge-content .pdf_container img {
  max-width: 15px;
  display: inline;
  margin-right: 10px;
}

/* ---------------------------------------------- 
UNTERSEITE SCHIRMHERR
 -------------------------------------------------*/

.schirmherr-content .schirmherr_container {
  float: left;
  margin-right: 20px !important;
  margin-bottom: 10px;
}

.schirmherr-content .schirmherr_container p {
  margin-bottom: 0;
  font-size: 15px;
  color: var(--dunkles_grau);
}

.schirmherr-content .schirmherr_img {
  max-width: 250px;
  margin-bottom: 10px;
}

@media (max-width: 500px) {
  .schirmherr-content .schirmherr_container {
    float: none;
  }
}

/* ---------------------------------------------- 
UNTERSEITE JUGENDLICHE
 -------------------------------------------------*/

.jugendliche-content ul {
  list-style-type: initial;
  padding-left: 14px;
}

.jugendliche-content h2 {
  max-width: 760px;
}


/* ---------------------------------------------- 
UNTERSEITE DATENSCHUTZ
 -------------------------------------------------*/

.datenschutz-content ul {
  list-style-type: initial;
  padding-left: 14px;
}

/*---------------------------------------------
NEWSLETTER 
 ------------------------------------------------ */


.newsletter {
  text-align: center;
  background: #fff;
  box-shadow: 0px 0px 20px 10px #00000010;
}

.newsletter .newsletter-content {
  display: flex;
  max-width: 1000px;
  padding-inline: 50px;
  margin: 0 auto;
  padding-top: 40px;
  padding-bottom: 40px;
  gap: 20px;
}

.newsletter .newsletter-content img {
  width: 100%;
  height: auto;
  max-width: 210px;
  object-fit: contain;
}

.newsletter .newsletter-content>div {
  text-align: left;
}

.newsletter .newsletter-content h2 {
  font-family: var(--font-asap) !important;
  color: #F08227;
  font-size: 38px;
}

.newsletter .newsletter-content p {
  font-family: var(--font-asap) !important;
  color: #444444;
  font-size: 15px;
  margin-top: 10px;
}

.newsletter .newsletter-content .newsletter-form {
  margin-top: 30px;
  display: flex;
}

.newsletter .newsletter-content .newsletter-form input {
  font-size: 16px;
  width: 100%;
  max-width: 400px;
  padding: 10px;
  /* display: inline-block; */
  border: 2px solid #A3A3A3;
  border-radius: 6px;
  /* background-color: #fff; */
  height: fit-content;
  -webkit-box-shadow: inset 0px 0px 3px 1px rgba(0, 0, 0, .2);
  -moz-box-shadow: inset 0px 0px 3px 1px rgba(0, 0, 0, .2);
  box-shadow: inset 0px 0px 3px 1px rgba(0, 0, 0, .2);
}

.newsletter .newsletter-content .newsletter-form button {
  width: 100%;
  max-width: 230px;
  margin-left: 30px;
  border: none;
  padding: 10px;
  border-radius: 6px;
  background-color: var(--orange);
  cursor: pointer;
  text-transform: uppercase;
  font-weight: 600;
  color: #000;
  font-size: 16px;
  font-family: var(--font-asap-condensed);
  flex-shrink: 1;
  min-width: 150px;
}



.newsletter .btn {
  display: inline-block;
  margin-left: 0;
  margin-bottom: 60px !important;
  text-transform: uppercase;
}

.newsletter form {
  display: flex;
  padding: 12px 0;
  justify-content: center;
}

/* .newsletter input:nth-child(1) {
  font-size: 18px;
  width: 540px;
  margin: 35px 0;
  padding: 15px;
  display: inline-block;
  border: 2px solid rgba(128, 128, 128, 0.253);
  border-right: none;
  background-color: #fff;
} */

.newsletter input:nth-child(1):focus {
  outline: none !important;
  border: 2px solid var(--orange);
}

/* .newsletter button {
  width: 55px;
  height: 57px;
  margin: 35px 0;
  padding: 15px;
  display: inline-block;
  border: none;
  background-color: var(--orange);
  cursor: pointer;
} */


/*--------------------------------------------------
FOOTER
 ----------------------------------------------------- */

footer {
  background-color: #2D2A28;
  padding-top: 60px;
  padding-bottom: 60px;
}

.width-footer {
  margin: 0 auto;
  max-width: 1175px;
  padding: 0 25px;
}

footer .footer-container {
  /* height: 500px; */
  color: #000;
  max-width: 450px;
  margin-inline: auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

footer img {
  margin-bottom: 20px;
  max-width: 380px;
}

footer h2 {
  color: #000;
  font-size: 30px;
  margin-bottom: 20px;
}

footer p {
  font-family: 'Averia Serif Libre', cursive;
  font-size: 36px;
  font-weight: 700;
  margin-bottom: 40px;
}

footer li,
footer li strong,
footer li a {
  color: #fff;
}

footer li:nth-child(1) {
  margin-top: 30px;
}

footer li:nth-child(1),
footer li:nth-child(2) {
  font-weight: 400;
}

footer li:nth-child(2) {
  margin-top: 30px;
}

footer li:nth-child(3) {
  margin-top: 5px;
}

footer li:nth-child(2) strong:nth-of-type(2),
footer li:nth-child(3) strong:nth-of-type(2) {
  color: #F08227;
}

footer li:nth-child(4) {
  margin-top: 30px;
}

footer li:last-child {
  margin-top: 50px;
}

footer li:last-child a {
  font-weight: 700;
  font-size: 16px;
}

footer li:last-child a:first-child {
  margin-right: 20px;
}

/* footer li:not(:last-of-type) a {
  text-decoration: underline;
} */


/*--------------------------------------------------
Style Elemente
 ----------------------------------------------------- */

.abschnitt {
  width: 100%;
  height: 3px;
  background-color: var(--orange);
}

/*# MEDIA QUERIES  */
@media (max-width: 768px) {
  .newsletter .newsletter-content img {
    flex-shrink: 0;
  }

  .newsletter-form {
    flex-direction: column;
  }

  .newsletter .newsletter-content .newsletter-form button {
    margin-left: 0;
    margin-top: 10px;
    max-width: none;
  }

  .newsletter .newsletter-content .newsletter-form input {
    max-width: none;
  }
}

@media (max-width: 600px) {
  .newsletter .newsletter-content img {
    margin-inline: auto;
  }

  .newsletter .newsletter-content {
    flex-direction: column;
    padding-inline: 5%;
  }

}

.page-id-361 .header-content img {
  height: 350px;
}

@media (max-width: 450px) {
  #main_header {
    background-position: center 160%, center bottom;
    background-size: 400px, cover;
    height: 600px;
  }

  #main_header .text_wrapper.desktop_only h1 {
    text-align: center;
    width: min-content;
    margin-inline: auto;
    font-size: 40px;
  }

  #main_header .text_wrapper.desktop_only p {
    display: none;
  }

  #main_header_mobile_section .text_wrapper.mobile_only {
    display: block;
  }

  .donations-section {
    /* margin-top: -120px !important; */
    top: -120px !important;
  }

  .teasers {
    margin-top: -70px !important;
  }

  footer li:not(:last-of-type) {
    font-size: 16px;
  }

  footer li:last-of-type a {
    font-size: 15px;
  }
}

.white-background {
  background-color: #FFFFFF;
  padding-bottom: 40px;
  margin-bottom: 40px;
}

.info-sections {
  background-color: #fff;
  padding-top: 50px;
  padding-bottom: 50px;
}

.info-sections .info-block {
  display: flex;
  width: 100%;
  width: min(90%, 1150px);
  margin-inline: auto;
}

.info-sections .info-block:not(:last-of-type) {
  margin-bottom: 40px;
}

.info-sections .info-block:last-of-type {
  /* margin-top: 50px;
  margin-bottom: 50px; */
}

.info-sections:first-of-type {
  padding-bottom: 80px;
}

.info-block>div:first-of-type {
  margin-right: 70px;
  min-width: 260px;
}

.info-block h2 {
  width: min-content;
  color: #F08328;
  font-size: 40px;
  font-family: var(--font-asap-condensed);
  line-height: 1;
  text-transform: uppercase;
}

.info-block p,
.info-block img {
  max-width: 550px;
}

.info-block img {
  margin-top: 30px;
  margin-bottom: 30px;
}

.info-block p {
  color: #000000;
  font-size: 16px;
}

@media (max-width: 950px) {
  .info-block>div:first-of-type {
    margin-right: 4vw;
  }
}

@media (max-width: 800px) {
  .info-sections .info-block {
    flex-direction: column;
  }

  .info-block h2 {
    margin-bottom: 20px;
    width: fit-content;
  }

  .info-block p,
  .info-block img {
    max-width: none;
  }

  /* .therapien-container{
    width: 90% !important;
  } */
}

.page-id-1192 .info-sections:first-of-type {
  padding-bottom: min(12vw, 150px);
}

.info-section-with-shadow {
  -webkit-box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, .15);
  box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, .15);
  position: relative;
}

.info-block a:not(.email):not(.kachel_wrapper) {
  display: inline-block;
  margin-top: 20px;
  color: #000000;
  background-color: #F08328;
  font-family: var(--font-asap-condensed);
  font-size: 16px;
  padding: 10px 20px;
  border-radius: 6px;
  width: 100%;
  max-width: 250px;
  text-align: center;
  text-transform: uppercase;
}

.illustration-beschneidung {
  width: min(90vw, 1150px);
  margin-inline: auto;
  display: flex;
  justify-content: center;
  gap: 60px;

  margin-bottom: 60px;
  margin-top: 60px;
}

.illustration-beschneidung .kachel {
  max-width: 250px;
  width: 100%;
}

.illustration-beschneidung .kachel img {
  margin-bottom: 30px;
  min-width: 200px;
}

.illustration-beschneidung .kachel h3,
.illustration-beschneidung .kachel p {
  font-family: var(--font-asap);
  font-size: 16px;
}

.illustration-beschneidung .kachel h3 {
  font-weight: bold;
  margin-bottom: 20px;
}

@media(max-width: 1100px) {
  .illustration-beschneidung {
    width: min(90vw, 750px);
    flex-wrap: wrap;
  }

  .page-id-1206 .info-sections:first-of-type>.info-block:last-of-type>div {
    margin-right: 0;
    min-width: 0;
  }

  .page-id-1206 .info-sections:first-of-type .info-block:last-of-type>p {
    max-width: none;
  }
}

.message-section {
  background-color: #E9E9E9;
}

.message-section:has(.message-container.doktor) {
  background-color: #FFFFFF;
}

.message-section .message-container {
  margin-inline: auto;
  padding-bottom: 40px;
  /* margin: 30px auto 60px; */
  width: min(90%, 1150px);
  display: flex;
}

.message-container .column-left {
  background-color: #F08227;
  color: #000000;
  font-family: var(--font-asap-condensed);
  text-align: center;
  padding: 50px 80px 20px;
  position: relative;
  /* padding-top: 50px;
  padding-bottom: 20px; */
  /* flex-grow: 1; */
  /* width: 100%; */
}

.message-container .column-left p {
  width: 100%;
  max-width: 600px;
}

.message-container .column-left p:nth-of-type(1) {
  font-size: 25px;
  font-family: var(--font-asap-condensed);
  font-weight: 700;
  margin-bottom: 40px;
}

.message-container .column-left p:nth-of-type(1) span {
  color: #FFFFFF;
}

.message-container .column-left p:nth-of-type(2) {
  margin-bottom: 5px;
  font-size: 16px;
}

.message-container .column-left p:nth-of-type(3) {
  font-size: 15px;
}


.message-container .column-left::after {
  content: '';
  clip-path: polygon(0 0, 0 100%, 100% 0);
  background-color: #F08227;
  position: absolute;
  left: 100%;
  top: 50%;
  width: 50px;
  height: 50px;
}

.message-container .column-right {
  background: url('/wp-content/uploads/2022/12/schirmherr-2.jpg');
  background-repeat: no-repeat;
  background-position: right bottom;
  background-size: cover;
  width: 100%;
  max-width: 400px;
}

.message-container.doktor .column-right {
  background-color: #C4C4C4;
  background-image: url('/wp-content/uploads/2022/08/StopMutilation_DrZerm1_thema.png');
  background-repeat: no-repeat;
  background-position: right bottom;
  background-size: contain;
}

@media (max-width: 850px) {
  .message-container {
    flex-direction: column;
  }

  .message-container .column-left {
    padding: 20px 5%;
  }

  .message-container .column-left::after {
    transform: rotate(90deg);
    top: 100%;
    left: 20%;
  }

  .message-container .column-right {
    height: 250px;
    max-width: none;
    background-position: center;
  }

  .message-container .column-left p:nth-of-type(1) {
    margin-bottom: 20px;
  }

  .message-container.doktor .column-right {
    background-position: center bottom;
  }
}

@media (max-width: 550px) {
  .message-container .column-left {
    text-align: left;
  }

  .message-container .column-left p:nth-of-type(1) {
    font-size: 22px;
  }
}

.breadcrumb {
  text-transform: uppercase;
}

.materialien-section {
  background-color: #FFFFFF;
}

.materialien-container {
  /* width: min(90%, 550px); */
  /* margin-inline: auto; */
  padding-bottom: 50px;
  max-width: 550px;
}

.materialien-container h3 {}

.material:not(:last-of-type) {
  margin-bottom: 40px;
}

.material::after {
  display: block;
  content: '';
  border-bottom: 1px solid #00000020;
  margin-top: 40px;
  margin-bottom: 40px;
  width: 100%;
}

.materialien-container h3 {
  font-family: var(--font-asap);
  font-size: 18px;
  margin-bottom: 20px;
}

.materialien-container>a:last-of-type {
  color: #F08328;
}

.material h3,
.material p {
  font-family: var(--font-asap);
  font-size: 16px;
}

.material h3 {
  font-weight: bold;
  margin-bottom: 20px;
}

.material p {
  margin-bottom: 20px;
}

.material a {
  display: block;
  border-radius: 6px;
  background-color: #F08328;
  color: #000000;
  padding: 10px 20px;
  width: 100%;
  max-width: 140px;
  text-align: center;
  text-transform: uppercase;
  margin-bottom: 20px;
}

.material img {
  width: 100%;
  height: auto;
  max-width: 210px;
}

.donations-section {
  /* margin-top: -60px; */
  position: relative;
  top: -60px;
  max-width: 1150px;
  box-shadow: 0px 0px 10px 10px #00000010;
}

.donations-section .spenden-infos,
.donations-section .spenden {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  padding-top: 20px;
  padding-bottom: 20px;
  padding-inline: 40px;
}

.donations-section .spenden {
  background-color: #F08328;

}

.donations-section .spenden h2,
.donations-section .spenden span {
  color: #fff;
  font-family: var(--font-asap-condensed);
}

.donations-section .spenden h2 {
  font-size: 38px;
  flex-shrink: 0;
}

.donations-section .spenden span {
  align-self: center;
}

.donations-section .spenden button {
  font-family: var(--font-asap-condensed);
  background-color: #fff;
  border-radius: 6px;
  border: none;
  padding: 10px;
  font-size: 16px;
  font-weight: 600;
  color: #000;
  width: 100%;
  height: fit-content;
  align-self: center;
  cursor: pointer;
}

.donations-section .spenden .förder-mitglied {
  max-width: 350px;
}

.donations-section .spenden .online-spenden {
  max-width: 250px;
}

.donations-section .spenden-infos {
  background-color: #fff;
  color: #444;
}

.donations-section .spenden-infos p {
  font-size: 16px !important;
  font-family: var(--font-asap);
}

.donations-section .spenden-infos p strong {
  display: inline-block;
  margin-bottom: 5px;
}

@media (max-width: 850px) {
  .donations-section .spenden h2 {
    flex-basis: 100%;
  }

  .donations-section .spenden {
    justify-content: flex-start;
    flex-wrap: wrap;
  }
}

@media (max-width: 650px) {

  .donations-section .spenden-infos,
  .donations-section .spenden {
    flex-direction: column;
    padding-inline: 5%;
    margin-inline: 2%;
  }

  .donations-section .spenden h2 {
    font-size: 28px;
  }

  .donations-section .spenden .förder-mitglied,
  .donations-section .spenden .online-spenden {
    max-width: none;
  }
}

.donations-section .foerdermitglied-modal {
  background-color: #fff;
  margin: auto;
  padding: 40px;
  border: none;
  max-width: 650px;
}

.donations-section .foerdermitglied-modal::backdrop {
  background-color: #00000090;
}

.donations-section .foerdermitglied-modal button {
  width: 28px;
  height: 28px;
  position: absolute;
  top: 20px;
  right: 20px;
  padding: 0;
}

.donations-section .foerdermitglied-modal h2 {
  color: #F08328;
  font-family: var(--font-asap-condensed);
  font-size: 40px;
  font-weight: bold;
  margin-bottom: 30px;
}

.donations-section .foerdermitglied-modal p {
  color: #000000;
  font-family: var(--font-asap);
  font-size: 16px;
  margin-bottom: 30px;
}

.donations-section .foerdermitglied-modal a {
  display: block;
  background-color: #F08328;
  color: #000000;
  font-family: var(--font-asap-condensed);
  font-size: 16px;
  padding: 10px 20px;
  border-radius: 6px;
  text-align: center;
  width: 100%;
  max-width: 275px;
  text-transform: uppercase;
}

.material-page .info-block>div>p {
  margin-bottom: 100px;
  position: relative;
}

.material-page .info-block>div>p::after {
  content: '';
  position: absolute;
  width: 200vw;
  transform: translateX(-50%);
  bottom: -40px;
  height: 10px;
  box-shadow: 0px 0px 20px 10px #00000010;
  clip-path: inset(10px -100vmax -20px);
}

.material-page .info-block img {
  max-height: 60px;
  max-width: 180px;
  width: auto;
  margin-top: 10px;
  margin-bottom: 10px;
}

@media(max-width: 768px) {
  header .main_logo {
    max-width: 240px;
  }

  .header-content img {
    height: 350px;
  }
}

@media(max-width: 550px) {
  header .main_logo {
    max-width: 200px;
  }
}

.burger_wrapper input {
  display: block;
  width: 40px;
  height: 22px;
  position: absolute;
  cursor: pointer;
  opacity: 0;
  z-index: 30;
}

.burger_wrapper .patty {
  cursor: pointer;
  transition: all .3s ease;
  z-index: 20;
  transform-origin: top left;
}

.patty:nth-of-type(1) {
  transform-origin: left top;
}

.patty:nth-of-type(3) {
  transform-origin: left bottom;
}

#menu {
  position: absolute;
  top: -20px;
  left: calc(100% + 30px);
  background-color: #FFFFFF;
  padding: 100px 50px 0px 30px;
  transition: all .3s ease;
  height: 100vh;
  z-index: 10;
}

#menu li a {
  display: block;
  font-family: var(--font-asap);
  font-size: 18px;
  margin-bottom: 10px;
  font-weight: 500;
}

.burger_wrapper input:checked~#menu {
  transform: translateX(calc(-100%));
}

.burger_wrapper input:checked~.patty:nth-of-type(1) {
  background-color: #000;
  transform: rotateZ(45deg)translateY(-6px);
}

.burger_wrapper input:checked~.patty:nth-of-type(2) {
  opacity: 0;
}

.burger_wrapper input:checked~.patty:nth-of-type(3) {
  background-color: #000;
  transform: rotateZ(-45deg) translateY(6px);
}

.impressum-content,
.datenschutz-content {
  width: min(90%, 1150px);
  margin-inline: auto;
  padding-top: 60px;
}

.impressum-content h2,
.datenschutz-content h2 {
  font-family: var(--font-asap-condensed);
  font-size: 42px;
  font-weight: 700;
  line-height: 110%;
  text-transform: uppercase;
  color: #000;
  margin-bottom: 30px;
}

.datenschutz-content h3 {
  font-family: var(--font-asap);
  font-size: 30px;
  line-height: 110%;
  color: #000;
}

.form_feedback {
  display: block;
  font-family: var(--font-asap);
  margin-top: 10px;
}

/* * {
  border: blue 1px solid;
} */

.cmpboxrecall {
  display: none;
}

.medizinische-sprechstunde h3 {
  font-size: 26px;
  margin-bottom: 10px;
  max-width: 550px;
}

.medizinische-sprechstunde p:has(+ p) {
  margin-bottom: 10px;
}

.medizinische-sprechstunde p strong {
  font-family: 'Open Sans', sans-serif;
}

.medizinische-sprechstunde ul {
  max-width: 550px;
  list-style-type: disc;
  margin-bottom: 10px;
  padding-left: 16px;
}

.medizinische-sprechstunde li {
  font-size: 16px;
}

.medizinische-sprechstunde li:has(+li) {
  margin-bottom: 5px;
}


.aktuelles .kachel_container {}

.aktuelles .kachel_wrapper {
  text-align: start;
  font-size: 18px;
  background: #fff;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  cursor: pointer;
  margin-bottom: 50px;
  max-width: 500px;
}

.kachel_wrapper .bg {
  background-image: url(http://beratungsstelle-stop-mutilation-de.org/wp-content/uploads/2024/10/romanski-ordas.jpg);
  background-size: cover;
  background-position: center;
  width: 100%;
  margin-bottom: 10px;
  max-width: 500px;
  display: block;
  position: relative;
  height: 200px;
}

.kachel_wrapper:nth-child(1) .bg {
  background-image: url(http://beratungsstelle-stop-mutilation-de.org/wp-content/uploads/2024/10/pfirsich2x.jpg);  
  background-size: contain;
  background-repeat: no-repeat;
}
  
.kachel_wrapper:nth-child(2) .bg {
  background-image: url(https://beratungsstelle-stop-mutilation-de.org/wp-content/uploads/2024/10/hilfe-header.jpg);
}

.kachel_wrapper h3 {
  font-size: 22px;
  margin-bottom: 4px;
  font-weight: 600;
  color: #000;
}

.kachel_wrapper .teaser_text {
  font-size: 18px;
  margin-bottom: 10px;
  font-weight: 400;
}

.kachel_wrapper button {
  border: none;
  text-decoration: underline;
  color: var(--orange);
  font-weight: 600;
  padding: 0;
  cursor: pointer;
}


.kachel_wrapper img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.swiper-pagination-bullet-active {
  background: var(--orange) !important;
}