/* Définition des polices personnalisées */

@font-face
{
    font-family: 'BallparkWeiner';
    src: url('polices/ballpark.eot');
    src: url('polices/ballpark.eot?#iefix') format('embedded-opentype'),
         url('polices/ballpark.woff') format('woff'),
         url('polices/ballpark.ttf') format('truetype'),
         url('polices/ballpark.svg#BallparkWeiner') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face
{
    font-family: 'Dayrom';
    src: url('polices/dayrom.eot');
    src: url('polices/dayrom.eot?#iefix') format('embedded-opentype'),
         url('polices/dayrom.woff') format('woff'),
         url('polices/dayrom.ttf') format('truetype'),
         url('polices/dayrom.svg#Dayrom') format('svg');
    font-weight: normal;
    font-style: normal;
    
    
}
							/* Eléments principaux de la page */
							
							
							

body
{
    background: url('images/fond_jaune.png');  /*couleur de fond pour la page*/
    font-family: 'Trebuchet MS', Arial, sans-serif; /*police generale de la page */
    color: #181818; /*une couleur*/
}
a:hover /* Apparence au survol des liens */
{
   text-decoration: underline;
   color: green;
}
a:active /* Quand le visiteur clique sur le lien */
{
    color: gray;
}
#bloc_page
{
    width: 900px;
    margin: auto;/* pour centrer un boc div il FAUT une largeur et un margin. auto centre*/
   /* border:1px solid red;*/
}
section h1, footer h1, nav a
{
    font-family: Dayrom, serif;
    font-weight: normal; /*met le texte en gras*/
    text-transform: uppercase; /* transforme tous les titres en majuscules*/
}
									
									
									
									/* Header */
#titre_principal h1
{
float :left;
 margin-left:80px;
 font-family: 'BallparkWeiner', serif;  /* je met mon titre avec ma police téléchargée*/
    font-size: 2.0em;
    font-weight: normal;
   
   display: inline-block;

}
#titre_principal
{
    /*display: inline-block;*/
    height: 200px;
    border-radius: 10px;
    background: url(../images/diaposecteurcopropriete.jpg) no-repeat;
    box-shadow: 8px 8px 12px #1c1a19; /* ajoute une ombre*/
  /*  margin-bottom:10px;*/
  /*  padding-top: 15px;*/
}
#titre_principal em
{
	color:#760001;
}





#banniere_description
{
	
    position: relative;
    bottom: 6px;
    border-radius: 0px 0px 5px 5px;
    width: 99.5%;
    height: 18px;
    padding-top: 15px; /*largeur de la bande avec le commentaire*/
    padding-left: 4px;
   background-color: rgb(24,24,24); /* Pour les anciens navigateurs */
    background-color: rgba(24,24,24,0.8);
    color: white;
    font-size: 0.8em;
    box-shadow: 8px 8px 12px #1c1a19; /* ajoute une ombre*/
    }
    				
						
							
hr
{
   width: 90%;
   color: darkgrey; /* mettre une ligne */
   height: 3px;
    margin-top:20px;
}


section nav ul
{
    list-style-type: none;    /* on suprime les puces en mettant none */
}

section nav li
{
    display: inline-block;
    margin-right: 15px;
}

section nav a
{	color: #000000;
    font-family: Verdana;
    
    font-size: 14px;
    color: #181818;
    border-bottom: 3px solid #760001;
   text-decoration: none; /*enleve le soulignement*/
    
}
section mark
{
color:white;				/*couleur de fond et de polices pour le menu pour le bouton contact*/
background-color: gray;
}


						/* mise en page de la gallerie cote à cote*/

#gallery{
width:100%;
/*border:3px solid black;*/
}


#gallery  ul
{                   /* On positionne le cadre de droite et on enlève la puce*/
  list-style:none;
  padding:5px;
}

#thumbs {
	list-style-type: none ;     /* On supprime le style de la liste par défaut */
	/*border:3px solid blue;*/
	
	
}
 #thumbs li img {      /* met l'image plus petite ainsi qd on survole on peut légerement agrandir voir html*/
   height:130px;  	/* repreciser la hauteur et largeur de l'image et eviter le debut de l image suivante */
  width:130px;	  
  }
#thumbs li {
   
 
    display:inline-block;   /*met les images les unes à coté des autres*/
    opacity:1;
    margin-right:1px;
    margin-bottom:10px; 
}
#thumbs:hover li { opacity:0.3; } /* met une opacité par defaut*/
#thumbs:hover li:hover {
    opacity:1;
    
    }







#zoom {	
 
   padding-left:100px;
   margin-top:20px;
    margin-bottom:20px;
  height:400px;  	/* repreciser la hauteur et largeur de l'image et eviter le debut de l image suivante */
  width:600px;		/* repreciser la hauteur et largeur de l'image et eviter le debut de l image suivante */
  overflow:hidden;	/* repreciser la hauteur et largeur de l'image et eviter le debut de l image suivante */
 
 
 /* border:3px solid green;*/
 
}






#zoom {
  
    margin-top:100px;
    
}

									/*  INTRODUCTION*/


#intro
{
margin-top:30px;
}


#intro p
{

text-align: center;/* centre le texte introduction  Et met le texte en brun*/ 
color:#760001;
line-height:0.95em;/* hauteur de ligne réduit à 3/4 */
}



										/* BAS de PAGE*/



section mark
{
color:white;				/*couleur de fond et de polices pour le menu pour le bouton contact*/
background-color: gray;
}


						/* mise en page du résumé*/


#resume
{
width:100%;
}

#resume  ul
{                   /* On positionne le cadre de droite et on enlève la puce*/
  list-style:none;
 

}
#resume nav li
{
    display: inline-block;
    margin: 5px 10px 5px 5px;
    padding-left: 5px;
 	 font-size: 10px;

    width:150px;
}
#resume nav li em
{
margin-left:5px;

}






footer nav
{
	display:inline-block;
	font-size: 12px;
  
    text-align: right;
 /* border:3px solid black;*/
  }

footer nav ul
{
    list-style-type: none;    /* on suprime les puces en mettant none */
}

footer nav li
{
    display: inline-block;
    margin-right: 50px;
    font-size: 10px;
}
footer nav a:link 
{ 
 text-decoration:none; /* enleve la ligne qui souligne les liens par defaut*/
} 

footer nav a
{
	color: #181818;
    border-bottom: 3px solid #760001;
}