/* styles de l'interface de jeu uniquement */
@font-face { font-family: jawa-times;	src: url("./pics/ressources/fontes/jawa-times.ttf");} 

html
	{
	height:100%;
	}
	
.discret
	{
		
	color:#AAAAB3;
	text-decoration:italic;
	font-size:10px;
	}

.nolanguage { background-color:crimson; }

*
{
	 touch-action: manipulation;
}

#saving
{
	position: absolute;
    display: none;
    animation: _mvt_clignotte 1.5s linear infinite;
    width: 60;
    z-index: 15602;
    padding: 10px;
    right: 0;
    bottom: 0;
    background-color: #000;
    border-top-left-radius: 25%;
    box-shadow: 0px 0px 15px 20px #000;
    border: 5px solid #000;
}

#game_logo
{
	max-width:200;
	max-height:200;
	
}
body {
	background-color:#33333B;
	position: absolute;
	font-family:tahoma;
	color:#EEEEEE;
	font-size:11px;
	-webkit-touch-callout: text;
    -webkit-user-select: text;
    -khtml-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;

	scrollbar-base-color: #223;
	scrollbar-3dlight-color: #335;
	scrollbar-highlight-color: #335;
	scrollbar-track-color: #111119;
	scrollbar-arrow-color: #446;
	scrollbar-shadow-color: #112;
	scrollbar-dark-shadow-color: #223;
	background-size:cover !important;

	
	}

#kiwi	{
	-webkit-touch-callout: text !important;
    -webkit-user-select: text !important;
    -khtml-user-select: text !important;
    -moz-user-select: text !important;
    -ms-user-select: text !important;
    user-select: text !important;
	
	}

		
a {
	font-family:arial;
	cursor: pointer;
	color:#88BBFF;
	font-size:13px;
	/*font-weight:bold;*/
	text-align:justify;
	text-decoration:none;
	transition:text-shadow 0.5s ease-out;
}


	
	
a:hover {
	text-shadow: 0 0 5px #DDD;
	background-color:transparent;
}

#bg_fader
	{
	background-size: cover !important;
	transition:opacity 1.5s;
	}


.small_link {	
	font-size:11px;
	white-space: nowrap;
	
}

.small_text {
	font-size:11px;
}

.choix	{
	text-align:left;
	font-size:18px;
	
	}



video::-webkit-media-controls-fullscreen-button, video::-webkit-media-controls-toggle-closed-captions-button
{
    display: none;
}


input,checkbox,radio,textarea {
	background: no-repeat url(./pics/ombre_input.gif);
	background-color:#E7E7E7;
	font-size:12px;
	font-weight:bold;
	color:#444488;
	font-family:arial;
	padding-left:2px;
	border-radius:3px;
	border:1px solid #DDD;
}

	
.bouton_editeur
	{
	font-size:13px;
	border:1px solid #556677;	
	color:#334455;
	height:20px;
	padding-top:-6px;
	font-family:tahoma;
	font-weight:700;
	cursor:pointer;
	text-align:center;
	}

.bouton {	
	/*box-shadow:inset 0px 1px 0px 0px #bbdaf7;*/
	
	/*background: linear-gradient(to bottom, #385b7d, #296cb1);*/
	background:linear-gradient(#172935,#273945);
	
	
	border-radius:3px;
	/*border:1px solid #84bbf3;*/
	display:inline-block;
	color:#eee !important;
	font-family:arial;
	font-size:13px;
	font-weight:bold;
	padding:2px 5px 2px 5px;
	text-decoration:none;
	/*text-shadow:1px 1px 0px #528ecc;*/
	cursor:pointer;
	pointer-events:auto;
	backface-visibility:hidden;
	transition:filter .3s;
}

.onglet
	{
	border-bottom-left-radius:0px;
	border-bottom-right-radius:0px;
	}
	
.bouton:hover 
	{
	/*background: linear-gradient(to bottom, #385b9d, #296cd1);*/
	/*background:linear-gradient(#172935,#273945);*/
	filter:brightness(1.3);
	
	/*color:#FFF !important;*/
	}
	
.bouton:active {
	position:relative;
	top:1px;
}

#loadform .bouton:active
{
	position:unset;
}


form {
	margin:0px;
	padding:0px;
	
}
	
.pagebox {
 	/*padding:4px;
 	border:1px solid #BBB;
 	background-color:#2F475D;
 	box-shadow: 2px 2px 3px #888;
 	text-shadow:#444 1px 1px,#444 -1px 1px,#444 -1px -1px,#444 1px -1px;
 	letter-spacing:1px;
 	border-radius: 5px;*/
	-moz-box-shadow:inset 0px 1px 0px 0px #2F475D;
	-webkit-box-shadow:inset 0px 1px 0px 0px #2F475D;
	box-shadow:inset 0px 1px 0px 0px #2F475D;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1f3142), color-stop(1, #273e53) );
	background:-moz-linear-gradient( center top, #1f3142 5%, #273e53 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#1f3142', endColorstr='#273e53');
	background-color:#1f3142;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	/*border:1px solid #2F475D;*/
	text-shadow:#444 1px 1px,#444 -1px 1px,#444 -1px -1px,#444 1px -1px;
 	letter-spacing:1px;
	padding:10px;
	
 }

/* styles de l'interface de jeu */
.gamelink {
	padding-left:3px;
	padding-right:3px;
	
	border-radius: 5px;
	border:1px solid #888888;
	background-color:#444444;
	font-family:times new roman;
	font-size:20px;
	color:#6699EE;
	font-weight:normal;
	text-decoration:none;
	z-index:9999;
	pointer-events:auto;
}

.gamelink:hover {
	
	background-color:orange;
	
}

#countdown {
	padding:4px;
	font-size: 25px;
	background-color:#444;
	text-shadow:2px 2px 3px #88B;border-radius:7px;
	text-align:center;z-index:11590;
	position:absolute;
	display:none;top:-5px;
	font-weight:bold;
	font-family:tahoma;
	 box-shadow: 0 0 15px #333;
}

#pluginBox
{
	display:none;
	position:absolute;
	z-index: 12203;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	opacity:0;
	transition:opacity 1s, transform 1s ease-in;
	transform:scale(0);
}

#loadplugin
{
	position:absolute;
	left:20%;
	top:20%;
	width:60%;
	height:60%;
	text-align:center;
	pointer-events:none;
	background-color:rgba(150,150,150,.8);
	z-index:2;
	transition:opacity .5s;
	transition-delay:opacity 1s;
	opacity:0;
}

#errplugin
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	padding-top:25%;
	text-align:center;
	background-color:rgba(40,40,40,.9);
	z-index:12999;
	transition:opacity .5s;
	opacity:0;
	color:crimson;
	font-size:25px;
	display:none;	
}

#errplugin a
{
	cursor:pointer;
	font-size:18px;
}

#loadplugin img
{
	width:50;
	margin-top:25%;
}

#pluginFrame
{
	position:absolute;
	z-index: 12203;
	left:5%;
	top:5%;
	width:90%;
	height:90%;
	transition:transform .6s;
	transform:scale(0);
}

#pluginNextButton
{
	position:absolute;
	display:none;
	right:1%;
	bottom:1%;
	font-size:18px;
	z-index: 13000
	
}
.messagebox {
    opacity: 0;
    display: none;
    color: #FFF;
    background-color: rgba(41, 51, 59, .97);
    font-family: georgia;
    font-size: 20px;
    z-index: 12201;
    position: absolute;
    top: 70px;
    left: 100px;
    height: auto;
    padding: 8px;
    box-shadow: 3px 3px 8px #333;
    border-radius: 5px;
    cursor: url(./pics/icone_wait.gif),wait;
    transition: opacity 0.4s;
    border-bottom: 1px solid rgba(17, 33, 34, 0.17);
	text-align:center;
	backface-visibility:hidden;
}

#beginInfo
{
	display:block;	
	font-size:24px;
}

#messageBox:after
{
	content: " ";
    display: block;
    width: 44px;
    position: absolute;
    height: 45;
    background: url(./pics/next.png);
    right: 10;
    bottom: -35;
    z-index: 100;
    animation: _mvt_wobble-horizontal 1s linear infinite;
    background-size: cover;
}

#dialogue_perso_name
	{
	font-size:8px;
	font-family:consolas;
	color:#666;
	}
	
#fenetre_principale
	{
	height:100%;
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	z-index:2;
	overflow:hidden;
	}

#fenetre_jeu_main:-moz-full-screen
	{
	position:absolute;
	transform-origin:0px 0px;
	z-index:1;
	}

.lang_flag
	{
	transition:filter .7s;
	width:32px;
	cursor:pointer;
	padding:4px;
	margin-right:10px;
	
	border:1px solid #CCC;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
	border-bottom:0px;
	background-color:rgba(41, 51, 59, .87);
	}

#mainmenu_lang
	{
	position:absolute;
	right:0;
	bottom:40%;
	z-index:30000;
	margin-bottom:-1px;
	}

#fenetre_jeu_main
	{
	transition:opacity 1s, transform 0.5s;
	position:absolute;
	transform-origin:0px 0px;
	opacity:0;
	}
	
#fenetre_jeu
	{
	opacity:0;
	transition:opacity 1s, transform 0.5s, filter 0.5s;
	user-select:none;
	}
	
.dialoguebox
	{
	
	opacity:.93;
	display:none;
	z-index:12202;
	position:absolute;
	padding-bottom:-2px;
	cursor:url(./pics/icone_wait.gif),wait;
	transition:height .5s, opacity .5s ease-in, margin-left 1s, margin-bottom 1s;
	backface-visibility:hidden;
	min-width:150px;
	
	}

.dialoguebox_jdr
	{
	opacity:.93;
	display:none;
	z-index:12202;
	position:absolute;
	bottom:-20%;
	max-height:20%;
	cursor:url(./pics/icone_wait.gif),wait;
	transition:bottom .5s, opacity .5s;/*, opacity .5s ease-in;*/
	backface-visibility:hidden;
	left:0;
	width:100%;
	background-color:sand;

	}
	
	
.dialoguebox_jdr .item_choix
	{
		margin-left:170px !important
	}
	
