/* CSS VARIABLEN */
html{
	--font-family:'Roboto', sans-serif;
	--font-family-header:'Merriweather', 'Roboto', sans-serif;
	--font-condensed:"wdth" 75;
	--font-regular:"wdth" 100;
	
	--color-black:#000000;
	--color-white:#ffffff;
	--color-blue:#009fe3;
	--color-blue-rgb:0, 159, 227;
	--color-lightblue:#e2f3fe;
	--color-green:#41a437;
	--color-green-rgb:65, 164, 55;
	--color-lightgrey:#f0f0f0;
	--color-darkgrey:#575757;
	--color-red:#cd1919;
	--color-red-rgb:205, 25, 25;
	
	--main-background:#c9c9c9;
	--bodyoverflow-background:var(--main-background);
	
	--border-width:0.125rem;
	--border-radius:1rem;
	
	--padding-content:3rem;
	--padding-box:1rem;
	--innerPadding-content:1rem;
	--gap-contentMedium:4rem;
	--gap-contentImmo:2rem;
	--gap-contentNarrow:1.5rem;
	--gap-contentSmall:1rem;
	--gap-box:1rem;	
	
	--header-background:var(--color-white);
	--header-color:var(--color-black);
	--header2-background:var(--color-blue);
	--header2-color:var(--color-white);
	
	--topnav-color:var(--color-white);
	--topnav-hover-color:var(--color-lightgrey);
	
	--topnav-sub-color:var(--color-white);
	--topnav-sub-background:var(--color-green);
	--topnav-sub-border-radius:var(--border-radius);
	--topnav-sub-link-color:var(--color-white);
	--topnav-sub-link-hover-color:var(--color-white);
	
	--sidenav-header-background:var(--color-blue);
	--sidenav-header-color:var(--color-white);
	--sidenav-background:var(--color-white);
	--sidenav-color:var(--color-black);
	--sidenav-hover-color:var(--color-blue);
	--sidenav-border-color:var(--color-lightgrey);
	--sidenav-goback-background:var(--color-green);
	--sidenav-goback-color:var(--color-white);
	--sidenav-expand-background:var(--color-lightblue);
	--sidenav-expand-hover-background:var(--color-blue);
	--sidenav-expand-color:var(--color-green);
	--sidenav-expand-hover-color:var(--color-white);
	
	--footer-oben-color:var(--color-white);
	--footer-oben-background:var(--color-blue);
	--footer-unten-color:var(--color-blue);
	--footer-unten-background:var(--color-white);
}

body,
body > main > section > div.bgColor-white,
body > main > section > div .boxColor-white,
body > main > section > div.bgColor-grey,
body > main > section > div .boxColor-grey,
body > main > section > div.bgColor-lightblue,
body > main > section > div .boxColor-lightblue{
	--text-color:var(--color-black);
	--background:var(--color-white);
	
	--text-header-color:var(--color-blue);
	--text-subheader-color:var(--color-black);
	
	--link-color:var(--color-blue);
	--link-hover-color:var(--color-red);
	--link-decoration:none;
	--link-weight:inherit;
	
	--input-background:var(--color-white);
	--input-color:var(--color-black);
	--input-border-color:var(--color-blue);
	
	--button-color:var(--color-white);
	--button-hover-color:var(--color-white);
	--button-background:var(--color-blue);
	--button-hover-background:var(--color-blue);
	--button-border-color:var(--color-blue);
	--button-border-width:var(--border-width);
	--button-border-radius:100px;
	--button-icon-color:var(--color-white);
	--button-hover-icon-color:var(--color-white);
	
	--button-alt-color:var(--color-blue);
	--button-alt-hover-color:var(--color-blue);
	--button-alt-background:var(--color-white);
	--button-alt-hover-background:var(--color-white);
	--button-alt-border-color:var(--color-blue);
	--button-alt-border-width:var(--border-width);
	--button-alt-border-radius:100px;
	--button-alt-icon-color:var(--color-blue);
	--button-alt-hover-icon-color:var(--color-blue);
	
	--swiper-scrollbar-bg-color:var(--color-lightblue);
	--swiper-scrollbar-drag-bg-color:var(--color-blue);
	
	--team-header-color:var(--color-blue);
	--team-color:var(--color-black);
	--team-icon-color:var(--color-blue);
}

body > main > section > div.bgColor-grey,
body > main > section > div .boxColor-grey{
	--background:var(--color-lightgrey);
}

body > main > section > div.bgColor-lightblue,
body > main > section > div .boxColor-lightblue{
	--background:var(--color-lightblue);
	--swiper-scrollbar-bg-color:var(--color-white);
}

body > main > section > div.bgColor-blue,
body > main > section > div .boxColor-blue{
	--text-color:var(--color-white);
	--background:var(--color-blue);
	
	--text-header-color:var(--color-white);
	--text-subheader-color:var(--color-white);
	
	--link-color:var(--color-white);
	--link-hover-color:var(--color-white);
	--link-decoration:underline;
	--link-weight:inherit;
	
	--input-border-color:var(--color-green);
	
	--button-color:var(--color-blue);
	--button-hover-color:var(--color-blue);
	--button-background:var(--color-white);
	--button-hover-background:var(--color-white);
	--button-border-color:var(--color-white);
	--button-border-width:var(--border-width);
	--button-border-radius:100px;
	--button-icon-color:var(--color-blue);
	--button-hover-icon-color:var(--color-blue);
	
	--button-alt-color:var(--color-white);
	--button-alt-hover-color:var(--color-white);
	--button-alt-background:var(--color-blue);
	--button-alt-hover-background:var(--color-blue);
	--button-alt-border-color:var(--color-white);
	--button-alt-border-width:var(--border-width);
	--button-alt-border-radius:100px;
	--button-alt-icon-color:var(--color-white);
	--button-alt-hover-icon-color:var(--color-white);
	
	--swiper-scrollbar-bg-color:var(--color-lightblue);
	--swiper-scrollbar-drag-bg-color:var(--color-green);
	
	--team-header-color:var(--color-white);
	--team-color:var(--color-white);
	--team-icon-color:var(--color-white);
}

body > main > section > div.bgColor-transparent,
body > main > section > div .boxColor-transparent{
	--background:transparent;
}