.elementor-kit-7{--e-global-color-primary:#1F3A5F;--e-global-color-secondary:#3F6FB1;--e-global-color-text:#1E1E1E;--e-global-color-accent:#2FAE83;--e-global-color-c5c4033:#F2A541;--e-global-color-f7b6e47:#D64545;--e-global-color-7991269:#F5F7FA;--e-global-color-de4af2a:#FFFFFF;--e-global-color-1da40d7:#E1E6EF;--e-global-color-6f892b5:#6B7280;--e-global-color-2736262:#1F3A5F;--e-global-typography-primary-font-family:"Inter";--e-global-typography-primary-font-size:1.125rem;--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Inter";--e-global-typography-secondary-font-size:1.125rem;--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Inter";--e-global-typography-text-font-size:1.125rem;--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Inter";--e-global-typography-accent-font-size:1.125rem;--e-global-typography-accent-font-weight:500;background-color:var( --e-global-color-7991269 );}.elementor-kit-7 button,.elementor-kit-7 input[type="button"],.elementor-kit-7 input[type="submit"],.elementor-kit-7 .elementor-button{background-color:var( --e-global-color-primary );color:var( --e-global-color-de4af2a );}.elementor-kit-7 button:hover,.elementor-kit-7 button:focus,.elementor-kit-7 input[type="button"]:hover,.elementor-kit-7 input[type="button"]:focus,.elementor-kit-7 input[type="submit"]:hover,.elementor-kit-7 input[type="submit"]:focus,.elementor-kit-7 .elementor-button:hover,.elementor-kit-7 .elementor-button:focus{background-color:var( --e-global-color-secondary );color:var( --e-global-color-de4af2a );}.elementor-kit-7 e-page-transition{background-color:#FFBC7D;}.elementor-kit-7 a{color:var( --e-global-color-f7b6e47 );}.elementor-kit-7 h1{color:var( --e-global-color-2736262 );}.elementor-kit-7 h2{color:var( --e-global-color-2736262 );}.elementor-kit-7 h3{color:var( --e-global-color-2736262 );}.elementor-kit-7 h4{color:var( --e-global-color-2736262 );}.elementor-kit-7 label{color:var( --e-global-color-primary );}.elementor-kit-7 input:not([type="button"]):not([type="submit"]),.elementor-kit-7 textarea,.elementor-kit-7 .elementor-field-textual{border-style:solid;border-width:1px 1px 1px 1px;border-color:var( --e-global-color-1da40d7 );border-radius:5px 5px 5px 5px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ========================================================= DARK MODE – Elementor + Gravity Forms Aktiv, sobald gesetzt ist ========================================================= */ /* 1) Design Tokens (Dark Palette) */ body.dark-mode{ --dm-bg: #0F172A; /* Page background */ --dm-surface: #111827; /* Cards / boxes */ --dm-surface-2:#0B1220; /* Deep surface */ --dm-border: #1F2937; /* Borders / dividers */ --dm-text: #E5E7EB; /* Primary text */ --dm-muted:#9CA3AF; /* Secondary text */ --dm-heading:#F9FAFB; /* Headings */ --dm-primary:#3F6FB1; /* Primary actions */ --dm-primary-2:#60A5FA; /* Hover / highlights */ --dm-accent:#2FAE83; /* Success / completed */ --dm-warn:#F2A541; /* Warning */ --dm-danger:#D64545; /* Error */ background: var(--dm-bg); color: var(--dm-text); color-scheme: dark; /* improves native inputs on supporting browsers */ } /* 2) Elementor Global Colors override (works if you use Global Colors) */ body.dark-mode{ --e-global-color-primary: var(--dm-primary); --e-global-color-secondary: var(--dm-primary-2); --e-global-color-text: var(--dm-text); --e-global-color-accent: var(--dm-accent); } /* 3) Base typography */ body.dark-mode h1, body.dark-mode h2, body.dark-mode h3, body.dark-mode h4, body.dark-mode h5, body.dark-mode h6{ color: var(--dm-heading); } body.dark-mode p, body.dark-mode li, body.dark-mode span, body.dark-mode small{ color: var(--dm-text); } body.dark-mode .elementor-text-editor, body.dark-mode .elementor-widget-text-editor{ color: var(--dm-text); } body.dark-mode a{ color: var(--dm-primary-2); } body.dark-mode a:hover{ color: var(--dm-primary); } /* 4) Page sections, containers, cards */ body.dark-mode .elementor-section, body.dark-mode .elementor-container, body.dark-mode .elementor-column, body.dark-mode .elementor-widget-wrap{ /* don't force backgrounds globally (Elementor uses many nested wraps) */ } /* Common “card-like” areas */ body.dark-mode .e-con, body.dark-mode .elementor-element.elementor-widget, body.dark-mode .elementor-widget-container{ /* leave as-is unless you use boxed layouts; the next rules cover typical boxes */ } body.dark-mode .elementor-accordion .elementor-accordion-item, body.dark-mode .elementor-toggle .elementor-toggle-item, body.dark-mode .elementor-tabs .elementor-tab-content, body.dark-mode .elementor-tabs .elementor-tab-title{ background: var(--dm-surface); border-color: var(--dm-border); color: var(--dm-text); } body.dark-mode .elementor-divider-separator{ border-color: var(--dm-border) !important; } /* 5) Buttons (Elementor + generic) */ body.dark-mode .elementor-button, body.dark-mode button, body.dark-mode input[type="button"], body.dark-mode input[type="submit"]{ background: var(--dm-primary); color: #fff; border-color: transparent; } body.dark-mode .elementor-button:hover, body.dark-mode button:hover, body.dark-mode input[type="button"]:hover, body.dark-mode input[type="submit"]:hover{ background: var(--dm-primary-2); color: #fff; } /* Secondary / outline buttons often used in portals */ body.dark-mode .is-style-outline .wp-element-button, body.dark-mode .elementor-button.elementor-button-link{ color: #fff; } /* 6) Inputs + form fields (generic) */ body.dark-mode input[type="text"], body.dark-mode input[type="email"], body.dark-mode input[type="tel"], body.dark-mode input[type="url"], body.dark-mode input[type="password"], body.dark-mode input[type="number"], body.dark-mode input[type="search"], body.dark-mode textarea, body.dark-mode select{ background: var(--dm-surface); color: var(--dm-text); border: 1px solid var(--dm-border); } body.dark-mode input::placeholder, body.dark-mode textarea::placeholder{ color: var(--dm-muted); opacity: 1; } body.dark-mode input:focus, body.dark-mode textarea:focus, body.dark-mode select:focus{ outline: none; border-color: var(--dm-primary-2); box-shadow: 0 0 0 2px rgba(96,165,250,.25); } /* 7) Gravity Forms – core wrappers */ body.dark-mode .gform_wrapper, body.dark-mode .gform_wrapper *{ /* Keep GF readable without brute-forcing every child */ } body.dark-mode .gform_wrapper .gform_heading, body.dark-mode .gform_wrapper .gform_body, body.dark-mode .gform_wrapper .gform_footer{ color: var(--dm-text); } /* Field labels & descriptions */ body.dark-mode .gform_wrapper .gfield_label, body.dark-mode .gform_wrapper label, body.dark-mode .gform_wrapper .gfield_description, body.dark-mode .gform_wrapper .validation_message, body.dark-mode .gform_wrapper .gfield_required{ color: var(--dm-text); } body.dark-mode .gform_wrapper .gfield_description{ color: var(--dm-muted); } /* Inputs (Gravity Forms uses these classes widely) */ body.dark-mode .gform_wrapper input[type="text"], body.dark-mode .gform_wrapper input[type="email"], body.dark-mode .gform_wrapper input[type="tel"], body.dark-mode .gform_wrapper input[type="url"], body.dark-mode .gform_wrapper input[type="password"], body.dark-mode .gform_wrapper input[type="number"], body.dark-mode .gform_wrapper input[type="search"], body.dark-mode .gform_wrapper textarea, body.dark-mode .gform_wrapper select{ background: var(--dm-surface); color: var(--dm-text); border: 1px solid var(--dm-border); } /* Checkboxes / Radios (label color + spacing) */ body.dark-mode .gform_wrapper .gfield_checkbox label, body.dark-mode .gform_wrapper .gfield_radio label{ color: var(--dm-text); } /* Section breaks */ body.dark-mode .gform_wrapper .gsection{ border-bottom: 1px solid var(--dm-border); } body.dark-mode .gform_wrapper .gsection_title{ color: var(--dm-heading); } body.dark-mode .gform_wrapper .gsection_description{ color: var(--dm-muted); } /* Validation */ body.dark-mode .gform_wrapper .gfield_error input, body.dark-mode .gform_wrapper .gfield_error textarea, body.dark-mode .gform_wrapper .gfield_error select{ border-color: var(--dm-danger) !important; } body.dark-mode .gform_wrapper .validation_error, body.dark-mode .gform_wrapper .gform_validation_errors{ background: rgba(214,69,69,.12); border: 1px solid rgba(214,69,69,.35); color: var(--dm-heading); } /* Confirmation message */ body.dark-mode .gform_confirmation_message{ background: rgba(47,174,131,.12); border: 1px solid rgba(47,174,131,.35); color: var(--dm-heading); padding: 12px 14px; border-radius: 10px; } /* Progress bar (multi-page forms) */ body.dark-mode .gform_wrapper .gf_progressbar{ background: var(--dm-surface); border: 1px solid var(--dm-border); } body.dark-mode .gform_wrapper .gf_progressbar_percentage{ background: var(--dm-accent); color: #fff; } /* GF Buttons */ body.dark-mode .gform_wrapper .gform_button, body.dark-mode .gform_wrapper .gform_previous_button, body.dark-mode .gform_wrapper .gform_next_button{ background: var(--dm-primary); color: #fff; border: 0; } body.dark-mode .gform_wrapper .gform_button:hover, body.dark-mode .gform_wrapper .gform_previous_button:hover, body.dark-mode .gform_wrapper .gform_next_button:hover{ background: var(--dm-primary-2); } /* 8) Tables / Lists (useful for GravityView too) */ body.dark-mode table{ color: var(--dm-text); border-color: var(--dm-border); } body.dark-mode th{ background: var(--dm-surface-2); color: var(--dm-heading); border-color: var(--dm-border); } body.dark-mode td{ border-color: var(--dm-border); } body.dark-mode tr:nth-child(even) td{ background: rgba(17,24,39,.55); } /* 9) Notices / badges (optional utility classes) */ body.dark-mode .dm-badge-success{ background: rgba(47,174,131,.15); color: var(--dm-heading); border:1px solid rgba(47,174,131,.35); } body.dark-mode .dm-badge-warn{ background: rgba(242,165,65,.15); color: var(--dm-heading); border:1px solid rgba(242,165,65,.35); } body.dark-mode .dm-badge-danger{ background: rgba(214,69,69,.15); color: var(--dm-heading); border:1px solid rgba(214,69,69,.35); } /* 10) Optional: smooth transitions */ body, body *{ transition: background-color .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease; }/* End custom CSS */ /* Start Custom Fonts CSS */@font-face { font-family: 'Inter'; font-style: normal; font-weight: normal; font-display: auto; src: url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-regular.eot'); src: url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-regular.eot?#iefix') format('embedded-opentype'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-regular.woff2') format('woff2'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-regular.woff') format('woff'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-regular.ttf') format('truetype'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-regular.svg#Inter') format('svg'); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: auto; src: url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-500.eot'); src: url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-500.eot?#iefix') format('embedded-opentype'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-500.woff2') format('woff2'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-500.woff') format('woff'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-500.ttf') format('truetype'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-500.svg#Inter') format('svg'); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: auto; src: url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-600.eot'); src: url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-600.eot?#iefix') format('embedded-opentype'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-600.woff2') format('woff2'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-600.woff') format('woff'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-600.ttf') format('truetype'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-600.svg#Inter') format('svg'); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: auto; src: url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-700.eot'); src: url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-700.eot?#iefix') format('embedded-opentype'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-700.woff2') format('woff2'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-700.woff') format('woff'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-700.ttf') format('truetype'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-700.svg#Inter') format('svg'); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 800; font-display: auto; src: url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-800.eot'); src: url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-800.eot?#iefix') format('embedded-opentype'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-800.woff2') format('woff2'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-800.woff') format('woff'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-800.ttf') format('truetype'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-800.svg#Inter') format('svg'); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 900; font-display: auto; src: url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-900.eot'); src: url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-900.eot?#iefix') format('embedded-opentype'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-900.woff2') format('woff2'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-900.woff') format('woff'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-900.ttf') format('truetype'), url('https://app.fixyourweb.de/wp-content/uploads/2026/01/inter-v20-latin-900.svg#Inter') format('svg'); } /* End Custom Fonts CSS */