/******************************************************
*                                                     *
*   CSS file of Westpac Generation Y website          *
*   Copyright (c) Becc Roach, March 2007.             *
*   This file is a mess. Hopefully not forever...     *
*                                                     *
******************************************************/

/* -----------------------------------*/
/* ---------->>> GLOBAL <<<-----------*/
/* -----------------------------------*/
/* reset CSS */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}ol,ul{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;}
/* end reset */

html {
	height:101%;
}
body {
	background:#AEAEAE url(images/bg.jpg) repeat-x;
	color:#333333;
	font-family:Arial, Helvetica, sans-serif;
	font-size:70%;
	margin:2px auto 0; padding:0;
	text-align:center;
}
h1, h2, h3, h4, h5 {
	color:#414141;
	font-size:100%;
	font-weight:bold;
	margin:0; padding:0; 
}
h1 {
	color:#E12523;
	font-size:330%;
	font-weight:normal;
	letter-spacing:-0.5px;
	margin-left:28px;
}
h1#main-head {
	background:url(images/h1-wheres-ur-head-at.gif) 0 0 no-repeat;
	display:block;
	float:left;
	height:48px;
	overflow:hidden;
	margin:0 0 10px 15px;
	text-indent:-100em;
	width:518px;
}

h2 {
	color:#414141;
	font-size:170%;
	font-weight:normal;
}
#content h2 {
	color:#E12523;
	font-size:230%;
}
#home h2 {
	float:left;
	font-size:200%;	
	width:200px;
}
h3 {
	color:#E12523;
	line-height:1.1em;
	font-size:120%;
}
h3.intro {
	font-size:130%;
}
h4 {
	margin-top:25px;
}

.skip {
	position:absolute;
	top:0;
	left:-1000px;
}
.skip:focus,.skip:active {
	position:absolute;
	top:1em;
	left:1em;
	background:#414141;
	color:#fff;
}

img {
	border:0;
}
.clear {
	clear:both;
	line-height:1em;
}

.clearer {
	clear:both;
	font-size:1px;
	line-height:1px;
	overflow:hidden;
	margin:0;padding:0;
}

.initial {
	margin-top:0;
}
.strong {
	font-weight:bold;
}
.small {
	font-size:85%;
}
hr {
	border-top:1px solid #333333;
	clear:left;
	line-height:0;
	margin:-3px 5px 6px 7px;
}
ul {
	list-style:none;
	margin:0; padding:0;
}

/* ---------->>> PAGE LAYOUT <<<-----------*/
#header {
	background:#fff url(images/container-top.jpg) 0 100% no-repeat;	
	height:46px;
	margin:0 auto; padding:0;
	text-align:left;
	width:974px;
}
	#home #header {
		background:#fff url(images/home-top.jpg) 0 100% no-repeat;	
	}
	#header h2 {
		margin:0; padding:7px 0 0 20px;
		width:240px;
	}

	#header img {
		float:right;
		margin:0; padding:0;
		width:115px;
	}

#container {
	background:#fff url(images/container-bg.jpg) 0 0 no-repeat;
	color:#333333;
	margin:0 auto; padding:0;
	text-align:left;
	width:974px;	
	z-index:0;
}
	#home #container {
		background:#ffffff url(images/home-bg.jpg) 0 0 no-repeat;
	}

	#home #imageContainer {background: url(images/home-face.jpg) 50% 100% no-repeat;}

#content {
	background-position: 99% 100%;
	background-repeat: no-repeat;
	border-bottom:1px solid #cccccc;
	float:left;
	margin-bottom:10px;
	margin-left:17px; 
	margin-top:0;
	min-height:600px;
	_height:600px;
	padding:0 0 2px 0;
	text-align:left;
	width:770px;
}

	#d1 #content {background-image:url(images/get-my-first-home.jpg);}
	#d2 #content {background-image:url(images/rent-first-place.jpg);}
	#d3 #content {background-image:url(images/tie-the-knot.jpg);}
	#d4 #content {background-image:url(images/invest-in-property.jpg);}
	#d5 #content {background-image:url(images/buy-a-car.jpg);}
	#d6 #content {background-image:url(images/buy-something-special.jpg);}
	#d7 #content {background-image:url(images/travel-overseas.jpg);}
	#d8 #content {background-image:url(images/travel-in-oz.jpg);}
	#d9 #content {background-image:url(images/invest-in-shares.jpg);}
	#d10 #content {background-image:url(images/make-banking-easier.jpg);}
	#d11 #content {background-image:url(images/build-wealth.jpg);}
	#d12 #content {background-image:url(images/have-extra-money.jpg);}
	#d13 #content {background-image:url(images/get-a-credit-card.jpg);}
	#d14 #content {background-image:url(images/save-money-faster.jpg);}
	#d15 #content {background-image:url(images/make-banking-easier.jpg);}
	#d18 #content {background-image:url(images/start-a-business.jpg);}

