.flex_content:has( > .img_swiper_sfeer){
  position: relative;
}

.flex_content:has(> .img_swiper_sfeer)::before {
  content: "";
  position: absolute;
  left: 50%;
  width: 105%;
  height: auto;
  aspect-ratio: 1510/75;
  background-image: url("data:image/svg+xml,%3Csvg width='1510' height='75' viewBox='0 0 1510 75' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 75H1510L506 0L0 75Z' fill='white'/%3E%3C/svg%3E%0A");
  background-size: 100% 100%;
  background-position: center bottom;
  pointer-events: none;
  transform: translate(-50%, -98%);
}

#pk_flex_content .flex_content:has(+ .flex_content > .img_swiper_sfeer){
  padding-bottom: 100px;
}

.flex_layout.img_swiper_sfeer {
  position: relative;
}

.flex_layout.img_swiper_sfeer .swiper {
  overflow: visible
}

.flex_layout.img_swiper_sfeer .swiper-wrapper {
align-items: center;
transform: translateX(-300px);
margin-left: -250px;
cursor: grab;
}

.flex_layout.img_swiper_sfeer .swiper-wrapper:active {
cursor: grabbing;
}

.flex_layout.img_swiper_sfeer .swiper-wrapper-container {
  position: relative;
}


.flex_layout.img_swiper_sfeer .swiper-wrapper-container > div {
  z-index: 1;
  position: relative;
}


/* START zelfde code als in swiper_layout */
.flex_layout.img_swiper_sfeer .section_heading{
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 4.5rem;
}


.flex_layout.img_swiper_sfeer .section_heading .heading_text {
	color: var(--rood);
}

#pk_flex_content .flex_layout.img_swiper_sfeer .swiper_button_wrapper {
  display: flex;
  gap: 1.5rem;
}


#pk_flex_content .flex_layout.img_swiper_sfeer .swiper_button_wrapper .custom-button-next, 
#pk_flex_content .flex_layout.img_swiper_sfeer .swiper_button_wrapper .custom-button-prev {
  background-color: white; 
  color: var(--rood);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
}


#pk_flex_content .flex_layout.img_swiper_sfeer .swiper_button_wrapper .custom-button-next:hover .custom-navigation-icon {
  transform: translateX(10px);
  transition: all ease 0.5s;
}
#pk_flex_content .flex_layout.img_swiper_sfeer .swiper_button_wrapper .custom-button-prev:hover .custom-navigation-icon {
  transform: translateX(-10px);
  transition: all ease 0.5s;
}


#pk_flex_content .flex_layout.img_swiper_sfeer .swiper_button_wrapper .custom-button-next .custom-navigation-icon,
#pk_flex_content .flex_layout.img_swiper_sfeer .swiper_button_wrapper .custom-button-prev .custom-navigation-icon {
  font-family: 'Material Symbols Outlined';
  font-size: 36px; 
  font-variation-settings:
  'FILL' 0,
  'wght' 100,
  'GRAD' 0,
  'opsz' 36;
  transition: all ease 0.5s;
}


#pk_flex_content .flex_layout.img_swiper_sfeer .swiper_button_wrapper .swiper-button-disabled {
  color: var(--rood);
}



.flex_layout.img_swiper_sfeer .swiper-slide {
	margin: 0 2rem;
}


.flex_layout.img_swiper_sfeer .swiper-slide:nth-child(odd) {
	aspect-ratio: 3/4;
	height: 450px;
	width: auto;
	overflow: hidden;
	border-radius: 10px;
	transform: rotate(5deg);
	transition: all ease 0.5s
}

.flex_layout.img_swiper_sfeer .swiper-slide:nth-child(odd):hover {
	transform: rotate(0deg) scale(1.1)
}

.flex_layout.img_swiper_sfeer .swiper-slide:nth-child(even) {
	aspect-ratio: 4/3;
	width: 500px;
	/* height: auto; */
	overflow: hidden;
	border-radius: 10px;
	transform: rotate(-5deg);
	transition: all ease 0.5s
}

.flex_layout.img_swiper_sfeer .swiper-slide:nth-child(even):hover {
	transform: rotate(0deg) scale(1.1)
}

.flex_layout.img_swiper_sfeer .swiper-slide:nth-child(odd) img,
.flex_layout.img_swiper_sfeer .swiper-slide:nth-child(even) img {
	width: 100%;
	height: 100%;
	object-fit: cover; 
	display: block;
}




@media screen and (max-width: 767px){
	.flex_layout.img_swiper_sfeer::before {
	display: none;
	}
  
  #pk_flex_content .flex_layout.img_swiper_sfeer .swiper_button_wrapper {
    display: flex;
    gap: 1rem;
  }
  
  .flex_layout.img_swiper_sfeer .swiper-slide:nth-child(even) {
    aspect-ratio: 3/4;
    height: 450px;
    width: auto;
    overflow: hidden;
    border-radius: 10px;
    transform: rotate(3deg);
    transition: all ease 0.5s
  }
  
  .flex_layout.img_swiper_sfeer .swiper-wrapper {
  transform: translateX(0px);
  margin-left: -22px;
  }
  
}