/*MODULE CSS*/
/* @import "module.css"; */

html {
	height:100%;
}
a{
	outline:none;
}
body {
	background: #e7e2cf;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	min-width:940px;
}
img{
	border: none;
}
#overlay {
	background-position: center center;
	background-repeat: no-repeat;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	pointer-events: none;
}
#wrapper {
	min-height:890px; height:100%;
	overflow:hidden;
	position:relative;
}
body#big-height #wrapper {
	min-height:1055px;
}
#container {
	/* adjust transition duration here 
	-webkit-transition: all 1s ease-out;
	-moz-transition: all 1s ease-out;*/
}

/*CONTROLERS*/
#controlers {
	position:relative;
	z-index:110;
}
#controlers #nav-lng {
	position:absolute; right:20px; top:20px;
	margin:0; padding:0;
	z-index: 10;
}
#controlers #nav-lng li {
	list-style:none;
	float:left;
	color:#7f5134; font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif; font-size:14px; text-transform:uppercase; font-weight:bold; letter-spacing:3px;
	margin:0 0 0 8px;
}
#controlers #nav-lng li a {
	color:#7f5134; text-decoration:none;
}
#controlers #nav-lng li.current a {
	color:#c6776d;
}
#controlers #sound-container {
	position:absolute; top:0; left:-60px;
	background-image:url(../img/sound-control.png); background-repeat:no-repeat; background-position:center top;
	display:block;
	width:269px; height:83px;
	text-decoration:none;
	z-index: 10;
	opacity: 0.99;
	display:none;
}
.no-audio #controlers #sound-container {
	display:none!important;
}
#controlers #download-music {
	display:block;
	width:150px; height:63px;
	
	padding:10px 0 0 143px;
	color:#c4625a; font-size:20px; font-family:'Satisfy', Arial, Helvetica, sans-serif; line-height:18px;
	text-decoration:none;
	font-weight:normal;
}
#controlers #download-music strong {
	color:#4b382d; font-size:20px;
	font-weight:normal;
}
#controlers #sound-container.off {
	background-position:center bottom;
}

#controlers #sound-container #prev-sound, #controlers #sound-container #sound-control, #controlers #sound-container #next-sound {
	width:20px; height:20px; background:url(../img/play-sprite.png) no-repeat;
	background-position:-20px 0;
	position:absolute;
	left:143px; top:38px;
	text-indent:-100000px;
	overflow:hidden;
}
#controlers #sound-container #sound-control {
	left:162px;
	background-position:-20px -40px;
}
#controlers #sound-container.off #sound-control {
	left:162px;
	background-position:-20px -60px;
}
#controlers #sound-container #next-sound {
	left:180px;
	background-position:-20px -20px;
}

#controlers #sound-container #prev-sound:hover {
	background-position:0 0;
}
#controlers #sound-container #sound-control:hover {
	background-position:0 -40px;
}
#controlers #sound-container.off #sound-control:hover {
	background-position:0 -60px;
}
#controlers #sound-container #next-sound:hover {
	background-position:0 -20px;
}

/*HOME*/
#controlers #sound-container #toggle-sound  {
	display:block;
	padding:20px 0 0 143px;
	color:#c4625a; font-size:20px; font-family:'Satisfy', Arial, Helvetica, sans-serif; line-height:18px;
	text-decoration:none;
	font-weight:normal;
	
}

#controlers #sound-container #toggle-sound span {
	display:none;
	
}
#controlers #sound-container.off #toggle-sound span {
	display:block;
}
#controlers #sound-container #toggle-sound strong {
	font-weight:normal;
	display:block
}
#controlers #sound-container.off #toggle-sound strong {
	display:none;
}

.js .home-animation {
	overflow:hidden;
}
.js .home-animation #header, .js .home-animation #footer, .js .home-animation #controlers{
	display:none;
}

.js #video-bg {
	background:#1f130b;
	width:100%; height:150%;
	position:absolute;
	top:0; left:0;
	z-index:900;
	display:none;
	
	-webkit-transition: background 0.1s ease-out;
	-moz-transition: background 0.1s ease-out;
}
.js #video-bg.animation-bg {
	background:#E7E2CF;
}
#spriteintro {
	position:fixed!important;
	position:absolute;
	top:50%; left:50%;
	margin:-60px 0 0 -300px;
	z-index:901;
	display:none;
}
.js #loading {
	z-index:901;
}
.js .spot-animation {
	display:none;
}

#ba-video {
	position: fixed!important;
	position: absolute;
	top:0; left:0;
	z-index:1001;
	width:920px; height:539px;
	top:50%; left:50%;
	margin:-270px 0 0 -460px;
	display:none;
}

.light-version #sprites-container canvas {
	position:absolute;
}
.light-version #sprites-container {
	position:absolute; z-index:5; top:50%; left:50%;
	width:1320px; height:900px;
	margin:-470px 0 0 -660px;
	/* overflow:hidden; */
}

#skip-trailer {
	text-align:center;
	color:#fff;
	font-family: "Satisfy", Arial, sans-serif;
	display:block;
	font-size:14px;
	text-decoration:none;
	padding:5px 0 0 0;
}

.js .scroll-container {
	padding: -20px 0 0 0;
	overflow:hidden ;
}

