/* ========== FONTS AND TEXT PROPERTIES ========== */

body {
	font-family: "Open Sans", Helvetica, "Liberation Sans", "Arial", "Trebuchet MS", "Noto Sans", "FreeSans", "DejaVu Sans Condensed", sans-serif;
}

h1 {
	font-size: 36px; /* fallback for browsers that don't support rem */
	/* font-size: 2.25rem; 36px in most browsers */
	font-weight: 300;
	color: #424242;
	line-height: 1.22222;
}

h2 {
	font-size: 24px; /* fallback for browsers that don't support rem */
	/* font-size: 1.5rem; 24px in most browsers */
	font-weight: 300;
	color: #424242;
	line-height: 1.3em;
}

h3 {
	font-size: 18px; /* fallback for browsers that don't support rem */
	/* font-size: 1.125rem; 18px in most browsers */
	font-weight: 400;
	color: #003e5c;
	line-height: 1.22222;
}

h4 {
	font-size: 16px; /* fallback for browsers that don't support rem */
	/* font-size: 1rem; 16px in most browsers */
	font-weight: 300;
	color: #424242;
	line-height: 1.375;
}

h5 {
	font-size: 14px; /* fallback for browsers that don't support rem */
	/* font-size: 0.875rem; 14px in most browsers */
	font-weight: 700;
	color: #003e5c;
	line-height: 1.57143;
}

h6 {
	font-size: 14px; /* fallback for browsers that don't support rem */
	/*font-size: 0.875rem; 14px in most browsers */
	font-weight: 300;
	color: #424242;
	line-height: 1.83333;
}

p {
	font-size: 16px; /* fallback for browsers that don't support rem */
	/*font-size: 1rem; 16px in most browsers */
	font-weight: 300;
	color: #3d3d3d;
	line-height: 1.5;
}

a {
	font-size: 16px; /* fallback for browsers that don't support rem */
	/*font-size: 1rem; 16px in most browsers */
	font-weight: 300;
	color: #003E5C;
	line-height: 1.5;		
}

/* ========== FONTS AND TEXT PROPERTIES IN MAIN CONTENT ========== */

.section-main-content h1 {
	/*margin-top: 0.2rem;*/
	margin-top: 3.2px;
	/*margin-bottom: 0.6rem;*/
	margin-bottom: 9.6px;
}

.section-main-content h2 {
	/*margin-top: 0.2rem;*/
	margin-top: 3.2px;
	/*margin-bottom: 0.6rem;*/
	margin-bottom: 9.6px;
}

.section-main-content h3 {
	/*margin-top: 0.2rem;*/
	margin-top: 3.2px;
	/*margin-bottom: 0.6rem;*/
	margin-bottom: 9.6px;
}

.section-main-content h4 {
	/*margin-top: 0.2rem;*/
	margin-top: 3.2px;
	/*margin-bottom: 0.6rem;*/
	margin-bottom: 9.6px;
}

.section-main-content h5 {
	/*margin-top: 0rem;*/
	margin-top: 0px;
	/*margin-bottom: 0rem;*/
	margin-bottom: 0px;
}

.section-main-content h6 {
	/*margin-top: 0.2rem;*/
	margin-top: 3.2px;
	/*margin-bottom: 0.6rem;*/
	margin-bottom: 9.6px;
}

.section-main-content p {
	/*margin-top: 0;*/
	margin-top: 0px;
	/*margin-bottom: 0.8em;*/
	margin-bottom: 12.8px;
}

/* ========== FOREGROUND COLORS ========== */

.dekom-ci-color-red {
	color: #D4021D;
}

.dekom-ci-color-blue {
	color: #003E5C;
}

.dekom-ci-color-white {
	color: #FFFFFF;
}

.dekom-ci-color-almost-white {
	color: #F9F9F9;
}

.dekom-ci-color-light-gray {
	color: #E2E2E2;
}

.dekom-ci-color-gray {
	color: #BEBEBE;
}

.dekom-ci-color-dark-gray {
	color: #707070;
}

.dekom-ci-color-very-dark-gray {
	color: #434343;
}

/* ========== SVG COLORS ========== */
/*

	Note: The filter-definitions are generated from color codes (i.e. #0000FF) using the following

		online service: https://codepen.io/sosuke/pen/Pjoqqp

		The Resulting filter-definitions are prepended with "brightness(0) saturate(100%)" to

		increase color accuracy.
*/

.dekom-ci-svg-red {
	color: #D4021D;
	filter: brightness(0) saturate(100%) invert(12%) sepia(100%) saturate(5274%) hue-rotate(347deg) brightness(82%) contrast(106%);
}

