/* -------------------------------
FONTS / PLUGINS 
------------------------------- */
/* Font Awesome Free 6.2.0 */
@import url("all.min.css");

/* Bootstrap  v5.3.2  */
@import url("bootstrap.min.css");

/* gp Cookiebanner v2 */
@import url("https://cdn.gruenphase.com/gp-cookie-consent/v2/style.css");

/* Fonts */
@import url("../webfonts/SourceSansPro/SourceSansPro.css");
@import url("../webfonts/Impact/Impact.css");

/* -------------------------------
BOOTSTRAP ANPASSUNGEN 
------------------------------- */

:root,
[data-bs-theme=light] {
    --gp-color-primary: rgb(51, 183, 183);
    --gp-color-primary-light: rgb(4, 154, 200);
    --gp-color-primary-dark: rgb(3, 91, 133);

    --gp-color-primary-rgb: 51, 183, 183;
    --gp-color-primary-light-rgb: 4, 154, 200;
    --gp-color-primary-dark-rgb: 3, 91, 133;

    --gp-color-secondary: rgb(158, 154, 153);
    --gp-color-secondary-light: rgb(222, 225, 227);
    --gp-color-secondary-dark: rgb(116, 116, 116);

    --gp-color-secondary-rgb: 158, 154, 153;
    --gp-color-secondary-light-rgb: 222, 225, 227;
    --gp-color-secondary-dark-rgb: 116, 116, 116;

    --gp-color-tertiary: var(--gp-color-secondary);
    --gp-color-tertiary-dark: var(--gp-color-secondary-dark);
    --gp-color-tertiary-light: var(--gp-color-secondary-light);
    --gp-color-tertiary-rgb: var(--gp-color-secondary-rgb);
    --gp-color-tertiary-dark-rgb: var(--gp-color-secondary-dark-rgb);


    --gp-color-dark: rgb(84, 84, 84);
    --gp-color-dark-rgb: 84, 84, 84;

    /* --gp-color-light: ; */

    --bs-white: #dce1e1;
    --bs-white_2: #ffffff;


    /* --bs-link-color: #7C7C7B;
    --bs-link-color-rgb: 124, 124, 123;
    --bs-link-decoration: underline;
    --bs-link-hover-color: #929292;
    --bs-link-hover-color-rgb: 146, 146, 146;
    */
    --bs-breakpoint-xs: 375px ; 



    --bs-blue: #0d6efd;
    --bs-indigo: #6610f2;
    --bs-purple: #6f42c1;
    --bs-pink: #d63384;
    --bs-red: #dc3545;
    --bs-orange: #fd7e14;
    --bs-yellow: #ffc107;
    --bs-green: #198754;
    --bs-teal: #20c997;
    --bs-cyan: #0dcaf0;
    --bs-black: var(--gp-color-dark);
    --bs-white: #fff;
    --bs-gray: #6c757d;
    --bs-gray-dark: #343a40;
    --bs-gray-100: #f8f9fa;
    --bs-gray-200: #e9ecef;
    --bs-gray-300: #dee2e6;
    --bs-gray-400: #ced4da;
    --bs-gray-500: #adb5bd;
    --bs-gray-600: #6c757d;
    --bs-gray-700: #495057;
    --bs-gray-800: #343a40;
    --bs-gray-900: #212529;
    --bs-primary: var(--gp-color-primary);
    --bs-secondary: var(--gp-color-secondary);
    --bs-success: #198754;
    --bs-info: #0dcaf0;
    --bs-warning: #ffc107;
    --bs-danger: #dc3545;
    --bs-light: #f8f9fa;
    --bs-dark: var(--gp-color-dark);
    --bs-primary-rgb: var(--gp-color-primary-rgb);
    --bs-secondary-rgb: var(--gp-color-secondary-rgb);
    --bs-success-rgb: 25, 135, 84;
    --bs-info-rgb: 13, 202, 240;
    --bs-warning-rgb: 255, 193, 7;
    --bs-danger-rgb: 220, 53, 69;
    --bs-light-rgb: 248, 249, 250;
    --bs-dark-rgb: var(--gp-color-dark-rgb);
    --bs-primary-text-emphasis: var(--gp-color-primary-dark);
    --bs-secondary-text-emphasis: var(--gp-color-secondary-dark);
    --bs-success-text-emphasis: #0a3622;
    --bs-info-text-emphasis: #055160;
    --bs-warning-text-emphasis: #664d03;
    --bs-danger-text-emphasis: #58151c;
    --bs-light-text-emphasis: #495057;
    --bs-dark-text-emphasis: #495057;
    --bs-primary-bg-subtle: var(--gp-color-primary-light);
    --bs-secondary-bg-subtle: var(--gp-color-secondary-light);
    --bs-success-bg-subtle: #d1e7dd;
    --bs-info-bg-subtle: #cff4fc;
    --bs-warning-bg-subtle: #fff3cd;
    --bs-danger-bg-subtle: #f8d7da;
    --bs-light-bg-subtle: #fcfcfd;
    --bs-dark-bg-subtle: #ced4da;
    --bs-primary-border-subtle: #9ec5fe;
    --bs-secondary-border-subtle: #c4c8cb;
    --bs-success-border-subtle: #a3cfbb;
    --bs-info-border-subtle: #9eeaf9;
    --bs-warning-border-subtle: #ffe69c;
    --bs-danger-border-subtle: #f1aeb5;
    --bs-light-border-subtle: #e9ecef;
    --bs-dark-border-subtle: #adb5bd;
    --bs-white-rgb: 255, 255, 255;
    --bs-black-rgb: 0, 0, 0;
    --bs-font-sans-serif: PT_Sans, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
    --bs-body-font-family: var(--bs-font-sans-serif);
    --bs-body-font-size: 1rem;
    --bs-body-font-weight: 400;
    --bs-body-line-height: 1.5;
    --bs-body-color: #212529;
    --bs-body-color-rgb: 33, 37, 41;
    --bs-body-bg: #fff;
    --bs-body-bg-rgb: 255, 255, 255;
    --bs-emphasis-color: #000;
    --bs-emphasis-color-rgb: 0, 0, 0;
    --bs-secondary-color: rgba(33, 37, 41, 0.75);
    --bs-secondary-color-rgb: 33, 37, 41;
    --bs-secondary-bg: #e9ecef;
    --bs-secondary-bg-rgb: 233, 236, 239;
    --bs-tertiary-color: rgba(33, 37, 41, 0.5);
    --bs-tertiary-color-rgb: 33, 37, 41;
    --bs-tertiary-bg: #f8f9fa;
    --bs-tertiary-bg-rgb: 248, 249, 250;
    --bs-heading-color: inherit;
    --bs-link-color: var(--gp-color-primary);
    --bs-link-color-rgb: var(--gp-color-primary-dark-rgb);
    --bs-link-decoration: none;
    --bs-link-hover-color: var(--gp-color-primary-dark);
    --bs-link-hover-color-rgb: var(--gp-color-primary-dark-rgb);
    --bs-code-color: #d63384;
    --bs-highlight-bg: #fff3cd;
    --bs-border-width: 1px;
    --bs-border-style: solid;
    --bs-border-color: #dee2e6;
    --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
    --bs-border-radius: 0.375rem;
    --bs-border-radius-sm: 0.25rem;
    --bs-border-radius-lg: 0.5rem;
    --bs-border-radius-xl: 1rem;
    --bs-border-radius-xxl: 2rem;
    --bs-border-radius-2xl: var(--bs-border-radius-xxl);
    --bs-border-radius-pill: 50rem;
    --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
    --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
    --bs-focus-ring-width: 0.25rem;
    --bs-focus-ring-opacity: 0.25;
    --bs-focus-ring-color: rgba(13, 110, 253, 0.25);
    --bs-form-valid-color: #198754;
    --bs-form-valid-border-color: #198754;
    --bs-form-invalid-color: #dc3545;
    --bs-form-invalid-border-color: #dc3545
}

