body     { background-image: url(../images/fond.jpg); background-repeat: repeat-x; background-position: 0 15px; margin: 0 }
td   { color: #fff; font-size: 12px; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: none }
div { color: #fff; font-size: 12px; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: none }
a    { color: #fff; font-size: 12px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; text-decoration: none }
a:hover    { color: #fff; font-size: 12px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; text-decoration: underline }

/* ELEMENTS CANEVAS */
#bg    { background-image: url(../images/bg.jpg); background-repeat: no-repeat; background-position: 0 0; position: absolute; top: 15px; left: 0; width: 100%; height: 670px }
#logo   { background-image: url(../images/logo.jpg); background-repeat: no-repeat; background-position: 0 0; position: absolute; top: 40px; left: 350px; width: 200px; height: 199px; border-bottom: 1px dotted white }
#menu  { position: absolute; top: 240px; left: 350px; width: 200px; height: 445px }
#elementMenu { background-image: url(../images/menuElement.jpg); background-repeat: no-repeat; background-position: 0 0; position: absolute; top: 685px; left: 300px; width: 250px; height: 360px; border-bottom: 1px solid white }
#colonneG  { background-position: 0 0; position: absolute; top: 40px; left: 0; width: 350px; height: 645px; overflow: hidden }
#colonneD { background-position: 0 0; position: absolute; top: 40px; left: 550px; width: 350px; height: 645px; overflow: hidden }
#bordureDroite  { background-color: #5A632B; background-position: 0 0; position: absolute; top: 40px; left: 900px; width: 22px; height: 645px; overflow: hidden }
.bordureBlanche  { background-image: url(../images/tiretVertical.gif); background-position: 0 0; position: absolute; top: 40px; width: 1px; height: 645px }
#bordure1  { left: 349px }
#bordure2  { left: 549px }
#bordure3 { left: 900px }
#bordure4 { left: 922px }

/* VIEWER COLONNE */
.viewerColonne  { position: relative; top: 0; left: 0; width: 350px; height: 645px; overflow: hidden }
.viewerColonneElement { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat }
.imgLink  { border: solid 1px #333 }
.imgLink:hover  { border: solid 1px #fff }
#viewerThumbGalerie  { }
.viewerGalerie   { display: none; width: 350px; height: 645px; border: solid 2px #333 }
.viewerGalerieTxt  { display: none; padding: 15px }
/* CONTENER */
#contentAccueil  { display: none; padding: 3px }
#contentHistoire  { display: none }
#contentHistoireScroller    { top: 0; left: 0; width: 350px; height: 550px; overflow: hidden }
#contentHistoireTexte    { padding: 3px; position: relative }
#contentAgenda { display: none }
#contentAgendaScroller  { top: 0; left: 0; width: 350px; height: 550px; overflow: hidden }
#contentAgendaTexte  { position: relative }
#contentSpectacle { display: none }
#contentSpectacleScroller  { top: 0; left: 0; width: 350px; height: 550px; overflow: hidden }
#contentSpectacleTexte  { padding: 3px; position: relative }
#contentMedia { display: none }
#contentMediaScroller   { top: 0; left: 0; width: 350px; height: 550px; overflow: hidden }
#contentMediaTexte { position: relative }
#contentContact  { display: none; }
#contentContactTexte { padding: 3px; position: relative }
#contentLien { display: none }
#contentLienScroller  { top: 0; left: 0; width: 350px; height: 550px; overflow: hidden }
#contentLienTexte { position: relative }
#contentNews { display: none }
#contentNewsScroller { top: 0; left: 0; width: 350px; height: 550px; overflow: hidden }
#contentNewsTexte { position: relative }
#viewerAccueil { display: none }
#viewerHistoire { display: none }
#illustrationAgenda { display: none }
#illustrationSpectacle { display: none }
#illustrationMedia { display: none }
#formulaireContact  { display: none }
#illustrationLien { display: none }
#illustrationNews { display: none }
/* SCROLLER */
#ScrollButtons    { background-color: #BFD25A; top: 0; left: 0; width: 350px; height: 45px }
#buttonUp  { background-image: url(../images/flecheBas.gif); background-repeat: no-repeat; width: 25px; height: 25px; position: relative; top: 10px; left: 149px }
#buttonDown  { background-image: url(../images/flecheHaut.gif); background-repeat: no-repeat; width: 25px; height: 25px; position: relative; top: -15px; left: 176px }

/* TEXTES */
.textedebase { color: #fff; font-size: 14px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold }
.titre  { color: #fff; font-size: 20px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold }
/*SPECTACLES */
.contentSpectacle { display: none }
.contentSpectacleScroller   { top: 0; left: 0; width: 350px; height: 600px; overflow: hidden }
.contentSpectacleTexte  { padding: 3px; position: relative }
/*VIEWER FULL SCREEN */
.viewerFullScreen   { background-color: black; display: none; position: absolute; z-index: 1000; top: 0; left: 0; width: 100%; height: 100% }
.viewerCadre  { margin: 0; padding: 0; border: solid 2px #333 }
.viewerGaleriesFullScreen    { background-color: black; display: none; position: absolute; z-index: 1000; top: 0; left: 0; width: 100%; height: 100%; overflow: auto }
/*MISE EN FORME*/
.titre { color: white; font-size: 18px; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: none }
.titre:hover { color: white; font-size: 18px; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: underline }
.titre02  { color: #d4e57a; font-size: 14px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; text-decoration: none }
.separateur01 { border-bottom: 1px dotted #fff }
.cadreBlanc { border: solid 2px #fff }
.lien  { color: #d4e57a; font-size: 12px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; text-decoration: none }
.lien:hover  { color: #d4e57a; font-size: 12px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; text-decoration: underline }
/*FORMULAIRE*/
input  { color: #666; font-size: 11px; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: none; background-color: #fff; padding: 2px; border: solid 2px #000 }
textarea  { color: #666; font-size: 11px; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: none; background-color: #fff; padding: 2px; border: solid 2px #000 }
/*MESSAGE BOX*/
#messageBox  { color: #fff; font-size: 12px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; text-decoration: none; background-color: #93AF01; text-align: center; display: none; padding: 5px; position: absolute; top: 100px; left: 250px; width: 400px; height: 200px; vertical-align: middle; border: solid 2px }
/*SITE LOADER*/
#siteLoader { color: #666; background-color: #fff; text-align: center; position: absolute; z-index: 10000; top: 0; left: 0; width: 100%; height: 100% }
/*ESPACE PRO*/
#bgPro { background-image: url(../images/bgPro.gif); background-repeat: repeat-x; background-position: 0 0; position: absolute; top: 15px; left: 0; width: 100%; height: 670px }
#fondPro { background-color: #AF1D01; top: 15px; width: 100%; height: 100%; position: absolute }
#bordureDroitePro  { background-color: #7A1401; background-position: 0 0; position: absolute; top: 40px; left: 900px; width: 22px; height: 100%; overflow: hidden }
.bordureBlanchePro { background-color: white; background-position: 0 0; position: absolute; top: 40px; width: 1px; height: 100% }
#contenerPro { background-position: 0 0; position: absolute; top: 40px; left: 3px; width: 800px; }
/*CREDITS*/
#credits { color: #999; font-size: 11px; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: none; position: absolute; top: 685px; left: 500px; height: 25px }
.creditslien { color: #999; font-size: 11px; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: none }
.creditslien:hover { color: #999; font-size: 11px; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: underline }
/*MENU HTML*/
#menuHTML { color: #D4E57A; font-size: 11px; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: none; position: absolute; top: 20px; left: 20px; height: 20px }
.elementMenuHTML { color: #D4E57A; font-size: 11px; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: none }
.elementMenuHTML:hover  { color: #D4E57A; font-size: 11px; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: underline }