@charset "utf-8";
/* CSS Document */

body
{
background-color:black;
}

h1 input
{
	background-color:transparent;
	border:none;
	font-size:24px;
}

#gameindex
{
background-image:url(images/gameindex.png);
background-size:800px 1400px;
	width:800px;
	height:1400px;	
	z-index:2;
	position:absolute;
top:10px;
left:10px;
  border:solid 2px; 
  display:block;
}
#valideconnexion
{
	background-image:url(images/home.png);
background-size:800px 1400px;
	z-index:3;
	 display:none;
}
#erreurconnexion
{
	background-image:url(images/erreur.png);
background-size:800px 1400px;
	z-index:22;
	 display:none;
	 cursor:pointer;
}

#ecranconnexion
{
background-color:transparent;
	width:800px;
	height:800px;
	position:absolute;
	left:0px;
	top:100px;
	z-index:1;
	text-align:center;
display:block;
}

#game
{
background-color:#1e1e15;
	width:800px;
	height:1400px;	
	z-index:1;
	position:absolute;
top:10px;
left:10px;
  border:solid 2px; 
}

#testbackground
{
	background-color:red;
	width:200px;
	height:100px;
	position:absolute;
	left:900px;
	top:100px;
	z-index:30;

}

.pages
{
background-color:black;
	background-image:url(images/pages2.png);
	background-size:800px 1400px;
	width:800px;
	height:1400px;	
	z-index:1;
	position:absolute;
top:0px;
left:0px;
display:none;
}

.classrules
{
background-color:black;
	background-image:url(images/pages2.png);
	background-size:800px 1400px;
	width:800px;
	height:1400px;	
	z-index:1;
	position:absolute;
top:0px;
left:0px;
display:block;
cursor:pointer;
}
#rules
{
z-index:11;	
display:none;
}

#rules1
{
background-image:url(images/rules1.png);
z-index:9;	
}
#rules2
{
background-image:url(images/rules2.png);
z-index:8;	
}
#rules3
{
background-image:url(images/rules3.png);
z-index:7;	
}
#rules4
{
background-image:url(images/rules4.png);
z-index:6;	
}
#rules5
{
background-image:url(images/rules5.png);
z-index:5;	
}
#rules6
{
background-image:url(images/rules6.png);
z-index:4;	
}
#home
{
background-image:url(images/home.png);
	background-color:black;
	width:800px;
	height:1400px;
	position:absolute;
	left:0%;
	top:0%;
	z-index:23;
	text-align:center;
display:none;
}

#header
{
	background-color:transparent;
	background-repeat:no-repeat;
	background-size:100%;
	width:800px;
	height:120px;
	position:absolute;
	left:10px;
	top:20px;
	display:none;
	border-radius:10px;
z-index:20;
}








#boutonstartgame {	
font-weight:bold;
	background-color:#ff9900;
	border-radius:10px;
	border:3px solid white;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:28px;
	padding:16px 31px;
	z-index:4;
	margin-top:30px;
	width:1280px;
	height:80px;
	display:none;
	position:absolute;
	bottom:10px;
	left:10px;
}
#boutonstartgame:hover {
	background-color:green;
}





#interjoueur
{
	background-image:url(images/interjoueur.png);
	background-color:#ff9900;
	width:1300px;
	height:800px;
	position:absolute;
	left:0%;
	top:0%;
	z-index:9;
	text-align:center;
display:block;
}







#menu
{
	width:800px;
	height:1400px;
	position:absolute;
	left:0%;
	top:0%;
	z-index:10;
	text-align:center;
display:block;
}
#endgame
{
		background-image:url(images/interjoueur.png);
background-color:#ffd633;
	width:1300px;
	height:800px;
	position:absolute;
	left:0%;
	top:0%;
	z-index:19;
	text-align:center;
display:none;
}

#control
{
background-color:#ff9900;
	width:200px;
	height:800px;
	position:absolute;
	left:0%;
	top:0%;
	z-index:2;
	text-align:center;
display:block;
	border-radius:10px;
}






