@charset "UTF-8";
/* CSS Document */
#topNav {
	position:relative;
	margin: 0px;
	padding: 0px;
	width:901px;
	height:54px;
	border-right:1px solid #116CAE;
	background: url(../images/secondaryBg2Full.png);
}
/* These styles create the dropdown menus. Set height holds the necessary space for the main navigation and the secondary navigation */
#navbar {
	position:absolute;
	width:902px;
	font-size:18px;
	font-weight:bold;
	margin: 0;
	padding:0;
	height:54px;
}
/*All list items for the main and secondary navigation.*/
#navbar li {
	list-style: none;
	float: left;
}
/*left side rounded corners on home*/
#navbar li.leftBlue {
	text-decoration: none;
	background: url(../images/leftCurve.jpg) no-repeat top left;
	width: 110px;
	float:left;
	text-align:center;
	border-right:1px solid #c5daeb;/*light blue*/
}
#navbar li.leftBlue a:hover {
	background: url(../images/leftCurveRoll.jpg) no-repeat top left;
	background-repeat:no-repeat;
	width: 110px;
}
/*selected state left on the main navigation*/
#navbar li a.selectLeft, #navbar li li.selectLeft {
	background: url(../images/leftCurveRoll.jpg) no-repeat top left;
	background-repeat:no-repeat;
	color: #FFF;
	width: 110px;
}
/*personal banking main navigation*/
#navbar li.middleBlue {
	text-decoration: none;
	background: url(../images/mainNavBg.jpg);
	background-repeat:repeat-x;
	width:245px;
	text-align:center;
	border-right:1px solid #c5daeb;/*light blue*/
}
/*business banking main navigation*/
#navbar li.middleBlue2 {
	text-decoration: none;
	background: url(../images/mainNavBg.jpg);
	background-repeat:repeat-x;
	width:240px;
	text-align:center;
	border-right:1px solid #c5daeb;/*light blue*/
}
/*lending main navigation*/
#navbar li.middleBlue3 {
	text-decoration: none;
	text-align:center;
	background: url(../images/mainNavBg.jpg);
	background-repeat:repeat-x;
	width:128px;
 *width:133px;
	border-right:1px solid #c5daeb;/*light blue*/
}
#navbar li.rightBlue {
	text-decoration: none;
	background: url(../images/rightCurve.jpg) no-repeat top right;
	text-align:center;
	width: 175px;
 *width:170px;/*IE6 issue*/
	border-right:1px solid none;
}
#navbar li.rightBlue a:hover {
	background: url(../images/rightCurveRoll.jpg) no-repeat top right;
}
#navbar li li:hover ul.rightBlue {
	background-image:url(../images/secondaryRoll.jpg);
	background-repeat:repeat-x;
}
/*selected state right on the main navigation*/
#navbar li a.selectRight, #navbar li li.selectRight {
	background: url(../images/rightCurveRoll.jpg) no-repeat top right;
	color: #FFF;
	width: 175px;
 *width:170px;/*IE6 issue*/
}
/*--------------------------------------
The secondary navigation rolls over the selected secondary navigation when moused over. These add a blue gradient to the end over the seclected item.
/*--------------------------------------
/*extra space right on the secondary nav on business banking*/
#navbar li .homeBg {
	background: url(../images/secondaryBg2.jpg);
	background-repeat:repeat-x;
	height:26px;
	width:902px;
	cursor:auto;
}
/*This controls the main navigation and secondary navigation that is a list item and a link. */
#navbar li a {
	display: block;
	padding: 5px 0 2px 0;
	height:22px;
	text-decoration: none;
	color: #116CAE;
	font-weight: bold;
}
/*select/hover on the main navigation - very important!!!!!!!!!!*/
#navbar li a:hover {
	color: #FFF;
	background: url(../images/mainNavBgRoll.jpg) top left;
	background-repeat:repeat-x;
}
/*controls the rollover for the none selected state - very important!!!!!!!!!!*/

#navbar li:hover a, #navbar li.over a {
	color: #FFF;
	background: url(../images/mainNavBgRoll.jpg) top left;
	background-repeat:repeat-x;
	left:auto;
}
/*secondary navigation gradient dark.. other wise the light blue gradient from the mainnavigation controls the secondary navigation*/
#navbar li a.gradientDark {
	color: #FFF;
	background-image:url(../images/secondaryBg4.jpg);
	background-repeat:repeat-x;
	left:auto;
}
/*secondary navigation gradient dark.. other wise the light blue gradient from the mainnavigation controls the secondary navigation*/

/*selected state on the main navigation*/
#navbar li a.select, #navbar li li.select {
	background: url(../images/mainNavBgRoll.jpg) top left;
	background-repeat:repeat-x;
	color: #FFF;
}
/*background behind the secondary nav*/
#navbar li ul {
	display: none;
	color: #FFF;
	float:left;
	width:902px;
	height:26px;
	padding:0;
	margin:0;
}
/*secondary nav*/
#navbar li ul a {
	color:#fff;
	font-size:13px;
	padding:6px 15px 0px 15px;
	height:19px;
	float:left;
	border-left:1px solid #116CAE;/*dark blue*/
	display: inline;/*added for IE6 important!!!!!!!!!!!!!!!!!! will not display properly without this*/
}
#navbar li ul.stay {
	position:absolute;
	display: inline;
	color: #fff;
	z-index:3;
	left: 0px;/*firefox posititioning*/
	margin: 0;
}
/*there are no links on the homepage but the secondary navigation needs to show the blue gradient*/	
#navbar li ul.stayHome {
	position:absolute;
	display: inline;
	color: #fff;
	z-index:3;
	left: 0px;
	width:902px;
	margin: 0;
	padding: 0;
	display: inline;
}
/*secondary nav rollover*/
#navbar li:hover ul, #navbar li.over ul, #navbar li.secondarySelect ul {
	position:absolute;
	display: inline;
	z-index:5;
	left: 0px;
	margin: 0;
	padding: 0;
	background-image:url(../images/secondaryBg4.jpg);/*important!!!!! - because the rollover will not cover the selected state without this background image*/
	background-repeat:repeat-x;
}
/*controls the secondary nav on the background gradient home full width*/
#navbar li:hover li, #navbar li.over li, #navbar li.secondarySelect li {
}
/*hover secondary nav - on the current main tab (if you rollover the main nav this will pop up above the secondary nav with a list item??????????????)*/
#navbar li:hover li a, #navbar li.over li a, #navbar li.secondarySelect li a {
	font-size:13px;
	padding:6px 15px 0px 15px;
	height:19px;
}
/*secondary nav hover orange has the correct height & selected state .secondarySelect orange?????????????????? - #navbar li.rightBlue ul li a:hover controls the secondary hover on the right rollover*/
#navbar li li a:hover, #navbar li .secondarySelect, #navbar li a.secondarySelect, #navbar li.rightBlue ul li a:hover {
	color: #116CAE;
	font-size:13px;
	padding:6px 15px 0px 15px;
	height:19px;
	background-image:url(../images/secondaryRoll.jpg);
	background-repeat:repeat-x;
}