body {
    background-color: #222222;
	/**background-color: rgba(34,34,34,0.3);*/     /* uncomment this to have transparency in OBS with CLR browser*/
    margin:0;
    padding:0;
	overflow:hidden;  /* mettre hidden pour cacher la barre de défilement*/
    font-family: Arial;

    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */

    /*-webkit-app-region: drag;*/
}
#page {
    background-color: #222222;
}

#expired {
    position: absolute;
    background-color:rgba(200,0,0,0.9);
    color: #ffffff;
    height: 100%;
    width: 100%;
    z-index: 9999999;
    font-size: 2em;
    font-weight: bold;
    text-align: center;
    display: None;
}

#drag {
    position: absolute;
    background-color:rgba(255,255,0,0);
    z-index:10;
    width:50%;
    height:50%;
    top: 25%;
    left: 25%;
    /*-webkit-user-select: none;*/
    -webkit-app-region: drag;
}
#drag:hover {
    cursor: move;
}

#drag_overlays_cont {
    position: absolute;
    background-color:rgba(128,128,255,0.5);
    z-index:999;
    width:100%;
    height:100%;
    top: 0;
    left: 0;
    border: 3px solid #ffff00;
    box-sizing: border-box;
    display: none;
}
#drag_overlays {
    position: relative;
    width:94%;
    height:94%;
    top: 3%;
    left: 3%;
    -webkit-app-region: drag;
    pointer-events: auto;
}

#container {
    color: #ffffff;
	left:0px;
	top:80px;
	bottom:0px;
	right:-17px;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;  /* Important pour éviter les lenteurs de scroll sur l'iPad */
	position:absolute;  				/* enlever le mode absolute pour les tablettes */
    height: auto;

    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */

    /*-webkit-app-region: drag;*/
}
#upper_part {
	color: #ffffff;
}
canvas {
    margin:0px;
    padding:0px;
    position:absolute;
	/*position:relative;*/
    z-index:4;
    background-color:rgba(0,0,0,0);
    transition-property: background-color, top;
    transition-duration: 0.5s;
}

.canvasB {
    z-index:5;
	/*position:relative;
	margin-left:-100px;*/
}

#tableau {
	/*color:#ffffff;*/
}

#timing {
    border-collapse: collapse;
    font-weight: normal;
    font-family: Arial;
    font-size: 24px;
    margin:0px;
    padding:0px;
}

.ligne0 {
    position:absolute;
    background-color : #555555;
    overflow:hidden;
    text-overflow:clip ;
    white-space:nowrap;
    width:100%;
    z-index:4;
    height:40px;
	left:0;
	line-height:40px;
    font-weight: normal;
    font-family :Arial;
    font-size: 24px;
}
.ligne {
    overflow:hidden;
    text-overflow:clip ;
    white-space:nowrap;

    position:absolute;
    margin:0px;
    padding:0px;
    width:100%;
    transition-property: top;
    transition-duration: 0.5s;

    z-index:3;
	left:0;

	color:#ffffff;
}
.ligneB {
    transition-property: background-color;
}
.ligneM {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index:6;
}

/*.ligneH:hover {	background-color:rgba(136,136,136,0.5);	z-index:5;}*/ /* Se trouve dans timing.html */


.marge { display:inline-block;width: 8px; }





.clubname {width: 42px; text-align:center; display:inline-block; color:#999999;font-weight: bold;
    overflow:hidden;
    text-overflow:clip ;
    white-space:nowrap;
	vertical-align:top;
}
#clubname00 {display:inline-block;color: #9e9e9e;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#clubname00:hover {color:#ffffff;cursor:pointer;}

