/*
 * MENU
 */

/* reset default styles */
#menu,
#menu ul { margin: 0; padding: 0; }
#menu li { list-style-type: none; }

/* set font for entire menu */
#menu { font: 12px Tahoma;padding-left:30px;}


/*
 * FIRST LEVEL
 */

/* horizontal, default width */
#menu li,
#menu a { float: left; }
#menu a { display: block; padding: 6px; text-decoration: none;color: #FFFFFF; }
#menu a:hover,
#menu a.menu_open {background-color: #2362AF; color: #000000;}


/*
 * SECOND LEVEL AND UP
 */

/* has a fixed width and border */
#menu ul { visibility: hidden; position: absolute; width: 150px; border: 1px solid #CCC; margin-top: 1px; background-color:#7BC4EF;}
#menu ul li { width: 150px; }
#menu ul a { width: 144px; padding: 3px; }

/* different box model in IE (non quirks mode) */
* html #menu ul a { width: 150px; }

/* (with another submenu requires an arrow) */
#menu ul a.submenu { background-image: url("http://www.hightechcampus.nl/data/static/images/www/menu_arrow_right.gif"); background-repeat: no-repeat; background-position: 138px 6px; }
#menu ul a.submenu:hover,
#menu ul a.submenu.menu_open { background-image: url("http://www.hightechcampus.nl/data/static/images/www/menu_arrow_right_mo.gif"); }


/*
 * THIRD LEVEL AND UP
 */

/* these need a little compensation for the top border */
#menu ul ul { margin-top: -1px; }