/* TEXTAREA */
.textareabloc {
	position:relative;
	left:0px;
	top:0px;
	border: 0px solid red;
	padding: 1px;
	margin: 1px;
	background-image:url("write.gif");
	background-position: right bottom;
	background-repeat: no-repeat;
}

/* MESSAGE BOX */
#centermessage{
	position:absolute;
	left :50%;
	top:50%;
	text-align:center;
	color:purple;
	background-color : white;
	background-repeat:no-repeat;
	background-position:center;
	overflow : hidden;
	border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	border: 1px solid #8a8a8a;
}

#centermessage p{
	margin:1%;
	padding:3%;
}

/*Select QCM Line*/
.selectqcmline{
	text-decoration: none;
	cursor:pointer;
}

.selectqcmline:hover,.selectqcmline:active{
	text-decoration: underline;
}

/* RAPPORT ECRIT FIN DE MODULE */
.reportw{
	border: 1px solid #8a8a8a;
	border-radius: 0.2em;
	-moz-border-radius: 0.2em;
	-webkit-border-radius: 0.2em;
	background-color : white;
}

.reportw h2{
	border-bottom: 1px solid #8a8a8a;
	padding:1%;
	margin:0;
}

.reportw p{
	padding:1%;
}

.printBilanRapportW{
	float:right;
	width:100px;
	height:100px;
	margin:1%;
	background-image:url("../fx/printbtn.png");
	background-position: center center;
	background-repeat: no-repeat;
	cursor:pointer;
}

/* DIALOG DOWNLOAD BOX */
#dialogDown{
	position:absolute;
	left :50%;
	top:50%;
	width:350px;
	margin-left:-175px;
	text-align:center;
	background-color : white;
	background-repeat:no-repeat;
	background-position:center;
	overflow : hidden;
	border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	border: 2px solid #8a8a8a;
	font-size:22px;
}
#dialogDown p{
	margin:1%;
	padding:3%;
}
.dialogDownTitle{
	margin:1%;
	padding:3%;
	color:purple;
}

.buttonDialogDownNo , .buttonDialogDownYes{
	background-color:#ededed;
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	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% );
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	text-indent:0;
	border:1px solid #dcdcdc;
	display:inline-block;
	font-family:Arial;
	font-style:normal;
	padding:5px;
	text-decoration:none;
	text-align:center;
	text-shadow:1px 1px 0px #ffffff;
	margin:0.1em;
	font-size:22px;
	width:60px;
}

.buttonDialogDownNo{
	color : gray;
}
.buttonDialogDownYes{
	color : green;
}

/* LIGHT BOX */
#lightbox{
	position:absolute;
	background-color : transparent;
	background-repeat:no-repeat;
	background-position:center;
	z-index : 97;
	display:none;
}

.closelightbox{
	width:50px;
	height:50px;
	position:absolute;
	right:-5px;
	top:-5px;
	background-image:url("../fx/close.png");
	background-repeat:no-repeat;
	background-position:center;
	position:absolute;
	z-index : 99;
	cursor:pointer;
}