.gain {width: 42px; text-align:center; display:inline-block; color:#999999;font-weight: bold;  }
#gain00 {display:inline-block;color: #9e9e9e;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#gain00:hover {color:#ffffff;cursor:pointer;}

.cgain {width: 42px; text-align:center; display:inline-block; color:#999999;font-weight: bold;  }
#cgain00 {display:inline-block;color: #9e9e9e;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#cgain00:hover {color:#ffffff;cursor:pointer;}


.pos {width: 42px; text-align:center; display:inline-block; color:#69b3b0;font-weight: bold;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#pos00 {display:inline-block;color: #9e9e9e;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#pos00:hover {color:#ffffff;cursor:pointer;}

.cpos {width: 42px; text-align:center; display:inline-block; color:#69b3b0;font-weight: bold;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#cpos00 {display:inline-block;color: #9e9e9e;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#cpos00:hover {color:#ffffff;cursor:pointer;}

.spos {width: 42px; text-align:center; display:inline-block; color:#69b3b0;font-weight: bold;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#spos00 {display:inline-block;color: #9e9e9e;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#spos00:hover {color:#ffffff;cursor:pointer;}

.scpos {width: 42px; text-align:center; display:inline-block; color:#69b3b0;font-weight: bold;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#scpos00 {display:inline-block;color: #9e9e9e;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#scpos00:hover {color:#ffffff;cursor:pointer;}

.num {width:50px; text-align:center; display:inline-block; font-weight: bold; opacity:0.75;}
#num00 {display:inline-block;font-weight: bold;color: #9e9e9e; opacity: 1;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#num00:hover {color:#ffffff;cursor:pointer;}

.name {padding-left:8px; width:342px; background-color:rgba(0,0,0,0); margin-right:0px;display:inline-block; font-weight: bold;
    overflow:hidden;
    text-overflow:clip ;
    white-space:nowrap;
	vertical-align:top;
}
#name00 {display:inline-block;color: #9e9e9e;font-weight: bold;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#name00:hover {color:#ffffff;cursor:pointer;}

.ir {text-align:center; display:inline-block; font-weight: bold; opacity:0.75}
#ir00 {display:inline-block;font-weight: bold;color: #9e9e9e; opacity: 1;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#ir00:hover {color:#ffffff;cursor:pointer;}

.lic {text-align:center; display:inline-block; font-weight: bold; opacity:0.75}
/*.lic {position:relative;top:-0px;vertical-align:middle;text-align:center; width: 72px; display:inline-block; font-weight: bold; opacity:0.75}*/
#lic00 {display:inline-block;font-weight: bold;color: #9e9e9e; opacity: 1;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#lic00:hover {color:#ffffff;cursor:pointer;}


.speed {text-align:center; display:inline-block; font-weight: bold;}
#speed00 {display:inline-block;font-weight: bold;color: #9e9e9e;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#speed00:hover {color:#ffffff;cursor:pointer;}

.topspeed {text-align:center; display:inline-block; font-weight: bold; color:#ff5555}
#topspeed00 {display:inline-block;font-weight: bold;color: #9e9e9e;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#topspeed00:hover {color:#ffffff;cursor:pointer;}

.accel {text-align:center; display:inline-block; font-weight: bold;}
#accel00 {display:inline-block;font-weight: bold;color: #9e9e9e;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#accel00:hover {color:#ffffff;cursor:pointer;}


.apex_speed {text-align:center; display:inline-block; font-weight: bold;}
#apex_speed00 {display:inline-block;font-weight: bold;color: #9e9e9e;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#apex_speed00:hover {color:#ffffff;cursor:pointer;}

.max_speed {text-align:center; display:inline-block; font-weight: bold;}
#max_speed00 {display:inline-block;font-weight: bold;color: #9e9e9e;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#max_speed00:hover {color:#ffffff;cursor:pointer;}

.rel {background-color:rgba(0,0,0,0);display:inline-block;padding-left:8px; color: #9e9e9e; font-weight: bold}
#rel00 {display:inline-block; color: #9e9e9e; font-weight: bold;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#rel00:hover {color:#ffffff;cursor:pointer;}

.delta {vertical-align: top;visibility:hidden;display:inline-block;color: #0000ff; }
#delta00 {visibility:visible; display:inline-block; text-align:center; color: #9e9e9e; font-weight: bold;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#delta00:hover {color:#ffffff;cursor:pointer;}

.gap {display:inline-block;padding-left:8px; color: #9e9e9e; font-weight: bold}
#gap00 {display:inline-block; font-weight: bold;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#gap00:hover {color:#ffffff;cursor:pointer;}

.last {text-align:center; transition-property: background-color;padding-left:0px;padding-right:0px;display:inline-block;font-weight: bold;}
#last00 {display:inline-block;color: #9e9e9e; font-weight: bold;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#last00:hover {color:#ffffff;cursor:pointer;}

.best {text-align:center; transition-property: background-color;padding-left:0px;padding-right:0px;display:inline-block;font-weight: bold;}
#best00 {display:inline-block;color: #9e9e9e; font-weight: bold;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#best00:hover {color:#ffffff;cursor:pointer;}

.lc {text-align:center; padding-left:0px;display:inline-block;font-weight: bold}
#lc00 {display:inline-block;color: #9e9e9e; font-weight: bold;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#lc00:hover {color:#ffffff;cursor:pointer;}

.distpct {text-align:center; padding-left:0px;display:inline-block;font-weight: bold}
#distpct00 {display:inline-block;color: #9e9e9e; font-weight: bold;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#distpct00:hover {color:#ffffff;cursor:pointer;}

.stint {text-align:center; background-color:rgba(0,0,0,0);display:inline-block;padding-left:0px;color: #ffff00; font-weight: bold}
#stint00 {display:inline-block;color: #9e9e9e; font-weight: bold;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#stint00:hover {color:#ffffff;cursor:pointer;}

.pit {text-align:center; display:inline-block;color: #ff9900; padding-left:0px; font-weight: bold}
#pit00 {display:inline-block;color: #9e9e9e; font-weight: bold;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#pit00:hover {color:#ffffff;cursor:pointer;}

.pitroadtime {text-align:center; background-color:rgba(0,0,0,0);display:inline-block;padding-left:0px; padding-right:0px; color: #ffffff; font-weight: bold;}
#pitroadtime00 {display:inline-block; color: #9e9e9e; font-weight: bold;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#pitroadtime00:hover {color:#ffffff;cursor:pointer;}

.pitstalltime {text-align:center; background-color:rgba(0,0,0,0);display:inline-block;padding-left:0px; padding-right:0px; color: #ffffff; font-weight: bold}
#pitstalltime00 {display:inline-block; color: #9e9e9e; font-weight: bold;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#pitstalltime00:hover {color:#ffffff;cursor:pointer;}

.inc {text-align:center; display:inline-block;padding-left:0px; color: #00b300; font-weight: bold }
#inc00 {display:inline-block; color: #9e9e9e; font-weight: bold;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#inc00:hover {color:#ffffff;cursor:pointer;}








#tick { display:none; font-size : 48px; padding-left: 1px; color : #ffffff;background-color:#000000;font-weight: bold}

.fps {background-color:rgba(0,0,0,0);text-align:right; position: absolute; top : 20px; right:0px; width:100%; font-family :Arial;; font-size : 16px; color : #ffffff;background-color:#000000;font-weight: bold;
}
#fps {position:absolute;right:0;z-index:6;}

#p00 {z-index:7;position:absolute;top:70px; font-family :Arial;}


#throttle_bar { display:none; background-color:#FF0000;height:36px;width:100px}

a {border: 0;margin:0;padding : 0;}
a:link { text-decoration: none; display:inline-block; color:#ffee00; font-family :Arial; font-weight: bold; }
a:hover { text-decoration: none; color:#000000; }
a:visited { color:#ffee00; }
a:visited:hover { color:#000000; }


#click_infos { position:absolute; width:100%; z-index:5; display:none;}
/*#infos {padding-left: 8px;padding-right: 8px;background-color:#999999; width:100%;position:absolute;top : 20px; left:0; font-family :Arial; font-style: normal; font-size : 24px; color : #ffffff;font-weight: normal;  }*/

#sofbar {
    position: absolute;
    width: 100%;
    font-family :Arial; font-style: normal; font-weight: bold; color: #ffffff;
    background-color: #000000;
    text-align: center;
    display: none;
}

#infosbar {
    position: absolute;
    left: 0px;
    width: 100%;
    font-family :Arial; font-style: normal; font-weight: bold; color: #ffffff;
    text-align: center;
    text-overflow:clip ;
    white-space:nowrap;
    display: none;
}

#litre { display: none; z-index: 6; position: absolute; background-color: #dddddd; color: #000000; }
#litre:hover { cursor:pointer; }
#kg { display: none; z-index: 6; position: absolute; background-color: #999999; color: #555555; }
#kg:hover { cursor:pointer; }
#tank_h { z-index:6; position: absolute; background-color: #444444; color: #bbbbbb; }
#tank_h:hover { cursor:pointer; }
#estlaps_h { position: absolute; background-color: #666666; color: #bbbbbb; }
#timeremain_h { position: absolute; background-color: #444444; color: #bbbbbb; }
#lapsremain_h { position: absolute; background-color: #666666; color: #bbbbbb; }
#fuelneed_h { z-index:6; position: absolute; background-color: #444444; color: #bbbbbb; }
#fuelneed_h:hover {cursor:pointer;}
#tank { z-index:6; position: absolute; background-color: #008800; color: #ffffff; }
#tank:hover {cursor:pointer;}
#conso_h { z-index:6; position: absolute; display: none; background-color: #555555; color: #bbbbbb; }
#conso { z-index:6; position: absolute; background-color: #005500; color: #ffffff; }
#conso:hover {cursor:pointer;}
#estlaps { z-index:6; position: absolute; background-color: rgba(255,0,0,0); color: #000000; }
#estlaps_bg0 { z-index:5; position: absolute; background-color: #00aa00; color: #000000; }
#estlaps_bg1 { z-index:5; position: absolute; background-color: #ffffff; color: #000000; }
#timeremain { position: absolute; background-color: #000000; color: #ffffff; }
#timeremain:hover {cursor:pointer;}
#lapsremain { z-index:3; display:inline-block; position: absolute; background-color: rgba(255,0,0,0); color: #ff9900; text-align: center;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#lapsremain_bg0 { z-index:0; display:inline-block; position: absolute; background-color: #333333; color: #000000; text-align: center;  }
#lapsremain_bg1 { z-index:1; display:inline-block; position: absolute; background-color: #996622; color: #000000; text-align: center;  }
#lapsremain_bg2 { z-index:2; display:inline-block; position: absolute; background-color: #ffd700; color: #000000; text-align: center; width: 1px;
	-webkit-filter: drop-shadow(1px 1px 1px black);
	filter: drop-shadow(1px 1px 1px black);
}
#fuelneed { z-index:6; position: absolute; background-color: rgba(255,0,0,0); color: #000000; }
#fuelneed:hover {cursor:pointer;}
#fuelneed_bg0 { z-index:5; position: absolute; background-color: #ff9900; color: #000000; }
#fuelneed_bg1 { z-index:5; position: absolute; background-color: #0099ff; color: #000000; }
#sessioninfos { z-index:6; font-weight:bold;padding-left: 8px; text-align: left; position: absolute; background-color: #dddddd; color: #000000; width: auto; right: 0px; }

#sof_cont {padding-left: 0px; text-align: left; position: absolute; color: #000000; width: auto; right: 0px; }
#sof_cont:hover {cursor:pointer;}


#tires { display:block; z-index:60; position:absolute; text-align:center;}
#tires:hover {cursor:pointer;}
#tires_all {box-shadow: inset 1px 0px white; padding-left: 8px; padding-right: 8px; position:relative;display:inline-block;background-color:#ff0000}
#tires_none {box-shadow: inset 1px 0px white; padding-left: 8px; padding-right: 8px; position:relative;display:inline-block;background-color:#0000ff}
#tires_left {box-shadow: inset 1px 0px white; padding-left: 8px; padding-right: 8px; position:relative;display:inline-block;background-color:#880088}
#tires_right {box-shadow: inset 1px 0px white; padding-left: 8px; padding-right: 8px; position:relative;display:inline-block;background-color:#ff8800}
/*#tires_all { z-index: 6;padding-left: 2px; padding-right: 2px;text-align: center; position: absolute; background-color: #ff0000; color: #ffffff; }*/
/*#tires_none { z-index:6;padding-left: 2px; padding-right: 2px; text-align: center; position: absolute; background-color: #0000ff; color: #ffffff;  }*/

#logo { z-index:11; border: 1px solid #000000;background-color:#ffffff;position: absolute; right: 0px; padding-right:4px; padding-left:4px; }

#app_name { z-index:11; font-weight:normal; font-style: italic; padding-right:4px;color:#000000;position:absolute; display:inline-block; top:0px; right:0px }

#flag_img { z-index:2; position:absolute; /*background-size:auto 100%; background-image: url("../flag.png"); background-repeat: repeat-x;*/}

#waitforiracing { display:none; z-index: 10;color: #ffffff; font-weight: bold; opacity:0.2; text-align: center; vertical-align: middle;
    position:absolute; padding-left:8px; left: 0; right: 0; width: auto; top: 0; bottom: 0; height: auto;
    background-color:rgba(21,118,251,1);
}

#display_options { display:none; opacity:0; z-index:12; position:absolute; right:0px; background-color:#00ff00; width:10%; height:100%}
#close_options { z-index:12; padding-right:1em; padding-top: 0.5em; font-size:0.7em; position:absolute;right:0; top:0; height:58em; }
#close_options:hover {cursor:pointer; font-weight:bold}
#options { display:none; z-index:12; margin: 0em;padding:1em; color:#ffffff; font-size:1em;
    position:absolute;right:0px; top:0px; bottom: 0px;
    background-color:rgba(255,0,0,0.7); width:90%; height:auto;
    line-height:2em;
    overflow-y:scroll;
}

#display_trackmap { display:block; opacity:0; z-index:10; position:absolute; left:0px; background-color:#00ff00; width:10%; height:100%}
#close_trackmap { z-index:10; padding-left:1em; padding-top: 0.5em; font-size:0.7em; position:absolute;left:0; top:0; height: 100%; }
#close_trackmap:hover {cursor:pointer; font-weight:bold}
#trackmap { display:none; z-index:11; margin: 0em;padding:0em; color:#ffffff; font-size:1em;
    position:absolute;left:0px; top:0px; bottom: 0px;
    /*background-color:rgba(0,128,255,0.7);*/
    /*background-color:rgba(90,90,90,1);*/
    background:url("../img - default/trackmap_logo.png") right bottom no-repeat;
    background-size: 25%;
    width:100%; height:auto;
    line-height:2em;
}
#trackmap_bg { display:none; z-index:10; margin: 0em;padding:0em; color:#ffffff; font-size:1em;
    position:absolute;left:0px; top:0px; bottom: 0px;
    background-color:rgba(140,140,140,1);
    background:url("../img - default/trackmap_bg.png") center no-repeat;
    background-size: 100% auto;
    width:100%; height:auto;
    line-height:2em;
}

#trackmap_canvas { z-index:-2; margin:0px; padding:0px; top:0px; /*background-color:rgba(255,255,0,0.8);*/ }
#trackmap_fond_canvas { z-index:-3; margin:0px; padding:0px; top:0px;
    /*background-color:rgba(255,255,0,0.8);*/
}
#trackmap_fond_turns_canvas { z-index:-1; margin:0px; padding:0px; top:0px; left: 0px; }

#banner {
}

#fullscreen {
    position: absolute;
    background-color: #004422;
    opacity: 0.3;
    width: 4em;
    height: 3.5em;
    padding-top: 0.5em;
    line-height: 1.5em;
    z-index: 99999;
    right: 0px;
    bottom: 0px;
    color: #ff8800;
    text-align: center;
    font-size: 1em;
    vertical-align: middle;
}
#fullscreen:hover {
    opacity: 1;
}