#dial_portrait
	{
	float:left;
	width:15%;
    margin-top: -2%;
    margin-right: 20;
    filter: drop-shadow(5px 5px 10px #000);
    transition: height .5s;
	}
	
.dialoguebox_jdr #dialtext
{
	border-radius:0;
	height:100% !important;	
}

.dialoguebox_jdr #dial_fleche_gauche,.dialoguebox_jdr #dial_fleche_droite,.dialoguebox_jdr #dial_pense_gauche,.dialoguebox_jdr #dial_pense_droite
{
	display:none !important;

}

.dialogueboxText2
	{
	background-color:#F7F7F7;
	font-family:times new roman;
	font-size:18px;
	color:#000000;
	/*font-weight:bold;*/
	border-radius:21px;
	padding:10px;
	transition:height .5s;
	
	}
	
#dial_fleche_gauche
{
margin-left:20px;
float: left;
top: 0px;
visibility: visible;
display: inline;
width: 30px;
margin-top: -2px;
}

#dial_fleche_droite
{
margin-right:20px;
float: right;
top: 0px;
visibility: visible;
display: inline;
width: 30px;
margin-top: -2px;
}


	
.choix_question
	{
	font-family:times new roman;
	font-size:16px;
	color:#334467;
	transition:color .3s;
	}
	
.choix_question:hover
	{
	font-family:times new roman;
	font-size:16px;
	color:orange;
	text-decoration:none !important;
	
	}
	
.item_choix
	{
	opacity:1;
	margin-top:3px;
	margin-bottom:5px;
	transition:opacity 1s;
	padding:2px;
	transition:background-color .5s;
	}
	
.item_choix:hover
	{
	cursor:pointer;
	background-color:rgba(150,150,200,.3);
	border-radius:5px;
	}

.item_choix:hover a 
{
color:orange;
	
}



	
#newObject
	{
	display:none;
	opacity:0;
	position:absolute;
	transition:opacity .7s,left 1s, top 1s;
	width:100px;
	z-index:201;
	width:90;
	height:90;
	transform:scale(1.12);
	backface-visibility:hidden;
	}
	
#takeobjectbox
	{
	display:none;
	color:#FFFFFF;
	font-family:arial black;
	font-size:19px;
	opacity:0;
	z-index:200;
	position:absolute;
	overflow:hidden;
	width:200px;
	padding:10px 10px 20px 10px;
	backface-visibility:hidden;
	
	text-shadow:#444 1px 1px,#444 -1px 1px,#444 -1px -1px,#444 1px -1px;
	letter-spacing:1px;
	border-radius: 8px;

	margin:10px;

	border:1px solid rgba(0,0,0,0.5);
	

	box-shadow:
		0 2px 6px rgba(0,0,0,0.7),
		inset 0 1px rgba(255,255,255,0.3),
		inset 0 10px rgba(255,255,255,0.2),
		inset 0 10px 20px rgba(255,255,255,0.25),
		inset 0 -15px 30px rgba(0,0,0,0.3);
	background:rgba(0,0,0,0.7);
	transition:opacity 1s;
	}

.questionbox
	{
	display:none;
	color:#FFFFFF;
	/*border:1px outset #213142;*/
	background-color:#213142; /*#113366;*/
	background: radial-gradient(ellipse at center, #213142 50%, #426286 100%);
	font-family:arial;
	font-size:18px;
	filter:alpha(opacity=99);
	z-index:12000;
	position:absolute;
	overflow:hidden;	
	box-shadow: 5px 5px 12px #333;
	width:30%;
	left:35%;
	top:35%;
	min-height:20%;
	/*height:130px;*/
	text-shadow:#444 1px 1px,#444 -1px 1px,#444 -1px -1px,#444 1px -1px;
	letter-spacing:1px;
	border-radius: 5px;
	padding:12px;
	transition:opacity 0.7s, top .3s, height .3s, left .3s, width .3s;
	user-select:text;
	backface-visibility:hidden;
	}
	
.contextMenuBox
	{
	opacity:.9;
	display:none;
	color:#BBB;
	border:1px outset #4466BB;
	background-color:#F4F4F4;
	font-family:arial;
	font-size:16px;
	filter:alpha(opacity=99);
	z-index:20000;
	position:absolute;
	overflow:hidden;	
	box-shadow: 5px 5px 12px #333;
	width:234px;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) );
		background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
		
	text-shadow:#444 1px 1px,#444 -1px 1px,#444 -1px -1px,#444 1px -1px;
	letter-spacing:1px;
	border-radius: 5px;
	padding:5px;
	text-align:center;
	transition:transform .5s;
	
	}

.contextMenuButton img
	{
	float:left;
	border:1px solid #888;
	width:25px;
	border-radius:4px;
	background-color:#555;
	margin-right:8px;
	}
	
.contextMenuButton
		{
		width:220px;
		box-shadow:inset 0px 1px 0px 0px #ffffff;
		/*background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) );
		background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );*/
		background-color:#ededed;
		border-radius:6px;
		border:1px solid #dcdcdc;
		display:inline-block;
		color:#666;
		font-family:arial;
		font-size:21px;
		font-weight:bold;
		padding:6px 6px;
		text-decoration:none;
		text-shadow:1px 1px 0px #ffffff;
		margin-bottom:4px;
		transition : background-color 0.3s;
		}

	
.contextMenuButton:hover {
	background-color:rgba(136, 187, 255, 0.38);
	
}

#conteneur_lieu
{
transition:filter 1.5s;
}

#ingameHelper
	{
	z-index:11300;
	position:absolute;
	overflow:hidden;
	cursor:pointer;
	width:100%;
	height:100%;
	}

.ingameHelper
	{
	cursor:pointer;
	display:inline;
	text-align:left;	
	position:absolute;
	overflow:hidden;	
	width:400px;
	opacity:0;
	z-index:11400;
	transition:opacity .75s, left .75s, top .75s, transform .75s;
	transform:scale(.1);
	left:99%;
	top:-300px;
	height:250px;
	}

#aide_manuel
	{
	position:absolute;
	left:0;
	top:18px;
	font-size:14px;
	line-height:17px;
	overflow-x:hidden;
	display:inline;
	color:#333;
	font-family:arial;
	border:1px outset #666;
	background-color:#EEE;
	box-shadow: 5px 5px 12px #333;
	height:210px;
	width:380px;
	letter-spacing:1px;
	border-radius: 10px;
	border-top-left-radius:0px;
	border-top-right-radius:0px;
	
	padding:10px;
	background:radial-gradient(ellipse at center, #FFF 70%,#AAB);
	backface-visibility: hidden;
	
	}

#ingame_sharers
	{
	bottom: -150px;
    height: 100px;
    position: absolute;
    text-align: center;
    z-index: 3000;
	width:100%;
	opacity:0;
	transition:bottom .5s, opacity.5s;
	}
	
#ingame_sharers img:hover
	{
	filter:drop-shadow(0px 0px 15px #EEE);
	}

#ingame_sharers img
{
	cursor:pointer;
	
	width:80px;
	filter:drop-shadow(0px 0px 5px #EEE);
	transition:filter .7s;
}


.ingameHelper li
	{
	margin-bottom:3px;
	font-size:12px;
	}
	
#aide_indices, #aide_trophees, #aide_apropos
	{
	position:absolute;
	left:0px;
	top:18px;
	width:400px;
	overflow-y:auto;
	overflow-x:hidden;
	display:none;
	color:#333;
	font-family:arial;
	border:1px outset #666;
	background-color:#EEE;
	box-shadow: 5px 5px 12px #333;
	height:210px;
	width:380px;
	letter-spacing:1px;
	border-radius: 10px;
	border-top-left-radius:0px;
	border-top-right-radius:0px;
	padding:10px;
	background:radial-gradient(ellipse at center, #FFF 70%,#AAB);
	font-size:14px;
	line-height:17px;
	}
	
.questionboxinput
	{
	width: 76%;
    height: 29;
    margin-top: 3px !important;
    margin-bottom: 10px;
	font-size:24px;
	}

#questionboxbutton
	{
	margin-top:3px;
		box-shadow:inset 0px 1px 0px 0px #ffffff;
		background:gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) );
		background-color:#ededed;
		border-radius:6px;
		border:1px solid #dcdcdc;
		display:inline-block;
		color:#777777;
		font-family:arial;
		font-size:14px;
		font-weight:bold;
		padding:6px 24px;
		text-decoration:none;
		text-shadow:1px 1px 0px #ffffff;
		margin-bottom:4px;
	cursor:pointer;
	}	

.questionboxbutton:hover
	 {
	background:gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed) );
	background-color:#dfdfdf;
}

#commentbox
	{
	display:none;
	opacity:0;
	z-index:11998;
	position:absolute;
	overflow:hidden;
	top:0;
	left:1;
	box-shadow: 0px 3px 2px #555;
	height:50px;
	transition:opacity .6s, height .4s;
	pointer-events:none;
	background-color:rgba(80,80,80,.75);
	font-family:tahoma;
	font-size:18px;
	color:#FFFFFF;
	text-shadow:#444 1px 1px,#444 -1px 1px,#444 -1px -1px,#444 1px -1px;
	letter-spacing:1px;
	padding-right:200px;
	text-overflow: ellipsis;
    white-space: nowrap;
	}


#inventaireButton
	{
	cursor:pointer;
	/*visibility:hidden;*/
	z-index:3000;
	transition:opacity 1s, transform .4s;
	backface-visibility: hidden;
	pointer-events:auto;
	}

#indicebox
	{
	box-shadow: 0px 0px 200px #000;
	padding:20px 0px;
	position:absolute;
	left:0px;
	top:-200px;
	width:100%;
	transition:top .7s,opacity .5s;
	background-color:rgba(41, 51, 59, .87);
	color:#FFF;
	font-size:28px;
	border-bottom:1px solid #AAA;
	border-top:1px solid #AAA;
	z-index:12700;
	text-align:left;
	cursor:pointer;
	max-height:500px;
	opacity:0;
	max-height: 50%;
    overflow: hidden;
	}

#indicebox b
{
	color:orange;
}

#continuebox
	{
	padding:30px 0px;
	position:absolute;
	left:0px;
	top:120%;
	width:100%;
	transition:top .7s,opacity .5s;
	background-color:rgba(41, 51, 59, .87);
	text-align:center;
	color:#FFF;
	font-size:33px;
	border-bottom:1px solid #AAA;
	border-top:1px solid #AAA;
	z-index:11700;
	
	}
	
#beginbox
	{
	padding:30px 0px;
	position:absolute;
	left:0px;
	top:120%;
	width:100%;
	transition:top .7s;
	background-color:rgba(41, 51, 59, .87);
	text-align:center;
	color:#FFF;
	font-size:33px;
	border-bottom:1px solid #AAA;
	border-top:1px solid #AAA;
	z-index:11700;
	}
	
#menuload
	{
	position: absolute;
    right: 5;
    bottom: 60;
    width: 45;
    z-index: 12000;
	cursor:pointer;
	transition:top .7s;
	backface-visibility:hidden;
	}
	
#continueConfirm
	{
	left:110%;
	top:0px;
	height:120px;
	text-align:center;
	color:#FFF;
	padding:30px 10px;
	font-size:24px;
	border:1px solid #888;
	border-radius:5px;
	box-shadow:3px 3px 6px #000;
	background-color:rgba(86, 4, 8, .95);
	width:70%;
	transition:left .5s;
	position:absolute;
	backface-visibility:hidden;
	}
	
