/*! Menu and mega menu */

.boxrightbuttonsearchmenu, .boxrightbuttonsearchmenu .buttonbox, .boxsearch, .site-branding > a, .boxrightbuttonsearchmenu *, .boxsearch > button svg *, .boxmenu > button svg *  {
    -webkit-transition: 0.3s all ease-in;
    -moz-transition: 0.3s all ease-in;
    -o-transition: 0.3s all ease-in;
    transition: 0.3s all ease-in;
}

.menuactive .boxrightbuttonsearchmenu {
    background-color: #002970;
}

.menuactive .boxrightbuttonsearchmenu, .menuactive .boxrightbuttonsearchmenu .buttonbox, .menuactive .boxsearch, .menuactive .site-branding > a {
    border-color: #1B3E7F;
}

.menuactive .boxrightbuttonsearchmenu * {
    color: #fff;
    fill: #fff;
}

.menuactive .boxsearch > button svg * {
    fill: #fff;
}

.menuactive .boxsearch > button svg circle:first-child {
    stroke: none;
}

.menuactive .boxmenu > button svg * {
    fill: #fff;
}

.menuactive .boxsearch > button svg circle:first-child {
    stroke: none;
}

button:hover span.itemsicon:before, button:hover span.itemsicon:after {
    width: 20px;
    left: 0px;
}

.menuactive span.itemsicon {
    background-color: transparent !important
}

.menuactive span.itemsicon:before, .menuactive span.itemsicon:after {
	top: 0px;
	background-color: #fff;
	width: 20px;
}

.menuactive span.itemsicon:before {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg)
}

.menuactive span.itemsicon:after {
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

span.menutekstactive, span.menutekst {
    -webkit-transition: none;
    -moz-transition: none;
    -o-transition: none;
    transition: none;
}

.menuactive span.menutekst {
    visibility: hidden;
    width: 0px;
}

.menuactive span.menutekstactive {
    width: 45px;
    visibility: visible;
    display: flex;
    justify-content: flex-start;
}





/*--------------------------------------------------------------
# Dienstenblok
--------------------------------------------------------------*/

.boxdiensttitle:hover .boxunderdienst span, .boxdiensttitle.active .boxunderdienst span {
    opacity: 1;
}

.boxdiensttitle:hover, .boxdiensttitle.active {
    max-height: 200px;
}


.boxdiensttitle:hover h3, .boxdiensttitle.active h3 {
    opacity: 1;
}

.boxdiensttitle:hover .boximagesdienst, .boxdiensttitle.active .boximagesdienst {
    opacity: 1;
}


/*laatste nieuws*/
.imagetop {
  overflow: hidden;
}

.imagetop img {
  transition: transform 0.3s ease;
}

.imagetop:hover img {
  transform: scale(1.08);
}
/*Projecten overzicht*/
.rowprojecten a img {
  transition: transform 0.3s ease;
}

.rowprojecten a:hover img {
  transform: scale(1.08);
}



/*buttonbox a */

.buttonbox > a,
.btn-hover-sweep {
  position: relative;
  overflow: hidden;
  border: none;
  border-radius: 999px;
}

.buttonbox > a::before,
.btn-hover-sweep::before {
  content: "";
  position: absolute;
  top: -3px;
  bottom: -3px;
  left: -20%;
  width: 0;
  background: rgba(0, 41, 112, 0.25);
  transform: skewX(15deg);
  transition: width 0.3s ease;
  z-index: 1;
  border-radius: inherit;
}

.buttonbox > a:hover::before,
.btn-hover-sweep:hover::before {
  width: 140%;
}

.buttonbox > a::after,
.btn-hover-sweep::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid currentColor;
  pointer-events: none;
  z-index: 2;
  border-radius: inherit;
}

.orangeborder::after {
  border: 1px solid #F78E1B!important;
}

.oranjebg {
	border: 0px!important;
}

.oranjebg::after {
	display: none!important;
}

.buttonbox > a span,
.buttonbox > a svg,
.btn-hover-sweep span,
.btn-hover-sweep svg {
  position: relative;
  z-index: 3;
}

