

@font-face {
  font-family: ProximaNova;
  src: url(https://d25purrcgqtc5w.cloudfront.net/dist/fonts/proximanova/302D42_1_0.eot);
  src: url(https://d25purrcgqtc5w.cloudfront.net/dist/fonts/proximanova/302D42_1_0.eot?#iefix) format("embedded-opentype"),url(https://d25purrcgqtc5w.cloudfront.net/dist/fonts/proximanova/302D42_1_0.woff2) format("woff2"),url(https://d25purrcgqtc5w.cloudfront.net/dist/fonts/proximanova/302D42_1_0.woff) format("woff"),url(https://d25purrcgqtc5w.cloudfront.net/dist/fonts/proximanova/302D42_1_0.ttf) format("truetype"),url(https://d25purrcgqtc5w.cloudfront.net/dist/fonts/proximanova/302D42_1_0.svg#wf) format("svg");
  font-weight: 300;
  font-style: normal
}

@font-face {
  font-family: ProximaNova;
  src: url(https://d25purrcgqtc5w.cloudfront.net/dist/fonts/proximanova/302D42_4_0.eot);
  src: url(https://d25purrcgqtc5w.cloudfront.net/dist/fonts/proximanova/302D42_4_0.eot?#iefix) format("embedded-opentype"),url(https://d25purrcgqtc5w.cloudfront.net/dist/fonts/proximanova/302D42_4_0.woff2) format("woff2"),url(https://d25purrcgqtc5w.cloudfront.net/dist/fonts/proximanova/302D42_4_0.woff) format("woff"),url(https://d25purrcgqtc5w.cloudfront.net/dist/fonts/proximanova/302D42_4_0.ttf) format("truetype"),url(https://d25purrcgqtc5w.cloudfront.net/dist/fonts/proximanova/302D42_4_0.svg#wf) format("svg");
  font-weight: 400;
  font-style: normal
}

@font-face {
  font-family: ProximaNova;
  src: url(https://d25purrcgqtc5w.cloudfront.net/dist/fonts/proximanova/302D42_5_0.eot);
  src: url(https://d25purrcgqtc5w.cloudfront.net/dist/fonts/proximanova/302D42_5_0.eot?#iefix) format("embedded-opentype"),url(https://d25purrcgqtc5w.cloudfront.net/dist/fonts/proximanova/302D42_5_0.woff2) format("woff2"),url(https://d25purrcgqtc5w.cloudfront.net/dist/fonts/proximanova/302D42_5_0.woff) format("woff"),url(https://d25purrcgqtc5w.cloudfront.net/dist/fonts/proximanova/302D42_5_0.ttf) format("truetype"),url(https://d25purrcgqtc5w.cloudfront.net/dist/fonts/proximanova/302D42_5_0.svg#wf) format("svg");
  font-weight: 700;
  font-style: normal
}

@font-face {
        font-family: 'MPSBI';
        src: url('MyriadPro-SemiboldIt.woff2') format('woff2'),
            url('MyriadPro-SemiboldIt.woff') format('woff');
        font-weight: 600;
        font-style: italic;
    }

@font-face {
        font-family: 'MyriadPro-Black';
        src:
            url('MyriadPro-Black.woff2') format('woff2'),
            url('MyriadPro-Black.woff') format('woff');
        font-weight: 900;
        font-style: normal;
    }

    @font-face {
        font-family: 'MPSB';
        src:
            url('MyriadPro-Semibold.woff2') format('woff2'),
            url('MyriadPro-Semibold.woff') format('woff');
        font-weight: 600;
        font-style: normal;
    }

    @font-face {
        font-family: 'MyriadPro-BlackIt';
        src:
            url('MyriadPro-BlackIt.woff2') format('woff2'),
            url('MyriadPro-BlackIt.woff') format('woff');
        font-weight: 900;
        font-style: italic;
    }

    @font-face {
        font-family: 'MyriadPro';
        src:
            url('MyriadPro-Regular.woff2') format('woff2'),
            url('MyriadPro-Regular.woff') format('woff');
        font-weight: normal;
        font-style: normal;
    }

    @font-face {
        font-family:'MyriadProBR';
        scr:
            url('MyriadPro-Bold.woff2') format('woff2'),
            url('MyriadPro-Bold.woff') format('woff');
        font-weight: bold;
        font-style: normal;
    }

    @font-face {
        font-family: 'MyriadPro-BoldIt';
        src: url('MyriadPro-BoldIt.eot');
        src: local('Myriad Pro Bold Italic'), local('MyriadPro-BoldIt'),
            url('MyriadPro-BoldIt.eot?#iefix') format('embedded-opentype'),
            url('MyriadPro-BoldIt.woff2') format('woff2'),
            url('MyriadPro-BoldIt.woff') format('woff'),
            url('MyriadPro-BoldIt.ttf') format('truetype');
        font-weight: bold;
        font-style: italic;
    }

    @font-face {
        font-family: 'MPLI';
        src: url('MyriadPro-LightIt.eot');
        src: local('Myriad Pro Light Italic'), local('MyriadPro-LightIt'),
            url('MyriadPro-LightIt.eot?#iefix') format('embedded-opentype'),
            url('MyriadPro-LightIt.woff2') format('woff2'),
            url('MyriadPro-LightIt.woff') format('woff'),
            url('MyriadPro-LightIt.ttf') format('truetype');
        font-weight: 300;
        font-style: italic;
    }

    @font-face {
        font-family: 'MPI';
        src:url('MyriadPro-It.woff2') format('woff2'),
            url('MyriadPro-It.woff') format('woff');
        font-weight: normal;
        font-style: italic;
    }

    @font-face {
        font-family: 'MPL';
        src: url('MyriadPro-Light.eot');
        src: local('Myriad Pro Light'), local('MyriadPro-Light'),
            url('MyriadPro-Light.eot?#iefix') format('embedded-opentype'),
            url('MyriadPro-Light.woff2') format('woff2'),
            url('MyriadPro-Light.woff') format('woff'),
            url('MyriadPro-Light.ttf') format('truetype');
        font-weight: 300;
        font-style: normal;
    }

/*
https://www.w3schools.com/colors/colors_picker.asp
Yellow 50% #e79b18 voor letters
Yellow 60% #ecaf46 voor lijnen *******
yellow 80% #f5d7a3 voor vlakken
yellow 90% #faebd1 voor lichtere vlakken

Red
50% #cb3437
60% #D55C5F
80% #eaaeaf
90% #f5d6d7

Blue
50% #2e7ad1
60% #5995DA
80% #abcaed
90% #d5e4f6
*/



* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  text-align: left;
}
body {
color: 414141;              /* Dark gray */
background-color: #FAFAFA;
  /*font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
    font-weight: 300; /*#F0F0F0; */ */
font-size: 16px;
}

.page {
display: flex;
flex-direction: column;
align-items: center;
/*background-color: yellow;
/*margin: 0 auto;
border: 1px solid red;*/
/*background-image: url("netherlands-3952587.jpg");*/
}

a:link,
a:visited {
  color: #fafafa;
  font-family: ProximaNova;
  text-decoration: none;

}

a:link, a:visited .features-icon {
  color: #FAFAFA;
  text-decoration: none;
}

a:hover {
  text-decoration: none;
  color: #FAFAFA;
  /*background-color: #f49800;*/
}

li:hover {
  text-decoration: none;
  background-color: #414141;
  color:#FAFAFA;
}


.top {
  position: fixed;
  left: 0;
  top: 0;
  width:100%;
  display: flex;
  margin: 0 auto;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  overflow: hidden;
}

.bottom {
  /*position: absolute;
  bottom: 0;
  left:0;*/
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-flow: column;
  align-items: center;
  background-color: #414141;
  overflow: hidden;
}


.leader {
  margin: 0 auto;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  background-color: #414141;/* #f49800;/*#414141; /**/
  padding-top: 8px; /* was 20*/
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom:8px;
  /*overflow:hidden;*/

}

.header {
  margin: 0 auto;
  width:100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  background-color: #FAFAFA;
  padding-top: 13px; /* was 20*/
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom:5px;
  /*overflow:hidden;*/


}

.footer {
  margin: 0 auto;
  width:100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  background-color: #414141;
  padding-top: 5px; /* was 20*/
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom:5px;
  /*overflow:hidden;*/


}

.headtext{
  margin: 0 auto;
  width: 200px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  background-color: #FAFAFA;
  /*overflow:hidden;*/

}

.headtext p {
  font-family: MyriadPro;
  font-weight: 400;
  font-style: italic;/*MyriadPro-SemiboldIt;*/
  font-size: 24px;
  letter-spacing: .3px;
  color:#f49800;
  line-height: 1.2;
  text-align: center;
}



.topnav {
  position:fixed;
  top:200px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  background-color: #414141;
  width: 100%;
  padding-top: 20px;
  padding-bottom: 20px;
  padding-left: 20px;
  padding-right: 20px;
}



 .topnav .icon {
  display: none;

}


.menu {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  width:100%;
}


.icon {
  display: flex;
  font-family: ProximaNova;
  color:red;

}


.menu > ul{
  list-style: none;
  /* inline*/
  display: flex;
  flex-direction: column;
  font-style: ProximaNova;
  color: #FAFAFA;
  font-size: 17px;
  /*width:100%;*/
}

.icon > li{
  list-style: none;
  /* inline*/
  display: flex;
  flex-direction: column;
  font-style: ProximaNova;
  color: #FAFAFA;
  font-size: 17px;
  justify-content: flex-end;
  /*width:100%;*/
}


.features-menu {
  display: none;

  flex-direction: column;
  background: #414141;
  color: #fafafa;
  border-radius: 5px;
  position:absolute;
  top:25px;
  left:-10px;
  z-index: 1;

}

.features-icon {
  display: none;
  flex-direction: column;
  text-align: right;
  background: #f49800;
  color:#fafafa;
  border-radius: 5px;
  position:absolute;
  right:0px;
  top:25px;

  z-index: 3;

}


.features-menu > li {
  list-style: none;
  border-bottom: .05px solid #414141;
  padding: 10px 0px 10px 10px;
  font-style: ProximaNova;
  background-color: #f49800;
  color:#fafafa;
  font-size: 16px;

}

.features-icon > li {
  list-style: none;
  border-bottom: .05px solid #414141;
  padding: 10px 0px 10px 10px;
  font-style: ProximaNova;
  color: red;
  font-size: 16px;
}


.features-menu > li:last-of-type {
  border-bottom: none;
}

.features-icon > li:last-of-type {
  border-bottom: none;
}


.dropdown {
  position:relative;
}

.dropdown > span {
  z-index: 2;
  position: relative;
  cursor: pointer;
}

.dropdown:hover .features-menu {    /* This used to be `.features-menu` */
  display: flex;
  width:250px;                   /* Leave everything else alone */
  flex-direction: column;
  /* ... */
}

.dropicon {
  position:relative;
}

.dropicon > span {
  z-index: 3;
  position: relative;
  /*cursor: pointer;*/
}

.dropicon:hover .features-icon {    /* This used to be `.features-menu` */
  display: flex;
  width:250px;                   /* Leave everything else alone */
  flex-direction: column;
  /* ... */
}







.logo {
  width: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  overflow: hidden;
  /*background-color: red;*/


}

.logo1 {
  width: 70px;
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;

  /*background-color: red;*/


}

.socials {
  width: 200px;
  display: flex;
  height:24px;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;
  overflow: hidden;



  /* border: 3px solid Yellow;*/
}

.subsocials {
  width: 170px;
  height: 30px;
  display: none;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;



  /* border: 3px solid Yellow;*/
}

.socialitem {
  Height: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  overflow: hidden;
  /*background-color: red;*/
  /*z-index: 4;
  /* border: 3px solid Yellow;*/
}

.search {
  width: 170px;
  display: flex;
  flex-direction: row;
  align-items: center;
  box-sizing: border-box;
  overflow: hidden;
    /*background-color: red;*/
  /*z-index: 4;
  * border: 3px solid Yellow;*/
}


#searchQueryInput {
  width: 100%;
  height: 2.8rem;
  background: #FEFEFE;
  outline: none;
  border: 1px #414141 solid;
  border-radius: 1.625rem;
  padding: 0 3.5rem 0 1.5rem;
  font-size: 1rem;
}

#searchQuerySubmit {
  width: 3.5rem;
  height: 2.8rem;
  margin-left: -3.5rem;
  background: none;
  border: none;
  outline: none;
}

#searchQuerySubmit:hover {
  cursor: pointer;
}




h1 {
  font-family: MPL;
  font-size: 34px;
  /*font-style: Bold; /*MyriadPro-SemiboldIt;*/
  color: #f49800/*#e79b18/*414141 /*#143a66 /*  /* #00234C /*hsl(215, 59%, 29%)*/;
  line-height: 1.2;
  text-align: center;
  padding-top:20px;
  padding-bottom: 20px;
  /*border: 2px solid blue;*/
}

h2 {
  font-family: MPSBI;
  font-size: 21px;
  font-style: italic; /*MyriadPro-SemiboldIt;*/
  color: #414141 /* #143a66 /* #00234C /*hsl(215, 59%, 29%)*/;
  line-height: 1.2;
  text-align: center;
  padding-top:20px;
  padding-bottom: 20px;
}

.main-text {
  max-width: 800px;
  display: flex;
  flex-direction: column;
  margin-top: 60px;
  box-sizing: border-box;
  align-items: center;
  overflow: hidden;
  text-align: left;
  padding-bottom: 20px;
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 20px;

  /*background-color: #FFC400;*/
}

.main-text p {
  font-family: ProximaNova;
  font-size: 15px;
  text-align:left;
  color: #414141;
  letter-spacing: .3px;
  /*letter-spacing: .3px;*/
  line-height: 1.8;
}


.footernaw {
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items:baseline;
  flex-wrap:nowrap;
  background-color: #414141;
  /*border: 3px solid Green;*/
  /*background-color: green;*/
}


.footernaw p {
font-family: ProximaNova;
font-weight: 300;
text-align:left;
font-size: 14px;
/*Roboto;*/
color: #FAFAFA; /*#00234C; /*#143a66;*/
line-height:1.4;
letter-spacing: .3px;
}

.hr {
        width: 10px;
        height: 10px;
        margin-left:0;
        margin-right: auto;
        background-color: #ff00ff;
      }










@media screen and (max-width: 850px) {


}


@media only screen and (min-width: 851px) {

}
