body {
	margin: auto;
	width:1600px;
	background-color:#044421;
	font: 80% CenturyGothic, Tahoma, verdana, arial, sans-serif;
        /*border:solid yellow 1px;*/
}

.tableau{
	width:55%;
}
#celluleBatterie{
	width:850px;
}
.lignePhotos{
	height:220px;
        overflow:hidden;
}
#imageBatterie {
	 width:386px; /*500px;*/
	 height:380px; /*492px;*/
}
#fondAcceuil{
	display:inline-block;
	position:absolute;
	top:10px;
	background-repeat:no-repeat; 
	background-image:url('garde10.png');
	width:1150px;
	height:800px;
}
#menugeneral{
	display:inline-block;
	width:390px;
	text-align:center;
}
#menugeneral .categorieMenu {
	display:inline-block;
	width:370px;
	background-color:#ffff00;
	margin: 0;
	padding: 10px;
	font-size:2em; 
	border-radius:5px;
}
.sousmenu {
	display:inline-block;
	background-color:#ffffff;
	margin: 5px;
	padding: 5px;
	border-radius:10px;	
}
.sousmenu a{
	display:inline-block;
	font-size:0.8em; 
	text-decoration:none;
	color:#0000ff;
	width:340px;
}
.sousmenu:hover{
	background-color:#0000ff;
	border:solid 1px #0000ff;
}
.sousmenu:hover a{
	color:#ffffff;
}
#conteneur {
	display:block;
	position:relative;
	width:1200px; 
        margin:auto; 
        /*border:solid blue 1px;*/
}
#menu{
    /*border:solid black 1px;*/
}
#menuhaut {
background-color:#044421;
/*border:solid purple 1px;*/
}
ul, li {
margin: 0;
padding: 5px;
list-style-type: none;
}
#menuhaut li {
	display:inline-block;
	text-align: center;
	background-color:#ffffff;
	width:268px;
	/*border:solid 1px black;*/
	font-size:2em; 
	border-radius:5px;
}
#menuhaut li a{
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}
#menuhaut li a:hover{
	background: #eee;
}
#contenu{
	width:1150px;
	position:relative;
	top:30px;
}
h1 {
	width:500px;
	margin-left:325px;
	font-size:3em; 
	color:#ffffff; 
	text-align:center;
	text-shadow: #000000 1px 1px;
        font-family: "Great Vibes",CenturyGothic, Tahoma, verdana, arial, sans-serif;
}
h2 {
    color:#ffffff; 
    text-align:center;
    text-shadow: #000000 1px 1px;
}

.conteneuraccueil { /*table,tr,td*/
	/*background-color:#044421;*/
        margin: auto;
	width:1590px;
        /*border:dashed 1px red;*/
}   
.hautAccueil{
    display:inline-block;
    width:1580px;
    height:370px;
    overflow:hidden;
    /*border:solid 1px black;*/
}
.gauchehaut {
    display:inline-block;
    text-align:center;
    width:520px;
    overflow:hidden;
    /*border:dashed 1px green;*/
}
.centrehaut {
    top:10px;
    display:inline-block;
    text-align:center;
    width:500px;
    height:340px;
    vertical-align: top;
    /*border:solid 1px yellow;*/
}
.droitehaut {
    display:inline-block;
    text-align:center;
    width:520px;
    /*border:dashed 1px green;*/
}
.gauche {
    display:inline-block;
    text-align:center;
    width:520px;
    overflow:hidden;
    /*border:dashed 1px green;*/
}
.droite {
    display:inline-block;
    text-align:center;
    width:520px;
    /*border:dashed 1px green;*/
}
.gauchebas{
    margin-top:20px;
    display:inline-block;
    text-align:center;
    width:520px;
    overflow:hidden;
    /*border:dashed 1px green;*/
}
.centrebas {
    margin-top:20px;
    display:inline-block;
    text-align:center;
    width:500px;
    /*border:solid 1px yellow;*/
}
.centre {
    margin-top:20px;    
    top:10px;
    display:inline-block;
    text-align:center;
    width:500px;
    height:200px;
    vertical-align: middle;
    /*border:solid 1px yellow;*/
}
#animBatterie{
    top:-40px;/*-150px*/
    font-family: CenturyGothic, Tahoma, verdana, arial, sans-serif;
    font-size:0.4em;
    text-align: center;
    color:#044421;
}
.tooltip
{
  text-decoration:none;
  position:relative;
}
 
