/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
@import url("https://use.typekit.net/rhd4xjf.css");
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

body {
  line-height: 1; }

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

nav ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none; }

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold; }

del {
  text-decoration: line-through; }

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0; }

input, select {
  vertical-align: middle; }

/**
 * Set up a decent box model on the root element
 */
/**
 * Make all elements from the DOM inherit from the parent box-sizing
 * Since `*` has a specificity of 0, it does not override the `html` value
 * making all elements inheriting from the root box-sizing value
 * See: https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/
 */
*, *::before, *::after {
  box-sizing: border-box; }

/**
 * Basic styles for links
 */
a {
  color: #e50050; }

img {
  max-width: 100%; }

/**
 * Basic typography style for copy text
 */
p {
  color: #282828;
  line-height: 1.5;
  margin-bottom: 1.3em; }

a {
  color: #337ab7; }

html, .root {
  font-size: 17px;
  line-height: 27px; }

body {
  font-size: 1em;
  line-height: 1.5em;
  color: #282828;
  font-family: "myriad-pro",sans-serif;
  font-style: normal;
  font-weight: 400; }

h1, .h1 {
  font-size: 2.61111111em;
  line-height: 1em;
  margin-top: 0.57446809em;
  margin-bottom: 0.57446809em;
  font-family: "museo",serif;
  font-style: normal;
  font-weight: 900; }

.menu h1 {
  color: #e2e2e2;
  font-size: 3em;
  padding-top: 1em; }
  .menu h1 span {
    line-height: 1.2;
    display: block; }

.pagetitle {
  margin-top: 60px;
  margin-bottom: .3em;
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content; }
  .pagetitle::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -17px;
    width: 34%;
    height: 8px;
    max-width: 80px;
    background: #FAF500; }
  .pagetitle::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 270%;
    background: transparent; }

.pagenumber {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  font-size: 7em;
  color: #f2f2f2;
  font-family: myriad-pro, sans-serif;
  font-weight: 900;
  font-style: normal; }
  .pagenumber sup {
    font-size: .5em;
    position: relative;
    left: -5%;
    vertical-align: bottom; }

.sidebarposition .pagenumber {
  -webkit-transform: translate(-16%, 0);
          transform: translate(-16%, 0); }

h2, .h2 {
  font-size: 2em;
  line-height: 1.86206897em;
  margin-bottom: 0em; }

header article h2.pagesubtitle {
  color: #90949C;
  font-size: 1.61111111em;
  line-height: 1.2;
  margin: 0;
  margin: 1em 0;
  font-family: "myriad-pro",sans-serif;
  font-style: normal;
  font-weight: 400;
  pointer-events: none; }

article h2 {
  margin-top: 0;
  margin-bottom: .5em;
  position: relative;
  line-height: 1;
  font-family: "museo",serif;
  font-style: normal;
  font-weight: 900; }

article h2:nth-child(2) {
  color: #90949C;
  font-size: 1.61111111em;
  line-height: 1;
  margin-top: -.5em;
  margin-bottom: 1em;
  font-family: "myriad-pro",sans-serif;
  font-style: normal;
  font-weight: 400; }

h3, .h3 {
  font-size: 1em;
  line-height: 1.5em;
  margin-top: 1.5em;
  margin-bottom: 0em; }

h4, .h4 {
  font-size: 1em;
  line-height: 1.5em;
  margin-top: 1.5em;
  margin-bottom: 0em; }

h5, .h5 {
  font-size: 1em;
  line-height: 1.5em;
  margin-top: 1.5em;
  margin-bottom: 0em; }

blockquote {
  margin: 2em;
  font-family: museo, serif;
  font-weight: 400;
  font-style: normal;
  position: relative;
  z-index: 1; }
  blockquote:before {
    content: '';
    position: absolute;
    top: -15px;
    left: -30px;
    z-index: -1;
    width: 50px;
    height: 50px;
    background: url("assets/images/quotesgeel.svg") no-repeat;
    background-size: contain; }

cite {
  font-family: "myriad-pro",sans-serif;
  font-style: normal;
  font-weight: 400;
  color: #90949C; }

.intro blockquote {
  margin: 60px 0  30px 0; }

aside blockquote {
  margin: 3.5em 1em 0em 2em; }

.onderschrift {
  position: relative;
  z-index: 1;
  display: inline-block;
  margin-bottom: 100px; }
  .onderschrift:before {
    content: '';
    position: absolute;
    left: 60%;
    top: 0;
    width: 400px;
    height: 200px;
    background: url("assets/images/handtekening-cor.png") no-repeat;
    background-size: contain;
    z-index: -1; }

ul ul, ol ol, ul ol, ol ul {
  margin-top: 0em;
  margin-bottom: 0em; }

article ul ul {
  margin-left: 20px; }

/* Let's make sure all's aligned */
hr, .hr {
  border: 1px solid;
  margin: -1px 0; }

sub, sup {
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

@media screen and (min-width: 900px) {
  .pagetitle {
    margin-top: 60px; }
  blockquote {
    margin: 3.5em 3em 2em 6em; }
  .floatquote {
    width: 28%;
    float: right; }
    .floatquote blockquote {
      margin: 3em 0em 2em 4em;
      width: 185%; } }

.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important; }

.hero-area {
  background: linear-gradient(dodgerblue, #0070DF);
  text-align: center;
  padding: 15px;
  min-height: 100vh;
  display: flex;
  margin-bottom: 8em; }
  @media all and (max-width: 650px) {
    .hero-area {
      transition: .5s;
      min-height: 40vh; } }
  .hero-area h1, .hero-area p {
    color: #FFFFFF; }
  .hero-area .hero-content {
    margin: auto;
    text-transform: uppercase; }
    .hero-area .hero-content span {
      background-color: #fff;
      color: dodgerblue;
      padding: 0 2px;
      border-radius: 3px; }
    .hero-area .hero-content h1 {
      font-size: 6em;
      text-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); }
      @media all and (max-width: 1109px) {
        .hero-area .hero-content h1 {
          transition: .5s;
          font-size: 5em; } }
      @media all and (max-width: 932px) {
        .hero-area .hero-content h1 {
          transition: .5s;
          font-size: 4em; } }
      @media all and (max-width: 754px) {
        .hero-area .hero-content h1 {
          transition: .5s;
          font-size: 3.5em; } }
      @media all and (max-width: 600px) {
        .hero-area .hero-content h1 {
          transition: .5s;
          font-size: 2.5em; } }
    .hero-area .hero-content p {
      font-size: 2em;
      line-height: 2em; }
      @media all and (max-width: 600px) {
        .hero-area .hero-content p {
          transition: .5s;
          font-size: 1.3em; } }

.page-title {
  padding: 15px 0;
  margin: 35px auto; }
  .page-title h1 {
    font-size: 75px; }
    @media all and (max-width: 1999px) {
      .page-title h1 {
        transition: .5s;
        font-size: 60px; } }
    @media all and (max-width: 991px) {
      .page-title h1 {
        transition: .5s;
        font-size: 45px; } }
    @media all and (max-width: 717px) {
      .page-title h1 {
        transition: .5s;
        font-size: 40px; } }
    @media all and (max-width: 642px) {
      .page-title h1 {
        transition: .5s;
        font-size: 30px; } }
    @media all and (max-width: 400px) {
      .page-title h1 {
        transition: .5s;
        font-size: 25px; } }
    @media all and (max-width: 341px) {
      .page-title h1 {
        transition: .5s;
        font-size: 20px; } }
  @media all and (max-width: 599px) {
    .page-title {
      transition: .5s;
      width: 95%; } }

@media screen and (min-width: 900px) {
  .intro-sidenav {
    padding: 0;
    max-width: none;
    background: transparent;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: absolute;
    left: 19%;
    width: 38.2%;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%); }
    .intro-sidenav.sidebarposition {
      position: fixed;
      left: 20px;
      top: 10vh;
      width: 20vw;
      -webkit-transform: translate(0%, 0%) scale(0.9);
              transform: translate(0%, 0%) scale(0.9);
      -webkit-transform-origin: left top;
              transform-origin: left top;
      z-index: 1; }
      .intro-sidenav.sidebarposition h1 {
        -webkit-transform: scale(0.6);
                transform: scale(0.6);
        -webkit-transform-origin: left bottom;
                transform-origin: left bottom; }
      .intro-sidenav.sidebarposition:hover {
        z-index: 2; } }

body {
  background: white; }

.site {
  background: white;
  margin: 0 auto;
  opacity: 1;
  transition: opacity 0.3s, -webkit-transform 0.3s;
  transition: transform 0.3s, opacity 0.3s;
  transition: transform 0.3s, opacity 0.3s, -webkit-transform 0.3s; }

.page {
  margin-bottom: 200px;
  margin-top: 40px; }

main section {
  padding: 7vh 0; }

article {
  padding: 0 2%; }

.is-opened .site {
  -webkit-transform: scale(0.99);
          transform: scale(0.99);
  border: 40px solid #373737; }
  .is-opened .site::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%; }

.intro--aside {
  flex: 1 0 8%; }

section aside.image-jumble-wrap {
  flex: 0 1 50%; }

.accentkader {
  border: 4px solid #FAF500;
  padding: 10px 20px; }

.bronnen {
  display: flex;
  flex-direction: column;
  justify-content: flex-end; }
  .bronnen.bronnen__ontop {
    justify-content: flex-start; }
  .bronnen > div {
    border: 4px solid #90949C;
    max-width: 400px;
    padding: 1em; }
    .bronnen > div h3 {
      margin: 0; }
    .bronnen > div ul {
      list-style-position: inside; }

@media screen and (min-width: 900px) {
  header {
    position: relative; }
  header::after {
    content: '';
    position: absolute;
    left: calc(50% - 60px);
    bottom: -50px;
    height: 100px;
    width: 4px;
    background: #90949C;
    z-index: 1; }
  .intro {
    max-height: 100vh;
    overflow: hidden; }
  .intro--text {
    padding: 0;
    max-width: none;
    background: transparent;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: absolute;
    left: 19%;
    width: 38.2%;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%); }
  .intro--figure {
    flex: 0 0 61.8%;
    overflow: hidden; }
  .pagewrap {
    display: flex;
    justify-content: flex-start; }
    .pagewrap .sidebar {
      flex: 1 0 220px; }
    .pagewrap .page {
      flex: 1 0 80%; }
  .intro {
    display: flex;
    justify-content: flex-end;
    position: relative; }
  main section {
    display: flex;
    justify-content: space-around; }
  main section {
    position: relative;
    background: white; }
    main section::before {
      content: '';
      position: absolute;
      left: -50px;
      top: 0;
      height: 100%;
      width: 200px;
      z-index: 1;
      background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, white 25%, white 100%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=1 ); }
    main section.cibaptop100 {
      overflow: hidden; }
  section article {
    flex: 0 1 60%;
    max-width: 700px;
    z-index: 1;
    position: relative; }
  section aside {
    flex: 1 1 20%;
    margin-right: 10px;
    max-width: 470px; }
  .bronnen__float {
    border: 4px solid #90949C;
    max-width: 400px;
    padding: 1em;
    float: right; } }

