/* CSS Document */

body {background-color: black} 

div#global-a     /*site au complet court*/
     {
     position: relative;
     margin: auto;
     background-color: moccasin;
     width: 800px;
     height: 800px;
     text-align: left;
     }     
     
div#global-b     /*site au complet longt*/
     {
     position: relative;
     margin: auto;
     background-color: moccasin;
     width: 800px;
     height: 1455px;
     text-align: left;
     }     


/* head /////////////////// */

     
div#head     /*haut du site*/
     {
     position: absolute;
     margin-left: 0px;
     background-image: url('images/head-fond2.jpg');
     width: 800px;
     height: 150px;
     top: 15px;
     border-bottom: solid 0px #ff432f;
     }     

div#head-top     /*barre du haut du site*/
     {
     position: absolute;
     top: 0px;
     margin-left: -15px;
     background-image: url('images/head-top.jpg');
     width: 830px;
     height: 15px;
     border-bottom: solid 0px #ff432f;
     }   

div#barre-droite     /* barre côté droit haut du site */
     {
     position: absolute;
     margin-left: 800px;
     background-image: url('images/barre-droite.jpg');
     top: 15px;
     width: 15px;
     height: 150px;
     border: solid 0px red;
     } 

div#barre-gauche     /* barre côté gauche haut du site */
     {
     position: absolute;
     margin-left: -15px;
     background-image: url('images/barre-gauche.jpg');
     top: 15px;
     width: 15px;
     height: 150px;
     border: solid 0px red;
     } 


/* centre du site ///////////////////// */


div#barre-droite2     /* barre côté droit */
     {
     position: absolute;
     margin-left: 800px;
     background-image: url('images/barre-droite2.jpg');
     top: 165px;
     width: 15px;
     height: 635px;
     border: solid 0px red;
     }
     
div#barre-gauche2     /*Accueil - barre côté gauche*/
     {
     position: absolute;
     margin-left: -15px;
     background-image: url('images/barre-gauche2.jpg');
     top: 165px;
     width: 15px;
     height: 635px;
     border: solid 0px red;
     } 

div#barre-droite3     /* barre côté droit composition */
     {
     position: absolute;
     margin-left: 800px;
     background-image: url('images/barre-droite2.jpg');
     top: 165px;
     width: 15px;
     height: 1235px;
     border: solid 0px red;
     }
     
div#barre-gauche3     /* - barre côté gauche - composition */
     {
     position: absolute;
     margin-left: -15px;
     background-image: url('images/barre-gauche2.jpg');
     top: 165px;
     width: 15px;
     height: 1235px;
     border: solid 0px red;
     } 

div#gauche     /*gauche du site*/
     {
     position: absolute;
     margin-left: 30px;
     top: 220px;
     width: 180px;
     height: 550px;
     text-align: left;
     border: solid 0px red;
     } 
     
div#gauche3     /*gauche du site*/
     {
     position: absolute;
     margin-left: 30px;
     top: 220px;
     width: 180px;
     height: 1000px;
     text-align: left;
     border: solid 0px red;
     }      



div#presentation-large     /* presentation large Holos */
     {
     position: absolute;
     margin-left: 240px;
     top: 220px;
     width: 555px;
     height: 530px;
     text-align: left;
     border: solid 0px red;
     } 

      div#presentation     /*présentation holos*/
           {
           position: absolute;
           margin-left: 0px;
           top: 0px;
           width: 280px;
           height: 550px;
           text-align: left;
           border-top: solid 0px red;
           }


      div#droit     /*Accueil - côté droit*/
           {
           position: absolute;
           margin-left: 280px;
           top: 0px;
           width: 245px;
           height: 550px;
           text-align: left;
           border: solid 0px red;
           } 
     
     
div#presentation-large3     /* presentation large Holos */
     {
     position: absolute;
     margin-left: 240px;
     top: 220px;
     width: 555px;
     height: 1000px;
     text-align: left;
     border: solid 0px red;
     } 


     
div#facebook     /* Holos facebook */
     {
     position: absolute;
     margin-left: 20px;
     top: 380px;
     width: 160px;
     height: 40px;
     border: solid 0px red;
     }      
     
     
