@font-face {
	font-family: "BebasNeue";
	src: url('../assets/fonts/BebasNeue-webfont.ttf');}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;}
	
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
    display: block;}
    

	
body {
    line-height: 1;}
	
ol, ul {
    list-style: none;}
	
blockquote, q {
    quotes: none;}
	
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;}
	
table {
    border-collapse: collapse;
    border-spacing: 0;}

html, body{
    margin: 0;
    padding: 0;
    overflow: hidden;}
 
* {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;}

b{
    font-weight: bold;}

i{
    font-style: italic;}

body{
    color: white;
    background: rgb(0, 0, 0);
    font-family: helvetica, arial, verdana, sans-serif;
    font-size: 1em;
    overflow: auto;
    font-weight: lighter;}

img {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
    
    }

.button a:hover{
    background: url(img/tbg-dark.png) left top;}

.button a{
    color: white;
    display: block;
    margin: -10px;
    padding: 20px;
    text-decoration: none;
    font-weight: bolder;}

.WSEStage .textbox, #NvlTb{ }
    

    
DIV#tb_dialog_name.name,
DIV#tb_dialog3_name.name   /*Name of the character talking and diaolog box background*/ {
	width: 50px !important;
    height: auto !important;
	top: -60px;
    left: -22px;
	box-shadow: 0 0 0px #ac4827;
    border-radius: 0px; 
	padding : 0px 0px 0px 0px; 
	position: absolute;
	background: transparent !important;
	background-size:contain;
	background-repeat:no-repeat;
	background-position:top;
	background-origin:border-box;
	text-align:right;
    font-family: 'BebasNeue', sans-serif;
    font-weight: normal !important;	
	font-size: 3em;
	line-height: 1.2em;
	letter-spacing: 0px;
    text-shadow: 0px 0px 0px transparent;
    color: #d27e66;	}  
    

	DIV#tb_dialog2_name.name   /*Name of the character talking and diaolog box background*/ {
	width: 50px !important;
    height: auto !important;
	top: -60px;
    left: -42px;
	box-shadow: 0 0 0px #ac4827;
    border-radius: 0px; 
	padding : 0px 0px 0px 0px; 
	position: absolute;
	background: transparent !important;
	background-size:contain;
	background-repeat:no-repeat;
	background-position:top;
	background-origin:border-box;
	text-align:right;
    font-family: 'BebasNeue', sans-serif;
    font-weight: normal !important;	
	font-size: 3em;
	line-height: 1.2em;
	letter-spacing: 0px;
    text-shadow: 0px 0px 0px transparent;
    color: #ac4827;	}
    
DIV#tb_dialog_text.text {
	/*top: -50px;*/
    /*left: -20px;*/
	box-shadow: 0 0 0px ;
    border-radius: 0px; 
	padding : 0px 20px 0px 15px; 
	position: absolute;
	background-position:top;
	background-origin:border-box;
	text-align:left;
    font-family: 'BebasNeue', sans-serif;
    font-weight: regular;
	font-size: 3em;
	line-height: 0.85em;
	letter-spacing: 0em;
    text-shadow: 0px 0px 0px;    
    color: #791e05;	}

DIV#tb_dialog3_text.text  /*Text of the character talking */ {
	/*top: -50px;*/
    /*left: -20px;*/
	box-shadow: 0 0 0px ;
    border-radius: 0px; 
	padding : 0px 20px 0px 15px; 
	position: absolute;
	background-position:top;
	background-origin:border-box;
	text-align:left;
    font-family: 'BebasNeue', sans-serif;
    font-weight: regular;
	font-size: 3em;
	line-height: 0.85em;
	letter-spacing: 0em;
	-webkit-text-shadow: 5px 0px 0px rgba(210,125,102,1);
	-moz-text-shadow: 5px 0px 0px rgba(210,125,102,1);
	text-shadow: 5px 0px 0px rgba(210,125,102,1);
    color: #791e05;	}

DIV#tb_dialog2_text.text  /*Text of the character talking */ {
	/*top: -50px;*/
    /*left: -20px;*/
	box-shadow: 0 0 0px ;
    border-radius: 0px; 
	padding : 0px 20px 0px 15px; 
	position: absolute;
	background-position:top;
	background-origin:border-box;
	text-align:left;
    font-family: 'BebasNeue', sans-serif;
    font-weight: regular;
	font-size: 3em;
	line-height: 0.85em;
	letter-spacing: 0em;
	text-shadow: 0px 0px 0px ;
    color: #d27e66;	}
	
