:root {
	--Raisin-Black		: #131316;
	--AF-White			: #F0F0F1;
	--Taupe-Gray		: #8E8F93;
	--Dark-Gray			: #1D1F27;
	--Darkslate-Green	: #293C36;
	--Hunter-Green		: #355945;
	--Darkspring-Green	: #417654;
	--Sea-Green			: #4C9263;
	--Green2			: #79AE8A;
	--Cambridge-Green	: #A6C9B1;
	--Light-Green		: #D3E4D8;
	--Orange1			: #99331f;
	--Almond-Silk		: #E6CCC7;
	--Rosy-Taupe		: #CC998F;
	--Terracotta-Clay	: #B36657;
	--Chestnut			: #99331F;
	--Dark-Chestnut		: #7A2E21;
	--Espresso			: #5B2923;
	--Dark-Coffee		: #3C2425;
	--Shadow Grey		: #1D1F27;
	scrollbar-color: #355945 #417654;
}

@font-face {
  font-family: "Source Sans Pro";
  src: url('fonts/SourceSansPro-Regular.ttf');
  src: url('fonts/SourceSansPro-Regular.otf') format('opentype'),
       url('fonts/SourceSansPro-Regular.woff') format('woff'),
       url('fonts/SourceSans3-Regular.ttf') format('truetype');
}
@font-face {
  font-family: "Source Sans Pro Bold";
  src: url('fonts/SourceSans3-Bold.ttf');
  src: url('fonts/SourceSansPro-Bold.otf') format('opentype'),
       url('fonts/SourceSansPro-Bold.woff') format('woff'),
       url('fonts/SourceSans3-Bold.ttf') format('truetype');
}
@font-face {
  font-family: "OpenSans";
  src: url('fonts/OpenSans-Regular.ttf');
  src: url('fonts/OpenSans-Regular.ttf') format('truetype');
}

HTML, BODY {
	background				: White;
	padding					: 0;
	margin					: 0;
	border					: 0;
	word-wrap				: break-word;
}
HTML {
	height					: 100vh;
	overflow-y				: auto;
}
BODY {
	box-sizing				: border-box;
	font-size				: 1em;
	font-family				: "Source Sans Pro", sans-serif;
    font-weight				: normal;
	text-rendering			: optimizeLegibility;
	-webkit-font-smoothing	: subpixel-antialiased;
	-moz-osx-font-smoothing	: grayscale;	
	position				: Relative;
	width					: 100%;
	min-height				: 100%;
    background				: transparent;
    color					: var(--Dark-Gray);
}
DIV.language {
	display					: None;
}
DIV.language A, DIV.language IMG  {
	display					: None;
}
DIV.language SPAN.seperator {
	display					: None;
}
DIV.logo {
	background-color		: rgb(29 31 39 / .25);
	z-index					: 5;
	position				: absolute;
	width					: 100%;
	border-bottom			: 1px rgb(255 255 255 / .1);
	
}
DIV.logo a {
	display					: flex;
	justify-content			: left;
}
DIV.logo IMG.logo {
	height					: auto;
	padding					: 10px 0 15px 0;
	position				: Relative;
	z-index					: 2;
	background				: transparent;
	left					: 10em;
}
DIV.logo IMG.logo:hover {
	opacity					: 0.5;
	transition				: all 500ms ease;
	background				: transparent;
}
DIV.logo H1, DIV.logo H2 {
	display					: none;
}
DIV.body {
	display					: flex;
	order					: 1;
	flex-basis				: 100%;
	flex-shrink				: 0;
	flex-grow				: 1;
	flex-direction			: column;
	box-shadow				: 0 0 5px rgb(0 0 0 / 50%);
	z-index					: 1;
	padding					: 0;
	margin					: 0 0 -8em 0;
}
DIV.breadcrumbs {
	display					: none;
	align-content			: center;
	margin					: auto;
	padding					: 2em 0 1em 0;
	text-align				: left;
}
DIV.breadcrumbs P {
	margin					: auto;
	padding					: 0;
}
DIV.green {
	background-color		: var(--Cambridge-Green);
}
H1 {
	font-size				: 35px;
	text-decoration			: None;
	font-weight				: normal;
}
H2 {
	font-size				: 40px;
	font-weight				: 800;
	text-decoration			: None;
	font-weight				: normal;
	color					: var(--Darkspring-Green);
}
H2.personal {
	margin-top				: 0;
}
H2 A {
	text-decoration			: None;
	color					: var(--Cambridge-Green);	
	text-shadow				: none;
	transition				: all 600ms ease;
}
H2 A:hover {
	text-decoration			: None;
	text-shadow				: 0px 1px 6px var(--Cambridge-Green);	
	transition				: all 600ms ease;
}
H3 {
	font-size				: 17px;
	text-decoration			: None;
	font-weight				: normal;
	margin-bottom			: 3em;
}

H4 {
	font-size				: 24px;
	text-decoration			: None;
	font-weight				: normal;
	line-height				: 28px;
	color					: var(--Raisin-Black);
	margin-block-end		: 0.75em;
}
H5 {
	font-size				: 22px;
	text-decoration			: None;
	font-weight				: normal;
	line-height				: 26px;
	color					: var(--Darkslate-Green);
	margin					: 0;
	margin-block-end		: 0;
}
LI {
	font-size				: 18px;
	line-height				: 28px;
	color					: var(--Darkslate-Green);
}
blockquote {
	color					: var(--Dark-Gray);
	text-align				: center;
}
blockquote#middle {
	font-size				: 40px;
	max-width				: 17em;
	margin-left				: auto;
	margin-right			: auto;
	line-height				: 1em;
}
blockquote#middle-2 {
	font-size				: 40px;
	max-width				: 100%;
	margin-left				: auto;
	margin-right			: auto;
	line-height				: 1em;
}
blockquote#review {
	font-size				: 30px;
	max-width				: 60%;
	margin-left				: auto;
	margin-right			: auto;
	line-height				: 1em;
}
.anchor {
	display					: block;
	position				: relative;
	top						: -4em;
	visibility				: hidden;
}
.center {
	text-align				: center;
}
/* ============================================ *
 * Navigation
 * ============================================ */