.innerlightbox{
	position:absolute;
	background-color : white;
	width:96%;height:96%;
	left:2%;top:2%;
	border:solid 1px gray;
	background-repeat:no-repeat;
	background-position:center;
	position:absolute;
	z-index : 98;
	-moz-border-radius: 5px;
	-khtml-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

/* BILAN SUIVI BOX */
.toptitle{
	position:relative;
	top:0px;
	left:0px;
	width:98%;
	padding:1%;
	padding-top:5px;
	padding-bottom:5px;
	overflow:hidden;
	color:white;
	font-size:18px;
	background: #6E6E6E;
	background-image:url("glow.png");
}

.containBilan{
	position:relative;
	left:0px;
	width:98%;
	height:90%;
	padding:1%;
	overflow:auto;
}

.blockbilan{
	position:relative;
	float:left;
	width:45%;
	padding:1%;
	margin:1%;
	margin-right:0px;
	margin-bottom:0px;
	height:185px;
	overflow:auto;
	font-size:15px;
	border:solid 1px gray;
}

.goodRepBilan{
	font-size:17px;
	color:green;
	font-weight:bold;
}

.questbilan{
	width:93%;
	margin-left:1%;
	padding-bottom:5px;
	font-size:15px;
	border-bottom:dotted 1px gray;
}

.mainshare{
	position:relative;
	margin-left:auto;
	margin-right:auto;
	top:1%;
	width:100%;
	max-width:600px;
	height:98%;
	background: beige;
	border:solid 1px gray;
	overflow:hidden;
	box-shadow: 1px 1px 12px #A9BCF5;
	z-index:1000000;
	display:none;
}

.mainbilan{
	position:relative;
	margin-left:auto;
	margin-right:auto;
	top:1%;
	width:100%;
	max-width:700px;
	height:98%;
	background: beige;
	border:solid 1px gray;
	overflow:hidden;
	box-shadow: 1px 1px 12px #A9BCF5;
	z-index:1000000;
	display:none;
}

.printBilan{
	position:absolute;
	right:2px;
	bottom:2px;
	z-index:13;
	cursor :pointer;
}

.suiviresult{
	position:relative;
	left:90%;
	top:5%;
	width:90%;
	height:90%;
	max-height:600px;
	background: beige;
	border:solid 1px gray;
	overflow:hidden;
	box-shadow: 1px 1px 12px #A9BCF5;
	z-index:1000000;
}

.suivibox{
	width:50px;
	height:50px;
	position:absolute;
	right:-5px;
	bottom:10px;
	background-image:url("../fx/continue.png");
	background-repeat:no-repeat;
	background-position:center;
	position:absolute;
	z-index : 99;
	cursor:pointer;
}

.toptitlesuiviRed{
	position:relative;
	top:0px;
	left:0px;
	width:98%;
	padding:1%;
	padding-top:5px;
	padding-bottom:5px;
	font-size:24px;
	background: red;
	color:white;
	overflow:hidden;
}

.toptitlesuiviGreen{
	position:relative;
	top:0px;
	left:0px;
	width:98%;
	padding:1%;
	padding-top:5px;
	padding-bottom:5px;
	font-size:24px;
	background: green;
	color:white;
	overflow:hidden;
}

.viewScreenMini{
	position:absolute;
	display:block;
	bottom:2px;
	left:2px;
	width:30px;
	height:20px;
	text-decoration:none;
	background-image:url("../fx/viewer.png");
	background-repeat:no-repeat;
}
.viewScreenApercu{
	color:white;
	background: #6E6E6E;
	background-image:url("glow.png");
	background-repeat:no-repeat;
	background-position:center center;
}

/* LANG BOX */
.langposi{
	position:absolute;
	top:1px;
	right:1px;
	cursor:pointer;
	margin:3px;
	width:36px;
	height:25px;
}

.langposicenter{
	cursor:pointer;
	margin:30px;
	margin-left:2px;
	margin-right:2px;
	border:solid 1px white
}

.langbox{
	position : absolute;
	width : 400px;
	height : 100px;
	top : 50%;
	left : 50%;
	margin-left : -200px;
	margin-top  : -50px;
	z-index:20;
	font-size: 60px;
	text-align:center;
	background: black;
	border-radius:15px;
	display:none;
}

/* LEGEND BOX */
.legendbox{
	position:absolute;
	left:2%;
	top:88%;
	width:96%;
	height:2%;
	font-family:Modern,Script,Courier;
}

/* DiALOGUE BOX */
.RightRepDialog ,.BottomRepDialog {
	background-color:#ededed;
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	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% );
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	text-indent:0;
	border:1px solid #dcdcdc;
	display:inline-block;
	font-family:Arial;
	font-style:normal;
	padding:5px;
	text-decoration:none;
	text-align:center;
	text-shadow:1px 1px 0px #ffffff;
	margin:0.1em;
}

.RightRepDialog:hover  ,.BottomRepDialog:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed) );
	background:-moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );
	background-color:#dfdfdf;
}

.RightRepDialog:active ,.BottomRepDialog:active {
	position:relative;
	top:1px;
}

#zonereponsesdialog{
	text-align:center;
	padding:1%;
}

#zonedialogtexte{

}

/*Game Hero Select*/
.gameheroselect{
	border: 2px solid gray;
	cursor: pointer;
}
.gameheroselect:hover{
	border: 2px solid brown;
}
.gameheroselect:active{
	border: 2px solid red;
}

