article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }
html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { margin: 0; font-size: 13px; line-height: 1.231;background:#ffffff;}
body, button, input, select, textarea { font-family: sans-serif; color: #222; }

#header {
width:100%;
height:100px;
background-color:white;
position:fixed;
top:0;
left:0;
z-index:20;
}

#formu {
z-index:35;
}

#header div { text-align:left; vertical-align:top;}
#header img{
top:0;
position:fixed;
float:left;
}

#menu {
width:100px;
}
#menu ul {
margin-top:50px;
margin-left:115px;
list-style-type:none;
text-decoration:none;
}

.bouton {
margin-left:100px;
color:#fff;
background:red;
}
.bouton:hover {
margin-left:100px;
color:#fff;
background:green;
}

#menu ul li {padding-left:10px; display:table-cell; list-style-type:none;}
#menu li { padding:10px 10px; margin-right:20px;}

textarea p {
line-height:5pt;
}
#tout {
width:100%;
height:80px;
}
.haut {
width:100%;
height:80px;
background-image:url(images/fond.jpg);
background-repeat:repeat-x;
float:left;
}

#admin {
width:82px;
height:22px;
margin-left:25px;
margin-top:20px;
background-image:url(images/admin.jpg);
background-repeat:no-repeat;
float:left;
}
.gestion {
width:700px;
height:50px;
margin-top:20px;
float:left;
}
.boulet {
float:left;
}
#tableau {
position:relative;
left:0;
float:clear;
}

#tableau tr:hover {
background-color:#ffffff;
z-index:10;
}

#tableau tr:hover {
background-color:#a8ffa2;
z-index:10;
}

td {
/*border:1px solid black; */
text-align:center;
}

.carre {
width:20px;
height:20px;
background:#000;
color:#fff;
font-weight:bold;
z-index:40;
}
.carre1 {
width:20px;
height:20px;
background:#969696;
color:#fff;
font-weight:bold;
z-index:40;
}
.carre1 a {
padding-left:5px;
font-size:16px;
text-decoration:none;
color:#fff;
}
.carre1 a:hover{
color:#008000;
}
.carre2 {
width:20px;
height:20px;
background:#969696;
color:#fff;
font-weight:bold;
z-index:40;
}
.carre2 a {
padding-left:5px;
font-size:16px;
text-decoration:none;
color:#fff;
}
.carre2 a:hover{
color:#008000;
}
.carre3 {
width:20px;
height:20px;
background:#008000;
color:#fff;
font-weight:bold;
z-index:40;
}
.carre3 a {
padding-left:5px;
font-size:16px;
text-decoration:none;
color:#fff;
}
.carre3 a:hover{
color:#000;
}
.carre4 {
width:20px;
height:20px;
background:#3366FF;
color:#fff;
font-weight:bold;
z-index:40;
}
.carre4 a {
padding-left:5px;
font-size:16px;
text-decoration:none;
color:#fff;
}
.carre4 a:hover{
color:#000;
}
.carre5 {
width:20px;
height:20px;
background:#FF6600;
color:#fff;
font-weight:bold;
z-index:40;
}
.carre5 a {
padding-left:5px;
font-size:16px;
text-decoration:none;
color:#fff;
}
.carre5 a:hover{
color:#3366FF;
}

.carre #0 {background:#969696; }
.carre #1 {background:#969696; }
.carre #2 {background:#008000; }
.carre #3 {background:#3366ff; }
.carre #4 {background:#ff6600; }
.carre #5 {background:#000000; }

.carre a {
padding-left:5px;
font-size:16px;
text-decoration:none;
color:#fff;
}
.carre a:hover{
color:#008000;
}

/*Define Accordion box*/
.accordion { width:100%; overflow:hidden; margin:110px 0px 0px 10px; color:#474747; background:#414141; padding:10px;}

/*General Accordion****************************************************************************/
/*Set style of open slide*/
.accordion section:target { background:#FFF; padding:10px;}
.accordion section:target:hover { background:#FFF; }
.accordion section:target h2 {width:100%;}
.accordion section:target h2 a{ color:#fff; padding:0;}
.accordion section:target p {display:block; padding-left:70px;}
.accordion section h2 a{padding:8px 10px;display:block; font-size:20px; font-weight:normal;color:#fff; text-decoration:none; }
.accordion section h3{padding-left:40px; display:block; font-size:16px; font-weight:normal;color:#fff; text-decoration:none; }
.accordion section h4{padding-left:80px; display:block; font-size:16px; font-weight:bold; text-decoration:none; }
/*set style of closed slide*/
.accordion section{float:left; overflow-y:auto; overflow-x:hidden; color:#000; cursor:pointer; background: #333; margin:3px; }*/
.accordion section #incontournables{ float:left;	overflow-y:auto; overflow-x:hidden; color:#fff; cursor:pointer; background: #969696; margin:3px; }
.accordion section #adnhabitants{ float:left;	overflow-y:auto; overflow-x:hidden; color:#fff; cursor:pointer; background: #008000; margin:3px; }
.accordion section #pacmagasin{ float:left;	overflow-y:auto; overflow-x:hidden; color:#fff; cursor:pointer; background: #3366ff; margin:3px; }
.accordion section #adnhabitants{ float:left;	overflow-y:auto; overflow-x:hidden; color:#fff; cursor:pointer; background: #ff6600; margin:3px; }
.accordion section:hover {background:#444;}
.accordion section p { display:none; }
.accordion section:after{position:relative;font-size:24px;color:#000;font-weight:bold;}
.accordion section:nth-child(1):after{content:'0';}
.accordion section:nth-child(2):after{content:'1';}
.accordion section:nth-child(3):after{content:'2';}
.accordion section:nth-child(4):after{content:'3';}
.accordion section:nth-child(5):after{content:'4';}
.accordion section:nth-child(6):after{content:'5';}
/*End General Accordion****************************************************************************/

/*Horizontal Accordion *********************************************************************/
.horizontal section{ width:5%; height:250px; 
	-moz-transition:width 0.2s ease-out; 
	-webkit-transition:width 0.2s ease-out;
  	-o-transition:width 0.2s ease-out;
	-ms-transition:width 0.2s ease-out;
  	transition:width 0.2s ease-out;
}

/*Position the number of the slide*/
.horizontal section:after{top:140px;left:15px;}

/*Header of closed slide*/
.horizontal section h2 { 
	-webkit-transform:rotate(90deg);
	-moz-transform:rotate(90deg);
	-o-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	transform: rotate(90deg);
	width:240px; position:relative; left:-100px; top:85px;
} 

/*On mouse over open slide*/
.horizontal :target{ width:73%;height:230px; }
.horizontal :target h2{ top:0px;left:0;
	-webkit-transform:rotate(0deg);
	-moz-transform:rotate(0deg);
	-o-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	transform: rotate(0deg); 
}
/*End Horizontal Accordion *********************************************************************/

/*Vertical Accordion *************************************************************************/
.vertical section{ width:100%; height:40px;
	-webkit-transition:height 0.2s ease-out;
	-moz-transition:height 0.2s ease-out;
  	-o-transition:height 0.2s ease-out;
	-ms-transition:height 0.2s ease-out;
  	transition:height 0.2s ease-out;
}
/*Set height of the slide*/
.vertical :target{ height:100%; width:97%; }

.vertical section h2 { position:relative; left:0; top:-15px; }

/*Set position of the number on the slide*/
.vertical section:after{ top:-60px;left:810px;}
.vertical section:target:after{ left:-9999px;}

textarea {
width:80%;
resize:none;
}