body {
 font-family: Helvetica, sans-serif;
 background-color: white;
 background-image: url(images/fond.png);
 background-position: top center;
 background-repeat: no-repeat;
 text-align: center;
 font-size: 14px;
 margin:0;
 }

a, a:visited {
 text-decoration: none;
 color: #002F8F;
 }

a:hover, a:focus {
 text-decoration: underline;
 color: #80008F;
 }

h1 {
 display: block;
 width: 200px;
 height: 86px;
 background-image: url(images/logo.png);
 margin-left: auto;
 margin-right: auto;
 margin-bottom: 0;
 }

h1 span {
 display:none;
 }

h1:hover {
 background-image: url(images/logo-on.png);
 }

#sous-titre {
 color: gray;
 font-size: 150%;
 margin: 0;
 }

.ensemble {
 width: 650px;
 margin-left: auto;
 margin-right: auto;
 clear: both;
 }

#cadre-gauche {
 text-align: left;
 width: 300px;
 float: left;
 margin-bottom: 20px;
 }

#cadre-droite {
 text-align: right;
 width: 300px;
 float: right;
 margin-bottom: 20px;
 }

h2 {
 display: block;
 width: 300px;
 height: 35px;
 background-image: url(images/cadre-haut.png);
 color: white;
 font-size: 180%;
 padding-top: 5px;
 margin-bottom: 0px;
 text-align: center;
 }

.lien-menu {
 text-align: center;
 display: block;
 background-image: url(images/cadre-lien-off.png);
 width: 280px;
 margin:0;
 font-size: 150%;
 padding: 10px;
 }

.lien-menu:hover {
 background-image: url(images/cadre-lien-on.png);
 }

.mini-bouton {
 width: 190px;
 height: 200px;
 margin: 10px;
 float: left;
 }

.mini-bouton div {
 width: 190px;
 height: 180px;
 background-image: url(images/bouton-fond-off.png);
 padding-top: 20px;
 }

.mini-bouton div:hover {
 background-image: url(images/bouton-fond-on.png);
 }

h3 {
 margin: 20px;
 font-size: 130%;
 font-weight: normal;
 }

.mini-bouton a[href="bouton.html"], .mini-bouton a[href="error.html"] {
 display: block;
 padding-top: 90px;
 background-image: url(images/icone-bouton.png);
 background-position: center top;
 background-repeat: no-repeat;
}

.mini-bouton div:hover a[href="bouton.html"], .mini-bouton div:hover a[href="error.html"] {
 background-image: url(images/icone-bouton-on.png);
}

.mini-bouton a[href="photos.html"] {
 display: block;
 padding-top: 90px;
 background-image: url(images/icone-photos.png);
 background-position: center top;
 background-repeat: no-repeat;
}

.mini-bouton a[href="regles.html"] {
 display: block;
 padding-top: 90px;
 background-image: url(images/icone-table.png);
 background-position: center top;
 background-repeat: no-repeat;
}

h4 {
 font-size: 150%;
  text-align: center;
 display: block;
 }

#film {
 display: block;
 width: 150px;
 height: 150px;
 position: fixed;
 left: 0px;
 bottom: 0px;
 background-image: url(images/film.png);
 }

#film span {
 display: none;
 }

.photobox {
 border: solid 3px transparent;
 margin: 10px;
 }

.photobox:hover {
 border-color: gray;
 }