/* div utilitaires /////////////////////////////// */


div#holos-video     /* vidéo Holos */
     {
     position: absolute;
     margin-left: 80px;
     top: 120px;
     width: 400px;
     height: 284px;
     text-align: left;
     border: solid 0px red;
     } 
     
/* //////////////////////// */

div#holos-agenda     /* agenda Holos */
     {
     position: absolute;
     margin-left: 80px;
     top: 60px;
     width: 400px;
     height: 284px;
     text-align: left;
     border: solid 0px red;
     } 
     
div#holos-agenda-frame   /* Holos agenda-frames  */
   {
   position: absolute;
   top: -10px;
   margin-left: -10px;
   width: 384px;
   height: 4000px;
   background-color: sandybrown;
   z-index:1;
   border: solid 0px black;
   } 
      

/* ALBUM //////////////////// */

div#album     /* album holos*/
     {
     position: absolute;
     margin-left: 0px;
     top: 0px;
     width: 300px;
     height: 300px;
     text-align: left;
     border: solid 0px red;
     } 

 
     
div#pochette     /* pochette album holos*/
     {
     position: absolute;
     margin-left: 330px;
     top: 0px;
     width: 235px;
     height: 240px;
     text-align: left;
     border: solid 0px red;
     }      
     

div#titre-album     /* titre album - album */
     {
     position: absolute;
     margin-left: 0px;
     top: 250px;
     width: 550px;
     height: 20px;
     border: solid 0px red;
     }


                div#titre1     /* titre chanson 1 - album */
                     {
                     position: absolute;
                     margin-left: 0px;
                     top: 290px;
                     width: 300px;
                     height: 20px;
                     border: solid 0px red;
                     }
                
                div#mp3-1     /* mp3-1 - album */
                     {
                     position: absolute;
                     margin-left: 300px;
                     top: 290px;
                     width: 245px;
                     height: 20px;
                     border: solid 0px blue;
                     }
                     
                div#titre2     /* titre chanson 2 - album */
                     {
                     position: absolute;
                     margin-left: px;
                     top: 315px;
                     width: 300px;
                     height: 20px;
                     border: solid 0px red;
                     }
                
                div#mp3-2     /* mp3-2 - album */
                     {
                     position: absolute;
                     margin-left: 300px;
                     top: 315px;
                     width: 245px;
                     height: 20px;
                     border: solid 0px blue;
                     }     
                 
                div#titre3     /* titre chanson 3 - album */
                     {
                     position: absolute;
                     margin-left: 0px;
                     top: 340px;
                     width: 300px;
                     height: 20px;
                     border: solid 0px red;
                     }
                
                div#mp3-3     /* mp3-3 - album */
                     {
                     position: absolute;
                     margin-left: 300px;
                     top: 340px;
                     width: 245px;
                     height: 20px;
                     border: solid 0px blue;
                     }   
                 
                div#titre4     /* titre chanson 4 - album */
                     {
                     position: absolute;
                     margin-left: 0px;
                     top: 365px;
                     width: 300px;
                     height: 20px;
                     border: solid 0px red;
                     }
                
                div#mp3-4     /* mp3-4 - album */
                     {
                     position: absolute;
                     margin-left: 300px;
                     top: 365px;
                     width: 245px;
                     height: 20px;
                     border: solid 0px blue;
                     }
                
                div#titre5     /* titre chanson 5 - album */
                     {
                     position: absolute;
                     margin-left: 0px;
                     top: 390px;
                     width: 300px;
                     height: 20px;
                     border: solid 0px red;
                     }
                
                div#mp3-5     /* mp3-5 - album */
                     {
                     position: absolute;
                     margin-left: 300px;
                     top: 390px;
                     width: 245px;
                     height: 20px;
                     border: solid 0px blue;
                     }
                
                div#titre6     /* titre chanson 6 - album */
                     {
                     position: absolute;
                     margin-left: 0px;
                     top: 415px;
                     width: 300px;
                     height: 20px;
                     border: solid 0px red;
                     }
                
                div#mp3-6     /* mp3-6 - album */
                     {
                     position: absolute;
                     margin-left: 300px;
                     top: 415px;
                     width: 245px;
                     height: 20px;
                     border: solid 0px blue;
                     } 
                 
                div#titre7     /* titre chanson 7 - album */
                     {
                     position: absolute;
                     margin-left: 0px;
                     top: 440px;
                     width: 300px;
                     height: 20px;
                     border: solid 0px red;
                     }
                
                div#mp3-7     /* mp3-7 - album */
                     {
                     position: absolute;
                     margin-left: 300px;
                     top: 440px;
                     width: 245px;
                     height: 20px;
                     border: solid 0px blue;
                     } 
                
                div#titre8     /* titre chanson 8 - album */
                     {
                     position: absolute;
                     margin-left: 0px;
                     top: 465px;
                     width: 300px;
                     height: 20px;
                     border: solid 0px red;
                     }
                
                div#mp3-8     /* mp3-8 - album */
                     {
                     position: absolute;
                     margin-left: 300px;
                     top: 465px;
                     width: 245px;
                     height: 20px;
                     border: solid 0px blue;
                     } 
                 
                div#titre9     /* titre chanson 9 - album */
                     {
                     position: absolute;
                     margin-left: 0px;
                     top: 490px;
                     width: 300px;
                     height: 20px;
                     border: solid 0px red;
                     }
                
                div#mp3-9     /* mp3-9 - album */
                     {
                     position: absolute;
                     margin-left: 300px;
                     top: 490px;
                     width: 245px;
                     height: 20px;
                     border: solid 0px blue;
                     }  
                 
                div#titre10     /* titre chanson 10 - album */
                     {
                     position: absolute;
                     margin-left: 0px;
                     top: 515px;
                     width: 300px;
                     height: 20px;
                     border: solid 0px red;
                     }
                
                div#mp3-10     /* mp3-10 - album */
                     {
                     position: absolute;
                     margin-left: 300px;
                     top: 515px;
                     width: 245px;
                     height: 20px;
                     border: solid 0px blue;
                     }  
                 
                div#titre11     /* titre chanson 11 - album */
                     {
                     position: absolute;
                     margin-left: 0px;
                     top: 540px;
                     width: 300px;
                     height: 20px;
                     border: solid 0px red;
                     }
                
                div#mp3-11     /* mp3-11 - album */
                     {
                     position: absolute;
                     margin-left: 300px;
                     top: 540px;
                     width: 245px;
                     height: 20px;
                     border: solid 0px blue;
                     }  
 