/*HEADER*/
#header {
	position:absolute; z-index:10; top:0; left:50%;
	width:940px;
	margin:0 0 0 -470px; padding:205px 0 0;
}
#header #logo{
	position:absolute; left:0; top:23px;
	width:100%;
	text-align:left;
	margin:0;
}
#header #movie-release{
	font-family: "Satisfy", Arial, sans-serif; color: rgba(127, 82, 52, 0.6); text-align: center;
	margin:-50px 0 30px 25px; padding: 0;
}
#header #logo a{
	display:block;
	width:503px; height:96px;
	margin:0 auto;
	background:url(../img/logo.gif) center;
	text-indent:-100000px;
}
#header #nav {
	font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif;
	font-size:0; line-height:0;
	text-align:center;
	background: url(../img/nav-border.png) no-repeat;
	padding: 15px 0 15px 0;
}
#header #nav li {
	display:inline;
	font-size:16px; line-height:12px; text-transform:uppercase; font-weight:500; white-space:nowrap;
}
#header #nav li a{
	display:inline-block;
	color:#7f5134; text-decoration:none;
	padding:0 18px 0 24px;
	background:url(../img/menu-separator.png) no-repeat left;
}
#header #nav li.first a{
	padding-left:0;
	background:none;
}
#header #nav li.selected a, #header #nav li a:hover{
	color:#c4625a;
}
.layer {
	padding: 0;
	margin: 0;
	position: absolute;
}
#texture {
	background:url(../img/paper-pattern.png) repeat center;
	position: absolute;
	top: 50%;
	left: 50%;
	height:680px; width:1200px;
	margin:-340px 0 0 -600px;
	pointer-events: none;
}
#animation {
	margin:0;
}
#page {
	opacity:0.99;
}
#stage {
	position:absolute;
	z-index:5;
	top:-40px; left:0;
	width:100%; height:100%;
}
#stage #stage-background {
	position:absolute; z-index:5; top:50%; left:50%;
	width:1320px; height:900px;
	margin:-370px 0 0 -660px;
	overflow:hidden;
}
 #stage #stage-background.maximized-height {
	margin-top:-440px;
}
#cache {
	position:absolute;
	z-index:6;
	top:0; left:0;
	width:100%; height:100%;
	margin:0;
}

/*LOADING*/
#loading {
	position:absolute;
	top:50%; left:50%;
	width:384px; height:336px;
	background:url(../img/loading-bg.gif) no-repeat center;
	margin:-108px 0 0 -192px;
	z-index:100;
	display:none;
}
#loading #loading-animation{
	/*position:absolute;
	top: 47px; left: -6px;
	width:384px; height:336px;
	background:url(../img/loading.gif) no-repeat center;
	margin:0;
	z-index:100;*/
}
#loading span{
	display:block;
	text-align: center;
	color:#7F5134;
	padding:50px 0 0 0;
	font-size:20px;
	font-family:'Satisfy', Arial, Helvetica, sans-serif;
	opacity:0.99;
	font-weight:bold;
}

/*SPRITE*/

#sprites {
	position:absolute;
}
#sprites-container .sprite {
	position:absolute;
	margin-top:120px;
}

/* HOME */
#cta-blog {
	display:block;
	width:200px; height:100px;
	background:url(../img/cta-blog.png) no-repeat;
	background-position: 0 0;
	color:#5f7172; font-size:28px; font-family:'Satisfy', Arial, Helvetica, sans-serif; line-height:22px; text-decoration:none; text-indent:40px;
	position:absolute; top:366px; left:-110px;
	padding:165px 0 0 64px;
	
}
#cta-blog strong {
	font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif; font-size:18px; text-transform:uppercase; text-indent: -55px;
}
#cta-blog:hover{
	transform: translate3d(0,0,0);
	color: #6e4834;
	    -webkit-transform:rotate(-7deg);
		-moz-transform:rotate(-7deg);
		-o-transform:rotate(-7deg);
		-ms-transform:rotate(-7deg);
		-webkit-backface-visibility: hidden;
}
#cta-trailer{
	display:block;
	width:191px; height:143px;
	background:url(../img/cta-trailer.png) no-repeat;
	background-position: 0 0;
	color:#38524d; font-size:28px; font-family:'Satisfy', Arial, Helvetica, sans-serif; line-height:22px; text-decoration:none; text-align:center;
	position:absolute; top:75px; left:-140px;
	padding:195px 47px 0 81px;
}
#cta-trailer strong {
	font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif; font-size:18px; text-transform:uppercase; text-align:center;
}
#cta-trailer:hover{
	background-position: 0 -346px;
	color: #FFF;
}
#cta-social{
	display:block;
	width:160px; height:226px;
	background:url(../img/cta-social.png) no-repeat;
	background-position: 0 0;
	color:#38524d; font-size:27px; font-family:'Satisfy', Arial, Helvetica, sans-serif; line-height:30px; text-decoration:none; text-align:center;
	position:absolute; top:90px; right:-140px;
	padding:152px 107px 0 120px;
}

#cta-social:hover{
	background-position: 0 -394px;
	color: #FFF;
}

#cta-cast{
	display:block;
	width:170; height:231;
	background:url(../img/cta-cast.png) no-repeat;
	background-position: 0 0;
	position:absolute; top:365px; right:-90px;
	padding:152px 140px 170px 130px;
}

/* STORY */

