/* FONTS */
@font-face {
    font-family: 'proxima_nova_rgregular';
    src: url('fonts/proximanova-regular-webfont.eot');
    src: url('fonts/proximanova-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/proximanova-regular-webfont.woff') format('woff'),
         url('fonts/proximanova-regular-webfont.ttf') format('truetype'),
         url('fonts/proximanova-regular-webfont.svg#proxima_nova_rgregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'proxima_nova_rgbold';
    src: url('fonts/proximanova-bold-webfont.eot');
    src: url('fonts/proximanova-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/proximanova-bold-webfont.woff') format('woff'),
         url('fonts/proximanova-bold-webfont.ttf') format('truetype'),
         url('fonts/proximanova-bold-webfont.svg#proxima_nova_rgbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

html {
height: 100%;
-webkit-text-size-adjust: none;
}
body {
font-size:12px;
background:#fff;
overflow-x:hidden;
height: 100%;
}
body.n2 {
overflow:hidden;
}
body.touch {
width:100%;
overflow:hidden !important;
}
body.n2 #main {
/*width: 100%;
position: fixed;
height: 100%;*/
}



body.n2,
body.n2 #menu .inner,
body.n2 #top-margin,
body.n2 #bottom-margin {
	background:#1f1f1f;
}

body.n2 #menu #call-more,
body.n2 #menu .inner h1 {
	border-top: 1px solid #333;
}
body.n2 #menu {
	border-right: 1px solid #333;
}
body.n2 #menu #logo {
	background-position:center -162px;
}

body.touch #main {
margin-right:6px !important;
overflow:hidden !important;
}

@media screen and (min-width: 700px) {
	::-webkit-scrollbar {
		width: 6px;
		height: 6px;
	}
	::-webkit-scrollbar-track-piece {
		background:#FFF;
	}
	::-webkit-scrollbar-thumb {
		background: #CCC;
	}
	::-webkit-scrollbar-thumb:hover {
		background: #AAA;
	}
	
	body.n2 ::-webkit-scrollbar-track-piece {
		background:#1f1f1f;
	}
	body.n2 ::-webkit-scrollbar-thumb {
		background: #666;
	}
	body.n2 ::-webkit-scrollbar-thumb:hover {
		background: #555;
	}
}

a { outline:none; }
.clear { clear:both; }
a img { display:block; border:none; }

#awwwards {
	position:absolute;
	top:40px;
	z-index:9999;
	left:0;
}
#awwwards a {
	display:block;
	width:70px;
	height:105px;
	text-indent:-8000px;
	background-repeat:no-repeat;
	background-position: 0 0;
	overflow:hidden;
}
#awwwards.left.white a {
	background-image:url('../images/awwwards.png');
}

#main_loading {
	position:fixed;
	z-index:999;
	top:0;
	left:0;
	opacity:1;
	width:100%;
	height:100%;
	background:#FFF url(../images/loading-b.gif) center center no-repeat;
	-webkit-transition-duration: 1s;-moz-transition-duration: 1s;-o-transition-duration: 1s;transition-duration: 1s;
	-webkit-transition-property: opacity;-moz-transition-property: opacity;-o-transition-property: opacity;transition-property: opacity;
}
#main_loading.close {
	opacity:0;
	background-image:none;
}

#menu {
	position:fixed;
	z-index:990;
	left:100%;
	margin-left:-127px;
	width:127px;
	height:100%;
	-webkit-transition-duration: 1s;-moz-transition-duration: 1s;-o-transition-duration: 1s;transition-duration: 1s;
	-webkit-transition-property: left, width, margin;-moz-transition-property: left, width, margin;-o-transition-property: left, width, margin;transition-property: left, width, margin;
}
#menu.open {
	width:200px;
	margin-left:-200px;
}
#menu.left {
	left:0;
	margin-left:0;
	width:112px;
}
#menu #logo {
	position:fixed;
	z-index:2;
	left:100%;
	background:url(../images/logo.png) center 0 no-repeat;
	width:127px;
	height:54px;
	margin:36px 0 37px -127px;
	-webkit-transition-duration: 1s;-moz-transition-duration: 1s;-o-transition-duration: 1s;transition-duration: 1s;
	-webkit-transition-property: width, left, margin;-moz-transition-property: width, left, margin;-o-transition-property: width, left, margin;transition-property: width, left, margin;
}
#menu.open #logo {
	background-position:center -54px;
}
#menu.left #logo {
	width:112px;
	left:0;
	margin-left:0;
	background-position:center -108px;
}

#menu #call-menu {
	position:fixed;
	z-index:2;
	top:127px;
	left:100%;
	background:url(../images/call-menu.png) center 7px no-repeat;
	width:127px;
	height:66px;
	margin-left:-127px;
	-webkit-transition-duration: 1s;-moz-transition-duration: 1s;-o-transition-duration: 1s;transition-duration: 1s;
	-webkit-transition-property: width, left, margin;-moz-transition-property: width, left, margin;-o-transition-property: width, left, margin;transition-property: width, left, margin;
}
#menu.open #call-menu {
	background:url(../images/close.png) center 5px no-repeat;
}
#menu.left #call-menu {
	width:112px;
	left:0;
	margin-left:0;
	background-image:url(../images/close.png) !important;
	background-position:center 5px !important;
}

