/*définition des polices personnlisé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('truetype'),
		url('polices/ballpark.svg#BallparkWeiner') format('svg');
		font-weight: normal;
		font-style: normal;
}





@font-face {
    font-family: 'kaushan_scriptregular';
    src: url('polices/kaushanscript-regular-webfont.eot');
    src: url('polices/kaushanscript-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('polices/kaushanscript-regular-webfont.woff2') format('woff2'),
         url('polices/kaushanscript-regular-webfont.woff') format('woff'),
         url('polices/kaushanscript-regular-webfont.ttf') format('truetype'),
         url('polices/kaushanscript-regular-webfont.svg#kaushan_scriptregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face
{
	font-family: 'Dayrom';
	src: url('polices/dayrom.eot');
	src: url('polices/dayron.eot?#iefix') format('embedded-opentype'),
	url('polices/dayrom.woff') 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'); font-family: 'Trebuchet MS' , Arial, sans-serif; color: #181818;  }
 #bloc_page
 { width: 900px; margin: auto; }
 section h1, footer h1, nav a
 { font-family: Dayrom; serif; font-weight: normal; text-transform: uppercase; }
 
 /*Header*/
 
 header 
 { background: url('images/separateur.png') repeat-x bottom; }
 #titre_principal
 { display: inline-block; }
 header h1
 { font-family:  'kaushan_scriptregular', serif; font-size: 2.5em; font-weight: normal;}
 #logo, header h1
 { display: inline-block; margin-bottom: 0px; }
 header h2
 { font-family: dayron, serif; font-size: 1.1em; margin-top: 0px; font-weight: normal;}
 
 /* Navigation*/
 
 nav { display: inline-block; width: 900px; text-align: right; }
 nav ul {list-style-type: none; }
 nav li {display: inline-block; margin-right: 15px; }
 nav a {font-size: 1.3em; color: #181818; padding-bottom: 3px; text-decoration: none; }
 nav a:hover {color: #760001; border-bottom: 3px solid #760001; }
 
 /*Bannière*/
 
 #banniere_image
 {margin-top: 15px; height: 200px; border-radius:5px; background: url('images/aquarelle_groenland2001.jpg') no-repeat;
 position: relative; box-shadow: 1px 4px 4px #1c1a19; margin-bottom: 25px;}
 
 #banniere_description
 { position: absolute; bottom:0; border-radius: 0px 0px 5px 5px; width: 99.5%; height: 33px; padding-top: 5px; padding-left: 4px;
 background-color: rgb(24,24,24);/*pour les anciens navigateurs */ background-color: rgba(24,24,24,0.5); color:white; font-size:0.8em;}
 
 .bouton_rouge
 {display: inline-block; height: 25px; position:absolute; right: 5px; botton: 5px; background: url('images/fond_degraderouge.png')repeat-x;
border:1px solid #760001; border-radius :5px; font-size:1.2em; text-align:center; padding:3px 8px 0px 8px; color:white; text-decoration:none; }

/*Corps*/
article, aside
{display: inline-block; vertical-align: top; text-align: justify; }
article
{ width: 510px; margin-right:15px; }
.ico_categorie
{ vertical-align:middle; margin-right: 8px;}
article p
{font-size: 0.8em;}
aside
{ position: relative; width: 345px; background-color:#00a0ff; box-shadow: 0px 2px 5px #1c1a19; 
border-radius: 5px; padding: 10px; color: white; font-size: 0.9em;}
#fleche_bulle
{ position: absolute; top: 100px; left: -12px;}
#photo_zozor
{ text-align: center;}
#photo_zozor img
{ border: 1px solid #181818;}
aside img
{ margin-right: 5px;}

/*Footer*/

footer{background: url('images/ico_top.png') no-repeat top center , url('images/separateur.png') repeat-x top  , 
url('images/ombre.png') repeat-x top ;  padding-top: 25px ; }
footer p, footer ul{ font-size: 0.8em;}
footer h1 { font-size: 1.1em;}
#tweet, #mes_photos, #mes_amis {display: inline-block; vertical-align:top; }
#tweet { width: 28%;}
#mes_photos{width: 38%;}
#mes_amis{width: 31%;}
#mes_photos img {border: 1px solid #181818; margin-right: 2px;}
#mes_amis ul { display: inline-block; vertical-align: top ; margin-top: 0 ; width: 48%; list-style-image:url('images/ico_liensexterne.png'); padding-left:2px;} 
#mes_amis a { text-decoration: none; color:#760001;}