DIV.navigation {
	display					: flex;
	justify-content			: center;
	z-index					: 6;
	transition				: all 300ms ease;
	width					: 100%;
	padding					: 0;
	position				: absolute;
	top						: 6em;
	background-color		: rgb(29 31 39 / .25);
}
DIV.navigation UL {
	display					: flex;
	list-style-type			: None;
	flex-wrap				: nowrap;
	flex-direction			: row;
	font-family				: "Source Sans Pro", sans-serif;
	margin					: 25px 0 25px 0;
	max-height				: 3em;
	box-sizing				: content-box;
}
DIV.navigation UL UL {
	display					: None;
}
DIV.navigation LI {
	flex-grow				: 0;
	flex-shrink				: 0;
	box-sizing				: border-box;
	min-width				: 4em;
	font-size				: 1.25em;
	margin-right			: 1em;
	max-width				: 10em;
}
DIV.navigation LI A:hover, DIV.navigation LI span:hover{
	color					: var(--Green2);
	text-shadow				: 0 0 2px Black;
	border-bottom			: 5px var(--Green2) solid;
	border-bottom-right-radius	: 4px;
	border-bottom-left-radius	: 4px;
	transition				: all 250ms ease;
}
DIV.navigation LI A, DIV.navigation LI span{
	color					: White;
	text-transform			: uppercase;
	text-shadow				: 0 0 2px black;
}
DIV.navigation > UL > LI.filled > A {
	height					: 100%;
	transition				: all 250ms ease;
}
DIV.navigation LI.currentpage A {
	font-weight				: Normal;
	border-bottom			: None;
	color					: White;
	border-bottom			: 5px var(--Green2) solid;
	border-bottom-right-radius	: 4px;
	border-bottom-left-radius	: 4px;
}
DIV.navigation SPAN.separator {
	display					: None;
}
/* ============================================ *
 * Content styling
 * ============================================ */
