/* link naar scss */
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
@import "font-awesome.min.css";
@import "all.css";
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, nav ol, nav ul, form ol, form ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

nav ol, nav ul, form ol, form ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

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

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

/* Eigen stijlen ----------------------------------- */
html {
  scroll-behavior: smooth; }

/* https://www.w3schools.com/cssref/pr_scroll-behavior.asp */
/* Padding-fix */
* {
  box-sizing: border-box; }

/* Float-fix */
.floatfix {
  overflow: hidden;
  clear: left;
  zoom: 1;
  _overflow: visible; }

/* List-fix */
.list-unstyled {
  list-style-type: none;
  margin: 0;
  padding: 0; }

/* Image-fix */
img,
iframe {
  display: block; }

/* fontawesome menu icon */
/* fontawesome icons */
/* Body ----------------------------------------- */
html, body {
  overflow-x: hidden;
  font-weight: 300;
  font-size: 100%;
  font-family: Arial, sans-serif;
  font-style: normal;
  line-height: 1.6;
  text-align: left;
  letter-spacing: 0;
  background: white;
  height: 100%;
  margin: 0; }

.container {
  max-width: 800px;
  margin: 0 auto;
  padding: 0 1.5em; }

.event {
  display: block; }

/* sticky footer */
.wrapper {
  min-height: 100%;
  /* Equal to height of footer */
  /* But also accounting for potential margin-bottom of last child */
  margin-bottom: 100px; }

.footer,
.push {
  height: 110px; }

h1 {
  font-weight: 700;
  font-size: 3rem;
  font-family: Arial, sans-serif;
  font-style: normal;
  line-height: 1.7;
  text-align: left;
  letter-spacing: 0.08em; }

h2 {
  font-weight: 500;
  font-size: 1.6rem;
  font-family: Arial, sans-serif;
  font-style: normal;
  line-height: 1.5;
  text-align: left;
  letter-spacing: 0.08em;
  /*text-transform: uppercase;*/
  color: #ED7A00; }

h3 {
  font-weight: 600;
  font-size: 1.1rem;
  font-family: Arial, sans-serif;
  font-style: normal;
  line-height: 1.5;
  text-align: left;
  letter-spacing: 0.05em;
  /*text-transform: uppercase;*/
  color: #506266; }

p,
li,
address {
  font-weight: 400;
  font-size: 1rem;
  font-family: Arial, sans-serif;
  font-style: normal;
  line-height: 1.4;
  text-align: left;
  letter-spacing: 0.1em;
  color: black; }

p.info {
  margin: 2em 0;
  background-color: beige;
  padding: 1.5em;
  text-align: center; }

#section-three p.crumb, #section-three p.crumb a,
#section-two p.crumb, #section-two p.crumb a {
  font-weight: 600;
  font-size: .8rem;
  color: #9097A0;
  margin-bottom: 0;
  font-variant: small-caps; }

strong, bold {
  font-weight: bold; }

ul li {
  line-height: 1.8; }

/* Icons ---------------------------------------------- */
/*a.linkPdf:after, a.linkWord:after, a.linkExcel:after, a.linkPowerPoint:after{
    background: url(https://vdab.be/sites/web/files/foto/icons/document_14x19.jpg) center left no-repeat;
    padding-left: 1.3rem;
    margin-right: .3rem;
    margin-left: .5rem;
    color: #1a94ff;
}
a.linkPdf:after {
    content: "pdf";
}
a.linkWord:after {
    content: "Doc";
}
a.linkExcel:after {
    content: "Excel";
}
a.linkPowerPoint:after {
    content: "Powerpoint";
}
a.linkVideo:after {
    background: url(https://vdab.be/sites/web/files/foto/icons/ico_video.gif) center left no-repeat;
    padding-left: 1.5rem;
    margin-right: .1rem;
    margin-left: .5rem;
    background-size: 1.2rem;
    text-decoration: inherit;
    content: "video";
    color: #1a94ff;
}*/
/* Header -------------------------------------------- */
header#mainheader {
  height: 20vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  align-items: flex-start; }