.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--gp-color-primary);
    --bs-btn-border-color: var(--gp-color-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--gp-color-primary-dark);
    --bs-btn-hover-border-color: var(--gp-color-primary-dark);
    --bs-btn-focus-shadow-rgb: var(--gp-color-dark-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--gp-color-primary-dark);
    --bs-btn-active-border-color: var(--gp-color-primary-dark);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--gp-color-primary-dark);
    --bs-btn-disabled-border-color: var(--gp-color-primary-dark)
}

.btn-secondary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--gp-color-secondary);
    --bs-btn-border-color: var(--gp-color-secondary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--gp-color-secondary-dark);
    --bs-btn-hover-border-color: var(--gp-color-secondary-dark);
    --bs-btn-focus-shadow-rgb: 130, 138, 145;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--gp-color-secondary-dark);
    --bs-btn-active-border-color: var(--gp-color-secondary-dark);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--gp-color-secondary);
    --bs-btn-disabled-border-color: var(--gp-color-secondary)
}

.pagination {
    --bs-pagination-padding-x: 0.75rem;
    --bs-pagination-padding-y: 0.375rem;
    --bs-pagination-font-size: 1rem;
    --bs-pagination-color: var(--bs-link-color);
    --bs-pagination-bg: var(--bs-body-bg);
    --bs-pagination-border-width: var(--bs-border-width);
    --bs-pagination-border-color: var(--bs-border-color);
    --bs-pagination-border-radius: var(--bs-border-radius);
    --bs-pagination-hover-color: var(--bs-link-hover-color);
    --bs-pagination-hover-bg: var(--bs-tertiary-bg);
    --bs-pagination-hover-border-color: var(--bs-border-color);
    --bs-pagination-focus-color: var(--bs-link-hover-color);
    --bs-pagination-focus-bg: var(--bs-secondary-bg);
    --bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
    --bs-pagination-active-color: #fff;
    --bs-pagination-active-bg: var(--bs-dark-text-emphasis);
    --bs-pagination-active-border-color: var(--bs-dark-text-emphasis);
    --bs-pagination-disabled-color: var(--bs-secondary-color);
    --bs-pagination-disabled-bg: var(--bs-secondary-bg);
    --bs-pagination-disabled-border-color: var(--bs-border-color);
}


