#menu {
width: 178px; /* set width of menu */
background: #eee;
z-Index: 1000px;
}

#menu ul { /* remove bullets and list indents */
list-style: none;
margin: 0;
padding: 0;
}

/* style, color and size links and headings to suit */

#menu a{
font: bold 11px/16px arial, helvetica, sans-serif;
display: block;
margin: 0;
}

#menu a h2 {
font: bold 11px/16px arial, helvetica, sans-serif;
display: block;
margin: 0;
color: #fff;
background: #fff;
line-height: 25px;
background-image: url(../images/menu/menu_bg.png);
background-repeat: no-repeat;
background-position: left top;
text-align: right;
padding-right: 42px;
}

#menu a h3 {
font: bold 11px/16px arial, helvetica, sans-serif;
display: block;
margin: 0;
color: #00458A;
background: #E3EDFC;
line-height: 23px;
background-image: url(../images/menu/submenu_bg.png);
background-repeat: no-repeat;
background-position: left top;
text-align: right;
padding-right: 28px;
}

#menu a h4 {
font: bold 11px/16px arial, helvetica, sans-serif;
display: block;
margin: 0;
color: #00458A;
background: #EEF3FB;
line-height: 23px;
background-image: url(../images/menu/articlesmenu_bg.png);
background-repeat: no-repeat;
background-position: left top;
text-align: right;
padding-right: 20px;
}

#menu a {
color: #000;
background: #efefef;
text-decoration: none;
}

#menu a:hover {
color: #a00;
background: #fff;
}

#menu a:hover h2 {
font: bold 11px/16px arial, helvetica, sans-serif;
display: block;
margin: 0;
color: #fff;
background: #fff;
line-height: 25px;
background-image: url(../images/menu/menu_bg_hover.png);
background-repeat: no-repeat;
background-position: left top;
text-align: right;
padding-right: 42px;
}

#menu a:hover h3 {
font: bold 11px/16px arial, helvetica, sans-serif;
display: block;
margin: 0;
color: #00458A;
background: #D0DDF1;
line-height: 23px;
background-image: url(../images/menu/submenu_bg_hover.png);
background-repeat: no-repeat;
background-position: left top;
text-align: right;
padding-right: 28px;
}

#menu a:hover h4 {
font: bold 11px/16px arial, helvetica, sans-serif;
display: block;
margin: 0;
color: #00458A;
background: #E7EDF7;
line-height: 23px;
background-image: url(../images/menu/articlesmenu_bg_hover.png);
background-repeat: no-repeat;
background-position: left top;
text-align: right;
padding-right: 20px;
}

#menu a h5 {
font: bold 11px/16px arial, helvetica, sans-serif;
display: block;
margin: 0;
color: #fff;
background: #fff;
line-height: 25px;
background-image: url(../images/menu/menu_bg_hover.png);
background-repeat: no-repeat;
background-position: left top;
text-align: right;
padding-right: 42px;
}

#menu a h6 {
font: bold 11px/16px arial, helvetica, sans-serif;
display: block;
margin: 0;
color: #00458A;
background: #D0DDF1;
line-height: 23px;
background-image: url(../images/menu/submenu_bg_active.png);
background-repeat: no-repeat;
background-position: left top;
text-align: right;
padding-right: 28px;
}

#menu a h1 {
font: bold 11px/16px arial, helvetica, sans-serif;
display: block;
margin: 0;
color: #00458A;
background: #E7EDF7;
line-height: 23px;
background-image: url(../images/menu/articlesmenu_bg_hover.png);
background-repeat: no-repeat;
background-position: left top;
text-align: right;
padding-right: 20px;
}

#menu li {
/* make the list elements a containing block for the nested lists */
position: relative;
}

#menu ul ul ul {
border: 1px solid #B7B8B8;
position: absolute;
top: -1px;
left: 100%; /* to position them to the right of their containing block */
width: 100%; /* width is based on the containing block */
}

div#menu ul ul ul,
div#menu ul ul li:hover ul ul
{display: none;}

div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul
{display: block;}

.first_active h2{
font: bold 11px/16px arial, helvetica, sans-serif;
display: block;
margin: 0;
color: #fff;
background: #red;
line-height: 25px;
background-image: url(../images/menu/menu_bg_hover.png);
background-repeat: no-repeat;
background-position: left top;
text-align: right;
padding-right: 42px;
}

.second{
border-bottom: 1px solid #ffffff;
}

.third{
border-bottom: 1px solid #ffffff;
}