#cta-story {
	display:block;
	width:337px; height:136px;
	background-image:url(../img/read-story.png); background-repeat:no-repeat; background-position:center top;
	color:#d2766f; font-size:28px; font-family:'Satisfy', Arial, Helvetica, sans-serif; line-height:19px; text-decoration:none;
	position:absolute; top:97px; left:-158px;
	padding:112px 0 0 108px;
	
	-webkit-transform:rotate(-6deg);
	-moz-transform:rotate(-6deg);
	-o-transform:rotate(-6deg);
	-ms-transform:rotate(-6deg);
}
.no-audio #cta-story {
	display:none!important;
	position:absolute;
	left:-1000px;
}
#cta-story strong {
	font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif; font-size:26px; text-transform:uppercase; color:#4b382d; font-weight:normal;
}
#cta-story:hover {
	background-position:center center;
}
#cta-story.active {
	background-position:center bottom;
}

#soon {
	text-align:center;
	position:relative; top:275px;
	font-family:'Satisfy', Arial, Helvetica, sans-serif; font-size:96px; color:#533019;
	outline:none;
	overflow: auto;
	z-index:7;
}

#story {
	width:218px; height:340px;
	background:url(../img/story-bg.png) no-repeat;
	position:absolute; top:174px; right:-60px;
	padding:39px 48px 15px 48px;
	
	-webkit-transform:rotate(6deg);
	-moz-transform:rotate(6deg);
	-o-transform:rotate(6deg);
	-ms-transform:rotate(6deg);
}
#inner-story {
	width:220px; height: 318px;
	padding-right: 10px;
	overflow: auto;
	position:relative; z-index:300;
	font-family:'Satisfy', Arial, Helvetica, sans-serif; font-size:16px; color:#533019;
	outline: none;
}
#story #story-shadow {
	display:block;
	position:absolute; top:29px; left:9px; z-index:360;
	background:url(../img/story-shadow.png) no-repeat;
	width:290px; height:33px;
}

/* CHARACTERS */
div.character {
	position:absolute;
}

#dentistcast {
	display:block;
	width:255px; height:360px;
	background:url(../img/macy-scroll.png) no-repeat;
	position:absolute; top:150px; right:-60px;
	padding:10px 20px 10px 20px;
	
}

#inner-dentist {
	width:200px; height: 318px;
	padding: 0px 0px 0px 0px;
	overflow: auto;
	font-family:'Satisfy', Arial, Helvetica, sans-serif; font-size:16px; color:#533019;
	outline: none;
}

div.character-detail{
	width: auto; height: 187px;
	padding-right: 10px; padding-left: 40px;
	margin-left: -40px;
	overflow: scroll;
	outline: none;
}
div.character h2 {
	font-family:'Satisfy', Arial, Helvetica, sans-serif; color:#674128; font-size:48px; font-weight:normal; line-height:45px;
	margin:0;
}
div.character h3 {
	font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif; text-transform:uppercase; color:#b19580; font-size:20px; font-weight:normal;
	margin:0 0 25px 46px;
}
div.character p {
	color:#533019; font-family:'Satisfy', Arial, Helvetica, sans-serif; font-size:20px; line-height:24px;
	margin:0; width: 156px;
}
div#character-celestine {
	top:41px; left:-195px;
	background:url(../img/character-celestine.png) no-repeat;
	width:179px; height:442px;
	padding:70px 90px 0 174px;
}
div#character-celestine h2 {
	margin-left:-7px;
}
div#character-ernest {
	top:35px; left:-210px;
	background:url(../img/character-ernest.png) no-repeat;
	width:178px; height:486px;
	padding:75px 75px 0 245px;
}
div#character-ernest h2 {
	margin-left:-4px;
}
div#character-mouse-chef {
	top:28px; left:-240px;
	background:url(../img/character-mouse-chef.png) no-repeat;
	width:192px; height:440px;
	padding:95px 85px 0 269px;
}
div#character-mouse-chef h2 {
	font-size:30px; line-height:40px;
	margin-left:-27px;
}
div#character-bear-chef {
	top:33px; right:-140px;
	background:url(../img/character-bear-chef.png) no-repeat;
	width:179px; height:420px;
	padding:105px 210px 0 143px;
}
div#character-bear-chef h2 {
	font-size:30px; line-height:40px;
	margin-left:-44px;
}
div#character-bear-chef h3 {
	margin-bottom:16px;
	line-height:18px;
}
div#character-georges {
	top:32px; right:-180px;
	background:url(../img/character-georges.png) no-repeat;
	width:175px; height:453px;
	padding:90px 340px 0 141px;
}
div#character-georges h2 {
	margin-left:-7px; margin-bottom:22px;
}
div#character-georges h3 {
	margin-bottom:0; margin-left:28px;
	line-height:18px;
}
div#character-gray {
	top:28px; left:-193px;
	background:url(../img/character-gray.png) no-repeat;
	width:182px; height:414px;
	padding:95px 80px 0 262px;
}
div#character-gray h2 {
	margin-left:-13px; margin-bottom:22px;
}
div#character-gray h3 {
	margin-bottom:0; margin-left:24px;
	line-height:18px;
	width:220px;
}
div#character-dentist {
	top:40px; left:-237px;
	background:url(../img/character-dentist.png) no-repeat;
	width:183px; height:450px;
	padding:80px 80px 0 286px;
}
div#character-dentist h2 {
	margin-left:0;
}
div#character-dentist h3 {
	margin-left:-2px;
}
ul#characters {
	position:absolute; top:580px; left:50%; z-index:500;
	width:910px; height:104px;
	margin:20px 0 0px -425px; padding:0;
}
ul#characters li.left-title, ul#characters li.right-title {
	float:left;
	font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif; font-size:15px; text-transform:uppercase;
	list-style:none;
	padding:40px 0 0;
}
ul#characters li.left-title {
	color:#bc615b; text-align:right; line-height:16px;
	margin:11px 12px 0 0;
}
ul#characters li.right-title {
	color:#376b7a;
	margin:11px 0 0 12px;
	line-height:16px;
}
ul#characters li.thumb {
	float:left;
	list-style:none;
}
ul#characters li.thumb a {
	display:block;
	position:relative;
	width:90px; height:104px;
	background-repeat:no-repeat; background-position:center bottom;
}
ul#characters li.thumb a.current {
	background-position:center center;
}
ul#characters li.thumb a:hover {
	background-position:center top;
}
ul#characters li.thumb span {
	display:block;
	width:90px;
	text-align:center; color:#7c5230; text-decoration:none; font-family:'Satisfy', Arial, Helvetica, sans-serif; font-size:20px; line-height:16px;
	position:absolute; top:106px;
}
ul#characters li#thumb-ernest a {
	background-image:url(../img/thumb-ernest.png);
}
ul#characters li#thumb-georges a {
	background-image:url(../img/thumb-georges.png);
}
ul#characters li#thumb-bear-chef a {
	background-image:url(../img/thumb-bear-chef.png);
}
ul#characters li#thumb-celestine a {
	background-image:url(../img/thumb-celestine.png);
}
ul#characters li#thumb-dentist a {
	background-image:url(../img/thumb-dentist.png);
}
ul#characters li#thumb-gray a {
	background-image:url(../img/thumb-gray.png);
}
ul#characters li#thumb-mouse-chef a {
	background-image:url(../img/thumb-mouse-chef.png);
}

