@font-face {
  font-family: "InterstateBlack";
  font-style: normal;
  font-weight: normal;
  src: url("http://apps.rue89.com/fonts/interstate-black-webfont.eot?#iefix") format("embedded-opentype"), url("http://apps.rue89.com/fonts/interstate-black-webfont.woff") format("woff"), url("http://apps.rue89.com/fonts/interstate-black-webfont.ttf") format("truetype"), url("http://apps.rue89.com/fonts/interstate-black-webfont.svg#InterstateBlackRegular") format("svg");
}
@font-face {
  font-family: "FranklinGothicStdExtraCondens";
  font-style: normal;
  font-weight: normal;
  src: url('http://apps.rue89.com/fonts/franklingothicstd-extracond-webfont.ttf'); 
  src: url("http://apps.rue89.com/fonts/franklingothicstd-extracond-webfont.eot?#iefix") format("embedded-opentype"), url("http://apps.rue89.com/fonts/franklingothicstd-extracond-webfont.woff") format("woff"), url("http://apps.rue89.com/fonts/franklingothicstd-extracond-webfont.ttf") format("truetype"), url("http://apps.rue89.com/fonts/franklingothicstd-extracond-webfont.svg#FranklinGothicStdXCn") format("svg");
}

body {
  margin:0;
  padding:0;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  line-height: 20px;
  color: black;
}
body a {
  color: #025484;
  text-decoration: underline;
}
#main {
  background-color: none;
  width: 980px;
}

/* frame */
#nav {
  float: right;
  width: 180px;
  height: 945px;
  padding: 5px 10px 6px 5px;
  margin-right: 3px;
  border-bottom: 3px solid #EAE9F1;
  overflow: auto;
  -moz-box-shadow: inset 0 0 5px white;
  -webkit-box-shadow: inset 0 0 5px white;
  .box-shadow: inset 0 0 -5px white;
}

#content {
  float: left;
  width: 770px;
  height: 945px;
  padding: 10px 0px 0px 10px;
  overflow: hidden;
}

/* reset */
#reset {
  -moz-box-shadow: 0 0 5px #AAAAAA;
  -webkit-box-shadow: 0 0 5px #AAAAAA;
  .box-shadow: 0 0 5px #AAAAAA;
  -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#aaaaaa')";
  filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#666666');
}

#reset a {
  display: block;
  text-align:center;
  font-size: 11px;
  font-family: Arial, Helvetica, sans-serif;
  padding: 0px 0 0 0;
  text-decoration: none;
  margin-bottom: 3px;
  text-decoration: none;
  color: #000000;
} 

/* nav */
#nav ul {
  margin: 0 0 5px 0;
  padding: 0px;
  list-style-type: none;
}
#nav ul li.cat ul {
  border-right: 2px solid;
  border-left: 2px solid;
  border-bottom: 2px solid;
}

#nav ul li.cat div {
  display: block;
  text-align:center;
  font-size: 13px;
  font-family: "Interstate-Black", Arial Black, Arial, Helvetica, sans-serif;
  text-transform:uppercase;
  padding: 1px 0;
/*  border-top-left-radius: 5px 5px;
  border-top-right-radius: 5px 5px;
  -moz-border-top-left-radius: 5px 5px;
  -moz-border-top-right-radius: 5px 5px;
  -webkit-border-top-left-radius: 5px 5px;
  -webkit-border-top-right-radius: 5px 5px; */
} 
#nav ul li.cat li.scat a {
  display: block;
  text-align:center;
  font-size: 11px;
  font-family: Arial, Helvetica, sans-serif;
  padding: 0px 0 0 0;
  text-decoration: none;
} 

