/* 
	Global styles used throughout the public website. 
	These styles are either present on every page or are are reserved for common purposes, therefore 
	the id's should not be used elsewhere in the site
*/

	html { 
		min-height: 100%; 
		overflow-y: scroll;
	}
	
	body {
		height: 100%; 
		width: 100%; 
		position: absolute;
		font: 62.5%/1.6em Arial, Helvetica, sans-serif;
		background: #efeded url(../img/bg-site.png) repeat-x 0 0;
		color: #000;
	}
	
	a { 
		color: #D41820;
		text-decoration: none; 
	}
	
	a:hover, a:visited {
		color: #999;
	}
		
	p {
		font-size: 1.2em;
		margin: 1.2em 0;
	}
	
	h1, h2, h3 {
		font-size: 2.5em;
		font-weight: bold;
		color: #d41820;
		line-height: 1.22em;
		margin: 10px 0;
	}
	
	h2 {
		font-size: 1.8em;
	}
	
	h3 {
		font-size: 1.5em;
		font-weight: bold;
	}
	
	h4 {
		font-size: 1.2em;
		font-weight: bold;
		color: #000;
		line-height: 1.22em;
		margin: 10px 0;
	}
	
	h1 a, h2 a, h3 a, h4 a {
		color: #d41820;
		text-decoration: underline;
	}
	
	h4 a {
		color: #000;
	}
	
	h1 a:hover, h1 a:visited, h2 a:hover, h2 a:visited, h3 a:hover, h3 a:visited, h4 a:hover, h4 a:visited {
		color: #999;
	}

/* common classes */

	h1.first, h2.first, h3.first, h4.first, h5.first, h6.first, p.first, ul.first {
		margin-top: 0 !important;
		padding-top: 0 !important;
	}
	
	h1.last, h2.last, h3.last, h4.last, h5.last, h6.last, p.last, ul.last {
		margin-bottom: 0 !important;
		padding-bottom: 0 !important;
	}
	
	h1.alt {
		font-size: 1.8em;
	}
	
	h2.alt {
		font-size: 1.5em;
	}
	
	p.sub { /* secondary text */
		font-size: 1em;
		line-height: 1.6em;
	}
	
	span.sub {
		font-size: 0.83em;
		color: #666;
	}
	
	a.alt { /* secondary links */
		color: #666;
		text-decoration: underline;
	}
	
	a.alt:hover, a.alt:visited {
		color: #999;
	}
	
	ul.std, ul.tick, ul.cross {
		font-size: 1.2em;
		margin: 1.2em 0;
	}
	
	ul.std li {
		background: url(../img/bullet-std.gif) no-repeat 0 6px;
		padding-left: 14px;
		line-height: 1.4em;
	}
	
	ul.tick li, ul.std li.tick {
		background: url(../img/icon-tick.png) no-repeat 0 2px;
		_background-image: url(../img/icon-tick.gif);
		padding-left: 20px;
		line-height: 1.4em;
	}
	
	ul.cross li, ul.std li.cross {
		background: url(../img/icon-cross.png) no-repeat 0 2px;
		_background-image: url(../img/icon-cross.gif);
		padding-left: 20px;
		line-height: 1.4em;	
	}
	
