@charset "UTF-8";
/* Mandarin Island Slideshow CSS Document */

.slideshow_container {
	width: 100%;
	height: 0;
	padding-bottom: 39.5%;
	margin: 0;
	overflow: hidden;
	position: relative;
}


.placeholder {
	width: 100%;
	height: 100%;
	visibility: hidden;
}


.layer_1, .layer_2, .layer_3, .layer_4, .layer_5 {
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		background-repeat: no-repeat;
		z-index: 10;
	}
.layer_1 {
	background-image: url("../images/slideshow/logo.png");
	animation: slide1 30s infinite;
	background-size: contain;
}
.layer_2 {
	background-image: url("../images/slideshow/slide_2.jpg");
	animation: slide2 30s infinite;
	background-size: cover;
}
.layer_3 {
	background-image: url("../images/slideshow/slide_3.jpg");
	animation: slide3 30s infinite;
	background-size: cover;
}
.layer_4 {
	background-image: url("../images/slideshow/slide_4.jpg");
	animation: slide4 30s infinite;
	background-size: cover;
}

.layer_5 {
	background-image: url("../images/slideshow/slide_5.jpg");
	animation: slide5 30s infinite;
	background-size: cover;
}




@keyframes slide1 {
	0% {opacity: 1;}
	20% {opacity: 1;}
	25% {opacity: 0; transform: scale(0)}
	90% {opacity: 0;}
	100% {opacity: 1;}
}

@keyframes slide2 {
	0% {opacity: 0;}
	12% {opacity: 1; left: 0px}
	24% {opacity: 1;}
	25% {opacity: 0; left: 100%}
	100% {opacity: 0; left: 100% }
}

@keyframes slide3 {
	0% {opacity: 0; }
	10% {opacity: 0;}
	25% {opacity: 1;}
	35% {opacity: 1; left: 0%}
	50% {opacity: 0; left: -100%}
	80% {opacity: 0;}
	100% {opacity: 0;}
}

@keyframes slide4 {
	0% {opacity: 0; }
	10% {opacity: 0;}
	35% {opacity: 0;}
	50% {opacity: 1;}
	60% {opacity: 1;}
	75% {opacity: 0;}
	100% {opacity: 0;}
}

@keyframes slide5 {
	0% {opacity: 0; }
	10% {opacity: 0;}
	35% {opacity: 0;}
	50% {opacity: 0;}
	60% {opacity: 0;}
	75% {opacity: 1;}
	90% {opacity: 1;}
	100% {opacity: 0;}
}