#content-main, #content-links {
	border-top:1px solid #000000;
	float:left;
	margin:0 0 0 0; padding:0;
}
#content-main {
	width:520px;
}
#content-links {
	width:247px;
}

#disclaimer {
	color:#555555;
	font-size:85%;
	margin:0 0 0 202px;
	padding:8px 0 8px;
	width:745px;
}

/* ---------->>> NAVIGATION <<<-----------*/
/* home page */
#nav-home {
/*border:1px solid black;*/
	background:url(images/home-nav.gif);
	height:470px;
	margin:0 0 0 35px;padding:0;
	position:relative;
	width:886px;
}
#nav-home li {
	border:none;
	list-style:none;
	overflow:hidden;
	margin:0;padding:0;
	position:absolute;
	top:0;
}
#nav-home li, #nav-home a {
	display: block;
	height: 23px;
	text-decoration:none;
	text-indent:-5000px;
	width: 191px;
}
	#nav-home li#nav51 a, #nav-home li#nav52 a, #nav-home li#nav53 a {width:193px;}

/* section - make a move */
#nav-home li#nav11, #nav-home li#nav12, #nav-home li#nav13, #nav-home li#nav14 {left: 4px;}
#nav-home li#nav11 {top: 336px;}
#nav-home li#nav12 {top: 358px;}
#nav-home li#nav13 {top: 380px;}
#nav-home li#nav14 {top: 402px;}

/* section - be smarter with money */
#nav-home li#nav21, #nav-home li#nav22, #nav-home li#nav23 {left:24px;}
#nav-home li#nav21 {top: 161px;}
#nav-home li#nav22 {top: 185px;}
#nav-home li#nav23 {top: 207px;}

/* section - go travelling */
#nav-home li#nav31, #nav-home li#nav32 {left: 214px;}
#nav-home li#nav31 {top: 37px;}
#nav-home li#nav32 {top: 60px;}

/* section - make a big purchase */
#nav-home li#nav41, #nav-home li#nav42 {left: 478px;}
#nav-home li#nav41 {top: 37px; }
#nav-home li#nav42 {top: 60px;}

/* section - enter the workforce */
#nav-home li#nav51, #nav-home li#nav52, #nav-home li#nav53 {left:677px;width:193px;}
#nav-home li#nav51 {top: 163px;}
#nav-home li#nav52 {top: 186px;}
#nav-home li#nav53 {top: 209px;}

/* section - survive as a student */
#nav-home li#nav61, #nav-home li#nav62 {left:692px;}
#nav-home li#nav61 {top: 335px;}
#nav-home li#nav62 {top: 359px;}


#nav-home li a:hover {background: url(images/home-nav.gif) no-repeat;}

#nav-home li#nav11 a:hover {background-position: -4px -804px;}
#nav-home li#nav12 a:hover {background-position: -4px -826px;}
#nav-home li#nav13 a:hover {background-position: -4px -848px;}
#nav-home li#nav14 a:hover {background-position: -4px -870px;}

#nav-home li#nav21 a:hover {background-position: -24px -628px;}
#nav-home li#nav22 a:hover {background-position: -24px -652px;}
#nav-home li#nav23 a:hover {background-position: -24px -675px;}

#nav-home li#nav31 a:hover {background-position: -214px -505px;}
#nav-home li#nav32 a:hover {background-position: -214px -527px;}

#nav-home li#nav41 a:hover {background-position: -478px -506px;}
#nav-home li#nav42 a:hover {background-position: -478px -529px;}

#nav-home li#nav51 a:hover {background-position: -677px -629px;}
#nav-home li#nav52 a:hover {background-position: -677px -653px;}
#nav-home li#nav53 a:hover {background-position: -677px -676px;}

