/*
* === THEME COLORS ===
*/
:root {
	--primary-theme: #7cafd9;
	--primary-theme-lighten-90: #f2f7fc;
	--primary-theme-lighten-80: #e5eff8;
	--primary-theme-lighten-70: #d8e7f4;
	--primary-theme-lighten-60: #cbdff0;
	--primary-theme-lighten-50: #bed7ec;
	--primary-theme-lighten-40: #b1cfe9;
	--primary-theme-lighten-30: #a4c7e5;
	--primary-theme-lighten-20: #97bfe1;
	--primary-theme-lighten-10: #8ab7dd;
	--primary-theme-darken-10: #709ec4;
	--primary-theme-darken-20: #648cae;
	--primary-theme-darken-30: #577b98;
	--primary-theme-darken-40: #4b6983;
	--primary-theme-darken-50: #3e586d;
	--primary-theme-darken-60: #324657;
	--primary-theme-darken-70: #263542;
	--primary-theme-darken-80: #19232c;
	--primary-theme-darken-90: #0d1216;
	--primary-theme-opacity-10: rgba(124,175,217,.1);
	--primary-theme-opacity-20: rgba(124,175,217,.2);
	--primary-theme-opacity-30: rgba(124,175,217,.3);
	--primary-theme-opacity-40: rgba(124,175,217,.4);
	--primary-theme-opacity-50: rgba(124,175,217,.5);
	--primary-theme-opacity-60: rgba(124,175,217,.6);
	--primary-theme-opacity-70: rgba(124,175,217,.7);
	--primary-theme-opacity-80: rgba(124,175,217,.8);
	--primary-theme-opacity-90: rgba(124,175,217,.9);
	--secondary-theme: #2c78b7;
	--secondary-theme-lighten-90: #eaf2f8;
	--secondary-theme-lighten-80: #d5e4f1;
	--secondary-theme-lighten-70: #c0d7ea;
	--secondary-theme-lighten-60: #abc9e3;
	--secondary-theme-lighten-50: #96bcdb;
	--secondary-theme-lighten-40: #81aed4;
	--secondary-theme-lighten-30: #6ca1cd;
	--secondary-theme-lighten-20: #5793c6;
	--secondary-theme-lighten-10: #4286bf;
	--secondary-theme-darken-10: #286ca5;
	--secondary-theme-darken-20: #246093;
	--secondary-theme-darken-30: #1f5481;
	--secondary-theme-darken-40: #1b486e;
	--secondary-theme-darken-50: #163c5c;
	--secondary-theme-darken-60: #12304a;
	--secondary-theme-darken-70: #0e2437;
	--secondary-theme-darken-80: #091825;
	--secondary-theme-darken-90: #050c13;
	--primary-accent: #E94F37;
	--secondary-accent: #6DA34D;
	--primary-cta: #E94F37;
	--secondary-cta: #6DA34D;
	--dark-background: #000e1c;
	--light-background: #F6F7EB;
	--dark-text: #000e1c;
	--light-text: #ffffff;

}
/*
* === FLUID FONTS ===
*/
:root {
	--fluid-min-width: 480;
	--fluid-max-width: 1120;
	--fluid-min-size: 12;
	--fluid-max-size: 16;
	--fluid-min-ratio: 1.25;
	--fluid-max-ratio: 1.33;
	--fluid-screen: 100vw;
	--fluid-bp: calc((var(--fluid-screen) - ((var(--fluid-min-width) / 16) * 1rem)) / ((var(--fluid-max-width) / 16) - (var(--fluid-min-width) / 16)));
}
@media screen and (max-width: 480px) {
	:root {
		--fluid-screen: calc(var(--fluid-min-width) * 1px);
	}
}
@media screen and (min-width: 1120px) {
	:root {
		--fluid-screen: calc(var(--fluid-max-width) * 1px);
	}
}
:root {
	--fluid-max-negative: (1 / var(--fluid-max-ratio) / var(--fluid-max-ratio));
	--fluid-min-negative: (1 / var(--fluid-min-ratio) / var(--fluid-min-ratio));

	--fluid-min-scale-0: var(--fluid-min-ratio);
	--fluid-max-scale-0: var(--fluid-max-ratio);
	--fluid-min-size-0: (var(--fluid-min-size)) / 16;
	--fluid-max-size-0: (var(--fluid-max-size)) / 16;
	--step-0: calc(((var(--fluid-min-size-0) * 1rem) + (var(--fluid-max-size-0) - var(--fluid-min-size-0)) * var(--fluid-bp)));

	--fluid-min-scale-1: var(--fluid-min-scale-0) * var(--fluid-min-ratio);
	--fluid-max-scale-1: var(--fluid-max-scale-0) * var(--fluid-max-ratio);
	--fluid-min-size-1: (var(--fluid-min-size) * var(--fluid-min-scale-0)) / 16;
	--fluid-max-size-1: (var(--fluid-max-size) * var(--fluid-max-scale-0)) / 16;
	--step-1: calc(((var(--fluid-min-size-1) * 1rem) + (var(--fluid-max-size-1) - var(--fluid-min-size-1)) * var(--fluid-bp)));

	--fluid-min-scale-2: var(--fluid-min-scale-1) * var(--fluid-min-ratio);
	--fluid-max-scale-2: var(--fluid-max-scale-1) * var(--fluid-max-ratio);
	--fluid-min-size-2: (var(--fluid-min-size) * var(--fluid-min-scale-1)) / 16;
	--fluid-max-size-2: (var(--fluid-max-size) * var(--fluid-max-scale-1)) / 16;
	--step-2: calc(((var(--fluid-min-size-2) * 1rem) + (var(--fluid-max-size-2) - var(--fluid-min-size-2)) * var(--fluid-bp)));

	--fluid-min-scale-3: var(--fluid-min-scale-2) * var(--fluid-min-ratio);
	--fluid-max-scale-3: var(--fluid-max-scale-2) * var(--fluid-max-ratio);
	--fluid-min-size-3: (var(--fluid-min-size) * var(--fluid-min-scale-2)) / 16;
	--fluid-max-size-3: (var(--fluid-max-size) * var(--fluid-max-scale-2)) / 16;
	--step-3: calc(((var(--fluid-min-size-3) * 1rem) + (var(--fluid-max-size-3) - var(--fluid-min-size-3)) * var(--fluid-bp)));

	--fluid-min-scale-4: var(--fluid-min-scale-3) * var(--fluid-min-ratio);
	--fluid-max-scale-4: var(--fluid-max-scale-3) * var(--fluid-max-ratio);
	--fluid-min-size-4: (var(--fluid-min-size) * var(--fluid-min-scale-3)) / 16;
	--fluid-max-size-4: (var(--fluid-max-size) * var(--fluid-max-scale-3)) / 16;
	--step-4: calc(((var(--fluid-min-size-4) * 1rem) + (var(--fluid-max-size-4) - var(--fluid-min-size-4)) * var(--fluid-bp)));

	--fluid-min-scale-5: var(--fluid-min-scale-4) * var(--fluid-min-ratio);
	--fluid-max-scale-5: var(--fluid-max-scale-4) * var(--fluid-max-ratio);
	--fluid-min-size-5: (var(--fluid-min-size) * var(--fluid-min-scale-4)) / 16;
	--fluid-max-size-5: (var(--fluid-max-size) * var(--fluid-max-scale-4)) / 16;
	--step-5: calc(((var(--fluid-min-size-5) * 1rem) + (var(--fluid-max-size-5) - var(--fluid-min-size-5)) * var(--fluid-bp)));

	--fluid-min-scale-6: var(--fluid-min-scale-5) * var(--fluid-min-ratio);
	--fluid-max-scale-6: var(--fluid-max-scale-5) * var(--fluid-max-ratio);
	--fluid-min-size-6: (var(--fluid-min-size) * var(--fluid-min-scale-5)) / 16;
	--fluid-max-size-6: (var(--fluid-max-size) * var(--fluid-max-scale-5)) / 16;
	--step-6: calc(((var(--fluid-min-size-6) * 1rem) + (var(--fluid-max-size-6) - var(--fluid-min-size-6)) * var(--fluid-bp)));
}
/*
* === VAR MAPS ===
*/
body {
	font-size: var(--step-0);
	line-height: 1.5;
}
h1 {
	font-size: var(--step-6);
	line-height: 1.5;
}
h2 {
	font-size: var(--step-5);
	line-height: 1.5;
}
h3 {
	font-size: var(--step-4);
	line-height: 1.5;
}
h4 {
	font-size: var(--step-3);
	line-height: 1.5;
}
h5 {
	font-size: var(--step-2);
	line-height: 1.5;
}
h6 {
	font-size: var(--step-1);
	line-height: 1.5;
}
