@charset "UTF-8";
/*
Theme Name: Forum Direktfinanz
Author: STUDIOHORN
Author URI: https://studio-horn.de
Description: Das globale Forum Direktfinanz Theme
[...]
Template: twentytwentyfive
[...]
*/
/*== General SCSS ==*/
/*== General ==*/
@font-face {
  font-family: "Outfit";
  src: url("assets/fonts/Outfit-Regular.eot") format("embedded-opentype");
  src: url("assets/fonts/Outfit-Regular.woff") format("woff"), url("assets/fonts/Outfit-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Outfit";
  src: url("assets/fonts/Outfit-SemiBold.eot") format("embedded-opentype");
  src: url("assets/fonts/Outfit-SemiBold.woff") format("woff"), url("assets/fonts/Outfit-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Outfit";
  src: url("assets/fonts/Outfit-Bold.eot") format("embedded-opentype");
  src: url("assets/fonts/Outfit-Bold.woff") format("woff"), url("assets/fonts/Outfit-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Outfit";
  src: url("assets/fonts/Outfit-ExtraBold.eot") format("embedded-opentype");
  src: url("assets/fonts/Outfit-ExtraBold.woff") format("woff"), url("assets/fonts/Outfit-ExtraBold.woff2") format("woff2");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
main {
  margin-top: 0 !important;
}
h1, h2, h3, h4, h5, h6 {
  font-family: "Outfit", sans-serif !important;
  font-weight: 700;
  font-style: normal;
  letter-spacing: unset !important;
  margin-bottom: var(--wp--preset--spacing--20);
}
p, a, li, div {
  font-family: "Outfit", sans-serif !important;
  letter-spacing: unset !important;
  -webkit-hyphens: auto;
  font-size: var(--fs-p);
  line-height: var(--lh-p);
  font-weight: 400;
}
strong {
  font-weight: 700 !important;
  line-height: var(--lh-p-strong);
}
h1 {
  font-size: var(--fs-h1);
  line-height: var(--lh-h1);
}
h2 {
  font-size: var(--fs-h2);
  line-height: var(--lh-h2);
}
h3 {
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
}
h4 {
  font-size: var(--fs-h4);
  line-height: var(--lh-h4);
}
h5 {
  font-size: var(--fs-h5);
  line-height: var(--lh-h5);
}
h6 {
  font-size: var(--fs-h5);
  line-height: var(--lh-h5);
}
a {
  text-decoration: none !important;
  cursor: pointer;
  font-size: inherit;
  font-weight: inherit !important;
  color: inherit !important;
}
p a, .text-link {
  font-size: var(--fs-text-link);
  line-height: var(--lh-text-link);
  text-decoration: underline !important;
}
:where(.wp-site-blocks *:focus) {
  outline: none;
}
.fs-h4 {
  font-size: var(--fs-h4);
  line-height: 1.25em !important;
}
.fs-30 {
  font-size: var(--fs-h5);
}
.fs-20 {
  font-size: var(--fs-20);
}
:root {
  --fodi-white: #FFFFFF;
  --fodi-light: #F4F5F7;
  --fodi-blue: #5FC2D6;
  --fodi-red: #E21F1D;
  --fodi-dark-blue: #1D293E;
  --primary: var(--fodi-dark-blue);
  --secondary: var(--fodi-blue);
  /* Bitte Schriftgrößen nun in diesem Format anlegen */
  --fs-h1: clamp(30px, 1.8750rem + ((1vw - 3.2px) * 4.018), 48px);
  --fs-h2: clamp(22px, 1.3750rem + ((1vw - 3.2px) * 3.125), 36px);
  --fs-h3: clamp(19px, 1.1875rem + ((1vw - 3.2px) * 2.009), 28px);
  --fs-h4: clamp(17px, 1.0625rem + ((1vw - 3.2px) * 1.116), 22px);
  --fs-h5: clamp(15px, 0.9375rem + ((1vw - 3.2px) * 0.670), 18px);
  --fs-p-small: clamp(12px, 0.7500rem + ((1vw - 3.2px) * 0.446), 14px);
  --fs-p: clamp(14px, 0.8750rem + ((1vw - 3.2px) * 0.446), 16px);
  --fs-button: clamp(14px, 0.8750rem + ((1vw - 3.2px) * 0.446), 16px);
  --fs-text-link: clamp(14px, 0.8750rem + ((1vw - 3.2px) * 0.446), 16px);
  --fs-p-big: var(--fs-h4);
  --fs-20: var(--fs-h5);
  --lh-h1: clamp(34px, 2.1250rem + ((1vw - 3.2px) * 4.911), 56px);
  --lh-h2: clamp(28px, 1.7500rem + ((1vw - 3.2px) * 2.679), 40px);
  --lh-h3: clamp(23px, 1.4375rem + ((1vw - 3.2px) * 2.902), 36px);
  --lh-h4: clamp(24px, 1.5000rem + ((1vw - 3.2px) * 1.339), 30px);
  --lh-h5: clamp(20px, 1.2500rem + ((1vw - 3.2px) * 1.339), 26px);
  --lh-p-small: clamp(20px, 1.2500rem + ((1vw - 3.2px) * 0.446), 22px);
  --lh-p: clamp(20px, 1.2500rem + ((1vw - 3.2px) * 0.893), 24px);
  --lh-p-strong: clamp(20px, 1.2500rem + ((1vw - 3.2px) * 0.446), 22px);
  --lh-button: 22px;
  --lh-text-link: clamp(20px, 1.2500rem + ((1vw - 3.2px) * 0.446), 22px);
}
@media (min-width: 768px) {
  :root {
    --fs-h1: clamp(48px, 3.0000rem + ((1vw - 7.68px) * 3.704), 64px);
    --fs-h2: clamp(36px, 2.2500rem + ((1vw - 7.68px) * 1.389), 42px);
    --fs-h3: clamp(28px, 1.7500rem + ((1vw - 7.68px) * 1.389), 34px);
    --fs-h4: clamp(22px, 1.3750rem + ((1vw - 7.68px) * 0.926), 26px);
    --fs-h5: clamp(18px, 1.1250rem + ((1vw - 7.68px) * 0.463), 20px);
    --fs-p-small: 14px;
    --fs-p: clamp(16px, 1.0000rem + ((1vw - 7.68px) * 0.231), 17px);
    --fs-button: clamp(16px, 1.0000rem + ((1vw - 7.68px) * 0.463), 18px);
    --fs-text-link: clamp(16px, 1.0000rem + ((1vw - 7.68px) * 0.231), 17px);
    --lh-h1: clamp(56px, 3.5000rem + ((1vw - 7.68px) * 3.241), 70px);
    --lh-h2: clamp(40px, 2.5000rem + ((1vw - 7.68px) * 2.315), 50px);
    --lh-h3: clamp(36px, 2.2500rem + ((1vw - 7.68px) * 0.926), 40px);
    --lh-h4: clamp(30px, 1.8750rem + ((1vw - 7.68px) * 0.926), 34px);
    --lh-h5: clamp(26px, 1.6250rem + ((1vw - 7.68px) * 0.463), 28px);
    --lh-p-small: 22px;
    --lh-p: clamp(24px, 1.5000rem + ((1vw - 7.68px) * 0.463), 26px);
    --lh-p-strong: clamp(22px, 1.3750rem + ((1vw - 7.68px) * 0.926), 26px);
    --lh-button: clamp(22px, 1.3750rem + ((1vw - 7.68px) * 0.463), 24px);
    --lh-text-link: clamp(22px, 1.3750rem + ((1vw - 7.68px) * 0.926), 26px);
  }
}
/* Hiermit können die responsive Spacings von Wordpress angepasst werden

@media(max-width: 1200px) {
  body {
    --wp--preset--spacing--10: 1rem !important;
    --wp--preset--spacing--30: min(1.5rem, 2.0vw) !important;
    --wp--preset--spacing--40: min(2rem, 3vw) !important;
    --wp--preset--spacing--50: min(4.5rem, 6vw) !important;
    --wp--preset--spacing--60: min(6.5rem, 8vw) !important;
  }
} */
.responsive-padding-x {
  padding-right: 1rem !important;
  padding-left: 1rem !important;
}
@media (min-width: 768px) {
  .responsive-padding-x {
    padding-right: 1.5rem !important;
    padding-left: 1.5rem !important;
  }
}
@media (min-width: 992px) {
  .responsive-padding-x {
    padding-right: 2rem !important;
    padding-left: 2rem !important;
  }
}
.img-w-100 img {
  width: 100% !important;
}
.wp-block-cover {
  overflow: hidden;
}
.fw-blod {
  font-weight: 700 !important;
}
.fw-semibold {
  font-weight: 600 !important;
}
.fw-regular {
  font-weight: 400 !important;
}
.text-primary {
  color: var(--primary) !important;
}
.text-secondary {
  color: var(--secondary) !important;
}
.text-right {
  text-align: right;
}
.text-left {
  text-align: left;
}
.wp-block-button .wp-block-button__link {
  font-family: "Outfit", sans-serif !important;
  font-size: var(--fs-button);
  font-weight: 700;
  line-height: var(--lh-button);
}
.wp-site-blocks {
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  max-width: 100vw;
  overflow: hidden;
}
.hyphens-auto {
  hyphens: auto !important;
  -webkit-hyphens: auto !important;
}
.wp-site-blocks .alignfull, .wp-site-blocks > .wp-block-group.has-background, .wp-site-blocks > .wp-block-cover, .wp-site-blocks > .wp-block-template-part > .wp-block-group.has-background, .wp-site-blocks > .wp-block-template-part > .wp-block-cover, body > .is-root-container > .wp-block-cover, body > .is-root-container > .wp-block-template-part > .wp-block-group.has-background, body > .is-root-container > .wp-block-template-part > .wp-block-cover, .is-root-container .wp-block[data-align="full"] {
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: unset;
}
.border-primary {
  border-color: var(--primary) !important;
}
.border-secondary {
  border-color: var(--secondary) !important;
}
.entry-content {
  margin-top: 0 !important;
}
@media (max-width: 992px) {
  .center-animated-text-group .spacer-10vw {
    height: 20vw !important;
  }
  .center-animated-text-group .spacer-18vw {
    height: 30vw !important;
  }
}
.mw-unset {
  max-width: unset;
}
.mw-unset img {
  max-width: unset;
}
.wp-block-button__link.has-primary-color {
  transition: 0.25s;
}
.wp-block-button__link.has-primary-color:hover {
  background-color: var(--primary) !important;
  color: white !important;
  border-color: var(--primary) !important;
}
/*== Layout ==*/
table td {
  padding-left: 0 !important;
  padding-right: 0.25em !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
table * {
  font-size: var(--fs-p);
}
/*== Layout END ==*/
/*== z-index Styling ==*/
.z-99 {
  z-index: 99 !important;
  position: relative;
}
.z-98 {
  z-index: 98 !important;
  position: relative;
}
.z-97 {
  z-index: 97 !important;
  position: relative;
}
.z-96 {
  z-index: 96 !important;
  position: relative;
}
.z-95 {
  z-index: 95 !important;
  position: relative;
}
.z-94 {
  z-index: 94 !important;
  position: relative;
}
.h-100 {
  height: -webkit-fill-available !important;
}
.no-underline a, .no-underline a span {
  text-decoration: none !important;
}
/*== WPForms Styling ==*/
.wpforms-container input, .wpforms-container textarea {
  border-color: var(--secondary) !important;
  border-radius: 0px !important;
}
.wpforms-container legend, .wpforms-container label {
  color: var(--secondary) !important;
}
.wpforms-container button {
  padding: 10px 15px !important;
  border-radius: 0 !important;
  border: solid 1px var(--primary) !important;
  background-color: var(--primary) !important;
  color: white !important;
  font-family: "Outfit", sans-serif;
  font-weight: 700 !important;
  transition: 0.25s;
  font-size: var(--fs-button) !important;
  line-height: var(--lh-button) !important;
}
.wpforms-container button:hover {
  transform: scale(1.1);
}
/*== WPForms Styling END ==*/
.grecaptcha-badge {
  opacity: 0 !important;
}
/*== General END ==*/
/*== Navigation ==*/
/*== Navigation END ==*/
/*== Header ==*/
/*== Header END ==*/
/*== Footer ==*/
footer .footer-links a {
  font-size: var(--wp--preset--font-size--fs-p-small) !important;
  font-weight: 700 !important;
}
/*== Footer END ==*/
/*== Site specific SCSS ==*/
/*== content ==*/
/*== content END ==*/
/*== Blog Stying ==*/
/*== Module specific SCSS ==*/