.et_mobile_menu {
	padding:5% 0px 0% 0px !important;
}

.width50 {
	width:50%;
}

.width100 {
	width:100%;
}

.footer-menu > div:first-child {
	display:flex;
	flex-direction:row;
}

.footer-menu {
  background-color: #000; /* Achtergrondkleur */
  color: white;
  padding: 20px !important;
  font-family: 'Poppins', sans-serif;
}

.menu {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 10px;
}

.menu li {
  margin: 0;
}

.menu a {
  color: white;
  text-decoration: none;
  font-size: 16px;
}

.button a {
  background-color: #622186;
  color: white;
  padding: 12px 25px;
  text-decoration: none;
  font-weight: bold;
  display: inline-block;
}

.werkenbijKnop:after {
	content: url("/wp-content/uploads/2025/04/ArrowWerkenbij.svg") !important;
	margin-left:10px;
}

.button a:hover {
  background-color: #9b30c0; /* Lichter paars voor hover effect */
}

.ReviewsGoogle {
	display:none;
}

#mobiel-menu .et_mobile_nav_menu > div:not(.closed) #mobile_menu2 .ReviewsGoogle {
	display:block;
	min-height:0px;
}


@media (max-width: 350px) {
	
	.button a {
		  padding: 12px 20px;
	}
}


#mobiel-menu .et_mobile_nav_menu > div:not(.closed) #mobile_menu2 {
	display: flex ;
	left: -4.9%;
	top: 9.5vh;
    flex-direction: column !important;
	  opacity: 0;
	  height: 0; /* Start met een hoogte van 0 */
	  overflow: hidden; /* Verberg het element totdat het volledig zichtbaar is */
	  animation: growDown 0.7s forwards; /* Voer de animatie uit */
}

#mobiel-menu .et_mobile_nav_menu > div.closed #mobile_menu2 {
	left: -4.9%;
	top: 9.5vh;
  animation: shrinkUp 0.7s forwards; /* Voer de animatie uit bij sluiten */
}

#mobile_menu2 .extra-menu-container {
	margin-top:auto;
}

#mobile_menu2 .menu {
	padding-left:0px;
	background-color:#000000 !important;
}


@media (max-width: 981px) { 
	#mobiel-menu .et_mobile_nav_menu > div.closed #mobile_menu2 {
		top: 61px;
 		animation: shrinkUpResponsive 0.7s forwards; /* Voer de animatie uit bij sluiten */
		
	}
	
	#mobiel-menu .et_mobile_nav_menu > div:not(.closed) #mobile_menu2 {
		top: 61px;
		animation: growDownResponsive 0.7s forwards; /* Voer de animatie uit */
		
	}
}

@keyframes growDown {
  0% {
    opacity: 0;
    height: 0; /* Start met hoogte 0 */
  }
  100% {
    opacity: 1;
    height: calc(100vh - 15.5vh); /* Eindig met de gewenste hoogte (pas dit aan naar wens) */
  }
}

@keyframes shrinkUp {
  0% {
    opacity: 1;
    height: calc(100vh - 15.5vh); /* Begin met de volledige hoogte */
  }
  100% {
    opacity: 0;
    height: 0; /* Eindig met hoogte 0 */
  }
}

@keyframes growDownResponsive {
  0% {
    opacity: 0;
    height: 0; /* Start met hoogte 0 */
  }
  100% {
    opacity: 1;
    height: calc(100vh - 10.5vh); /* Eindig met de gewenste hoogte (pas dit aan naar wens) */
  }
}

@keyframes shrinkUpResponsive {
  0% {
    opacity: 1;
    height: calc(100vh - 10.5vh); /* Begin met de volledige hoogte */
  }
  100% {
    opacity: 0;
    height: 0; /* Eindig met hoogte 0 */
  }
}

/* bulletpoints animatie */
	@keyframes slideUp {
		0% {
			opacity: 0;
			transform: translateY(10%);
		}
		100% {
			opacity: 1;
			transform: translateY(0);
		}
	}

	.animatieList .dsm_icon_list_child {
		opacity: 0;
		transform: translateY(10%);
	}


/* custom grid projecten pagina's */

/* Blog Grid Layout - Alleen Grid met Responsive */
.blogGrid .et_pb_ajax_pagination_container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 30px;
}

/* Reset margin voor grid items */
.blogGrid .et_pb_post {
    margin-bottom: 0 !important;
}

/* Responsive Grid */
@media (max-width: 768px) {
    .blogGrid .et_pb_ajax_pagination_container {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    .blogGrid .et_pb_ajax_pagination_container {
        grid-template-columns: repeat(2, 1fr);
        gap: 25px;
    }
}

@media (min-width: 1025px) {
    .blogGrid .et_pb_ajax_pagination_container {
        grid-template-columns: repeat(3, 1fr);
        gap: 30px;
    }
}

/* blog styling */

.blogGrid article > div:first-child, .blogGrid article > div:first-child .et_pb_slide {
	min-height: 400px !important;
	height: 400px !important;
}

.blogGrid article > div:first-child {
	margin-bottom:15px;
}

.blogGrid article > div:first-child  .et_pb_slide {
	background-repeat: no-repeat;
    border-radius: 47px;
	background-position:center !important;
}

.blogGrid article h2 {
	font-family: 'Titillium Web', Helvetica, Arial, Lucida, sans-serif;
    font-weight: 700;
    font-size: 20px;
    color: #0F2446 !important;
    text-align: center;
}

/* blog styling */ 

/* grid foto's project */

.TitleProjectenPagina > div {
	font-family: 'Titillium Web', Helvetica, Arial, Lucida, sans-serif;
    font-weight: 700;
}

.gridprojectfotos .et_post_gallery {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
    list-style: none;
    padding: 0;
    margin: 0;
}

/* Gallery items - volledige grootte */
.gridprojectfotos .et_gallery_item {
    margin: 0 !important;
    width: 100%;
    height: 100%;
}

/* Link en span volledige grootte */
.gridprojectfotos .et_gallery_item a,
.gridprojectfotos .et_gallery_item .et_portfolio_image {
    display: block;
    width: 100%;
    height: 100%;
}

/* Afbeelding volledige grootte */
.gridprojectfotos .et_gallery_item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Responsive Grid */
@media (max-width: 768px) {
    .gridprojectfotos .et_post_gallery {
        grid-template-columns: 1fr;
        gap: 15px;
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    .gridprojectfotos .et_post_gallery {
        grid-template-columns: repeat(2, 1fr);
        gap: 18px;
    }
}

@media (min-width: 1025px) {
    .gridprojectfotos .et_post_gallery {
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
    }
}

/* 3d project */


@media (min-width: 981px) and (max-width: 1250px) {
	.LongImgParticulierBedrijf {
		background-image: url("/wp-content/uploads/2025/04/4-1.png");
		background-size: cover;
        border-radius: 20px;
        padding: 15vh 0vh;
	}
	.LongImgParticulierBedrijf img {
		visibility:hidden;
	}
}

/* 3d project */

/* diensten Boxes */

.Diensten {
	display:flex;
}

.Diensten > .et_pb_column {
	display:flex;
}

.Diensten > .et_pb_column > .et_pb_module  {
	flex-grow:1;
	margin-bottom:0px !important
}

/* diensten Boxes */

/* cards */

.cards .et_pb_column_9, .cards {
	display:flex;
}

.cards .et_pb_column_9 > .dsm_card {
	flex-grow:1;
}

/* cards */