#navigation {
background:none repeat scroll 0 0 transparent;
color:#003366;
font:0.7em "verdana",sans-serif;
list-style:none outside none;
margin:0;
padding:0;
width:130px;
margin-left: 2px;
height:60px;
position:absolute;
top:210px;
left: 0px;
}

#navigation  ul{
list-style-type: none;
}

#navigation  li{
margin-bottom: 2px;
}

#navigation .subMenu li{
padding: 3px 0;
}
#navigation .subMenu li a{
color: #fff;

}

#navigation #bg {
background-image:url(../img/puce_menu.png);
background-repeat:no-repeat;
background-position:right top;
}

#navigation #bg:hover{
background-image:url(../img/puce_menu_on.png);
background-repeat:no-repeat;
background-position:right top;
}

#navigation a, #navigation span {
  background-color: #ffffff;
  /* for IE */
  filter:alpha(opacity=70);
  /* CSS3 standard */
  opacity:0.7;
color:#336666;
display:block;
padding:3px 6px;
text-decoration:none;
margin-right:24px;
}


#navigation a:hover, #navigation a:focus, #navigation a:active {
text-decoration:none;
}
#navigation .subMenu {
background:none repeat scroll 0 0 transparent;
font-size:0.9em;
margin:0;
padding:0;
}
#navigation ul.subMenu a {
background:none repeat scroll 0 0 transparent;
padding:1px 10px 3px;
  /* for IE */
  filter:alpha(opacity=100);
  /* CSS3 standard */
  opacity:1;
  font-size:15px;
}
#navigation ul.subMenu li:hover a{
color:white;
}
.video:hover ,.internet:hover,.evenementiel:hover,.graphisme:hover   {
  filter:alpha(opacity=1000);
  /* CSS3 standard */
  opacity:1;
}
.video{
  width:90%;
  height:20px;
  background-color: #33FF00;
  margin-bottom:2px;
  margin-left:5px;
  margin-top:2px;
  /* for IE */
  filter:alpha(opacity=50);
  /* CSS3 standard */
  opacity:0.5;
}
.video:hover{
  background-color: #33FF00;
}
.internet{
  width:90%;
  height:20px;
  background-color: #FF0000;
  margin-bottom:2px;
  margin-left:5px;
  margin-top:2px;
  /* for IE */
  filter:alpha(opacity=50);
  /* CSS3 standard */
  opacity:0.5;
}
.internet:hover{
  background-color: #FF0000;
}
.evenementiel{
  width:90%;
  height:20px;
  background-color: #6633CC;
  margin-bottom:2px;
  margin-left:5px;
  margin-top:2px;
  /* for IE */
  filter:alpha(opacity=50);
  /* CSS3 standard */
  opacity:0.5;
}
.evenementiel:hover{
  background-color: #6633CC;
}
.graphisme{
  width:90%;
  height:20px;
  background-color: #6699CC;
  margin-bottom:2px;
  margin-left:5px;
  margin-top:2px;
  /* for IE */
  filter:alpha(opacity=50);
  /* CSS3 standard */
  opacity:0.5;
}
.graphisme:hover{
  background-color: #6699CC;
}
.conseil{
  width:90%;
  height:20px;
  background-color: #9ca4a5;
  margin-bottom:2px;
  margin-left:5px;
  margin-top:2px;
  /* for IE */
  filter:alpha(opacity=50);
  /* CSS3 standard */
  opacity:0.5;
}
.conseil:hover{
  background-color: #727778;
}