/* forms */

	form.std, div.form_std { font-size: 1em; width: 100%; }
	
	form.std ul { }
	
	form.std li { }
	
	form.std li.legend, div.form_std h2.legend {
		font-size: 1.2em;
		display: block;
		width: 100%;
		border-bottom: 1px solid #e0e0e0;
		padding-bottom: 2px;
		font-weight: bold;
		margin: 10px 0 0 0;
		color: #000;
		float: left;
		clear: both;
	}
	
	form.std li.legend span, div.form_std h2.legend span {
		font-weight: normal;
		color: #666;
		padding-left: 1em;
		font-size: 0.83em;
	}
	
	form.std li.sub_legend, div.form_std h3.sub_legend {
		color: #666;
		width: 100%;
		line-height: 1.4em;
		margin: 6px 0;
		float: left;
		clear: both;
	}
	
	form.std li.field, div.form_std div.field {
		padding: 7px 0;
		width: 50%;
		min-width: 248px;
		max-width: 416px;
		float: left;
		clear: both;
	}
	
	form.std li.help_image {
		float: left; 
		margin-left: 9px;
		padding-top: 9px
	}
	
	form.std li.buttons {
		width: 100%;
		max-width: 431px;
		padding-top: 12px;
		clear: both;
	}
	
	form.std label {
		font-size: 1.2em;
		line-height: 1.2em;
		display: block;
		margin-bottom: 3px;
	}
	
	form.std input.text { 
		width: 100%;
		border: 1px solid #7f9db9;
		padding: 2px 0;
	}
	
	form.std input.custom {
		width: auto;
	}
	
	form.std select {
		width: 100%;
	}
	
	form.std select.date {
		width: auto;
	}
	
	form.std .checkbox, .radio { display:block; *zoom: 1; line-height: 1em; }
	form.std .checkbox:after, .radio:after { content: '.'; clear: both; height: 0; display: block; visibility: hidden; }
	
	form.std .checkbox input, .radio input {
		vertical-align: middle;
	}
	
	form.std label span {
		font-size: .83em;
		line-height: .83em;
		color: #666;
		padding-left: .75em;
	}
	
	form.std label a {
		color: #D41820 !important;
		text-decoration: underline;
	}
	
	form.std label.choice {
		display:inline;
		vertical-align: middle;
	}
	
	form.std li div { *zoom: 1; }
	form.std li div:after { content: '.'; clear: both; height: 0; display: block; visibility: hidden; }
	
	form.std li div span.inline {
		font-size: 1.5em;
		float: left;
		margin:0 .4em 0 0;
	}
	
	form.std label.label {
		clear:both;
		color:#444;
		display:block;
		font-size: .6em;
		padding-top:3px;
		line-height: 1em;
		margin: 0;
		font-family: Verdana, Arial, Helvetica, sans-serif;
	}
	
	form.std li.error, form.std li.focus {
		background: #ffdfdf;
		position: relative;
		margin-left: -9px;
		display: inline;
		padding: 7px 8px 6px 8px;
		border: 1px solid #ddd;
		margin-top: -1px;
		margin-right: -9px;
	}
	
	form.std li.focus {
		background: #fff5cd;
	}
	
	form.std span.error { /* in-form error messages */
		color: #d41820;
		margin-top: 4px;
		line-height: 1em;
		display: block;
	}
	
	form.std h4.error { /* error sub headings */
		color: #d41820;
	}
	
	form.std li.large, div.form_std div.large {
		width: 100%;
	}
	
	form.std li.text {
		width: 100%;
		float: left;
		clear: both;
	}
	
	form.std li.large select {
		width: 100%;
	}
	
	form.std .focus_area {
		display: none;
		width: 157px;
		border: 1px solid #ddd;
		background: #fff5cd;
		padding: 8px 10px;
		font-size: 1.1em;
		line-height: 1.5em;
		color: #434343;
		left: 100%;
		position: absolute;
		margin-top: -8px;
		margin-left: 0px;
	}
	
	form.std li.focus .focus_area {
		display: block;
	}
	
	form.std .focus_iframe {
		width: 177px;
		color: #434343;
		left: 261px;
		position: absolute;
		margin-top: -8px;
	}
	
	form.std li.dd_guarantee {
		background: #dddddd url(../img/icon-dd-grey.png) no-repeat 12px 46px;
		padding: 18px 0 18px 0;
		width: 100%;
		max-width: 431px;
		clear: both;
	}
	form.std li.dd_guarantee * {
		margin-right: 18px;
		margin-left: 82px;
	}
	
	form.std li.dd_guarantee h4 {
		margin-top: 0;
	}
	
	table.basket_checkout {
		width: 100%;
	}
	
	table.basket_checkout tr.last td {
		padding-bottom: 0 !important;
	}
	
	table.basket_checkout td.item {
		font-size: 1.5em;
		font-weight: bold;
	}
	
	table.basket_checkout td.price {
		font-size: 1.2em;
		font-weight: bold;
		text-align: right;
	}
	
	table.basket_checkout td.terms {
		padding: 6px 0 15px 0;
	}
	
	table.basket_checkout td.terms input {
		vertical-align: middle;
	}
	
	table.basket_checkout td.terms label{
		font-size: 1em;
		vertical-align: middle;
	}
	
	table.basket_checkout td.terms a {
		color: #D41820;
	}
	
	form.std li.important, div.form_std div.important {
		font-size: 1.5em;
		color: #d81921;
		font-weight: bold;
		padding: 7px 0;
		float: left;
		clear: both;
	}
	
	div.form_std div.reference {
	 	font-size: 1.5em;
		color: #000;
		font-weight: bold;
		padding: 7px 0;
	 }
	 
	 div.form_std div, div.form_std h2 { float: none !important; clear: none !important; }
	 
	 div.form_std table.basket_checkout td { 
	 	padding-bottom: 15px;
	 }

