/* navigation links
-------------------------------------------------------- */
ul#nav {
	position: relative;
	margin: 0px 0px 0px 0px;
	height: 33px; width: 100%;
	background: url("images/nav.gif") no-repeat;
	}

	ul#nav li {
		float: left;
		list-style: none;
		}
	
	ul#nav li a {
		position: absolute;
		text-indent: -9999px;
		text-decoration: none;
		border: none !important;
		top: 0; height: 33px;
		}

		ul#nav li#nav-home a { 
			left: 0; width: 56px;
			background: url("images/nav.gif") 0px 0px no-repeat;
			}
		ul#nav li#nav-account a { 
			left: 56px; width: 122px; 
			background: url("images/nav.gif") -56px 0 no-repeat;
			}
		ul#nav li#nav-faq a { 
			left: 178px; width: 50px; 
			background: url("images/nav.gif") -178px 0 no-repeat;
			}
		ul#nav li#nav-security a { 
			left: 228px; width: 100px; 
			background: url("images/nav.gif") -228px 0 no-repeat;
			}
		ul#nav li#nav-contact a { 
			left: 328px; width: 96px; 
			background: url("images/nav.gif") -328px 0 no-repeat;
			}
		
			
ul#nav li#nav-home a:hover  			{ background-position:   0px -33px; }
ul#nav li#nav-account a:hover  			{ background-position: -56px -33px; }
ul#nav li#nav-faq a:hover  			    { background-position: -178px -33px; }
ul#nav li#nav-security a:hover  		{ background-position: -228px -33px; }
ul#nav li#nav-contact a:hover  			{ background-position: -328px -33px; }


ul#nav li#nav-home a.active  			{ background-position: 	  0px -66px; }
ul#nav li#nav-account a.active  		{ background-position: -56px -66px; }
ul#nav li#nav-faq a.active  			{ background-position: -178px -66px; }
ul#nav li#nav-security a.active 		{ background-position: -228px -66px; }
ul#nav li#nav-contact a.active  		{ background-position: -328px -66px; }




	/*Menu*/
	#mainmenu {
		padding:0;
		width:189px;
		height:156px;
		margin:0px -10px 0px 0px;
	}

	#mainmenu li {float:left;
	list-style: none;}

	#mainmenu li a {
		display:block;
		width:189px;
		height:52px;
		float:left;
		padding:0;
		text-indent: -9999px;
		text-decoration: none;
		border: none !important;
	}

	#mainmenu li.m01 a, #mainmenu li.m01 {background:url(images/new-cust-but.jpg) no-repeat 0 0;}

	#mainmenu li.m02 a, #mainmenu li.m02 {background:url(images/returning-cust-but.jpg) no-repeat 0 0;}

	#mainmenu li.m03 a, #mainmenu li.m03 {background:url(images/what-loan-but.jpg) no-repeat 0 0;}

	#mainmenu li.m04 a, #mainmenu li.m04 {background:url(images/testi-but.jpg) no-repeat 0 0;}

	#mainmenu li a:hover {background-position:0 50%;}

	#mainmenu li.active a, #mainmenu li.active a:hover, #mainmenu li.active {background-position:0 100%;}
	
	/*---------------------------------------------------------------------/*

/* The hint to Hide and Show */
.hint {
   	display: none;
    position: absolute;
    right: 120px;
    width: 200px;
    margin-top: -4px;
    border: 1px solid #c93;
    padding: 10px 12px;
    /* to fix IE6, I can't just declare a background-color,
    I must do a bg image, too!  So I'm duplicating the pointer.gif
    image, and positioning it so that it doesn't show up
    within the box */
    background: #ffc url(images/pointer.gif) no-repeat -10px 5px;
}

/* The pointer image is hadded by using another span */
.hint .hint-pointer {
    position: absolute;
    left: 17px;
    top: 433px;
    width: 10px;
    height: 19px;
    background: url(images/pointer.gif) left top no-repeat;
}
/*---------------------------- hint field closed-----------------------/*