#menuboxbg
	{
	position:absolute;
	z-index:1;
	left:0px;
	top:0px;
	}

#continuebox .bouton, #beginbox .bouton
	{
	font-size:36px;
	text-transform:uppercase;
	margin:10px;
	padding:10px;
	}

.gotobox
	{
	opacity:.8;
	filter:alpha(opacity=80);
	display:none;
	color:#FEC240;
	background:url(./pics/fleche.gif) no-repeat;
	padding-left:14px;
	font-family:arial;
	color:#FFFFFF;
	font-size:11px;
	z-index:1;
	position:absolute;
	top:50px;
	left:100px;
	width:100px;
	height:20px;
	text-shadow:#444 1px 1px,#444 -1px 1px,#444 -1px -1px,#444 1px -1px;	
	}

.chatBox
	{
	opacity:.93;
	filter:alpha(opacity=93);
	display:none;
	z-index:2001;
	position:absolute;
	padding-bottom:-2px;
	width:500;
	height:50;
	cursor:pointer;
	}	

#chatText
	{
	background-color:#F6F6F7;
	color:#333;
	font-size:19px;
	}

#chatmsgtxt
	{
	font-size:16px;
	width:390px;	
	background-color:#EEEEEE;
	}

.portrait_personnage
	{
	border:3px solid #FFF;
	border-radius:7px;
	}

	
	
#perso_switcher
	{
	float:right;
	width:86px;
	max-height:400;
	margin-top:50;
	padding:6px;
	padding-bottom:1px;
	border:2px solid #EEE;
	border-left-style:none;
	border-radius:6px;
	
	}