#nav-home li#nav61 a:hover {background-position: -692px -803px;}
#nav-home li#nav62 a:hover {background-position: -692px -827px;}

/* content pages */
#nav {
	background:url(images/nav-shadow.jpg) 0 0 no-repeat;
	border:0;
	float:left;
	margin: 0 0 0 -20px; padding:0;
	position:relative;
	width:204px;
	z-index:50;
}
#nav h3 {
	color:#ffffff;
	font-size:120%;
	font-weight:bold;
	margin:0 0 0 7px; padding:5px 0 0;
}
#nav ul {
	margin:0 0 0 6px; padding:0;
	width:188px;
}
#nav ul ul, #nav ul ul ul {
	margin:0;padding:0;
}
#nav li {
	background:#E5E5E5 url(images/nav-bg.jpg) 0 0 repeat;
	border-bottom: 1px solid #D4D4D4;
	border-top: 1px solid #F6F6F6;
	margin:0;padding:0;
}
#nav li.head {
	background:#CB1919 url(images/nav-head-bg.jpg) 0 0 repeat-x;
	border:0;
}
#nav li.first {
	background:url(images/nav-bg-first.jpg) 0 0 repeat-x;
}
#nav li.last {
	background:url(images/nav-bg-last.jpg) 0 0 repeat-x;
}
#nav li.active {
	background:#E52325;
	border-bottom:0;
	border-top: 1px solid #E52325;
	color:#ffffff;
}
#nav li li {
	background:#666666;
	border-bottom:1px solid #666666;
	border-top:1px solid #FFFFFF;
	display:none;
}
#nav li.active li, #nav li.active li.sub li {
	display:block;
}
#nav li.active li li {
	background:#999999;
	border-bottom:1px solid #999999;
	border-left:12px solid #ffffff;
	border-top: 1px solid #ffffff;
	display:none;
}
#nav li li .selected, #nav li li.sub {
	border-bottom:0;
}
#nav li a {
	color:#000000;
	display:block;
	margin:0 0 0 7px;padding:3px 0;
}
#nav li li a {
	padding-left:23px;
}
#nav li li a.selected, #nav li li a.selected:hover {
	background:url(images/nav-arrow-dark.gif) 0 50% no-repeat;
}
#nav li li li a {
	margin-left:7px; padding-left:20px;
}
#nav li li li a.selected, #nav li li li a.selected:hover {
	background:url(images/nav-arrow-light.gif) 0 50% no-repeat;
}
#nav li a:link, #nav li a:visited, #nav li a:active {
	color:#000000;
	text-decoration:none;
}
#nav li a:hover {
	background:#E52325;
	color:#ffffff;
	margin:0;padding:3px 0 3px 7px;
}
#nav li li a:hover {
	background:#666666;
	margin:0 0 0 7px;padding-left:23px;
}
#nav li li li a:hover {
	background:#999999;
	margin-left:7px; padding-left:20px;
}

#nav li.active a:link, #nav li.active a:visited, #nav li.active a:hover, #nav li.active a:active {
	color:#ffffff;
}
#nav #shadow {
	background:url(images/nav-bot.jpg) 0 100% no-repeat;
	height:11px;
	margin:0; padding:0;
}

/* ---------->>> FOOTER <<<-----------*/
#footer {
	background:url(images/container-bot.jpg) 0 0 no-repeat;	
	clear:both;
	color:#ffffff;
	margin:0 auto;
	text-align:left;
	width:974px;
}
#footer ul {
	padding:12px 0 0 5px;
}
#footer ul li {
	display:inline;
	padding:0 0 0 3px;
}
#footer ul li a {
	border-right:1px solid #ffffff;
	padding: 0 5px 0 0;
}
#footer a:link, #footer a:visited, #footer a:hover, #footer a:active {
	color:#ffffff;
}

/* ---------->>> DESIGN ELEMENTS <<<-----------*/
img.noflash {
	margin:164px 0 -3px 62px;
}
#content h2 {
	float:left;
	width:465px;
}

#content p.pageTitle {
	float:left;
	font-size:100%;
	margin:22px 0 0;padding:0;
	width:50px;
}
	#home p.pageTitle {
		float:none;
		font-size:150%;
		margin:0 0 27px 27px;padding:0; 
		width:500px;
	}
	
