houdini/app/assets/stylesheets/components/carousel.css.scss

/* License: AGPL-3.0-or-later WITH WTO-AP-3.0-or-later
Full license explanation at https://github.com/houdiniproject/houdini/blob/master/LICENSE */
@import 'mixins';

.carousel {
  position: relative;
}
.carousel-inner {
  position: relative;
  overflow: hidden;
  width: 100%;
}
.carousel-inner > .item {
  display: none;
  position: relative;
  -webkit-transition: 0.6s ease-in-out left;
  -o-transition: 0.6s ease-in-out left;
  transition: 0.6s ease-in-out left;
}
.carousel-inner img {
  width: 100%;
  max-height: 320px;
}
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
  line-height: 1;
}
@media all and (transform-3d), (-webkit-transform-3d) {
	.carousel .item {
	    left: 0 !important;
	      -webkit-transition: opacity .4s; /*adjust timing here */
	         -moz-transition: opacity .4s;
	           -o-transition: opacity .4s;
	              transition: opacity .4s;
	}
	.carousel-control {
	    background-image: none !important; /* remove background gradients on controls */
	}
	/* Fade controls with items */
	.next.left,
	.prev.right {
	    @include opacity(1);
	    z-index: 1;
	}
	.active.left,
	.active.right {
	    @include opacity(0);
	    z-index: 2;
	}
}
.carousel-inner > .active,
.carousel-inner > .next,
.carousel-inner > .prev {
  display: block;
}
.carousel-inner > .active {
  left: 0;
}
.carousel-inner > .next,
.carousel-inner > .prev {
  position: absolute;
  top: 0;
  width: 100%;
}
.carousel-inner > .next {
  left: 100%;
}
.carousel-inner > .prev {
  left: -100%;
}
.carousel-inner > .next.left,
.carousel-inner > .prev.right {
  left: 0;
}
.carousel-inner > .active.left {
  left: -100%;
}
.carousel-inner > .active.right {
  left: 100%;
}