/* CSS Document */

body {
margin: 0px;
padding: 0px;
background-color: #000000;
font-family:  Helvetica, Verdana, Arial, sans-serif;
font-size: 12px;
color: #000000;
scrollbar-face-color: #999999;
scrollbar-arrow-color: #000000;
scrollbar-track-color: #336699;
scrollbar-darkshadow-color: #336699;
scrollbar-3dlight-color: #336699;
scrollbar-highligh-color: #336699;
scrollbar-shadow-color: #336699;
}
#milieu {
position: relative;
width: 750px;
height: auto;
background-color: #ffffff;
margin: 10px auto 0px auto;
padding: 0px;
}
/* Mise en place des deux menus------------------------------------------------ */
#menu {
position: relative;
margin: 0px;
padding: 0px;
width: 750px;
height: 20px;
}
#menugauche {
position: absolute;
left: 25px;
top: 0px;
padding: 0px;
margin: 0px;
list-style-type: none;
}
#menugauche li {
float: left;
}
/* LISTE DES MENU PAR IMAGE -------------------------------------------------   */
#menugauche li a {
display: block;
width: 100px;
height: 20px;
margin: 0px;
padding: 0px;
text-decoration: none;
text-align: center;
color: #000000;
}
#accueil {
background: url(img/accueil.png) top left no-repeat;
}
a#accueil:hover, a#accueil:focus {
background-position: 0% -20px;
}
#fanzine {
background: url(img/fanzine.png) top left no-repeat;
}
a#fanzine:hover, a#fanzine:focus {
background-position: 0% -20px;
}
#equipe {
background: url(img/equipe.png) top left no-repeat;
}
a#equipe:hover, a#equipe:focus {
background-position: 0% -20px;
}
#boutique {
background: url(img/boutique.png) top left no-repeat;
}
a#boutique:hover, a#boutique:focus {
background-position: 0% -20px;
}
#contact {
background: url(img/contact.png) top left no-repeat;
}
a#contact:hover, a#contact:focus {
background-position: 0% -20px;
}
.invisible {
visibility: hidden;
}
/* Mise en place du mini menu------------------------------------------------ */
#minimenu {
position: absolute;
right: 25px;
bottom: 0px;
margin: 5px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}
#minimenu a {
margin: 0px;
padding: 0px;
text-decoration: none;
text-align: center;
color: #999999;
}
#minimenu a:hover,#menugauche a:focus {
font-weight: bold;
color: #000000;
text-decoration: underline;
}
#degrader {
height: 50px;
background-image: url(img/spirales.jpg);
margin: 25px 0px 0px 0px;
}
/* Mise en place des colonnes centrales---------------------------------------- */
#contenu {
position: relative;
width: 750px;
height: 450px;
margin: 20px 0px 0px 0px;
padding: 0px;
}
#colgauche {
position: absolute;
top: 0px;
left: 25px;
margin: 0px;
padding: 0px;
width: 220px;
background-color: #ffffff;
}
#colgauche h5 {
margin: 0px 0px 0px 0px;
padding: 0px;
text-align: center;
}
#colgauche p {
margin: 10px 0px 0px 0px;
padding: 0px;
text-align: justify;
}
#colcentre {
position: absolute;
top: 0px;
left: 265px;
margin: 0px;
padding: 0px;
width: 220px;
border: 1px #000000 solid;
}
#colcentre h4 {
margin: 0px;
padding: 0px;
text-align: center;
color: #ffffff;
background-color: #cc3333;
border-bottom: 1px #000000 solid;
}
#colcentre p {
margin: 5px 0px 0px 0px;
padding: 0px 5px 0px 5px;
text-align: justify;
}
#colcentre img {
border: none;
}
#coldroite {
position: absolute;
top: 0px;
right: 25px;
width: 220px;
height: auto;
margin: 0px 0px 10px 0px;
padding: 0px;
list-style-type: none;
}
#coldroite li {
margin: 0px 0px 10px 0px;
padding: 0px;
height: 100px;
background-color: #ffffff;
}
#coldroite li a {
background-color: #ffffff;
}
#coldroite img {
border: none;
}
/* MISE EN PLACE DE LA PAGE CONTACT -------------------------------------------- */
#contactcolgauche {
position: absolute;
top: 0px;
left: 25px;
margin: 0px;
padding: 0px;
width: 220px;
background-color: #ffffff;
}
#contactcolgauche h4 {
width: 300px;
margin: 0px;
padding: 0px;
text-align: center;
color: #cc0000;
border-bottom: 1px #000000 solid;
}
#contactcolgauche h5 {
width: 300px;
margin: 15px 0px 0px 0px;
padding: 0px;
text-align: center;
color: #333333;
border-bottom: 1px #ececef solid;
}
#contactcolgauche p {
width: 300px;
margin: 5px 0px 0px 0px;
padding: 0px;
text-align: center;
}
#contactcoldroite {
position: absolute;
top: 0px;
right: 25px;
width: 350px;
height: 400px;
margin: 0px 0px 10px 0px;
padding: 0px;
text-align: center;
}
/* MISE EN PLACE DE LA PAGE BOUTIQUE-------------------------------------------- */
#commander {
position: relative;
margin: 0px auto 0px auto;
padding: 0px;
width: 720px;
}
#commander h5 {
position: absolute;
top: 0px;
left: 0px;
width: 720px;
margin: 0px;
padding: 0px;
text-align: center;
color: #cc0000;
border-bottom: 1px #000000 solid;
}
#gauche {
position: absolute;
top: 30px;
left: 0px;
padding: 0px;
width: 270px;
text-align: justify;
}
#milieuboutique {
position: absolute;
top: 30px;
left: 290px;
margin: 0px;
padding: 5px 5px 5px 5px;
width: 270px;
background: #ececef;
text-align: justify;
border: 1px solid #999999;
}
#milieuboutique a {
text-decoration: none;
color: #cc0000;
font-weight: bold;
}
#milieuboutique a:hover, #milieuboutique a:focus  {
text-decoration: underline;
}
#droite {
position: absolute;
top: 30px;
right: 0px;
margin: 0px;
padding:  5px 5px 5px 5px;
width: 120px;
height: 105px;
overflow: auto;
background: #ffcccc;
text-align: center;
border: 1px solid #999999;
list-style-type: none;
}
#droite a {
text-decoration: none;
color: #666666;
font-weight: bold;
}
#droite a:hover, #droite a:focus  {
color: #cc0000;
text-decoration: underline;
}
#listeboutique {
position: absolute;
top: 200px;
left: 15px;
margin: 0px;
padding: 0px;
width: 720px;
list-style-type: none;
}
#listeboutique li {
float: left;
margin: 0px 14px 0px 0px;
padding: 0px;
width: 130px;
height: 190px;
background: #ececef;
}
#listeboutique li img {
border: none;
}
#listesuite{
position: absolute;
top: 390px;
left: 15px;
margin: 0px;
padding: 0px;
width: 720px;
list-style-type: none;
}
#listesuite li {
float: left;
margin: 0px 14px 0px 0px;
padding: 0px;
width: 130px;
height: 90px;
text-align: center;
}
#listesuite li img {
border: none;
}
#paypalhdb1 {
position: absolute;
top: 390px;
left: 5px;
margin: 0px;
padding: 0px;
}
#paypalhdb2 {
position: absolute;
top: 420px;
left: 150px;
margin: 0px;
padding: 0px;
}
#paypalhdb3 {
position: absolute;
top: 390px;
left: 290px;
margin: 0px;
padding: 0px;
}
#paypalhdb4 {
position: absolute;
top: 420px;
left: 430px;
margin: 0px;
padding: 0px;
}
#paypalhdb5 {
position: absolute;
top: 390px;
left: 580px;
margin: 0px;
padding: 0px;
}
/* MISE EN PLACE DE LA PAGE FESTIVAL ------------------------------------------- */
#colgauchefest {
position: absolute;
top: 0px;
left: 25px;
margin: 0px;
padding: 0px;
width: 150px;
height: 430px;
}
#colcentrefest {
position: absolute;
top: 0px;
left: 200px;
margin: 0px;
padding: 0px;
width: 350px;
}
#colcentrefest h4 {
margin: 0px;
padding: 0px;
text-align: center;
color: #cc0000;
border-bottom: 1px #999999 solid;
}
#colcentrefest h5 {
margin: 10px 0px 0px 0px;
padding: 0px;
text-align: center;
color: #000000;
border-bottom: 1px #999999 solid;
}
#colcentrefest p {
margin: 5px 0px 0px 0px;
padding: 0px 5px 0px 5px;
text-align: justify;
}
.listcentre {
margin: 0px;
padding: 10px 0px 10px 0px;
list-style-type: none;
text-align: center;
background: #ececef;
}
.listcentre a {
text-decoration: none;
color: #000000;
}
.listcentre a:hover, listcentre a:focus {
text-decoration: underline;
color: #000000;
}
#coldroitefest {
position: absolute;
top: 0px;
right: 25px;
width: 150px;
height: 430px;
margin: 0px 0px 10px 0px;
padding: 0px;
list-style-type: none;
}
/* mise en place du pied de page ----------------------------------------------- */
#pied {
margin: 15px 0px 0px 0px;
padding: 5px 0px 0px 0px;
width: 750px;
height: 30px;
background-color: #ffffff;
text-align: center; 
border-top: 1px #000000 dotted;
}
#pied a {
text-decoration: none;
color: #999999;
}
#pied a:hover, #pied a:focus {
text-decoration: underline;
color: #000000;
}