:root {
	/************************************************************************
	*                                                                      **
	* Layout Breakpoints                                                   **
	*                                                                      **
	* ***********************************************************************/

	--breakpoint-xs:432px;
	--breakpoint-s: 768px;
	--breakpoint-m: 992px;
	--breakpoint-l: 1200px;
	--breakpoint-xl: 1600px;


	/************************************************************************
	*                                                                      **
	* Paddings and Margins = Space                                         **
	*                                                                      **
	* ***********************************************************************/

	/* @link https://utopia.fyi/space/calculator?c=320,15,1.1,1240,19,1.28,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */

	--space-3xs: clamp(0.25rem, 0.2283rem + 0.1087vw, 0.3125rem);
	--space-2xs: clamp(0.5rem, 0.4565rem + 0.2174vw, 0.625rem);
	--space-xs: clamp(0.6875rem, 0.6223rem + 0.3261vw, 0.875rem);
	--space-s: clamp(0.9375rem, 0.8505rem + 0.4348vw, 1.1875rem);
	--space-m: clamp(1.4375rem, 1.3071rem + 0.6522vw, 1.8125rem);
	--space-l: clamp(1.875rem, 1.7011rem + 0.8696vw, 2.375rem);
	--space-xl: clamp(2.8125rem, 2.5516rem + 1.3043vw, 3.5625rem);
	--space-2xl: clamp(3.75rem, 3.4022rem + 1.7391vw, 4.75rem);
	--space-3xl: clamp(5.625rem, 5.1033rem + 2.6087vw, 7.125rem);



	/************************************************************************
	*                                                                      **
	* Font Sizes                                                           **
	*                                                                      **
	* ***********************************************************************/

/* @link https://utopia.fyi/type/calculator?c=320,16,1.125,1920,19,1.2,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */

/* Step -2: 12.642px → 13.1944px */
--fs--2: clamp(0.7901rem, 0.7832rem + 0.0345vw, 0.8247rem);
/* Step -1: 14.2222px → 15.8333px */
--fs--1: clamp(0.8889rem, 0.8688rem + 0.1007vw, 0.9896rem);
/* Step 0: 16px → 19px */
--fs-0: clamp(1rem, 0.9625rem + 0.1875vw, 1.1875rem);
/* Step 1: 18px → 22.8px */
--fs-1: clamp(1.125rem, 1.065rem + 0.3vw, 1.425rem);
/* Step 2: 20.25px → 27.36px */
--fs-2: clamp(1.2656rem, 1.1768rem + 0.4444vw, 1.71rem);
/* Step 3: 22.7813px → 32.832px */
--fs-3: clamp(1.4238rem, 1.2982rem + 0.6282vw, 2.052rem);
/* Step 4: 25.6289px → 39.3984px */
--fs-4: clamp(1.6018rem, 1.4297rem + 0.8606vw, 2.4624rem);
/* Step 5: 28.8325px → 47.2781px */
--fs-5: clamp(1.802rem, 1.5715rem + 1.1528vw, 2.9549rem);




	/************************************************************************
	*                                                                      **
	* Line Heights                                                         **
	*                                                                      **
	* ***********************************************************************/

	/* @link https://utopia.fyi/type/calculator?c=320,24,1.08,1240,30,1.25,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */

	--lh--2: 1.3;
	--lh--1: 1.45;
	--lh-0: 1.6;
	--lh-1: 1.45;
	--lh-2: 1.35;
	--lh-3: 1.3;
	--lh-4: 1.25;
	--lh-5: 1.2;



	/************************************************************************
	*                                                                      **
	* Globale Partnerwerk-Farben                                           **
	* Farbauswahl: https://coolors.co/e47a05-c0ca11-ebf36c-222222-313b44   **
	*              https://coolors.co/003049-d62828-f77f00-fcbf49-eae2b7
	*
	*          https://coolors.co/313b44-e47a05-c0ca11-fefefe (14.4.2021)  **
	*                                                                      **
	* ***********************************************************************/


	--warm-2: hsl(31,96%,31%);
	--warm-2: hsl(31,96%,36%);
	--warm-1: hsl(31,96%,41%);
	/** Partnerwerk Orange: #e47a05 **/
	--warm: hsl(31,96%,46%);
	--warm1: hsl(31,96%,56%);
	--warm2: hsl(31,96%,66%);
	--warm3: hsl(31,96%,76%);
	--warm4: hsl(31,96%,86%);
	--warm5: hsl(31,96%,96%);




	--cool-2: hsl(208,16%,13%);
	--cool-1: hsl(208,16%,19%);
	/** Partnerwerk Blaugrau #313b44 **/
	--cool: hsl(208,16%,23%);
	--cool1: hsl(208,16%,28%);
	--cool2: hsl(208,16%,34%);
	--cool3: hsl(208,16%,41%);
	--cool4: hsl(208,16%,49%);
	--cool5: hsl(208,16%,58%);
	--cool6: hsl(208,16%,68%);
	--cool7: hsl(208,16%,79%);
	--cool8: hsl(208,16%,81%);
	--cool9: hsl(208,16%,94%);



	--fresh-3: hsl(63,84%,25%);
	--fresh-2: hsl(63,84%,30%);
	--fresh-1: hsl(63,84%,36%);
	--fresh:  hsl(63,84%,43%); /** Partnerwerk grün #c0ca11 **/
	--fresh1: hsl(63,84%,51%);
	--fresh2: hsl(63,84%,60%);
	--fresh3: hsl(63,84%,70%);
	--fresh4: hsl(63,84%,81%);


	--petrol-2: hsl(190, 37%, 19%);
	--petrol-1: hsl(190, 37%, 24%);
	--petrol: hsl(190, 37%, 29%); /* Partnerwerk petrol  */
	--petrol1: hsl(190, 37%, 34%);
	--petrol2: hsl(190, 37%, 40%);
	--petrol3: hsl(190, 37%, 48%);
	--petrol4: hsl(190, 37%, 58%);
	--petrol5: hsl(190, 37%, 72%);
	--petrol6: hsl(190, 37%, 88%);


	--alert: hsl(0,69%,50%); /** #d62828 **/


	/************************************************************************
	*                                                                      **
	* Hintergrundfarben                           											   **
	*                                                                      **
	* ***********************************************************************/

	--bg-main: var(--cool8);
	--bg-light: var(--cool9);
	--bg-cool: var(--cool7);
	--bg-warm: var(--warm5);
	--bg-petrol: var(--petrol6);

	/************************************************************************
	*                                                                      **
	* Container	            											   **
	*                                                                      **
	* ***********************************************************************/

	/**
	 * Maximale Breite
	 * @type: rem, px, mm, ch
	 */
	--container-max-width: 1200px;
	--max-content-width: 50rem;

	/**
	 * Maximale Laufweite von Text
	 * etwas 80 Zeichen Fließtext entsprechend
	 */

	--textblock: 50rem;


	--iframe-min-height: calc(60vh - 8rem);
	--iframe-max-height: calc(95vh - 8rem);
	--iframe-min-height: calc(60svh - 8rem);
	--iframe-max-height: calc(95svh - 8rem);

	/**
	 * Default borders
	 **/
	--border-width: 0.15rem;
	--border-radius: 0.15rem;


	/************************************************************************
	*                                                                      **
	* Schriftarten            											   **
	*                                                                      **
	* ***********************************************************************/

	--sans: Cabin, Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue",sans-serif;
	--serif: Merriweather, Lora, Georgia, serif;
}