.als-image-slider img {
	cursor: pointer;
	display: none;
}
.als-image-slider img.selected {
	display: block;
}

.als-image-slider-img-container {
	position: relative;
}

.als-image-slider-effect-fade img {
	display: block;
	position: absolute;
	transition: opacity .8s cubic-bezier(.55,.08,.06,.97);
	opacity: 0;
	left: 0;
	top: 0;
	z-index: 1;
}
.als-image-slider-effect-fade img.selected {
	position: relative;
	opacity: 1;
	z-index: 2;
	transition-duration: .5s;
}

.als-image-slider .als-slider-line {
	width: 320px;
	margin-top: 20px;
}
.als-image-slider .als-slider-line .als-slider-percent-line {
	visibility: hidden;
}
.als-image-slider .als-slider-line.animated .als-slider-handler {
	transition: left 0.3s cubic-bezier(.55,.08,.06,.97);
}
.als-image-slider .als-slider-line.animated .als-slider-percent-line {
	transition: width 0.3s cubic-bezier(.55,.08,.06,.97);
}

@media (max-width: 400px) {
	.als-image-slider .als-slider-line {
		width: auto;
		display: block;
		margin: 20px 10px 0 10px;
	}
}

.als-image-slider-button .als-slider-line {
	display: none;
}

.als-image-slider-buttons {
	margin-top: 20px;
}

.als-image-slider-buttons a {
	display: inline-block;
	position: relative;
	border: none !important;
	width: 18px;
	height: 18px;
	margin: 0 4px;
	cursor: pointer;
	background: white;
	z-index: 1;
}
.als-image-slider-buttons a:after {
	content: '';
	position: absolute;
	display: block;
	border-radius: 50%;
	border: 1px solid #cdcdcd;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 3;
	transition: all 0.3s cubic-bezier(.55,.08,.06,.97) !important;
}
.als-image-slider-buttons a.selected {
	cursor: default;
}
.als-image-slider-buttons a.selected:after {
	border-color: #fb1414;
}

.als-image-slider-auto-play .als-image-slider-buttons a.selected:after {
	opacity: 0.5;
}


.als-image-button-pie {
	left: 0;
	top: 0;
	bottom: 0;
	right: 50%;
	position: absolute;
	background: white;
	border: 1px solid #fb1414;
	transform-origin: 100% 50%;
}

.als-image-button-spinner {
	border-radius: 12px 0 0 12px;
	z-index: 2;
	border-right: none;
	animation: alsImageSliderRota 10s linear infinite;
}

.als-image-button-mask {
	right: 50%;
	left: -5px;
	top: -5px;
	bottom: -5px;
	position: absolute;
	z-index: 3;
	opacity: 1;
	background: inherit;
	animation: alsImageSliderMask 10s steps(1, end) infinite;
}

.als-image-button-filler {
	border-radius: 0 12px 12px 0;
	z-index: 1;
	border-left: none;
	animation: alsImageSliderFill 10s steps(1, end) infinite;
	left: 50%;
	right: 0;
	opacity: 0;
}

@keyframes alsImageSliderRota {
	0%   { transform: rotate(0deg) }
	100% { transform: rotate(360deg) }
}

@keyframes alsImageSliderFill {
	0%        { opacity: 0; }
	50%, 100% { opacity: 1; }
}

@keyframes alsImageSliderMask {
	0%        { opacity: 1; }
	50%, 100% { opacity: 0; }
}