/* BACKSTAGE */
#cta-partners {
	display:block;
	width:182px; height:158px;
	background-image:url(../img/cta-partners.png); background-repeat:no-repeat; background-position:center top;
	color:#448395; font-size:28px; font-family:'Satisfy', Arial, Helvetica, sans-serif; line-height:24px; text-decoration:none; text-align:center; 
	position:absolute; top:234px; right:-20px;
	padding:164px 30px 0 106px;
}
#cta-partners strong {
	font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif; font-size:24px; text-transform:uppercase; color:#4b382d; font-weight:normal;
}
#cta-partners span{
	visibility: hidden;
}
#cta-partners:hover{
	background-position: center -322px;
}
#cta-partners:hover span{
	visibility: visible;
}
#cta-makingof {
	display:block;
	width:165px; height:93px;
	background-image:url(../img/cta-makingof.png); background-repeat:no-repeat; background-position:center top;
	color:#8e765f; font-size:28px; font-family:'Satisfy', Arial, Helvetica, sans-serif; line-height:35px; text-decoration:none; text-align:center;
	position:absolute; top:450px; right:323px;
	padding:133px 75px 0 93px;
}
#cta-makingof strong {
	font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif; font-size:24px; text-transform:uppercase; color:#4b382d; font-weight:normal;
}
#cta-makingof span{
	visibility: hidden;
}
#cta-makingof:hover{
	background-position: center -226px;
}
#cta-makingof:hover span{
	visibility: visible;
}
#cta-team {
	display:block;
	width:248px; height:113px;
	background-image:url(../img/cta-team.png); background-repeat:no-repeat; background-position:left top;
	color:#954b88; font-size:28px; font-family:'Satisfy', Arial, Helvetica, sans-serif; line-height:35px; text-decoration:none; text-align:left;
	position:absolute; top:250px; left:-140px;
	padding:112px 55px 0 85px;
}
#cta-team strong {
	font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif; font-size:24px; text-transform:uppercase; color:#4b382d; font-weight:normal;
}
#cta-team span{
	visibility: hidden;
}
#cta-team:hover{
	background-position: left -224px;
}
#cta-team:hover span{
	visibility: visible;
}
#makingof, #recreation {
	width:922px; height:565px;
	position:absolute;
	left:50%; top:40px;
	margin:0 0 0 -461px;
	display:visible;
	opacity: 0;
	display: none;
}
#recreation{
	display: block;
	opacity: 1;
	top:20px;
}
#makingof-close, #recreation-close {
	display:block;
	width:141px; height:96px;
	position:absolute; top:-43px; right:-66px;
	background:url(../img/makingof-close.png) no-repeat;
	padding:85px 0 0 90px;
	font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif; color:#c4625a; font-size:19px; text-decoration:none; text-transform:uppercase;
	z-index: 100;
}
#makingof-left, #makingof-right, #recreation-left, #recreation-right {
	display:block;
	width:62px; height:66px;
	position:absolute; top:256px;
	text-indent:-10000px;
	background-position: left top;
	z-index: 100;
}
#makingof-left, #recreation-left {
	background:url(../img/left-sprite.png) no-repeat;
	left:-19px;
}
#makingof-right, #recreation-right {
	background:url(../img/right-sprite.png) no-repeat;
	right:-19px;
}
#makingof-left:hover, #recreation-left:hover, #makingof-right:hover, #recreation-right:hover{
	background-position: left -66px;
}
#makingof .zoom{
	position: absolute;
	display: inline-block;
	width: 922px;
	height: 565px;
	
	-webkit-mask-image: url(../img/makingof/makingof-overlay.png);
	-moz-mask-image: url(../img/makingof/makingof-overlay.png);
	-o-mask-image: url(../img/makingof/makingof-overlay.png);
	mask-image: url(../img/makingof/makingof-overlay.png);
	
	-webkit-mask-position: center -230px;
	-moz-mask-position: center -230px;
	-o-mask-position: center -230px;
	mask-position: center -230px;
}
#makingof-img:hover, #recreation-img:hover{
	opacity: 0;
	cursor: url(../img/loupe.png),auto;
}
#makingof .zoom .zoomImg{
	cursor: url(../img/loupe.png),auto;
}
#makingof .zoom .zoomed{
	cursor: url(../img/loupe2.png),auto;
}
#recreation-img:hover{
	opacity: 1;
	cursor: auto;
}
#recreation .card-action{
	width: 100px;
	position: absolute; left: 30px; top: 40px;
	border: none; border-radius: 4px; color: #FFF; font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif; font-size: 12px; 	text-transform: uppercase; text-decoration: none; text-align: center;
	padding: 10px 20px;
	margin: 0;
	background: #c4625a; 
	box-shadow: 0 3px rgba(196, 98, 90, 0.5);
	cursor: pointer;
}
#recreation .card-action:hover{
	background: #a34f48;
}
#recreation .card-action:active{
	box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.2);
}
#recreation .card-action#print{
	top:85px;
}