/* /////////////////////////////// */

div#achat     /* Pour onglet ACHETER page ACHAT  */   
   {
   position: absolute;
   top: 160px;
   margin-left: 230px;
   width: 100px;
   height: 20px;
   border: solid 0px blue;
   }

div#achat2     /* deuxième partie de la page ACHAT */
     {
     position: absolute;
     margin-left: 0px;
     top: 300px;
     width: 555px;
     height: 200px;
     text-align: left;
     border: solid 0px red;
     }
     
div#formulaire     /* commande CD formulaire poste */
     {
     position: absolute;
     margin-left: 170px;
     top: 215px;
     width: 500px;
     height: 530px;
     text-align: left;
     border: solid 0px red;
     }  
         
div#retour     /* retour de bas de la page poste */
     {
     position: absolute;
     margin-left: 170px;
     top: 720px;
     width: 500px;
     height: 30px;
     text-align: left;
     border: solid 0px red;
     }      

/* //////////////////////////////// */

div#composition-mp3     /* Pour boite mp3 - composition   */   
   {
   position: absolute;
   top: 480px;
   margin-left: 50px;
   width: 450px;
   height: 200px;
   border: solid 0px blue;
   }
   
div#doux-demon     /* Pour MP3 Doux Démon   */   
   {
   position: absolute;
   top: 0px;
   margin-left: 122px;
   width: 220px;
   height: 100px;
   border: solid 0px blue;
   }
   
div#alamerci     /* Pour MP3 Doux Démon   */   
   {
   position: absolute;
   top: 120px;
   margin-left: 122px;
   width: 220px;
   height: 100px;
   border: solid 0px blue;
   }

  