#menu #call-more {
	position:fixed;
	z-index:2;
	bottom:0;
	left:100%;
	background:url(../images/plus.png) center center no-repeat;
	width:112px;
	height:112px;
	margin-left:0;
	border-top:1px solid #ccc;
	-webkit-transition-duration: 1s;-moz-transition-duration: 1s;-o-transition-duration: 1s;transition-duration: 1s;
	-webkit-transition-property: left, margin;-moz-transition-property: left, margin;-o-transition-property: left, margin;transition-property: left, margin;
}
#menu.left #call-more {
	display:block;
	width:112px;
	left:0;
	margin-left:0;
}
#menu.left #call-more.open {
	background-image:url(../images/moins.png);
}

#menu .inner {
	display:block;
	position:absolute;
	z-index:1;
	width:200px !important;
	height:100%;
	left:100%;
	background-color:#fff;
	-webkit-transition-duration: 1s;-moz-transition-duration: 1s;-o-transition-duration: 1s;transition-duration: 1s;
	-webkit-transition-property: left, width;-moz-transition-property: left, width;-o-transition-property: left, width;transition-property: left, width;
}
#menu.left .inner {
	background-color:#1f1f1f;
}
#menu.open .inner {
	left:0;
	width:200px !important;
}
#menu.left .inner {
	left:0;
	width:112px !important;
}

#menu.text #call-menu {
	display:none;
}
body.n2 #menu.text .inner h1 {
	border-top:0;
}

#menu .inner h1 {
	margin-top:193px;
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
	height:55px;
	
}
#menu.left .inner h1 {
	border-bottom:0;
}
#menu.left .inner h1 span {
	display:none;
}
#menu .inner h1 span {
	background:url(../images/sebanado.png) center right no-repeat;
	margin-right:30px;
	display:block;
	height:55px;
}
#menu .inner #pages {
	position:absolute;
	bottom:0;
	padding:24px 0 0;
	width:100%;
}
#menu .inner #series {
	padding:24px 0;
}
#menu.left .inner #series {
	display:none;
}
#menu .inner > div > a {
	display:block;
	font-family: 'proxima_nova_rgregular';
	line-height:15px;
	font-size:10px;
	color:#ccc;
	padding-right: 30px;
	text-align: right;
	letter-spacing:1px;
	text-transform:uppercase;
}
#menu .inner #pages > a {
	font-family: 'proxima_nova_rgbold';
}
#menu .inner > div > a:hover, #menu .inner > div > a.active {
	color:#000;
}
#menu.left .inner > div > a, #menu.left .inner > div > .fb {
	display:none;
}

#menu .inner #pages .fb > a {
	position:absolute;
	font-family: 'proxima_nova_rgbold';
	line-height:60px;
	font-size:8px;
	color:#ccc;
	padding-left: 20px;
	text-align: right;
	letter-spacing:1px;
	text-transform:uppercase;
}
#menu .inner #pages .fb > a:hover, #menu .inner #pages .fb > a.active {
	color:#000;
}

#menu .inner #pages .fb {
	margin-top:12px;
	border-top:1px solid #ccc;
	height:66px;
}
#menu .inner #pages .fb iframe {
	padding-left: 78px;
	padding-top: 20px;
}

#main {
	margin-left:6px;
}
body.n2 #main {
	margin-right:6px;
}

#top-margin, #bottom-margin {
	position:fixed;
	height:6px;
	background:#fff;
	z-index:988;
	width:100%;
	left:0;
}
#top-margin {
	top:0;
}
#bottom-margin {
	bottom:0;
	z-index:991;
}
body.n2 #bottom-margin {
	display:none;
}