@media (min-width: 1200px) {
    :root {
        --bs-body-font-size: 1.2rem;
    }
}

/* -------------------------------
Globale CSS Klasses
------------------------------- */
html {
    scroll-padding-top: 100px;
}

.bg-primary-emphasis {
    background-color: var(--gp-color-primary-dark);
}

.bg-secondary-emphasis {
    background-color: var(--gp-color-secondary-dark);
}

.gp-btn, .gp-btn-primary {
    transition: all 0.5s ease;
    display: inline-block;
    position: relative;
    font-size: 1.1em;
    padding: 10px 20px;
    line-height: initial;
    border-radius: var(--bs-border-radius-xxl);
    color: var(--bs-white);
    background: var(--gp-color-primary);
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
    background-image: linear-gradient(45deg, var(--gp-color-primary-dark), var(--gp-color-primary-light), var(--gp-color-primary-dark));
    background-size: 500% 400% !important;
    color: var(--bs-white);
  }
  .gp-btn:hover, .gp-btn:active, .gp-btn:focus, .gp-btn-primary:hover, .gp-btn-primary:active, .gp-btn-primary:focus {
    background-color: var(--gp-color-primary-dark);
    color: var(--bs-white);
  }
  .gp-btn:hover::after, .gp-btn:active::after, .gp-btn:focus::after, .gp-btn-primary:hover::after, .gp-btn-primary:active::after, .gp-btn-primary:focus::after {
    background-color: var(--gp-color-primary-dark);
  }
  .gp-btn::before, .gp-btn-primary::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    transform: scaleX(0);
    transform-origin: 0 50%;
    width: 100%;
    height: inherit;
  }
  .gp-btn:hover, .gp-btn-primary:hover {
    background-position: 75% 50%;
  }
  .gp-btn:active, .gp-btn:focus, .gp-btn-primary:active, .gp-btn-primary:focus {
    transform: scale(0.95);
    transition: 0.1s;
  }
  
  .gp-btn-dark {
    transition: all 0.5s ease;
    display: inline-block;
    position: relative;
    font-size: 1.1em;
    padding: 10px 20px;
    line-height: initial;
    border-radius: var(--bs-border-radius-xxl);
    color: var(--bs-white);
    background: var(--gp-color-dark);
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
    box-shadow: rgba(0, 0, 0, 0.05) 0 0 8px;
  }
  .gp-btn-dark:hover, .gp-btn-dark:active, .gp-btn-dark:focus {
    background-color: var(--bs-gray);
    color: var(--bs-white);
  }
  .gp-btn-dark:hover::after, .gp-btn-dark:active::after, .gp-btn-dark:focus::after {
    background-color: var(--bs-gray);
  }
  
  .gp-btn-invert, .gp-btn-light {
    transition: all 0.5s ease;
    display: inline-block;
    position: relative;
    font-size: 1.1em;
    padding: 10px 20px;
    line-height: initial;
    border-radius: var(--bs-border-radius-xxl);
    color: var(--gp-color-primary-dark);
    background: var(--bs-white);
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
    box-shadow: rgba(0, 0, 0, 0.05) 0 0 8px;
  }
  .gp-btn-invert:hover, .gp-btn-invert:active, .gp-btn-invert:focus, .gp-btn-light:hover, .gp-btn-light:active, .gp-btn-light:focus {
    background-color: var(--gp-color-primary-light);
    color: var(--bs-white);
  }
  .gp-btn-invert:hover::after, .gp-btn-invert:active::after, .gp-btn-invert:focus::after, .gp-btn-light:hover::after, .gp-btn-light:active::after, .gp-btn-light:focus::after {
    background-color: var(--gp-color-primary-light);
  }
  
  .gp-btn-secondary {
    transition: all 0.5s ease;
    display: inline-block;
    position: relative;
    font-size: 1.1em;
    padding: 10px 20px;
    line-height: initial;
    border-radius: var(--bs-border-radius-xxl);
    color: var(--bs-white);
    background: var(--gp-color-primary);
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
    background-image: linear-gradient(45deg, var(--gp-color-secondary-dark), var(--gp-color-secondary-light), var(--gp-color-secondary-dark));
    background-size: 500% 400% !important;
    color: var(--bs-white);
  }
  .gp-btn-secondary:hover, .gp-btn-secondary:active, .gp-btn-secondary:focus {
    background-color: var(--gp-color-primary-dark);
    color: var(--bs-white);
  }
  .gp-btn-secondary:hover::after, .gp-btn-secondary:active::after, .gp-btn-secondary:focus::after {
    background-color: var(--gp-color-primary-dark);
  }
  .gp-btn-secondary::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    transform: scaleX(0);
    transform-origin: 0 50%;
    width: 100%;
    height: inherit;
  }
  .gp-btn-secondary:hover {
    background-position: 75% 50%;
  }
  .gp-btn-secondary:active, .gp-btn-secondary:focus {
    transform: scale(0.95);
    transition: 0.1s;
  }
  
  .gp-btn-secondary-invert {
    transition: all 0.5s ease;
    display: inline-block;
    position: relative;
    font-size: 1.1em;
    padding: 10px 20px;
    line-height: initial;
    border-radius: var(--bs-border-radius-xxl);
    color: var(--gp-color-secondary-dark);
    background: var(--bs-white);
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
    box-shadow: rgba(0, 0, 0, 0.05) 0 0 8px;
  }
  .gp-btn-secondary-invert:hover, .gp-btn-secondary-invert:active, .gp-btn-secondary-invert:focus {
    background-color: var(--gp-color-secondary-light);
    color: var(--bs-white);
  }
  .gp-btn-secondary-invert:hover::after, .gp-btn-secondary-invert:active::after, .gp-btn-secondary-invert:focus::after {
    background-color: var(--gp-color-secondary-light);
  }
  
  .gp-btn-tertiary {
    transition: all 0.5s ease;
    display: inline-block;
    position: relative;
    font-size: 1.1em;
    padding: 10px 20px;
    line-height: initial;
    border-radius: var(--bs-border-radius-xxl);
    color: var(--bs-white);
    background: var(--gp-color-primary);
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
    background-image: linear-gradient(45deg, var(--gp-color-tertiary-dark), var(--gp-color-tertiary-light), var(--gp-color-tertiary-dark));
    background-size: 500% 400% !important;
    color: var(--bs-white);
  }
  .gp-btn-tertiary:hover, .gp-btn-tertiary:active, .gp-btn-tertiary:focus {
    background-color: var(--gp-color-primary-dark);
    color: var(--bs-white);
  }
  .gp-btn-tertiary:hover::after, .gp-btn-tertiary:active::after, .gp-btn-tertiary:focus::after {
    background-color: var(--gp-color-primary-dark);
  }
  .gp-btn-tertiary::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    transform: scaleX(0);
    transform-origin: 0 50%;
    width: 100%;
    height: inherit;
  }
  .gp-btn-tertiary:hover {
    background-position: 75% 50%;
  }
  .gp-btn-tertiary:active, .gp-btn-tertiary:focus {
    transform: scale(0.95);
    transition: 0.1s;
  }
  
  .gp-btn-tertiary-invert {
    transition: all 0.5s ease;
    display: inline-block;
    position: relative;
    font-size: 1.1em;
    padding: 10px 20px;
    line-height: initial;
    border-radius: var(--bs-border-radius-xxl);
    color: var(--gp-color-tertiary-dark);
    background: var(--bs-white);
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
    box-shadow: rgba(0, 0, 0, 0.05) 0 0 8px;
  }
  .gp-btn-tertiary-invert:hover, .gp-btn-tertiary-invert:active, .gp-btn-tertiary-invert:focus {
    background-color: var(--gp-color-tertiary-light);
    color: var(--bs-white);
  }
  .gp-btn-tertiary-invert:hover::after, .gp-btn-tertiary-invert:active::after, .gp-btn-tertiary-invert:focus::after {
    background-color: var(--gp-color-tertiary-light);
  }
  
  .gp-btn-pdf {
    transition: all 0.5s ease;
    display: inline-block;
    position: relative;
    font-size: 1.1em;
    padding: 10px 20px;
    line-height: initial;
    border-radius: var(--bs-border-radius-xxl);
    color: var(--bs-white);
    background: var(--gp-color-primary);
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
    padding: 0.5rem 1rem;
    background: var(--bs-gray);
  }
  .gp-btn-pdf:hover, .gp-btn-pdf:active, .gp-btn-pdf:focus {
    background-color: var(--gp-color-primary-dark);
    color: var(--bs-white);
  }
  .gp-btn-pdf:hover::after, .gp-btn-pdf:active::after, .gp-btn-pdf:focus::after {
    background-color: var(--gp-color-primary-dark);
  }
  .gp-btn-pdf::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    content: "\f56d";
    margin-right: 0.5rem;
    position: relative;
  }
  
  .w-fit-content {
    width: -moz-fit-content !important;
    width: fit-content !important;
  }
  
  .mw-300 {
    max-width: 300px !important;
  }
  
  .mw-400 {
    max-width: 400px !important;
  }
  
  .mw-500 {
    max-width: 500px !important;
  }
  
  .mw-600 {
    max-width: 600px !important;
  }
  
  .place-content-center {
    place-content: center !important;
  }
  
  .font-impact {
    font-family: "Impact LT Std" !important;
  }
  
  .font-primary {
    font-family: "Source Sans Pro", sans-serif !important;
  }
  
  .outline-0 {
    outline: 0 !important;
  }
  
  .text-tertiary {
    --bs-text-opacity:1;
    color: rgba(var(--bs-tertiary-rgb), var(--bs-text-opacity)) !important;
  }
  
  .text-tertiary-dark {
    --bs-text-opacity:1;
    color: rgba(var(--bs-dark-tertiary-rgb), var(--bs-text-opacity)) !important;
  }
  
  .text-shadow-dark {
    text-shadow: 0 0 20px black !important;
  }
  
  .fs-0 {
    font-size: calc(1.5rem + 1.5vw) !important;
  }
  
  .bg-primary-light {
    --bs-bg-opacity:1;
    background-color: rgba(var(--bs-light-primary-rgb), var(--bs-bg-opacity)) !important;
  }
  
  .bg-primary-dark {
    --bs-bg-opacity:1;
    background-color: rgba(var(--bs-dark-primary-rgb), var(--bs-bg-opacity)) !important;
  }
  
  .bg-secondary-light {
    --bs-bg-opacity:1;
    background-color: rgba(var(--bs-light-secondary-rgb), var(--bs-bg-opacity)) !important;
  }
  
  .bg-secondary-dark {
    --bs-bg-opacity:1;
    background-color: rgba(var(--bs-dark-secondary-rgb), var(--bs-bg-opacity)) !important;
  }
  
  .bg-tertiary {
    --bs-bg-opacity:1;
    background-color: rgba(var(--bs-tertiary-rgb), var(--bs-bg-opacity)) !important;
  }
  
  .bg-tertiary-light {
    --bs-bg-opacity:1;
    background-color: rgba(var(--bs-light-tertiary-rgb), var(--bs-bg-opacity)) !important;
  }
  
  .bg-tertiary-dark {
    --bs-bg-opacity:1;
    background-color: rgba(var(--bs-dark-tertiary-rgb), var(--bs-bg-opacity)) !important;
  }
  
  .bg-opacity-10 {
    --bs-bg-opacity: 0.1 ;
  }
  
  .bg-opacity-25 {
    --bs-bg-opacity: 0.25 ;
  }
  
  .bg-opacity-50 {
    --bs-bg-opacity: 0.5 ;
  }
  
  .bg-opacity-75 {
    --bs-bg-opacity: 0.75 ;
  }
  
  .bg-opacity-100 {
    --bs-bg-opacity: 1 ;
  }
  
  .bg-gradient-primary-1 {
    background-image: linear-gradient(45deg, var(--gp-color-primary-dark) 0%, var(--gp-color-primary-light) 100%) !important;
  }
  
  .bg-gradient-primary-2 {
    background-image: linear-gradient(45deg, var(--gp-color-primary-dark) 0%, var(--gp-color-primary-light) 50%, var(--gp-color-primary-dark) 100%) !important;
  }
  
  .bg-gradient-primary-3 {
    background-image: linear-gradient(45deg, var(--gp-color-primary-light) 0%, var(--gp-color-primary-dark) 50%, var(--gp-color-primary-light) 100%) !important;
  }
  
  .bg-gradient-secondary {
    background-image: linear-gradient(60deg, var(--gp-color-secondary-dark) 0%, var(--gp-color-secondary-light) 100%) !important;
  }
  
  .bg-gradient-dark-1 {
    background-image: linear-gradient(77deg, var(--gp-color-dark), var(--bs-gray)) !important;
  }
  
  .bg-gradient-dark-2 {
    background-image: linear-gradient(180deg, var(--bs-gray-30) 0%, rgba(221, 224, 226, 0) 100%) !important;
  }
  
  .bg-gradient-light-1 {
    background-image: linear-gradient(77deg, #e7e7e7, #f2f2f2) !important;
  }
  
  .bg-gradient-light-2 {
    background-image: linear-gradient(77deg, #e7e7e7, #f2f2f2) !important;
  }
  
  .bg-blur-1 {
    -webkit-backdrop-filter: blur(2px);
            backdrop-filter: blur(2px);
  }
  
  .bg-blur-2 {
    -webkit-backdrop-filter: blur(4px);
            backdrop-filter: blur(4px);
  }
  
  .bg-blur-3 {
    -webkit-backdrop-filter: blur(6px);
            backdrop-filter: blur(6px);
  }
  
  .bg-blur-4 {
    -webkit-backdrop-filter: blur(8px);
            backdrop-filter: blur(8px);
  }
  
  .bg-blur-5 {
    -webkit-backdrop-filter: blur(10px);
            backdrop-filter: blur(10px);
  }
  
  .overflow-x-hidden {
    overflow-x: hidden !important;
  }
  
  .hover-shadow-sm {
    box-shadow: 0 0 0 rgba(22, 28, 45, 0);
    transition: box-shadow 0.25s ease, transform 0.25s ease;
  }
  .hover-shadow-sm:hover {
    box-shadow: 0 1rem 2.5rem rgba(22, 28, 45, 0.1), 0 0.5rem 1rem -0.75rem rgba(22, 28, 45, 0.1) !important;
    transform: translate3d(0, -3px, 0);
  }
  
  .hover-shadow-lg {
    box-shadow: 0 0 0 rgba(22, 28, 45, 0);
    transition: box-shadow 0.25s ease, transform 0.25s ease;
  }
  .hover-shadow-lg:hover {
    box-shadow: 0 2rem 5rem rgba(22, 28, 45, 0.1), 0 0.5rem 1rem -0.75rem rgba(22, 28, 45, 0.05) !important;
    transform: translate3d(0, -5px, 0);
  }
  
  .overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0);
    transition: all 300ms ease;
    opacity: 0;
  }
  .overlay:hover {
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 1;
  }
  
  .shape-background-1::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    background-color: var(--gp-color-primary);
    -webkit-clip-path: polygon(0% 0%, 0% 100%, 82% 100%, 39% 0%);
            clip-path: polygon(0% 0%, 0% 100%, 82% 100%, 39% 0%);
  }
  
  @media (min-width: 992px) {
    .position-lg-absolute {
      position: absolute !important;
    }
    .rounded-lg-bottom {
      border-bottom-right-radius: var(--bs-border-radius) !important;
      border-bottom-left-radius: var(--bs-border-radius) !important;
    }
    .rounded-lg-top {
      border-top-right-radius: var(--bs-border-radius) !important;
      border-top-left-radius: var(--bs-border-radius) !important;
    }
  }
  @media (min-width: 768px) {
    .rounded-md-start {
      border-top-left-radius: var(--bs-border-radius) !important;
      border-bottom-left-radius: var(--bs-border-radius) !important;
    }
    .border-md-start {
      border-left: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
    }
    .rounded-md {
        border-radius: var(--bs-border-radius) !important;
    }
  }

