/* 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#BallparWeiner') 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-ecran-nature-paysages-ciel-145.jpg');

  font-family: 'Trebuchet MS', Arial,sans-serif; 

  background-position:center center ;

  background-color:white;

  background-repeat:no-repeat;

 }

 #bloc_page

 {

  width: 900px;

  margin: auto;

 }

 section h1, footer h1, nav a

 {

  font-family: Dayrom, serif;

  font-weight: normal;

  text-transform: uppercase;

 }

 /* Heaser */

 header

 {

  background: url('images/separateur.png') repeat-x bottom;

 }

 #titre_principal

 {

  display: inline-block;

 }

 header h1

 {

  font-family: 'BallparkWeiner', serif;

  font-size: 2.5em;

  font-weight: normal;

 }

 #logo, header h1

 {

  display: inline-block;

  margin-bottom: 0px;

 }

​

 header h2

 {

  font-family: Dayrom, serif;

  font-size: 1.1em;

  margin-top: 0px;

  font-weight: normal;

 }

 /* Navigation*/

 nav

 {

  width:200px;

  margin:0 auto-right;

  display: inline-block;

  text-align: right;

 }

 nav ul

 {

 list-style-type: none;

 }

 nav li

 {

  list-style:none;

  margin:3px 0;

  padding:2px 0;

 }

 nav a

 {

  color:#250;

  text-decoration:none; /* enleve le souligne du lien */

  display:block;

  height:25px;

  width:125px;

  border-radius:2px;

  text-align:left;

  border: 3px solid #4D4DFF;

  }

 nav a:hover

 {

  background:#035;

  color:#fff;

  margin-left:20px;

  border-radius:5px;

  border: 3px solid blue;

 }

 /* Bannière */

 #banniere_image

 {

  margin-top: 15px;

  height: 200px;

  border-radius: 5px;

  background: url('images/site.png') no-repeat;

  position: relative;

  box-shadow: 0px 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: 15px;

  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;

 }

  .bouton_rouge

 {

  display: inline-block;

  height: 25px;

  position: absolute;

  right: 5px;

  bottom: 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;

 }

​

 .bouton_rouge img

 {

  border: 0;

  margin-left:5px;

 }

 /* Corps */

 article, aside

 {

  display: inline-block;

  vertical-align: top;

 }

 article

 {

  width: 420px;

  margin-right: 15px;  

 }

 .ico_categorie

 {

  vertical-align: middle;

  margin-right: 8px; 

  text-align: center;

​

 }

 article p

 {

  font-size:0.8em;

  text-align: center;

​

 }

 aside

 {

  text-align: center;

  position: absolute;

  width: 235px;

  background-color: #706b71;

  box-shadow: 0px 2px 5px #1c1a25;

  border-radius: 5px;

  padding: 8px;

  color: white;

  font-size: 1em;

 }

 #fleche_bulle

 {

  position: absolute;

  top: 100px;

  left: -12px;

 }

 #ma_photo

{

 text-align: center;

 }

 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 u1

 {

   color:#4D4DFF;

  font-size: 0.8em;

 }

 footer h1

 {

    color:#E6E8FA;

  font-size: 1.1em;

 }

 #tweet, #mes_photos, #mes_amis

 {

    color:#4D4DFF;

  display: inline-block;

  vertical-align: top;

 }

 #tweet

 {

  width: 28%;

 }

​

 #mes_photos

{

 width: 35%;

 }

 #mes_amis

 {

  width: 31%

 }

 #mes_screens img

 {

  margin-right: 2px;

  color:#4D4DFF;

 }

 #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;

 }