DIV.slogan {
	padding-left			: 8em;
	padding-top				: 10em;
	min-height				: 20vw;
	background-repeat		: no-repeat;
	background-position		: 0 65%;
	background-color		: transparent;
	background-size			: cover;
}
DIV.slogan P{
	font-family				: "Source Sans Pro", sans-serif;
	font-size				: 1.2em;
	text-align				: left;
	color					: White;
	text-shadow				: 0px 0px 5px black;
}
DIV.slogan P.small {
	font-size				: 0.75em;
}
DIV.slogan H1{
	font-family				: "Source Sans Pro", sans-serif;
	font-size				: 2.5em;
	text-align				: left;
	color					: White;
	margin-bottom			: 11px;
	text-shadow				: 0px 0px 5px black;
}
DIV#home  {
	background-image		: url("/images/home_promind.jpg");
}
DIV#werkwijze  {
	background-image		: url("/images/referenties_promind.jpg");
}
DIV#interim  {
	background-image		: url("/images/training_promind.jpg");
}
DIV#assessment  {
	background-image		: url("/images/over-ons_promind.jpg");
}
DIV#dreamteam  {
	background-image		: url("/images/dream-teams_promind.jpg");
}
DIV#coaching  {
	background-image		: url("/images/coaching_promind.jpg");
}
DIV#burnout  {
	background-image		: url("/images/burnout.jpg");
}
DIV#symptomen  {
	background-image		: url("/images/symptomen-burnout.jpg");
}
DIV#ondernemers  {
	background-image		: url("/images/burnout-ondernemers.jpg");
}
DIV#blog  {
	background-image		: url("/images/nieuws_promind.jpg");
}
DIV#contact  {
	background-image		: url("/images/contact_promind.jpg");
}
DIV#error  {
	background-image		: url("/images/home_promind.jpg");
	min-height				: 7em;
}
DIV.container {
	padding					: 70px 0;
	box-sizing				: border-box;
}
DIV.index-container {
	padding					: 0;
	box-sizing				: border-box;
	top						: -8em;
	position				: relative;
}
DIV.page-container {
	padding					: 3em 12%;
	background				: White;
	box-sizing				: border-box;
	top						: -8em;
	position				: relative;
}
DIV.error {
	padding					: 3em 12%;
	box-sizing				: border-box;
	top						: 8em;
	position				: relative;
	background-image		: url("/images/blurry-light-green.jpeg");
	background-size			: cover;
	background-repeat		: no-repeat;
	font-family				: 'OpenSans';
}
DIV.container P.center {
	padding					: 0;
	text-align				: center;
}
DIV.intro {
	clear					: both;
	display					: block;
	padding					: 2em 5em 2em 5em;
	background-image		: url("/images/blurry-light-green.jpeg");
	background-size			: cover;
	background-repeat		: no-repeat;
	font-family				: 'OpenSans';
	font-size				: 16px;
	color					: var(--Raisin-Black);
	line-height				: initial;
	font-weight				: initial;
	margin					: 0;
}
IMG.right{
	padding-bottom			: 1.25em;
	float					: right;
	background-color		: rgba(250, 250, 250, 0.5);
	border-radius			: 5px;
	margin					: 1em;
}
IMG.left{
	padding-bottom			: 1.25em;
	float					: left;
	background-color		: rgba(250, 250, 250, 0.5);
	border-radius			: 5px;
	margin					: 1em;
}
IMG.down{
	padding-bottom			: 15em;
}
DIV.intro H3{
	font-size				: 30px;
	font-weight				: normal;
	color					: var(--Darkspring-Green);
	margin-bottom			: inherit;
}
DIV.intro A {
	font-size				: 25px;
	font-weight				: normal;
	color					: var(--Dark-Gray);
	margin-bottom			: inherit;
	transition				: all 600ms ease;
	text-decoration			: underline;
}
DIV.intro A:hover {
	color					: var(--Hunter-Green);
	transition				: all 600ms ease;
}
DIV.blog {
	display					: flex;
	justify-content			: space-between;
	flex-flow				: Row Wrap;
	padding					: 1em 0;
	font-weight				: 400;
	line-height				: 30px;
}
DIV.blog > .post {
	width					: 32%;
	min-width				: 15em;
}
DIV.blog > .post  H2, DIV.blog > .post  P	{
	padding					: 0 0 0 25px;
}
DIV.blog_body  A {
	color					: var(--Sea-Green);
	transition				: all 500ms ease;
	text-decoration			: underline;
}
DIV.blog_body  A:hover {
	text-decoration			: None;
	text-shadow				: 0 0 5px var(--Sea-Green);
	transition				: all 600ms ease;
}
blockquote A {
	text-decoration			: None !important;
	color					: var(--Dark-Gray) !important;
	transition				: all 600ms ease;
}
blockquote A:hover {
	text-decoration			: None !important;
	color					: var(--Dark-Gray) !important;
	text-shadow				: 0 0 5px var(--Dark-Gray) !important;
	transition				: all 600ms ease;
}
DIV.inleiding {
	clear					: both;
	display					: block;
	padding					: 2em 162px 4em 162px;
	background-color		: var(--Cambridge-Green);
}
DIV.inleiding P {
	font-family				: 'OpenSans';
	font-size				: 24px;
	color					: var(--Raisin-Black);
	line-height				: initial;
	font-weight				: initial;
	max-width				: 37em;
	margin					: auto;
}
DIV.content {
	clear					: both;
	padding					: 1em 0 1em 1em;
}
DIV.main {
	clear					: both;
	padding					: 2em 0 1em 0;
	width					: 50%;
	margin					: auto;
}
DIV.blog-main {
	clear					: both;
	padding					: 2em 0 1em 0;
	width					: 50%;
	margin					: auto;
}
DIV.google {
	clear					: both;
	padding					: 4em 0 4em 0;
	width					: 100%;
	margin					: auto;
	background-color		: var(--Cambridge-Green);
	margin-bottom			: 2em;
}
iframe.maps {
	width					: 100%;
	height					: 25em;
	max-height				: 25em;
}
DIV.main-body {
	display					: flex;
	flex-flow				: wrap;
	clear					: both;
	width					: 100%;
	box-sizing				: border-box;
	background-color		: White;
	margin					: 0;
	padding					: 2em 5em;
}
DIV.max {
	margin					: 0;
	padding					: 0 !important;
}
DIV.main-body > .column*:first-child {
	margin-right			: 2em;
}
DIV.main-body > .column {
	flex-basis				: 44.5%;
	text-align				: center;
}
DIV.main-body > .column H4{
	color					: var(--Dark-Gray);
}
DIV.main-body > .column1 {
	flex-basis				: 94.5%;
	min-width				: 10em;
	text-align				: center;
}
DIV.main-body > .column1 H3, DIV.main-body > .column H3 {
	color					: var(--Dark-Gray);
	font-size				: 36px;
	margin-bottom			: inherit;
}
DIV.main-body > .columns3 {
	flex-basis				: 30.5%;
	min-width				: 10em;
	text-align				: center;
}
DIV.main-body > .columns3 H3{
	color					: var(--Dark-Gray);
	font-size				: 36px;
	margin-bottom			: inherit;
}
DIV.main-body > .column UL{
	list-style-position		: inside;
}
a {
	font-size				: 100%;
	color					: var(--Darkslate-Green);
	transition				: all 500ms ease;
	text-decoration			: none;
}
a:hover {
	text-decoration			: none;
	color					: var(--Green2);
	transition				: all 750ms ease;
}	
iframe {
	width					: 98%;
	height					: 20em;
	max-height				: 20em;
	border-width			: 1px;
	border-style			: solid;
	border-color			: rgba(0,0,0,0.13);
	padding					: 3px;
}
DIV.youtube {
	position				: relative;
	float					: right;
	max-width				: 49%;
	width					: 45%;
	box-sizing				: border-box;
	background-color		: rgba(76, 146, 108, 1);
	padding					: 20px;
	text-align				: center;
	margin					: 100px 1em 1em 1em;
	border-radius			: 10px;
	transition				: all 250ms ease;
}
DIV.youtube:hover {
	box-shadow				: 0 0 5px var(--Sea-Green);
	transition				: all 250ms ease;
}
DIV.bo-youtube {
	position				: relative;
	float					: none;
	max-width				: 95%;
	width					: 95%;
	box-sizing				: border-box;
	background-color		: var(--Terracotta-Clay);
	padding					: 20px;
	text-align				: center;
	margin					: auto;
	border-radius			: 10px;
	transition				: all 250ms ease;
}
DIV.bo-youtube:hover {
	box-shadow				: 0 0 5px var(--Terracotta-Clay);
	transition				: all 250ms ease;
}
DIV.color-box {
	display					: flex;
	flex-flow				: wrap;
	clear					: both;
	width					: 100%;
	box-sizing				: border-box;
	background-color		: var(--Green2);
	margin					: 0;
	padding					: 2em 20%;
}
DIV.columns, DIV.blogcolumns  {
	display					: flex;
	flex-flow				: wrap;
	justify-content			: space-around;
	padding					: 5% 4.5% 1em 4.5%;
}
DIV.columns > .column, DIV.columns > .columnd {
	flex-basis				: 23.5%;
	min-height				: 350px;
	padding					: 10px 0.5%;
	border-radius			: 20px;
	background				: var(--AF-White);
	margin-bottom			: 1%;
	transition				: all 600ms ease;
}
DIV.columns > .column:hover, DIV.columns > .columnd:hover, DIV.blogcolumns > .blogcolumn:hover {
	box-shadow				: 0 0 10px rgba(150, 150, 150, 1);
	transition				: all 600ms ease;
}
DIV.blogcolumns > .blogcolumn{
	flex-basis				: 23.5%;
	min-height				: 350px;
	padding					: 0.5%;
	border-radius			: 5px;
	background				: var(--AF-White);
	margin-bottom			: 1%;
	transition				: all 750ms ease;
}
.blogcolumn H3 {
	font-size				: 24px;
	text-decoration			: inherit;
	font-weight				: inherit;
	margin					: inherit;
}
DIV.blogcolumns > .blogcolumn:hover {
	background				: var(--Light-Green);
	transition				: all 750ms ease;
}
DIV.columns > .column:first-child {
	background-color		: rgba(114, 162, 131, 1);
}
DIV.columns > .column:nth-child(2) {
	background-color		: rgba(76, 146, 108, 1);
}
DIV.columns > .column:nth-child(3) {
	background-color		: rgba(213, 75, 48, 1);
}
DIV.columns > .column:nth-child(4) {
	background-color		: rgba(114, 163 ,139 , 1);
}
DIV.column H4 {
	color					: white;
}
DIV.columnd H4 {
	color					: Black;
}
DIV.column P {
	color					: white;
}
DIV.columnd P {
	color					: Black;
}
DIV.column A,DIV.columnd A {
	color					: White;
	transition				: all 500ms ease;
	text-decoration			: none;
}
DIV.column A.dark,DIV.columnd A.dark, DIV.column P.dark {
	color					: var(--Darkslate-Green);
}
DIV.column A:hover, DIV.columnd A:hover {
	text-decoration			: None;
	text-shadow				: 0 0 5px rgba(50, 50, 50, 0.25);
	transition				: all 600ms ease;
}
DIV.columns > .column  IMG {
	width					: 225px;
	display					: block;
	margin-left				: auto;
	margin-right			: auto;
	clear					: Both;
	padding-bottom			: 1.25em;
	float					: none;
	background-color		: rgba(250, 250, 250, 0.5);
	border-radius			: 10px;
}
DIV.columns > .columnd  IMG {
	width					: 225px;
	display					: block;
	margin-left				: auto;
	margin-right			: auto;
	clear					: Both;
	padding-bottom			: 1.25em;
	float					: none;
	background-color		: rgba(10, 10, 10, 0.25);
	border-radius			: 10px;
}
DIV.blogcolumns > .blogcolumn  IMG {
	width					: 225px;
	display					: block;
	margin-left				: auto;
	margin-right			: auto;
	clear					: Both;
	float					: none;
	background-color		: rgba(10, 10, 10, 0.25);
	border-radius			: 2px;
}
DIV.logos {
	padding					: 1em;
	display					: flex;
	justify-content			: space-around;
	flex-flow				: Row Wrap;
}
DIV.logos > .logo {
	width					: 32%;
	min-width				: 15em;
}
P {
	font-family				: 'OpenSans';
	padding					: 0;
	font-size				: 18px;
	line-height				: 28px;
	color					: var(--Dark-Gray);
}
P.black {
	font-family				: 'OpenSans';
	padding					: 0;
	font-size				: 18px;
	line-height				: 28px;
	color					: var(--Raisin-Black);
	margin					: 0;
}
EM	{
	font-family				: 'OpenSans';
	padding					: 0;
	font-size				: 18px;
	line-height				: 28px;
	color					: var(--Dark-Gray);
}