/* GLOBAL */
::-moz-selection {
    color: var(--bs-white);
    background: var(--gp-color-primary);
}
::selection {
    color: var(--bs-white);
    background: var(--gp-color-primary);
}

hr {
    height: 1px;
    margin: 40px 0;
    background-color: var(--bs-white);
}

#body #main {
    min-height: 300px;
    font-family: "Source Sans Pro", sans-serif;
    color: var(--gp-color-dark);
}

:is(#main) .h1,
:is(#main) h1 {
    font-weight: 900;
}

:is(#main) .h2,
:is(#main) h2 {
    font-weight: 600;
    color: var(--gp-color-primary-dark);
}

:is(#main) .h3,
:is(#main) h3 {
    color: var(--gp-color-primary-light);
    font-weight: 400;
}

.rm-table-light {
    margin-bottom: 1.5em;
}

.rm-table-light th,
td {
    padding: 0.5rem;
    border: 1px solid var(--bs-gray);
    vertical-align: baseline;
}

.rm-table-light th {
    background-color: var(--bs-gray-200);
}

.rm-table-light ul,
.rm-table-light ol {
    margin-top: 0;
    margin-bottom: 10px;
    list-style: circle;
    padding-left: 25px;
}

.rm-table-light ol {
    list-style: decimal;
}

.rm-table-light ul,
.rm-table-light ol {
    margin-top: 0;
    margin-bottom: 10px;
    list-style: circle;
    padding-left: 25px;
}

.rm-table-light ol {
    list-style: decimal;
}

.heading-area-sm-title h1 {
    color: rgba(255, 255, 255, 0.9);
}

/* --------------- Navigation --------------- */
#header {
    position: sticky;
    top: 0;
    z-index: 200;
    background-color: transparent;
    background: linear-gradient(45deg, var(--gp-color-primary-dark) 0%, var(--gp-color-primary-light) 100%);
    width: 100%;
    border-bottom: 1px solid var(--gp-color-primary);
}

#header * {
    transition: all 250ms ease;
}

#header .logo img {
    max-height: 85px;
    width: auto;
}

