/* existing CSS - for reference 
#subNavContainer { position: absolute; bottom: 0px; left: 0px; background: #E31937; height: 30px;  z-index: 50; width: 890px; }
#subNav { padding-left: 8px; }
#subNav li { display: inline; }
#subNav a:link, #subNav a:visited { font-size: 1em; font-weight: bold; color: #FFF; text-transform: uppercase; margin: 5px 0; padding: 4px 8px 4px 8px; }
#subNav a:hover, #subNav a.current { background: #CD1732; }
*/



/****** these lines update existing CSS *******/
#subNav { left: 0px; top: 0px; height: 30px; }
#subNav li { display:inline-block; position: relative; height: 30px; width: auto; }

#subNav a { display: inline-block; float: none; } /* we need to set float:none here or remove the float left from the original code 

/************************************************
				THE NEW STUFF
************************************************/
#subNav ul { position: absolute; left: 0px; top: 25px; width: 186px; padding: 0px 14px 4px 10px; background-color: #cd1732; font-family: Arial, Helvetica, sans-serif; font-size: 10px; line-height: 12px; font-weight: 800; color: #ffb3b3; list-style: none; list-style-position: outside; list-style-image: none;  text-transform: uppercase; border-top: 5px solid #e31937; display: none;z-index:201; }/* z-index: 100; */
#subNav ul a:link, ul#subNav ul a:visited { color: #fff; text-decoration: none; padding: 0 0 0 0px; margin: 0 0 0 0px; }
#subNav ul a:hover { color: #fff; text-decoration: underline; }
#subNav ul li { display: inline-block; width: 186px; height: auto; padding: 5px 0px 7px 0px; margin: 0 0 0 0px; border-top: 1px solid #f61a1f; }
#subNav ul li.first { border-top: 8px solid #cd1732; }
#subNav ul li.submenu {display: inline-block}