/* -- */


@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,500,600);
@import url(https://fonts.googleapis.com/css?family=Inter:300,400,600,700,900);
@import url(https://fonts.googleapis.com/css?family=Raleway:400,600);


/* -- */


:root
{
  --default-font-family: "Inter";
  --default-font-size: 16px;
  --default-font-weight: 300;

  --accent-color: #1F3349;
  --white-color: #FEFEFE;
  --black-color: #1E293B;
  --body-bg-color: #E5E5E5;

  --window-max-width: 1600px;
  --page-max-width: 1000px;

  --page-default-padding: 100px;
  --page-horizontal-padding: max(80px, calc((var(--window-width) - var(--page-width)) / 2));

  --accent-color-filter: invert(16%) sepia(38%) saturate(677%) hue-rotate(171deg) brightness(97%) contrast(94%);

  --window-width: 0px; /* js var */
  --page-width: 0px; /* js var */

  /*--page-horizontal-padding: calc((min(100%, var(--window-max-width)) - min(100%, var(--page-max-width))) / 2);*/
  /*--page-width: calc( min(100%, var(--window-max-width)) - (2 * var(--page-horizontal-padding)) );*/


}


/* -- */


*
{
  margin: 0;
  padding: 0;
}

html
{
}

body
{
  background-color: var(--body-bg-color);
  color: #000000;

  font-family: var(--default-font-family);
  font-size: var(--default-font-size);
  font-weight: var(--default-font-weight);
  line-height: 180%;

  overflow-x: hidden;
  overflow-y: scroll;
}

a
{
  color: var(--accent-color);
  font-weight: bold;
  transition: color 0.3s ease;
}

a:hover, a:focus
{
  color: maroon;
}

a:active
{
  color: red;
}

h1, h2, h3, h4
{
  font: inherit;
  line-height: inherit;
  color: inherit;
}


/* -- */


.window
{
  width: min(100%, var(--window-max-width));
  height: auto;

  margin: 0 auto;

  opacity: 0;
  transition: opacity 1.0s ease;

  scroll-behavior: smooth;
}


/* -- */


.page::after, .listitem::after, .foot_content::after
{
  content: '';
  display: table;
  clear: both;
}

#kwalificaties .break
{
  clear: both;
  width: 100%;
  height: 1px;
}

.max600 { display: none; }


/* -- */