#indicatoren, #indicatorenkwaliteit {
  position: relative;
  background: #ededed; }
  #indicatoren::before, #indicatorenkwaliteit::before {
    background: linear-gradient(to right, rgba(237, 237, 237, 0) 0%, #ededed 25%, #ededed 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ededed', endColorstr='#ededed',GradientType=1 ); }
  #indicatoren article, #indicatorenkwaliteit article {
    z-index: 1;
    background: transparent; }
    #indicatoren article ol > li, #indicatorenkwaliteit article ol > li {
      background: white;
      padding: 1em;
      margin-bottom: 20px;
      margin-left: 31px;
      position: relative;
      border-left: white 30px solid;
      list-style: none; }
      #indicatoren article ol > li::before, #indicatorenkwaliteit article ol > li::before {
        content: '';
        position: absolute;
        width: 20px;
        left: -20px;
        font-weight: bold; }
      #indicatoren article ol > li:nth-child(1)::before, #indicatorenkwaliteit article ol > li:nth-child(1)::before {
        content: '1'; }
      #indicatoren article ol > li:nth-child(2)::before, #indicatorenkwaliteit article ol > li:nth-child(2)::before {
        content: '2'; }
      #indicatoren article ol > li:nth-child(3)::before, #indicatorenkwaliteit article ol > li:nth-child(3)::before {
        content: '3'; }
      #indicatoren article ol > li::after, #indicatorenkwaliteit article ol > li::after {
        content: '';
        position: absolute;
        width: 40px;
        height: 100%;
        left: -70px;
        top: 0;
        background: #FAF500 url("assets/images/check.svg") no-repeat 5px 35px; }
    #indicatoren article ul, #indicatorenkwaliteit article ul {
      margin-left: 20px;
      list-style: disc; }