/* Nav ------------------------------------------- */
.event nav.eventnav {
  background: #E0006F;
  position: fixed;
  top: 0;
  height: 3.5em;
  margin-bottom: 0em;
  width: 100%;
  z-index: 9999; }

a#company {
  position: absolute;
  bottom: .10em;
  /*left: 1em;*/
  left: inherit;
  font-weight: 700;
  font-size: 1.6rem;
  font-family: Arial, sans-serif;
  font-style: normal;
  line-height: 1.5;
  text-align: center;
  letter-spacing: 0.02em;
  padding: .4em 0 .2em 0;
  text-decoration: none;
  color: white;
  transition: all 500ms ease; }

/* Footer -------------------------------------------- */
.event footer {
  background-color: #e7ecf1;
  margin-top: 2em; }

.event footer img.logo {
  padding: 1em 1em 1em 0;
  display: inline-block; }

.event footer p {
  color: darkslategrey;
  padding: 1.5em 0;
  float: right; }

.event .footer-social {
  color: #004475;
  float: right;
  display: inline-block;
  margin-top: 15%;
  height: 50px; }

.event .footer-social a {
  margin-right: .6rem;
  color: #004475;
  text-decoration: none; }

/* Cookie message ----------------------------------------------*/
.CookieMessage {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.85);
  z-index: 9999;
  display: none; }

.CookieMessage-content {
  color: white;
  margin: 0;
  padding: 1em;
  font-family: sans-serif;
  line-height: 1.5;
  font-size: 12px; }
  .CookieMessage-content a {
    color: white; }
  .CookieMessage-content p {
    margin: 0 0 1em 0;
    color: white; }

.CookieMessage-button {
  background: #E0006F;
  display: inline-block;
  text-decoration: none;
  padding: 5px 20px;
  border-radius: 5px;
  text-transform: uppercase; }
  .CookieMessage-button:hover {
    background: #ee1c84; }

/* Section ---------------------------------------- */
.event section {
  margin-top: 0;
  position: relative; }

.event section h2 {
  letter-spacing: 0;
  font-weight: bold;
  text-align: left;
  line-height: initial; }

section {
  padding: 1em 0 1em;
  position: relative; }

section header {
  padding: 3em 0; }

section article {
  margin-bottom: 1em; }

section header p {
  margin-bottom: 2em; }

div.responsive-image img {
  width: 100%;
  height: auto; }

section a:link {
  color: #ED7A00;
  cursor: pointer;
  text-decoration: none;
  font-weight: bolder; }

section a:visited, section a:hover {
  text-decoration: none;
  color: #ED7A00;
  font-weight: bolder;
  /*padding-bottom: 1px;*/ }

ul.keuze li {
  color: #ED7A00; }

ul.keuze li a:hover {
  color: #E0006F; }

/* Header-Section1 ---------------------------------*/
.event section#section-one {
  margin-top: 0;
  height: 240px; }

.event header#mainheader {
  position: relative;
  top: -1em;
  z-index: 1;
  background: url(../img/digitalSynergie_technic_1920.jpg) top left no-repeat;
  background-size: 130%;
  width: 100%;
  margin-top: 0;
  height: 200px;
  padding: 0; }

.event img.swoosh {
  height: 280px;
  width: auto;
  top: 2em;
  right: 2em;
  position: relative;
  z-index: 9999;
  display: block;
  margin: 0 auto; }

/* Section 2 ---------------------------------------*/
#section-two .web {
  display: flex;
  flex-direction: row;
  justify-content: space-around; }

#section-two .web iframe {
  width: 100%;
  /*height: 360px;*/
  max-width: 640px; }

/* Section 3 ---------------------------------------*/
.aanbod {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  width: 100%; }

.aanbod img {
  width: 100%;
  height: auto;
  margin-bottom: 1em; }

