.slider {
    margin-top: 2%;
}

.slider .container {
    height: 64vh;
    margin: auto;
    padding-bottom: 3%;
    position: relative;
    max-width: 100%;
    display: grid;
    place-items: center;
    overflow: hidden;
}

.slider h4 {
    font-size: 3rem;
    text-align: center;
    margin: 0;
    margin-bottom: 4%;
}

.slider .slide-container {
    display: flex;
    width: calc(250px * 10);
    animation: scroll 20s linear infinite;

}

@keyframes scroll {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(calc(-250px * 4.5));
    }
}

.slider .slide-image {
    width: 250px;
    display: flex;
    align-items: center;
    margin-right: 1%;
    padding: 15px;
    perspective: 100px;
    box-shadow: 2px 6px 8px 0 rgba(22, 22, 26, 0.18);
}

.slider img {
    width: 100%;
    transition: transform 1s;
}

.slider img:hover {
    transform: translateZ(20px);
}

@media only screen and (min-width: 514px) and (max-width: 1400px) {
    .slider {
        height: 84vh;
    }
}

@media only screen and (max-width:513px) {
    .slider {
        margin-top: 15%;
    }

    .slider .slide-image {
        height: 84%;
    }

    .slider h4 {
        font-size: 1.4rem;
        padding-top: 2%;
    }
}