.page {
	position:relative;
	width:100%;
	background-color: #1f1f1f;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}

.page .inner {
	height:100%;
}
.page .inner .center .center-inner > a {
	display:block;
	padding:50px;
}
.page .inner .center .center-inner > a > h3 {
	color:#fff;
	font-size:18px;
	text-transform: uppercase;
	font-family: 'proxima_nova_rgbold';
	-webkit-font-smoothing: antialiased;
	letter-spacing:5px;
}
.page .inner .center .center-inner > a > h4 {
	color:#fff;
	padding-top:16px;
	font-size:10px;
	text-transform: uppercase;
	font-family: 'proxima_nova_rgbold';
	-webkit-font-smoothing: antialiased;
	letter-spacing:4px;
}

.page .inner .center .center-inner {
	position:absolute;
	top:50%;
	left:50%;
	margin-top:-72px;
	height:144px;
	width:auto;
	text-align:center;
}

.page .inner .center {
	position:absolute;
	z-index:100;
	top:0;
	left:0;
	height:100%;
	width:100%;
	-webkit-transition-duration: 1s;-moz-transition-duration: 1s;-o-transition-duration: 1s;transition-duration: 1s;
	-webkit-transition-property: left;-moz-transition-property: left;-o-transition-property: left;transition-property: left;
}
.page .inner .center.close {
	left:-100%;
}

.page .inner .content {
	overflow:hidden;
	position:absolute;
	z-index:200;
	top:0;
	left:100%;
	height:100%;
	width:100%;
	background:#FFF;
	-webkit-transition-duration: 1s;-moz-transition-duration: 1s;-o-transition-duration: 1s;transition-duration: 1s;
	-webkit-transition-property: left;-moz-transition-property: left;-o-transition-property: left;transition-property: left;
}
.page .inner .content.open {
	left:0%;
}
body.n2 .page .inner .content {
	background:#1F1F1F;
}

.page .inner .content .loading {
	position:absolute;
	top:50%;
	left:50%;
	width:136px;
	height:136px;
	margin:-68px 0 0 -68px;
	display:none;
}
.page .inner .content .loading .spinner {
	position:absolute;
	top:50%;
	left:50%;
	width:24px;
	height:24px;
	margin:-12px 0 0 -12px;
	background:url(../images/loading-w.gif) center center no-repeat;
}

.page .inner .content .view {
	position: relative;
	width:100%;
	height:100%;
	overflow-y:hidden;
	overflow-x:scroll;
	-webkit-overflow-scrolling: touch;
	margin-left:106px;
	background:#1f1f1f;
}
.page .inner .content.open .view {
	background:#1f1f1f url(../images/loading-w.gif) 40px 50px no-repeat;
}
.page .inner .view .serie {
	height:100%;
}
.page .inner .view .serie img {
	margin-top:6px;
	display:block;
	float:left;
}
body.touch .page .inner .view .serie img {
	margin-bottom:6px;
}


.page .inner .view .text {
	display:none !important;
}
#text {
	padding: 5% 5% 0;
	width: 40%;
	background: #1F1F1F;
	position: fixed;
	top: 0;
	left: -50%;
	height: 100%;
	z-index:989;
	-webkit-transition-duration: 1s;-moz-transition-duration: 1s;-o-transition-duration: 1s;transition-duration: 1s;
	-webkit-transition-property: left;-moz-transition-property: left;-o-transition-property: left;transition-property: left;
}
#text.open {
	left: 112px;
	background: #1F1F1F;
}
#text h2 {
	color:#fff;
	font-size:14px;
	text-transform: uppercase;
	font-family: 'proxima_nova_rgbold';
	-webkit-font-smoothing: antialiased;
	letter-spacing:5px;
	margin:0 0 44px 0;
}
#text .t {
	color:#666;
	text-transform: uppercase;
}
#text .t p {
	font-size:10px;
	font-family: 'proxima_nova_rgbold';
	-webkit-font-smoothing: antialiased;
	
	line-height:22px;
	margin-bottom:22px;
}
#text .t a {
	color:#666;
}
#text .t a:hover {
	color:#fff;
}

#text .share {
	margin-top:22px;
	margin-left:-10px;
}
#text .share a {
	display:inline-block;
	width:30px;
	height:20px;
	background-position:center center;
	background-repeat: no-repeat;
}
#text .share a.fb { background-image:url(../images/fb.png); }
#text .share a.tw { background-image:url(../images/tw.png); }


.page.text .center .center-inner {
	height:auto;
}
.page.text .center p {
	font-family: 'proxima_nova_rgbold';
	-webkit-font-smoothing: antialiased;
	letter-spacing:4px;
	font-size:11px;
	color:#666;
	line-height:33px;
	margin:0 0 33px;
}
.page.text .center p strong {
	color:#fff;
	font-weight:normal;
}
.page.text .center p a {
	color:#666;
	text-decoration:underline;
}
.page.text .center p a:hover {
	color:#FFF;
	text-decoration:none;
}



.page.text.home h1 {
	color:#fff;
	font-size:18px;
	text-transform: uppercase;
	font-family: 'proxima_nova_rgbold';
	-webkit-font-smoothing: antialiased;
	letter-spacing:5px;
}
.page.text.home .center p {
	color:#fff;
	padding-top:16px;
	font-size:10px;
	text-transform: uppercase;
	font-family: 'proxima_nova_rgbold';
	-webkit-font-smoothing: antialiased;
	letter-spacing:4px;
}




.serie-mobile img {
	width:100%;
}


@media screen and (max-width: 700px) {
	#menu #logo {
		margin:16px 0 17px -127px;
	}
	#menu #call-menu { top:87px; }
	#menu .inner h1 { margin-top:133px; height:35px; }
	#menu .inner h1 span { height:35px; }
	#menu .inner #series { padding:12px 0; }
	#menu .inner #pages { padding:12px 0; }
	#menu .inner > div > .fb {
		display:none !important;
	}
	
	.page {
		height:auto !important;
		min-height:400px;
	}
	
	.page.text {
		min-height:500px;
	}

	.page.text .center p {
		font-family: 'proxima_nova_rgbold';
		-webkit-font-smoothing: antialiased;
		letter-spacing:2px;
		font-size:10px;
		line-height:15px;
		margin:0 12px 15px 6px;
	}
}

