.marquee {
        margin: 0 auto;
        /* width: 60%; */
        height: 140px;
        white-space: nowrap;
        overflow: hidden;
        box-sizing: border-box;
        position: relative;
}

.marquee img {
	border: 3px solid #43729d;
}

.marquee:before,
      .marquee:after {
        position: absolute;
        top: 0;
        width: 50px;
        height: 140px;
        content: "";
        z-index: 1;
}

.marquee:before {
        left: 0;
        background: linear-gradient(to right, #ccc 10%, transparent 80%);
}

.marquee:after {
        right: 0;
        background: linear-gradient(to left, #ccc 10%, transparent 80%);
}

.marquee__content {
        width: 300%;
        display: flex;
        line-height: 140px;
		-webkit-animation: marquee 10s linear infinite forwards;
		-moz-animation: marquee 10s linear infinite forwards;
		-o-animation: marquee 10s linear infinite forwards;
        animation: marquee 10s linear infinite forwards;
}

.marquee__content:hover {
	-webkit-animation-play-state: paused;
	-moz-animation-play-state: paused;
	-o-animation-play-state: paused;
    animation-play-state: paused;
}

.list-inline {
        display: flex;
        justify-content: space-around;
        width: 33.33%;
        /* reset list */
        list-style: none;
        padding: 0;
        margin: 0;
}

@-webkit-keyframes marquee {
        0% {
          transform: translateX(0);
        }
        100% {
          transform: translateX(-66.6%);
        }
}

@-moz-keyframes marquee {
        0% {
          transform: translateX(0);
        }
        100% {
          transform: translateX(-66.6%);
        }
}

@-o-keyframes marquee {
        0% {
          transform: translateX(0);
        }
        100% {
          transform: translateX(-66.6%);
        }
}

@keyframes marquee {
        0% {
          transform: translateX(0);
        }
        100% {
          transform: translateX(-66.6%);
        }
}