DIV#tb_logo.asset.textbox,
DIV#tb_logo2.asset.textbox {
	padding : 0px 0px 0px 0px; 
	border: 0px #888888 solid;
	text-align:right;
    font-family: 'BebasNeue', sans-serif;
    font-weight: regular;
	font-size: 9em;
	line-height: 0.75em;
	letter-spacing: -0.03em;
    text-shadow: 0px 0px 0px gray;
	background: transparent !important;	
	color: #791e05; }	

	
DIV#tb_beige.asset.textbox  /* background */ {
	padding : 0px 0px 0px 0px; 
	background: #d27e66 !important;}

DIV#tb_brown.asset.textbox,
DIV#tb_brown2.asset.textbox {
        padding : 0px 0px 0px 0px;
		background-color: transparent;
        background-image: linear-gradient(45deg, #ac4827 25%, transparent 25%, transparent 75%, #ac4827 75%, #ac4827), 
linear-gradient(-45deg, #ac4827 25%, transparent 25%, transparent 75%, #ac4827 75%, #ac4827);
        background-size: 20px 20px;
}
		
	DIV#tb_brown3.asset.textbox	{
        padding : 0px 0px 0px 0px;
		background-color: #ac4827;
        background-image: linear-gradient(45deg, #d27e66 25%, transparent 25%, transparent 75%, #d27e66 75%, #d27e66), 
linear-gradient(-45deg, #d27e66 25%, transparent 25%, transparent 75%, #d27e66 75%, #d27e66);
        background-size: 26px 26px;
		}	
	
	DIV#tb_brown4.asset.textbox {
	   background-image: url("../assets/images/tile.png");
	       background-repeat: repeat;		  
}

DIV#led.menu .button:hover{
    background: #ac4827;
    border: 0px solid white;
    line-height: 1.1em;
    color: #d27e66; 	
}

DIV#led.menu .button {
    float: right;
    color: #791e05;
}

DIV#led.menu {
display: block;
margin-bottom: 20px;
width: 100%;
background: transparent;
color: #d27e66;
left: 32%;
top: 76%;
z-index: 8388888000;
max-width: 500px !important;
}

DIV#led.menu::after {
    position: absolute;
    right: -12px !important;
    top: 36px;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background-color: #791e05;
    box-shadow: inset 0px 1px 0px rgba(0,0,0,.1);
    -webkit-animation: led .8s infinite;
    -moz-animation: led .8s infinite;
    -ms-animation: led .8s infinite;
    -o-animation: led .8s infinite;
    animation: led .8s infinite;
	content: "";
bottom: auto;
right: -18px;
border-style: solid;
border-color: transparent !important;
display: block;
}

DIV#bath.menu .button:hover{
    background: #791e05;
    border: 0px solid white;
    line-height: 1.1em;
    color: #d27e66; 	
}

DIV#bath.menu .button {
    float: right;
    color: #791e05;
}

DIV#bath.menu {
display: block;
margin-bottom: 20px;
width: 100%;
background: transparent;
color: #791e05;
left: -33.5%;
top: 60%;
max-width: 500px !important;
}

	/* keyframes */
@-webkit-keyframes led {
  from {
    opacity:.2;
  }
  
  to {
    opacity:1;
  }
}

@-moz-keyframes led {
  from {
    opacity:.2;
  }
  
  to {
    opacity:1;
  }
}

@-ms-keyframes led {
  from {
    opacity:.2;
  }
  
  to {
    opacity:1;
  }
}

@-o-keyframes led {
  from {
    opacity:.2;
  }
  
  to {
    opacity:1;
  }
}

@keyframes led {
  from {
    opacity:.2;
  }
  
  to {
    opacity:1;
  }
}
/* FIN point rouge qui clignote*/
	
	
	
DIV#tb_dark.asset.textbox, 
DIV#tb_dark2.asset.textbox, 
DIV#tb_dark3.asset.textbox,
DIV#tb_dark4.asset.textbox,
DIV#tb_dark5.asset.textbox,
DIV#tb_dark6.asset.textbox,
DIV#tb_dark7.asset.textbox,
DIV#tb_dark8.asset.textbox,
DIV#tb_dark9.asset.textbox,
DIV#tb_dark10.asset.textbox,
DIV#tb_dark11.asset.textbox,
DIV#tb_dark12.asset.textbox,
DIV#tb_dark13.asset.textbox,
DIV#tb_dark14.asset.textbox,
DIV#tb_dark15.asset.textbox,
DIV#tb_dark72.asset.textbox {
	padding : 0px 0px 0px 0px; 
	background: #791e05 !important;}
	