H2.headline {
	font-size				: 1.75em;
	color					: White;
	text-shadow				: 0px 0px 5px var(--Dark-Gray);
}

.headline em {
	font-family				: "Source Sans Pro", sans-serif;
	font-size				: 1.15em;
	text-align				: left;
	color					: White;
	text-shadow				: 0px 0px 5px var(--Dark-Gray);
	line-height				: initial;
}

DIV.buttons {
	font-family				: 'OpenSans';
	display					: Flex;
	justify-content			: flex-start;
	clear					: Both;
	margin					: 2em 0 2em 0 !important;
	padding					: 0;
}
DIV.buttonc {
	font-family				: 'OpenSans';
	display					: Flex;
	justify-content			: center;
	clear					: Both;
	margin					: 2em 0 2em 0 !important;
	padding					: 0;
}
DIV.buttonh {
	font-family				: 'OpenSans';
	display					: Flex;
	justify-content			: flex-start;
	clear					: Both;
	margin					: 2em 0 2em 0 !important;
	padding					: 0;
	font-size				: 18px;
	background-color: #15ae7d;
	border-radius: 30px;
	max-width: fit-content;
}
DIV.buttons > .space{
	font-family				: 'OpenSans';
	display					: Flex;
	justify-content			: flex-start;
	clear					: Both;
	margin					: 0 3em 0.5em 0 !important;
	padding					: 0;
}
DIV.buttons-left {
	clear					: Both;
	display					: Flex;
	margin					: 0 0 0.5em 0 !important;
	padding					: 0;
	justify-content			: start;
	flex-flow				: row wrap;
}
.promind-button {
	display					: flex;
	flex-grow				: 0;
	flex-basis				: auto;
	margin					: 0;
	padding					: 0;
	color					: var(--Raisin-Black);
	text-decoration			: None;
	background				: none;
	text-align				: center;
	margin-right			: 2em;
}
.promind-buttonc {
	display					: flex;
	flex-grow				: 0;
	flex-basis				: auto;
	margin					: 0;
	padding					: 0;
	color					: var(--Raisin-Black);
	text-decoration			: None;
	background				: none;
	text-align				: center;
}
.promind-button-inner {
	display					: flex;
	flex-grow				: 0;
	flex-basis				: auto;
	margin					: 0;
	text-decoration			: None;
	background				: none;
	height					: auto;
	padding					: 8px 16px !important;
	background				: rgb(29 31 39 / .25);
	color					: white;
	border					: 2px solid rgb(29 31 39 / .25);
	border-radius			: 30px;
	letter-spacing			: 0.05em;
	transition				: all 500ms ease;
	min-width				: 5em;
}
.promind-button:hover .promind-button-inner, .promind-buttonc:hover .promind-button-inner:hover {
	background				: rgb(255 255 255 / 1.0);
	color					: var(--Raisin-Black);
	border					: 2px solid rgb(29 31 39 / .25);
	box-shadow				: 0 0 5px rgb(193, 193, 193);
	text-shadow				: none;
}
.burnout-button {
	display					: flex;
	flex-grow				: 0;
	flex-basis				: auto;
	margin-right			: 2em;
	padding					: 0;
	color					: var(--Orange1);
	text-decoration			: None !important;
	background				: none;
	text-align				: center;
	font-size				: 100% !important;
}
.burnout-button-inner {
	display					: flex;
	flex-grow				: 0;
	flex-basis				: auto;
	margin					: 0;
	text-decoration			: None;
	background				: none;
	height					: auto;
	padding					: 8px 16px !important;
	background				: rgb(29 31 39 / .25);
	border					: 2px solid var(--Chestnut);
	border-radius			: 30px;
	letter-spacing			: 0.05em;
	transition				: all 500ms ease;
	min-width				: 5em;
}
.burnout-button:hover .burnout-button-inner:hover {
	color					: Black;
	border					: 2px solid var(--Orange1);
	box-shadow				: 0 0 5px var(--Orange1);
	text-shadow				: none;
	background-image		: url("/images/burn.jpg");
	background-position		: 0 70% !important;
	background-size			: cover;
	transition				: all 500ms ease;
}
HR {
	display					: block;
	box-sizing				: content-box;
	height					: 2px;
	background-color		: var(--Light-Green);
	clear					: both;
	border					: none;
}
blockquote P {
	margin-block-start		: 1em;
	margin					: 0 0 0 2em;
}
UL, OL {
	font-family				: 'OpenSans';
	padding-inline-start	: 20px;
}
/* ============================================ *
 * Blog styling
 * ============================================ */
