/******************************************************************************\
	SUPPORTED SEQUENCE
\******************************************************************************/
html,
body {
	margin:0; padding:0;
	width:100%; height:100%;
}
body {
	background:#000; color:#eee;
	font:12px/1.5 Arial, Helvetica, sans-serif;
}
img {
	border:none;
}

.sequence {
	position:relative;
	height:100%;
	overflow:hidden;
}
.sequence img,
.sequence canvas {
	position:absolute; top:0; left:0;
	width:100%; height:100%;
}
.sequence-loader {
	position:absolute; top:0; left:0; z-index:20;
	width:100%; height:100%;
	background:#000;
}
.sequence-loader p {
	position:absolute; top:50%; left:0;
	margin:-40px 0 0; padding-top:40px;
	width:100%;
	background:url(http://yslexperience.com/or-rouge/assets/img/loader.gif) no-repeat 50% 0;
	text-align:center;
}
.sequence-loader-progress {
	display:none;
}
.sequence-container {
	position:relative;
}
.sequence-highres,
.sequence-player {
	position:absolute; top:0; left:0;
	width:100%; height:100%;
}
.sequence-highres {
	z-index:2;
}
.sequence-player {
	z-index:1;
}
.sequence-message {
	display:none;
	font-size:14px;
	text-align:center;
}
.sequence-item {
	position:absolute; top:0; left:0; z-index:3;
}
.sequence-scrollbar {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	padding:3px;
	height:20%;
	opacity:0;
	-webkit-transition:0.2s opacity ease-in-out;
	-moz-transition:0.2s opacity ease-in-out;
	transition:0.2s opacity ease-in-out;
}
.sequence-scrolling .sequence-scrollbar {
	opacity:1;
}
.sequence-scrollbar-face {
	border-radius:3px;
	width:6px; height:100%;
	background:rgba(255, 255, 255, 0.5);
}

/******************************************************************************\
	UNSUPPORTED SEQUENCE
\******************************************************************************/
/*html.sequence-unsupported,
.sequence-unsupported body {
	height:auto;
}*/
.sequence-not-supported .sequence {
	display:table;
	width:100%;
}
.sequence-not-supported .sequence-message {
	display:table-cell;
	width:100%; height:100%;
	vertical-align:middle;
}
.sequence-not-supported .sequence-content {
	display:none;
}