DIV#tb_dada_name.name   /*Name of the character talking and diaolog box background*/ {
	width: 50px !important;
    height: auto !important;
	top: -60px;
    left: 190px;
	box-shadow: 0 0 0px #ac4827;
    border-radius: 0px; 
	padding : 0px 0px 0px 0px; 
	position: absolute;
	background: transparent !important;
	background-size:contain;
	background-repeat:no-repeat;
	background-position:top;
	background-origin:border-box;
	text-align:right;
    font-family: 'BebasNeue', sans-serif;
    font-weight: normal !important;	
	font-size: 3em;
	line-height: 1.2em;
	letter-spacing: 0px;
    text-shadow: 0px 0px 0px transparent;
    color: #791e05;	}
	
	DIV#tb_dada_text.text  /*Text of the character talking */ {
	/*top: -50px;*/
    /*left: -20px;*/
	box-shadow: 0 0 0px ;
    border-radius: 0px; 
	padding : 0px 20px 0px 15px; 
	position: absolute;
	background-position:top;
	background-origin:border-box;
	text-align:right;
    font-family: 'BebasNeue', sans-serif;
    font-weight: regular;
	font-size: 3em;
	line-height: 0.85em;
	letter-spacing: 0em;
	text-shadow: 0px 0px 0px ;
    color: #ac4827;	}

	
DIV#tb_sub.asset.textbox  /* Logo */ {
	padding : 0px 0px 0px 0px; 
	border: 0px #888888 solid;
	text-align:right;
    font-family: 'BebasNeue', sans-serif;
    font-weight: regular;
	font-size: 3em;
	line-height: 0.75em;
	letter-spacing: -0.03em;
    text-shadow: 0px 0px 0px gray;
	background: transparent !important;	
	color: #ac4827; }		

#NvlTb p{
    margin-bottom: 10px;}

.WSEStage .textbox .name{
    position: absolute;
    top: -45px;
    left: 0;
    background: rgb(0, 0, 0);
    background: rgba(0, 0, 0, 0.8);
    border-top: 0px solid rgba(255, 255, 255, 0.3);
    border-bottom: 0px solid rgba(255, 255, 255, 0.3);
    padding: 5px;
    padding-left: 10px;
    box-shadow: 0 0 5px #ac4827;
    border-radius: 10px;
    min-width: 150px;
    min-height: 30px;
    font-size: 16px;
    text-align: center;}

.menu{
    z-index: 51000;
    top: 61.7%;
    position: absolute;
    width: 50%;
    right: 11,6%;}

#JifeMainMenu{
    z-index: 10000;
    background: url('img/106.jpg') center top;
    text-align: center;
    width: 100%;
    height: 100%;}

#JifeMainMenu .JifeMenuWrapper{
    position: absolute;
    /*  top: 50px; */
    bottom: 50px;
    padding: 20px;
    left: 200px;
    right: 200px;
    padding-top: 20px;
    background: url(img/tbg.png) left top;
    /*  border-radius: 10px; */
    box-shadow: 10px 10px 20px #ac4827;
    border: 1px solid gray;
    border-left: 1px solid white;
    border-top: 1px solid white;}

.JifeDecisionButton, .menu .button{
    margin: auto;
  
    cursor: pointer;
    box-shadow: 5px 5px 10px #ac4827;
    /*  border-radius: 10px; */
    overflow: hidden;
    background: url(img/tbg.png) left top;
    border: 1px solid gray;
    border-left: 1px solid white;
    border-top: 1px solid white;}

.menu .button:last-child{
    margin-bottom: 0;}

.menu .button {
   width: 20%;
   border: 0px #888888 solid;
   text-align: left;
   padding: 20px 20px 15px 20px;
   margin-bottom: 2%;
   background: none;
   border-top-left-radius: 20px;
   border-top-right-radius: 20px;
   border-bottom-left-radius: 20px;
   border-bottom-right-radius: 20px;
   box-shadow: 0px 0px 0px transparent;
   display: inline-block;
   float: left;
   top: 1px;
   position: relative;	
   font-family: 'BebasNeue', sans-serif;
   font-weight: normal !important;
   font-size: 3em;
   line-height: 1.2em;
   letter-spacing: 0px;
   text-shadow: 0px 0px 0px transparent;
   color: #d27e66;
   }

