body {margin: 0}

.arrow-down {left: 50%; bottom: 0px; position: absolute; z-index: 3; margin: 0px  0px 0px -33px;}



#background {
	height: 100%;
	width: 100%;
	overflow: hidden;
	position: fixed;
	top: 0px;
	left: 0px;
	z-index: -100;
}

#background img {
	max-width: inherit;
}



 /* Basic Style

-----------------------------------------------------------------------------------*/

.st-slider {

	background-color: #1a1a1a;

	position: relative;

	display: block;

	width: 100%;

	height: 100%;

}



.sequence {

	position: relative;

	width: 100%;

	height: 100%;

	overflow: hidden;

}



.sequence > .sequence-canvas {

	height: 100%;

	width: 100%;

}



.sequence > ul {

	list-style-type: none;

	padding: 0;

	margin: 0;

}



.sequence > .sequence-canvas > li {

	z-index: 1;

	width: 100%;

	height: 100%;

	position: absolute;

	top: 0;

	left: 0;

	overflow: hidden;

	-webkit-backface-visibility: hidden;

    -webkit-transform: scale(1);

}



.sequence > .sequence-canvas li > * {

	position: absolute;

}



.sequence .slide-image > img {

	max-width: inherit;

	display: block;

	height: auto;

}


/* Animations

-----------------------------------------------------------------------------------*/

/* image,text animation */

.sequence .animate-in .st-animate,

.sequence .animate-in .slide-image {

    -webkit-transition-duration: 1s;

       -moz-transition-duration: 1s;

			transition-duration: 1s;

}



.sequence .animate-out .st-animate,

.sequence .animate-out .slide-image {

    -webkit-transition-duration: 1s;

       -moz-transition-duration: 1s;

			transition-duration: 1s;

}


/* Slider Image

-----------------------------------------------------------------------------------*/

.sequence .slide-image  {

	opacity: 0;

	backface-visibility: hidden;

	-webkit-backface-visibility: hidden;

	-webkit-transform: scale(1);

}



.sequence .animate-in .slide-image { opacity: 1; }

.sequence .animate-out .slide-image { opacity: 0; }





.sequence .animate-in .slide-image.scale img {

	-webkit-animation: rotateIn 1s ease none;

			animation: rotateIn 1s ease none;

}



@-webkit-keyframes rotateIn {

	0% {

		opacity: 0;

		-webkit-transform: scale(1.24) rotate(5deg);

		transform: scale(1.24) rotate(5deg);

	}



	100% {

		opacity: 1;

		-webkit-transform: scale(1) rotate(0deg);

		transform: scale(1) rotate(0deg);

	}

}



@keyframes rotateIn {

	0% {

		opacity: 0;

		-webkit-transform: scale(1.24) rotate(5deg);

		-ms-transform: scale(1.24) rotate(5deg);

		transform: scale(1.24) rotate(5deg);

	}



	100% {

		opacity: 1;

		-webkit-transform: scale(1) rotate(0deg);

		-ms-transform: scale(1) rotate(0deg);

		transform: scale(1) rotate(0deg);

	}

}