body {
  font-family: sans-serif, arial;
  background-color:#DCDCDC;
}
#supportJeu {
	position:relative;
	width:800px;
	margin:auto;
	border:1px solid #585858;
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	border-radius:7px;		
	background-image:url(../jeu18/fond.jpg);
}
#menu  {
	z-index:300;
	position: absolute;
	top:20px;
	left:-45px;
	height : 0px;
	width:70px;
}
#enveloppeCases {
	width:620px;
	margin:auto;
	margin-top:50px;
	margin-bottom:50px;
	border:1px solid #585858;
	background-color:white;	
}
#formProposition{
	text-align:center;
	font-size: 20px;
	color: #585858;	
}
#formProposition input{
	width:60px;
	padding:12px 20px;
	font-size:20px;
}
#flecheD{
	position:absolute;
	top:-120px;
	left:-20px;
}
#flecheA{
	position:absolute;
	top:50px;
	left:5px;
}
#titre  {
	text-align:right;
	margin-right:20px;
	font-family: 'Chewy', 'cursive'; font-size: 30px;
	color: #585858;
	text-shadow:1px 1px 2px #A4A4A4;
}
#soustitre  {
	text-align:right;
	margin-right:20px;	
	color: #585858;
	font-family: 'Chewy', 'cursive'; font-size: 18px;
}
#objectif  {
	text-align:right;
	margin-right:180px;	
	color: red;
	font-family: 'Chewy', 'cursive'; font-size: 40px;
}
#footer {
	color:#A4A4A4;
	text-shadow:1px 1px 2px white;
	text-align:center;
	margin-top:5px;
}
.case {	
	display:inline-block;
	position:relative;
	width:60px;
	height:40px;
	padding-top:20px;
	cursor: pointer;
	border:1px solid rgba(65,117,160,0.20);
	text-align:center;
}
.selectable:hover{
	background-color:rgba(65,117,160,0.20);
}
.red {
	background-color:red;
}
.red2{
	background-color:#FE7575;
}
.red1{
	background-color:#FFAFAF;
}
.green {
	background-color:green;
}
.gray {
	background-color:gray;
}
.survol:hover {
	cursor:pointer;
	background-color:#FF00FF;
}
.afficheVignette {
	width:50px;
	height:45px;
	margin-top:5px;
	padding-top:3px;
	border:1px solid rgba(65,117,160,0.65);
	color:rgba(65,117,160,1);
	background-color: #FAFAFA;
	-moz-border-radius:7px;
	-webkit-border-radius:7px;
	border-radius:7px;
	font-size:2.6em;
	text-align:center;
}
.bouton {
	height:26px;
	padding:5px;
	width : 250px; 
	margin: auto;
	margin-top:10px;
	text-align: center;
	color:#fff;
	font-family: 'Chewy', 'cursive'; font-size: 20px;
	background-color: rgba(65,117,160,0.65);
	cursor: pointer;
}
.bouton:hover {
	background-color: #045FB4;
	cursor: pointer;
}

[data-tip]{
  display: inline-block;
  position: relative;
}
[data-tip]:hover:before{
  content: attr(data-tip);
  position: absolute;
  padding: 0 8px;
  height: 28px;
  line-height: 28px;
  background-color: #045FB4;
  background-image: -webkit-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  background-image: -moz-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  background-image: -ms-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  background-image: -o-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
  background-image: linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));  
  left: 65px;
  top: 6px;
  font-size: 14px;
  border-radius: 3px;
  white-space: nowrap;
  color: #fff;
  font-size: 14px;
}
[data-tip]:hover:after {
  content: "";
  position: absolute;
  border-top: 8px solid transparent;
  border-right: 8px solid #045FB4;
  border-bottom: 8px solid transparent;
  left: 56px;
  top: 11px;
}