/* --------------------------------------------------
  SECTIONS
===================================================== */

#contenu.gfe .section {
  float: left;
  width: 698px;
  margin-bottom: 30px;
}
#contenu.gfe .section h2 {
  text-indent: -9999px;
  overflow: hidden;
  border: none;
  width: 698px;
  height: 222px;
  background: transparent no-repeat left top;
  margin: 0;
  padding: 0;
}

#contenu.gfe .section h2 a {
  display: block;
  height: 100%;
  width: 100%;
  text-decoration: none;
}

/* --------------------------------------------------
  ARTICLES
===================================================== */
#contenu.gfe .articles { 
  float: left;
  margin: 0;
  padding: 0;
  position: relative;
  border-left: 1px solid #ddd; 
  border-top: 1px solid #ddd; 
  -moz-box-shadow: 0px 1px 2px 0px #ddd;
  -webkit-box-shadow: 0px 1px 2px 0px #ddd;
  box-shadow: 0px 1px 2px 0px #ddd;
  overflow: hidden;
  behavior: url(/ressources/js/PIE.htc);
}
#contenu.gfe .article {
  position: relative;
  float: left;
  margin: 0;
  border-right: 1px solid #ddd; 
  border-bottom: 1px solid #ddd; 
  background: #fff url(/ressources/images/a00-bloc-en-bref-fond.gif) repeat-x bottom left;
}
#contenu.gfe  .article .vignette img,
#contenu.gfe  .article .vignette,
#contenu.gfe .article {
  width: 231px;
}
#contenu.gfe  .article .vignette {
  padding: 0;
  margin: 0;
  background-color: #fff;
}
#contenu.gfe  .article h3.vignette {
  height: 144px;
}
#contenu.gfe  .article.large {
  width: 463px;
}
#contenu.gfe  .article.large .vignette {
  float: left;
}

#contenu.gfe .article .sommaire {
  position: relative;
  padding: 0 10px;
}
#contenu.gfe  .article.large .sommaire {
  float: left;
  width: 208px;
}
#contenu.gfe .article .sommaire h3 {
  margin: 1em 0;
  padding-bottom: 7px;
  font-weight: bold;
  color: #3e3e3e;
  text-transform: uppercase;
  border-bottom: 1px solid #ddd;
}
#contenu.gfe .article .sommaire h3 a {
  color: #3e3e3e;
  text-decoration: none;
}

#contenu.gfe .article .sommaire h3 a:hover,
#contenu.gfe .article .sommaire h3 a:focus {
  text-decoration: underline;
}

#contenu.gfe .article .sommaire a.lien-article {
  text-decoration: none;
}

#contenu.gfe .article .sommaire a.lien-article:hover,
#contenu.gfe .article .sommaire a.lien-article:focus {
  text-decoration: underline;
}

#contenu.gfe .article div.vignette + .sommaire:before {
  content: '';
  width: 0;
  height: 0;
  position: absolute;
  top: -25px;
  left: 20px;
  border-top: 0 inset transparent;
  border-right: 10px solid transparent;
  border-bottom: 12px solid #fff;
  border-left: 10px solid transparent;
}

#contenu.gfe .article .sommaire + div.vignette:before {
  content: '';
  width: 0;
  height: 0;
  position: absolute;
  top: 18px;
  left: 0;
  border-top: 10px solid transparent;
  border-right: 0 inset transparent;
  border-bottom: 10px solid transparent;
  border-left: 12px solid #fff;
}

/* Blocs contenant seulement du contenu graphique - centrés en hauteur par JS */
#contenu.gfe .article.graphique {
  min-height: 355px;
}
#contenu.gfe .article.graphique .sommaire,
#contenu.gfe .sommaire.graphique  {
	position: absolute; 
	text-align: center;
	width: 100%;
	padding: 0;
	text-align: center;
}
#contenu.gfe .sommaire.graphique  {
	margin-top: 1px !important;
}
#contenu.gfe .article.graphique .sommaire h3,
#contenu.gfe .sommaire.graphique  h3 {
  border-bottom: none !important;
  padding: 0 !important;
  margin: 0 1px 1px 0 !important;
  display: inline;
  display: inline-block;
  position: relative;
}

/* Blocs de couleur */
/* Bloc vert */
#contenu.gfe .article.vert, #contenu.gfe .article.vert h2 {
  color: #fff;
  background: #DAEFCE none !important;
}
#contenu.gfe .article.vert .vignette + .sommaire:before {
  border-bottom-color: #DAEFCE;
}

/* Bloc Gris */
#contenu.gfe .article.gris, #contenu.gfe .article.gris h2 {
  color: #fff;
  background: #ddd none !important;
}
#contenu.gfe .article.gris .vignette + .sommaire:before {
  border-bottom-color: #ddd;
}
/* Liens des blocs de couleur */
#contenu.gfe .article.gris .sommaire a,
#contenu.gfe .article.bleu .sommaire a {
  color: #fff;
}
#contenu.gfe .article.vert .sommaire h3,
#contenu.gfe .article.bleu .sommaire h3 {
  color: #fff;
  border-bottom: 1px solid #fff;
}

/* Zone cliquables */
#contenu.gfe .plus span.zone-cliquable,
#contenu.gfe .tuile span.zone-cliquable {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 2;
  cursor: pointer;
}
#contenu.gfe .tuile span.zone-cliquable {
  background-color: #fff\9;
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
}
@media print {
  #contenu.gfe span.zone-cliquable { display: none\9; }
}
#contenu.gfe .plus span.zone-cliquable a,
#contenu.gfe .tuile span.zone-cliquable a {
  display: block;
  width: 100%;
  height: 100%;
}
#contenu.gfe .article.plus span.zone-cliquable a{
  background: transparent url('/ressources/images/d30-icone-plus.png') no-repeat right bottom;
}
/* Mouse over pour zones cliquables */
#contenu.gfe .vignette a:hover img,
#contenu.gfe .graphique.tuile span.zone-cliquable:hover,
#contenu.gfe .graphique .tuile span.zone-cliquable:hover {
  background-color: #fff;
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
  filter: alpha(opacity=40);
  opacity:0.4;
}