#makingof-pagination, #recreation-pagination{
	position: relative;
	width: 922px;
	height: 86px;
	margin-top: 15px;
}
#makingof-thumbnails, #recreation-thumbnails{
	overflow: hidden;
	width: 885px;
	height: 86px;
	margin: 0 0 0 18px;
}
#makingof-thumbnails ul, #recreation-thumbnails ul{
	width: 405%; height: 86px;
	padding: 0; margin: 0;
	list-style: none;
}
#recreation-thumbnails ul{
	width: 151%;
}
#makingof-thumbnails ul li, #recreation-thumbnails ul li{
	float: left;
	background: #6e4834;
	width: 104px; height: 86px;
	margin-right: 8px;
	cursor: pointer;
}
#makingof-thumbnails ul li img, #recreation-thumbnails ul li img{
	height:100%; width: 100%;
	opacity: 1;
	cursor: pointer;
}
#makingof-pagination ul li:last-child, #recreation-thumbnails ul li:last-child{
	margin-right: 0;
}
#makingof-left-2, #makingof-right-2, #recreation-left-2, #recreation-right-2{
	display: block;
	width: 36px;
	height: 38px;
	position: absolute; top: 22px;
	z-index: 100;
	text-indent: -10000px;
}
#makingof-left-2, #recreation-left-2{
	background: url(../img/makingof-left-2.png) no-repeat;
	background-position: center top;
	left: 0px;
}
#makingof-right-2, #recreation-right-2{
	background: url(../img/makingof-right-2.png) no-repeat;
	background-position: center top;
	right: 0px;
}
#makingof-left-2:hover, #makingof-right-2:hover, #recreation-left-2:hover, #recreation-right-2:hover{
	background-position: center -38px;
}
#team, #partners{
	width:990px;
	position:absolute; top:120px; left:50%; z-index: 35;
	margin:0 0 0 -495px;
}
#partners{
	margin-left: -385px;
}
.staff .rope, .partner .rope {
	display:block;
	width:100%; height:0px;
	font-size:0;
	position:absolute; left:0; top:0; z-index:400;
}
.staff, .partner {
	position:absolute; top:0;
	text-align:center;
}
.staff img, .partner img {
	position:relative; z-index:410;
}
.staff a, .partner a {
	color:#674128; font-size:21px; font-family:'Satisfy', Arial, Helvetica, sans-serif; line-height:20px; text-decoration:none;
}
.staff a strong, .partner a strong {
	display:block;
	font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif; color:#c16159; font-size:14px; text-transform:uppercase; font-weight:normal; line-height:14px;
	margin:8px 0 0;
}
.staff span, .partner span {
	display:block;
	position:absolute;
}
#staff1 .rope, #partner1 .rope {
	background:url(../img/staff-rope1.png) no-repeat center top;
	height: 10px;
}
#staff2 .rope, #partner2 .rope {
	background:url(../img/staff-rope2.png) no-repeat center top;
	height:10px;
}
#staff3 .rope, #partner3 .rope {
	background:url(../img/staff-rope3.png) no-repeat center top;
	height:10px;
}
#staff4 .rope, #partner4 .rope {
	background:url(../img/staff-rope4.png) no-repeat center top;
	height:10px;
}
#staff5 .rope {
	background:url(../img/staff-rope2.png) no-repeat center top;
	height:10px;
}
#staff1 img, #partner1 img {
	-webkit-transform:rotate(4deg);
	-moz-transform:rotate(4deg);
	-o-transform:rotate(4deg);
	-ms-transform:rotate(4deg);
}
#staff2 img, #partner2 img {
	-webkit-transform:rotate(-1deg);
	-moz-transform:rotate(-1deg);
	-o-transform:rotate(-1deg);
	-ms-transform:rotate(-1deg);
}
#staff3 img, #partner3 img {
	-webkit-transform:rotate(2deg);
	-moz-transform:rotate(2deg);
	-o-transform:rotate(2deg);
	-ms-transform:rotate(2deg);
}
#staff4 img, #partner4 img {
	-webkit-transform:rotate(-2.5deg);
	-moz-transform:rotate(-2.5deg);
	-o-transform:rotate(-2.5deg);
	-ms-transform:rotate(-2.5deg);
}
#staff5 img {
	-webkit-transform:rotate(4deg);
	-moz-transform:rotate(4deg);
	-o-transform:rotate(4deg);
	-ms-transform:rotate(4deg);
}
#staff1 a span, #partner1 a span {
	width:158px; height:99px;
	background:url(../img/staff1-bg.png) no-repeat;
	top:257px; left:-47px;
	padding:83px 16px 0 36px;
	opacity: 0; display: none;
	filter:none!important;
}
#staff2 a span, #partner2 a span {
	width:157px; height:112px;
	background:url(../img/staff2-bg.png) no-repeat;
	top:263px; left:-25px;
	padding:97px 0 0 25px;
	opacity: 0; display: none;
	filter:none!important;
}
#staff3 a span, #partner3 a span {
	width:130px; height:113px;
	background:url(../img/staff3-bg.png) no-repeat;
	top:262px; left:-21px;
	padding:97px 20px 0 33px;
	opacity: 0; display: none;
	filter:none!important;
}
#staff4 a span, #partner4 a span {
	width:157px; height:113px;
	background:url(../img/staff4-bg.png) no-repeat;
	top:262px; left:-22px;
	padding:97px 0 0 25px;
	opacity: 0; display: none;
	filter:none!important;
}
#staff5 a span {
	width:152px; height:119px;
	top:-20px; left:-5px;
	padding:91px 0 0 30px;
	opacity: 0; display: none;
	z-index: 600;
	color: #FFF;
	
	-webkit-transform:rotate(8deg);
	-moz-transform:rotate(8deg);
	-o-transform:rotate(8deg);
	-ms-transform:rotate(8deg);
}
#staff1, #partner1 {
	left:0;
	padding-top:0px;
	width:152px;
	opacity: 0;
}
#staff1 .team-detail-overlay, #partner1 .partner-detail-overlay{
	left: -100px;
}
#staff2, #partner2 {
	left:200px;
	padding-top:0px;
	width:164px;
	opacity: 0;
}
#staff2 .team-detail-overlay, #partner2 .partner-detail-overlay{
	left: -300px;
}
#staff3, #partner3{
	left:400px;
	padding-top:0px;
	width:164px;
	opacity: 0;
}
#staff3 .team-detail-overlay, #partner3 .partner-detail-overlay{
	left: -500px;
}
#staff4, #partner4{
	left:600px;
	padding-top:0px;
	width:135px;
	opacity: 0;
}
#staff4 .team-detail-overlay, #partner4 .partner-detail-overlay{
	left: -700px;
}
#staff5 {
	left:800px;
	padding-top:0px;
	width:193px;
	opacity: 0;
}
#staff5 .team-detail-overlay{
	left: -900px;
}
#team-overlay, #partner-overlay, #rules-overlay  {
	background-color:rgba(231,226,206, 0.7);
	position:absolute; top:-20px; left:-100px;z-index: 30;
	width:1150px; height:1000px;
	opacity: 0; filter:alpha(opacity=50); display: none;
}
#team-close, #partner-close, .detail-close {
	display:inline-block;
	position:absolute; top:44px; right:4px; z-index:420;
	color:#c4625a; font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif; font-size:19px; text-decoration:none; text-transform:uppercase; line-height:19px;
	background:url(../img/team-close.png) no-repeat left center;
	padding:0 0 0 22px;
}
#partner-close{
	right: 114px;
}
.team-detail-overlay, .partner-detail-overlay{
	background-color:rgba(231,226,206, 0.7);
	position:absolute; top:-50px;z-index: 700;
	width:1500px; height:1500px;
	opacity: 0; filter:alpha(opacity=50); display: none;
}
.partner-detail-overlay{
	margin-left: -110px;
}
.team-detail-overlay h2, .partner-detail-overlay h2{
	width: 668px; height: 368px;
	position: absolute; top: 0; left: 75px;
	background: url(../img/detail-title-bg.png) no-repeat center top;
	font-family: "Satisfy", Helvetica, Arial, sans-serif; text-align: left;line-height: 50px;
	color: #674128; font-size: 36px;
	z-index: 0;
	zoom:1;
	filter:0;
}
.team-detail-overlay h2 span, .partner-detail-overlay h2 span{
	margin: 100px 0 0 140px;
	z-index: 20;
}
.team-detail-overlay h2 span strong, .partner-detail-overlay h2 span strong{	
	display: block;
	font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif; color:#c16159; font-size:23px; text-transform:uppercase; font-weight:normal; line-height:22px;
}
.team-detail-overlay img, .partner-detail-overlay img{
	position: absolute; top: 230px; left: 320px;
	z-index: 20;
}
.team-detail-overlay .detail, .partner-detail-overlay .detail{
	position: absolute; top: 100px; left: 420px;
	width: 471px; height: 431px;
	background: url(../img/detail-parchemin.png) no-repeat;
	z-index: 10;
}
.team-detail-overlay .detail-shadow, .partner-detail-overlay .detail-shadow{
	position: absolute; left: 50px; top: 30px;
	width: 301px; height: 47px;
	background: url(../img/detail-shadow.png) no-repeat;
}
.team-detail-overlay .inner-detail, .partner-detail-overlay .inner-detail{
	position: relative;
	width: 300px; height: 312px;
	margin: 57px 0 0 80px; padding-right: 10px;
	overflow: auto;
	text-align: left; font-family: "Satisfy", Helvetica, Arial, sans-serif; color: #674128;
	outline: none;
	
	-webkit-transform:rotate(5.5deg);
	-moz-transform:rotate(5.5deg);
	-o-transform:rotate(5.5deg);
	-ms-transform:rotate(5.5deg);
}
.team-detail-overlay .detail-close, .partner-detail-overlay .detail-close{
	position:absolute; top:94px; right:418px; z-index:420;
	color:#c4625a; font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif; font-size:19px; text-decoration:none; text-transform:uppercase; line-height:19px;
}
#generique-overlay{
	background-color:rgba(231,226,206, 1);
}
#generique-overlay .detail-close{
	top: 60px;
}
#generique{
	position: absolute; top: 0px; left:200px;
	width: 749px; height: 673px;
	background: url(../img/generique-bg.png) no-repeat;
	z-index: 10;
}
#inner-generique{
	width: 460px; height: 635px;
	overflow: auto;
	margin: 10px 0 0 180px; padding-top: 20px; padding-right: 30px;
	z-index: 20;
	color: #674128;
	font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif;
	outline: none;
}
#inner-generique h2{
	width: 200px; height: auto;
	position: relative;
	background: none;
	color:#c4625a; font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif; font-size:25px; text-align: center;
	margin-left: 50px;
}