.tooltip span
{
  display:none;
  -moz-border-radius:120px;
  -webkit-border-radius:120px;
  border-radius:120px;
  color:white;
  background:#044421; 
  
}

.tooltip:hover span
{
  display:inline-block;
  position:absolute;
  z-index:1000;
  /*border:1px solid black;*/
  overflow:hidden;
  top:-170px;/*-170px*/
  left:0px;
  width:380px;
  height:280px;
  padding-top:120px;
  background-image:url('photo03_400334.jpg');
  font-size:2em;
  background-repeat:no-repeat;
  text-shadow: #000000 1px 1px;
}
.titreacceuil{
    top:40px;
    font-family: "Great Vibes",CenturyGothic, Tahoma, verdana, arial, sans-serif;
    font-size:6em;
    text-align: center;
    color:white;
}
.texteAccueil{
    font-family: "Great Vibes",CenturyGothic, Tahoma, verdana, arial, sans-serif;
    font-size:2.5em;
    text-align: center;
    color:white;
}
#imageGauche { 
    border-radius:50px;
}
#imageDroite {
	border-radius:50px;
}
#imageDates {
	 width:200px;
	 height:200px;	
}
#imageAudio {
	 width:200px;
	 height:200px;;	
}
#imageVideo {
	 width:200px;
	 height:200px;	
}
#imageContact {
	 width:200px;
	 height:200px;	
}
#imagePhoto {
	 width:200px;
	 height:200px;	
}
.contenu_fb{
	position: relative;
	top:0px;
	left:300px;
	width:550px;
        font-family: "Lucida Handwriting", CenturyGothic, Tahoma, verdana, arial, sans-serif;
        font-size:3em;
        text-align: center;
        color:#ffffff;
}
.contenu_fb iframe{
	display:inline-block;
	position: relative;
	top:0px;	
	left:0px;
	text-align:left;
	margin:0;
	
}
.jaime_fb{
        display:inline-block;
	width:850px;
	text-align:center;
	margin-left:370px;
        /*border:solid 1px palevioletred;*/
}
.jaime_fb iframe{
	display:inline-block;
	position: relative;	
	width:500px;
	text-align:left;
	top:0px;	
	left:0px;
	text-align:left;
	margin:0;
	
}
#media{

}
#audio{
	display:inline-block;
}
audio{
	display:inline;
	border:#ffffff;
	border-radius:15px;
	/*background-color:ffffff;*/
	filter: sepia(20%) saturate(70%) grayscale(1) contrast(99%) invert(12%);
}
#video{
	position:relative;
	top:0px;
	display:inline-block;
	width:185px;
	height:100px;
}
.audio{
	position:relative;
	top:0px;
	display:inline-block;
	width:185px;
	height:100px;
}
.audio a{
	display:inline;
}
.musiques{
	display:block;
	margin-bottom:20px;
}
.titremorceau{
	display:inline-block;
	width:350px;
	font-size:2em; 
	text-align:right;
}
#video a{
	display:inline;
}
.slogan {
	position:relative; 
	width:900px; 
	
	left:0px; 
	z-index:10; 
	
	color:#ffffff; 
	text-align:center;
	margin-left:200px;
	text-shadow: #000000 1px 1px;
}
.texte20{
	font-size:2em; 
}
.texte15{
	font-size:1.5em; 
}
.top100{
	top:100px; 
}
.top200{
	top:200px; 
}
.top275{
	top:275px; 
}
.jaune{
	color:#ffff00;
}
/* Galerie photo */
.retour{
	margin-left:440px;
	display:block;
	width:268px;
	padding: 5px;
	font-size:2em; 
	color:#ffffff; 
	text-align:center;
	border:1px solid black;
	border-radius:5px;
	background-color:#ffffff;
}
.retour a{
	width:100%;
	text-decoration: none;
	display: block;
	border: 0 none;
}
iframe{
	  margin-left:295px;
	  margin-top:100px;
	  }
