@font-face {
  font-family: 'Voltaire';
  font-style: normal;
  font-weight: normal;
  src: url('../fonts/voltaire-regular.eot');
  src: local('Voltaire'), local('Voltaire'), url('../fonts/voltaire-regular.woff') format('woff'), url('../fonts/voltaire-regular.ttf') format('truetype');
}


html, body, div, ul, li, dd, p, span,label {
	font-size: 18px;
	font-family: 'Voltaire', sans-serif;	
	color:white;
}
a { color:grey;}

input {
	font-size: 14px;
	font-family: 'Voltaire', sans-serif;
	color:black;
}
label {
color:white;
}

body {
	background-color: black;
}
table
{
 color:white;
    border-collapse: collapse; 	
}

button{
/*utilisé dans la page boutique*/
color:white;
background-color: black;
font-size: 18px;
font-family: 'Voltaire', sans-serif;
border-radius: 5px;
cursor:  pointer;
border: none;	
background-color:#222222;
line-height:50px;
}
button:active{
background-color:#333333;
}
button img{
float:left;
margin-right:5px;
}

#fond-droite img{
position:absolute;
top:400px;
left:1100px;
}
#fond-gauche img{
position:absolute;
top:400px;
left:-100px;
}


#tableau_concerts td
{
font-size: 18px;
 color:white;
    text-align : center;
	padding-left:10px;
	padding-right:10px;	
	
}
#tableau_concerts tr:nth-child(odd){ background-color:#222222; }
td a { color:grey;
font-size: 16px;
}

#logo img{
/*float:left;*/
top:10px;
left:10px;
}
#logo2{
position:absolute;
top:10px;
left:10px;
}

 #titre{
 margin:20px;
 font-size: 32px;
 color:white;
 font-weight:bold;
 text-shadow: 0 0 6px white;
 }
/* #titre:before{
	content: url(../img/etoile.png);
	margin:20px;
 }
  #titre:after{
	content: url(../img/etoile.png);
	margin:20px;
 }*/
 
 #titre2{
 text-align : center;
 margin:10px;
 font-size: 22px;
 color:white;
/* font-weight:bold;*/
 }
/* #titre2:before{
	content: url(../img/etoile.png);
	margin:10px;
 }
  #titre2:after{
	content: url(../img/etoile.png);
	margin:10px;
 }*/
 
 
 #cadre{
 color:white;
 margin-top:100px;
/* height:683px;*/
 width:1024px;
 /*background: url("../img/fond.jpg") no-repeat; 
 background-attachment: relative; */
 overflow:auto;
 display: block;
 display:none;
 }
 #cadre label{
 color:white;
 }

 
#haut{
 position:fixed;
 height:80px;
/* width:800px;*/
width:98%;
 margin-left: auto;
margin-right: auto;
text-align : center;
z-index:100;
 }
 
#normal{
	width:500px;
	color:white;
/*	float:left;
	display:inline;
*/	margin-right:5px;
	font-weight:normal;
}
#normal a { color:grey;
}

#fb-conteneur{
 width:500px;
 float:left;
 display:inline;
 	margin-left:5px;
	
}

 #texte{
  /*font-size: 18px;*/
  width:1000px;
   color:white;
 }
 /* LETTRINE */
 /*#texte:first-letter {
  font-size:30px;
  color:white;
  background-color:black; 
}*/

#musique{
	display:block;
	margin:auto;
}
 
/* ----- Page boutique ------ */

.howto{
font-size: 14px;
border-radius:10px;
background-color:#222222;
width:600px;
padding:10px;
}

.prix{
font-size:30px;
display: inline-block;
position : relative;
left:60px;
top:-30px;
padding:10px;
border-radius: 30px;
-webkit-transform: rotate(-10deg);
-moz-transform: rotate(-10deg); 
 box-shadow: -1px 2px 10px 3px rgba(0, 0, 0, 0.3) inset;
 background: linear-gradient(#2989d8 0%, #1e5799 100%);	
} 

#tshirt{
left:0px;
top:0px;
}
 
#petit{
font-size:16px;
color:white;
}

#entoure{
border: 2px solid white;
border-radius:5px;
color:white;
padding:15px;
margin:auto;
display:inline-block;
}

#soldes{
font-size:14px;
display: inline-block;
position : relative;
left:60px;
top:30px;
padding:10px;
border-radius: 10px;
color:#700000 ;
-webkit-transform: rotate(10deg);
-moz-transform: rotate(10deg);
 box-shadow: -1px 2px 10px 3px rgba(112, 0, 0, 0.3) inset;
} 

