* {
	margin: 0;
	padding: 0;
}
body {
	background: #0b69ed;
	height: 100vh;
}
.slider-area h2 {
	text-align: center;
	font-family: impact;
	font-size: 60px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 2px;
	margin: 100px 0 30px 0;
	color: #fff;
}
.wrapper {
	display: flex;
	align-items: center;
	gap 50px 50px;
	width: 780px;
	margin: 0px auto;
	overflow: hidden;
	border-radius: 180px;
	padding: 5rem;
	background: #fff;
	box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}
.item {
	animation: animate 110s linear infinite;  /* MikeO >> 110s is how long it takes all the logos to pass - linked to pixel width below */
}
.container:hover .item {
	animation-play-state: paused;
}
@keyframes animate {
	0% {
		transform: translate3d(0, 0, 0);
	}
	100% {
		transform: translate3d(-12500px, 0, 0);  /* MikeO >> 12500 is the cllective pixel width of the logos */
	}
}
@media (max-width:767px) {
	.slider-area h2 {
		font-size: 30px;
	}
	.wrapper {
		width: 50%;
		border-radius: 0;
		padding: 0;
	}
}