html{
font-size: 100%;
}

body{
width: 860px;
margin-left: auto;
margin-right: auto;
margin-bottom: 20px;
background-color: black;
font-family:  "Times New Roman", Arial, "Arial Back", sherif;
color: #ffff66;
text-align: center; /*centrage sur IE*/


}
a{
text-decoration : red;
color : red;
}
a:hover{
color : green;
border-color: none;
text-decoration: none;
}
a:visited {
color : none;
border-color: none;
text-decoration: none;
}
#entree {
width: 860px;
margin-left: auto;
margin-right: auto;
margin-bottom: 20px;
padding:20px;
text-align: center;
}
#entete {
width: 860px;
margin-left: auto;
margin-right: auto;
padding: 10px;
}
img {
border-color: black;
}
#ligne {
width: 860px;
}
#h1 {
margin-left: auto;
margin-right: auto;
margin-top: 70px;
margin-bottom: 50px;
text-align: center;
font-variant: small-caps;
font-size: bolder 20px;
}
#h2 {
margin-top: 10px;
margin-bottom: 5px;
text-align: center;
font-variant: small-caps;
font-size: bolder 20px;
}
#corps  /*justifié avec cadre*/{
width: 820px;
margin-left: auto;
margin-right: auto;
margin-bottom: 20px;
margin-top: 50px;
padding:20px;
border: #ffff66 1px ridge;
text-align: justify;
}
#pho, #pho1, #log  /*centré sans cadre*/{
width: 820px;
margin-left: auto;
margin-right: auto;
margin-bottom: 20px;
margin-top: 50px;
padding:20px;
text-align: center;
}
#rolf  /*fresque*/{
overflow:scroll;
overflow: auto;
width: 780px;
height: 650px;
margin-left: auto;
margin-right: auto;
margin-bottom: 20px;
margin-top: 20px;
text-align: center;
}.img1,.img10, .img11,.img12   { /*float left cadre & right sans cadre*/
float: left;
width: 420px;
margin-left: none;
margin-right: 10px;
margin-bottom: 0px;
padding: auto;
padding-bottom: none; 
text-align: center; 
}
.img2,.img20, .img21,.img22 {
margin-left: 440px;
background-color: none;
margin-bottom: 0px;
padding: auto;
padding-top: 10px;
padding-bottom: none; 
text-align: center; 
}
.form1 {
float: left;
width: 430px;
margin-left: none;
margin-right: 10px;
margin-bottom: 20px;
margin-top: 20px;
padding: 20px;
text-align: center;
}
.form2{
margin-left: 450px;
margin-right: none;
margin-bottom: 20px;
margin-top: 37px;
padding: 20px;
text-align: center;
}
.form3 {
float: left;
width: 430px;
margin-left: none;
margin-right: 10px;
margin-bottom: 20px;
margin-top: 20px;
padding: 20px;
text-align: center;
}
.form4{
margin-left: 450px;
margin-right: none;
margin-bottom: 20px;
margin-top: 37px;
padding: 20px;
text-align: justify;
}
.lien1 {
float: left;
width: 150px;
height: 100px;
margin-left: 20;
margin-right: 10px;
margin-bottom: 0px;
margin-top: 0px;
padding: 10px;
text-align: center;
border: #ffff66 1px ridge;
}
.lien2{
height: 100px;
margin-left: 170px;
margin-right: 0px;
margin-bottom: 0px;
margin-top: 0px;
padding: 10px;
text-align: justify;
border: #ffff66 1px ridge;
}
.leg {
text-align: center;
font-size: 14px;
font-style: italic;
padding: none;
}
#pied {
width: 820px;
margin-left: auto;
margin-right: auto;
margin-top: 40px;
margin-bottom: 20px;
padding: 10px;
border: #ffff66 1px ridge;
font-variant: small-caps;
font-size: 14px;
text-align: center;
}