.infosPro{
	position:relative; 
	width:900px; 
	top:250px; 
	left:0px; 
	z-index:10; 
	font-size:2em; 
	color:#ffffff; 
	text-align:center;
	margin-left:200px;
	text-shadow: #000000 1px 1px;
}	  
/*.infoPro table,tr,td{
	 background-color: rgba(200, 200, 0, 0.1);
}*/
.infosPro a{
	text-decoration: none;
	color:#000099;
}
.infosPro a link{
	text-decoration: none;
	color:#000099;
	
}
.infosPro a visited{
	text-decoration: none;
	color:#ffff00;
}
.infotelecharge{
	font-size:0.5em;
	text-decoration:italic;
	color:#ffff00;
}
.contenuAudio{
	display:inline-block;
	width:480px;
	position:relative;
	margin-left:365px;
}	
.player_cls{
	display:inline-block;
	margin-left: 5px;
	border-radius: 15px;
	background: rgb(90%,90%,90%);
	border: outset 2px gray;
	box-shadow: 3px 3px 10px black;
	width:95%;
}
.playlist{
	display:inline-block;
	margin-left: 5px;
	border-radius: 15px;
	background: rgb(90%,90%,90%);
	border: outset 2px gray;
	box-shadow: 3px 3px 10px black;
	width:95%;
}
.unSon {
	margin-bottom:5px;
	background:transparent;
	cursor:pointer;
	width:100%;
	overflow:hidden;
	text-align:left;
	display:block;
	padding:0.2%;
	border:none;
	font-style:italic; 
	font-size:1.5em;
}
.playTitre{
	font-size:1.7em;
	text-align:left;
	font-weight:bold;
	padding:0.5%;
	color:#0000FF;
}
#gallerie {
    width:100%;
}
.centreImage{
    width:100%;
    text-align: center; 
    /*border:solid red 1px;*/
    margin-bottom: 5px;
}
.pagePro {
    width:600px;
    margin:auto;
}
.proAffiche{
    display: inline-block;
    width:350px;
    font-size: 2em;
    margin:5px;
    vertical-align: middle;
    text-align: center;
}

.proTexte{
    display: inline-block;
    width:220px;
    font-size: 1.7em;
    vertical-align: middle;
    color: white;
}
@font-face {
 font-family: "Great Vibes";
 src: url("/css/GreatVibes-Regular.ttf") format("truetype");
}

@media screen  and  (min-width: 1101px) and (max-width: 1400px) {
body {
	width:1200px;
}
.conteneuraccueil { /*table,tr,td*/
	width:1190px;
}   
.hautAccueil{
    width:1179px;
}
.gauchehaut {
    width:390px;
}
#imageGauche { 
    width:380px;
}
.centrehaut {
    width:380px;
}
.droitehaut {
    width:390px;
}
.gauche {
    width:380px;
}
.droite {
    width:380px;
}
.gauchebas{
    width:380px;
}
.centrebas {
    width:370px;
}
.centre {
    width:370px;
}
.titreacceuil{
    font-size:4em;
}
.texteAccueil{
    font-size:2em;
}
.tooltip:hover span
{
  width:380px;
  left:-90px;
}
.videos iframe{
	  margin-left:200px;
	  margin-top:100px;
	  }