.dekom-ci-svg-blue {
	color: #003E5C;
	filter: brightness(0) saturate(100%) invert(15%) sepia(96%) saturate(1025%) hue-rotate(170deg) brightness(101%) contrast(101%);
}

.dekom-ci-svg-white {
	color: #FFFFFF;
	filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7473%) hue-rotate(111deg) brightness(94%) contrast(110%);
}

.dekom-ci-svg-almost-white {
	color: #F9F9F9;
	filter: brightness(0) saturate(100%) invert(100%) sepia(41%) saturate(26%) hue-rotate(215deg) brightness(112%) contrast(95%);
}

.dekom-ci-svg-light-gray {
	color: #E2E2E2;
	filter: brightness(0) saturate(100%) invert(100%) sepia(1%) saturate(1397%) hue-rotate(281deg) brightness(110%) contrast(77%);
}

.dekom-ci-svg-gray {
	color: #BEBEBE;
	filter: brightness(0) saturate(100%) invert(90%) sepia(0%) saturate(102%) hue-rotate(223deg) brightness(94%) contrast(71%);
}

.dekom-ci-svg-dark-gray {
	color: #707070;
	filter: brightness(0) saturate(100%) invert(46%) sepia(1%) saturate(1%) hue-rotate(349deg) brightness(94%) contrast(93%); /* The generator describes this color as "somewhat of" for some reason. WIll hopefully work anyway */
}

.dekom-ci-svg-very-dark-gray {
	color: #434343;
	filter: brightness(0) saturate(100%) invert(22%) sepia(0%) saturate(1207%) hue-rotate(212deg) brightness(102%) contrast(87%);
}

/* ========== BACKGROUND COLORS ========== */

.dekom-ci-bg-color-red {
	background-color: #D4021D;
}

.dekom-ci-bg-color-blue {
	background-color: #003E5C;
}

.dekom-ci-bg-color-white {
	background-color: #FFFFFF;
}

.dekom-ci-bg-color-almost-white {
	background-color: #F9F9F9;
}

.dekom-ci-bg-color-light-gray {
	background-color: #E2E2E2;
}

.dekom-ci-bg-color-gray {
	background-color: #BEBEBE;
}

.dekom-ci-bg-color-dark-gray {
	background-color: #707070;
}

.dekom-ci-bg-color-very-dark-gray {
	background-color: #434343;
}

/* ========== BACKGROUND TEXT-AUTO-WHITE ========== */
/* This overwrites the text colors to white for texts that are on a darker background. It's intentionally coming after the other color definitions. */

.dekom-ci-bg-color-red {
	color: white;
}

.dekom-ci-bg-color-red h1,
.dekom-ci-bg-color-red h2,
.dekom-ci-bg-color-red h3,
.dekom-ci-bg-color-red h4,
.dekom-ci-bg-color-red h5,
.dekom-ci-bg-color-red h6,
.dekom-ci-bg-color-red p {
	color: white;
}

.dekom-ci-bg-color-blue {
	color: white;
}

.dekom-ci-bg-color-blue h1,
.dekom-ci-bg-color-blue h2,
.dekom-ci-bg-color-blue h3,
.dekom-ci-bg-color-blue h4,
.dekom-ci-bg-color-blue h5,
.dekom-ci-bg-color-blue h6,
.dekom-ci-bg-color-blue p {
	color: white;
}

.dekom-ci-bg-color-gray {
	color: white;
}

.dekom-ci-bg-color-gray h1,
.dekom-ci-bg-color-gray h2,
.dekom-ci-bg-color-gray h3,
.dekom-ci-bg-color-gray h4,
.dekom-ci-bg-color-gray h5,
.dekom-ci-bg-color-gray h6,
.dekom-ci-bg-color-gray p {
	color: white;
}

.dekom-ci-bg-color-dark-gray {
	color: white;
}

.dekom-ci-bg-color-dark-gray h1,
.dekom-ci-bg-color-dark-gray h2,
.dekom-ci-bg-color-dark-gray h3,
.dekom-ci-bg-color-dark-gray h4,
.dekom-ci-bg-color-dark-gray h5,
.dekom-ci-bg-color-dark-gray h6,
.dekom-ci-bg-color-dark-grayp {
	color: white;
}

.dekom-ci-bg-color-very-dark-gray {
	color: white;
}

.dekom-ci-bg-color-very-dark-gray h1,
.dekom-ci-bg-color-very-dark-gray h2,
.dekom-ci-bg-color-very-dark-gray h3,
.dekom-ci-bg-color-very-dark-gray h4,
.dekom-ci-bg-color-very-dark-gray h5,
.dekom-ci-bg-color-very-dark-gray h6,
.dekom-ci-bg-color-very-dark-gray p {
	color: white;
}