/* ------------------------------------------------------------------------------------------ */
/* -------------------------------------- MENU DESKTOP ------------------------------------ */

.menubar {/*background-color: var(--color-2);*/ border-bottom: 1px solid var(--grey);}

.dklg250 { width:250px /*200px*/; height: auto /*250px *//*159px*/;}
.dklg200 { width:200px /*200px*/; height: auto /* 200px */ /*159px*/; }
.dklg150 { width:150px /*200px*/; height: auto /*150px *//*159px*/; }

/* Logo zelf animeren met scale */
.dklg {
	position: absolute; left: 0; top: -50px;
	margin:10px 15px;
    display: block;
    transition: transform .35s ease;
    transform-origin: center top; 
}

/* optioneel */
.lgsmlbk { /* state bij groter */ }
.lgsml    { /* state bij normaal formaat */ }


/*.lgsml {	-webkit-animation: scalelg 1s forwards; /* Safari 4+ */
/*  	-moz-animation:    scalelg 1s forwards; /* Fx 5+ */
/*  	-o-animation:      scalelg 1s forwards; /* Opera 12+ */
/*  	animation:         scalelg 1s forwards; /* IE 10+, Fx 29+ */
/*} */

/*.lgsmlbk {-webkit-animation: scalelgbk 1s forwards; /* Safari 4+ */
/*  	-moz-animation:    scalelgbk 1s forwards; /* Fx 5+ */
/*  	-o-animation:      scalelgbk 1s forwards; /* Opera 12+ */
/*  	animation:         scalelgbk 1s forwards; /* IE 10+, Fx 29+ *//*}*/

/*@keyframes scalelg { */
/*    from {width:250px; height:250px; top: -60px;} */
/*    to {width:200px; height:200px; top: -60px;} */
/*}

/*@keyframes scalelgbk {*/
/*    from {width:200px; height:200px; top: -60px;}*/
/*    to {width:250px; height:250px; top: -60px;}*/
/*}*/





.fixed-top {position: fixed !important;}
.sticky-top {position: -webkit-sticky !important;position: sticky !important;}
.sticky-top1 {position: -webkit-sticky !important;position: sticky !important; top:45px /*45.5px*/; z-index: 1020;}

.icon-bard {/*width: 100%;*/ position: absolute; right: 15px; top: 8px; text-align: right; /*left:10px;*/}
.icon-bard i {color: var(--white);}
.icon-bard .btn-oned:hover i, .icon-bard .btn-threed:hover i {color: var(--black); }
.icon-bard .btn-twod i {color: var(--black);}
.icon-bard .btn-twod:hover i  {color: var(--white); }
.icon-bard .fa-xl {font-size: 2em !important; line-height: 1 !important;}


.btn-oned, .btn-threed {padding: 6px 7px; border: 2px solid var(--color-3); background-color: var(--color-3);}
.btn-oned:hover,  .btn-threed:hover {border: 2px solid var(--color-1); background-color: var(--white);}
.btn-twod {padding: 7px; border: 2px solid var(--color-1); background-color: var(--color-1); font-size: var(--standard); color: var(--white);}
.btn-twod:hover {border: 2px solid var(--color-3); background-color: var(--color-3); color: var(--white);}

.menu {padding-top: 25px !important; }
.menu li {text-transform: uppercase; font-size:15px; padding-right: 15px !important; margin-left: 0px !important; list-style: none!important; float:left; padding-left:0px!important; font-weight: 500; }

.navbarh {top: 20px; width: 100%; /* Full width */ transition: top 0.3s; display: block; /* Transition effect when sliding down (and up) */}
.navbarh a {float: left; display: block; color: var(--black); text-align: center; padding: 15px; text-decoration: none !important; font-size: var(--h6-size, --body-size); }
.navbarh a:hover, .navbarh a:active, .navbarh a:focus {color: var(--grey);}

.navbar {float: right; padding: 5px 0px 0px;}

.hmenu ul, hmenu li {color: var(--black); }
.telnr a {color:#000; text-decoration: none!important;}
.telnr a:hover, .telnr a:active, .telnr a:focus {color: #f39201 /* #955a2c */ !important;}


/* Zorg dat dropdowns boven hero/headers liggen */
.navbar .dropdown-menu { z-index: 2000; }

/* Als je een wrapper met overflow hidden hebt, stop daarmee voor de header */
.header, .site-header, .navbar, .menu-wrapper {
  overflow: visible;
}

/* Optioneel: iets grotere klikdoel en nette spacing */
.navbar .dropdown-menu { margin-top: -.5rem; }


.navbar-light .navbar-nav .nav-link, .navbar-light .navbar-nav .active > .nav-link , .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show > .nav-link {color: var(--color-5); /*text-transform: var(--upper);*/ padding-right: 1.2rem;}
.navbarh a:active, .navbarh a:focus, .navbarh a:hover {color: var(--color-6) !important;}
.navbar-light .navbar-nav .nav-link {color: var(--color-5); /*text-transform: var(--upper);*/}

.dropdown-menu {color: var(--white); /*text-transform: var(--upper);*/ background-color: var(--black); /* #f5950a */; background-clip: padding-box; border: none; border-radius: 0px; min-width: 20em; left: -75%;}
.dropdown-item:focus, .dropdown-item:hover, .dropdown-item:active {background-color: transparent;}


[data-toggle="collapse"] .fa:before {content: "\f139";margin-right:10px;}
[data-toggle="collapse"].collapsed .fa:before {content: "\f13a"; margin-right:10px;}

.dkml {}
.dkmm {text-align: right;}
.dkmr {right: 15px;}

.dropdown-menu {color: #000; text-transform: uppercase; background-color: #fff /* #f5950a */; background-clip: padding-box; border: none; border-radius: 30px; min-width: 15em; left: -75%; box-shadow: 3px 3px 10px rgba(0,0,0,.3); }
.dropdown-item {text-align: left !important; padding-left: 35px !important;}
.dropdown-item:focus, .dropdown-item:hover, .dropdown-item:active {/*background-color: #e8f1f8 !important; font-weight: bold;*/ border-top: none !important;}
li.dropdown:hover > .dropdown-menu {display: block;}
ul .dropdown-menu li {margin-right: 0px !important;}
 .navbar-expand-md .navbar-nav .dropdown-menu {
      top: 100%;
  }

.open {height:100%;}

/* ------- BOOTSTRAP Desktop GRID LG ----------- */
@media only screen and (min-width: 992px) and (max-width: 1200px)
{

	
	.navbar {/*float:unset;*/}
	.navbar-light .navbar-nav .nav-link {font-size:20px; padding-right: 10px !important;}
	.menubar {padding: 0px;}
}


/* -------- BOOTSTRAP TABLET MD -----------------*/
@media only screen and (max-width: 991px)
{

	

.menu {padding-top: 100px !important; padding-left: 15px;}
.mobbut {margin-top:40px;}

	.menu li {/*float:none !important;*/ width: 100%;}
	.lgtm {width: 100px; /*height: 119px;*/}
	.stdc.mmenubar{padding:50px 0px; background: var(--lightgrey); height: 75px;}
	.btn-onem, .btn-twom, .btn-threem {padding: 2px 7px;}

	
	
}