DIV.blog-container {
	padding					: 0;
	box-sizing				: border-box;
	background				: White;
}
DIV.blog_post, DIV.blog_toc{
	padding					: 25em 7em 0 7em;
	transform				: translateY(0) scale(1);
	min-height				: 20vw;
	background-color		: transparent;
	background-size			: 2400px, auto;
	background-image		: url("/images/nieuws_promind-small.jpg");
	background-repeat		: no-repeat;
}
DIV.blog_toc H1 {
	color					: var(--Cambridge-Green);
	text-align				: center;
}
DIV.blog_toc A {
	color					: var--Darkslate-Green);
	text-align				: center;
}
DIV.blog_post H3 {
	margin					: 1.25em 0 1.25em 0;
    color					: var(--Darkslate-Green);
}
DIV.main IMG{
	max-width				: 50%;
	margin					: 1em;
}
DIV.blog_body  IMG {
	clear					: both;
	padding					: 1em;
	margin					: 0 2em 0 2em;
	float					: Right;
	width					: 50%;
	background-color		: var(--Cambridge-Green);
	margin-bottom			: 1em;
}
DIV.blog-image IMG{
	width					: 50%;
	display					: block;
	margin-left				: auto;
	margin-right			: auto;
	clear					: Both;
	padding					: 0;
	float					: none;
}
.right IMG{
	width					: 75% !important;
}
/* ============================================ *
 * Footer styling
 * ============================================ */
DIV.footer {
	order					: 4;
	display					: flex;
	flex-shrink				: 0;
	flex-grow				: 1;
	clear					: both;
	background-color		: var(--Green2);
	padding					: 0 0 1.5em 0;
	overflow				: visible;
	min-height				: 10em;
}
DIV.footer * {
	font-family				: 'OpenSans';
	font-size				: Medium;
	font-weight				: Normal;
	padding					: 0;
	text-align				: center;
}
DIV.footer P {
	color					: White;
	font-weight				: normal;
	line-height				: 24px;
	margin					: 15px 0;
}
DIV.footer P.copyright {
	position				: absolute;
	bottom					: 0;
	font-size				: 80%;
	left					: 44%;
	}