/* normal mode */
#nav ul li.cat div {
  /* color of category section header */
  margin: 7px 0 0 0;
  background-color: #35363f;
  color: white;
  -moz-box-shadow: 0 0 5px #AAAAAA;
  -webkit-box-shadow: 0 0 5px #AAAAAA;
  .box-shadow: 0 0 5px #AAAAAA;
  -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#aaaaaa')";
  filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#666666');

}
#nav ul li.cat ul {
  /* color of category section body */
  border-color: #35363f;
  border-width: 0px;  
  -moz-box-shadow: 0 0 5px #AAAAAA;
  -webkit-box-shadow: 0 0 5px #AAAAAA;
  .box-shadow: 0 0 5px #AAAAAA;
  -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#aaaaaa')";
  filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#666666');
}
#nav ul li.cat li.scat a {
  /* color of a category */
  background-color: #FFFFFF;
  color: #000000;
}

/* hover mode */
#nav ul li.cat:hover div {
  /* color of category section header, rollover */
/*  background-color: #FF6666; */
}
#nav ul li.cat:hover ul {
  /* color of category section body, rollover */
 /* border-color: #FF6666; */
}
#nav ul li.cat:hover li.scat a {
  /* color of a category when mouse enters the section */
  background-color: #FFFFFF;
}
#nav ul li.cat ul li.scat a:hover, #reset a:hover {
  /* color of a category, rollover */
  background-color: #DDDDDD;
} 

/* active mode */
#nav ul li.cat.active div {
  /* color of category section header, when selected */ 
  /* background-color: #555; */
} 
#nav ul li.cat.active ul {
  /* color of category section body, when selected */
  /* border-color: #FF0000; */
}
#nav ul li.cat ul li.scat a.active {
  /* color of a category, when selected */
  background-color: #005197;
  color: white;
  font-weight: bold;
} 


/* persons */
.pers {
  float: left;
  margin: 0 8px 10px 0;
  padding: 1px;
  width: 60px;
  height: 145px;
  background-color:#EAE9F1;
  border: 0px;
  /* border-bottom-left-radius: 5px 5px;
  border-bottom-right-radius: 5px 5px;
  -moz-border-bottom-left-radius: 5px 5px;
  -moz-border-bottom-right-radius: 5px 5px;
  -webkit-border-bottom-left-radius: 5px 5px;
  -webkit-border-bottom-right-radius: 5px 5px; */
  -moz-box-shadow: 0 0 7px #AAAAAA;
  -webkit-box-shadow: 0 0 7px #AAAAAA;
  .box-shadow: 0 0 7px #AAAAAA;
  -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#aaaaaa')";
  filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#666666');
  overflow: hidden;
}
.pers .name {
  display: block;
  text-align:center;
  text-transform:uppercase;
  font-size: 8px;
  font-family: Arial, Helvetica, sans-serif;
  padding: 3px 0 1px 0;
  line-height: 9px;
  font-weight: bold;
} 
.pers .title {
  display: block;
  text-align:center;
  font-size: 9px;
  font-family: Arial, Helvetica, sans-serif;
  padding: 1px 0 0 0;
  line-height: 9px;
} 
.pers .pic {
  margin: 4px 7px;
  width: 59px;
  height: 69px;
  background-image: url('pics/default.png');
  background-position: -9px -9px;
  background-repeat: 0px;
}

/* active mode */
#content .active {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=15)";
  filter: alpha(opacity=15);
  -moz-opacity: 0.1;
  -khtml-opacity: 0.1;
  opacity: 0.1;
}
#content .active .pic {
  background-position: -59px 0;
}



/* special colors for president and prime minister*/
#hollande {
  background-color: black;
  color: white;
}
#ayrault {
  background-color: #005197;
  color: white;
}
#vallaudbelkacem {
  /*background-color: black;
  color: white;*/
}