/* general layout */

	#container { 
		min-width: 1000px; 
		width: 100%;
		margin: 0 auto;	
		min-height:100%;	
		position: relative;
	}
	
	#header {
		background: url(../img/header-footer/bg-top-nav-right.gif) no-repeat 100% -4px;
		border-top: 4px solid #000;
		height: 66px;
		margin-left: 12px;
		right: 12px;
		position: relative;
	}
	
	#nav {
		position: relative;
		height: 44px;
		top: 0;
		margin: 0 12px;
margin-top:10px;
		background: url(../img/navigation/bg-main-nav.png) repeat-x 0 0;
	}
	
	#footer {
		background: #fff url(../img/header-footer/bg-footer.gif) repeat-x 0 0;
		color: #8a8b8d;
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 82px;
		padding-bottom: 1px;
	}
	
	#content {
		padding-bottom: 66px;/*82px;*/
		width: 1000px;
		margin: 0 auto;
	}
	
	#content.flex {
		max-width: 1400px;
		width: 100%;
	}
	
	#content_inner {
		position: relative;
		width: auto;
		margin: 15px 12px;
		*zoom: 1;
	}
	
	#content_inner:after { content: '.'; clear: both; height: 0; display: block; visibility: hidden; }

/* header area */

	#logo {
		display: block;
		position: absolute;
		top: 18px;
		left: 18px;
		width: 550px;
		height: 50px;
		background: url(../img/header-footer/homeserve-logo.png) no-repeat 0 0;
	}
	
	#logo span {
		margin-left: -4000px;
	}
	
	#top_links {
		height: 17px;
		position: absolute;
		top: -4px;
		right: 14px;
		_right: 13px; /* fixes rounding bug in ie6 */
		*zoom: 1;
		background: #000 url(../img/header-footer/bg-top-nav-left.gif) no-repeat 0 0;
		padding: 0 13px 0 30px;
	}
	
	#top_links:after { content: '.'; clear: both; height: 0; display: block; visibility: hidden; }
	
	#top_links li {
		font-size: 1.1em;
		line-height: 1.5em;
		float: left;
		background: url(../img/header-footer/bullet-top-nav.gif) no-repeat 100% 50%;
		padding: 0 10px 0 6px;
	}
	
	#top_links li.first {
		padding-left: 0;
	}
	
	#top_links li.last {
		background: none;
		padding-right: 0;
	}
	
	#top_links li a {
		color: #cacaca;
	}
	
	#top_links li a:hover { 
		text-decoration: underline;
	}
	
	#my_homeserve_link {
		position: absolute;
		top: 19px; /* change to em */
		right: 17px;
	}
	
	#my_homeserve_link a {
		font-size: 1.4em;
		color: #d5011a;
		font-weight: bold;
	}
	
	#my_homeserve_link a:hover {
		text-decoration: underline;
		color: #999;
	}
	
	#basket_links {
		background: url(../img/header-footer/bg-basket-right.gif) no-repeat 100% 0;
		position: absolute;
		top: 44px;
		right: 0;
		padding-right: 12px;
		
	}
	#basket_links ul {
		padding-left: 12px;
		background: #ededed url(../img/header-footer/bg-basket-left.gif) no-repeat 0 0;
		height: 26px;
		*zoom: 1;
		_display: inline; /* ie6 fix to prevent area taking up 100% width */
	}
	
	#basket_links ul:after { content: '.'; clear: both; height: 0; display: block; visibility: hidden; }
	
	#basket_links li {
		color: #8a8b8d;
		font-size: 1.1em;
		float: left;
		padding: 0 5px;
		line-height: 2.2em;
	}
	
	li#basket_link_job {
		background: url(../img/header-footer/border-basket.gif) no-repeat 100% 50%;
		padding-right: 9px;
	}
	
	li#basket_link_cover {
		padding-left: 9px;
		background: url(../img/icon-basket-empty.gif) no-repeat 0 3px;
		padding-left: 25px;
		margin-left: 9px;
	}
	
	#basket_links li a {
		display: block;
		_display: inline-block; /* ie6 fix to prevent area taking up 100% width */
		height: 26px;
		color: #000;
	}
	
	#basket_links li a:hover {
		color: #999;
		text-decoration: underline;
	}
	
	#basket_link_cover a {
		background: url(../img/icon-basket-full.gif) no-repeat 0 3px;
		padding-left: 25px;
		margin-left: -25px;
	}
	
	#basket_link_cover a span {
		color: #666;
	}
	
	#basket_link_cover a:hover span {
		color: #999;
	}