.standalone_header
{
	border: 1px solid #EEEEEE;
	box-shadow: 5px 5px 12px #999;
	border-radius: 5px;
	box-shadow:inset 0px 1px 0px 0px #2F475D;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #324B6D), color-stop(1, #1F374D) );
	background:-moz-linear-gradient( center top, #324B6D 5%, #1F374D 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#324B6D', endColorstr='#1F374D');
	background-color:#2F475D;
	
}

.standalone_header h3
	{
	font-size:15px;
	}
	
.siteboxwhite
	{
	width:300px;
	margin-top:auto;
	margin-left:20px;
	margin-right:20px;
	
	border:1px solid #999;
	background-color:#EEE;
	border-radius:8px;
	font-size: 14px;
	color:#444;
	font-family:tahoma;
	line-height:18px;
	padding:20px;
	box-shadow: 5px 5px 12px #333;
	}

#launcher h1
	{
	font-size:52px;
	font-family:courier;
	color:#FFF;
	margin-top:20px;
	margin-bottom:15px;
	text-shadow: -2px 0 #333, 0 2px #333, 2px 0 #333, 0 -2px #333;
	}

#launcher td
	{
	color:#444;
	font-size:11px;
	}

#launcher .welcome
	{
	color:#444;
	font-size:28px;
	font-weight:thin;
	letter-spacing:2px;
	font-family:Arial,Helvetica,sans-serif;
	}


.indice_header
	{
	font-family:consolas;
	color:#888;
	font-size:10px;
	}
	
.feedback_box
	{
	
	color:#EEE;
	border:1px solid #666;
	background-color:#333; 
	padding:5px;
	border-radius:3px;
	width:600px;
	}
	
.feedback_box td
	{
	font-size:10px;
	}

.avis_box
	{
	border:1px solid #BBB;
	background-color:
	}

	

.pulsor {
  
    box-shadow: 0 0 15px #333;
    -webkit-animation: pusate 1s infinite alternate;
    -moz-animation: pusate 1s infinite alternate;
    -animation: pusate 1s infinite alternate;
    text-shadow: 0 0 8px #ccc;
}
@-webkit-keyframes pusate {
    from { box-shadow: 0 0 10px #333; }
    to { box-shadow: 0 0 20px #c00; }
}
@-moz-keyframes pusate {
    from { box-shadow: 0 0 10px #333; }
    to { box-shadow: 0 0 20px #c00; }
}
@keyframes pusate {
    from { box-shadow: 0 0 10px #333; }
    to { box-shadow: 0 0 20px #c00; }
}

@keyframes onmoveanim {
	0% { filter:sepia(0); -webkit-filter:sepia(0); }
	25% {filter:sepia(1); -webkit-filter:sepia(1); }
	50% { filter:sepia(0); -webkit-filter:sepia(0); }
	75% { filter:sepia(1); -webkit-filter:sepia(1); }
	100% { filter:sepia(0); -webkit-filter:sepia(0); }
	
}

@keyframes ok_action {
	0% 
		{
		filter:brightness(3);
		-webkit-filter:brightness(3);
		-ms-filter:brightness(3);
		}
	10%
		{
		filter:brightness(1);
		-webkit-filter:brightness(1);
		-ms-filter:brightness(1);
		}
	
	20%
		{
		filter:brightness(-3);
		-webkit-filter:brightness(-3);
		-ms-filter:brightness(-3);
		}
	30%
		{
		filter:brightness(-1);
		-webkit-filter:brightness(-1);
		-ms-filter:brightness(-1);
		}
	
	40%
		{
		filter:brightness(2);
		-webkit-filter:brightness(2);
		-ms-filter:brightness(2);
		}
	50%
		{
		filter:brightness(4);
		-webkit-filter:brightness(4);
		-ms-filter:brightness(4);
		}
	
	60%
		{
		filter:brightness(3);
		-webkit-filter:brightness(3);
		-ms-filter:brightness(3);
		}
	70%
		{
		filter:brightness(1);
		-webkit-filter:brightness(1);
		-ms-filter:brightness(1);
		}
	
	80%
		{
		filter:brightness(-1);
		-webkit-filter:brightness(-1);
		-ms-filter:brightness(-1);
		}
	90%
		{
		filter:brightness(-3);
		-webkit-filter:brightness(-3);
		-ms-filter:brightness(-3);
		}
	
	100%
		{
		filter:none;
		}

}		

#dialtext
  	{
	text-align:left;
	box-shadow:3px -3px 10px #333;
	border-bottom:2px solid #333;
	} 
	
#dialtext_inner b
  	{
  	color:orange;
  	}
	

 /*
  @keyframes speaking {
    from { width: 0 }
    to { width:100%}
}



#dialtext
  	{
  dtext-align:left;
  max-height:40px;
  	animation: speaking 1s steps(30, end);
  }
  
#dialtext_inner { 
    
    text-align:left;
	width:100%;
    dwhite-space:nowrap;
    overflow:hidden;
    
	animation: speaking 40s steps(30, end);
    
} */
  

.logo_anim
 
{
    width: 300px;
    height: 250px;
    background: #112233;
    border-radius: 100%;
    border-left: 10px solid #334466;
    border-right: 10px solid #334466;
      animation: wobble 2s infinite;
    opacity: .4;
	position:absolute;
}


@keyframes wobble {
  0%{
    transform: rotate(0deg);
    border-width: 0px 10px;
  }
  30%{
    border-width: 0px 10px;
  }
  50% {
    border-width: 0px 30px;
  } 
  
  80%{
    border-width: 0px 10px;
  }
  100% {
    transform: rotate(720deg);
    border-width: 0px 10px;
  }
}

.smooth_transition
	{
	transition: filter .5s, opacity 1s, transform 1s, width 1s, height 1s, left 1s, top 1s;
	transition-timing-function: ease-in-out;
	position:absolute;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
	-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
	backface-visibility: hidden;
	
	font-weight:normal;
	}
	
.obj_deplacable
	{
	position:absolute;
	backface-visibility:hidden;
	}
	
.smooth_transition_pp, .smooth_transition_ap
	{
	transition: filter .5s, opacity 1s, transform 1s, width 1s, height 1s, left 1s, top 1s;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
	-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
	position:absolute;
	/*transition:margin-left .1s linear,margin-top .1s linear;*/
	backface-visibility: hidden;
	}

.smooth_transition_ap
	{
	backface-visibility: hidden;
	}

.smooth_transition_lieu
	{
	transition: filter 1s,transform 1s;

	transition-timing-function: ease-in-out;
	position:absolute;
	overflow:hidden;
	left:0px;
	top:0px;
	backface-visibility:hidden;
	}

.locscaler
	{
	transform-origin:50% 50%;
	/*transition: transform 5s, transform-origin 1s;*/
	/*transition: transform 1s, transform-origin 1s;*/
	
	/*transition-delay:1s;*/
		
	}

.viewport
	{
	opacity:0;
	border:1px solid #444;
	position:absolute;
	left:0px;
	top:0px;
	overflow:hidden;
	transition:opacity .6s, filter 1s;
	z-index:0;
	display:none;
	background-size:124% 124% !important;
	
	}

#optionsButton
	{
	position:absolute;
	top:0px;
	right:0px;
	width:3em;
	padding: 12px 12px 24px 18px;
	background-color:#213142;
	border-bottom-left-radius:40px;
	z-index: 12050;/*10050;*/
	cursor:pointer;
	transition:opacity 1s;
	display:none;
	box-shadow: -1px 1px 2px 0px #000
	}
	
#progressbox
	{
	margin-top:25;
	cursor:pointer;
	z-index:7;
	transform-origin: right bottom;
	transform:scale(.3);
	position:absolute;
	width:130px;
	height:130px;
	align:center; 
	/*background-color:#213142;
	border:3px solid #213142;*/
	border-top-left-radius:63px;
	transition: margin .35s,left .35s,  height .35s, transform .35s, opacity 1s;
	transition-timing-function: ease-in-out;
	opacity:.85;
	box-shadow:-0px 0px 7px 2px #000;
	backface-visibility:hidden;
	}

/*#progressbox:hover
	{
	transform:scale(1) translateX(-35px);	
	}*/

.progresscircle 
	{
	width:115px;
	height:115px;
	margin-top:10px;
	}
 
 .progresscircle > svg 
	{
    height: 100%;
    display: block;
    }

#prog_label
	{
	opacity:0;
	transition:opacity .5s;
	position:absolute;
	width:100%;
	text-align:center;
	top:50px;
	left:0;
	}
	
.progressbar-text
	{
	padding-top:10px!important;
	font-size:20px;
	}
	
 @keyframes go_door
  	{
	
  	100%
  		{
  		transform:scale(1.6);
		filter:blur(10px);
		-webkit-filter:blur(10px);
		-ms-filter:blur(10px);
		
  		}
  }
 
 @keyframes logoload3
	{
	50%
		{
		transform:scale(1.7) rotate(10deg);
		filter:blur(1px) brightness(.4);
		-webkit-filter:blur(1px) brightness(.4);
		}
	}
	
.logoloading3
	{
	position:absolute;
	margin:auto;
	left:25%;
	top:25%;
	z-index:3;
	opacity:.4;
	width:50%;
	height:50%;
	filter:blur(9px) brightness(.1);
	-webkit-filter:blur(9px) brightness(.1);
	
	transform:none;
	animation:logoload3 40s infinite;
	}
	
.passage_shower
	{
	width:100px;
	height:100px;
	animation-duration:2s;
	animation-repeat:0;
	opacity:0.5;
	display:none;
	position:absolute;
	z-index:1100;
	pointer-events:none;
	}

@keyframes passage_shower_move_top
	{
	0% {  transform:none;opacity:0;}
	
	25% { transform:translateY(-30px);opacity:0.7;}
	50% { transform:translateY(0px);}
	75% { transform:translateY(-30px); opacity:0.7;}
	100%{ transform:translateY(0px); opacity:0; }
	}

@keyframes passage_shower_move_bottom
	{
	0% { transform:rotate(180deg);opacity:0;}
	25% {  transform:rotate(180deg) translateY(-30px);opacity:0.7;}
	50% {  transform:rotate(180deg) translateY(0px);}
	75% {  transform:rotate(180deg) translateY(-30px); opacity:0.7;}
	100%{  transform:rotate(180deg) translateY(0px); opacity:0; }
	
	}


@keyframes passage_shower_move_left
	{
	0% {  transform:rotate(270deg);opacity:0;}
	25% { transform:rotate(270deg) translateY(-30px);opacity:0.7;}
	50% { transform:rotate(270deg) translateY(0px);}
	75% { transform:rotate(270deg) translateY(-30px); opacity:0.7;}
	100%{ transform:rotate(270deg) translateY(0px); opacity:0; }
	
	}
	
@keyframes passage_shower_move_right
	{
	0% {  transform:rotate(90deg);opacity:0;}
	25% { transform:rotate(90deg) translateY(-30px);opacity:0.7;}
	50% { transform:rotate(90deg) translateY(0px);}
	75% { transform:rotate(90deg) translateY(-30px); opacity:0.7;}
	100%{ transform:rotate(90deg) translateY(0px); opacity:0;}
	
	}
	
#masque_waitclick, #server_wait
	{
	position:absolute;
	background-color:transparent;
	opacity:.29;
	display:none;
	overflow:hidden;
	top:0;
	left:-30;
	cursor:progress,wait;
	transition:box-shadow .4s;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
	-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
	}

	
#server_wait
{
	z-index:12300;
	left:0;
}
	
#masque_waitclick
	{
	z-index:11000;
	}
	
#masque_waitclick
	{
	opacity:1;
	}
	
#loadlink
	{
	position:absolute;
	left:14%;
	top:220px;
	height:55px;
	display:none;
	}
#server_wait
	{
	opacity:1;
	background-color:rgba(20,20,35,.87);
	z-index:12000;
	
	}

	
#pop_indice2
	{
	position:absolute;
	z-index:998;
	left:50%;
	top:-500px;
	width:20px;
	height:20px;
	opacity:0;
	margin-left:-10;
	margin-top:-10;
	visibility:hidden;
	animation:none;
	}
	
@keyframes indice_anim_previous
	{
			0% { z-index:20000;width:50;height:50;visibility:visible;left:95%;top:20px;opacity:.2;transform:scale(1) rotate(5deg);}
			25% { z-index:20000;width:50;height:50;visibility:visible;left:95%;top:20px;opacity:1;transform:scale(1.7) rotate(10deg);}
			50% { z-index:20000;width:50;height:50;visibility:visible;left:95%;top:20px;opacity:.2;transform:scale(1) rotate(5deg);}
			75% { z-index:20000;width:50;height:50;visibility:visible;left:95%;top:20px;opacity:1;transform:scale(1.7) rotate(10deg);}
			
	}



@keyframes indice_anim
	{
	0% {
		visibility:visible;
		opacity:0;
		-webkit-filter:brightness(50%);
		left:50%;
		top:50%;
		}
	
	15% {
		display:inline;
		opacity:1;
		-webkit-filter:brightness(100%);
		-filter:brightness(120%);
		width:200px;
		height:200px;
		margin-left:-100;
		margin-top:-100;
		}
	23% 
		{
		-webkit-filter:brightness(120%);
		filter:brightness(120%);
		width:170px;
		height:170px;
		margin-left:-85;
		margin-top:-85;
		}
	28% {
		width:196px;
		height:196px;
		margin-left:-97;
		margin-top:-97;
		}
	34% {
		-webkit-filter:brightness(90%);
		filter:brightness(90%);
		width:190px;
		height:190px;
		margin-left:-95;
		margin-top:-95;
		}
	40%
		{
			width:190px;
			height:190px;
			opacity:1;
			left:48%;
			top:46%;
			margin-left:-95;
			margin-top:-95;
		}
		
	65%
		{
		opacity:1;
		}
	99%
		{
		left:94%;
		top:12px;
		width:20px;
		opacity:0;
		margin-left:-10;
		margin-top:-10;
		}
	100%
		{
		opacity:0;
		visibility:hidden;
		
		}
	}

#indicetext
	{
	padding-right: 30px;
	display: block;
	max-height: 300;
	overflow-y: auto;
	height: auto !important;
	}


#indicetext::after
	{
	content:"";
	position:absolute;
	left:-20px;top:0;bottom:0;right:-20px;
	box-shadow:0px 0px 20px 25px rgba(41, 51, 59, 1) inset;
	}
	
#savefile
	{
	font-size: 18px;
    background-color: #333 !important;
    display: block;
    float: left;
    margin-left: 25%;
    width: 50%;
	}


#targetter
	{
	position:absolute;
	top:-500px;
	transform-origin:50% 50%;
	opacity:.75;
	z-index:11001;
	pointer-events:none;
	animation:none;
	
	transition: left .5s, top .5s;
	transition-timing-function: ease-in-out;
	}

@keyframes target_anim
{
25%,75% {transform:translate(-50px,70px);} 
50%,100% {transform:none;}
}

@keyframes target_anim_reverseX
{
0% {transform:scaleX(-1) translate(-80px,80px);} 
25%,75% {transform:scaleX(-1) translate(0px,0px);} 
50%,100% {transform:scaleX(-1) translate(-80px,80px);}

}


.bt_interface
	{
	border-radius:2px;
	border:1px solid #777;
	top:2px;
	cursor:pointer;
	z-index:10000;
	}

#loadfullscreen
	{
	width:330px;position:absolute;text-align:left;top:10px;right:10px;
	transform-origin:top right;
	transition:transform 1s;
	}
	
#fullscreener_mask
	{
	position:absolute;
	right:42px;
	top:12px;
	transition:opacity .7s !important;
	opacity:.8;
	width:35px;
	}
	
#loadmask
	{
	position:absolute;
	display:inline;z-index:15601;overflow:hidden;top:0;left:0;
	cursor:wait;background:#000000;
	transition:opacity 1s, clip-path .6s;
	backface-visibility:hidden;
	
    clip-path: polygon(-40% 0%,100% 0%,140% 100%,0% 100%);
	}


#capshare
{
position:absolute;
left:-110%;
top:20%;
height:60%;
width:100%;
border-top:1px solid #444;
box-shadow:0px 6px 10px #000;
transition:left .5s;
z-index: 12200;
}


#capshare_api
{
    position: absolute;
    top: 30%;
    width: 37%;
    right: 2%;
    font-size: 45px;
    font-family: msgfont;
    padding: 20;
    padding-top: 30;
}

#capshare_api img
{
	float: left;
    padding-right: 15;
    margin-top: -20;
}

#capshare_bt
{
	width:42%;
	position:absolute;
	right:1%;
	font-size:40px;
	font-family:msgfont;
	height:97%;

}

#capshare_close
{
	position: absolute;
    bottom: 5px;
    right: 5px;
    
    padding: 12;
    font-size: 25px;
}

#capshare_pv
{

	max-width:50%;
	max-height:90%;
	margin:1% 3%;
	border:10px solid #FFF;
	border-bottom-width:30px;
	transform:rotate(-4deg);
	float:left;
	box-shadow: 3px 3px 15px 2px #000;
}

#waitmask
	{
	position:absolute;
	display:inline;
	z-index:15600;overflow:hidden;top:0;left:0;
	width:100%;
	height:100%;
	cursor:wait;background:#000;
	transition:opacity 1s;
	backface-visibility:hidden;
	
	}
	
#waitmask img
	{
	margin-top:5%;
	margin-left:100px;
	width:60px;
	animation:_mvt_tourne 4s linear infinite;
	float:left;
	}

#waitmask span
	{
	margin-left: 180px;
    font-size: 25px;
    margin-top: 6% !important;
    display: block;
	}

#lmbackground
	{
	z-index:0;
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	opacity:.6;
	background-size: cover;
	filter:brightness(.6)
	}
	
.loadbar_back
	{
	height:2px;
    background-color: #161622;
    border-radius: 2px;
	}
	
#clipmask
	{
	position:absolute;background-color:#000;display:none;opacity:0;z-index:15602;overflow:hidden;top:0px;left:1;cursor:wait;
	}
	
#no_effect
	{
	z-index:11550;display:none;left:0px;top:0px;position:absolute;
	transition:opacity 1s;
	ponter-events:none;
	}


#load_progress
{
transition:width 400ms;
transition-timing-function: ease-in-out;
background-color:#7B94B5;
width:0px;
height:2px;
border-radius:2px;
max-width: 200px;
}

/* inventaire v2 */

/*.menu {
  -webkit-filter: url("#shadowed-goo");
          filter: url("#shadowed-goo");

	
}*/

.menu-item, .menu-open-button {
  /*background: #213142;*/
 
   margin-left:0px;
  position: absolute;

  
  color: white;
  text-align: center;
  line-height: 80px;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  -webkit-transition: -webkit-transform ease-out 200ms;
  transition: -webkit-transform ease-out 200ms;
  transition: transform ease-out 200ms;
  transition: transform ease-out 200ms, -webkit-transform ease-out 200ms;
}

.menu-item
	{
	 border-radius: 100%;
	 width: 120px;
	 height: 120px;
	 top:10px;
	 box-shadow: -2px 9px 8px #111;
	 z-index:2;
	 pointer-events:none;
	}
	
.menu-open-button {
	border-radius:100%;
	width: 100px;
	height: 100px;
	margin-top:-6px;
}
	
.menu-open {
  display: none;
}


.menu-item,.menu-open-button {
	 -webkit-transform: scale(0.8, 0.8) translate3d(0, 0, 0);
          transform: scale(0.8, 0.8) translate3d(0, 0, 0);
}

.menu {
  position: absolute;
  left: 0px;
  margin-left: -46px;
  padding-top: 20px;
  /*padding-left: 80px;*/
  height: 300px;
  box-sizing: border-box;
  font-size: 20px;
  text-align: left;
  opacity:.9;
  float:left;
}

/*
.menu-item:hover {
  background: #213142;
 
}*/

.menu-item:nth-child(3) {
  -webkit-transition-duration: 180ms;
          transition-duration: 180ms;
}
.menu-item:nth-child(4) {
  -webkit-transition-duration: 180ms;
          transition-duration: 180ms;
}
.menu-item:nth-child(5) {
  -webkit-transition-duration: 180ms;
          transition-duration: 180ms;
}
.menu-item:nth-child(6) {
  -webkit-transition-duration: 180ms;
          transition-duration: 180ms;
}
.menu-item:nth-child(7) {
  -webkit-transition-duration: 180ms;
          transition-duration: 180ms;
}
.menu-item:nth-child(8) {
  -webkit-transition-duration: 180ms;
          transition-duration: 180ms;
}
.menu-item:nth-child(9) {
  -webkit-transition-duration: 180ms;
          transition-duration: 180ms;
}
.menu-item:nth-child(10) {
  -webkit-transition-duration: 180ms;
          transition-duration: 180ms;
}
.menu-item:nth-child(11) {
  -webkit-transition-duration: 180ms;
          transition-duration: 180ms;
}
.menu-item:nth-child(12) {
  -webkit-transition-duration: 180ms;
          transition-duration: 180ms;
}

.menu-open-button {
  z-index: 2;
  -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
          transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
  -webkit-transition-duration: 400ms;
          transition-duration: 400ms;
  -webkit-transform: scale(0.9, 0.9) translate3d(0, 0, 0);
          transform: scale(0.9, 0.9) translate3d(0, 0, 0);
  cursor: pointer;
  
}

.menu-open-button:hover {
  -webkit-transform: scale(1, 1) translate3d(0, 0, 0);
          transform: scale(1, 1) translate3d(0, 0, 0);
}

.menu-open:checked + .menu-open-button {
  -webkit-transition-timing-function: linear;
          transition-timing-function: linear;
  -webkit-transition-duration: 200ms;
          transition-duration: 200ms;
  -webkit-transform: scale(0.7, 0.7) translate3d(0, 0, 0);
          transform: scale(0.7, 0.7) translate3d(0, 0, 0);
}

.menu-open:checked ~ .menu-item {
  -webkit-transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
          transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
}
.menu-open:checked ~ .menu-item:nth-child(3) {
  -webkit-transition-duration: 170ms;
          transition-duration: 170ms;
  -webkit-transform: translate3d(80px, -40px, 0);
          transform: translate3d(80px, -40px, 0);
}
.menu-open:checked ~ .menu-item:nth-child(4) {
  -webkit-transition-duration: 250ms;
          transition-duration: 250ms;
  -webkit-transform: translate3d(180px, -40px, 0);
          transform: translate3d(180px, -40px, 0);
}
.menu-open:checked ~ .menu-item:nth-child(5) {
  -webkit-transition-duration: 330ms;
          transition-duration: 330ms;
  -webkit-transform: translate3d(280px, -40px, 0);
          transform: translate3d(280px, -40px, 0);
}
.menu-open:checked ~ .menu-item:nth-child(6) {
  -webkit-transition-duration: 410ms;
          transition-duration: 410ms;
  -webkit-transform: translate3d(380px, -40px, 0);
          transform: translate3d(380px, -40px, 0);
}
.menu-open:checked ~ .menu-item:nth-child(7) {
  -webkit-transition-duration: 490ms;
          transition-duration: 490ms;
  -webkit-transform: translate3d(480px, -40px, 0);
          transform: translate3d(480px, -40px, 0);
}
.menu-open:checked ~ .menu-item:nth-child(8) {
  -webkit-transition-duration: 570ms;
          transition-duration: 570ms;
  -webkit-transform: translate3d(580px, -40px, 0);
          transform: translate3d(580px, -40px, 0);
}
.menu-open:checked ~ .menu-item:nth-child(9) {
  -webkit-transition-duration: 650ms;
          transition-duration: 650ms;
  -webkit-transform: translate3d(680px, -40px, 0);
          transform: translate3d(680px, -40px, 0);
}
.menu-open:checked ~ .menu-item:nth-child(10) {
  -webkit-transition-duration: 730ms;
          transition-duration: 730ms;
  -webkit-transform: translate3d(780px, -40px, 0);
          transform: translate3d(780px, -40px, 0);
}
.menu-open:checked ~ .menu-item:nth-child(11) {
  -webkit-transition-duration: 810ms;
          transition-duration: 810ms;
  -webkit-transform: translate3d(880px, -40px, 0);
          transform: translate3d(880px, -40px, 0);
}
.menu-open:checked ~ .menu-item:nth-child(12) {
  -webkit-transition-duration: 890ms;
          transition-duration: 890ms;
  -webkit-transform: translate3d(980px, -40px, 0);
          transform: translate3d(980px, -40px, 0);
}

#inventaireBox
	{
	visibility:hidden;
	transition: opacity .7s;
	pointer-events:none;
	}
	
	
.objet_inventaire
	{
	width:90px;
	height:90px;
	background-repeat:no-repeat !important;
	background-position:15px 15px !important;
	background-size:70px 70px !important;
	position:absolute;
	overflow:hidden;
	margin:15px 0 0 20px;
	border-radius:45px;
	z-index:11;
	cursor:pointer;
	transition: opacity 1s, background-color .5s, transform .5s;
	opacity:0;
	backface-visibility: hidden;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
	-webkit-tap-highlight-color: rgba(255, 255, 255, 0);

	}
	
#inventaireGoLeft, #inventaireGoRight
	{
	backface-visibility: hidden;
	}
	
#controlButtons
	{
	transform-origin:right top;
	transition:transform 0.6s, opacity .8s, top .5s;
	position:absolute;
	top:-40px;
	z-index:14000;
	padding-top:2px;
	/*width:146px;*/
	right:0;
	cursor: url(./pics/icone_wait.gif),wait;
	backface-visibility: hidden;
	background: #000;
    border-bottom-left-radius: 14px;
    padding: 2px;
    
	}
	
#mapzone
	{
	position:absolute;
	display:none;
	z-index:10100;
	left:10%;
	top:10%;
	height:80%;
	display:inline;
	background-color:#222;
	box-shadow:3px 3px 3px #EEE;
	overflow:hidden;
	}

#invzone
	{
	position:absolute;
	left:10%;
	top:100%;
	height:80%;
	display:inline;
	overflow:hidden;
	padding:5;
	transition:top ease-out .4s,opacity .4s;
	z-index:9;
	}

.invcase
	{
	margin:2;
	width:76;
	height:76;
	background-color:#0005;
	float:left;
	border-radius:10px
	}
	
#mapmask
	{
	position:absolute;
	left:0;
	top:0;
	z-index:10099;
	cursor:pointer;
	display:none;
	}
	
#mapButton
	{
	visibility:hidden;
	position:absolute;
	left:1px;
	top:1px;
	width:45px;
	height:38px;
	transform:scale(0.9);
	z-index:14000;
	border-bottom-right-radius:23px;
	cursor:pointer;
	transition:transform .4s, opacity 1s;
	transform-origin:0px 0px;
	box-shadow:2px 1Px 5px #000;
	}
	
@keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}


@keyframes flipInYbig {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg) scale(1.4);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg) scale(1.4);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg) scale(1.4);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg) scale(1.4);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg) scale(1.4);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg) scale(1.4);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg) scale(1.4);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg) scale(1.4);
  }

  to {
    -webkit-transform: perspective(400px) scale(1.4);
    transform: perspective(400px) scale(1.4);
  }
}



@keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}

#quickdesc
	{
	background-color:#111;
	opacity:.9;
	padding:10px;
	margin:20px;
	font-size:14px;
	ssfont-weight:bold;
	border-radius:10px;
	}
	
@keyframes dialBounceIn {
  from, 20%, 40%, 60%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    -webkit-transform: scale3d(1.06, 1.03, 1.03);
    transform: scale3d(1.06, 1.06, 1.06);
  }

  /*40% {
    -webkit-transform: scale3d(.94, .94, .94);
    transform: scale3d(.94, .94, .94);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(.97, .97, .97);
    transform: scale3d(.97, .97, .97);
  }*/

  to {
    opacity: .93;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes remove_object
{
	40%
		{
		transform:scale(1.5);
		opacity:.8;
		}
	70%
		{
		opacity:.8;
	
		}
	100%
		{
		transform:scale(.001);
		opacity:.1;
	
		}
}


@keyframes add_object
	{
	30%
		{
		transform:scale(2.3);
		}
	100%
		{
		transform:scale(.8);
		}
	
	}
	
@keyframes loose_object
	{
	30%
		{
		transform:scale(1.5);
		opacity:1;
		}
	75%
		{
		transform:scale(0);
		opacity:0;
		}
	100%
		{
		opacity:0;
		}
	}	
	
#avatar
	{
	position:absolute;
	opacity:0;
	transition:opacity .5s;
	width:auto;
	display:none;
	pointer-events:none;
	backface-visibility:hidden;
	}
	
#loadicon
	{
	z-index:60000;position:fixed;left:0px;top:0px;visibility:hidden;width:35px;
	}
	
#minilogo
	{
	color: #BBB;
    font-size: 9px;
    padding: 10px 35px;
    float: left;
	}
	
.ingame_map
	{
	transform: scale(.8);
	transform-origin: 0px 0px;
	z-index:10;
	border:1px solid #666666;
	position:absolute;
	overflow:hidden;
	left:0px;
	top:0px;
	}

.custom_inventory
	{
	transform: scale(.8);
	transform-origin: 0px 0px;
	z-index:10;
	border:0px;
	position:absolute;
	overflow:hidden;
	left:0px;
	top:0px;
	}

	
#mask_interface
	{
	display:none;
	position:absolute;
	top:0;
	left:0;
	bottom:0;
	right:0;	
	}
	
.scroller
	{
	position:absolute;
	cursor:pointer;
	backface-visibility:hidden;
	transition:transform 0.5s, opacity 0.5s, left .5s;
	z-index:10999; /*11180;*/
	transform:scale(0);
	opacity:.8;
	}
	

	
#trophybox
	{
	width:700px;
	height:500px;
	position:absolute;
	text-align:center;
	font-size:30px;
	color: darkred;
	text-shadow: 2px 0 0 #fff, -2px 0 0 #fff, 0 2px 0 #fff, 0 -2px 0 #fff, 1px 1px #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff;
	display:inline;
	top:110%;
	overflow:hidden;
	z-index:12220;
	opacity:0;
	transform:scale(.5);
	}
	
#trophycontent
	{
	position:absolute;
	left:0px;
	top:50px;
	width:700px;
	height:500px;
	z-index:12230;
	}
	
#trophypic
	{
	max-width:250px;
	max-height:250px;
	}

#trophybg1
	{
	width:400px;
	height:200px;
	
	z-index:12221;
	position:absolute;
	left:150px;
	top:95px;
	border-radius:200px / 100px;
	background-color:#DDD;
	opacity:.5;
	animation:trophybg_anim 1.5s linear infinite;
	}
	
#trophybg2
	{
	width:200px;
	height:400px;
	z-index:12222;
	position:absolute;
	left:250px;
	top:10px;
	border-radius:100px / 200px;
	background-color:#DDD;
	opacity:.5;
	animation:trophybg_anim 1.5s linear infinite;
	}

@keyframes trophybg_anim
	{
	0%{transform:rotate(120deg);}
	50%{background-color:#8AF;}
	100%{transform:rotate(480deg);}
	}
	
@keyframes trophy_popin
	{
	20% { top:100px;}
	30% { opacity:1;}
	35% { transform:scale(.9);}
	37% { transform:scale(1.2);}
	39% { transform:scale(1);}
	90% { opacity:1;top:100px;transform:scale(1);}
	100% {top:-400px;transform:scale(.05) translateX(400px);opacity:.4;}
	}
	
#aide_trophees img
	{
	max-width:60px;
	max-height:60px;
	float:left;
	padding-right:20px;
	}
	
#aide_trophees
	{
	font-size:20px;
	font-family
	}
	
.troph_item
	{
	height:70px;
	backface-visibility: hidden;
	}

.troph_item .tname
	{
	padding-top:12px;
	margin-left:80px;
	}

.troph_disabled
	{
	filter:grayscale(100%) blur(1px) contrast(20%);
	opacity:.4;
	    backface-visibility: hidden;
	}

#google_translate_element, .goog-te-gadget-simple, .goog-te-gadget
{
background-color:transparent !important;
}

.goog-te-menu-value
{
color:#DDE !important;
}

.goog-te-gadget-simple
{
border:0px !important;
}

#mobileQuitBt
	{
	padding:5px;
	text-align:center;
	position:fixed;
	font-size:25px;
	left:10%;
	bottom:20px;
	}


/* animatiosn liées aux FX */

@keyframes _fx_oculus {
  10%,90%{
  border-radius: 42% 58% 70% 30% / 45% 45% 55% 55%;
    transform: translate3d(0,0,0) rotateZ(0.01deg);
  }
  34%{
      border-radius: 70% 30% 46% 54% / 30% 29% 71% 70%;
    transform:  translate3d(0,5px,0) rotateZ(0.01deg);
  }
  50%{
    opacity: .89;
    transform: translate3d(0,0,0) rotateZ(0.01deg);
  }
  67%{
    border-radius: 100% 60% 60% 100% / 100% 100% 60% 60% ;
    transform: translate3d(0,-3px,0) rotateZ(0.01deg);
  }
}

@keyframes _fx_flash
{
	5% {filter:brightness(3) saturate(.1) blur(5px) contrast(2) grayscale(1);}
	50% {filter:brightness(50) saturate(0) blur(31px) contrast(10) grayscale(1);}
	95% {filter:brightness(3) saturate(.1) blur(5px) contrast(2) grayscale(1);}
	
}

@keyframes _fx_disto
{
  16.65% {
    transform: skewX(-12deg) skewY(5deg) scale(1.2);
    

  }
  33.3% {
    transform: skewX(10deg) skewY(0deg) scale(1.2);
  }
  49.95% {
    transform: skewX(-6deg) skewY(5deg) scale(1.1);
  }
  66.6% {
    transform: skewX(4deg) skewY(3deg) scale(1.3);
  }
  83.25% {
    transform: skewX(-2deg) skewZ(-3deg) scale(1.2);
  }
  100% {
    transform: skewX(0) skewZ(0) scale(1);
  }
}

@keyframes _fx_neon
{
7% {display:none;opacity:0;}
9% {display:block;opacity:1;}
12% {display:none;opacity:0;}
13% {display:block;opacity:1;}
22% {display:none;opacity:0;}
25% {display:block;opacity:1;}
31% {display:none;opacity:0;}
32% {display:block;opacity:1;}
33% {display:none;opacity:0;}
34% {display:block;opacity:1;}
35% {display:none;opacity:0;}
36% {display:block;opacity:1;}
57% {display:none;opacity:0;}
59% {display:block;opacity:1;}
63% {display:none;opacity:0;}
64% {display:block;opacity:1;}
65% {display:none;opacity:0;}
69% {display:block;opacity:1;}
70% {display:none;opacity:0;}
71% {display:block;opacity:1;}
74% {display:none;opacity:0;}
91% {display:block;opacity:1;}
92% {display:none;opacity:0;}
93% {display:block;opacity:1;}
}

@keyframes _fx_tremble {
  2% {
    transform: translate(0.5px, 0.5px) rotate(-0.5deg); }
  4% {
    transform: translate(0.5px, 2.5px) rotate(1.5deg); }
  6% {
    transform: translate(-0.5px, 1.5px) rotate(0.5deg); }
  8% {
    transform: translate(2.5px, 1.5px) rotate(-0.5deg); }
  10% {
    transform: translate(-1.5px, 0.5px) rotate(1.5deg); }
  12% {
    transform: translate(2.5px, -1.5px) rotate(-0.5deg); }
  14% {
    transform: translate(0.5px, -0.5px) rotate(1.5deg); }
  16% {
    transform: translate(1.5px, 1.5px) rotate(-0.5deg); }
  18% {
    transform: translate(-0.5px, 0.5px) rotate(0.5deg); }
  20% {
    transform: translate(-0.5px, -0.5px) rotate(-0.5deg); }
  22% {
    transform: translate(-1.5px, -1.5px) rotate(-0.5deg); }
  24% {
    transform: translate(1.5px, -0.5px) rotate(1.5deg); }
  26% {
    transform: translate(1.5px, 1.5px) rotate(0.5deg); }
  28% {
    transform: translate(2.5px, 1.5px) rotate(0.5deg); }
  30% {
    transform: translate(2.5px, 0.5px) rotate(1.5deg); }
  32% {
    transform: translate(-0.5px, -0.5px) rotate(0.5deg); }
  34% {
    transform: translate(-1.5px, -0.5px) rotate(-0.5deg); }
  36% {
    transform: translate(-1.5px, 2.5px) rotate(0.5deg); }
  38% {
    transform: translate(2.5px, 2.5px) rotate(0.5deg); }
  40% {
    transform: translate(2.5px, 0.5px) rotate(0.5deg); }
  42% {
    transform: translate(1.5px, 2.5px) rotate(-0.5deg); }
  44% {
    transform: translate(0.5px, -1.5px) rotate(1.5deg); }
  46% {
    transform: translate(2.5px, 0.5px) rotate(1.5deg); }
  48% {
    transform: translate(-0.5px, -0.5px) rotate(1.5deg); }
  50% {
    transform: translate(2.5px, 1.5px) rotate(1.5deg); }
  52% {
    transform: translate(0.5px, 0.5px) rotate(0.5deg); }
  54% {
    transform: translate(-0.5px, -1.5px) rotate(-0.5deg); }
  56% {
    transform: translate(0.5px, 1.5px) rotate(0.5deg); }
  58% {
    transform: translate(2.5px, 0.5px) rotate(0.5deg); }
  60% {
    transform: translate(-1.5px, 0.5px) rotate(0.5deg); }
  62% {
    transform: translate(0.5px, 1.5px) rotate(0.5deg); }
  64% {
    transform: translate(-0.5px, 0.5px) rotate(-0.5deg); }
  66% {
    transform: translate(0.5px, 0.5px) rotate(0.5deg); }
  68% {
    transform: translate(-1.5px, 0.5px) rotate(1.5deg); }
  70% {
    transform: translate(-0.5px, 2.5px) rotate(1.5deg); }
  72% {
    transform: translate(-0.5px, 0.5px) rotate(0.5deg); }
  74% {
    transform: translate(-1.5px, 0.5px) rotate(0.5deg); }
  76% {
    transform: translate(-1.5px, 0.5px) rotate(0.5deg); }
  78% {
    transform: translate(-0.5px, 2.5px) rotate(1.5deg); }
  80% {
    transform: translate(-1.5px, 1.5px) rotate(-0.5deg); }
  82% {
    transform: translate(1.5px, 1.5px) rotate(-0.5deg); }
  84% {
    transform: translate(0.5px, -0.5px) rotate(1.5deg); }
  86% {
    transform: translate(0.5px, -1.5px) rotate(-0.5deg); }
  88% {
    transform: translate(1.5px, 1.5px) rotate(0.5deg); }
  90% {
    transform: translate(2.5px, 0.5px) rotate(-0.5deg); }
  92% {
    transform: translate(2.5px, -0.5px) rotate(-0.5deg); }
  94% {
    transform: translate(-1.5px, 1.5px) rotate(0.5deg); }
  96% {
    transform: translate(-1.5px, 0.5px) rotate(0.5deg); }
  98% {
    transform: translate(-1.5px, 0.5px) rotate(1.5deg); }
  0%, 100% {
    transform: translate(0, 0) rotate(0); } }



/* animations associées aux mouvements d'objets */

@keyframes _mvt_rebond
{
  from,
  20%,
  53%,
  80%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    transform: translate3d(0, 0, 0);
  }

  40%,
  43% {
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    transform: translate3d(0, -4px, 0);
  }
}

@keyframes _mvt_neon
{
7% {display:none;opacity:0;}
9% {display:block;opacity:1;}
12% {display:none;opacity:0;}
13% {display:block;opacity:1;}
22% {display:none;opacity:0;}
25% {display:block;opacity:1;}
31% {display:none;opacity:0;}
32% {display:block;opacity:1;}
33% {display:none;opacity:0;}
34% {display:block;opacity:1;}
35% {display:none;opacity:0;}
36% {display:block;opacity:1;}
57% {display:none;opacity:0;}
59% {display:block;opacity:1;}
63% {display:none;opacity:0;}
64% {display:block;opacity:1;}
65% {display:none;opacity:0;}
69% {display:block;opacity:1;}
70% {display:none;opacity:0;}
71% {display:block;opacity:1;}
74% {display:none;opacity:0;}
91% {display:block;opacity:1;}
92% {display:none;opacity:0;}
93% {display:block;opacity:1;}
}

@keyframes _mvt_tremble
{
  2% {
    transform: translate(0.5px, 0.5px) rotate(-0.5deg); }
  4% {
    transform: translate(0.5px, 2.5px) rotate(1.5deg); }
  6% {
    transform: translate(-0.5px, 1.5px) rotate(0.5deg); }
  8% {
    transform: translate(2.5px, 1.5px) rotate(-0.5deg); }
  10% {
    transform: translate(-1.5px, 0.5px) rotate(1.5deg); }
  12% {
    transform: translate(2.5px, -1.5px) rotate(-0.5deg); }
  14% {
    transform: translate(0.5px, -0.5px) rotate(1.5deg); }
  16% {
    transform: translate(1.5px, 1.5px) rotate(-0.5deg); }
  18% {
    transform: translate(-0.5px, 0.5px) rotate(0.5deg); }
  20% {
    transform: translate(-0.5px, -0.5px) rotate(-0.5deg); }
  22% {
    transform: translate(-1.5px, -1.5px) rotate(-0.5deg); }
  24% {
    transform: translate(1.5px, -0.5px) rotate(1.5deg); }
  26% {
    transform: translate(1.5px, 1.5px) rotate(0.5deg); }
  28% {
    transform: translate(2.5px, 1.5px) rotate(0.5deg); }
  30% {
    transform: translate(2.5px, 0.5px) rotate(1.5deg); }
  32% {
    transform: translate(-0.5px, -0.5px) rotate(0.5deg); }
  34% {
    transform: translate(-1.5px, -0.5px) rotate(-0.5deg); }
  36% {
    transform: translate(-1.5px, 2.5px) rotate(0.5deg); }
  38% {
    transform: translate(2.5px, 2.5px) rotate(0.5deg); }
  40% {
    transform: translate(2.5px, 0.5px) rotate(0.5deg); }
  42% {
    transform: translate(1.5px, 2.5px) rotate(-0.5deg); }
  44% {
    transform: translate(0.5px, -1.5px) rotate(1.5deg); }
  46% {
    transform: translate(2.5px, 0.5px) rotate(1.5deg); }
  48% {
    transform: translate(-0.5px, -0.5px) rotate(1.5deg); }
  50% {
    transform: translate(2.5px, 1.5px) rotate(1.5deg); }
  52% {
    transform: translate(0.5px, 0.5px) rotate(0.5deg); }
  54% {
    transform: translate(-0.5px, -1.5px) rotate(-0.5deg); }
  56% {
    transform: translate(0.5px, 1.5px) rotate(0.5deg); }
  58% {
    transform: translate(2.5px, 0.5px) rotate(0.5deg); }
  60% {
    transform: translate(-1.5px, 0.5px) rotate(0.5deg); }
  62% {
    transform: translate(0.5px, 1.5px) rotate(0.5deg); }
  64% {
    transform: translate(-0.5px, 0.5px) rotate(-0.5deg); }
  66% {
    transform: translate(0.5px, 0.5px) rotate(0.5deg); }
  68% {
    transform: translate(-1.5px, 0.5px) rotate(1.5deg); }
  70% {
    transform: translate(-0.5px, 2.5px) rotate(1.5deg); }
  72% {
    transform: translate(-0.5px, 0.5px) rotate(0.5deg); }
  74% {
    transform: translate(-1.5px, 0.5px) rotate(0.5deg); }
  76% {
    transform: translate(-1.5px, 0.5px) rotate(0.5deg); }
  78% {
    transform: translate(-0.5px, 2.5px) rotate(1.5deg); }
  80% {
    transform: translate(-1.5px, 1.5px) rotate(-0.5deg); }
  82% {
    transform: translate(1.5px, 1.5px) rotate(-0.5deg); }
  84% {
    transform: translate(0.5px, -0.5px) rotate(1.5deg); }
  86% {
    transform: translate(0.5px, -1.5px) rotate(-0.5deg); }
  88% {
    transform: translate(1.5px, 1.5px) rotate(0.5deg); }
  90% {
    transform: translate(2.5px, 0.5px) rotate(-0.5deg); }
  92% {
    transform: translate(2.5px, -0.5px) rotate(-0.5deg); }
  94% {
    transform: translate(-1.5px, 1.5px) rotate(0.5deg); }
  96% {
    transform: translate(-1.5px, 0.5px) rotate(0.5deg); }
  98% {
    transform: translate(-1.5px, 0.5px) rotate(1.5deg); }
  0%, 100% {
    transform: translate(0, 0) rotate(0); } 
}

@keyframes _mvt_brille
{
	50% { filter:brightness(1.6);}
	100% { filter:brightness(.8);}
}

@keyframes _mvt_tourne
{
	100% { transform:rotate(360deg);}
}

@keyframes _mvt_tourne_inverse
{
	100% { transform:rotate(-360deg);}
}


@keyframes _mvt_pulse
{
	30% {transform:scale(1.2); }
	50% {transform:scale(.9); }
	60% {transform:scale(1.3); }
	100% {transform:scale(1); }
}

@keyframes _mvt_tangue
{
	25% {transform:rotate(-15deg); }
	75% {transform:rotate(+15deg); }
	
}

@keyframes _mvt_wobble-vertical
{
  16.65% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
  33.3% {
    -webkit-transform: translateY(-6px);
    transform: translateY(-6px);
  }
  49.95% {
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
  }
  66.6% {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
  83.25% {
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes _mvt_wobble-horizontal
{
  16.65% {
    -webkit-transform: translateX(8px);
    transform: translateX(8px);
  }
  33.3% {
    -webkit-transform: translateX(-6px);
    transform: translateX(-6px);
  }
  49.95% {
    -webkit-transform: translateX(4px);
    transform: translateX(4px);
  }
  66.6% {
    -webkit-transform: translateX(-2px);
    transform: translateX(-2px);
  }
  83.25% {
    -webkit-transform: translateX(1px);
    transform: translateX(1px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes _mvt_wobble-diagonal
{
  16.65% {
    -webkit-transform: translate(8px, -8px);
    transform: translate(8px, -8px);
  }
  33.3% {
    -webkit-transform: translate(-6px, 6px);
    transform: translate(-6px, 6px);
  }
  49.95% {
    -webkit-transform: translate(4px, -4px);
    transform: translate(4px, -4px);
  }
  66.6% {
    -webkit-transform: translate(-2px, 2px);
    transform: translate(-2px, 2px);
  }
  83.25% {
    -webkit-transform: translate(1px, -1px);
    transform: translate(1px, -1px);
  }
  100% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}


@keyframes _mvt_blob
{
  16.65% {
    -webkit-transform: skew(-12deg);
    transform: skew(-12deg);
  }
  33.3% {
    -webkit-transform: skew(10deg);
    transform: skew(10deg);
  }
  49.95% {
    -webkit-transform: skew(-6deg);
    transform: skew(-6deg);
  }
  66.6% {
    -webkit-transform: skew(4deg);
    transform: skew(4deg);
  }
  83.25% {
    -webkit-transform: skew(-2deg);
    transform: skew(-2deg);
  }
  100% {
    -webkit-transform: skew(0);
    transform: skew(0);
  }
}

@keyframes _mvt_buzzer
{
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
   30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
    50% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  60% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
   70% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  80% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
   90% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  100% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
}

@keyframes _mvt_clignotte
{
50% {opacity:0;}

}


@keyframes _mvt_traverse_dg
{
 0% { margin-left:100%;}
100% { margin-left:-100%;}
}

@keyframes _mvt_traverse_gd
{
 0% { margin-left:-100%;}
100% { margin-left:100%;}
}

@keyframes _mvt_traverse_hb
{
 0% { margin-top:-100%;}
100% { margin-top:100%;}
}

@keyframes _mvt_traverse_hb
{
 0% { margin-top:100%;}
100% { margin-top:-100%;}
}



@keyframes savegame
	{
	0% {
		visibility:visible;
		opacity:0;
		}
	50%
		{opacity:1;
		}
	
	100%
		{visibility:hidden;
		opacity:0;
		}
		
	}
	
#mainmenubox
	{
	display:none;
	background-color:#000;
	text-align:center;
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	background-size:cover;
	opacity:0;
	transition:opacity 1s;
	z-index:11699;
	overflow:hidden;
	}
	
#menutitle
	{
	font-size:40px;
	font-family:arial black;
	color:#F3F3FF;
	margin-top:20%;
	position:absolute;
	z-index:10;
	left:0px;
	top:0px;
	width:100%;
	text-shadow: 3px 3px 4px #000;
	}

#droppoint
{
position:absolute;
left:-1000;
top:-1000;
pointer-events:none;
z-index:99998;
width:100px;
height:100px;
opacity:0;
transition:opacity.4s;

}	
	
.viewport::-webkit-scrollbar
{
    width: 3px;
	height:3px;
	text-align: center;
	
}

#messagebox::-webkit-scrollbar
{
    width: 6px;
	height:3px;
	text-align: center;
	
}
 
.viewport::-webkit-scrollbar-track, #messagebox::-webkit-scrollbar-track, .aide_panel::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.7); 
    border-radius: 10px;
	
}
 
.viewport.fenetre::-webkit-scrollbar-track, #messagebox:-webkit-scrollbar-track, .aide_panel:-webkit-scrollbar-track {
   background-color:#080808;
	
}
 
.viewport::-webkit-scrollbar-thumb,#messageboxt::-webkit-scrollbar-thumb,.aide_panel::-webkit-scrollbar-thumb {
    border-radius: 10px;
	background-color:#88BBFF;
	cursor:pointer;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}

.viewport::-webkit-scrollbar-corner,#messagebox::-webkit-scrollbar-corner ,.aide_panel::-webkit-scrollbar-corner 
	{
	background-color:#223;
	
	}

#pausegame
	{
	cursor:pointer;
	bottom:20px;
	right:-100px;
	opacity:0;
	position:absolute;
	width:35px;
	transition:opacity .3s;
	backface-visibility:hidden;
	}

#pauseMode
	{
	position:absolute;
	font-size:100px;
	color:#FFF;
	text-shadow:3px 3px 8px #000;
	left:45%;
	top:45%;
	width:100px;
	height:100px;
	z-index:20400;
	display:none;
	cursor:pointer;
	background: rgba(.3,.3,.3,.5);
    border-radius: 15px;
    padding-left: 5px;
    padding-bottom: 8px;
    line-height: 97px;
	}

#pauseMode.game_paused:before
{
	position:fixed;
	width:100%;
	height:110%;
	top:0;
	left:0;
	background-image:url(/pics/pause_back.jpg);
	filter:blur(5px);
	opacity:.75;
	content:"";
	z-index:-1;
	
	
}

	
#traceline
	{
	position:absolute;
	display:none;
	left:0px;
	top:0px;
	z-index:99998;
	pointer-events:none;
	}
	
#traceline #trace
	{
	stroke:rgb(255,255,255);
	stroke-width:15;
	transition:opacity .5s;
	opacity:0;
	stroke-linejoin:round;
	stroke-linecap:round;
	pointer-events:none;
	}

#inspectMask
	{
	position:absolute;
	left:0;
	top:0;
	border:2px solid orange;
	display:none;
	z-index:10998;
	cursor:crosshair;
	}

#focusline
	{
	position:absolute;
	display:none;
	left:0px;
	top:0px;
	z-index:10998;
	pointer-events:none;
	overflow:hidden;
	}

#focusline #tracefocus
	{
	stroke:rgb(255,255,255);
	stroke-width:20px;
	transition:opacity .5s;
	opacity:.9;
	stroke-linejoin:round;
	stroke-linecap:round;
	pointer-events:none;
	stroke-dasharray:0px 30px;
	stroke-dashoffset: 1000;
	}
	
@keyframes drawline {
  from {
    stroke-dashoffset: 1000;
  }
  to {
    stroke-dashoffset: 0;
  }
}


.objcount
	{
	background-color:rgba(30,30,41,.77);
	position:absolute;
	border-radius:5px;
	width:40px;
	height:22px;
	display:none;
	color:#FFF;
	font-size:12px;
	bottom:62px;
	z-index:20;
	transition:opacity .5s, background-color 1.5s, margin .25s linear;
	opacity:0;
	padding-top:2px;
	backface-visibility:hidden;
	text-align:center;
	pointer-events:none;
	}

.objcount_max
	{
	font-size:9px;
	font-weight:normal;
	padding-left:3px;
	}
	
#newObjectLabel
	{
	font-size:22px;
	padding-top:10px;
	padding-bottom:10px;
	
	}

#takeObjCount
	{
	font-size:20px;
	background-color:rgba(30,30,41,.77);
	position:absolute;
	border-radius:10px;
	width:100px;
	height:33px;
	color:#FFF;
	top:18px;
	left:100px;
	text-align:center;
	}

#loadphrases
	{
	position:absolute;
	bottom:70;
	width:90%;
	left:5%;
	padding:5px;
	text-align:center;
	color:#D4D4D4;
	background-color:rgba(12,12,15,.5);
	font-size:23px;
	font-family:calibri;
	transition:opacity 1.5s;
	opacity:0;
	font-weight:normal;
	}
	
@keyframes thinking {
  0% {
    transform: scale(1) translateY(0px);
  }
  20% {
    transform: scaleY(0.95) scaleX(1.05) translateY(-3px);
  }
  48% {
    transform: scaleY(1.1) scaleX(0.9) translateY(3px);
  }
  68% {
    transform: scaleY(0.98) scaleX(1.02) translateY(-3px);
  }
  80% {
    transform: scaleY(1.02) scaleX(0.98) translateY(3px);
  }
  97%, 100% {
    transform: scale(1) translateY(0px);
  }
}

#clipControls
{
	opacity:0;transition:opacity .5s;position:absolute;z-index:10;width:180;height:30;bottom:0;right:0;
}

#kbSpecialChars
{
	position: absolute;
    left: 100;
    background: #111;
}

#passclip
{
	z-index:10;
	position:absolute;
	display:inline;
	width:130;
	height:30;
	backface-visibility:hidden;
	right: 10px;
    bottom: 10px !important;
	background: linear-gradient(#172935CC,#273945CC);
	transition:opacity 1s;
}

#passclip:active, #togglest:active
{
	position:absolute;
	top:unset;
}

#togglest {
    z-index: 10;
    position: absolute;
    display: inline;
    width: 30;
    height: 30;
    backface-visibility: hidden;
    right: 145px;
    bottom: 10px !important;
    text-decoration:strike;
	opacity:0;
	background: linear-gradient(#172935CC,#273945CC);
	transition:opacity 1s;
}

#clipfullscreen
	{
	position: absolute;
    right: 10px;
    display: block;
    top:10px;
    z-index: 10;
	cursor:pointer;
	backface-visibility:hidden;
	border-radius:3px;
	width:35px;
	border:1px solid #888;
}


#stdrunner
	{
	pointer-events:auto;
	
	}
	
#std_debug
	{
	backface-visibility:hidden;
	display:none;
	z-index:1000000;
	position:absolute;
	bottom:3px;
	right:6px;
	background-color: #7b071d;
    border-radius: 50%;
    padding: 5px;
	cursor:pointer;
	}

.bounding_zone
	{
	display:none;	
	}

#clipPlayer
{
	z-index:1;
	position:absolute;
	left:0;
	top:0px;
	background-color:#000;
	display:none;
}
#jawasplash
{
	transition:opacity 1s;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background-color:#000;
	z-index:2000;
	background: radial-gradient(ellipse at center, #293949 0%,#000000 100%);
}

#splashblock
{
	position:absolute;
	top:45%;
	left:43%;
	opacity:0;
	transform: translateX(-1000px) rotate(-720deg);
	filter: blur(50px);
	font-family:monospace;
	color:#6677BB;
	font-size:17px;
	font-weight:bold;
}
	
@keyframes jawasplash {
  0% {
    -webkit-transform: translateX(-1000px) rotate(-720deg);
            transform: translateX(-1000px) rotate(-720deg);
    -webkit-filter: blur(50px);
            filter: blur(50px);
    opacity: 0;
  }
  25% {
    -webkit-transform: translateX(0) rotate(0deg);
            transform: translateX(0) rotate(0deg);
    -webkit-filter: blur(0);
            filter: blur(0);
    opacity: 1;
  }
  
  40% { transform:translateX(0) rotate(0deg) scale(1); }
  42% { transform:translateX(0) rotate(0deg) scale(1.1); }
  44% { transform:translateX(0) rotate(0deg) scale(1); }
  
	
  75% {
    -webkit-transform: translateX(0) rotate(0deg);
            transform: translateX(0) rotate(0deg);
    -webkit-filter: blur(0);
            filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(550px) rotate(720deg);
            transform: translateX(550px) rotate(720deg);
    -webkit-filter: blur(50px);
            filter: blur(50px);
    opacity: 0;
  }
  
}


#aide_manuel [type="checkbox"]:not(:checked),
#aide_manuel	[type="checkbox"]:checked {
		position: absolute;
		left: -9999px;
	}
#aide_manuel	[type="checkbox"]:not(:checked) + label,
#aide_manuel [type="checkbox"]:checked + label {
		position: relative;
		padding-left: 75px;
		cursor: pointer;
		backface-visibility: hidden;
	}
	
#aide_manuel	[type="checkbox"]:not(:checked) + label:before,
#aide_manuel	[type="checkbox"]:checked + label:before,
#aide_manuel	[type="checkbox"]:not(:checked) + label:after,
#aide_manuel	[type="checkbox"]:checked + label:after {
		content: '';
		position: absolute;
	}
#aide_manuel	[type="checkbox"]:not(:checked) + label:before,
#aide_manuel	[type="checkbox"]:checked + label:before {
		left:0; top: -3px;
		width: 65px; height: 30px;
		background: #DDDDDD;
		border-radius: 15px;
		-webkit-transition: background-color .2s;
		-moz-transition: background-color .2s;
		-ms-transition: background-color .2s;
		transition: background-color .2s;
		backface-visibility: hidden;
	}
#aide_manuel	[type="checkbox"]:not(:checked) + label:after,
#aide_manuel	[type="checkbox"]:checked + label:after {
		width: 20px; height: 20px;
		-webkit-transition: all .2s;
		-moz-transition: all .2s;
		-ms-transition: all .2s;
		transition: all .2s;
		border-radius: 50%;
		background: #7F8C9A;
		top: 2px; left: 5px;
		backface-visibility: hidden;
	}

	/* on checked */
#aide_manuel	[type="checkbox"]:checked + label:before {
		background:#34495E; 
	}