#board1
{
background-color:#330033;
	background-repeat:no-repeat;
	background-size:700px 700px;
	width:700px;
	height:700px;
	position:absolute;
	left:50px;
	top:240px;
	z-index:2;
	margin:0px;
	border-radius:30px;
	box-sizing: border-box;
	overflow: hidden;
}
#masqueboard
{
background-color:#330033;
	background-repeat:no-repeat;
	background-size:100%;
	width:700px;
	height:700px;
	position:absolute;
	left:0px;
	top:0px;
	z-index:3;
	margin:0px;
	border-radius:30px; 
	display:none;
}



.card
{background-image:url(images/champi1.png);background-color:transparent; background-size: 80px 80px; border-radius:10px;position:absolute; top:0px; left:0px; z-index:2; width:80px; height:80px;}

.case
{background-color:transparent; border-radius:10px; z-index:3; width:100px; height:100px; position:absolute; border:solid 1px 	#f5f5ef; box-sizing: border-box; opacity:30%}




.btn {
	background-color:#4d004d;
	border-radius:80px;
	border:5px solid #1ad1ff;
	display:inline-block;
	cursor:pointer;
	color:#1ad1ff;
	font-weight:bold;
	font-family:Arial;
	font-size:30px;
	padding:22px 30px;
	text-decoration:none;
	width:230px;
	height:90px;
}
.btn:hover {
filter: contrast(1.1);
transform: scale(1.1);
}



.btnphp {
	background-color:#4d004d;
	border-radius:80px;
	border:5px solid #1ad1ff;
	display:inline-block;
	cursor:pointer;
	color:#1ad1ff;
	font-weight:bold;
	font-family:Arial;
	font-size:40px;
	padding:22px 30px;
	text-decoration:none;
	width:440px;
	height:140px;
	position:absolute;
	left:180px;
	top:600px;
}
.btnphp:hover {
filter: contrast(1.1);
transform: scale(1.1);
}

.btn2:focus {
	background-color:#ff3385;	
}





.btnzoom {
	background-color:#000000;
	border-radius:120px;
	border:2px solid white;
	display:inline;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:32px;
	font-weight:bold;
	
text-align:center;

	width:100px;
	height:100px;
		
}
.btnzoom:hover {
	background-color: green;
}
.ClassName {
	text-decoration:none;
	font-family:Arial;
	background:#d9d9d9;
	text-indent:0px;
	line-height:145px;
	-moz-border-radius:100px;
	-webkit-border-radius:100px;
	border-radius:130px;
	text-align:center;
	vertical-align:middle;
	display:inline-block;
	font-size:26px;
	color:black;
	width:250px;
	height:250px;
	border-color:black;
	border-width:2px;
	border-style:solid;
	margin:auto;
	font-weight:bold;
}
.ClassName:hover {
	background:#969696;
	background:-o-linear-gradient(90deg, #969696, #ebebeb);
	background:-moz-linear-gradient( center top, #969696 5%, #ebebeb 100% );
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #969696), color-stop(1, #ebebeb) );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#969696', endColorstr='#ebebeb');
	background:-webkit-linear-gradient(#969696, #ebebeb);
	background:-ms-linear-gradient(#969696, #ebebeb);
	background:linear-gradient(#969696, #ebebeb);
}



#boutonaccueuil
{ 
	position:absolute;
	top:20px;
	left:248px;
		width:300px;
	height:100px;
}
#boutonsave
{ 
	position:absolute;
	top:15px;
	right:30px;
}
#boutonok
{ 
	position:absolute;
	top:-2px;
	right:51px;
		width:160px;
	height:92px;
}
#boutondeconnexion
{ 
	position:absolute;
	top:40px;
	left:330px;
		width:310px;
	height:100px;
}
#boutonregles
{ 
	position:absolute;
	top:40px;
	right:30px;
		width:100px;
	height:100px;
}

#barreendurance
{  
	display:block;
    width:660px;
    height: 40px;
   /* padding: 1px 1px 1px 1px;*/
    background: #333; 
    background: -webkit-linear-gradient(#2d2d2d,#444);
    background:    -moz-linear-gradient(#2d2d2d,#444);
    background:      -o-linear-gradient(#2d2d2d,#444);
    background:         linear-gradient(#2d2d2d,#444);
    border-radius:40px;
	position:absolute;
	left:70px;
	top:25px;
	margin:0px;
	border:solid 4px #1ad1ff;
}


.opt
{
background-color:#ffd633;
	width:100px;
	height:100px;
	margin-top:10px;
	margin-left:4px;
	z-index:1;
	text-align:center;
display:inline-block;
border-radius:10px;
	border:solid 2px black; box-sizing: border-box;
	background-size: 100px 100px;
	
}
.opt:hover {
	border-radius:100px;
	color:red;
	border-color:green;
}


.vertical {
  display: inline-block;
  width: 20%;
  height: 40px;
  -webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */
  transform: rotate(-90deg);
}

progress {
  border-radius:40px; 
  width: 60px;
  height: 5px;
  margin-left: 20px;
  margin-top:4px;
}
progress::-webkit-progress-bar {
  background-color: black;
    border-radius:40px;
}
progress::-webkit-progress-value {
  background-color: var(--c,#1e1e15);
    border-radius:40px;
}
progress::-moz-progress-bar {
 background-color: black;
   border-radius:40px;
}



#zooming
{
		background-color:transparent;
	text-align:center;
	width:300px;
	height:100px;
	color:white;
	z-index:21;
	font-size:26px;
		position:absolute;
bottom:160px;
left:250px;
	
}
#enlarge
{
		background-color:transparent;
	text-align:center;
	width:100px;
	height:90px;
	color:white;

display:block;
	z-index:21;
	font-size:14px;
	
}



/* Tooltip text */
.optxp .tooltiptext {
  visibility: hidden;
  width: 200px;
  height:200px;
  background-color: black;
  color: #fff;
  text-align: center;
  padding: 10px 0;
  border-radius: 10px;
 bottom: 0%;
  left: 0%;
 	border:3px solid white;  box-sizing: border-box;
 font-size:20px;
  /* Position the tooltip text - see examples below! */
  position: absolute;
  z-index: 10;
}

/* Show the tooltip text when you mouse over the tooltip container */
.optxp:hover .tooltiptext {
  visibility: visible;
   font-size:18px;
}



.boutonsmenu {
	background-color:green;
	background-size:600px 170px;
	border-radius:20px;
	border:5px solid #1ad1ff;
	display:inline-block;
	cursor:pointer;
	margin-top:80px;
	margin-left:-5px;
	width:600px;
	height:170px;
}
.boutonsmenu:hover {
filter: contrast(1.3);
transform: scale(1.1);
}


.maps {
	background-color:green;
	background-size:600px 170px;
	border-radius:20px;
	border:5px solid #1ad1ff;
	display:inline-block;
	cursor:pointer;
	width:600px;
	height:170px;
	z-index:1;
}
.maps:hover {
filter: contrast(1.3);
transform: scale(1.1); 
}
.masquemaps {
		background-image:url(images/masquemaps.png);
	background-color:black;
	background-size:600px 170px;
	border-radius:20px;
	border:5px solid #d9d9d9;
	display:inline-block;
	width:600px;
	height:170px;
	z-index:2;
}

.timermaps {
	width:600px;
	height:170px;
	z-index:2;
	font-family:Verdana;
	text-align:center;
	vertical-align:middle;
	font-size:40px;
	color:#d9d9d9;
	font-weight:bold;
	margin-top:60px;
	margin-left:0px;
}


#finexploration
{
		background-image:url(images/finexploration.png);
	background-color:black;
	background-size:800px 1400px;
display:none;	
}



#poucette
{
	background-color:transparent;
	background-repeat:no-repeat;
	background-size:100%;
	width:120px;
	height:120px;
	position:absolute;
	left:290px;
	top:290px;
	z-index:4;
}

#poucetterun
{
	background-color:transparent;
	background-size:120px 120px;
	width:120px;
	height:120px;
	position:absolute;
	left:290px;
	top:290px;
	z-index:5;
	display:none;
}
#poucettevision
{
	background-color:transparent;
	background-size:150px 150px;
	width:150px;
	height:150px;
	position:absolute;
	left:275px;
	top:255px;
	z-index:6;
	display:none;
}


#eclairage
{
	background-image:url(images/eclairage3.png);
	background-repeat:repeat;
	background-position: 0px, 0px;
	background-size:100%;
	width:400px;
	height:400px;
	position:absolute;
	left:150px;
	top:150px;
	z-index:3;
	border-radius:400px;
		border:1px solid #1affff;
}

#range
{
background-color:transparent;
	width:200px;
	height:200px;
	position:absolute;
	left:248px;
	top:248px;
	z-index:5;
	border-radius:400px;
	border:3px solid #1affff;
}

#pets
{
background-color:transparent;
	width:800px;
	height:120px;
	position:absolute;
	left:0px;
	top:90px;
	z-index:10;
	text-align:left;
display:block;
}

.iconepet {
		background-image:url(images/iconefamilierbase.png);
	background-color:transparent;
		background-size:100px 100px;
	border-radius:120px;
	display:inline-block;
	width:100px;
	height:100px;
margin-left:118px;
margin-top:10px;
border:3px solid black;
}

#controls
{
background-color:transparent;
	width:800px;
	height:400px;
	position:absolute;
	left:0px;
	bottom:20px;
	z-index:10;
	text-align:center;
display:block;
}
#masquecontrols
{
background-color:transparent;
	width:800px;
	height:400px;
	position:absolute;
	left:0px;
	bottom:20px;
	z-index:11;
	text-align:center;
display:none;
}

.fleches {
	background-color:transparent;
		background-size:120px 120px;
	border-radius:10px;
	display:block;
	cursor:pointer;
	width:120px;
	height:120px;
	position:absolute;
}
.fleches:hover {
filter: contrast(1.2);
transform: scale(1.1); 
}

#deplacements
{
		
	background-color:transparent;
	width:400px;
	height:400px;
	position:absolute;
	right:50px;
	top:0px;
	z-index:1;
	text-align:center;
	display:block;
}


#arrowup
{background-image:url(images/arrowup.png);
	left:140px;
	top:0px;
}
#arrowright
{background-image:url(images/arrowright.png);
	left:280px;
	top:140px;
}
#arrowdown
{background-image:url(images/arrowdown.png);
	left:140px;
	top:280px;
}
#arrowleft
{background-image:url(images/arrowleft.png);
	left:0px;
	top:140px;
}
#boutonstop
{background-image:url(images/arrowstop.png);
	left:140px;
	top:140px;
}
#boutonvision
{
background-image:url(images/boutonvision.png);
background-color:transparent;
	background-size:200px 200px;
	width:200px;
	height:200px;
	position:absolute;
	left:50px;
	top:100px;
	z-index:1;
	text-align:center;
	display:block;
	cursor:pointer;
}
#boutonvision:hover {
filter: contrast(1.2);
transform: scale(1.1); 
}
#masquevision
{
background-image:url(images/masquevision.png);
background-color:transparent;
	background-size:200px 200px;
	width:200px;
	height:200px;
	position:absolute;
	left:50px;
	top:100px;
	z-index:2;
	text-align:center;
	display:none;
}

#gameexploration
{
background-color:#330033;
}
.contientboutons
{
	background-color:transparent;
	width:800px;
	height:1100px;
	position:absolute;
	left:0px;
	top:240px;
	z-index:1;
	text-align:center;
	display:block;
}

#map1
{
background-image:url(images/boutonmap1.png);
	position:absolute;
	left:95px;
	top:80px;
}
#map2
{
background-image:url(images/boutonmap2.png);
	position:absolute;
	left:95px;
	top:330px;
}
#map3
{
background-image:url(images/boutonmap3.png);
	position:absolute;
	left:95px;
	top:580px;
}
#map4
{
background-image:url(images/boutonmap4.png);
	position:absolute;
	left:95px;
	top:830px;
}

#masquemap1
{
	position:absolute;
	left:95px;
	top:80px;
}
#masquemap2
{
	position:absolute;
	left:95px;
	top:330px;
}
#masquemap3
{
	position:absolute;
	left:95px;
	top:580px;
}
#masquemap4
{
	position:absolute;
	left:95px;
	top:830px;
}

#boutonexploration
{
background-image:url(images/boutonexploration.png);
}
#boutonrecoltes
{
background-image:url(images/boutonrecoltes.png);
}
#boutonfamiliers
{
background-image:url(images/boutonfamiliers.png);
}
#boutonprofils
{
background-image:url(images/boutonprofils.png);
}

#gainrecoltes1
{
	background-image:url(images/recoltes1.png);
	background-size:100%;
	position:absolute;
	left:50px;
	top:210px;
}
#gainrecoltes2
{	background-image:url(images/recoltes2.png);
	background-size:100%;
	position:absolute;
	right:50px;
	top:210px;
}
#gainfaune
{
background-image:url(images/gainfaune.png);
background-color:transparent;
	background-size:700px 140px;
	width:700px;
	height:140px;
	position:absolute;
	left:45px;
	top:35px;
	z-index:2;
	text-align:center;
	display:block;
			border-radius:30px;
	border:5px solid #1ad1ff;
}
#divgains
{
background-image:url(images/divgains.png);
background-color:transparent;
	background-size:700px 100px;
	width:700px;
	height:100px;
	position:absolute;
	left:50px;
	top:870px;
	z-index:2;
	text-align:center;
	display:block;
			border-radius:30px;
	border:5px solid #1ad1ff;
}
#pointsgagnes
{
	position:absolute;
	left:70px;
	top:0px;
		margin-top:0px;
			font-size:52px;
	color:#ffcc00;
		width:200px;
	height:100px;
}
#gainanimal
{
	position:absolute;
	left:350px;
	top:20px;
	display:block;
		margin:0px;
}
#recoltes1
{
	background-image:url(images/recoltes1.png);
	background-size:100%;
	position:absolute;
	left:50px;
	top:180px;
}
#recoltes2
{	background-image:url(images/recoltes2.png);
	background-size:100%;
	position:absolute;
	right:50px;
	top:180px;
}
.contientrecoltes
{
	background-color:transparent;
	width:300px;
	height:600px;
	z-index:1;
	text-align:center;
	display:inline-block;
	margin:0px;
		border-radius:40px;
	border:5px solid #1ad1ff;
}

.ressources {
	font-family:Verdana;
	background:transparent;
	-moz-border-radius:100px;
	-webkit-border-radius:100px;
	border-radius:100px;
	text-align:center;
	vertical-align:middle;
	display:inline-block;
	font-size:40px;
	color:#1ad1ff;
	width:100px;
	height:100px;
	margin-left:135px;
	margin-top:40px;
	font-weight:bold;
	border:none;
}
.titres {
	font-family:Verdana;
	background:#1ad1ff;
	border-radius:10px;
	text-align:center;
	vertical-align:middle;
	font-size:34px;
	color:#4d004d;
	width:250px;
	height:90px;
	position:absolute;
	left:30px;
	top:38px;
	font-weight:bold;
	display:block;
	z-index:22;
	border:4px solid white;
}

.contientfamiliers {
	background-color:transparent;
	display:block;
	width:800px;
	height:130px;
}

.detailsfamiliers {
	background-color:green;
	background-size:460px 130px;
	border-radius:20px;
	border:4px solid #1ad1ff;
	display:inline-block;
	width:460px;
	height:130px;
	position:absolute;
	left:50px;
	top:0px;
z-index:1;
}


.masquefamiliers {
	background-image:url(images/masquefamilier.png);
	background-color:black;
	background-size:460px 130px;
	border-radius:20px;
	border:4px solid black;
	display:inline-block;
	width:460px;
	height:130px;
		position:absolute;
	left:50px;
	top:0px;
z-index:2;
}

#contientfamilier1
{
	position:absolute;
	left:0px;
	top:180px;
}
#contientfamilier2
{
	position:absolute;
	left:0px;
	top:340px;
}
#contientfamilier3
{
	position:absolute;
	left:0px;
	top:500px;
}
#contientfamilier4
{
	position:absolute;
	left:0px;
	top:660px;
}
#contientfamilier5
{
	position:absolute;
	left:0px;
	top:820px;
}
#contientfamilier6
{
	position:absolute;
	left:0px;
	top:980px;
}
#familier1
{
background-image:url(images/familier1.png);
}
#familier2
{
background-image:url(images/familier2.png);
}
#familier3
{
background-image:url(images/familier3.png);
}
#familier4
{
background-image:url(images/familier4.png);
}
#familier5
{
background-image:url(images/familier5.png);
}
#familier6
{
background-image:url(images/familier6.png);
}

.boutonselectionfamiliers {
	background-color:blue;
	background-size:130px 130px;
	border-radius:20px;
	border:4px solid #1ad1ff;
	display:inline-block;
	cursor:pointer;
	width:130px;
	height:130px;
	position:absolute;
	left:600px;
	top:-1px;
}
.boutonselectionfamiliers:hover {
	filter: contrast(1.3);
transform: scale(1.1); 
}

#nombrefamiliers {
	font-family:Verdana;
	background:transparent;
	-moz-border-radius:100px;
	-webkit-border-radius:100px;
	border-radius:100px;
	text-align:center;
	vertical-align:middle;
	display:inline-block;
	font-size:36px;
	color:#1ad1ff;
	width:500px;
	height:50px;
	position:absolute;
	left:27px;
	top:20px;
	font-weight:bold;
	border:none;
	font-style: italic;
}


.contenu {
	background-color:transparent;
	display:block;
	width:800px;
	height:1200px;
	position:absolute;
	left:0px;
	top:200px;
}


#endurancetitre {
	font-family:Verdana;
	background:transparent;
	-moz-border-radius:100px;
	-webkit-border-radius:100px;
	border-radius:100px;
	text-align:center;
	vertical-align:middle;
	display:inline-block;
	font-size:20px;
	color:#1affff;
	width:300px;
	height:40px;
	position:absolute;
	left:248px;
	top:24px;
	font-weight:bold;
	border:none;
	font-style:italic;
	z-index:2;
}


#ecranapprivoise
{		background-image:url(images/ecranapprivoise.png);
background-color:black;
	background-size:800px 1400px;
	width:800px;
	height:1400px;	
	z-index:11;
	position:absolute;
top:0px;
left:0px;
display:none;
}
#zoneapprivoise
{
	background-image:url(images/apprivoise.png);
	background-color:black;
	background-size:700px 1000px;
	width:700px;
	height:1000px;	
	z-index:1;
	position:absolute;
	left:50px;
	top:200px;
	display:block;
	border-radius:60px;
}
#apprivoisementsuccess
{
	background-image:url(images/apprivoiseresultat1.png);
	background-color:green;
	background-size:700px 1000px;
	width:700px;
	height:1000px;	
	z-index:2;
	position:absolute;
	left:0px;
	top:0px;
	display:none;
	border-radius:60px;
}
#apprivoisementechec
{
	background-image:url(images/apprivoiseresultat2.png);
	background-color:red;
	background-size:700px 1000px;
	width:700px;
	height:1000px;	
	z-index:2;
	position:absolute;
	left:0px;
	top:0px;
	display:none;
	border-radius:60px;
}
#animalapprivoise
{
	background-image:url(images/animal1.png);
	background-color:transparent;
	background-size:300px 300px;
	width:300px;
	height:300px;	
	z-index:1;
	position:absolute;
	left:200px;
	top:420px;
	display:block;
}

.boutonsapprivoise {
	background-image:url(images/boutonselectfamilier.png);
	background-color:black;
	background-size:120px 120px;
	border-radius:120px;
	border:5px solid #1ad1ff;
	display:block;
	width:120px;
	height:120px;
		position:absolute;
	left:0px;
	top:0px;
	cursor:pointer;
z-index:1;
}

#boutonapprivoisesuccess
{
	position:absolute;
	left:235px;
	top:850px;
}

#boutonapprivoiseechec
{
	position:absolute;
	left:235px;
	top:850px;
}


#boutonfinexploration
{
	position:absolute;
	left:215px;
	top:1030px;
	text-align:center;
		width:300px;
	height:30px;
	    padding: 38px 30px;
}

#ecransauvegarde
{
background-image:url(images/sauvegarde.png);
}

.classprofils {
	background-image:url(images/profils.png);
	background-color:blue;
	background-size:600px 120px;
	border-radius:20px;
	border:4px solid #1ad1ff;
	display:block;
	width:600px;
	height:120px;
	position:absolute;
	left:100px;
	top:100px;
	z-index:1;
}

.classnoms {
	font-family:Verdana;
	background:transparent;
	-moz-border-radius:100px;
	-webkit-border-radius:100px;
	border-radius:100px;
	text-align:center;
	vertical-align:middle;
	display:inline-block;
	font-size:32px;
	color:#1ad1ff;
	width:300px;
	height:100px;
	margin-left:10px;
	margin-top:10px;
	font-weight:bold;
	border:none;
}
.classpoints {
	font-family:Verdana;
	background:transparent;
	-moz-border-radius:100px;
	-webkit-border-radius:100px;
	border-radius:100px;
	text-align:center;
	vertical-align:middle;
	display:inline-block;
	font-size:32px;
	color:#ffcc00;
	width:100px;
	height:100px;
	margin-left:74px;
	margin-top:10px;
	font-weight:bold;
	border:none;
}


.borduresverticales {
	background-image:url(images/bordure.png);
		background-repeat:repeat;
	background-color:transparent;
	background-size:140px 140px;
	border-radius:30px;
	display:block;
	width:150px;
	height:700px;
	position:absolute;
	left:0px;
	top:0px;
	z-index:5;
	display:none;
}
.bordureshorizontales {
	background-image:url(images/bordure.png);
		background-repeat:repeat;
	background-color:transparent;
	background-size:140px 144px;
	border-radius:30px;
	display:block;
	width:700px;
	height:150px;
	position:absolute;
	left:0px;
	top:0px;
	z-index:5;
	display:none;
}
#bordright
{
background-image:url(images/bordure.png);
}
#bordleft
{
background-image:url(images/bordure.png);
}
#bordup
{
background-image:url(images/bordure.png);
}
#borddown
{
background-image:url(images/bordure.png);
}

.formulaires {
	
	visibility:hidden;
	
}



.pagesphp
{
background-color:black;
	background-image:url(images/pages2.png);
	background-size:800px 1400px;
	width:800px;
	height:1400px;	
	z-index:1;
	position:absolute;
top:10px;
left:10px;
  border:solid 2px; 
display:block;
}

#pagesauvegarde
{
background-image:url(images/pagesauvegarde.png);
}


#entrerpseudonyme {
	font-family:Verdana;
	background:#1ad1ff;
	border-radius:10px;
	text-align:center;
	vertical-align:middle;
	font-size:38px;
	color:#330033;
	width:420px;
	height:100px;
	position:absolute;
	left:188px;
	top:380px;
	font-weight:bold;
	border:4px solid black;
	display:block;
	z-index:1;
}














#testeur
{
background-color:white;
	width:200px;
	height:300px;
	position:absolute;
	left:900px;
	top:450px;
	z-index:10;
	text-align:left;
display:block;
}




#boutontest
{
	background-color:red;
	width:200px;
	height:100px;
	position:absolute;
	left:1000px;
	top:100px;
	z-index:2;
}
#boutontest2
{
	background-color:red;
	width:200px;
	height:100px;
	position:absolute;
	left:1000px;
	top:300px;
	z-index:2;
}