.desktop-menu {
    margin-bottom: 0;
}

.desktop-menu ul.nav {
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    text-transform: uppercase;
}

.desktop-menu ul.nav li {
    position: relative;
    list-style: none;
    display: flex;
    align-items: center;
    height: 100px;
    width: -moz-max-content;
    width: max-content;
}

.desktop-menu ul.nav li a {
    position: relative;
    display: block;
    padding: 38px 20px;
    font-weight: 700;
    text-decoration: none;
    text-transform: uppercase;
    color: var(--bs-white);
}

@media (max-width: 1200px) {
    .desktop-menu ul.nav li a {
        padding: 38px 15px;
    }
}

.desktop-menu ul.nav li:hover {
    background-color: rgba(255, 255, 255, 0.1333333333);
}

.desktop-menu ul.nav li ul {
    background: var(--bs-white_2);
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin-inline: auto;
    padding-block: 2rem;
    min-height: 200px;
    max-width: 1320px;
    position: fixed;
    top: 100px;
    left: 0;
    right: 0;
    transform: translateY(0px);
    visibility: hidden;
    opacity: 0;
}

.desktop-menu ul.nav li ul * {
    transition: all 0ms ease !important;
}

@media (max-width: 1400px) {
    .desktop-menu ul.nav li ul {
        max-width: 1140px;
    }
}

