body{
    min-height: 70vh;
    display: grid;
    place-items center; 	
}

.slider{
    position: relative;
    height: 500px;
    width: 90%;
    margin: auto;
    display: grid;
    place-items: center;
    overflow: hidden;
 	
}

.slide-tracker{
    display: flex;
    width: calc(550px *5);
	animation: scroll 10s linear infinite;

}

@keyframes scroll{
	0%{
		transform: translateX(0);
	}
	100%{
		transform: translateX(calc(-350px *5));
	}
	
}
.slide{
    height: 400px;
    width: 750px;
    align-items: center;
    padding:10px;
	perspective: 100px;

}

img{    
    width: 100%
	transition: transform 5s;
}
img:hover{
	transform: translateZ(20px);
	
}

/* GRADIENT SHADOWS */

.slider::before,
.slider::after{
	background: linear-gradient(to right,rgba(255,255,255,1)0%,
	rgba(255,255,255,0)100%);
	content: '';
	height: 100%;
	position; absolute;
	width: 15%;
	z-index: 2;
	
}

.slider::before{
	left:0;
	top:0;
	
}
.slider::after{
	right:0;
	top:0;
	transform: rotateZ(180deg);
	
}