#c-carousel-container {
	width: 50vw;
	height: calc(50vw/1.5);
	position: relative;
	margin: 50px auto 0;
	border-radius: 0.3rem;
	filter: drop-shadow(0 0 10px #0003);
	overflow: hidden;
}

#c-carousel-container > div:first-child {
	overflow: hidden;
	max-width: 100%;
	margin: 0;
}

#c-border-radius {
	border-radius: 0.3rem;
} 

#c-carousel {
	position: relative;
	height: calc(50vw/1.5);
	padding: 0;
	margin: 0;
}

.c-animate{
	-webkit-transition-duration: .5s;
	-moz-transition-duration: .5s;
	-o-transition-duration: .5s;
	transition-duration: .5s;
	-webkit-transition-property: -webkit-transform;
	-moz-transition-property: -moz-transform;
	-o-transition-property: -o-transform;
	transition-property: transform;
}


.c-slide {
	list-style: none;
	position: relative;
	float: left;
	transform: translateX(-50vw);
	width: 50vw;
	height: calc(50vw/1.5);
	overflow: hidden;

	/*outline: solid 2px black;*/
}

.c-slide img {
	/* width: 100%; */
	height: 100%;
	border-radius: 0.3rem;
	object-fit: cover;
	object-position: center center;
	overflow: hidden;
  }

#c-controls{
	position: absolute;
    width: 50vw;
    height: calc(50vw/1.5);
    top: 0;
	display: flex;
}

#c-controls span {
	width: 50px;
	cursor: pointer;
	opacity: 0.4;
}

#c-controls span:hover {
	opacity: 1;
}

#c-prev:hover {
	cursor:url('./arrow_left.png') 17 17, auto ;
}

#c-prev {
	flex:1;
}

#c-next:hover {
	cursor:url('./arrow_right.png') 17 17, auto;
}

#c-next {
	flex:1;
}

@media (max-width: 500px){ 
	#c-carousel-container {
		width: 96vw; 
		height: calc(96vw/1.5);
		object-fit: center;
		/* margin: 50px auto 0; */
	}
	#c-carousel {
		width: 96vw;
		height: calc(96vw/1.5);
	}
	.c-slide {
		width: 96vw;
		height: calc(96vw/1.5);
		transform: translateX(-96vw);
	}
	#c-controls {
		width: 96vw;
		height: calc(96vw/1.5);
	}

}