/* CSS Document */

#headerwrapper {
background-image: none;
position: relative;
overflow: hidden;
}

#myVideo {
  position: absolute;
  min-width: 100%;
  width: auto;
  height: auto;
  top: 50%;
  left: 50%;
  -ms-transform: translateY(-50%) translateX(-50%);
  -webkit-transform: translateY(-50%) translateX(-50%);
  -moz-transform: translateY(-50%) translateX(-50%);
  -o-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
  z-index: -1;
}

#headertext {
width:100%;
max-width:1180px;
height:23vw;
padding:80px 40px 0 40px;
margin:0 auto;
text-align:center;
color:#FFFFFF;
}

#headertext h1 {
color:#FFFFFF;
}

#headertext h1:before {
display:none;
}

#content {
background-color:#EEEEEE;
padding:0;
  display: flex;
  flex-wrap: wrap;
}

#content-left {
float:left;
width:70%;
padding:30px;
padding-bottom:0;
}

#content-left h2 {
color:#02005A;
font-weight:400;
}

#content-left a {
  color: #FFFFFF;
  font-weight: 400;
}

#content-right {
float:left;
width:30%;
background-color:#2448DA;
color:#FFFFFF;
text-align:center;
padding: 40px;
position:relative;
}

#content-right i{
font-size:34px;
margin-bottom:15px;
}

#content-right h3 {
font-family: "Anton", sans-serif;
text-transform:uppercase;
color:#FFFFFF;
font-size:18px;
letter-spacing: 1px;
font-weight: 100;
}

#progress {
position:absolute;
bottom:0;
width:0;
height:6px;
background-color:#02005A;
z-index:500;
left:0;
}

#asidewrapper {
width:100%;
height:auto;
}

#aside {
width:100%;
max-width:1240px;
padding:0 20px;
margin:0 auto;
padding-top:40px;
}

#aside.home {
max-width:980px;
}

#aside.home h1:before {
display:none;
}


#aside-left {
float:left;
width:48%;
}

#aside-right {
float:left;
width:48%;
margin-left:4%;
border: solid 5px #EEEEEE;
background-repeat:no-repeat;
background-size:cover;
background-position:center center;
}

#blockswrapper {
background-color:#2448DA;
margin-top:80px;
padding-top:50px;
}

#blocks {
width:100%;
max-width:1240px;
padding:0 20px;
margin:0 auto;
}

.block {
float:left;
width:25%;
text-align:center;
padding:0 30px 30px 30px;
color:#FFFFFF;
}

.block h5 {
font-family: "Anton", sans-serif;
font-style: normal;
font-weight: normal;
letter-spacing: 0.5px;
padding-top:10px;
font-size:23px;
color:#FFFFFF;
}

.block a {
color:#ffffff;
font-weight:400;
}

#newswrapper {
width:100%;
height:auto;
}

#news {
width:100%;
max-width:1240px;
padding:0 20px;
margin:0 auto;
}

.mx_news_block_image {
background-image:url(../layout/sfeer-nieuws-home.jpg);
}

#project-home {
padding:0 80px !important;
}

#project-home .project {
width:100%;
}

#project-home .owl-nav {
top:37% !important;
width:100%;
}

#project-home .owl-prev {
-webkit-border-radius: 0px 7px 7px 0px;
-moz-border-radius: 0px 7px 7px 0px;
-khtml-border-radius: 0px 7px 7px 0px;
border-radius: 0px 7px 7px 0px;
}

#project-home .owl-next {
-webkit-border-radius: 7px 0px 0px 7px;
-moz-border-radius: 7px 0px 0px 7px;
-khtml-border-radius: 7px 0px 0px 7px;
border-radius: 7px 0px 0px 7px;
}

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

#project-home {
padding:0 60px !important;
}

} /* end mediaquery */

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

#content-left, #content-right {
width:100%;
}

} /* end mediaquery */

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

.block {
width:50%;
}

} /* end mediaquery */

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

.block {
padding-left:0;
padding-right:0;
}



  #headerwrapper {
    position: relative;
    width: 100%;
    padding-bottom: 60vw;  /* hoogte van het videokader op mobiel */
    overflow: hidden;
  }

  /* dit is de sleutel: geen balken, focus links */
  #myVideo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;        /* vult het hele kader, geen zwarte balk */
    object-position: 10% 60%;  /* links in beeld; zet 50% 50% voor midden */
    background: transparent;
    transform: none;
    z-index: -1;
  }

  #aside {
    padding-top: 40px;
  }

  #aside-left {
    width: 100%;
  }

  #aside-right {
    height: 40vw;
    margin-left: 0;
  }	
	
	
	
	


} /* end mediaquery */

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

.block {
width:100%;
}

} /* end mediaquery */