/* main navigation */

	#nav ul {
		position: absolute;
		left: 0;
		min-width: 20px;
		background: url(../img/navigation/navigation.png) no-repeat 0 -944px;
		height: 100%;
		*zoom: 1;
	}
	
	#nav:after { content: '.'; clear: both; height: 0; display: block; visibility: hidden; }
	
	#nav li {
		float: left;
		background: url(../img/navigation/border-main-nav.png) no-repeat 100% 0;
		height: 100%;
		padding-right: 1px;
	}
	
	#nav li a { 
		display: block;
		height: 100%;
		background-repeat: no-repeat;
	}
	
	#nav li span {
		margin-left: -4000px;
	}
	
	#nav_products a {
		background: url(../img/navigation/navigation.png) 0 -30px;
		width: 151px;
	}
	
	#nav_products a:hover, #nav_products.selected a {
		background: url(../img/navigation/navigation.png) 0 -104px;
	}
	
	#nav_partners a {
		background: url(../img/navigation/navigation.png) 0 -770px;
		width: 108px;
	}
	
	#nav_partners a:hover, #nav_partners.selected a {
		background: url(../img/navigation/navigation.png) 0 -844px;
	}
	
	#nav_partnerw a {
		background: url(../img/navigation/navigation.png) 0 -622px;
		width: 146px;
	}
	
	#nav_partnerw a:hover, #nav_partnerw.selected a {
		background: url(../img/navigation/navigation.png) 0 -696px;
	}
	
	#nav_careers a {
		background: url(../img/navigation/navigation.png) 0 -178px;
		width: 74px;
	}
	
	#nav_careers a:hover, #nav_careers.selected a {
		background: url(../img/navigation/navigation.png) 0 -252px;
	}
	
	#nav_network a {
		background: url(../img/navigation/navigation.png) 0 -474px;
		width: 161px;
	}
	
	#nav_network a:hover, #nav_network.selected a {
		background: url(../img/navigation/navigation.png) 0 -548px;
	}
	
	#nav_help a {
		background: url(../img/navigation/navigation.png) 0 -326px;
		width: 133px;
	}
	
	#nav_help a:hover, #nav_help.selected a {
		background: url(../img/navigation/navigation.png) 0 -400px;
	}
	
	
	#nav_trailer a {
		background: url(../img/navigation/navigation.png) 0 -918px;
		width: 203px;
	}
	
	#nav_trailer a:hover, #nav_trailer.selected a {
		background: url(../img/navigation/navigation.png) 0 -918px;
	}
	
	#nav form {
		height: 100%;
		width: 205px;
		position: absolute;
		right: 0;
		_right: -1px;
		text-align: right;
		background: url(../img/navigation/navigation.png) no-repeat 100% -918px;
	}
	
	
/* footer area */

	#footer ul {
		*zoom: 1;
		margin: 25px 0 0 17px;
	}
	
	#footer ul:after { content: '.'; clear: both; height: 0; display: block; visibility: hidden; }
	
	#footer li {
		float: left;
		border-left: 1px solid #8a8b8d;
		padding: 0 19px;
		line-height: 1.2em;
		font-size: 1.2em;
	}
	
	#footer li.first {
		border: 0;
		padding-left: 0;
	}
	
	#footer p {
		margin: 6px 0 0 17px;
		font-size: 1.2em;
	}
	
	#footer a {
		color: #8a8b8d;
	}
	
	#footer a:hover {
		color: #666666;
		text-decoration: underline;
	}