DIV.footer DIV.category {
	display					: flex;
	flex-direction			: column;
	float					: Left;
	box-sizing				: Border-Box;
	padding					: 0.25em 2%;
	margin					: auto;
	margin-top				: 0;
	width					: 40%;
}
DIV.footer DIV.category H2 {
	color					: var(--Dark-Gray);
	font-size				: 25px;
}
DIV.footer DIV.category UL {
	padding					: 0;
	margin					: 0;
	list-style-type			: None;
}
DIV.footer DIV.category LI {
	display					: Block;
	list-style-type			: None;
}
DIV.footer DIV.category LI.separator {
	height					: 1em;
}
DIV.footer DIV.category LI.separator  HR{
	display					: None;
}
DIV.footer DIV.category LI A, DIV.footer DIV.category P A {
	text-decoration			: None;
	color					: White;
	transition				: all 600ms ease;
}
DIV.footer DIV.category P A:hover{
	text-decoration			: None;
	color					: White;
	text-shadow				: 0 0 5px var(--Sea-Green);
	transition				: all 250ms ease;
	border-bottom			: 3px solid var(--Sea-Green);
}
DIV.footer DIV.category P A{
	transition				: all 250ms ease;
	border-bottom			: 0px solid var(--Sea-Green);
}
DIV.footer DIV.category P.newsection {
	margin-top				: 0.5em;
}
DIV.footer DIV.referers {
	position				: absolute;
	border					: 0;
	bottom					: 0;
	right					: 1em;
}
DIV.footer DIV.referers SPAN.separator {
	display					: None;
}
DIV.footer DIV.referers A {
	display					: Block;
	float					: left;
	padding					: 3px;
}
DIV.footer DIV.referers A:nth-child(3) {
	margin-left				: 8px;
}
DIV.footer DIV.referers A:nth-child(5) {
	margin-left				: 24px;
}
DIV.footer DIV.referers IMG {
	display					: Block;
	width					: 48px;
	height					: 48px;
	clear					: Both;
	border-radius			: inherit;
}
DIV.footer-content {
	display					: flex;
}
DIV.footer  .bubble {
	color					: var(--Sea-Green);
}
DIV.footer  A .bubble:hover{
	color					: var(--Sea-Green);
	text-shadow				: 0 0 4px var(--Sea-Green);
}
DIV.buttons-left {
	clear					: Both;
	display					: Flex;
	margin					: 0 0 0.5em 0 !important;
	padding					: 0;
	justify-content			: center;
	flex-flow				: row wrap;
}
DIV.footer-buttons {
	font-family				: 'OpenSans';
	display					: Flex;
	justify-content			: center;
	clear					: Both;
	margin					: 2em 0 2em 0 !important;
	padding					: 0;
}
.social-button {
	display					: flex;
	flex-grow				: 0;
	flex-basis				: auto;
	margin					: 0.5em !important;
	  margin-left			: 0.5em !important;
	padding					: 0;
	text-decoration			: None;
	background				: none;
	height					: 40px;
	width					: 40px;
}
.social-button IMG {
	opacity					: 0.75;
	transition				: all 500ms ease;
	height					: 40px;
	width					: 40px;
}
.social-button IMG:hover {
	opacity					: 1.0;
	transition				: all 500ms ease;
	height					: 40px;
	width					: 40px;
}
.footer-button {
	border-radius			: 30px;
	padding					: 0;
	color					: var(--Raisin-Black);
	text-decoration			: None;
	background				: none;
	text-align				: center;
}
.footer-button-inner {
	justify-content			: center;
	margin					: auto;
	text-decoration			: None;
	background				: none;
	height					: auto;
	padding					: 8px 16px !important;
	background				: var(--Sea-Green);
	color					: white;
	border					: 2px solid rgb(29 31 39 / .25);
	border-radius			: 30px;
	letter-spacing			: 0.05em;
	transition				: all 500ms ease;
	min-width				: 5em;
}
.footer-button:hover, .footer-button-inner:hover {
	border-radius			: 30px;
	color					: var(--Raisin-Black);
	box-shadow				: 0 0 5px rgba(29, 31, 39, 0.5);

}
PRE {
	color					: White;
	font-family				: "SFMono-Regular",Consolas,"Liberation Mono",Menlo,Courier,monospace;
	font-size				: 1em;
	font-weight				: bold;
	width					: 90%;
	overflow-x				: auto;
	white-space				: nowrap;
	background				: #444444;
	border-radius			: 0.5em;
	white-space				: pre-wrap;
	padding					: 0.5em 0.75em;
	margin					: 1em auto;
	overflow				: visible;
	overflow-x				: visible;
	clear					: both;
}

/* ============================================ *
 * Forms
 * ============================================ */
