/* Slideshow container */
.slider-container {
	max-width: 1000px;
	position: relative;
	margin: auto;
	display: flex;
    flex-flow: row nowrap;
	justify-content: space-between;
	align-items: start;
	gap: 10px;
}

.slider-container * {
	box-sizing: border-box;
}

/* Next & previous buttons */
.slider-container .prev, .slider-container .next {
	align-self: center;
	flex: none;

	/* force centering */
	display: flex;
	justify-content: center;   /* 4. Horizontal centering */
	align-items: center;       /* 5. Vertical centering */

	cursor: pointer;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	color: gray;
	font-weight: bold;
	font-size: 18px;
	transition: 0.6s ease;
	user-select: none;
	background-color: #F1F1F1;
}


/* On hover, add a grey background color */
.slider-container .prev:hover, .slider-container .next:hover {
	background-color: #DFDFDF;
	color: black;
}

.slider-container .slide.hidden {
	display: none;
}

.slider-container .slide {
	flex: 1 1 auto;
	position: relative;
	display: flex;
	justify-content: space-evenly;
}

.slider-container .slide img {
	vertical-align: middle;
	border: 1px solid grey;
}

.slider-container .slide div {
	display: flex;
    flex-flow: column nowrap;
    justify-content: start;
    align-items: center;
}

.slider-container .slide div p {
	width: 500px;
}

.slider-container .slide div h4 {
	font-style: normal;
	font-size: 1em;
}

