<!--

 body 
{ 

font-family: jura-demibold;
margin-top: 10px;
margin-bottom: 18px;
line-height: 26px;
background-color: #000000;
} 

.pop-hip , .picto , .logo ,   
.liste-puce , .free-mp3 ,
.video, .droits ,

{ position: absolute; }

.video { z-index:1; } 

.pop-hip , .tableau1 

{ background-color: #000000; }

.img-pad { text-align: center;
           padding: 5px; }


#conteneur 

{    margin-top: 10px;
     margin-left: auto;
     margin-right: auto;
     margin-bottom: 10px;
     text-align:justify;
     background-color: #000000;  }

.pop-hip {    	left: 50%; 
     		top: 50%;
     		margin-top: 10px;
     		margin-left: 10px;
     		margin-right: 10px;
     		margin-bottom: 10px;   }
              
.type-video { position: absolute;
              left: 5px;
	      top: 720px; 
              z-index: 1;    }

/*liens jaunes qui passent à l'orange  */

A {	font-size:24px;
	color: #FFCC00;
	text-decoration:none; }


A:hover {  color:#FF6600; }


/*tableau contenant les petites images des clips*/

.picto {	left: 20px;
		top: 510px;
		width: 320px;
		height: 150px;  }


/*logo atohm en haut de page*/


.logo {	
	text-align: left;
	top: 4px; }

/*liste mp3 à puce*/


.liste-puce {	left: 0px;
		top: 250px;
		width: 370px;
		height: 240px;
		font-family: jura-demibold;
		font-size:33px;
		color: #FF6600;
		line-height: 32px; }


/* titre audio type mp3*/

.free-mp3 { 	left: 16px;
		top: 184px;
		color: white; }




/*tableau video*/

.video { left: 184px;
	 top: 622px;
	 width: 700px;
	 height: 242px; }

.chapi1  { font-size:37px; 
           color:#FF6600; 
           letter-spacing:15px; }

.legendes { color:#c0c0c0; }

.txt-color { color:#c0c0c0; }


.tableau1 { position: relative;
            z-index:3;
	    top: 290px;	
	    left: 4px;
	    width: 100%;
	    height: 100%;
            padding: 4px;	
	    font-size: 24px;
	    line-height: 30px;
	    font-family: jura-demibold; }

.paragraf2::first-letter {
    
   float: left;
   font-size: 70px;  
   font-weight: normal;
   text-align: justify;
   margin-right: 10px;
   margin-bottom: 4px;
   margin-top: 0px;
   line-height: 30px; 
   text-shadow: 1px 1px 4px #000;  }


.paragraf2 {

   font-size: 26px;
   padding-left: 3px;
   margin-bottom: 2px;
   line-height: 30px;
   text-align: justify;  }




/*texte de présentation de l'artiste*/


.tableau  {	position: absolute;
                text-align:justify;
                line-height: 30px;
		padding: 8px;
                left: 280px;
		top: 160px;
		height: 100%;
		font-size : 24px;
		color: #fff;
                min-width: 360px;
		max-width: 100%;   
		font-family: jura-demibold; }

.flotte {	float: right;
		padding: 5px; }

.v-room {	float: left;
		padding: 5px; }

.c-room {	float: left;
		padding: 5px; }


.titre-video {  text-align: center;  }

.liste-puce

{ color: #FF6600; }


.droits {	position: relative; 
		top: 280px;
		left: 300px;
	        width: 1000px;
		height: 66px;
		color: #FF6600;
                font-family: jura-demibold;
		font-size: 24px;
		background-color: #000;
                text-align: right;
		z-index: 1;   }

@font-face {
  font-family: 'jura-demibold';
  src: url('../fonts/jura-demibold-webfont.eot');
  src: url('../fonts/jura-demibold-webfont.eot?#iefix') format('embedded-opentype'),
       url('../fonts/jura-demibold-webfont.woff') format('woff'),
       url('../fonts/jura-demibold-webfont.ttf') format('truetype'),
       url('../fonts/jura-demibold-webfont.svg#jurademibold') format('svg');
  font-weight: normal;
  font-style: normal;
}