#prix2{  /*pour les tshirts*/
display: inline-block;
position : relative;
left:0px;
top:30px;
padding:10px;
border-radius: 30px;
-webkit-transform: rotate(-10deg);
-moz-transform: rotate(-10deg);
background-color: #700000 ;
 box-shadow: -1px 2px 10px 3px rgba(0, 0, 0, 0.3) inset;
} 
#soldes2{
font-size:14px;
display: inline-block;
position : relative;
left:200px;
top:30px;
padding:10px;
border-radius: 10px;
color:#700000 ;
-webkit-transform: rotate(10deg);
-moz-transform: rotate(10deg);
 box-shadow: -1px 2px 10px 3px rgba(112, 0, 0, 0.3) inset;
} 

/* ---------- */

#bandeau_news{
	
	position:fixed;
	top:40px;right:-40px;
	width: 200px;
 	text-align : center;
 	background: linear-gradient(#2989d8 0%, #1e5799 100%);
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	z-index: 101;
	
}
#ruban_news{
position:relative;
line-height: 30px;
border-top:2px dashed black;
margin-top:2px;
border-bottom:2px dashed black;
margin-bottom:2px;
font-size: 13px;
}
#ruban_news a{
display:block;
	color:white;
  	text-decoration:none;
}
#ruban_news a:hover{
	font-size: 16px;
}
/*
#bandeau_news input, textarea {
font-size: 12px;
}*/



#facebook{
top:100px;
right:80px;
position:fixed;
float:right;
}
#facebook img{
display:block;
margin:auto;
margin-top:5px;
}
/*------------------- page Espace Pros **************** */
#carre_noir{
display:inline-block;
background-color:#222222;
padding:15px;
margin:20px;
border-radius: 5px;
/*box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.5);*/
}
#carre_noir a {
text-decoration:none;
}
#carre_noir a:hover{
color:white;
}

/*------------------- page photos **************** */
ul.gallery li a {
	left:100px;
	list-style:none;
	float: left;
	padding: 8px 8px 18px 8px;
	background: #eee;
	border: 1px solid #fff;
	-moz-box-shadow: 0px 2px 15px #333;
	-webkit-box-shadow: 0px 2px 15px #333;
	position: relative;
}
ul.gallery li a.pic-1 {

	z-index: 1;
	-webkit-transform: rotate(-10deg);
	-moz-transform: rotate(-10deg);
}
ul.gallery li a.pic-2 {
	z-index: 5;
	-webkit-transform: rotate(3deg);
	-moz-transform: rotate(3deg);
}
ul.gallery li a.pic-3 {
	z-index: 3;
	-webkit-transform: rotate(2deg);
	-moz-transform: rotate(2deg);
}
ul.gallery li a.pic-4 {
	z-index: 6;
	-webkit-transform: rotate(-4deg);
	-moz-transform: rotate(-4deg);
}
ul.gallery li a:hover {
	z-index: 10;
	-moz-box-shadow: 3px 5px 15px #333;
	-webkit-box-shadow: 3px 5px 15px #333;
}

#img_penchee img{

	list-style:none;
	float: left;
	/*padding: 8px 8px 18px 8px;*/
	background: #eee;
	border: 1px solid #fff;
	-moz-box-shadow: 0px 2px 15px #333;
	-webkit-box-shadow: 0px 2px 15px #333;
	position: relative;

	-webkit-transform: rotate(-6deg);
	-moz-transform: rotate(-6deg);

transform:rotate(-6deg);
margin-right:-100px;
margin:10px;
}


 /* ----- MENU PRINCIPAL de navigation en haut ----- */
#menu, #menu ul { 
	 padding : 0; 
     margin : 0; 
     list-style : none; 
     text-align : center;
	 font-size:26px;
	color : white;	 
	} 
	#menu li { 
	color : white;
	display: inline;
	background-color: rgba(30,30,30,0.9);	
	padding-top : 50px;
	 padding-bottom : 5px;
	 border-radius: 0 0 10px 10px;
	}
	#menu a { 	
		font-size: 26px;
		text-decoration : none;
		font-variant : small-caps ;
        padding : 8px; 
        color : white;
        text-decoration : none;   
	}
	#menu a:hover { 
		-webkit-transition-property: color;
		-webkit-transition-duration: 2s;
		color:grey ;
	}
	#menu li.active {
	 padding-top : 50px;
	 padding-bottom : 5px;
	 border-radius: 0 0 10px 10px;
	 background-color: white;	 
	 color : black;
	} 
	#menu li.active a {
		color : black;
		}
 /* ----- ----- */