#aide_manuel	[type="checkbox"]:checked + label:after {
		background: #39D2B4;
		top: 2px; left: 40px;
	}

#aide_manuel [type="checkbox"]:checked + label .ui,
#aide_manuel [type="checkbox"]:not(:checked) + label .ui:before,
#aide_manuel [type="checkbox"]:checked + label .ui:after {
		position: absolute;
		left: 6px;
		width: 65px;
		border-radius: 15px;
		font-size: 14px;
		font-weight: bold;
		line-height: 22px;
		-webkit-transition: all .2s;
		-moz-transition: all .2s;
		-ms-transition: all .2s;
		transition: all .2s;
	}
#aide_manuel	[type="checkbox"]:not(:checked) + label .ui:before {
		content: "no";
		left: 32px
		backface-visibility:hidden;
	}
	
#aide_manuel	[type="checkbox"]:checked + label .ui:after {
		content: "yes";
		color: #39D2B4;
		backface-visibility:hidden;
	}
#aide_manuel	[type="checkbox"]:focus + label:before {
		border: 1px dashed #777;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
		margin-top: -1px;
	}

#aide_manuel div div
{
	height:35px;
}

#cloud_connect
	{
    width: 60%;
    display: block;
    position: absolute;
    margin-left: 20%;
    bottom: -180;
    border-radius: 15px;
    background-color: rgba(30,30,40,.95);
	box-shadow: 0px 0px 3px 3px #000;
	transition: bottom .4s;
	z-index: 200000;
	backface-visibility: hidden;
	border-left: 6px solid rgb(85, 85, 85);
	margin-bottom: -5px;
	transform-origin: center 15%;
	}
	