/*CARTE MAGIQUE*/
#carte-magic{
	width: 1134px; margin-top: 57px;
	background: url(../img/bg-carte-magique.png) no-repeat;
	background-position: -30px center;
}
#carte-magic img{
	margin-left: 125px;
}
#carte-magic a{
	display: block;
	width: 940px;
	margin-top: 30px;
	font-family: "Satisfy", Helvetica, Arial, sans-serif; font-size: 21px; color: #c4625a;
	text-align: center; text-decoration: none;
}
#carte-magic a:hover{
	color: #8d413b;
}
#carte-module{
	position: absolute; top: 142px; left: 167px;
	width: 623px; height: 455px;
	background: #000;
}
#rules-overlay{
	opacity: 1; display: block;
}
#rules{
	width: 508px; height: 469px;
	background: url(../img/bg-carte-magique-rules.png) no-repeat;
	background-position: center 0px;
	margin: 137px auto; padding-left:220px; padding-top: 100px;
	text-align: center;
}
#rules h2{
	width: 300px;
	font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif; color: #755741; font-size: 21px; font-weight: 100; line-height: 21px; text-transform: uppercase;
	margin-top: -5px;
}
#rules p{
	width: 300px;
	color: #b29782; font-family: "Satisfy", Helvetica, Arial, sans-serif; font-size: 16px;
}
#rules a{
	display: inline;
	font-family: "Satisfy", Helvetica, Arial, sans-serif; font-size: 16px;
	width: auto;
	margin: 0;
}
#rules p strong{
	color: #c4625a;
}
#rules input{
	margin-left:-210px; padding: 8px 22px;
	border: none;
	border-radius: 4px;
	background: #c4625a; color: #FFF;
	box-shadow: 0 3px rgba(196, 98, 90, 0.5);
	cursor: pointer;
	text-transform: uppercase;
}
#rules input:hover{
	background: #a34f48;
}
#rules input:active{
	box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.2);
}
#carte-magic #rules-close{
	display:inline-block;
	position:absolute; top:137px; left: 750px; z-index:420;
	color:#c4625a; font-family:"adobe-garamond-pro", Georgia, Arial, Helvetica, sans-serif; font-size:19px; text-decoration:none; text-transform:uppercase; line-height:19px; text-align: left;
	background:url(../img/team-close.png) no-repeat left center;
	padding:0 0 0 22px;
}

