@charset "UTF-8";
.fullscreen {
  height: calc(100vh - 80px);
  width: 100%;
  align-items: center;
}
.mod_article.fullscreen {
  background-color: unset;
  padding: unset;
}
.dark-mode .mod_article {
  background-color: #151619;
}
.dark-mode .mod_article.fullscreen {
  background-color: unset;
}
.content-image {
  justify-content: center;
}
.mod_article {
  display: flex;
  width: 100%;
  justify-content: space-between;
  gap: 50px;
  flex-wrap: wrap;
  padding: 100px 30%;
  background-color: white;
}
.mod_article figure {
  margin: 0px;
}
@media (max-width: 1023px) {
  .mod_article {
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
}
.width-10 {
  width: calc(10% - 50px / 2);
  display: flex;
  align-items: center;
}
.width-20 {
  width: calc(20% - 50px / 2);
  display: flex;
  align-items: center;
}
.width-30 {
  width: calc(30% - 50px / 2);
  display: flex;
  align-items: center;
}
.width-40 {
  width: calc(40% - 50px / 2);
  display: flex;
  align-items: center;
}
.width-50 {
  width: calc(50% - 50px / 2);
  display: flex;
  align-items: center;
}
.width-60 {
  width: calc(60% - 50px / 2);
  display: flex;
  align-items: center;
}
.width-70 {
  width: calc(70% - 50px / 2);
  display: flex;
  align-items: center;
}
.width-80 {
  width: calc(80% - 50px / 2);
  display: flex;
  align-items: center;
}
.width-90 {
  width: calc(90% - 50px / 2);
  display: flex;
  align-items: center;
}
.width-100 {
  width: calc(100% - 50px / 2);
  display: flex;
  align-items: center;
}
@media (max-width: 1023px) {
  /* Setze die Breite der .width-X Klassen auf 100%, wenn der Bildschirm kleiner als 768px ist */
  .width-10 {
    width: 100% !important;
    /* Überschreibt alle anderen Width-Einstellungen */
  }
  .width-20 {
    width: 100% !important;
    /* Überschreibt alle anderen Width-Einstellungen */
  }
  .width-30 {
    width: 100% !important;
    /* Überschreibt alle anderen Width-Einstellungen */
  }
  .width-40 {
    width: 100% !important;
    /* Überschreibt alle anderen Width-Einstellungen */
  }
  .width-50 {
    width: 100% !important;
    /* Überschreibt alle anderen Width-Einstellungen */
  }
  .width-60 {
    width: 100% !important;
    /* Überschreibt alle anderen Width-Einstellungen */
  }
  .width-70 {
    width: 100% !important;
    /* Überschreibt alle anderen Width-Einstellungen */
  }
  .width-80 {
    width: 100% !important;
    /* Überschreibt alle anderen Width-Einstellungen */
  }
  .width-90 {
    width: 100% !important;
    /* Überschreibt alle anderen Width-Einstellungen */
  }
  .width-100 {
    width: 100% !important;
    /* Überschreibt alle anderen Width-Einstellungen */
  }
  .mod_article {
    flex-wrap: nowrap !important;
  }
  .fullscreen {
    height: unset;
  }
}
/*# sourceMappingURL=data:application/json,%7B%22version%22%3A3%2C%22sources%22%3A%5B%22var%2Fwww%2Fvhosts%2Ffabiene-ahorner.de%2FWebseite%2Ffiles%2FBerning-Systems%2Fcss%2Flayout%2Fgrid.scss%22%5D%2C%22names%22%3A%5B%5D%2C%22mappings%22%3A%22%3BAAEA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAOE%3BAAAA%3BAAAA%3BAAAA%3BAAMA%3BAAAA%3BAAAA%3BAAEA%3BAAAA%3BAAAA%3BAAMF%3BAAAA%3BAAAA%3BAAGA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAQI%3BAAAA%3BAAAA%3BAAKF%3BAACE%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAASF%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAUA%3BAAAA%3BAAGI%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAAA%3BAAIF%3BAAAA%3BAAAA%3BAAGA%3BAAAA%3BAAAA%3BAAAA%22%7D */