a.print {
	background:url(images/print-icon.gif) 0 50% no-repeat;
	color:#000000;
	float:right;
	margin:18px 10px 0 0;padding:0 0 0 22px;
	text-decoration:none;
	vertical-align:middle;
}

#content-main h3.intro, #content-main h4, #content-main div, #content-main p, #content-main ul, #content-main ol {
	float:none;
	width:480px;
}

#content-main h3	{
	margin-top: 15px;
}

#content-main p {
	margin-bottom:7px;
}

#content-main p.page {
	background:#333333 url(images/page-icon.gif) 0 0 no-repeat;
	color:#ffffff;
	clear:right;
	cursor:pointer;
	float:right;
	line-height:18px;
	margin-bottom:2px;
	text-align:center;
	width:18px;
}
#content-main a  {
	color:#666666;
	margin:5px 0; padding:0;
}
#content-main a.link  {
	background:#F00000 url(images/link-corner.gif) 100% 0 no-repeat;
	color:#ffffff;
	cursor:pointer;
	margin:5px 0; padding:2px 7px;
}
#content-main a:link, #content-main a:visited, #content-main a:hover, #content-main a:active {
	text-decoration:underline;
	margin:5px 0; padding:0;
}
#content-main a:link {
	color:#333333;
}
#content-main a:visited {
	color:#666666;
}
#content-main a:hover, #content-main a:active {
	color:#333333;
}
#content-main a.link:link, #content-main a.link:visited, #content-main a.link:hover, #content-main a.link:active {
	color:#ffffff;
	text-decoration:none;
	margin:5px 0; padding:2px 7px;
}
dd, dt {
	float:left;
}
dd {
	clear:left;
	font-weight:bold;
	width:170px;
}
dt {
	width:260px;
}
table {
	font-size:100%;
	margin:5px 0 10px;
	width:415px;
}
th, td {
	margin:0;
	padding:4px;
	vertical-align:top;
}
thead th {
	font-weight:bold;
}
th {
	background-color:#666;
	color:#fff;
}
sup{
	font-size:75%;
}
.nobr {
	white-space: nowrap;
}

#content-main ul {
	margin: 5px 0; padding:0;
	list-style-type:disc;
}
#content-main ul li {
	list-style-type:disc;
	margin:4px 0 0 15px; padding:0 0 0 5px;
}
#content-main ol {
	margin: 5px 0; padding:0;
	list-style-type:decimal;
}
#content-main ol li {
	list-style-type:decimal;
	margin:4px 0 0 15px; padding:0 0 0 2px;
}

/* in-page toggle styles */
#content-main ul#expanding {
	list-style-type:none;
	margin:0; padding:0;
}

#content-main ul#expanding li {
	list-style-type:none;
	margin:0; padding:0;
}

#content-main ul#expanding li div, #content-main ul#expanding li div.open, #content-main ul#expanding li.open_down div {
	display:block;
}
#content-main ul#expanding li.open_up div {
	display:none;
}

#content-main ul#expanding li div ul {
	margin: 5px 0 0; padding:0;
	list-style-type:disc;
}
#content-main ul#expanding li div ul li {
	list-style-type:disc;
	margin:4px 0 0 15px; padding:0 0 0 5px;
}
#content-main ul#expanding li div p {
	margin-top:7px;
}

/* right side content div with red background links */
#content-links li {
	background:#f20000 url(images/link-bg.gif) 100% 100% no-repeat;
	float:right;
	margin:5px 5px 0 0;padding:0 0 5px 0;
	width:200px;
}
#content-links li a, #content-links li p {
	background:url(images/link-arrow.gif) 0 50% no-repeat;
	margin:0; padding:0;
}
#content-links li.phone a, #content-links li.phone p {
	background:url(images/link-phone.gif) 0 50% no-repeat;
}
#content-links li a:link, #content-links li a:visited, #content-links li a:hover, #content-links li a:active, #content-links li p {
	color:#ffffff;
	display:block;
	font-weight:bold;
	margin:3px 0 0 10px; padding:3px 20px 3px 25px;
	text-decoration: none;
}

#disclaimer p, #disclaimer a {
	color:#666666;
	margin:0;
	padding:0 0 10px;
}

#disclaimer sup {
	font-size:100%;
	margin:0;
}