/*CONTENT*/

#content {
	width:960px; height:580px;
	position:absolute;
	left:50%; top:50%;
	margin:-290px 0 0 -480px;
	z-index:30;
}

/*CALL TO ACTIONS*/

#btn-book {
	background:url(../img/btn-book.png) no-repeat;
	width:454px; height:239px;
	display:block;
}

/*FOOTER*/

#footer {
	position: absolute;
	width:100%; height:120px;
	bottom: 0; left: 0;
	z-index:30;
}
div#inner-footer {
	/*width:935px;*/
	width:100%;
	background:url(../img/footer-bg-2.png) repeat-x center center;
	margin:-30px auto;
	font-family:'Satisfy', Arial, Helvetica, sans-serif; font-size:17px; line-height:60px;
	color: #7f5234;
}
div#inner-footer img {
	vertical-align:middle;
	margin-bottom:8px;
}
div#inner-footer span {
	text-indent:-10000px;
	display:inline-block;
	background:url(../img/footer-separator.png) no-repeat center center;
	width:12px; height:48px;
	margin:0 4px;
}
div#inner-footer a {
	color:#7f5234; text-decoration:none;
}
div#inner-footer a#dogstudio {
	float:right;
	background:url(../img/dogstudio.png) no-repeat center center;
	width:79px; height:18px;
	text-indent:-10000px;
	margin:18px 20px 0 0;
}
div#inner-footer div.find {
  margin-left:20px;
}