.jaime_fb{
    margin-left:165px;
}
}
@media screen  and  (min-width: 821px) and (max-width: 1100px) {
body {
	width:1024px;
}
.conteneuraccueil { /*table,tr,td*/
	width:1020px;
}   
#conteneur {
	width:1020px; 
}
#menuhaut li {
	width:230px;
	font-size:1.8em; 
}
.hautAccueil{
    width:999px;
}
.gauchehaut {
    width:320px;
}
.centrehaut {
    width:310px;
}
.droitehaut {
    width:320px;
}
#imageGauche { 
    width:320px;
}
#imageDroite {
    width:320px;
}
.gauche {
    width:320px;
}
.droite {
    width:320px;
}
.centrebas {
    width:310px;
}
.gauchebas{
    width:320px;
}
.centre {
    width:310px;
    height:200px;
}
.titreacceuil{
    font-size:4em;
}
.texteAccueil{
    font-size:1.8em;
}
.tooltip:hover span
{
  width:320px;
  left:-90px;
}
.videos iframe{
	  margin-left:100px;
	  margin-top:50px;
    }
.centreImage img{
    width:100%;
}
.jaime_fb{
    margin-left:85px;
}
}
@media screen  and  (min-width: 610px) and (max-width: 820px) { 
body{
	width:100%;
}
.tableau{
	width:100%;
}
#conteneur {
	width:100%; 
}
#menuhaut li {
    display:block;
    width:100%;
}
#menugeneral{
	width:800px;
}
#menugeneral .categorieMenu {
	width:780px;
}
.sousmenu a{
	width:730px;
}
h1 {
	width:500px;
	margin-left:50px;
}	
.contenuAudio{
	width:480px;
	margin-left:65px;
}	
.lignePhotos{
        display: block;
	height:auto;
        overflow: auto;
}
.conteneuraccueil { /*table,tr,td*/
	width:100%;
}   
.hautAccueil{
    width:100%;
    height:auto;
}
.gauchehaut {
    display:none;
    width:0px;
}
.centrehaut {
    display:block;
    max-width: 400px;
    width:100%;
    height:auto;
}
.droitehaut {
    display:none;
    width:0px;
}
.gauche {
    width:200px;
}
.droite {
    width:200px;
    margin-top: 40px;
}
.centrebas {
    margin-top:0px;
    width:200px;
    height:auto;
}
.centre {
    margin-top:0px;
    width:200px;
    height:150px;
}
.gauchebas{
    margin-top:0px;
    width:200px;
}
.titreacceuil{
    font-size:4em;
}
.texteAccueil{
    font-size:1.7em;
}
audio{
    width:190px;
}
.tooltip:hover span
{
  display:none;
}
#imageDates {
	 width:150px;
	 height:150px;	
}
#imageAudio {
	 width:150px;
	 height:150px;		
}
#imageVideo {
	 width:150px;
	 height:150px;	
}
#imageContact {
	 width:150px;
	 height:150px;		
}
#imagePhoto {
	 width:150px;
	 height:150px;		
}
.contenu_fb{
        display: block;
	width:500px;
	left: 50px;
}
.contenu_fb iframe{
	width:500px;
	left:0px;
}
.centreImage img{
    width:100%;
}
.jaime_fb{
	width:100%;
	margin-left:10px;
}
.jaime_fb iframe{
	width:500px;
        margin-left:0px;
}
.videos iframe{
	  margin-left:50px;
	  margin-top:50px;
          width: 480px;
          height:270px;
    }
}
@media screen and  (min-width: 490px) and (max-width: 609px) { 
body{
	width:100%;
}
.tableau{
	width:100%;
}
#conteneur {
	width:100%;
}
#menugeneral{
	width:480px;

}
#menugeneral .categorieMenu {
	width:460px;
}
.sousmenu a{
	width:410px;
}
#menuhaut li {
    display:block;
    width:100%;
}
h1 {
	width:100%;
	margin-left:0px;
}	
.contenuAudio{
	width:100%;
	margin-left:0px;
}
.lignePhotos{
	height:auto;
        overflow: auto;
}
.conteneuraccueil { /*table,tr,td*/
	width:100%;
}   
.hautAccueil{
    width:100%;
    height:auto;
}
.gauchehaut {
    display:none;
    width:0px;
}
.centrehaut {
    display:block;
    width:100%;
    max-width: 400px;
    height:auto;
}
.droitehaut {
    display:none;
    width:0px;
}
.gauche {
    width:200px;
}
.droite {
    width:200px;
}
.centrebas {
    margin-top:0px;
    width:200px;
    height:auto;
}
.centre {
    margin-top:0px;
    width:200px;
    height:140px;
}
.gauchebas{
    margin-top:0px;
    width:200px;
}
.titreacceuil{
    font-size:4em;
}
.texteAccueil{
    font-size:1.7em;
}
audio{
    width:190px;
}
.tooltip:hover span
{
  display:none;
}
#imageDates {
	 width:140px;
	 height:140px;	
}
#imageAudio {
	 width:140px;
	 height:140px;		
}
#imageVideo {
	 width:140px;
	 height:140px;	
}
#imageContact {
	 width:140px;
	 height:140px;
}
#imagePhoto {
	width:140px;
	 height:140px;
}
.videos iframe{
	  margin-left:20px;
	  margin-top:20px;
          width: 448px;
          height:252px;
    }
    
