/****************************************
 * flyout.css                           *
 * flyout menu all browsers except IE 6 *
 * 05.05.10                             *
 ****************************************/
 
/***** COMMON STYLING ALL BROWSERS *****/
.menu {font-family: tahoma, arial, sans-serif; width: 192px; height: 150px; position: relative; margin: 0; font-size: 12px; margin: 40px 0;}

/***** 1ST LEVEL *****/
.menu ul li.blue a, .menu ul li.blue a:visited {display: block; text-decoration: none; color: #000000; padding-left: 10px; width: 180px; height: 25px; line-height: 25px; text-align: left; border: 1px solid #ffffff; border-width: 1px 1px 0 1px; background: #bfe0f5; font-size: 12px;}
.menu ul li.green a, .menu ul li.green a:visited {display: block; text-decoration: none; color: #000000; padding-left: 10px; width: 180px; height: 25px; line-height: 25px; text-align: left; border: 1px solid #ffffff; border-width: 1px 1px 0 1px; background: #ffccff; font-size: 12px;}
.menu ul li.yellow a, .menu ul li.yellow a:visited {display: block; text-decoration: none; color: #000000; padding-left: 10px; width :180px; height: 25px; line-height: 25px; text-align: left; border: 1px solid #ffffff; border-width: 1px 1px 0 1px; background: #6699cc; font-size: 12px;}

.menu ul {padding: 0; margin: 0; list-style-type: none;}
.menu ul li {float: left; margin-right: 1px; position: relative;}
.menu ul li ul {display: none;}


/***** SPECIFIC TO NON-IE-BROWSERS *****/
/* 1st level hover */
.menu ul li.blue a:hover {color: #ffffff; background: #0099ff;}
.menu ul li.green a:hover {color: #ffffff; background: #993366;}
.menu ul li.yellow a:hover {color: #ffffff; background: #003399;}

.menu ul li:hover ul {display: block; position: absolute; top: 0; left: 192px; width: 185px;}
.menu ul li:hover ul li ul {display: none;}


/***** 2ND LEVEL *****/
.menu ul li:hover ul li.blue a {display: block; background: #bfe0f5; color: #000000; width: 185px;}
.menu ul li:hover ul li.green a {display: block; background: #ffccff; color: #000000; width: 185px;}
.menu ul li:hover ul li.yellow a {display: block; background:#ffecbf; color: #000000; width: 185px;}
/* 2nd level hover */
.menu ul li:hover ul li.blue a:hover {background: #0099ff; color: #ffffff;}
.menu ul li:hover ul li.green a:hover {background: #993366; color: #ffffff;}
.menu ul li:hover ul li.yellow a:hover {background: #003399; color: #ffffff;}