FORM {
	color				: var(--Raisin-Black);
	margin				: 1em 0 1em 0;
	width				: 100%;
	box-sizing			: Border-box;
}
FORM P {
	margin				: 0em;
	padding				: 0em;
	clear				: Right;
}
FORM P+P {
	padding-top			: 1em;
}
FORM P.field {
}
FORM P.controls {
	text-align			: Right;
}
FORM P.controls  A{
	margin-right		: 1em;
}
FORM INPUT, BUTTON, TEXTAREA {
	font-family			: 'OpenSans';
	font-size			: Medium;
	background			: White;
	color				: var(--Raisin-Black);
	border				: 1px solid #dcdcdc;
	border-radius		: 0.25em;
	box-sizing			: Border-box;
	margin				: 0;
	padding				: 0.125em;
}
FORM INPUT , TEXTAREA {
	float				: Right;
	width				: 66%;
}
FORM TEXTAREA {
}
INPUT[readonly] {
	border-color		: red;
	background			: #d8e4e9;	
}
FORM BUTTON {
	display					: flex;
	flex-grow				: 0;
	flex-basis				: auto;
	margin					: 0.5em !important;
	  margin-left			: 0.5em !important;
	padding					: 0;
	color					: var(--Raisin-Black);
	text-decoration			: None;
	background				: none;
	text-align				: center;
	min-width				: 8em;
}
FORM BUTTON.mail, FORM BUTTON.reset {
	display					: initial;
	flex-grow				: 0;
	flex-basis				: auto;
	margin					: auto !important;
	text-decoration			: None;
	background				: none;
	height					: auto;
	padding					: 8px 16px !important;
	background				: var(--Sea-Green);
	color					: white;
	border					: 2px solid var(--Sea-Green);
	border-radius			: 30px;
	letter-spacing			: 0.05em;
	transition				: all 500ms ease;
}
FORM BUTTON:hover, FORM BUTTON.mail:hover, FORM BUTTON.reset:hover {
	background				: none;
	color					: var(--Sea-Green);
	border					: 2px solid var(--Sea-Green);
	box-shadow				: 0 0 4px var(--Sea-Green);
}
FORM.compactForm {
	background			: White;
	color				: var(--Raisin-Black);
	border				: None;
	margin				: 0;
	padding				: 1em 0 0 1em;
}
FORM.compactForm P+P {
	padding-top			: 0.1em;
}
FORM.compactForm P.controls {
	text-align			: left;
}
FORM.compactForm P.controls  A{
	margin-right		: 1em;
}
FORM.compactForm INPUT, FORM.compactForm TEXTAREA {
	border-color		: Orange;
	border-radius		: 0;
}
FORM.compactForm INPUT, FORM.compactForm TEXTAREA {
	width				: 80%;
}
/* ============================================ *
 * Screen MAX 1400 wide
 * ============================================ */
@media only screen and (max-width: 1400px) {
	DIV.logo IMG.logo {
		left			: 5;
	}
}
/* ============================================ *
 * Screen MIN 1930 wide
 * ============================================ */
@media only screen and (min-width: 1930px) {
	DIV.navigation UL {
		flex-basis				: 33%;
		margin-top				: 3em;
	}
}
/* ============================================ *
 * Screen MAX 1200 wide
 * ============================================ */
@media only screen and (max-width: 1100px) {
	DIV.footer DIV.category {
		padding: 0.25em 2em 0 2em;
	}
	DIV.index-container {
		top: -5em;
	}
	DIV.columns, DIV.blogcolumns {
		padding: 5% 1em 1em 1em;
	}
}
/* ============================================ *
 * Screen MIN 1440 wide
 * ============================================ */
@media only screen and (min-width: 1440px) {
	DIV.slogan {
		padding					: 5em 20% 0 20%;
		min-height				: 13em;
		font-size				: 2.5em;
	}
	DIV.columns{
		padding					: 10px 5em 1em 5em;
	}
	DIV.blogcolumns {
		padding					: 10px 5em 1em 5em;
		background-color		: var(--Cambridge-Green);
	}
	DIV.intro {
		padding					: 3em 12%;
		text-align				: initial;
	}
	DIV.footer {
		min-height				: 10em;
		padding-left			: 15em;
		padding-right			: 15em;
	}
}
/* ============================================ *
 * Screen MAX 975 wide
 * ============================================ */
