@charset "UTF-8";
main .heading-title {
  font: normal normal bold 65px/79px "Helvetica Neue";
}
main .cards-wrapper {
  height: 1044px;
  margin-top: 225px;
  padding-top: 223px;
  background: #F8F8F8 0% 0% no-repeat padding-box;
}
main .info-cards-wrapper.info-cards-wrapper.is-layout-flex {
  display: flex;
  gap: 32px;
  word-wrap: normal;
}
main .info-cards-wrapper.info-cards-wrapper.is-layout-flex h4 {
  white-space: nowrap;
  margin: 0;
  padding: 0;
}
main .info-cards-wrapper.info-cards-wrapper.is-layout-flex .equal-card {
  flex: 1 1 0;
  min-width: 0;
  padding: 24px;
  display: flex;
  justify-content: space-evenly;
  flex-direction: column;
}
main .info-cards-wrapper.info-cards-wrapper.is-layout-flex .equal-card figure {
  margin-top: 42px;
  margin-bottom: 42px;
}
main .info-cards-wrapper.info-cards-wrapper.is-layout-flex .equal-card hr {
  margin-bottom: auto;
}
main .info-cards-wrapper.info-cards-wrapper.is-layout-flex .equal-card .wp-block-button {
  margin-top: 0;
  border-radius: 0;
}
main .equal-card:last-child {
  height: 100%;
}
main .fullwidth-warum-wrapper {
  position: relative;
  left: calc(50% - 50vw);
  width: 100vw;
  margin-top: 89px;
  margin-bottom: 0px !important;
}
main .fullwidth-warum-wrapper .warum-image {
  width: 722px;
  height: 723px;
  padding-left: -100;
}
main .fullwidth-warum-wrapper .warum-text-wrapper {
  margin-left: 215px;
}
main .fullwidth-warum-wrapper .warum-text-wrapper ul {
  margin-bottom: 59px !important;
  padding-left: 15px;
}
main .fullwidth-warum-wrapper .warum-text-wrapper .wp-block-buttons {
  margin: 50px 0;
}
main .info-details-wrapper {
  height: 994px;
}
main .info-details-wrapper p:first-of-type {
  font-weight: bold !important;
}
main .info-details-wrapper h2 {
  margin-top: 224px !important;
  margin-bottom: 89px !important;
}
main .info-details-wrapper .wp-block-columns {
  gap: 32px;
}
main .info-details-wrapper .wp-block-columns .help-cards-wrapper h6 {
  padding-top: 0;
}
main .info-details-wrapper .wp-block-columns .help-cards-wrapper p:first-child {
  display: inline-block;
  margin-bottom: 0;
  text-align: center;
  font-weight: bold;
  width: 24px;
  height: 24px;
  background-color: white !important;
}
main .info-details-wrapper .wp-block-columns .help-cards-wrapper p:last-child {
  margin: 24px;
  padding: 0 24px 24px 24px;
}
main .info-details-wrapper .register-btn {
  margin-top: 80px;
  padding: 0 !important;
  width: 100%;
}
main .mb-scrollStapelVertical .wp-block-media-text {
  background-color: #fff;
}
main .exam-clock-wrapper {
  --ex-clock-thickness: 15px;
  --ex-clock-bg-empty:#fff;
}
main .exam-clock-wrapper * {
  transition: all 0.3s ease;
}
main .exam-clock-wrapper {
  --progress-angle:360deg;
  width: 100%;
  padding: var(--memy-padding-small-dashbox);
}
main .exam-clock-wrapper .time-information-wrapper {
  gap: var(--memy-padding-root);
}
main .exam-clock-wrapper .time-information-wrapper .exam-clock-animation {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--memy-clock-outher-height);
  height: var(--memy-clock-outher-height);
  /*Kreis-Progress*/
}
main .exam-clock-wrapper .time-information-wrapper .exam-clock-animation .progress-container {
  position: relative;
  width: 100%;
  height: 100%;
}
main .exam-clock-wrapper .time-information-wrapper .exam-clock-animation .progress-container.is-2 {
  position: absolute;
  width: var(--memy-clock-middle-height);
  height: var(--memy-clock-middle-height);
}
main .exam-clock-wrapper .time-information-wrapper .exam-clock-animation .progress-container.is-3 {
  position: absolute;
  width: var(--memy-clock-inner-height);
  height: var(--memy-clock-inner-height);
}
main .exam-clock-wrapper .time-information-wrapper .exam-clock-animation .progress-container .progress-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: var(--ex-clock-bg-full-1);
  -webkit-mask: radial-gradient(closest-side, transparent calc(100% - var(--ex-clock-thickness)), white calc(100% - var(--ex-clock-thickness)));
          mask: radial-gradient(closest-side, transparent calc(100% - var(--ex-clock-thickness)), white calc(100% - var(--ex-clock-thickness)));
}
main .exam-clock-wrapper .time-information-wrapper .exam-clock-animation .progress-container .progress-bg.is-2 {
  background: var(--ex-clock-bg-full-2);
}
main .exam-clock-wrapper .time-information-wrapper .exam-clock-animation .progress-container .progress-bg.is-2 {
  background: var(--ex-clock-bg-full-2);
}
main .exam-clock-wrapper .time-information-wrapper .exam-clock-animation .progress-container .progress-bg.is-3 {
  background: var(--ex-clock-bg-full-3);
}
main .exam-clock-wrapper .time-information-wrapper .exam-clock-animation .progress-container .progress-fill {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: conic-gradient(from 0deg, var(--ex-clock-bg-empty) 0deg, var(--ex-clock-bg-empty) calc(var(--progress-angle, 0deg) / 1.02), var(--ex-clock-bg-full-1) var(--progress-angle, 0deg), transparent var(--progress-angle, 0deg));
  -webkit-mask: radial-gradient(closest-side, transparent calc(100% - var(--ex-clock-thickness)), white calc(100% - var(--ex-clock-thickness)));
          mask: radial-gradient(closest-side, transparent calc(100% - var(--ex-clock-thickness)), white calc(100% - var(--ex-clock-thickness)));
  /* Animation nur beim Start */
  transition: --progress-angle 2s ease-out;
}
main .exam-clock-wrapper .time-information-wrapper {
  /* Unterstützung für CSS Custom Property Animation */
}
@property --progress-angle {
  main .exam-clock-wrapper .time-information-wrapper {
    syntax: "<angle>";
    inherits: false;
    initial-value: 0deg;
  }
}
main .exam-clock-animation {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--memy-clock-outher-height);
  height: var(--memy-clock-outher-height);
  /*Kreis-Progress*/
}
main .exam-clock-animation .progress-container {
  position: relative;
  width: 100%;
  height: 100%;
}
main .exam-clock-animation .progress-container.is-2 {
  position: absolute;
  width: var(--memy-clock-middle-height);
  height: var(--memy-clock-middle-height);
}
main .exam-clock-animation .progress-container.is-3 {
  position: absolute;
  width: var(--memy-clock-inner-height);
  height: var(--memy-clock-inner-height);
}
main .exam-clock-animation .progress-container .progress-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: var(--ex-clock-bg-full-1);
  -webkit-mask: radial-gradient(closest-side, transparent calc(100% - var(--ex-clock-thickness)), white calc(100% - var(--ex-clock-thickness)));
          mask: radial-gradient(closest-side, transparent calc(100% - var(--ex-clock-thickness)), white calc(100% - var(--ex-clock-thickness)));
}
main .exam-clock-animation .progress-container .progress-bg.is-2 {
  background: var(--ex-clock-bg-full-2);
}
main .exam-clock-animation .progress-container .progress-bg.is-2 {
  background: var(--ex-clock-bg-full-2);
}
main .exam-clock-animation .progress-container .progress-bg.is-3 {
  background: var(--ex-clock-bg-full-3);
}
main .exam-clock-animation .progress-container .progress-fill {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: conic-gradient(from 0deg, var(--ex-clock-bg-empty) 0deg, var(--ex-clock-bg-empty) calc(var(--progress-angle, 0deg) / 1.02), var(--ex-clock-bg-full-1) var(--progress-angle, 0deg), transparent var(--progress-angle, 0deg));
  -webkit-mask: radial-gradient(closest-side, transparent calc(100% - var(--ex-clock-thickness)), white calc(100% - var(--ex-clock-thickness)));
          mask: radial-gradient(closest-side, transparent calc(100% - var(--ex-clock-thickness)), white calc(100% - var(--ex-clock-thickness)));
  /* Animation nur beim Start */
  transition: --progress-angle 2s ease-out;
}
main {
  /* Unterstützung für CSS Custom Property Animation */
}
@property --progress-angle {
  main {
    syntax: "<angle>";
    inherits: false;
    initial-value: 0deg;
  }
}

/*Icons*/
.mmsi-icon {
  width: 18px;
  height: 20px; /* => LineHeight*/
  display: inline-block;
  background-size: 36px;
  background-repeat: no-repeat;
  background-position: center;
  transition: all 0.3s ease;
}
.mmsi-icon.password-visible {
  background-image: url("../icons/MMSI_Icon_VISIBLE.svg");
  top: -3px;
}
.mmsi-icon.password-hide {
  background-image: url("../icons/MMSI_Icon_NOT-VISIBLE.svg");
  top: -3px;
}
.mmsi-icon.pfeil {
  background-image: url("../icons/MMSI_Icon_PFEIL-BUTTON.svg");
}/*# sourceMappingURL=frontpage.css.map */