.flex-container{
	display: flex;
  	align-items: center;
	height: 50vh;
	width: 100%;
	color: white;
	margin: 5% 0;
}

.info-panel{
	padding: 24px;
	width: 50%;
}
.image-slider-section {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 20px;
  background-color: none;
}

.slider {
  position: relative;
  width: 90%;
  max-width: 600px;
  overflow: hidden;
  border: 2px solid #DDFFD4;
  border-radius: 8px;
}

.slider-images {
  display: flex;
  transition: transform 0.5s ease-in-out;
}

.slider-images img {
  width: 100%;
  height: auto;
  display: block;
}

.event-slider-button {
  position: absolute;
  top: 25%;
  transform: translateY(-50%);
  border: none;
  width: 50px;
  height: 50px;
  margin-top: 15%;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  z-index: 10;
  color: #DDFFD4;
  background-color: #12491C;
  transition: background-color 0.3s ease;
}

.event-slider-button:hover {
  color: #12491C;
  background-color: #DDFFD4;
}

.event-slider-button:active {
  color: #12491C;
  border: none;
  background-color: #DDFFD4;
}

.event-slider-button.prev {
  left: 10px;
}

.event-slider-button.next {
  right: 10px;
}


@media (max-width: 768px) {

	.flex-container{
    height: auto;
		flex-direction: column;
		border-radius: 15px;
	}
	.info-panel{
		width: 100vw;
	}
	.event-slider-button {
		font-size: 14px;
		padding: 8px;
		top: 0;
	}
}

@media (max-width: 480px) {
  .slider {
    width: 100%;
    border: none;
  }

  .event-slider-button {
    position: absolute;
    top: 25%;
    transform: translateY(-50%);
  }
}