.slideshow,
.slideshow:after {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 0;
}
.slideshow:after {
    content: '';
/*    background: transparent url(../images/pattern.png) repeat top left; */
}
.slideshow li span {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    color: transparent;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: none;
    opacity: 0;
    z-index: 0;
}
.slideshow li div {
    z-index: 1000;
    position: absolute;
    bottom: 30px;
    left: 0px;
    width: 100%;
    text-align: center;
    opacity: 0;
}
.slideshow li div h3 {
    font-family: 'Verdana', 'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif;
    font-size: 180px;
    padding: 0;
    line-height: 180px;
}
/* Animation for the slideshow images */
@keyframes imageAnimation2 { 
	0% {
	    opacity: 0;
	    animation-timing-function: ease-in;
	}
	25% {
	    opacity: 1;
	    transform: scale(1.05);
	    animation-timing-function: ease-out;
	}
	50% {
	    opacity: 1;
	    transform: scale(1.1);
	}
	75% {
	    opacity: 0;
	    transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@keyframes imageAnimation3 { 
	0% {
	    opacity: 0;
	    animation-timing-function: ease-in;
	}
	16% {
	    opacity: 1;
	    transform: scale(1.05);
	    animation-timing-function: ease-out;
	}
	33% {
	    opacity: 1;
	    transform: scale(1.1);
	}
	50% {
	    opacity: 0;
	    transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@keyframes imageAnimation4 { 
	0% {
	    opacity: 0;
	    animation-timing-function: ease-in;
	}
	12% {
	    opacity: 1;
	    transform: scale(1.05);
	    animation-timing-function: ease-out;
	}
	25% {
	    opacity: 1;
	    transform: scale(1.1);
	}
	38% {
	    opacity: 0;
	    transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@keyframes imageAnimation5 { 
	0% {
	    opacity: 0;
	    animation-timing-function: ease-in;
	}
	10% {
	    opacity: 1;
	    transform: scale(1.05);
	    animation-timing-function: ease-out;
	}
	20% {
	    opacity: 1;
	    transform: scale(1.1);
	}
	30% {
	    opacity: 0;
	    transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@keyframes imageAnimation6 { 
	0% {
	    opacity: 0;
	    animation-timing-function: ease-in;
	}
	8% {
	    opacity: 1;
	    transform: scale(1.05);
	    animation-timing-function: ease-out;
	}
	17% {
	    opacity: 1;
	    transform: scale(1.1);
	}
	25% {
	    opacity: 0;
	    transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@keyframes imageAnimation7 { 
	0% {
	    opacity: 0;
	    animation-timing-function: ease-in;
	}
	7% {
	    opacity: 1;
	    transform: scale(1.05);
	    animation-timing-function: ease-out;
	}
	14% {
	    opacity: 1;
	    transform: scale(1.1);
	}
	21% {
	    opacity: 0;
	    transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@keyframes imageAnimation8 { 
	0% {
	    opacity: 0;
	    animation-timing-function: ease-in;
	}
	6% {
	    opacity: 1;
	    transform: scale(1.05);
	    animation-timing-function: ease-out;
	}
	13% {
	    opacity: 1;
	    transform: scale(1.1);
	}
	19% {
	    opacity: 0;
	    transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@keyframes imageAnimation9 { 
	0% {
	    opacity: 0;
	    animation-timing-function: ease-in;
	}
	6% {
	    opacity: 1;
	    transform: scale(1.05);
	    animation-timing-function: ease-out;
	}
	11% {
	    opacity: 1;
	    transform: scale(1.1);
	}
	17% {
	    opacity: 0;
	    transform: scale(1.1);
	}
	100% { opacity: 0 }
}
@keyframes imageAnimation10 { 
	0% {
	    opacity: 0;
	    animation-timing-function: ease-in;
	}
	5% {
	    opacity: 1;
	    transform: scale(1.05);
	    animation-timing-function: ease-out;
	}
	10% {
	    opacity: 1;
	    transform: scale(1.1);
	}
	15% {
	    opacity: 0;
	    transform: scale(1.1);
	}
	100% { opacity: 0 }
}
/* Animation for the title */
@keyframes titleAnimation2 { 
	0% {
	    opacity: 0;
	    transform: translateY(200px);
	}
	25% {
	    opacity: 1;
	    transform: translateY(0px);
	}
	50% {
	    opacity: 1;
	    transform: scale(1);
	}
	63% { opacity: 0 }
	75% {
	    opacity: 0;
	    transform: scale(10);
	}
	100% { opacity: 0 }
}
@keyframes titleAnimation3 { 
	0% {
	    opacity: 0;
	    transform: translateY(200px);
	}
	16% {
	    opacity: 1;
	    transform: translateY(0px);
	}
	33% {
	    opacity: 1;
	    transform: scale(1);
	}
	41% { opacity: 0 }
	50% {
	    opacity: 0;
	    transform: scale(10);
	}
	100% { opacity: 0 }
}
@keyframes titleAnimation4 { 
	0% {
	    opacity: 0;
	    transform: translateY(200px);
	}
	12% {
	    opacity: 1;
	    transform: translateY(0px);
	}
	25% {
	    opacity: 1;
	    transform: scale(1);
	}
	31% { opacity: 0 }
	38% {
	    opacity: 0;
	    transform: scale(10);
	}
	100% { opacity: 0 }
}
@keyframes titleAnimation5 { 
	0% {
	    opacity: 0;
	    transform: translateY(200px);
	}
	10% {
	    opacity: 1;
	    transform: translateY(0px);
	}
	20% {
	    opacity: 1;
	    transform: scale(1);
	}
	25% { opacity: 0 }
	30% {
	    opacity: 0;
	    transform: scale(10);
	}
	100% { opacity: 0 }
}
@keyframes titleAnimation6 { 
	0% {
	    opacity: 0;
	    transform: translateY(200px);
	}
	8% {
	    opacity: 1;
	    transform: translateY(0px);
	}
	17% {
	    opacity: 1;
	    transform: scale(1);
	}
	21% { opacity: 0 }
	25% {
	    opacity: 0;
	    transform: scale(10);
	}
	100% { opacity: 0 }
}
@keyframes titleAnimation7 { 
	0% {
	    opacity: 0;
	    transform: translateY(200px);
	}
	7% {
	    opacity: 1;
	    transform: translateY(0px);
	}
	14% {
	    opacity: 1;
	    transform: scale(1);
	}
	18% { opacity: 0 }
	21% {
	    opacity: 0;
	    transform: scale(10);
	}
	100% { opacity: 0 }
}
@keyframes titleAnimation8 { 
	0% {
	    opacity: 0;
	    transform: translateY(200px);
	}
	6% {
	    opacity: 1;
	    transform: translateY(0px);
	}
	13% {
	    opacity: 1;
	    transform: scale(1);
	}
	16% { opacity: 0 }
	19% {
	    opacity: 0;
	    transform: scale(10);
	}
	100% { opacity: 0 }
}
@keyframes titleAnimation9 { 
	0% {
	    opacity: 0;
	    transform: translateY(200px);
	}
	6% {
	    opacity: 1;
	    transform: translateY(0px);
	}
	11% {
	    opacity: 1;
	    transform: scale(1);
	}
	14% { opacity: 0 }
	17% {
	    opacity: 0;
	    transform: scale(10);
	}
	100% { opacity: 0 }
}
@keyframes titleAnimation10 { 
	0% {
	    opacity: 0;
	    transform: translateY(200px);
	}
	5% {
	    opacity: 1;
	    transform: translateY(0px);
	}
	10% {
	    opacity: 1;
	    transform: scale(1);
	}
	12% { opacity: 0 }
	15% {
	    opacity: 0;
	    transform: scale(10);
	}
	100% { opacity: 0 }
}
/* Show at least something when animations not supported */
.no-cssanimations .slideshow li span{
	opacity: 1;
}
@media screen and (max-width: 1140px) { 
	.slideshow li div h3 { font-size: 100px }
}
@media screen and (max-width: 600px) { 
	.slideshow li div h3 { font-size: 50px }
}
/* selector animations */
@keyframes selectorAnimation2{
	0% { margin-top: 0px; }
	48% { margin-top: 0px; }
	50% { margin-top: 24px; }
	98% { margin-top: 24px; }
	100% { margin-top: 0px; }
}
@keyframes selectorAnimation3{
	0% { margin-top: 0px; }
	31% { margin-top: 0px; }
	33% { margin-top: 24px; }
	64% { margin-top: 24px; }
	66% { margin-top: 48px; }
	98% { margin-top: 48px; }
	100% { margin-top: 0px; }
}
@keyframes selectorAnimation4{ 
	0% { margin-top: 0px; }
	23% { margin-top: 0px;	}
	25% { margin-top: 24px; }
	48% { margin-top: 24px;	}
	50% { margin-top: 48px;	}
	73% { margin-top: 48px; }
	75% { margin-top: 72px; }
	98% { margin-top: 72px; }
	100% { margin-top: 0px; }
}
@keyframes selectorAnimation5{
	0% { margin-top: 0px; }
	18% { margin-top: 0px; }
	20% { margin-top: 24px; }
	38% { margin-top: 24px; }
	40% { margin-top: 48px; }
	58% { margin-top: 48px; }
	60% { margin-top: 72px; }
	78% { margin-top: 72px; }
	80% { margin-top: 96px; }
	98% { margin-top: 96px; }
	100% { margin-top: 0px; }
}
@keyframes selectorAnimation6{
	0% { margin-top: 0px; }
	15% { margin-top: 0px; }
	17% { margin-top: 24px; }
	31% { margin-top: 24px; }
	33% { margin-top: 48px; }
	48% { margin-top: 48px; }
	50% { margin-top: 72px; }
	65% { margin-top: 72px; }
	67% { margin-top: 96px; }
	81% { margin-top: 96px; }
	83% { margin-top: 120px; }
	98% { margin-top: 120px; }
	100% { margin-top: 0px; }
}
@keyframes selectorAnimation7{
	0% { margin-top: 0px; }
	12% { margin-top: 0px; }
	14% { margin-top: 24px; }
	27% { margin-top: 24px; }
	29% { margin-top: 48px; }
	41% { margin-top: 48px; }
	43% { margin-top: 72px; }
	55% { margin-top: 72px; }
	57% { margin-top: 96px; }
	69% { margin-top: 96px; }
	71% { margin-top: 120px; }
	84% { margin-top: 120px; }
	86% { margin-top: 144px; }
	98% { margin-top: 144px; }
	100% { margin-top: 0px; }
}
@keyframes selectorAnimation8{
	0% { margin-top: 0px; }
	10% { margin-top: 0px; }
	12% { margin-top: 24px; }
	23% { margin-top: 24px; }
	25% { margin-top: 48px; }
	36% { margin-top: 48px; }
	38% { margin-top: 72px; }
	48% { margin-top: 72px; }
	50% { margin-top: 96px; }
	61% { margin-top: 96px; }
	63% { margin-top: 120px; }
	73% { margin-top: 120px; }
	75% { margin-top: 144px; }
	86% { margin-top: 144px; }
	88% { margin-top: 168px; }
	98% { margin-top: 168px; }
	100% { margin-top: 0px; }
}
@keyframes selectorAnimation9{
	0% { margin-top: 0px; }
	9% { margin-top: 0px; }
	11% { margin-top: 24px; }
	20% { margin-top: 24px; }
	22% { margin-top: 48px; }
	31% { margin-top: 48px; }
	33% { margin-top: 72px; }
	42% { margin-top: 72px; }
	44% { margin-top: 96px; }
	53% { margin-top: 96px; }
	55% { margin-top: 120px; }
	64% { margin-top: 120px; }
	66% { margin-top: 144px; }
	75% { margin-top: 144px; }
	77% { margin-top: 168px; }
	86% { margin-top: 168px; }
	88% { margin-top: 192px; }
	98% { margin-top: 192px; }
	100% { margin-top: 0px; }
}
@keyframes selectorAnimation10{
	0% { margin-top: 0px; }
	8% { margin-top: 0px; }
	10% { margin-top: 24px; }
	18% { margin-top: 24px; }
	20% { margin-top: 48px; }
	28% { margin-top: 48px; }
	30% { margin-top: 72px; }
	38% { margin-top: 72px; }
	40% { margin-top: 96px; }
	48% { margin-top: 96px; }
	50% { margin-top: 120px; }
	58% { margin-top: 120px; }
	60% { margin-top: 144px; }
	68% { margin-top: 144px; }
	70% { margin-top: 168px; }
	78% { margin-top: 168px; }
	80% { margin-top: 192px; }
	88% { margin-top: 192px; }
	90% { margin-top: 216px; }
	98% { margin-top: 216px; }
	100% { margin-top: 0px; }
}