/* BAR GRAPH */
    .bargraph {     
          height: 229px; 
          position: relative; 
          background:  url('papergrid.jpg') repeat-x; 
          border-left: 1px solid #d4d4d4;
          margin: 15px auto 50px;
    }

    .bargraph ul.bars {
        margin: 0; 
        padding: 0; 
        /* getting rid of bullets */
        list-style-type: none;
    }
	
    div.bargraph div.colorfilter {
        position: absolute;
        top: 0; left: 0;
        height: 201px;
        background-color: black;
        opacity:0.2;  filter:alpha(opacity=20);
        z-index: 97;
    
    }

    div.bargraph div.colorfilter2 {
        position: absolute;
        top: 0; left: 0;
        height: 201px;
        background-color: black;
        opacity:0.4;  filter:alpha(opacity=40);
        z-index: 97;
    
    }

    .bargraph ul.bars li {  
        position: absolute; 
        width: 30px; 
        height: 200px; 
        /*move it up from bottom label*/
        bottom: 29px; 
        padding: 0; 
        margin: 0;
		background:gray;
        background: url('bars200.jpg') no-repeat;
        text-align: center; 
        font-weight: bold; 
        color: white; 
        line-height: 2.5em;
        font-family: "Trebuchet MS",Verdana,Arial,Helvetica,sans-serif;
        font-size: 13px;
        z-index: 99;
    }

    .bargraph ul.bars li span {
        position: relative;
        top: -25px;
        color: #7c7c7c;
     }
    
	.bargraph ul.bars li img {        
           margin: 0; padding: 0;
           position: relative;
           top: -71px;
           left: 0;
    }

    .bargraph ul.bars li span.darkpen {
        color: #515151;
        position: static;
    }
	
    .bargraph ul.bars li span.whitepen {
        color: red;
    }

    .bargraph ul.bars li.bar1 { left: 21px;  }
    .bargraph ul.bars li.bar2 { left: 94px;  }
    .bargraph ul.bars li.bar3 { left: 167px; }
    .bargraph ul.bars li.bar4 { left: 240px; }
    .bargraph ul.bars li.bar5 { left: 313px; }
    .bargraph ul.bars li.bar6 { left: 386px; }
    .bargraph ul.bars li.bar7 { left: 459px; }
    .bargraph ul.bars li.bar8 { left: 532px; }
    .bargraph ul.bars li.bar9 { left: 605px; }

    /* bottom means 100% in background-position */
    .bargraph ul.bars li.colorbar1  { background-position: 0px bottom; }
    .bargraph ul.bars li.colorbar2   { background-position: -30px bottom; }
    .bargraph ul.bars li.colorbar3 { background-position: -60px bottom; }
    .bargraph ul.bars li.colorbar4  {  background-position: -90px bottom; }
    .bargraph ul.bars li.colorbar5   {  background-position: -120px bottom; }
    .bargraph ul.bars li.colorbar6  {  background-position: -150px bottom; }
    .bargraph ul.bars li.colorbar7 {  background-position: -180px bottom; }

    .label { list-style-type: none; 
             position: absolute; bottom: 3px; 
             margin: 0; padding: 0; }
    .label li { 
        color: white;
        font-size: 10px;
        width: 73px;
        float: left;
        text-align: center;
        overflow: hidden;
        font-family: "Trebuchet MS",Verdana,Arial,Helvetica,sans-serif;
        line-height: 9px;
    }


    ul.y-axis {
		list-style-type: none; position: absolute; 
		left: -45px; 
		width: 40px;
		text-align: right;
		bottom: 0;
		margin: 0; padding: 0; 
    }

    ul.y-axis li:first-child {
		height: 40px;
		line-height: 40px;
    }

    ul.y-axis li { 
        color: #aba8a8;  
        font-size: 12px;
        height: 51px;
        line-height: 51px;
        text-align: right;
    }

    ul.y-axis li.units {
        position: absolute;
        bottom: 110px;
        right: 20px;
        line-height: 1.2em;
        height: auto;
    }

  .bargraph  p { 
		position: absolute; 
		left: 0; 
		top: 236px; 
		padding: 0; 
		margin:0; 
		text-align: left; 
		width: 100%;
		font-family: Verdana, sans-serif;
		font-size: 10px; color: black;
		line-height: 1.3em;

	}
   .bargraph p.centered { text-align: center; }

/* EXAM BAR */

.examscreen_box , .examscreen_box_bottom {
	position: absolute;
	background: white;
	border: 2px solid gray;
	cursor:pointer;
	z-index : 1000;
	text-align:center;
	padding-top:4px;
	width: 300px;
	height : 233px;
}

.examscreen_box:after, .examscreen_box:before {
	bottom: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.examscreen_box:after {
	border-color: rgba(136, 183, 213, 0);
	border-bottom-color: white;
	border-width: 10px;
	margin-left: -145px;
}

.examscreen_box:before {
	border-color: rgba(194, 225, 245, 0);
	border-bottom-color: gray;
	border-width: 13px;
	margin-left: -148px;
}

.examscreen_box_bottom:after, .examscreen_box_bottom:before {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.examscreen_box_bottom:after {
	border-color: rgba(136, 183, 213, 0);
	border-top-color: white;
	border-width: 10px;
	margin-left: -145px;
}

.examscreen_box_bottom:before {
	border-color: rgba(194, 225, 245, 0);
	border-top-color: gray;
	border-width: 13px;
	margin-left: -148px;
}

.showScreenimg{
	width: 96%;
	margin:2%;
}

/*
.examscreenbox {
	position: relative;
	padding:5px;
	margin:5px;
	margin-left:1px;
	margin-right:1px;
	padding-left:2px;
	padding-right:2px;
	font-size : 27px;
	text-decoration : none;
	color : black;
	cursor:pointer;
	z-index : 6;
}

.examscreenbox:hover {
	color : red;
}
*/