.carousel {
	position: relative;
	overflow: hidden;
	margin: auto;
	margin-top: 10px;
	width: 95%;
	height: 450px;
	box-shadow: 0 1em 5em black;

	$slides: 7;
	$delay: 5s; // Time to cycle everything

	> * {
		position: absolute;
		left: 0; right: 0;
		top: 0; bottom: 0;
		background-size: cover;

		@for $i from 1 through $slides {
			&:nth-child(#{$i}) {
				animation: fade#{$i} $delay infinite;
			}
			@keyframes fade#{$i} {
				@for $j from 0 through $slides {
					#{percentage($j/$slides)} {
						opacity: if($i==$j+1 or ($i==1 and $j==$slides), 1, 0);
					}
				}
			}
		}
	}
}

.carousel>* {
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	background-size: cover;
}

/* Slide animations */
.carousel>*:nth-child(1) {
	animation:fade1 30s infinite;
}
@keyframes fade1 {
	0%   {opacity:1}
	15%  {opacity:0}
	30%  {opacity:0}
	45%  {opacity:0}
	60%  {opacity:0}
	75%  {opacity:0}
	100% {opacity:0}
}

.carousel>*:nth-child(2) {
	animation:fade2 30s infinite;
}
@keyframes fade2 {
	0%   {opacity:0}
	15%  {opacity:1}
	30%  {opacity:0}
	45%  {opacity:0}
	60%  {opacity:0}
	75%  {opacity:0}
	100% {opacity:0}
}

.carousel>*:nth-child(3) {
	animation:fade3 30s infinite;
}
@keyframes fade3 {
	0%   {opacity:0}
	15%  {opacity:0}
	30%  {opacity:1}
	45%  {opacity:0}
	60%  {opacity:0}
	75%  {opacity:0}
	100% {opacity:0}
}

.carousel>*:nth-child(4) {
	animation:fade4 30s infinite;
}
@keyframes fade4 {
	0%   {opacity:0}
	15%  {opacity:0}
	30%  {opacity:0}
	45%  {opacity:1}
	60%  {opacity:0}
	75%  {opacity:0}
	100% {opacity:0}
}

.carousel>*:nth-child(5) {
	animation:fade5 30s infinite;
}
@keyframes fade5 {
	0%   {opacity:0}
	15%  {opacity:0}
	30%  {opacity:0}
	45%  {opacity:0}
	60%  {opacity:1}
	75%  {opacity:0}
	100% {opacity:0}
}
.carousel>*:nth-child(6) {
	animation:fade6 30s infinite;
}
@keyframes fade6 {
	0%   {opacity:0}
	15%  {opacity:0}
	30%  {opacity:0}
	45%  {opacity:0}
	60%  {opacity:0}
	75%  {opacity:1}
	100% {opacity:0}
}
.carousel>*:nth-child(7) {
	animation:fade7 30s infinite;
}
@keyframes fade7 {
	0%   {opacity:0}
	15%  {opacity:0}
	30%  {opacity:0}
	45%  {opacity:0}
	60%  {opacity:0}
	75%  {opacity:0}
	100% {opacity:1}
}