:root {
    --svzRed: #CB0A32;
    --svzBeige: #F4F0E0;
    --svzBlack: #384049;
}
#jobs-carousel {
    position: relative;
	display: flex;
    flex-direction: column;
    gap: 20px;
}
.job {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
    position: relative;
    overflow: hidden;
    background-color: white;
	border: 1px solid #E2E2E2;
	border-radius: 20px;
    text-decoration: none;
	height: 100%;
	min-height: 100px;
	box-shadow: 0 5px 10px -5px rgb(0 0 0 / 10%), 0 5px 5px -5px rgb(0 0 0 / 4%);
}
.job .slide-content {
	padding: 20px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}
.job .arrows {
    position: absolute;
    top: 0px;
    right: 10px;
    bottom: 0px;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 25px;
    overflow: hidden;
    z-index: 0;
}
.job .arrows svg {
    width: 100%;
    height: 102%;
}
.job .arrows .arrow {
    position: relative;
    height: 100%;
}
.job .arrows .arrow.left {
    left: -20px;
    opacity: 0.0;
    -webkit-transition: all .3s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: all .3s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.job .arrows .arrow.right {
    right: -20px;
    opacity: 0.0;
    -webkit-transition: all .3s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: all .3s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.job img {
	max-height: 50px;
	width: 100%;
	max-width: 100%;
	object-fit: contain;
}


/* iPad Landscape */
@media only screen and (min-width: 1200px) {
    .job:hover .arrows .arrow.left {
        left: 0px;
        opacity: 1.0;
        -webkit-transition: all .3s cubic-bezier(0.165, 0.84, 0.44, 1);
        transition: all .3s cubic-bezier(0.165, 0.84, 0.44, 1);
    }
    .job:hover .arrows .arrow.right {
        right: 0px;
        opacity: 1.0;
        -webkit-transition: all .3s cubic-bezier(0.165, 0.84, 0.44, 1);
        transition: all .3s cubic-bezier(0.165, 0.84, 0.44, 1);
    }
    .job-content {
        padding: 35px;
    }
    .job-content h3 {
        font-size: 22px;
    }
    .job-meta ul li {
        font-size: 18px;
    }
}

.slider-container {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: 100%;
    overflow: hidden;
}

.swiper-vacatures {
    width: 100%;
	overflow: hidden;
    -webkit-mask: linear-gradient(
      90deg,
      transparent,
      white 20%,
      white 80%,
      transparent
    );
    mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent);
}