img {
  width: 100%;
  height: auto; }

.logo {
  position: absolute;
  width: 60px;
  height: 60px;
  left: 0;
  top: 0; }

aside img {
  max-width: 400px; }

@media screen and (min-width: 900px) {
  .logo {
    position: absolute;
    width: 10vw;
    height: 10vw;
    left: auto;
    right: 3vw;
    top: 3vw; }
  .image_extralarge {
    width: 150%;
    max-width: none; } }

table td, table th {
  border: 1px solid #ddd;
  padding: 4px; }

@media screen and (min-width: 900px) {
  article table {
    width: 150%; } }

/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
a:after {
  content: "";
  position: absolute;
  cursor: pointer;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%; }

article a,
section a {
  color: black;
  text-decoration: none;
  position: relative;
  box-shadow: inset 0 -0.4em rgba(250, 245, 0, 0.5); }
  article a:hover,
  section a:hover {
    box-shadow: inset 0 2em #faf500; }

.sidenav a {
  box-shadow: none; }
  .sidenav a:hover {
    box-shadow: none; }

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
.menuline {
  width: 70%;
  height: 4px;
  background: black;
  margin: 0 15%; }

.menu-button {
  position: fixed;
  right: 0;
  top: 0;
  z-index: 200;
  height: 60px;
  width: 60px;
  font-size: 0;
  padding: 0;
  background-color: white;
  border-right: 1px solid black;
  border-bottom: 1px solid black;
  z-index: 2000; }
  .menu-button .menuline {
    position: absolute;
    transition: opacity .3s,top .3s .3s, -webkit-transform .3s 0s;
    transition: opacity .3s,top .3s .3s, transform .3s 0s;
    transition: opacity .3s,top .3s .3s, transform .3s 0s,-webkit-transform .3s 0s;
    -webkit-transform-origin: center;
            transform-origin: center; }
  .menu-button .menuline1 {
    top: 30%; }
  .menu-button .menuline2 {
    top: 50%; }
  .menu-button .menuline3 {
    top: 70%; }
  .menu-button.cross {
    background-color: transparent;
    border: none; }
    .menu-button.cross .menuline {
      transition: opacity .3s,top .3s 0s, -webkit-transform .3s .3s;
      transition: opacity .3s,top .3s 0s, transform .3s .3s;
      transition: opacity .3s,top .3s 0s, transform .3s .3s,-webkit-transform .3s .3s; }
    .menu-button.cross .menuline1 {
      top: 50%;
      -webkit-transform: rotate(45deg);
              transform: rotate(45deg); }
    .menu-button.cross .menuline2 {
      opacity: 0; }
    .menu-button.cross .menuline3 {
      top: 50%;
      -webkit-transform: rotate(-45deg);
              transform: rotate(-45deg); }

@media screen and (min-width: 900px) {
  .menu-button {
    right: auto; } }

.is-opened {
  overflow: hidden; }

.toc-marker,
.toc-marker2 {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1; }

.toc-marker path,
.toc-marker2 path {
  transition: all 0.3s ease; }

.menu a, .sidenav a {
  position: relative; }
  .menu a:hover::before, .sidenav a:hover::before {
    content: "";
    position: absolute;
    top: 50%;
    left: -7px;
    -webkit-transform: translate(-100%, -50%);
            transform: translate(-100%, -50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 8.7px;
    border-color: transparent transparent transparent #000000; }

.menu h1 {
  display: none; }

.menuwrap {
  background: white;
  opacity: 0;
  position: fixed;
  z-index: -100;
  top: 0;
  width: 100%;
  height: 100vh;
  transition: opacity 0.3s; }
  .menuwrap .menu {
    padding: 0 2%;
    min-height: calc(100vh + 300px);
    scroll-behavior: smooth; }
    .menuwrap .menu ul {
      padding: 0;
      margin: 0; }
    .menuwrap .menu a {
      color: black;
      text-decoration: none;
      font-weight: 700; }
    .menuwrap .menu li > ul > li > a {
      font-weight: 400;
      margin-left: 1em; }
    .menuwrap .menu .menucolumn {
      flex: 1;
      display: flex;
      flex-direction: column;
      z-index: 2; }
      .menuwrap .menu .menucolumn > ul > li {
        margin-top: 10px; }

.menu_indicatoren a span::before {
  content: "\00a0 \00a0 \00a0 \00a0 \00a0 \00a0"; }

.is-opened .menuwrap {
  opacity: 1;
  z-index: 100;
  overflow: scroll;
  overflow-y: scroll;
  overflow-x: hidden; }

.sidenav {
  position: relative; }

.sidenav ul {
  padding-left: 10px;
  position: relative; }
  .sidenav ul li > a {
    font-weight: 400;
    color: #282828;
    text-decoration: none; }

@media screen and (min-width: 900px) {
  body {
    position: relative; }
  .menubackdrop {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -100;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    transition: opacity .3s; }
  .is-opened .menubackdrop {
    z-index: 1;
    opacity: 1; }
  .intro-sidenav {
    margin: 0; }
  .menu h1 {
    display: block; }
  .is-opened .menuwrap {
    overflow: auto; }
  .is-opened .menubackdrop {
    cursor: url("assets/images/cross.svg"), pointer; }
  .menuwrap {
    height: auto;
    padding: 2% 0; }
    .menuwrap .menu {
      max-width: 1200px;
      margin: 0 auto;
      display: flex;
      padding-top: 30px;
      justify-content: space-around;
      min-height: 33vh; }
      .menuwrap .menu::before {
        content: '3 ambities en maatregelen';
        position: absolute;
        width: calc(66.666% - 170px);
        left: calc(33.333%);
        top: 15px;
        border-bottom: 1px solid #90949C;
        font-weight: 700;
        font-size: 1.4em;
        padding-bottom: 10px; }
  .begroting {
    padding-top: 100px; }
    .begroting a {
      border-top: 1px solid #90949C; }
  .sidebarposition .pagetitle {
    cursor: pointer; }
    .sidebarposition .pagetitle:hover::after {
      content: "";
      position: absolute;
      left: 0;
      bottom: -23px;
      background: transparent;
      width: 0;
      height: 0;
      border-style: solid;
      border-width: 0 10px 17.3px 10px;
      border-color: transparent transparent #000000 transparent; } }
/*# sourceMappingURL=style.css.map */