@media all {
        :root {
                /* ###### Defining colors ###### */
                /* Text color */
                --color-text-light-rgb: 255, 255, 255;
                --color-text-light: rgb(var(--color-text-light-rgb));
                --color-text-dark-rgb: 22, 22, 22;
                --color-text-dark: rgb(var(--color-text-dark-rgb));

                --color-bg-light-rgb: 255, 255, 255;
                --color-bg-light: rgb(var(--color-bg-light-rgb));
                --color-bg-dark-rgb: 22, 22, 22;
                --color-bg-dark: rgb(var(--color-bg-dark-rgb));

                /* Primary color */
                --color-primary-rgb: 0, 66, 71;
                --color-primary: rgb(var(--color-primary-rgb));
                --color-primary-rgb-hover: 0, 66, 71;
                --color-primary-hover: rgb(var(--color-primary-rgb-hover));

                /* Secondary color */
                --color-secondary-rgb: 0, 137, 153;
                --color-secondary: rgb(var(--color-secondary-rgb));
                --color-secondary-rgb-hover: 0, 137, 153;
                --color-secondary-hover: rgb(var(--color-secondary-rgb-hover));

                /* Accent color */
                --color-accent-rgb: 58, 80, 110;
                --color-accent: rgb(var(--color-accent-rgb));
                --color-accent-rgb-hover: 45, 61, 84;
                --color-accent-hover: rgb(var(--color-accent-rgb-hover));

                /* Defining Col-Start and Col-Width */
                --width-page: min(100vw, 120rem);

                --col-count: 12;
                --col-1: calc(((var(--width-content) - var(--gap-5) * 2) - (var(--col-count) - 1) * var(--gap-5)) / var(--col-count));

                --col-2-start: calc(var(--col-1) * 2 + var(--gap-5) * 0);
                --col-3-start: calc(var(--col-1) * 3 + var(--gap-5) * 1);
                --col-4-start: calc(var(--col-1) * 4 + var(--gap-5) * 2);
                --col-5-start: calc(var(--col-1) * 5 + var(--gap-5) * 3);
                --col-6-start: calc(var(--col-1) * 6 + var(--gap-5) * 4);
                --col-7-start: calc(var(--col-1) * 7 + var(--gap-5) * 5);
                --col-8-start: calc(var(--col-1) * 8 + var(--gap-5) * 6);
                --col-9-start: calc(var(--col-1) * 9 + var(--gap-5) * 7);
                --col-10-start: calc(var(--col-1) * 10 + var(--gap-5) * 8);
                --col-11-start: calc(var(--col-1) * 11 + var(--gap-5) * 9);

                --col-2-width: calc(var(--col-1) * 2 + var(--gap-5) * 1);
                --col-3-width: calc(var(--col-1) * 3 + var(--gap-5) * 2);
                --col-4-width: calc(var(--col-1) * 4 + var(--gap-5) * 3);
                --col-5-width: calc(var(--col-1) * 5 + var(--gap-5) * 4);
                --col-6-width: calc(var(--col-1) * 6 + var(--gap-5) * 5);
                --col-7-width: calc(var(--col-1) * 7 + var(--gap-5) * 6);
                --col-8-width: calc(var(--col-1) * 8 + var(--gap-5) * 7);
                --col-9-width: calc(var(--col-1) * 9 + var(--gap-5) * 8);
                --col-10-width: calc(var(--col-1) * 10 + var(--gap-5) * 9);
                --col-11-width: calc(var(--col-1) * 11 + var(--gap-5) * 10);

                /* Defining sizes */
                --width-content: min(100vw, calc(80rem + 2 * var(--gap-5))); /* full content width */
                --width-content-xs: var(--col-4-width); /* For text on slider only */
                --width-content-sm: var(--col-8-width); /* small content e.g. text-media without image */
                --width-content-md: var(--col-10-width); /* medium content e.g. text-media with image right/left or grid-50-50 */
                --width-content-xl: calc(var(--dynamic-clamp-end) * 1rem); /* extreme large content e.g. page-stage */

                --height-logo: clamp(1.75rem, 5vw, 4rem);
                --padding-logo: var(--gap-6);

                /* MISC */
                /* Global Fonts */
                --font-family-header: "Oswald", sanf-serif;

                /* Border */
                --border-radius-btn-controller: 100vh;
                --border-radius-btn: 100vh;
                --border: .125rem solid transparent;

                /* Backdrop filter */
                --backdrop-filter: .25rem;

                /* Shadows */
                --text-shadow: 0  0 .625rem rgba(var(--color-text-dark-rgb),.4);
                --text-shadow-dark: 0 0 1rem rgba(0,0,0,.8);
                --box-shadow: 0 1rem 2.5rem rgba(var(--color-accent-rgb),.1);

                /* Transitions */
                --transition-default: all .2s ease-in-out;
                --transition-cubic: all .2s cubic-bezier(.5,.25,.25,1.5);

                /* Naigation variable */
                --padding-navigation-item-x: 1rem;
                --padding-navigation-item-y: .625rem;

                /* Page variables */
                --color-page-header-bg: var(--color-bg-light);
                --color-page-header-bg-scrolled: rgba(var(--color-bg-light-rgb),.8);

                /* Element variables */
                --slick-dot-size: 1rem;
                --slick-dot-padding: 1.5rem;
                --slick-dots-box-shadow: 0 .25rem 1.25rem rgba(var(--color-secondary-rgb),.6);;
                --slick-arrow-size: clamp(1.75rem, 6.048vw, 3rem);
                --slick-arrow-gap: 1rem;
                --slick-pause-size: var(--slick-arrow-size);

                --icon-size-teaser: calc(var(--gap-10) + var(--gap-3));
        }
        
        :root,
        body,
        .ce-header * {
                --dynamic-clamp-start: 48; /*rem*/
                --dynamic-clamp-end: 95; /*rem*/
                
                --dynamic-size-diff: calc(var(--dynamic-size-max) - var(--dynamic-size-min));
                --dynamic-clamp-diff: calc(var(--dynamic-clamp-end) - var(--dynamic-clamp-start));    
                --dynamic-size-clamp: calc((var(--dynamic-size-min) * 1rem) + var(--dynamic-size-diff) * ((100vw - (var(--dynamic-clamp-start) * 1rem)) / var(--dynamic-clamp-diff)));    
                --dynamic-size-scaler: clamp((var(--dynamic-size-min) * 1rem), var(--dynamic-size-clamp), (var(--dynamic-size-max) * 1rem));
        }
        
        :root {
                /* Defining spaces */
                --dynamic-size-min: .25; /*rem*/
                --dynamic-size-max: .5; /*rem*/
                
                --gap: var(--dynamic-size-scaler); /* default-values 4 -> 8 */
                --gap-2: calc(var(--gap) * 2); /* default-values 8 -> 16 */
                --gap-3: calc(var(--gap) * 3); /* default-values 12 -> 24 */
                --gap-4: calc(var(--gap) * 4); /* default-values 16 -> 32 */
                --gap-5: calc(var(--gap) * 5); /* default-values 20 -> 40 */
                --gap-6: calc(var(--gap) * 6); /* default-values 24 -> 48 */
                --gap-7: calc(var(--gap) * 7); /* default-values 28 -> 56 */
                --gap-8: calc(var(--gap) * 8); /* default-values 32 -> 64 */
                --gap-9: calc(var(--gap) * 9); /* default-values 36 -> 72 */
                --gap-10: calc(var(--gap) * 10); /* default-values 40 -> 80 */
        }
        
        body {
                --dynamic-size-min: 1.125; /*rem*/
                --dynamic-size-max: 1.25; /*rem*/
        }
        
        body,
        .ce-header * {
                font-size: var(--dynamic-size-scaler);
        }
        
        .ce-header :is(h1, .h1) {
                --dynamic-size-min: 2; /*rem*/
                --dynamic-size-max: 3.5; /*rem*/ 
        }
        
        .ce-header :is(h2, .h2) {
                --dynamic-size-min: 1.75; /*rem*/
                --dynamic-size-max: 2.5; /*rem*/ 
        }
        
        .ce-header :is(h3, .h3) {
                --dynamic-size-min: 1.5; /*rem*/
                --dynamic-size-max: 2; /*rem*/ 
        }
        
        .ce-header :is(h4, .h4) {
                --dynamic-size-min: 1.375; /*rem*/
                --dynamic-size-max: 1.5; /*rem*/ 
        }
        
        .ce-header :is(h5, .h5) {
                --dynamic-size-min: 1.125; /*rem*/
                --dynamic-size-max: 1.375; /*rem*/ 
        }

        /* Pagelayout variables */
        .page-layout-round,
        .page-layout-round_homepage {
                --max-width-page-stage: var(--width-content-xl); /* set to 100% to get the page-stage-image on fullwidth */
                --max-width-footer-top: var(--width-content-xl);
                --padding-page-stage: 0; /* set to 0 to get the page-stage-image on fullwidth */
                --border-radius: clamp(1.25rem, 1.25rem + 1.5vw, 2.5rem);
                --border-radius-half: calc(var(--border-radius) / 2);
        }

}

@media(min-width: 36rem) {

}

@media(min-width: 48rem) {

}

@media(min-width: 62rem) {

}


@media(min-width: 120rem) {

}