.menu .button:hover{
    background: #d27e66;
    border: 0px solid white;
    line-height: 1.1em;
    color: #ac4827; 	}
    
DIV#WSEChoiceMenu.menu{
    display: block;
    margin-bottom: 20px;    
    width: 100%;
    background: transparent;
    color: #d27e66;
    left:4%;
    top:76%;
    z-index: 78968767556;
    max-width: 500px !important;     }
    
   
   DIV#redo.menu {
    z-index: 51000;
    top: 76%;
    left: 2%;
    position: absolute;
    width: 100%;
    right: 11,6%;
}

DIV#redo.menu .button:hover{
    background: #ac4827;
    border: 0px solid white;
    line-height: 1.1em;
    color: #d27e66; 	
}

DIV#redo.menu .button {
    background: #d27e66;
    width: 45%;
    float: left;
    color: #791e05;
}

DIV#redo.menu .button:hover{
    background: #ac4827;
    border: 0px solid white;
    line-height: 1.1em;
    color: #d27e66; 	
}


.WSEStage{
    line-height: 1.5em;
    background: #ac4827;
    overflow: hidden;
    position: absolute;		}


#WSELoadingScreen
{
    background: #d27e66;
    color: #d27e66;
    font-weight: bolder;
    font-size: 0.8em;
}

#WSELoadingScreen .container
{
    position: absolute;
    left: 20%;
    top: 30%;
    right: 20%;
    max-width: 600px;
    margin: auto;
}

#WSELoadingScreen .container .logo {
    text-align: center;
    margin-bottom: 1%;
}

#WSELoadingScreen .container .heading
{
    padding-left: 10px;
    padding-right: 10px;
}

#WSELoadingScreen .container .progressBar
{
    background: #ac4827;
    border-radius: 0px;
    margin-top: 5px;
    border: 0px solid rgb(20, 20, 20);
    
}

#WSELoadingScreenProgress
{
    height: 20px;
    background: #791e05;
    text-align: right;
    border-radius: 0px;
}

#WSELoadingScreenPercentage
{
    float: right;
}



.loadingScreen .progress {
  margin: 0 auto;
  width: 400px;
}

.progress {
  padding: 6px;
  background: transparent;
  border-radius: 0x;
}

.progress-bar {
  height: 24px;
  background: transparent;
  border-radius: 0px;
  background-image: none;
  
}









.WSESavegameMenu{
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.6);}

.WSESavegameMenu .list{
    border: 1px solid white;
    padding: 5px;
    position: absolute;
    right: 5px;
    top: 5px;
    bottom: 5px;
    left: 200px;
    overflow-y: auto !important;}

.WSESavegameMenu .button{
    border: 1px solid rgb(200, 200, 200);
    padding: 3px;
    background: rgba(0, 0, 0, 0.4);
    margin-bottom: 5px;
    cursor: pointer;}

.WSESavegameMenu .button[type=button]{
    display: block;
    color: white;
    font-weight: bold;
    font-size: 1.1em;
    width: 99%;}

.WSESavegameMenu .button:hover, .WSESavegameMenu .button:focus{
    border: 1px solid white;
    background: rgba(0, 0, 0, 0.9);}

.WSESavegameMenu .button .elapsed{
    float: right;}

.WSESavegameMenu .list{
    overflow: hidden;}

.WSESavegameMenu .list .active{
    background: rgba(0, 0, 0, 1);}

.WSESavegameMenu .list .button .name{
    font-weight: bold;}

.WSESavegameMenu .panel{
    width: 190px;
    position: absolute;
    left: 5px;
    top: 5px;
    bottom: 5px;}

.WSEUIContainer{
    background: rgba(0, 0, 0, 0.6);
    color: white;
    position: absolute;
    z-index: 200000;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    cursor: default;}