div#partenaires{
	width: 100%;
	padding-left:20px;
	padding-right:20px;
	height: 80px;
	padding-top: 19px;
}
div#partenaires .logos{
	margin-right:20px;
	width:auto;
}
div#partenaires ul{
	/*width: 935px;*/
	width:100%;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}
div#partenaires ul li{
	float: right;
	margin-right: 10px;
	font-family:"Satisfy", Arial, sans-serif; color:#bc615b;
}
div#partenaires ul li:first-child{
	float: left;
	margin-top: 5px;
}
div#partenaires ul li:nth-child(2){
	margin-top: 8px;
	margin-right: 0;
}
div#partenaires ul li:nth-child(3){
	margin-top: 7px;
}
div#partenaires ul li:nth-child(5){
	margin-top: 3px;
}
div#partenaires ul li:nth-child(6){
	margin-top: 4px;
}
div#partenaires ul li a{
	color:#bc615b; text-decoration:none;
}
div#partenaires ul li a:hover{
	color: #944c47;
}

/*CALL TO ACTIONS*/

.spot-animation {
	position:absolute;
}
.full-animation .spot-animation.scale-animation {
	animation: spotanimation 600ms ease-in-out;
	-moz-animation: spotanimation 600ms ease-in-out; /* Firefox */
	-webkit-animation: spotanimation 600ms ease-in-out; /* Safari and Chrome */
	-o-animation: spotanimation 600ms ease-in-out; /* Opera */
}
#header {
	padding-top:160px;
}
#header #logo {
	display:block;
	width:100%; height:82px;
	top:33px;
}
#header #logo a{
	display:block;
	background:url(../img/logo-small.gif) center;
	width:383px; height:72px;
}
@media screen and (max-width: 1024px) {
	#header #nav li:nth-child(4) a {
		width: 120px;
		padding: 0 15px 0 24px;
	}
	#cta-story {
		left:-94px;
	}
	#story {
		right:7px;
	}
	#characters .thumb a{
		text-decoration: none;
	}
	div#character-ernest {
		left:-11px;
	}
	div#character-georges {
		right:-6px;
	}
	div#character-bear-chef {
		right:-11px;
	}
	div#character-celestine {
		left:-8px;
	}
	div#character-dentist {
		left:-109px;
	}
	div#character-gray {
		left:-9px;
	}
	div#character-mouse-chef {
		left:-39px;
	}
	#cta-trailer {
		left:-84px;
	}
	#cta-blog {
		left:698px;
	}
	#cta-team{
		left: -70px;
	}
	#makingof-thumbnails, #recreation-thumbnails{
		overflow-x: scroll;
		overflow-y: hidden;
	}
	#team-close{
		right: 20px;
	}
	#partner-close{
		right: 130px;
	}
	#staff1{
		left: 20px;
	}
	#staff5{
		left: 775px;
	}
}

/*SCENE REPLACE*/

.light-version .scene-home {
	background:url(../img/replaces/home_replace.jpg) no-repeat center;
	background-position:center center;
}

.light-version .scene-story {
	background:url(../img/replaces/story_replace.jpg) no-repeat center;
	background-position:center center;
}

.light-version .scene-characters, .light-version .scene-ernest {
	background:url(../img/replaces/ernest_replace.jpg) no-repeat center;
	background-position: center center;
}

.light-version .scene-georges {
	background:url(../img/replaces/georges_replace.jpg) no-repeat center;
	background-position:center center;
}

.light-version .scene-bear {
	background:url(../img/replaces/ours_replace.jpg) no-repeat center;
	background-position:center center;
}

.light-version .scene-celestine {
	background:url(../img/replaces/celestine_replace.jpg) no-repeat center;
	background-position:center center;
}

.light-version .scene-clinique {
	background:url(../img/replaces/clinique_replace.jpg) no-repeat center;
	background-position: center center;
}

.light-version .scene-gray {
	background:url(../img/replaces/grise_replace.jpg) no-repeat center;
	background-position:center center;
}

.light-version .scene-mouse {
	background:url(../img/replaces/souris_replace.jpg) no-repeat center;
	background-position: center center;
}

.light-version .scene-backstage{
	background:url(../img/replaces/backstage_replace.jpg) no-repeat center;
	background-position: center center;
}

keyframes spotanimation
{
	from {transform:scale(0.8);}
	to {transform:scale(1);}
}

@-moz-keyframes spotanimation /* Firefox */
{
	from {-moz-transform:scale(0.8);}
	to {-moz-transform:scale(1);}
}

@-webkit-keyframes spotanimation /* Safari and Chrome */
{
	from {-webkit-transform:scale(0);}
	to {-webkit-transform:scale(1);}
}

@-o-keyframes spotanimation /* Opera */
{
	from {-o-transform:scale(0.8);}
	to {-o-transform:scale(1);}
}