/* pics */
#amard .pic {
  background-image: url('pics/amard.jpg');
}
#dandlauhombourg .pic {
  background-image: url('pics/andlau.jpg');
}
#andriot .pic {
  background-image: url('pics/andriot.jpg');
}
#barthelm .pic {
  background-image: url('pics/barthelme.jpg');
}
#belier .pic {
  background-image: url('pics/belier.jpg');
}
#danjean .pic {
  background-image: url('pics/danjean.jpg');
}
#dessaigne .pic {
  background-image: url('pics/dessaigne.jpg');
}
#dickinson .pic {
  background-image: url('pics/dickinson.jpg');
}
#ferrari .pic {
  background-image: url('pics/ferrari.jpg');
}
#griesbeck .pic {
  background-image: url('pics/griesbeck.jpg');
}
#hamelin .pic {
  background-image: url('pics/hamelin.jpg');
}
#hennard .pic {
  background-image: url('pics/hennard.jpg');
}
#hurstel .pic {
  background-image: url('pics/hurstel.jpg');
}
#jalkh .pic {
  background-image: url('pics/jalkh.jpg');
}
#lemoine .pic {
  background-image: url('pics/lemoine.jpg');
}
#marcuzzi .pic {
  background-image: url('pics/marcuzzi.jpg');
}
#martin .pic {
  background-image: url('pics/martin.jpg');
}
#maurer .pic {
  background-image: url('pics/maurer.jpg');
}
#montel .pic {
  background-image: url('pics/montel.jpg');
}
#morano .pic {
  background-image: url('pics/morano.jpg');
}
#philippot .pic {
  background-image: url('pics/philippot.jpg');
}
#picodeprez .pic {
  background-image: url('pics/pico-deprez.jpg');
}
#pribetich .pic {
  background-image: url('pics/pribetich.jpg');
}
#rocher .pic {
  background-image: url('pics/rocher.jpg');
}
#sander .pic {
  background-image: url('pics/sander.jpg');
}
#serpin .pic {
  background-image: url('pics/serpin.jpg');
}
#stuck .pic {
  background-image: url('pics/stuck.jpg');
}
#trautmann .pic {
  background-image: url('pics/trautmann.jpg');
}
#tsagouris .pic {
  background-image: url('pics/tsagouris.jpg');
}
#waechter .pic {
  background-image: url('pics/waechter.jpg');
}
#weber .pic {
  background-image: url('pics/weber.jpg');
}
#yilmaz .pic {
  background-image: url('pics/yilmaz.jpg');
}
#garlatti .pic {
  background-image: url('pics/garlatti.jpg');
}
#boudjekada .pic {
  background-image: url('pics/boudjekada.jpg');
}
#cakmak .pic {
  background-image: url('pics/cakmak.jpg');
}
#claess .pic {
  background-image: url('pics/claess.jpg');
}
#feuille .pic {
  background-image: url('pics/feuille.jpg');
}
#gonzalez .pic {
  background-image: url('pics/gonzalez.jpg');
}
#hurstel .pic {
  background-image: url('pics/hurstel.jpg');
}
#lhte .pic {
  background-image: url('pics/lhote.jpg');
}
#martin1 .pic {
  background-image: url('pics/martin1.jpg');
}
#werey .pic {
  background-image: url('pics/werey.jpg');
}
#vrin .pic {
  background-image: url('pics/vrin.jpg');
}
#dietmann .pic {
  background-image: url('pics/dietmann.jpg');
}
#connan .pic {
  background-image: url('pics/connan.jpg');
}
#choix .pic {
  background-image: url('pics/choix.jpg');
}
#comas .pic {
  background-image: url('pics/comas.jpg');
}
#herv .pic {
  background-image: url('pics/herv.jpg');
}
#diaferia .pic {
  background-image: url('pics/diaferia.jpg');
}
#manenti .pic {
  background-image: url('pics/manenti.jpg');
}
#couka .pic {
  background-image: url('pics/couka.jpg');
}
#duse .pic {
  background-image: url('pics/duse.jpg');
}
#mailfert .pic {
  background-image: url('pics/mailfert.jpg');
}



/* Légende */

#caption {
  width:950px;
  text-transform: none;
  font-size: 10px;
  font-family: Arial, Helvetica, sans-serif;
  text-align: center;
  font-weight: normal;
  margin: -25px 5px 0px 20px;
  background-color: none;
  padding: 2px;
  clear: both;
  float: left;
}
#caption .spacer {
  display: inline;
  vertical-align: -1px; 
  border: 0px solid black; 
  height: 9px;
  width: 9px;
  margin: 0 5px;
  background-color: #EAE9F1;
}