@media (max-width: 1200px) {
    .desktop-menu ul.nav li ul {
        max-width: 960px;
        top: 100px;
    }
}

.desktop-menu ul.nav li ul::before {
    content: "";
    position: fixed;
    min-height: 200px;
    top: 0;
    bottom: 0;
    left: -100%;
    right: -100%;
    background: var(--bs-white_2);
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
    border-block: 2px solid #eee;
    border-color: var(--gp-color-primary-light);
}

.desktop-menu ul.nav li ul li {
    display: grid;
    padding: 7px;
    width: 100%;
    height: -moz-fit-content;
    height: fit-content;
}

.desktop-menu ul.nav li ul li a {
    padding: 0px;
    font-weight: 700;
    color: var(--gp-color-primary-dark);
}

.desktop-menu ul.nav li ul li ul {
    width: -moz-max-content;
    width: max-content;
    position: initial;
    display: block;
    padding: 0;
    background: transparent;
    margin-inline: unset;
    padding: 0;
}

.desktop-menu ul.nav li ul li ul::before {
    display: none;
}

.desktop-menu ul.nav li ul li ul li {
    padding: 0;
    color: var(--gp-color-primary-dark);
    /* background-color: #fff; */
    transition: all 200ms ease !important;
}

.desktop-menu ul.nav li ul li ul li:hover {
    background-color: var(--bs-white);
}