.contenu_fb{
	width:500px;
	left:0px;
}
.contenu_fb iframe{
	width:400px;
	left:0px;
}
.centreImage img{
    width:100%;
}
.jaime_fb{
	width:100%;
	margin-left:0px;
}
.jaime_fb iframe{
	width:500px;
}
.pagePro {
    width:100%;
}
.proAffiche{
    display: block;
    width:95%;
    font-size: 2em;
    margin:5px;
    vertical-align: middle;
    text-align: center;
    padding: 5px;
}

.proTexte{
    display: block;
    width:95%;
    font-size: 1.7em;
    vertical-align: middle;
    color: white;
    padding: 5px;
}
}	

@media screen and (max-width: 489px) {
body{
	width:480px;
}
#conteneur {
	width:480px; 
	margin-left:0px; 
	/*z-index:0; */
}
.tableau{
	width:480px;
}
#menuhaut li {
    display:block;
    width:100%;
}
.conteneuraccueil { /*table,tr,td*/
	width:100%;
}   
.hautAccueil{
    width:100%;
    height:auto;
}
.gauchehaut {
    display:none;
    width:0px;
}
.centrehaut {
    display:block;
    width:100%;
    max-width: 400px;
    height:auto;
}
.droitehaut {
    display:none;
    width:0px;
}
.gauche {
    width:200px;
}
.droite {
    width:200px;
}
.centrebas {
    margin-top:0px;
    width:200px;
    height:auto;
}
.centre {
    margin-top:0px;
    width:200px;
    height:100px;
}
.gauchebas{
    margin-top:0px;
    width:200px;
}
.titreacceuil{
    font-size:3em;
}
.texteAccueil{
    font-size:1.6em;
}
audio{
    width:190px;
}
.tooltip:hover span
{
  display:none;
}
#imageDates {
	 width:100px;
	 height:100px;	
}
#imageAudio {
	 width:100px;
	 height:100px;			
}
#imageVideo {
	 width:100px;
	 height:100px;		
}
#imageContact {
	 width:100px;
	 height:100px;		
}
#imagePhoto {
	 width:100px;
	 height:100px;		
}

#menugeneral{
	width:320px;

}
#menugeneral .categorieMenu {
	width:300px;
}
.sousmenu a{
	width:250px;
}
h1 {
	width:400px;
	margin-left:0px;
	font-size:2em; 
}
.contenuAudio{
	width:100%;
	margin-left:0px;
}
.contenu_fb{
	width:300px;
	margin-left:0px;
	left:0px;
}
.videos iframe{
	  margin-left:20px;
	  margin-top:20px;
          width: 448px;
          height:252px;
    }
.centreImage img{
    width:100%;
}    
.pagePro {
    width:400px;
    margin:auto;
}
.proAffiche{
    display: block;
    width:95%;
    font-size: 1.5em;
    margin:5px;
    vertical-align: middle;
    text-align: center;
    padding: 5px;
}

.proTexte{
    display: block;
    width:95%;
    font-size: 1.3em;
    vertical-align: middle;
    color: white;
    padding: 5px;
}
.jaime_fb{
	width:100%;
	margin-left:0px;
}
.jaime_fb iframe{
	width:300px;
}
}