@media (max-width:767px)
{
	#navbar-hoofdmenu{
		position: fixed;
     	z-index: 100;
		top: 0;
		height: 100vh;
		width: 100%;
		top: 0;
		padding: 0;
		margin: 0;
		left: 0;
		background: #ffffff;
		transform: scale(0);
		opacity: 0;

		-webkit-transition:all 0.2s ease-in-out;
		-moz-transition:all 0.2s ease-in-out;
		-o-transition:all 0.2s ease-in-out;
		transition:all 0.2s ease-in-out;
	}

	#hoofdmenu{
		width: 100%;
		position: static;
		border-radius: 0;
		padding-top: 0;
		margin: 0;
		left: 0;
		background: #ffffff;
		-webkit-transition: all 0.4s ease-in-out;
		-moz-transition: all 0.4s ease-in-out;
		-o-transition: all 0.4s ease-in-out;
		transition: all 0.4s ease-in-out;
	}

	#hoofdmenu > li{
	}
	#hoofdmenu > li:last-child{
	}


	#hoofdmenu > li.menu-item-has-children::after {
		content: "\f054";
		font-family: 'Font Awesome 5 Pro';
	    position: absolute;
	    right: 33px;
	    font-weight: 700;
	    color: rgba(31, 38, 76, 0.5);
    	top: 8px;
	}
	#hoofdmenu > li.menu-item-has-children:hover::after,
	#hoofdmenu > li.menu-item-has-children.open::after {
		content: "\f078";
	}

	#hoofdmenu > li > a{
		color: #0d1a34;
		font-size: 18px;
		font-weight: 700;
		line-height: 26px;
		padding: 10px 25px;
    	width: calc(100% - 60px);
		display: block;
	}
	#hoofdmenu li:hover {
		position: relative;
	}
	#hoofdmenu li:hover > ul {
		margin-top: 0;
	}

	#hoofdmenu li a {
		text-transform: uppercase;
		text-shadow: none;
	}

	body.single-oplossing #hoofdmenu > li.oplossingen > a,
	body.single-product #hoofdmenu > li.producten > a,
	body.single-branche #hoofdmenu > li.branches > a, #hoofdmenu > li:hover > a,
	#hoofdmenu > li.current-menu-item > a,
	#hoofdmenu > li.current-menu-ancestor > a,
	#hoofdmenu > li.current-menu-parent > a {
		color: #00aacd;
	}

	#hoofdmenu li.menu-item-has-children ul,
	#hoofdmenu li.menu-item-has-children:hover ul {
		position: relative;
	}

	#hoofdmenu > li > ul {
		display: none;
		opacity: 1;
    	padding: 0;
	    -webkit-transition: initial;
	    transition: initial;
    	margin-top: 0;
		margin-bottom: 15px;
	}
	#hoofdmenu > li.menu-item-has-children:hover > ul {
		display: block;
	}

	#hoofdmenu li ul li{
		margin-bottom: 10px;
		padding: 0 30px;
	}

	#hoofdmenu li ul li:last-of-type{
		margin-bottom: 0;
	}

	#hoofdmenu li ul li a{
	    color: rgba(31, 38, 76, 0.6);
	    font-size: 13px;
	    font-weight: 500;
	    letter-spacing: 1.3px;
	    text-transform: uppercase;
	    padding: 0 25px;
	    display: block;
	    white-space: initial;
	    line-height: 20px;
	}

	.navbar-default .navbar-toggle .icon-bar,
	#navbar-hoofdmenu .navbar-toggle .icon-bar{
		background: #fff;
	}

	.navbar-default .navbar-toggle.collapsed .icon-bar {

	}

	#navbar-hoofdmenu .navbar-toggler {
		position: relative;
		z-index: 1800;
		width: 20px;
		height: 20px;
	}

	#navbar-hoofdmenu.navbar-collapse .navbar-toggler-icon{
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cg%3E%3Cg%3E%3Cg%3E%3Cg%3E%3Cg%3E%3Cpath fill='%23fff' d='M19.445 19.445c-.53.53-1.59.53-2.121 0L1.061 3.182c-.53-.53-.53-1.591 0-2.121s1.59-.53 2.12 0l16.264 16.263c.53.53.53 1.591 0 2.121z'/%3E%3C/g%3E%3Cg%3E%3Cpath fill='%23fff' d='M1.06 19.445c-.53-.53-.53-1.59 0-2.121L17.325 1.061c.53-.53 1.591-.53 2.122 0 .53.53.53 1.59 0 2.12L3.182 19.446c-.53.53-1.59.53-2.121 0z'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
		width: 20px;
		height: 20px;
		background-size: 20px 20px;
	}


	.navbar-header {
		position: relative;
		width: auto;
	}

	#navbar-hoofdmenu.collapse{
		display: block;
    	overflow-y: scroll;
	}

	#navbar-hoofdmenu.showmenu{
		top: 0;
		transform: scale(1);
		opacity: 1;

		-webkit-transition:all 0.2s ease-in-out;
		-moz-transition:all 0.2s ease-in-out;
		-o-transition:all 0.2s ease-in-out;
		transition:all 0.2s ease-in-out;
	}

    #navbar{
        border: none;
    }

	#hoofdmenu.showmenu{
		top: 0px;
	    z-index: 15;
	}
	#hoofdmenu li,
	#hoofdmenu li:hover {
		overflow: initial;
	}

	#hoofdmenu li.dropdown ul{
		opacity: 1;
		background: none;
		padding: 0;
		box-shadow: none;
	    border: none;
		max-height: 0;
		overflow: hidden;

		-webkit-transition:max-height 0.8s ease-in-out !important;
		-moz-transition:max-height 0.8s ease-in-out !important;
		-o-transition:max-height 0.8s ease-in-out !important;
		transition:max-height 0.8s ease-in-out !important;
	}

	#hoofdmenu li.dropdown.open ul{
		max-height: 500px;
	}

	body{
		left: 0%;
		position: relative;

		-webkit-transition:left 0.4s ease-in-out;
		-moz-transition:left 0.4s ease-in-out;
		-o-transition:left 0.4s ease-in-out;
		transition:left 0.4s ease-in-out;
	}

	body.collapsed{
		position: relative;
		overflow: hidden;

		-webkit-transition:left 0.4s ease-in-out;
		-moz-transition:left 0.4s ease-in-out;
		-o-transition:left 0.4s ease-in-out;
		transition:left 0.4s ease-in-out;
	}
}