.desktop-menu ul.nav li ul li ul li a {
    font-weight: 300;
    background: transparent;
    color: var(--gp-color-primary-dark);
}

.desktop-menu ul.nav li:is(:hover, :focus-within) ul {
    visibility: visible;
    opacity: 1;
    transform: translateY(0px);
}

.desktop-menu ul.nav li:is(:hover, :focus-within) ul li ul {
    visibility: visible;
    opacity: 1;
    transform: translateY(0px);
}

div.mobile-menu-button a {
    color: var(--bs-white);
}

div.mobile-menu {
    display: none;
    position: absolute;
    top: 93px;
    right: 0;
    left: 0;
    background-color: var(--bs-white);
}

div.mobile-menu ul.nav {
    list-style: none;
    position: relative;
    list-style: none;
    margin: 0;
    padding: 0;
    flex-direction: column;
}

div.mobile-menu ul.nav li {
    border-top: 1px solid var(--bs-gray-300);
    background-color: var(--bs-white);
    text-transform: uppercase;
    margin: 0px;
    text-align: center;
}

div.mobile-menu ul.nav li a {
    color: var(--gp-color-primary-dark);
    display: block;
    font-size: initial;
    white-space: inherit;
}

div.mobile-menu ul.nav li>ul {
    display: none;
}

li:hover,
li:active,
li:focus {
    background-color: rgba(255, 255, 255, 0.2);
}

li:hover a,
li:active a,
li:focus a {
    text-decoration: none;
}

li.nav-selected>a {
    font-weight: bold !important;
    color: var(--gp-color-primary) !important;
}

#header.sticky .container .row .logo img {
    max-height: 69px;
}

#header.sticky .container .row .desktop-menu ul.nav li {
    height: 85px;
}

#header.sticky .container .row .desktop-menu ul.nav li a {
    padding: 30px 20px;
    color: var(--bs-white);
}

#header.sticky .container .row .desktop-menu ul.nav li ul {
    display: none;
}

/* --------------- /Navigation --------------- */
#heading-area-xl .heading-area-xl-container {
    position: relative;
}

@media (max-width: 991px) {
    #heading-area-xl .heading-area-xl-container {
        width: 100%;
    }
}

/* Page Video background  */
.page-bg {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: -1;
    background-image: linear-gradient(45deg, var(--gp-color-primary-dark) 0%, var(--gp-color-primary-light) 100%);
}

.page-bg :is(video, img) {
    width: auto;
    height: 100%;
    opacity: 0.5;
}

@media (min-width: 1720px) {
    .page-bg :is(video, img) {
        width: 100%;
        height: auto;
    }
}

#back_to_top {
    position: fixed;
    height: auto;
    top: 85%;
    right: 25px;
    margin: 0;
    z-index: 1000;
    transition: opacity 0.3s ease-in-out;
    pointer-events: auto;
    filter: alpha(opacity=100);
    width: 51px;
    height: 51px;
    line-height: 47px;
    color: var(--gp-color-dark);
    background-color: var(--gp-color-secondary);
    text-align: center;
    transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out, border-color 0.3s ease-in-out;
    box-sizing: border-box;
    border-radius: 25px;
    opacity: 0;
    transform: translateY(50px);
    transition: all 0.3s ease;
}

