/*
-----------------------------------------------------
Navigation CSS file for [sitename.tld]
Media: screen, projection

Notes: Chunks of CSS related to navigation 
		components go here (e.g. main nav, left nav).

Author: Author Name [ email at domain dot tld ]
For: Client [ client.tld ]
-----------------------------------------------------
*/

/* main nav / switch nav */
div#nav {
	background:#8b0448 url(../images/layout/mainnav_bg_grad_curve.gif) no-repeat;
	margin-top:3px;
}
/* main nav bar */
div#nav ul#mainNav {
	float:right;
	width:auto;
	margin-bottom:0;
	margin-top:0;
	text-align:right;
}
div#nav ul#mainNav li {
	list-style:none;
	background:url(../images/layout/mainnav_divider_bg.gif) no-repeat;
	white-space:nowrap !important;
	float:right;
	margin-left:24px;
	padding-top:4px;
	padding-bottom:4px;
	padding-left:24px;
}
div#nav ul#mainNav li a {
	color:#fff;
}
div#nav ul#mainNav li.last {
	padding-right:16px;
}
div#nav ul#mainNav li.selected a,
div#nav ul#mainNav li a:hover,
div#nav ul#mainNav li a:focus {
	color:#000 !important;
}


/* switch nav bar */
div#nav div#switchNav {
	background:url(../images/layout/switchnav_bg_grad_curve.jpg) no-repeat bottom left;
	width:100%;
	float:left;
	padding-top:12px;
	padding-bottom:1px;
}
/* h3 uses gilder/levin image replacement */
div#nav div#switchNav h3 {
	width:161px;
	height:41px;
	float:left;
	position:relative;
	font-size:1em;
	color:#fff;
	margin:0 0 0 9px;
}
div#nav div#switchNav h3 span {
	background:url(../images/layout/switch/en/title_header_thetvswitchover.gif) no-repeat;
	position:absolute;
	width:100%;
	height:100%;
}
body#cy div#nav div#switchNav h3 span {
	background-image:url(../images/layout/switch/cy/title_header_thetvswitchover.gif);
}


div#nav div#switchNav ul {
	width:572px;
	float:right;
	margin:0;
}
div#nav div#switchNav ul li {
	float:left;
	list-style:none;
	margin-left:0;
	height:41px;
}
/* 
Image replacement for Nav
Uses Phark technique: http://www.mezzoblue.com/tests/revised-image-replacement/#phark2
Plus modified NAF-IR http://www.cssplay.co.uk/menu/naf_ir.html 
*/
div#nav div#switchNav ul li a {
	background:url(../images/layout/switchnav_li_bg.gif);
	display:block;
	width:0;
	height:0;
	position:relative;
}
div#nav div#switchNav ul li a em { 
	/* T*/
	display:block; 
	text-indent:-10000px;
	height:41px;
	position:absolute; 
	background:#fff url(../images/layout/switchnav_li_bg.gif);
	cursor:pointer; /* to set the pointer correctly as a link in IE */
}
div#nav div#switchNav ul li a:hover em,
div#nav div#switchNav ul li a:focus em,
div#nav div#switchNav ul li.selected a em {
	background-position:0 -41px;
}
div#nav div#switchNav ul li#sWhat,
div#nav div#switchNav ul li#sWhat a em {
	width:114px;
}
div#nav div#switchNav ul li#sHow,
div#nav div#switchNav ul li#sHow a em {
	width:114px;
}
div#nav div#switchNav ul li#sWhen,
div#nav div#switchNav ul li#sWhen a em {
	width:113px;
}
div#nav div#switchNav ul li#sHowmuch,
div#nav div#switchNav ul li#sHowmuch a em {
	width:113px;
}
div#nav div#switchNav ul li#sHelp,
div#nav div#switchNav ul li#sHelp a em {
	width:112px;
}

div#nav div#switchNav ul li#sWhat a em { background-image:url(../images/layout/switch/en/what.gif); }
div#nav div#switchNav ul li#sHow a em { background-image:url(../images/layout/switch/en/how.gif); }
div#nav div#switchNav ul li#sWhen a em { background-image:url(../images/layout/switch/en/when.gif); }
div#nav div#switchNav ul li#sHowmuch a em { background-image:url(../images/layout/switch/en/howmuch.gif); }
div#nav div#switchNav ul li#sHelp a em { background-image:url(../images/layout/switch/en/help.gif); }
/* Welsh nav rejigged in cy.css */

body#cy div#nav div#switchNav ul li#sWhat a em { background-image:url(../images/layout/switch/cy/what.gif); }
body#cy div#nav div#switchNav ul li#sWhy a em { background-image:url(../images/layout/switch/cy/why.gif); }
body#cy div#nav div#switchNav ul li#sHow a em { background-image:url(../images/layout/switch/cy/how.gif); }
body#cy div#nav div#switchNav ul li#sWhen a em { background-image:url(../images/layout/switch/cy/when.gif); }
body#cy div#nav div#switchNav ul li#sWhere a em { background-image:url(../images/layout/switch/cy/where.gif); }


/* breadcrumb 
div#breadcrumb {
	background:#e7e7e7;
	float:left;
	margin-bottom:10px;
	padding:2px 10px;
	width:740px;
}
div#breadcrumb * {
	margin:0;
}
div#breadcrumb h2 {
	color:#7f7f7f;
	font-size:1em;
	font-weight:normal;
	float:left;
}
div#breadcrumb ul {
	float:left;
	margin-left:-5px;
	font-size:1em;
}
div#breadcrumb li {
	color:#f0027f;
	list-style:none;
	float:left;
	padding-left:5px;
}
div#breadcrumb li a {
	background:url(../images/layout/breadcrumb_li_bg.gif) no-repeat center right;
	font-weight:normal;
	padding:0 15px 0 5px;
}*/
/* Breadcrumb
------------------------------*/

.breadcrumb-wrap{
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}
.breadcrumb{
	margin: 0 0 15px 0;
	padding: 0;
	height: 24px;
	background-color: #e7e7e7;
	width: 100%;
	overflow: hidden;
}
.breadcrumb p{
	margin: 5px 0 0 0;
	margin-left: 10px;
	padding: 0;
	float: left;
	color: #666666;
}
.breadcrumb UL{
	list-style: none;
	margin: 0;
	padding: 0;
	float: left;
}
.breadcrumb UL#useful{
	float: right;
}
.breadcrumb UL LI{
	float: left;
	color: #000;
	margin: 0;
	padding: 5px 14px 0 7px;
	background-image: url(../images/breadcrumb_sep.jpg);
	background-position: right 7px;
	background-repeat: no-repeat;
}
.breadcrumb UL LI.current, .breadcrumb UL LI A:hover{
	background: none;
	color: #f0027f;
}
.breadcrumb UL LI A{
	text-decoration: none;
	color: #000;
}
.breadcrumb UL#useful LI{
	display: block;
	padding: 5px 14px 10px 7px;
	background-image: url(../images/bg_useful_sep.gif);
	background-position: left top;
	background-repeat: repeat-y;
}
.breadcrumb UL#useful LI#print{
	display: block;
	/*height: 19px;*/
	margin: 0;
}
.breadcrumb UL#useful LI#print.pointer{
	/* T */
	cursor: pointer;
}