body,
html {
	width: 100%;
	height: 100%;
	overflow:hidden;
}

html {
	font-size: 10px;
}

.page {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	max-width: 640px;
	height: 100%;
	overflow:hidden;
}
.container{
	overflow:hidden;
}
.container,
.slide {
	width: 100%;
	height: 100%;
}

.wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    -ms-transition-property: -ms-transform;
    transition-property: transform;
}
.container-vertical>.wrapper{
	-webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
}
.container-horizontal>.wrapper{
	-webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    -ms-flex-direction: row;
    -webkit-flex-direction: row;
    flex-direction: row;
}
.slide {
	position: relative;
	top: 0;
	left: 0;
	z-index: 10;
	-webkit-flex-shrink: 0;
	-ms-flex: 0 0 auto;
	flex-shrink: 0;
}
.slide,.wrapper{
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	transform-style: preserve-3d;
	  -webkit-transform: translate3d(0,0,0);
    -moz-transform: translate3d(0,0,0);
    -o-transform: translate(0,0);
    -ms-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
.bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.bg img {
	width: 100%;
	height: 100%;
}