#back_to_top:hover {
    background-color: var(--gp-color-secondary-dark);
    color: var(--bs-white);
}

.showBTP {
    opacity: 0.5 !important;
    transform: translateY(0) !important;
}

#back_to_top:hover {
    opacity: 0.9;
}

/* --------------- Footer --------------- */
.footer-area {
    font-family: "Source Sans Pro", sans-serif;
}

.footer-area :is(h1, h2, h3, h4, h5) {
    color: var(--bs-white);
    text-transform: uppercase;
}

.footer-area :is(a) {
    text-decoration: none;
}

.footer-area *:not(.ccm-edit-mode-inline-command-move *, .ccm-area-footer-handle *, input.form-control, .ccm-style-customizer-toolbar *) {
    color: var(--bs-white);
}

/* --------------- /Footer --------------- */

/* ------------------------------ */

.grid_container {
    display: grid;
    grid-template-rows: auto;
    grid-column-gap: 30px;
}

.grid_container_spalte {
    position: relative;
}

.grid_container_2_spalten {
    grid-template-columns: repeat(2, 1fr);
}

.grid_container_3_spalten {
    grid-template-columns: repeat(3, 1fr);
}

.grid_container_4_spalten {
    grid-template-columns: repeat(4, 1fr);
}

.grid_container_5_spalten {
    grid-template-columns: repeat(5, 1fr);
}

.grid_container_2_spalten_vertikal {
    grid-template-columns: repeat(1, 1fr);
    grid-template-rows: repeat(2, 1fr);
}

.grid_container_2_spalten_vertikal .grid_container_spalte_vertikal_1 {
    grid-row: 1/2;
}

.grid_container_2_spalten_vertikal .grid_container_spalte_vertikal_2 {
    grid-row: 2/3;
}

@media (min-width: 992px) {
    .grid_container_2_spalten_vertikal .grid_container_spalte_vertikal_2 {
        margin-top: -60px;
    }
}

@media (max-width: 1200px) {
    .grid_container_5_spalten {
        grid-template-columns: repeat(4, 1fr);
    }

    .grid_container_4_spalten {
        grid-template-columns: repeat(2, 1fr);
    }

    .grid_container_3_spalten {
        grid-template-columns: repeat(2, 1fr);
    }
}

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

@media (max-width: 768px) {
    .grid_container {
        display: grid !important;
        grid-template-columns: auto;
        gap: 2rem;
    }
}

/* ----------------------------------------------
 * Generated by Animista on 2024-6-27 23:54:22
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation fade-in-bottom
 * ----------------------------------------
 */
 @-webkit-keyframes fade-in-bottom {
  0% {
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade-in-bottom {
  0% {
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
.fade-in-bottom {
	-webkit-animation: fade-in-bottom 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	        animation: fade-in-bottom 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}

/* -------------------------------
CONCRETE CMS UI ANPASSUNGEN
------------------------------- */
.ccm-captcha-image {
	margin-bottom:0.5rem;
}
div#ccm-toolbar {
    z-index: 1020;
}

.cke_editable {
    min-height: -moz-max-content;
    min-height: max-content;
}

.cke_source {
    min-height: 200px;
}

.ccm-edit-mode div#heading-area-xl {
    margin-top: 300px;
}

.ccm-toolbar-visible .desktop-menu ul.nav li ul {
    top: 148px;
}

/* -------------------------------
quote
------------------------------- */
blockquote {
  color: #7b7b7b;
  background: #ffffff;
  border-left: 4px solid var(--gp-color-primary-dark);
  padding: 20px 25px;
  margin: 30px 0;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  position: relative;
  line-height: 1.6;
  border-radius: 6px;
}
blockquote p:last-child {
  margin-bottom: 0;
}
cite {
  display: block;
  margin-top: 15px;
  font-size: 0.9em;
  color: #555;
  text-align: right;
}


/****************************
Barrierefreiheit Optimierung  
****************************/
/* Fokusstil barrierefrei */
:focus {
  outline: none !important; /* Entfernt Standard-Fokus Stil und wir setzen ihn manuell */
}
:focus-visible {
  outline: 3px solid #ffbf47 !important;
  box-shadow: 0 0 0 4px rgba(255, 191, 71, 0.6) !important;
  transition: box-shadow 0.2s ease !important;
}


/* skip-link */
.skip-link {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
  
  background: #005fcc;
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  z-index: 1000;
  transition: all 0.2s ease-in-out;
}

.skip-link:focus {
  width: auto;
  height: auto;
  padding: 8px 16px;
  margin: 8px; 
  overflow: visible;
  clip: auto;
  white-space: normal;
  border-radius: 4px; 
}

#maincontent:focus {
  outline: none; 
  box-shadow: 0 0 0 3px rgba(0, 95, 204, 0.5);
}