/*menu*/
#menu {
width: 860px;
}
background-image:url(imwb/bout2.jpg)
{background-color:none;
}
/* Position du menu, la position peux être en relative */
#menu {
margin-left:0px;
margin-top: 20px;
margin-bottom:100px;
}
/* On enlève les puces, le padding et le margin */
#menu ul {
padding: 0px;
margin: 0px;
list-style-type:none; /* Cette ligne enlève les puces */
}
/* Dimension des boutons, couleur de background, disposition initiale sur une ligne
NOTE: affecte la class "drop" */
li.drop {
display: block;
position:relative;
width: 122px; /* Largeur visible du bouton */
height: 22px;
overflow:hidden; /* Permet de cacher la partie débordante de l’image */
float:left;
border-right: 0; /* Cette ligne est pour l’esthétique, elle sépare les boutons d’une bordure */
}
/* L’effet hover affiche la hauteur automatiquement par rapport au nombre de LI
NOTE: affecte la class "drop" */
li.drop:hover {
height:auto;
}
/* Bordure qui sépare chaques boutons
NOTE: affecte le dernier niveau des boutons */
#menu ul li ul li {
border-top: 0; /* Cette ligne est pour l’esthétique, elle sépare les boutons d’une bordure */
}
/* Permet de corriger les espaces entre chaque LI dans EXPLORER
NOTE: affecte le dernier niveau des boutons */
*html #menu ul li ul li { float:left; }
/* On met nos liens du menu en block et donne un style au texte des boutons */
#menu a {
display:block;
width:122px; /* Largeur visible du bouton */
height: 22px;
overflow:hidden;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:  10px;
text-align:center;
color:#ffff66;
text-decoration:none;
}
/* effet hover des liens */
#menu a:hover {
color:none;
}
/* Permet d’insérer un background VIA le FIX PNG */
#menu span {
display: block;
position: relative;
width: 122px; /* 2x la largeur visible du bouton */
height: 22px; /* Soustrayez le "padding-top" de la hauteur initiale de votre bouton */
padding-left: 5px; /* Cette ligne permet de positionner le texte de votre bouton sur l’horizontal */
padding-top: 3px; /* Cette ligne permet de positionner le texte de votre bouton sur le vertical */
background-image:url(imwb/bout2.jpg);
background-repeat:no-repeat;
cursor:pointer;
/* background-image:url(menuBouton.png); CETTE LIGNE EST ÉCRITE DANS LE FICHIER "ALPHACSS.PHP" */
/* le background sera générer dynamiquement dépendant du navigateur */
}

/* On décale la tag SPAN de 100 px vers la gauche - pour ne pas perdre le texte dans la zone
hidden on lui met un padding-left de 105px */
#menu a:hover span {
left: -100px;
padding-left: 105px;
}


/*gallery*/
#gallery {
margin-left: auto;
margin-right: auto;
margin-top: 10px;
margin-bottom: 20px;
text-align: center;
font-variant: small-caps;
font-size: bolder 16px;
}
:root {
	overflow:scroll;
}
div#gallery {
}

div#thumbs {
	position: relative;
}
div#navigate {
	vertical-align: middle;
	margin: 0 auto;
}
div#navigate div#prev,
div#navigate div#up,
div#navigate div#next {
	display: inline;
	vertical-align: middle;
	margin: 0;
	padding: 20px;
}
div#navigate div#indexpage{
  	display: inline;
 	vertical-align: middle;
  	padding: 10px;
 	font-size: .8em; 
 	text-align: center;
 	color: #000000; 
}
div#gallery a:link, 
div#gallery a:visited{
}
div#gallery a:hover{
}
div#gallery a:active{
}
div#gallery img {
 	border-width: 0;
}
div#gallery h1{
 	font-weight: bold; 
 	font-size: 2em; 
}
div#gallery h2{
 	font-weight: bold; 
 	font-size: 1.4em; 
}
div#gallery table{
	margin: 0 auto;
	border: 0;
	border-collapse: collapse;
}
div#gallery td.thumb{
	vertical-align: middle;
 	text-align: center;
	border: 0;
	padding: 5px 10px;
	margin: 50px;
}
div#gallery img.thumb{
 	margin: 0;
 	padding: 0;
 	border: none;
}
div#gallery img.thumb:hover {
 	border-color: none;
}
div#gallery img.thumb:active{
}
div#gallery img.activethumb{
 	border: none;
}
div#gallery p.thumb{
	margin: 0;
 	padding: 0;
	font-size: .8em; 
}
div#gallery #pgblk{
}
div#pgimg{
	padding: 20px;
	vertical-align: middle;
}
div#pgimg img{
}
div#pglbl{
	margin:0;
 	padding: 1em 0 0 0;
}
div#homelnk{
}


#linx{
width: 840px;
margin-top:50px; 
margin:10px;
text-align:center;
font-size: bold 18px;
}
td{
padding: 10px;
text-align : center;

}