.aanbod_video, .aanbod_doc, .aanbod_webinar {
  text-align: left;
  width: 100%;
  display: inline-block;
  margin-right: 2em; }

.aanbod p {
  margin-bottom: 1.5em; }

#section-three {
  margin: 1.5em 0 0 0;
  padding: 2em 0 0 0;
  /*background-color: #eef5e5;*/ }

#section-three.fiches, #section-three.video {
  background-color: #fff;
  margin-top: 1.5em; }

/*section#section-three.a {
    background-color: rgba(231,236,241,1);
}*/
#section-three h2, #section-two h2 {
  margin-bottom: .5em;
  line-height: normal; }

#section-three h2 a, #section-two h2 a {
  color: #3c3c3c; }

#section-three h2 a:hover, #section-two h2 a:hover {
  color: #E0006F; }

#section-two p, #section-three p {
  margin-bottom: 1em; }

.aanbod img {
  width: 100%;
  height: auto;
  margin-bottom: .5em; }

.aanbod_webinar, .aanbod_video, .aanbod_doc {
  margin-bottom: 1.5em; }

.aanbod_webinar ul, .aanbod_video ul, .aanbod_doc ul {
  margin-top: .1em; }

/*  .documenten h3 {
    color: #506266; }*/
ul.fiches li a {
  color: #ED7A00;
  font-weight: bolder; }

ul.fiches li a:hover {
  color: #92A68A;
  font-weight: bolder; }

ul.fiches li a:visited {
  color: #434d3e; }

/* Section video ---------------------------------------*/
section#section-vi .video1 {
  display: flex;
  justify-content: center;
  margin: 3em 0; }

section#section-vi {
  background-color: #eef5e5; }

/* Section 4 ---------------------------------------*/
#section-four {
  margin: 0; }

#section-four #partners {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-around;
  margin-top: 1em; }

#section-four #partners img {
  width: 80px;
  height: 56px; }

.title_tooltip h2, .title_tooltip p {
  display: inline-block; }

div.tooltip {
  float: right;
  cursor: pointer; }

.tooltip img.tooltipimg {
  visibility: hidden;
  width: 155px;
  height: auto;
  background-color: black;
  text-align: center;
  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  top: -3.5em; }

.tooltip:hover img.tooltipimg {
  visibility: visible; }

/* Video overzichtspagina ------------------------- */
.event h2 {
  font-size: 1.8rem; }

.event #section-one-content {
  margin-top: 2em; }

.event #section-one-content h2 {
  font-variant: normal;
  line-height: 1.1; }

.event #section-one-content p {
  margin-top: 1em;
  font-weight: 600; }

.event #section-one-content li {
  font-variant: small-caps;
  font-size: 1.2rem; }

.event section#section-two {
  margin-top: 2em; }

.teaser-grid__teasers {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  width: -webkit-calc(100% + 10px);
  width: calc(100% + 10px);
  margin: 0 -10px -10px 0; }

.teaser-grid__teasers .teaser {
  width: -webkit-calc(100% - 10px);
  width: calc(100% - 10px);
  margin: 0 10px 10px 0; }

.teaser__visual {
  position: relative; }

* {
  background-repeat: no-repeat; }

*, :after, :before {
  border-style: solid;
  border-width: 0; }

.teaser {
  cursor: pointer;
  position: relative;
  display: block;
  background-size: cover;
  background-position: 50%; }

