html {
	overflow: hidden;
}
body {
	margin: 0;
	background: #fff url(/img/construction/construc2.png) top center no-repeat;
}
#votescontainer {
	position: fixed;
	left: 0;
	top: 0;
	right: 0;
	bottom : 0;
	background: rgba(0,0,0,.9);
	z-index: 999999;
	display: none;
	overflow: hidden;
}
#votes {
	position: absolute;
	left: 0;
	top: 90px;
	padding: 10px;
	border-radius: 10px;
	box-shadow: 0 0 5px #000;
	background: rgba(120,120,120,0.5);
	color: #fff;
	z-index: 99999;
	font-family: Verdana, Geneva, Arial, sans-serif;
	font-size: 14px;
	font-weight: bold;
	cursor: default;
}
.close {
	width: 24px;
	height: 23px;
	background: url(/img/construction/rond_croix_fermer.png) top left no-repeat;
	position: absolute;
	right: -12px;
	top: -12px;
	cursor: pointer;
}
#votes .intro {
	margin-bottom: 5px;
}
.vote {
	font-size: 12px;
	margin-top: 10px;
	opacity: 0.95;
}
.vote .buttons .up, .vote .buttons .down {
	cursor: pointer;
	border: 2px solid #AAA;
	font-family: Impact, Charcoal, sans-serif;
	height: 22px;
	width: 22px;
	border-radius: 11px;
	padding: 0;
	background: url(/img/construction/relief_boutons_vote.png) -1px -1px no-repeat;
	color: #fff;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
	vertical-align: middle;
	position: relative;
}
.vote .buttons span {
	font-family: Impact, Charcoal, sans-serif;
	font-size: 22px;
	width: 18px;
	height: 18px;
	position: absolute;
	line-height: 0;
	top: 9px;
	left: 0;
}
.vote .buttons .down span {
	top: 8px;
}
.vote .buttons .up {
	margin-right: 1px;
	background-color: #55EE55;
}
.vote .buttons.free .up:hover {
	background-color: #CCFFCC;
}
.vote .buttons .up.voted {
	background-color: #00CC00 !important;
}
.vote .buttons .down {
	margin-left: 1px;
	background-color: #FF7777;
}
.vote .buttons.free .down:hover {
	background-color: #FFCCCC;
}
.vote .buttons .down.voted {
	background-color: #FF0000 !important;
}
.vote .userinput .svpcont {
	cursor: pointer;
	height: 20px;
	width: 89px;
	vertical-align: middle;
	padding: 0;
	position: relative;
	display: inline-block;
	border-radius: 8px;
	border: 2px solid #AAA;
	background-color: #fff;
}
.vote .userinput .sendvoteperso {
	color: #fff;
	background: url(/img/construction/bouton_vote_proposition.png);
	height: 20px;
	width: 89px;
	border: none;
	opacity: 1;
	position: absolute;
	top: 0;
	left: 0;
}
.vote .userinput .svpcont span {
	font-size: 10px;
	line-height: 20px;
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	text-align: center;
}
.vote .userinput .svpcont:hover .sendvoteperso {
	opacity: 0.7;
}
.vote input#voteperso {
	font-size: 12px;
	padding: 0;
	padding-left: 2px;
	padding-right: 2px;
	line-height: 16px;
	height: 16px;
	border-radius: 8px;
	outline: none;
	vertical-align: middle;
}
.vote .score {
	font-size: 12px;
	width: 45px;
	display: inline-block;
	text-align: center;
	text-shadow: 0 0 1px white;
	vertical-align: middle;
}
.vote .score.positif {
	color: #00ff00;
}
.vote .score.negatif {
	color: #ff0000;
}
.vote .description {
	font-size: 12px;
	display: inline-block;
	vertical-align: middle;
}
.vote .description .examples {
	font-weight: normal;
	font-size: 9px;
	display: block;
	color: #DDD;
}
.contact {
	position: absolute;
	width: 1000px;
	height: 532px;
	top: 0;
	left: 50%;
	margin-left: -500px;
	z-index: 99;
	background: url(/img/construction/contact.png) top center no-repeat;
}
.notice {
	position: absolute;
	opacity: 0;
	visibility: hidden;
	z-index: 99;
}
#noticemanette {
	background: url(/img/construction/construc2_notice.png) top center no-repeat;
	width: 1000px;
	height: 532px;
	top: 0;
	left: 50%;
	margin-left: -500px;
}
#noticemario {
	position: absolute;
	background: url(/img/construction/construc2_notice_mario.png) no-repeat;
	width: 225px;
	height: 16px;
	bottom: -32px;
	left: 14px;
}
.help, .help div,
.contact,
path,
#progress,
.notice,
#votes,
.about .dropdown, .about div,
button,
.swfcontainer {
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
}
.help {
	position: absolute;
	top: 1px;
	left: 1px;
	z-index: 9999;
	background: #fff url(/img/construction/help.png) top left no-repeat;
	opacity: 0.5;
	border-radius: 11px;
	padding: 3px 3px 3px 26px;
	cursor: default;
	font-family: Verdana, Geneva, Arial, sans-serif;
	font-size: 10px;
	font-weight: bold;
	line-height: 19px;
}
.help:hover {
	opacity: 0.9;
}
.help:hover ~ .notice {
	visibility: visible;
	opacity: 1;
}
.about {
	position: absolute;
	cursor: default;
	right: 5px;
	top: 1px;
	border-radius: 6px;
	opacity: 0.5;
	z-index: 9999;
	line-height: 16px;
	font-family: Verdana, Geneva, Arial, sans-serif;
	font-size: 10px;
	font-weight: bold;
	width: 280px;
	text-align: center;
}
.about .dropdown {
	vertical-align: top;
}
.about div {
	/*-webkit-transition: all 1s;
	-moz-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;*/
	overflow: hidden;
	max-height: 0;
	background: #000;
	box-shadow: 0 0 5px #000;
	border-radius: 5px;
	margin: 6px 0 0 4px;
	padding: 3px;
	padding-bottom: 0;
	opacity: 0;
	color: #fff;
	text-align: justify;
	font-weight: normal;
	font-size: 10px;
}
.about a {
	border: none;
	cursor: pointer;
}
.about a img {
	width: 64px;
	padding: 0 10px 0 10px;
}
.about:hover .dropdown {
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	transform: rotate(90deg);
}
.about:hover div {
	max-height: 350px;
	opacity: 1;
}
a {
	color: #ffffff;
	text-decoration: none;
	border-bottom: 1px dotted #ffffff;
	cursor: default;
}
a.a { color: #ff0000; }
a.b { color: #ffff00; }
a.x { color: #0000ff; }
a.y { color: #00ff00; }
img.main {
	position: absolute;
	top: 0;
	left: 50%;
	margin-left: -500px;
}
path { fill: rgba(0,0,0,0); stroke: transparent; }
path:hover { fill: rgba(255,255,255,0.3); }
#jaune:active { fill: rgba(255,255,0,0.3); }
#vert:active { fill: rgba(0,255,0,0.3); }
#bleu:active  { fill: rgba(0,0,255,0.3); }
#rouge:active { fill: rgba(255,0,0,0.3); }
#start:active { fill: rgba(0,0,0,0.3); }
#select:active { fill: rgba(0,0,0,0.3); }
#right:active { fill: rgba(0,0,0,0.3); }
#top:active { fill: rgba(0,0,0,0.3); }
#left:active { fill: rgba(0,0,0,0.3); }
#bottom:active { fill: rgba(0,0,0,0.3); }
#r:active { fill: rgba(255,255,255,0.51); }
#l:active { fill: rgba(255,255,255,0.51); }
#volume {
	position: absolute;
	top: 5px;
	left: 0;
	width: 100%;
	text-align: center;
	font-family: Impact, Charcoal, sans-serif;
	font-size: 50px;
	font-weight: bold;
	color: #ffffff;
	text-shadow: 0 0 5px black;
	z-index: 99;
	opacity: 0;
}
#progress {
	background: #fff url(/img/construction/construc2_progress.png) top center no-repeat;
	position: absolute;
	top: 0;
	left: 50%;
	margin-left: -60px;
	width: 120px;
	height: 0;
	z-index: 10;
}
audio {
	display: none;
}
.memeanim {
	position: absolute;
	z-index: 1000;
}
.memeanim.size0 {
	-webkit-transform: scale(0.16666);
	-moz-transform: scale(0.16666);
	-o-transform: scale(0.16666);
	transform: scale(0.16666);
}
.memeanim.size0.reverse {
	-webkit-transform: scale(-0.16666, 0.16666) !important;
	-moz-transform: scale(-0.16666, 0.16666) !important;
	-o-transform: scale(-0.16666, 0.16666) !important;
	transform: scale(-0.16666, 0.16666) !important;
}
.memeanim.size1 {
	-webkit-transform: scale(0.33333);
	-moz-transform: scale(0.33333);
	-o-transform: scale(0.33333);
	transform: scale(0.33333);
}
.memeanim.size1.reverse {
	-webkit-transform: scale(-0.33333, 0.33333) !important;
	-moz-transform: scale(-0.33333, 0.33333) !important;
	-o-transform: scale(-0.33333, 0.33333) !important;
	transform: scale(-0.33333, 0.33333) !important;
}
.memeanim.size2 {
	-webkit-transform: scale(0.5);
	-moz-transform: scale(0.5);
	-o-transform: scale(0.5);
	transform: scale(0.5);
}
.memeanim.size2.reverse {
	-webkit-transform: scale(-0.5, 0.5) !important;
	-moz-transform: scale(-0.5, 0.5) !important;
	-o-transform: scale(-0.5, 0.5) !important;
	transform: scale(-0.5, 0.5) !important;
}
.memeanim.size3 {
	-webkit-transform: scale(0.66666);
	-moz-transform: scale(0.66666);
	-o-transform: scale(0.66666);
	transform: scale(0.66666);
}
.memeanim.size3.reverse {
	-webkit-transform: scale(-0.66666, 0.66666) !important;
	-moz-transform: scale(-0.66666, 0.66666) !important;
	-o-transform: scale(-0.66666, 0.66666) !important;
	transform: scale(-0.66666, 0.66666) !important;
}
.memeanim.size4 {
	/* scale 1 */
}
.nyan {
	background: url(/img/construction/nyan.gif) top left no-repeat;
	width: 297px;
	height: 120px;
}
.loituma {
	background: url(/img/construction/poireau.gif) top left no-repeat;
	width: 350px;
	height: 350px;
}
.puddi {
	background: url(/img/construction/puddi.gif) top left no-repeat;
	width: 300px;
	height: 200px;
}
.trololo {
	background: url(/img/construction/dancingtroll.gif) top left no-repeat;
	width: 300px;
	height: 300px;
}
.keyboardcat {
	background: url(/img/construction/piano.gif) top left no-repeat;
	width: 256px;
	height: 256px;
}
.swfcontainer {
	z-index: 99999999999;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0,.9);
	display: none;
	overflow: hidden;
}
.fullswf {
	position: absolute;
	width: 480px;
	height: 360px;
	left: 50%;
	top: 50%;
	margin-left: -240px;
	margin-top: -180px;
}
#svgcons {
	position: absolute;
	top: 0;
	left: 50%;
	margin-left: -500px;
	width: 1000px;
	height: 532px;
	z-index: 999;
}
@-webkit-keyframes notesv { 100% { -webkit-transform: translate(0,70px); } }
@-moz-keyframes notesv { 100% { -moz-transform: translate(0,70px); } }
@-ms-keyframes notesv { 100% { -ms-transform: translate(0,70px); } }
.note1, .note2, .note3, .note4 {
	position: absolute;
	z-index: -1;
}
.note1 {
	background: url(/img/construction/music_note_1.png) no-repeat;
	width: 36px;
	height: 66px;
}
.note2 {
	background: url(/img/construction/music_note_2.png) no-repeat;
	width: 30px;
	height: 78px;
}
.note3 {
	background: url(/img/construction/music_note_3.png) no-repeat;
	width: 24px;
	height: 66px;
}
.note4 {
	background: url(/img/construction/music_note_4.png) no-repeat;
	width: 24px;
	height: 66px;
}
#camera {
	position: absolute;
	bottom: 0;
	left: 0;
}
#movingmario, .montagne1, .montagne2,
.buisson1, .buisson2, .buisson3,
.nuage1, .nuage2, .nuage3,
.tuyeau, .prolongementtuyeau,
.blocpiece, .blocpiecevide, .piece,
.blocrock, .boutbloc,
.basdrapeau, .prolongementdrapeau, .boutdrapeau, .drapeau {
	background: url(/img/construction/mariosprites.gif) no-repeat;
	position: absolute;
}
#movingmario {
	background-position: -48px -548px;
	width: 16px;
	height: 32px;
	bottom: 0;
	left: -16px;
}
#ciel {
	width: 100%;
	height: 200px;
	position: absolute;
	bottom: -200px;
	left: 0;
	background: -moz-linear-gradient(top,  rgba(92,148,252,0) 0%, rgba(92,148,252,1) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(92,148,252,0)), color-stop(100%,rgba(92,148,252,1)));
	background: -webkit-linear-gradient(top,  rgba(92,148,252,0) 0%,rgba(92,148,252,1) 100%);
	background: -o-linear-gradient(top,  rgba(92,148,252,0) 0%,rgba(92,148,252,1) 100%);
	background: -ms-linear-gradient(top,  rgba(92,148,252,0) 0%,rgba(92,148,252,1) 100%);
	background: linear-gradient(top,  rgba(92,148,252,0) 0%,rgba(92,148,252,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#005c94fc', endColorstr='#5c94fc',GradientType=0 );
}
.montagne1 {
	background-position: -48px -176px;
	width: 48px;
	height: 19px;
}
.montagne2 {
	background-position: -99px -160px;
	width: 80px;
	height: 35px;
}
.buisson1 {
	background-position: -51px -253px;
	width: 32px;
	height: 16px;
}
.buisson2 {
	background-position: -151px -253px;
	width: 48px;
	height: 16px;
}
.buisson3 {
	background-position: -85px -253px;
	width: 64px;
	height: 16px;
}
.nuage1 {
	background-position: -162px -198px;
	width: 32px;
	height: 24px;
}
.nuage2 {
	background-position: -46px -198px;
	width: 48px;
	height: 24px;
}
.nuage3 {
	background-position: -96px -198px;
	width: 64px;
	height: 24px;
}
.tuyeau {
	background-position: -614px -46px;
	width: 32px;
	height: 32px;
}
.prolongementtuyeau {
	background-position: -614px -82px;
	width: 32px;
	height: 16px;
}
.blocpiece {
	background-position: -372px -160px;
	width: 16px;
	height: 16px;
}
.blocpiecevide {
	background-position: -373px -65px;
	width: 16px;
	height: 16px;
}
@-webkit-keyframes piece {
	0% { background-position: -448px -145px; }
	25% { background-position: -459px -145px; }
	50% { background-position: -430px -145px; }
	75% { background-position: -438px -145px; }
}
@-moz-keyframes piece {
	0% { background-position: -448px -145px; }
	25% { background-position: -459px -145px; }
	50% { background-position: -430px -145px; }
	75% { background-position: -438px -145px; }
}
@-ms-keyframes piece {
	0% { background-position: -448px -145px; }
	25% { background-position: -459px -145px; }
	50% { background-position: -430px -145px; }
	75% { background-position: -438px -145px; }
}
.piece {
	background-position: -448px -145px;
	width: 8px;
	height: 14px;
	-webkit-animation: piece 0.2s infinite step-start;
	-moz-animation: piece 0.2s infinite step-start;
	-ms-animation: piece 0.2s infinite step-start;
}
.blocrock {
	background-position: -373px -47px;
	width: 16px;
	height: 16px;
}
@-webkit-keyframes boutbloc {
	from { -webkit-transform: rotate(0deg); }
	to { -webkit-transform: rotate(360deg); }}
@-moz-keyframes boutbloc {
	from { -moz-transform: rotate(0deg); }
	to { -moz-transform: rotate(360deg); }}
@-ms-keyframes boutbloc {
	from { -ms-transform: rotate(0deg); }
	to { -ms-transform: rotate(360deg); }}
@-webkit-keyframes boutblocinv {
	from { -webkit-transform: rotate(360deg); }
	to { -webkit-transform: rotate(0deg); }}
@-moz-keyframes boutblocinv {
	from { -moz-transform: rotate(360deg); }
	to { -moz-transform: rotate(0deg); }}
@-ms-keyframes boutblocinv {
	from { -ms-transform: rotate(360deg); }
	to { -ms-transform: rotate(0deg); }}
.boutbloc {
	background-position: -432px -47px;
	width: 8px;
	height: 8px;
	-webkit-animation: boutbloc 1.5s infinite steps(8);
	-moz-animation: boutbloc 1.5s infinite steps(8);
	-ms-animation: boutbloc 1.5s infinite steps(8);
}
.boutbloc.inv {
	-webkit-animation: boutblocinv 1.5s infinite steps(8);
	-moz-animation: boutblocinv 1.5s infinite steps(8);
	-ms-animation: boutblocinv 1.5s infinite steps(8);
}
.basdrapeau {
	background-position: -268px -198px;
	width: 16px;
	height: 16px;
}
.prolongementdrapeau {
	background-position: -268px -182px;
	width: 16px;
	height: 16px;
}
.boutdrapeau {
	background-position: -272px -46px;
	width: 8px;
	height: 8px;
}
.drapeau {
	background-position: -260px -55px;
	width: 16px;
	height: 16px;
}
#trollface {
	background: url(/img/construction/trollface.png) bottom center no-repeat;
	width: 28px;
	height: 41px;
	position: absolute;
	bottom: -41px;
	left: 914px;
}
#problem {
	overflow: hidden;
	position: absolute;
	width: 0;
	left: 950px;
	bottom: 90px;
	white-space: nowrap;
	cursor: default;
}
#montagne1 { bottom: 0; left: -90px; }
#montagne2 { bottom: 0; left: -48px; }
#montagne3 { bottom: 0; left: -90px; }
#montagne4 { bottom: 0; left: -120px; }
#buisson1 { bottom: -16px; left: 184px; }
#buisson2 { bottom: -32px; left: 376px; }
#buisson3 { bottom: -48px; left: 664px; }
#buisson4 { bottom: -16px; left: 952px; }
#nuage1 { bottom: 136px; left: -32px; }
#nuage2 { bottom: 152px; left: -90px; }
#nuage3 { bottom: 156px; left: -64px; }
#nuage4 { bottom: 152px; left: -50px; }
#nuage5 { bottom: 136px; left: -32px; }
#nuage6 { bottom: 152px; left: -32px; }
#tuyeau1 { bottom: -32px; left: 448px; }
#tuyeau2 { bottom: -32px; left: 608px; }
#ptuyeau21 { bottom: -48px; left: 608px; }
#tuyeau3 { bottom: -32px; left: 736px; }
#ptuyeau31 { bottom: -48px; left: 736px; }
#ptuyeau32 { bottom: -64px; left: 736px; }
#tuyeau4 { bottom: -32px; left: 912px; }
#ptuyeau41 { bottom: -48px; left: 912px; }
#ptuyeau42 { bottom: -64px; left: 912px; }
#ptuyeau43 { bottom: -80px; left: 912px; }
#ptuyeau44 { bottom: -96px; left: 912px; }
#bp1 { bottom: -32px; left: 256px; }
#bp2 { bottom: -32px; left: 336px; }
#bp3 { bottom: -32px; left: 368px; }
#bp4 { bottom: -32px; left: 352px; }
#br1 { bottom: 48px; left: -16px;}
#br2 { bottom: 48px; left: -16px; }
#br3 { bottom: 48px; left: -16px; }
#bbd { bottom: -16px; left: 1050px; }
#pd1 { bottom: -24px; left: 1050px; }
#pd2 { bottom: -40px; left: 1050px; }
#pd3 { bottom: -56px; left: 1050px; }
#pd4 { bottom: -72px; left: 1050px; }
#pd5 { bottom: -88px; left: 1050px; }
#pd6 { bottom: -104px; left: 1050px; }
#pd7 { bottom: -120px; left: 1050px; }
#pd8 { bottom: -136px; left: 1050px; }
#pd9 { bottom: -152px; left: 1050px; }
#bd { bottom: -8px; left: 1054px; }
#d { bottom: -16px; left: 1042px; }
.reverse {
	-moz-transform: scaleX(-1);
	image-rendering: -moz-crisp-edges; /*Flou firefox*/
	-o-transform: scaleX(-1);
	-webkit-transform: scaleX(-1);
	transform: scaleX(-1);
	filter: FlipH;
	-ms-filter: "FlipH";
}