div#reine     /* Pour vidéo La reine des nomades   */   
   {
   position: absolute;
   top: 50px;
   margin-left: 50px;
   width: 450px;
   height: 320px;
   border: solid 0px blue;
   }  
   
div#pilier    /* Pour vidéo J'ai secoué tes piliers   */   
   {
   position: absolute;
   top: 740px;
   margin-left: 50px;
   width: 450px;
   height: 320px;
   border: solid 0px blue;
   }  

 
     
/* /////////////////////////////// */
     
     
div#basdusite     /*bas du site*/
     {
     position: absolute;
     margin-left: -15px;
     top: 800px;
     background-image: url('images/basdusite3.jpg');
     width: 830px;
     height: 55px;
     text-align: left;
     border: solid 0px red;
     }      

div#basdusite3     /*bas du site*/
     {
     position: absolute;
     margin-left: -15px;
     top: 1400px;
     background-image: url('images/basdusite3.jpg');
     width: 830px;
     height: 55px;
     text-align: left;
     border: solid 0px red;
     }      


/* /////////////////////////////////////// */


     
img.logo
     {
     position: absolute;
     top: 20px;
     margin-left: 80px;
     } 

img.poster
     {
     position: absolute;
     top: 10px;
     margin-left: 0px;
     }

img.silouette
     {
     position: absolute;
     top: 450px;
     margin-left: 100px;
     }

img.pochette
     {
     position: absolute;
     top: 60px;
     margin-left: 0px;
     }
     
img.acheter     /* image "Acheter" en haut de CD  */
     {
     position: absolute;
     top: 10px;
     margin-left: 45px;
     }     

img.facebook
     {
     position: absolute;
     top: -2px;
     margin-left: 30px;
     }


/* /////////////////////////////// */


p.texte
     {
     font-size: 12px;
     margin-left: 0px;
     margin-right: 20px;
     margin-top: 10px;
     color: #A52A2A;
     font-weight: bold;
     }
     
p.texte2     /* texte sous image - accueil */
     {
     font-size: 12px;
     margin-left: 0px;
     margin-right: 10px;
     margin-top: 320px;
     color: #A52A2A;
     font-weight: bold;
     } 

p.texte3   /* texte centré page Achat */
     {
     font-size: 12px;
     text-align: center;
     margin-left: 50px;
     margin-right: 50px;
     margin-top: 10px;
     color: #A52A2A;
     font-weight: bold;
     } 
          
p.texte-gauche
     {
     font-size: 15px;
     text-align: right;
     margin-right: 20px;
     margin-top: 0px;
     color: #A52A2A;
     font-weight: bold;
     }
     
p.texte-gauche-petit
     {
     font-size: 11px;
     text-align: right;
     margin-right: 20px;
     margin-top: 0px;
     color: #A52A2A;
     font-weight: bold;
     }     
     
p.texte-bas
     {
     font-size: 12px;
     text-align: center;
     margin-top: 10px;
     color: Moccasin;
     font-weight: bold;
     } 
     
p.titre
     {
     font-size: 24px;
     text-align: center;
     margin-top: 0px;
     color: #A52A2A;
     font-weight: bold;
     }       
     
p.titre2     /* titres des chansons - album */
     {
     font-size: 10px;
     text-align: right;
     margin-right: 20px;
     margin-top: 0px;
     color: #A52A2A;
     font-weight: bold;
     }      
     
p.titre3   /* titre de Album */
     {
     font-size: 18px;
     text-align: center;
     margin-top: 0px;
     color: #A52A2A;
     font-weight: bold;
     }

p.titre4   /* crédits vidéo - composition */
     {
     font-size: 11px;
     margin-left: 0px;
     text-align: center;
     margin-top: 0px;
     color: #A52A2A;
     font-weight: bold;
     }

 
     
p.holos-agenda-date   /* date de spectacles */
{
font-size: 12px;
margin-left: 30px;
color: #DC143C;
font-weight: bold;
margin-top: 10px;
}

p.holos-agenda   /* date de spectacles */
{
font-size: 13px;
margin-left: 30px;
color: #A52A2A;
font-weight: bold;
margin-top: -5px;
}