
.menu-button{
	position:fixed;
	background-color: #D30508;
    outline:none;
    border:3px solid #D30508;
    border-radius:50%;
    padding: 0;
    top: 15px;
	right: 15px;
    width: 60px;
    height: 60px;
    cursor: pointer;
    color:white;
	z-index: 190;
	
	


}
nav {
    display: flex;
    flex-flow: column wrap;
    justify-content: center;
    align-content: center;
    align-items: center;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #000033;
	z-index: 100;
    transform: translate3d(-100%, 0, 0);
}
nav ul {
    display: flex;
    flex-flow: column wrap;
    justify-content: center;
    align-content: center;
    align-items: center;
    position: fixed;    
	list-style:none;}
nav ul  li {
    font-weight:500;
    visibility:hidden;}	
.skew{
  clip-path: polygon(0 0, 100% 0, 90% 100%, 0 100%);
}
.vertical {    
   clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}
.skewback {
  clip-path: polygon(0 0, -100% 0, 100% 100%, 0 100%);
}
	
	
	

.hamburger{position: relative;top: 6px;left: auto;right: 0px;width: 32px;cursor:pointer;z-index:6;}
.hamburger line{stroke:#ffffff;stroke-width: 6px;}
	
.navi-links {float: left;width: 25%;box-sizing: border-box;padding: 15px 0 15px 0;}
.navi-rechts {float: right;width: 75%; box-sizing: border-box;  padding:1px 0 15px 0;}
	
.topnav a {padding: 0;font-size: 25px;margin: 0;overflow: hidden; float: right;}	

.navbar{position: fixed;width: 100%;top:0;left: 0;transition: 0.6s; z-index: 3;box-sizing: border-box; padding: 0}
.scrolled{color: #000033;background-color : #000033;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);transition: 0.6s;}
	
.lijntjes {display: inline-block;position: relative;}
.lijntjes:after {background: none repeat scroll 0 0 transparent;bottom: 0;content: "";display: block;height: 5px;left: 50%;position: absolute;background-color: #be1522;transition: width 0.3s ease 0s, left 0.3s ease 0s;width: 0;}
.lijntjes:hover:after {width: 100%; left: 0;}

.knopwit a {color:#ffffff; border-color:#ffffff; padding: 14px 25px;margin:0; text-align: center;text-decoration: none;box-sizing: border-box; border: 3px solid;border-radius: 4px;display: inline-block;}	
.knopwit a:hover {background-color: #ffffff;color:#000033; border-color:#ffffff;}
.knopzwart a {color:#000033; border-color:#000033; padding: 14px 25px;margin: 0; text-align: center;text-decoration: none;box-sizing: border-box; border: 3px solid;border-radius: 4px;display: inline-block;}	
.knopzwart a:hover {background-color: #000033;color:#ffffff; border-color:#000033;}
	
.marquee {width: 100vw; float: left;max-width: 100%;box-sizing: border-box; padding:2% 0 2% 0; overflow-x: hidden;}

.track {float: left; white-space: nowrap; will-change: transform; animation: marquee 20s linear infinite;}

ul li, ul.b, ul.z { list-style-type: none;float: right;margin: 0;padding: 0;overflow: hidden;}
ul li.b a {display: block;text-align: center;padding: 14px 8px 14px 8px;margin: 0 15px 0 0;text-decoration: none;box-sizing: border-box; border: 3px solid;border-radius: 4px;border-color: transparent;color: #ffffff}
ul li.b a:hover {box-sizing: border-box; border: 3px solid;border-radius: 4px;border-color: transparent;}
	
ul li.z a {display: block;text-align: center;padding: 14px 20px 14px 20px;margin: 0;text-decoration: none;background-color: #ffffff;color:#000033;box-sizing: border-box; border: 3px solid;border-radius: 4px;border-color: transparent;}	
ul li.z a:hover {background-color: #000033;color:#ffffff;box-sizing: border-box; border: 3px solid;border-radius: 4px;border-color: #ffffff;}
	
	li a link {color: chartreuse}	

@media screen and (max-width: 1600px) {.topnav a {font-size: 23px;}}
@media screen and (max-width: 1400px) {.topnav a {font-size: 22px;}}
@media screen and (max-width: 1300px) {.topnav a {font-size: 21px;}}
@media screen and (max-width: 1200px) {.topnav a {font-size: 20px;}}
@media screen and (max-width: 1100px) {.topnav a {font-size: 19px;}}
@media screen and (max-width: 1000px) {.topnav a {font-size: 18px;}}
@media screen and (max-width: 900px) {.topnav a {font-size: 17px;}}
		
@media screen and (max-width: 800px) {
.centert{position: absolute;top:0;left: 0;right: 0;margin: auto;width: 25%}
.navbar{position: fixed;width: 100%;top:0;left: 0;transition: 0.6s; z-index: 3;box-sizing: border-box; padding: 10px 0 10px 0}
.navi-links{float: left;width: 65%;box-sizing: border-box;padding: 10px 0 5px 0} 
.navi-rechts{float: right;width: 25%;box-sizing: border-box;padding: 5px}	

.menuz{position:absolute;top:0;left:0;display: block; width:100%;height:100vh;background-color:#000033;visibility:hidden;z-index:5;padding: 0;margin: 0}


.navigationz{  width:90%;margin: 0;
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);background-color: aquamarine;}



li.mob a {
	font-size: 33px;
display: block;
  text-align: center;
	float: left;
  padding: 10px 5px 10px 5px;
  margin: 0 0 10px 0;
  text-decoration: none;
  box-sizing: border-box;

	color: #ffffff
}

li.mob a:hover {box-sizing: border-box; border: 3px solid;border-radius: 4px;border-color: transparent;}
	



li.zob a {font-size: 33px;
display: block;
  text-align: center;
  padding: 14px 20px 14px 20px;
  margin: 0;
  text-decoration: none;
	 background-color: #ffffff;color:#000033;
  box-sizing: border-box; border: 3px solid;border-radius: 4px;border-color: transparent;}	


li.zob a:hover {
  background-color: #000033;color:#ffffff;
	 box-sizing: border-box; border: 3px solid;border-radius: 4px;border-color: #ffffff;
	}	}