/* CHEESE! */
	/* Top Drop Down Menu Styles */
	/* These styles are used globally by the top drop down menu. Colour specifc styles are defined else where.

		/* style for the containing div for the menu */
		/* note, the font size of 83% gives a very similar font-size in IE and Mozilla. feel free to change it, but appreciate the impact cross-browser */
		div#topdropmenu 
		{
		    float: left;
		    margin-left: 35px; 
		    height: 27px; 
		}
		
		/* default ul tag style for this menu - you probably won't need to change this */
		div#topdropmenu ul 
		{
			list-style:none;
			margin:0px;
			padding:0px;
		}
		
		div#topdropmenu ul.L0 li.Home
		{
		    width: 72px;
		    background-image: url('../../../../images/site_images/home.jpg');
		    background-position: 0px 0px;
		}
		
		div#topdropmenu ul.L0 li.Who
		{
		    width: 88px;
		    background-image: url('../../../../images/site_images/who.jpg');
		    background-position: 0px 0px;
		}
		div#topdropmenu ul.L0 li.CaseStudies
		{
		    width: 108px;
		    background-image: url('../../../../images/site_images/casestudies.jpg');
		    background-position: 0px 0px;
		}

		div#topdropmenu ul.L0 li.WhatsNew
		{
		    width: 104px;
		    background-image: url('../../../../images/site_images/what_new.jpg');
		    background-position: 0px 0px;
		}

		div#topdropmenu ul.L0 li.WhatsNext
		{
		    width: 104px;
		    background-image: url('../../../../images/site_images/what_next.jpg');
		    background-position: 0px 0px;
		}

		div#topdropmenu ul.L0 li.WhosNext	
		{
		    width: 104px;
		    background-image: url('../../../../images/site_images/who_next.jpg');
		    background-position: 0px 0px;
		}

		div#topdropmenu ul.L0 li.WhosWanted
		{
		    width: 124px;
		    background-image: url('../../../../images/site_images/wanted.jpg');
		    background-position: 0px 0px;
		}
		
		div#topdropmenu ul.L0 li.News
		{
		    width: 101px;
		    background-image: url('../../../../images/site_images/news.jpg');
		    background-position: 0px 0px;
		}
		
		div#topdropmenu ul.L0 li.Blog
		{
		    width: 64px;
		    background-image: url('../../../../images/site_images/blog.jpg');
		    background-position: 0px 0px;
		}
		
		div#topdropmenu ul.L0 li.About
		{
		    width: 73px;
		    background-image: url('../../../../images/site_images/about.jpg');
		    background-position: 0px 0px;
		}
		
		div#topdropmenu ul.L0 li:hover
		{
		    background-position: 0px -27px;
		}
		
		div#topdropmenu ul.L0 li.top:hover
		{
		    background-position: 0px 0px;
		}
		
		/* style for the actual menu links. display and height are important to the operation of the menu. change the others if you like (note:colour changes should probably go in the colour style sheets */
		div#topdropmenu a, div#topdropmenu a:visited
		{
		    text-decoration: none;		
		    color: White;	
		    font-size: 0.8em;
		}
		
		div#topdropmenu a:hover 
		{
		    text-decoration: underline;			
		}
		
		/* default li tag style for this menu - you probably won't need to change this */
		/* the postion:relative and float:left are critical to the correct operation of the menu */
		div#topdropmenu ul li	{position:relative; float:left; margin:0px;}
		
		/* this style is essential to the correct operation of the menu. it ensures correct positioning of the "leaves". */
		div#topdropmenu ul ul {
			position:absolute;
		}

		/* The following 2 groups of styles handle making the menu leaves appear and disappear on mouseover*/
		/* if want extra levels of drop downs, you need to add extra styles here for each level*/
		/* There are sufficient styles here for a 3 level menu. for a 4th level add a new css selector with an additional*/
		/* ul tag before the li:hover. eg div#topdropmenu ul ul ul ul li:hover ul ul/*
		/* please read the CMCSample documentation for more details */
		div#topdropmenu ul ul, 
		div#topdropmenu ul li:hover ul ul,
		div#topdropmenu ul ul li:hover ul ul,			
		div#topdropmenu ul ul ul li:hover ul ul
		{
		    display: none;
		}
		
		div#topdropmenu ul li:hover ul,
		div#topdropmenu ul ul li:hover ul,
		div#topdropmenu ul ul ul li:hover ul,
		div#topdropmenu ul ul ul ul li:hover ul
		{
			display:block;
		}
	
	/* This next block of styles controls the appearance of the top menu bar and also contains styles to override the level 0 styles for lowers levels where necessary */
	/* it is this section which really differentiates the top drop down menu from a side flyout menu */

	/* We have found that using px units (rather than say em units) is more reliable across different browsers implementations of the CSS2 box model.*/
	/* CSS2 is seriouly flawed in how it handles dimensions of content elements, but we're stuck with it until CSS3 is widely adopted */
	
	/* This section defines the width of the menu items at different levels */
	div#topdropmenu ul.L0		{} /* defines the total width of the top menu */
	div#topdropmenu ul.L1		{width:203px;} /* width of level 1 leaves */
	div#topdropmenu ul.L2		{width:213px;} /* width of level 2 leaves */
	
	/* defines position of drop down leaves */
	div#topdropmenu ul.L0 li.Home ul        {top:26px; left: 0px;} /* position of first leaf */
	div#topdropmenu ul.L0 li.Who ul         {top:26px; left: 0px;} /* position of first leaf */
	div#topdropmenu ul.L0 li.CaseStudies ul {top:26px; left: 0px;} /* position of first leaf */
	div#topdropmenu ul.L0 li.News ul	    {top:26px; left: 0px;} /* position of first leaf */
	div#topdropmenu ul.L0 li.Blog ul	    {top:26px; left: 0px;} /* position of first leaf */
	div#topdropmenu ul.L0 li.About ul	    {top:26px; left: 0px;} /* position of first leaf */
	div#topdropmenu ul.L0 li.WhatsNew ul    {top:26px; left: 0px;} /* position of first leaf */
	div#topdropmenu ul.L0 li.WhatsNext ul	{top:26px; left: 0px;} /* position of first leaf */
	div#topdropmenu ul.L0 li.WhosNext ul	{top:26px; left: 0px;} /* position of first leaf */
	div#topdropmenu ul.L0 li.WhosWanted ul	{top:26px; left: 0px;} /* position of first leaf */
	div#topdropmenu ul.L0 li.News ul.L1 ul	{top:-24px; left: 208px;} /* position of second leaf */

	/* defines width of menu items */
	div#topdropmenu ul.L0 li	{z-index:20; margin-right: 5px;} /* level 0 items */
	div#topdropmenu ul.L1 li	{width:203px;z-index:20;margin-right: 5px;} /* level 1 items */
	div#topdropmenu ul.L2 li	{width:203px;} /* level 2 items */
		
	div#topdropmenu ul li.def  {background-color: #2a2727;} /* bg */
	
	div#topdropmenu li.top
	{
		width: 203px;
		height: 24px;
		background-image: url('../../../../images/site_images/liTop.png');
		background-repeat: no-repeat;
		background-color: transparent;
	}
		
	div#topdropmenu li.bottom
	{
		height: 14px;
		background-image: url('../../../../images/site_images/liBottom.png');
		background-repeat: no-repeat;
		background-color: transparent;
	}
	
	/* defines height and width of a tags within the above li tags*/
	/* note that padding-left, padding-right and width must add up to the values above. mozilla seems to have a bit of problem in the sample site here in the for the top level only, we had to add 4 more pixels in order to get the borders to show properly on the menu */
	/* padding-top and padding bottom styles are useful for netscape which doesn't seem to handle "filling" the LI tag to 100% height */
	/* change the padding styles, but exercise some caution with different browsers*/
	div#topdropmenu ul.L0 li a	{height: 27px; float: left; margin-left: 0px; display: block; width: 100%;}
	div#topdropmenu ul.L1 li a	{width:170px; height:auto; padding-top:.23em; padding-bottom:.33em; border-bottom: 1px solid #534c4c; margin-left: 15px;}
	div#topdropmenu ul.L2 li a	{width:170px; height:auto; padding-top:.23em; padding-bottom:.33em; border-bottom: 1px solid #534c4c; margin-left: 15px;}
	
	
	
	
	/* Rss Feed Styles */
/*UL.rssFeed {list-style:none; margin:0px; margin-bottom:20px;
width:40em;}
UL.rssFeed LI {margin-bottom:.75em;}
UL.rssFeed A {font-size:120%; font-weight:bold;}
UL.rssFeed .desc {margin-bottom:.2em;}
UL.rssFeed .meta {}*/