@media only screen and (max-width: 975px) {
	BODY {
		padding					: 0;
		margin					: 0;
		display					: Flex;
		flex-flow				: Column NoWrap;
	}
	BODY > * {
		flex-grow				: 0;
		flex-shrink				: 0;
		flex-basis				: Auto;
	}
	DIV.logo {
		margin					: 0;
		z-index					: 2;
	}
	DIV.logo a {
	}
	DIV.logo IMG.logo {
		height					: 50px;
		z-index					: 2;
		margin					: auto;
		left					: inherit;
	}
	DIV.navigation {
		transition				: transform 1s cubic-bezier(.230,1,.320,1);
		flex-direction			: column;
	}
	DIV.navigation:before {
		content					: "☰";
		font-size				: 300%;
		font-weight				: Bold;
		font-style				: Normal;
		line-height				: 1.75em;
		color					: White;
		z-index					: 5;
		position				: absolute;
		left					: 0;
		top						: 1em;
		min-width				: 2em;
	}
	DIV.navigation UL {
		flex-direction			: column;
		display					: None;
		position				: fixed;
		top						: 0;
		bottom					: 0;
		color					: White;
		z-index					: 1000;
		margin					: 0;
		background-image		: url(/images/blurry-green.jpeg);
		background-position		: 90% 0%;
		background-size			: cover;
		-webkit-transition		: transform 1s cubic-bezier(.230,1,.320,1);
		-moz-transition			: transform 1s cubic-bezier(.230,1,.320,1);
		transition				: transform 1s cubic-bezier(.230,1,.320,1);
		Width					: 320px;
		left					: 0;
		height					: 100%;
		max-height				: 100%;
		padding-top				: 10%;
	}
	DIV.navigation:hover UL {
		display					: Flex;
		transition				: all 500ms ease;
	}
	DIV.navigation LI {
		min-height				: 2em;
		display					: block;
		max-width				: 10em;
		background-color		: rgba(0, 0, 0, 0.25);
		padding					: 0.25em;
		margin					: 0.25em;
	}
	DIV.navigation LI.currentpage A {
		font-weight				: Normal;
		border-bottom			: None;
		color					: White;
		text-shadow				: 0 0 2px Black;
	}
	DIV.navigation LI.currentpage {
		background: var(--Raisin-Black) !important;
	}
	DIV.navigation LI.currentpage A:before {
		content					: ">  ";
	}
	DIV.navigation LI A:hover, DIV.navigation LI span:hover {
		color					: var(--Cambridge-Green);
		text-shadow				: 0 0 2px Black;
		border					: none;
		transition				: all 250ms ease;
	}
	DIV.navigation LI.currentpage UL A:before, DIV.navigation LI:hover UL A:before {
		content					: "";
	}
	DIV.navigation LI A, DIV.navigation LI span {
		color					: White;
		display					: block;
	}
	DIV.navigation UL UL {
		display					: None;
	}
	DIV.navigation UL UL LI{
		display					: None;
	}
	DIV.index-container {
		top						: 0em;
	}
	DIV.blog_post {
		padding					: 25em 2em 0 2em;
	}
	DIV.intro , DIV.inleiding, DIV.main {
		padding					: 1em 0.5em 4em 0.5em;
		width					: auto;
	}
	DIV.error {
		top						: 0;
	}
	IMG.down{
		padding-bottom			: 20em;
	}
	DIV.buttons {
		margin					: 0 0 2.5em 1em !important;
	}
	.promind-button, .burnout-button {
		margin-right			: 0.5em;
	}
	DIV.main-body {
		padding					: 2em 0.5em;
	}
	DIV.main-body > .columns3 {
		flex-basis				: 32.5%;
	}
	DIV.main-body > .columns3 H3 {
		font-size				: 30px;
	}	
	DIV.main-body > .column:first-child {
		margin-right			: 0;
	}
	DIV.content {
		padding					: 0 0.5em 0 0.5em;
	}
	DIV.color-box {
		padding					: 1em 0.5em 4em 0.5em;
	}
	DIV.color-box UL {
		padding-left			: 30px;
	}
	DIV.slogan {
		font-size				: 1.5em;
		padding					: 4em 3em 2em 4em;
	}
	DIV.slogan H1 {
		font-size				: 2em;
	}
	DIV.left {
		float					: none;
		box-sizing				: border-box;
		padding					: 0;
		margin					: auto;
		width					: 250px;
	}
	DIV.right {
		max-width				: 50%;
		padding					: 10px;
	}
	DIV.column {
		margin					: 0 auto 0 auto;
	}
	DIV.columns, DIV.blogcolumns {
		display					: flex;
		flex-flow				: wrap;
		justify-content			: space-around;
		padding					: 5px 0em 1em 0em;
	}
	DIV.column, DIV.columnd {
		flex-basis				: 48% !important;
		border-radius			: 5px !important;
	}
	DIV.column IMG{
		float					: initial;
		padding					: 0;
		margin					: 0;
		width					: 90%;
	}
	DIV.blogcolumns > .blogcolumn{
		flex-basis				: 47.5%;
	}
	DIV.footer {
		min-height: 20em;
	}
	DIV.footer-content {
		padding					: 0;
		width					: 96%;
		flex-direction			: column;
	}
	DIV.footer-buttons {
		margin					: auto;
		padding					: 0;
	}
	DIV.footer DIV.referers {
		bottom					: 0;
	}
	DIV.footer P {
		margin					: 0 0 2em 0;
		text-align				: center;
	}
	DIV.footer DIV.category {
		padding					: 0;
		margin					: 0 auto;
		flex-flow				: column;
		width					: 30%;
	}
}
/* ============================================ *
 * Screen MAX 700 wide
 * ============================================ */
@media only screen and (max-width: 640px) {
	DIV.navigation:before {
		top						: 0.25em;
		line-height				: 2.5em;
	}
	DIV.slogan {
		font-size				: 1.5em;
		padding					: 3em 0em 3em 2em;
		background-position		: -166px 65%;
	}
	DIV.blog_post {
		padding					: 25em 1em 0 1em;
	}
	DIV.columns {
		padding					: 0;
	}
	DIV.columns > .column, DIV.columns > .columnd {
		flex-basis				: initial;
		min-width				: 90%;
		max-width				: 95%;
	}
	DIV.column {
		flex-basis				: initial;
		min-width				: 100%;
	}
	DIV.column IMG.partners {
		display					: block;
		float					: none;
		margin					: auto;
		width					: 225px;
	}
	IMG.down {
		padding-bottom			: 0;
	}
	H2 {
		clear					: both;
	}
	DIV.blogcolumns > .blogcolumn {
		flex-basis				: 90%;
		margin-bottom			: 5%;
	}
	DIV.columns > .column, DIV.columns > .columnd {
		margin-top				: 1em;
	}
	DIV.main-body {
		padding					: 2em 0%;
	}
	DIV.main-body > .column1 {
		flex-basis				: 99%;
		box-shadow				: 0 0 5px #9D8F8D;
		margin					: auto;
	}
	DIV.main-body > .columns3 {
		flex-basis				: 99%;
	}
	DIV.youtube {
		float					: none;
		max-width				: 97%;
		width					: 95%;
		margin					: 1em auto;
	}
	IMG.right, IMG.left{
		max-width				: 40%;
	}
	DIV.footer-content {
		flex-direction			: column;
	}
	DIV.footer DIV.category P {
		position				: relative;
		text-align				: center;
	}
	DIV.footer DIV.category P A {
		float					: inherit;
	}
	DIV.footer P.copyright {
		left: 0;
	}
	DIV.footer {
		display: block;
	}
	DIV.footer DIV.category {
		width: 99%;
	}
}