#slider {																/* Структура слайдера */
   height: 412px;
   margin: 36px auto 0;
   overflow: visible;
   position: relative;
}
#mask {																	/* Прячем все за пределами слайдера */
   overflow: hidden;
   height: 412px;
}
#slider ul {																/* Список изображений */
   margin: 0;
   padding: 0;
   position: relative;
}
#slider li {
   width: 1139px;  														/* Ширина изображения */
   height: 412px; 														/* Высота изображения */
   position: absolute;													/* Исходное положение  (за пределами слайдера) */
   list-style: none;
}
#slider li.firstanimation {
   animation: cycle 20s linear infinite;
}
#slider li.secondanimation {
   animation: cycletwo 20s linear infinite;
}
#slider li.thirdanimation {
   animation: cyclethree 20s linear infinite;
}
#slider li.fourthanimation {
   animation: cyclefour 20s linear infinite;
}
@keyframes cycle {
   0%  { left: 0px; }
   5%  { left: 0px; }
   20% { left: 0px; opacity:1; z-index:0; }
   25% { left: 1139px; opacity: 0; z-index: 0; }
   26% { left: -1139px; opacity: 0; z-index: -1; }
   95% { left: -1139px; opacity: 0; z-index: 0; }
   100%{ left: 0px; opacity: 1; }
}
@keyframes cycletwo {
   0%  { left: -1139px; opacity: 0; }
   20% { left: -1139px; opacity: 0; }
   25% { left: 0px; opacity: 1; }
   45% { left: 0px; opacity: 1; z-index: 0; }
   50% { left: 1139px; opacity: 0; z-index: 0; }
   51% { left: -1139px; opacity: 0; z-index: -1; }
   100%{ left: -1139px; opacity: 0; z-index: -1; }
}
@keyframes cyclethree {
   0%  { left: -1139px; opacity: 0; }
   45% { left: -1139px; opacity: 0; }
   50% { left: 0px; opacity: 1; }
   70% { left: 0px; opacity: 1; }
   75% { left: 1139px; opacity: 0; z-index: 0; }
   76% { left: -1139px; opacity: 0; z-index: -1; }
   100%{ left: -1139px; opacity: 0; z-index: -1; }
}
@keyframes cyclefour {
   0%  { left: -1139px; opacity: 0; }
   70% { left: -1139px; opacity: 0; }
   75% { left: 0px; opacity: 1; }
   95% { left: 0px; opacity: 1; z-index: 0; }
   100% { left: 1139px; opacity: 0; z-index: 0; }
   101%{ left: -1139px; opacity: 0; z-index: -1; }
}
@keyframes fullexpand {
   0%, 20%, 40%, 60%, 80%, 100%{width: 0%; opacity: 0;}
   4%, 24%, 44%, 64%, 84% {width: 0%; opacity: 0.3;}
   16%, 36%, 56%, 76%, 96% {width: 100%; opacity: 0.7;}
   17%, 37%, 57%, 77%, 97% {width: 100%; opacity: 0.3;}
   18%, 38%, 58%, 78%, 98% {width: 100%; opacity: 0;}
}
#slider .tooltip {
   transition: all 0.5s ease-in-out;
}
#slider:hover li {
	animation-play-state: paused;
}