video::-webkit-media-text-track-container 
{
    transform: translateY(-3%) !important;
    position: relative;    
  }
  
#tactilekeyboard
{
	display:none;
}

#kbbutton
{
	width: 63px;
    height: 30px;
    padding-top: 2px;
    float: right;
    cursor: pointer;
}

#tactilekeyboard a {
    display: inline-block;
    color: #FFF;
    width: 50;
    height: 42;
    margin-top: 10;
    font-size: 30;
    font-family: courier;
    font-weight: bold;
    text-align: center;
    border: 1px solid #DDD;
    border-radius: 5px;
    margin: 1px;
    padding-top: 8px;
    box-shadow: 0px 3px #888;
    margin-bottom: 5;
}

#tactilekeyboard #lettres a
{
	background-color:#5f8e5f3b;
}

#tactilekeyboard #chiffres a
{
	background-color:#ef903d70;
}

#tactilekeyboard #lettres a.maj
{
    font-size: 20px;
    font-style: italic;
    background-color: #448;
    padding-top: 16px;
    height: 34px;
}

#tactilekeyboard #lettres a.del
{
    background: url(./pics/kbback.png) 6px 10px no-repeat crimson;
    color: transparent;
    text-shadow: none;
}

#tactilekeyboard a.space
{
background: url(/pics/kbspace.gif) 70px 35px no-repeat;
width:180px;
}

#menuversion
{
    position: absolute;
    left: 10;
    top: 10;
    font-size: 10px;
    color: #CCC;
    text-shadow: 1px 1px 0px #000;
	text-align:left;
}