.teaser__image-container.is-loaded {
  opacity: 1;
  background-color: #3c3c3c7a; }

.teaser__image-container {
  width: 100%;
  height: 100%;
  opacity: 0;
  -webkit-transition: opacity .4s;
  transition: opacity .4s; }

svg:not(:root) {
  /* overflow: hidden; */ }

.teaser__image {
  width: 100%;
  height: 100%; }

audio, canvas, iframe, img, svg, video {
  vertical-align: middle; }

svg {
  fill: currentColor; }

.teaser__overlay.is-video {
  border-radius: 0;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 100% 100%; }

.teaser__overlay {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 2px;
  background-image: -webkit-gradient(linear, left top, left bottom, from(transparent), to(#000));
  background-image: -webkit-linear-gradient(top, transparent, #000);
  background-image: linear-gradient(180deg, transparent, #000);
  opacity: .35;
  -webkit-transition: opacity .3s linear;
  transition: opacity .3s linear;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  will-change: opacity; }

.teaser__play {
  position: absolute;
  top: 35%;
  left: 41%;
  display: block;
  width: 18%;
  height: 0;
  padding-bottom: 12%; }

.teaser__image-content {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 10;
  width: 100%;
  max-width: 800px;
  color: #f5f4e5;
  /*padding: 20px 50px 20px 20px;*/
  padding: 1em;
  /*background-color: #3c3c3c7a;*/ }

.teaser__title {
  font-size: 1.2rem;
  line-height: 1;
  color: #f5f4e5; }

.teaser:focus .teaser__title span, .teaser:hover .teaser__title span {
  -webkit-animation: fancyTitleAnimation .5s forwards;
  animation: fancyTitleAnimation .5s forwards;
  animation-duration: 0.5s;
  animation-timing-function: ease;
  animation-delay: 0s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
  animation-play-state: running;
  animation-name: fancyTitleAnimation;
  background-size: 100%; }

.teaser__title span {
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, transparent), color-stop(1%, #ff0093), color-stop(99%, #ff0093), to(transparent));
  background-image: -webkit-linear-gradient(transparent, #ff0093 1%, #ff0093 99%, transparent);
  background-image: linear-gradient(transparent, #ff0093 1%, #ff0093 99%, transparent);
  background-position: 0 100%;
  will-change: background-size;
  background-size: 0;
  line-height: normal;
  background-color: #3c3c3c7a; }

.teaser__tag, .teaser__title {
  font-family: proxima-nova,proxima nova,sans-serif;
  font-weight: 900;
  text-transform: uppercase; }

.teaser-grid__header, h1, h2, h3, h4, h5 {
  font-family: proxima-nova,proxima nova,sans-serif;
  font-weight: 900;
  text-transform: uppercase; }

.card-teaser__content {
  position: relative;
  padding: 10px 5px 10px 0; }

/*.card-teaser__text {
    font-size: 1.7rem;
}*/
.teaser__text {
  max-width: 800px;
  color: #011a5c;
  /*line-height: 1.5;*/ }

/* Breakpoints -------------------------------------------- */
@media screen and (min-width: 600px) {
  /* Header ---------------------------------------*/
  .event header#mainheader {
    background-size: 120% auto; }

  .event img.swoosh {
    width: 400px;
    height: auto;
    top: 2.5em; }

  .event #section-one h2, .event #section-one h3 {
    display: none; }

  .event section#section-one {
    height: 280px; }

  .aanbod {
    flex-direction: row; }

  .aanbod_doc {
    margin-right: 0; }

  /* Section 3 --------------------------------*/
  ul.fiches {
    display: flex;
    flex-flow: row wrap;
    margin: 0 2em 0 0;
    padding: 0; }

  ul.fiches li a {
    border: 1px solid rgba(146, 166, 138, 0.5);
    border-radius: 2px;
    background-color: rgba(238, 245, 229, 0.5);
    margin: 0em 1em 1em 0;
    padding: 2em 1em;
    box-sizing: border-box;
    text-align: center; }

  ul.fiches li {
    list-style-type: none;
    line-height: 6.3em; }

  ul.fiches li:first-child {
    margin-left: 0; } }
@media (min-width: 640px) {
  .teaser-grid__teasers {
    width: -webkit-calc(100% + 20px);
    width: calc(100% + 20px);
    margin: 0 -20px -20px 0; }

  .teaser-grid__teasers .teaser {
    width: -webkit-calc(50% - 20px);
    width: calc(50% - 20px);
    margin: 0 20px 20px 0; }

  .teaser__title {
    font-size: 1.2rem; }

  #section-two .web iframe {
    height: 360px;
    width: 640px; } }
@media (max-width: 40em) {
  .event h2 {
    font-size: 1.5rem; } }
@media (min-width: 40em) and (max-width: 64em) {
  .teaser__title {
    font-size: 1rem; } }
@media screen and (min-width: 800px) {
  /* Header ---------------------------------------*/
  .event header#mainheader {
    background-size: 110% auto; }

  .event img.swoosh {
    width: 400px;
    height: auto;
    top: 3.5em;
    left: 0; }

  /*    .event section#section-one {
          height: 430px;
      }*/
  #section-two {
    margin-top: 4rem; }

  .container {
    max-width: 800px; }

  .aanbod_video, .aanbod_doc, .doc_nl, .doc_en, .doc_fr {
    width: calc(100% + 10px); }

  .aanbod p {
    margin-bottom: 1em; }

  #section-four #partners img {
    width: 120px;
    height: auto; }

  .event .footer-social {
    float: right;
    margin-top: 3em; }

  /*  .event a.linkPdf:after, .event a.linkWord:after, .event a.linkExcel:after, .event a.linkPowerPoint:after {
      color: #506266; }*/
  section#section-four article {
    margin-top: 1.5em; } }
@media (min-width: 900px) {
  .teaser-grid__teasers .teaser {
    width: -webkit-calc(100%/3 - 20px);
    width: calc(100%/3 - 20px); } }
@media screen and (min-width: 950px) {
  .event .container {
    max-width: 1300px; }

  .event header#mainheader {
    height: 260px; }

  .event img.swoosh {
    width: 500px;
    height: auto;
    /*top: 2em;*/
    left: 0; }

  .event section#section-one {
    height: 320px; }

  .event section#section-two {
    margin-top: 2.5em; }

  /* Nav -----------------------------------------------------*/
  .event nav.eventnav {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    height: 3.5em;
    background-color: #E0006F;
    margin-bottom: 0;
    transition: top 500ms ease-in-out;
    z-index: 9999; }

  /* Menu */
  .event nav.eventnav .eventmenu {
    display: none; }

  .event eventopen {
    display: none; }

  .event nav#subnav {
    width: 100%;
    background-color: #ED7A00;
    display: none; }

  .event nav#subnav .eventlinks {
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    display: flex;
    flex-direction: row;
    justify-content: center;
    background-color: #ED7A00;
    height: 2.5em;
    z-index: 9999; }

  .event nav#subnav .eventlinks li {
    list-style-type: none;
    margin-right: .25em;
    margin-left: 0; }

  .event nav#subnav .eventlinks li.eventend {
    padding-right: 1em; }

  .event nav#subnav .eventlinks a, .event nav#subnav .eventlinks a:visited, .event nav#subnav .eventlinks a:hover {
    display: inline-block;
    background: #ED7A00;
    padding: .5em 1em .5em 1.5em;
    margin-top: .3em;
    color: white;
    text-decoration: none;
    transition: all 500ms ease;
    font-weight: 600;
    font-size: 0.9rem;
    font-family: Arial, sans-serif;
    font-style: normal;
    line-height: 1.3;
    text-align: left;
    letter-spacing: 0.05em; }

  .event nav#subnav .eventlinks a:hover,
  .event nav#subnav .eventlinks li.actiefitem a {
    color: #E0006F; }

  /* section */
  .event section {
    top: 0; }

  /* Cookie ----------------------------------------- */
  .CookieMessage-content {
    max-width: 900px;
    margin: 0 auto; } }
@media (min-width: 1280px) {
  .teaser-grid__teasers .teaser {
    width: -webkit-calc(100%/3 - 20px);
    width: calc(100%/3 - 20px); }

  .article-detail--small .article-detail__content .teaser-grid__title, .headline-3 {
    font-size: 4rem; } }
@media screen and (min-width: 1400px) {
  header#mainheader {
    height: inherit; } }