body {
  margin: 0;
  font-family: sans-serif, arial;
}
#jerevise  {
	text-align:center;
	font-family: 'Chewy', 'cursive'; font-size: 1em;
	color: grey;
	text-shadow:1px 1px 2px #A4A4A4;
}
#outerContainer{
	margin-left:10px;
	margin-right:10px;
}
#innerContainer{
	border:1px solid #D9D9D9;
	background-color:#F2F4F5;
	padding:5px 10px 5px 10px;
	border-radius:7px;
	text-align:center;
}
#titreContainer {
	position:relative;
	margin-bottom: 10px;
	margin-top:10px;
	border:1px solid #D9D9D9;
	background-color:#045FB4;
	padding:5px 10px 5px 10px;
	border-radius:7px;
}
#titreContainer a{	
	color: #ffffff;
	font-family: 'Luckiest Guy', cursive; 
	font-size: 1em;
	text-shadow:1px 1px 2px gray;
	text-decoration:none;			
}
#titreContainer a::before{	
	content: url(../../fae16.png);
}	
#titreContainer a::after{	
	content: "JE REVISE .NET";
}
#titre  {
	text-align:center;
	font-family: 'Chewy', 'cursive'; font-size: 4em;
	color: #045FB4;
	text-shadow:1px 1px 2px #A4A4A4;
}
#soustitre  {
	color: #045FB4;
	font-family: 'Chewy', 'cursive'; font-size: 18px;
}
#enveloppeIcones {
	position:absolute;
	right:250px;
	top:-8px;
}
.afficheVignette {
	display:inline-block;
	position:relative;
	width:50px;
	height:45px;
	margin-left:5px;
	border:1px solid rgba(65,117,160,0.65);
	color:#045FB4;
	background-color: #FAFAFA;
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	border-radius:7px;
	box-shadow: 1px 1px 12px #555;	
	font-size:36px;
	padding-top:4px;
	text-align:center;
}
.survol:hover {
	box-shadow: 1px 1px 12px #FF0000;
	color:red;
	cursor:pointer;
}
.afficheVignette:hover:after {
	position: absolute;
	top:60px;
	left:-30px;
	width:120px;
	padding:4px;
	background-color:white;
	color:gray;
	font-size:16px;
	content: attr(data-inf);
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	border-radius:7px;
	border:1px solid rgba(65,117,160,0.65);
}	
#taches{
	width:800px;
	height:36px;
	margin:auto;
	margin-top:5px;
	margin-bottom:5px;
	border:2px solid rgba(65,117,160,0.65);
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	border-radius:7px;		
	box-shadow: 1px 1px 12px #555;	
	background-color:#F0FFFF;
	text-align:left;
}
#enregistrement{
	position:absolute;
	top: 170px;
	  left: 0; 
	  right: 0; 
	  margin-left: auto; 
	  margin-right: auto; 
	width:800px;
	padding-top:20px;
	border: dotted red 4px;
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	border-radius:7px;		
	box-shadow: 1px 1px 12px #555;	
	background-color:#F0FFFF;
	text-align:center;
	font-family: 'Chewy', 'cursive'; font-size: 3em;
	color: #045FB4;	
}
.choix{
	display:inline-block;
	position:relative;
	border:2px solid rgba(65,117,160,0.65);
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	border-radius:7px;
	padding:5px;
	margin:4px;
	font-size:0.8em;
	background-color:white;
}
.reussite{
	vertical-align:bottom;
	border:2px solid rgba(65,117,160,0.65);
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	border-radius:7px;
	padding:2px;
	margin:2px;
	font-size:0.8em;
	background-color:#00FF00;
}
.choix:hover{
	background-color:#F2F4F5;
	cursor:pointer;
}
#choixTitre{
	display:inline-block;
	position:relative;
	border:2px solid rgba(65,117,160,0.65);
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	border-radius:7px;
	padding:5px;
	margin:4px;
	font-size:0.8em;
	background-color:white;
}
#back{
	display:inline-block;
	position:relative;
	border:2px solid rgba(65,117,160,0.65);
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	border-radius:7px;
	padding: 2px 5px 3px 5px;
	margin: 0px 4px 8px 4px;
	font-size:1.1em;
	background-color:white;
}
#back:hover{
	background-color:#F2F4F5;
	cursor:pointer;
}
#canvasDiv{
	display:inline-block;
	width:700px;
	height:400px;
	border:2px solid rgba(65,117,160,0.65);
	box-shadow: 1px 1px 12px #555;	
	background-color:white;
}
#colonneDroite {
	display:inline-block;
	vertical-align:top;
}
.colonneReussite{
	display:inline-block;
	width:85px;
	height:400px;
	margin-left:5px;
	vertical-align:top;
	border:2px solid rgba(65,117,160,0.65);
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	border-radius:7px;
	box-shadow: 1px 1px 12px #555;
	background-color:#F0FFFF;
}

#commentaire {
	padding:5px;
	margin-top:20px
	text-align: center;
	font-family: 'Chewy', 'cursive'; font-size: 0.8em;
	color: grey;
}
#footer {
text-align:center;
color:#A4A4A4;
padding:10px;
text-shadow:1px 1px 2px white;
clear:both;
}
#form1 {
  margin:auto;
  width: 700px;
}
#form1 fieldset {
  border: none;
}
#form1 legend {
  font-size: 1em;
  font-weight: bold;
  text-shadow: 0 1px 1px #c0d576;
}
#form1 ol li {
  line-height: 30px;
  list-style: none;
  padding: 5px 10px;
  margin-bottom: 2px;
}
#form1 ol ol li {
  background: none;
  border: none;
  float: left;
}
#form1 label {
  font-size: 0.8em;
}
#form1 input{
	font-size: 0.7em;
	width:250px;
}
#form1 input:not([type=submit]):focus,
#form1 textarea:focus {
  background: #eaeaea;
}
#button {
  background: #045FB4;
  border: none;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  -khtml-border-radius: 20px;
  border-radius: 20px;
  color: #ffffff;
  display: block;
  font: 18px Georgia, "Times New Roman", Times, serif;
  letter-spacing: 1px;
  margin: auto;
  padding: 7px 25px;
  text-shadow: 0 1px 1px #000000;
  text-transform: uppercase;
}
#button:hover {
  background: #1e2506;
  cursor: pointer;
}