/* client button */

.clientlogin {
	height: 33px;
	width: 58px;
	position: relative;
	left: 875px;
	top: -79px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #fff;
	z-index: 120;
}

.clientlogin a:link, 
.clientlogin a:visited {
	color: #fff;
	text-decoration: none;
	outline: none;
}
.clientlogin a:hover, 
.clientlogin a:active {
	color: #ccc;
	text-decoration: none;
	outline: none;
}

/* home button */	

.homebutton{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #fff;
	height: 30px;
	width: 40px;
	left: 265px;
	position: absolute;
	top: 25px;
	z-index: 100;
}
.homebutton a:link, 
.homebutton a:visited {
	color: #fff;
	text-decoration: none;
	outline: none;
}
.homebutton a:hover, 
.homebutton a:active {
	color: #ccc;
	text-decoration: none;
	outline: none;
}
.text_pos {
	line-height: 24px;
	cursor: pointer;
}

/* navagation menu */

#multi-level {
	height: 26px;
	position: relative;
	z-index: 100;
	width: 667px;
	left: 265px;
	top: 20px;
	background: url(../_img/layout/nav_bg.gif) repeat-x;
}
#multi-level .pad {
	float: left;
}

/* The menu styling */
/* Remove the padding, margins and bullets from the lists */

.menu, 
.menu ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
	font-family: arial, sans-serif;
	font-size: 11px;
}

/* Set up the top level list items and float left to place inline */

.menu li.top {
	display: block;
	float: left;
	position: relative;
	height: 24px;
	text-indent: 0px;
}

/* Style and position the table so it takes no part in the menu function. The font size is necessary for IE5.5 */

.menu table {
	border-collapse: collapse; 
	width: 0; 
	height: 0; 
	position: absolute; 
	top: 0; 
	left: 0;
}

/* Default top link styling */

.menu a:link, 
.menu a:visited, 
.menu a:active {
	color: #fff;
	display: block;
	float: left;
	height: 35px;
	outline: none;
	text-indent: 12px;
	vertical-align: 5%;
	text-decoration: none;
}
.menu a:hover {
	color: blue;
	display: block;
	float: left;
	height: 35px;
	outline: none;
	font-size: 11px;
	text-decoration: none;

}
.menu li.top a.top_link {
	display: block;
	float: left;
	outline: none;
	height: 35px;
	color: #33ff00;
}
.menu li:hover > a {
	color: #f66014;
	font-size: 11px;
	outline: none;
}

.menu li.top a span {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 0;
	outline: none;
	font-size: 11px;
} 

/* move the link text off screen gs. on screen now. */
/* pre-load the hover ../_img/layout into the lists */

.menu li{
	height: 24px;
	background-color: #fff;
	color: #f66014;
}
.menu li.p1 {
	width: 40px;
	height: 24px;
	left: -10px;
	background-color: #f66014;
	color: #fff;
}
.menu li.p2 {
	width: 85px;
	color: #f66014;
}
.menu li.p3 {width:87px;}
.menu li.p4 {width:98px;}
.menu li.p5 {width:72px;}
.menu li.p6 {width:55px;}
.menu li.p7 {width:78px;}

/* set up the normal unhovered ../_img/layout in the links */

.menu li a#home {
	width: 40px;
	background-repeat: no-repeat;
	left: -10px;
}
.menu li a#whoweare {
	width: 85px;
	height: 24px;
	background-color: #f66014;
	border-bottom: 2px solid #faa377;
}
.menu li a#mediacentre {
	width: 87px;
	height: 24px;
	background-color: #f66014;
	border-bottom: 2px solid #faa377;
}
.menu li a#mediaservices {
	width: 98px;
	height: 24px;
	background-color: #f66014;
	border-bottom: 2px solid #faa377;
}
.menu li a#ourwork {
	width: 72px;
	height: 24px;
	background-color: #f66014;
	background-repeat: no-repeat;
	border-bottom: 2px solid #faa377;
}
.menu li a#news {
	width: 55px;
	height: 24px;
	background-color: #f66014;
	border-bottom: 2px solid #faa377;
}
.menu li a#contactus {
	width: 78px;
	height: 24px;
	background-color: #f66014;
	background-repeat: no-repeat;
}

/* Style the list OR link hover. Depends on which browser is used */

.menu a:hover {
	visibility: visible;
	color: #f66014;
} 

/* for IE6 */

.menu li:hover { 
	position: relative; 
	z-index: 200;
} 

/* for IE7 */

/* make the links transparent on hover so that the hover ../_img/layout in the lists show through (no flicker) */

.menu li a#home:hover, .menu li:hover a#home,
.menu li a#whoweare:hover, .menu li:hover a#whoweare,
.menu li a#mediacentre:hover, .menu li:hover a#mediacentre,
.menu li a#mediaservices:hover, .menu li:hover a#mediaservices,
.menu li a#ourwork:hover, .menu li:hover a#ourwork,
.menu li a#news:hover, .menu li:hover a#news,
.menu li a#contactus:hover, .menu li:hover a#contactus {
	background: transparent;
}

/* keep the 'next' level invisible by placing it off screen. */

.menu ul, 
.menu :hover ul ul, 
.menu :hover ul :hover ul ul,
.menu :hover ul :hover ul :hover ul ul,
.menu :hover ul :hover ul :hover ul :hover ul ul {
	position: absolute; 
	left: -9999px; 
	top: -9999px; 
	width: 0; 
	height: 0;
}

/* set up the first drop down sub level */

.menu :hover ul.sub {
	left: 0px;
	top: 26px;
	/*border:1px solid #00FF00; */
	white-space: nowrap;
	width: 130px;
	height: auto;
	background-color: #f0f0f0;
	border: 0px solid #999;
	padding: 0;
}
.menu :hover ul.sub li {
	display: block;
	height: 20px;
	position: relative;
	float: left;
	width: 130px;
	border-bottom: 1px solid #d6d6d6;
}
.menu :hover ul.sub li a {
	display: block;
	font-size: 11px;
	height: 20px;
	width: 120px;
	line-height: 20px;
	text-indent: 3px;
	color: #666;
	text-decoration: none;
	padding-left: 10px;
	background-color: #f0f0f0;
}
.menu :hover ul.sub li a.fly {
	width: 120px;
	background: url(../_img/layout/arrow.gif) no-repeat 120px 7px;
}
.menu :hover ul.sub li a:hover {
	color: #f66014;
	background-color: #fff;
	width: 120px;
}
.menu :hover ul.sub li a.fly:hover,
.menu :hover ul li:hover > a.fly {
	color: #f66014;
	width: 120px;
	background: #ccc url(../_img/layout/arrow_over.gif) no-repeat 120px 7px;
} 

/* set up the flyout levels when hovering */

.menu :hover ul :hover ul,
.menu :hover ul :hover ul :hover ul,
.menu :hover ul :hover ul :hover ul :hover ul,
.menu :hover ul :hover ul :hover ul :hover ul :hover ul {
	left: 130px;
	top: 0;
	white-space: nowrap;
	width: 130px;
	z-index: 200;
	height: auto;
	background-color: #ccc;
	padding: 0;
	border: 0;
}