.WSEUIDialog{
    background: rgba(0, 0, 0, 0.6);
    border: 1px solid white;
    padding: 20px;
    width: 50%;
    margin: auto;
    margin-top: 10%;
    box-shadow: 5px 5px 10px #ac4827;}

.WSEUIDialog .button{
    background: rgba(0, 0, 0, 0.6);
    border: 1px solid white;
    padding: 10px;
    margin-right: 10px;
    color: white;
    cursor: pointer;
    font-weight: bold;
    font-size: 1.1em;
    min-width: 100px;
    text-align: center;}

.WSEUIDialog .button:hover, .WSEUIDialog .button:hover:focus{
    background: rgba(0, 0, 0, 1);}

.WSEUIDialog .title{
    font-weight: bold;
    margin-bottom: 10px;
    font-size: 1.2em;}

.WSEUIDialog .message{
    margin-bottom: 20px;}

.WSEUIDialog .input{
    display: block;
    margin-bottom: 20px;
    width: 80%;
    padding: 5px;
    background: #ac4827;
    color: white;}

.WSEButton{
    border: 1px solid white !important;
    padding: 3px;
    cursor: pointer;
    background: rgba(0, 0, 0, 0.8);}

input:disabled{
    opacity: 0.3;}

.parseError {
    max-width: 600px;
    padding: 20px;
    background: red;
    color: white;
    border: 2px solid darkred;
    margin: auto;
    margin-top: 50px;
    border-radius: 10px;}

.parseError h1 {
    font-weight: bold;
    font-size: 28px;
    margin-bottom: 20px;}

.parseError .errors {
    background: white;
    color: #ac4827;
    padding: 10px;
    font-family: monospace;}
    
    

    .psychos  {
    opacity: 1;
    
    }

.parseError div, .parseError p, .parseError h2, .parseError h3 {
    margin-bottom: 20px;}

#tb_chevron_1 {
	background: 
	linear-gradient(135deg, #d27e66 25%, transparent 25%) -20px 0,
	linear-gradient(225deg, #d27e66 25%, transparent 25%) -20px 0,
	linear-gradient(315deg, #d27e66 25%, transparent 25%),
	linear-gradient(45deg, #d27e66 25%, transparent 25%);    
	background-size: 40px 40px;
	background-color: #791e05; }

#tb_chevron_2 {
	background: 
	linear-gradient(45deg, #ac4827 25%, transparent 25%) -20px 0,
	linear-gradient(315deg, #ac4827  25%, transparent 25%) -20px 0,
	linear-gradient(225deg, #ac4827  25%, transparent 25%),
	linear-gradient(135deg, #ac4827 25%, transparent 25%);    
	background-size: 40px 40px;
	background-color: rgb(121, 30, 5); }


	
		
#tb_tartan {
	background-color: hsl(220, 30%, 60%);
	background-image: repeating-linear-gradient(transparent, transparent 50px, rgba(0,0,0,.4) 50px, rgba(0,0,0,.4) 53px, transparent 53px, transparent 63px, rgba(0,0,0,.4) 63px, rgba(0,0,0,.4) 66px, transparent 66px, transparent 116px, rgba(0,0,0,.5) 116px, rgba(0,0,0,.5) 166px, rgba(255,255,255,.2) 166px, rgba(255,255,255,.2) 169px, rgba(0,0,0,.5) 169px, rgba(0,0,0,.5) 179px, rgba(255,255,255,.2) 179px, rgba(255,255,255,.2) 182px, rgba(0,0,0,.5) 182px, rgba(0,0,0,.5) 232px, transparent 232px),
	repeating-linear-gradient(270deg, transparent, transparent 50px, rgba(0,0,0,.4) 50px, rgba(0,0,0,.4) 53px, transparent 53px, transparent 63px, rgba(0,0,0,.4) 63px, rgba(0,0,0,.4) 66px, transparent 66px, transparent 116px, rgba(0,0,0,.5) 116px, rgba(0,0,0,.5) 166px, rgba(255,255,255,.2) 166px, rgba(255,255,255,.2) 169px, rgba(0,0,0,.5) 169px, rgba(0,0,0,.5) 179px, rgba(255,255,255,.2) 179px, rgba(255,255,255,.2) 182px, rgba(0,0,0,.5) 182px, rgba(0,0,0,.5) 232px, transparent 232px),
	repeating-linear-gradient(125deg, transparent, transparent 2px, rgba(0,0,0,.2) 2px, rgba(0,0,0,.2) 3px, transparent 3px, transparent 5px, rgba(0,0,0,.2) 5px); }