/* 	
	CSS screen styles for Burton/DP recruitment
	Authored by Russ Back, April 2006 
*/

/*  
Structure:
1. 	Default values and basic styles
2. 	Wrapper and header
3. 	Accessibility elements
4. 	Top-level nav
5. 	Subnav menus
6. 	Footer
7. 	Headlines
8. 	Content blocks
9. 	The brands
10.	Departments
11.	FAQs
12. Case studies
13. Current vacancies
14. Contact us
*/

/* 1. Default values and basic styles */ 

	body, h1, h2, h3, h4, h5, h6, p, ul, ol, dl, li, dt, dd, img, a, div {
		margin: 0;
		padding: 0;
		border-style: none;
		list-style: none;
		}
		
	body {
		font: 0.75em/1.4 Arial, Helvetica, Verdana, sans-serif;
		color: #000;
		background: #FFF;
		padding: 30px 0;
		}
		
	h1 {
		background: url(../images/chrome/arcadia_logo.gif) 10px 40px no-repeat #000;
		float: right;
		}
		
	h1 a {
		display: block;
		height: 73px;
		width: 137px;
		}
		
	h2 {
		height: 30px;
		margin-top: 5px;
		color: #8CAED6;
		text-transform: lowercase;
		font-size: 2.2em;
		}
	
	h3 {
		padding-top: 10px;
		font-size: 1.2em;
		color: #8CAED6;
		text-transform: lowercase;
		}
		
	h4 {
		font-size: 1em;
		margin-top: 10px;
		}
		
	a {
		text-decoration: underline;
		}
		
	.strong {
		font-weight: bold;
		}
		
	.centre {
		text-align: center;
		}
		
	#centre_column li {
		list-style: disc;
		margin: 10px 0 0 25px;
		}
		
	table {
		border-bottom: 1px #84AACE solid;
		}
		
	th, td {
		vertical-align: top;
		text-align: left;
		padding: 5px 10px 5px 0;
		border-top: 1px #84AACE solid;
		}
		
/* 2. Wrapper and header */

	#wrapper {
		width: 770px;
		height: 440px;
		margin: 0 auto;
		}
		
	#sites_menu {
		height: 73px;
		width: 300px;
		background: #000;
		}
		
	#burton_link {
		padding: 18px 0 0 15px;
		}
	
	#burton_link a {
		width: 103px;
		height: 15px;
		display: block;
		background: url(../images/chrome/burton_logo.gif) no-repeat;
		}
	
	#dp_link {
		padding: 10px 0 0 15px;
		}
		
	#dp_link a {
		width: 207px;
		height: 15px;
		display: block;
		background: url(../images/chrome/dp_logo.gif) no-repeat;
		}
	
/* 3. Accessibility elements */

	.hidden {
		text-indent: -9000px;
		font-size: 0.1em;
		color: #FFF;
		overflow: hidden;
		}
		
	.reader_label {
		position: absolute;
		top: -9000px;
		}
		
	#access_menu {
		position: absolute;
		width: 80%;
		top: -9000px;
		}
	
	#access_menu a {
		position: absolute;
		top: 0;
		}
	
	#access_menu a:active, #access_menu a:focus {
		top: 9000px;
		color: #FFF;
		background-color: #000;
		font-weight: bold;
		padding: 5px;
		}

/* 4. Top-level nav */

	#nav {
		background: #000;
		margin: 3px 0;
		text-align: center;
		padding: 7px 0;
		text-transform: lowercase;
		}
		
	#nav li {
		display: inline;
		}
		
	#nav a {
		color: #FFF;
		text-decoration: none;
		font-weight: bold;
		padding: 22px;
		}
		
	#nav a:active, #nav a:hover, #nav a:focus, #nav a.active {
		color: #8CAED6;
		}

/* 5. Subnav menus */

	#home_subnav {
	  min-height: 246px;
		background: url(../images/home/background.jpg) no-repeat #8CAED6;
		margin-top: 3px;
		padding: 50px 10px 0 640px;
		text-transform: lowercase;
		}
		
	* html #home_subnav { /* IE min-height fix */
		height: 246px;
		}
		
	#home_subnav a {
		margin: 10px 0;
		padding: 5px 20px 5px 0;
		display: block;
		color: #FFF;
		font-weight: bold;
		text-decoration: none;
		background: url(../images/home/q.gif) -9000px 0 no-repeat;
		}
		
	* html #home_subnav a { /* IE box model fix */
		margin: 0;
		padding: 3px 20px 0 0;
		}
	
	#home_subnav a:active, #home_subnav a:hover {
		background-position: right;
		color: #0851A5;
		}
		
	#about_images {
		background: url(../images/about/background.jpg) no-repeat;
		}
		
	#brands_images {
		background: url(../images/brands/background.jpg) no-repeat;
		}
		
	#burton_images {
		background: url(../images/brands/burton_bgrd.jpg) no-repeat;
		}
		
	#burton_focus_images {
		background: url(../images/brands/burton_fashion_bgrd.jpg) no-repeat;
		}
		
	#dp_images {
		background: url(../images/brands/dp_bgrd.jpg) no-repeat;
		}
		
	#advisors_images {
		background: url(../images/advisors/background.jpg) no-repeat;
		}
		
/* 6. Footer */

	#footer {
		clear: both;
		background: #000;
		height: 3px;
		margin-top: 3px;
		font-size: 0.1em;
		}
		
		
/* 7. Headlines */

	#h2_about_us {
		background: url(../images/headlines/about_us.gif) left center no-repeat;
		}
		
	#h2_our_brands {
		background: url(../images/headlines/our_brands.gif) left center no-repeat;
		}
		
	#h2_burton {
		background: url(../images/headlines/burton_logo.gif) left center no-repeat;
		}
		
	#h2_dp {
		background: url(../images/headlines/dp_logo.gif) left center no-repeat;
		}
		
	#h2_department_info {
		background: url(../images/headlines/department_info.gif) left center no-repeat;
		}
		
	#h2_retail_management {
		background: url(../images/headlines/retail_management.gif) left center no-repeat;
		}
		
	#h2_buying {
		background: url(../images/headlines/buying.gif) left center no-repeat;
		}
		
	#h2_merchandising {
		background: url(../images/headlines/merchandising.gif) left center no-repeat;
		}
		
	#h2_distribution {
		background: url(../images/headlines/distribution.gif) left center no-repeat;
		}
		
	#h2_design {
		background: url(../images/headlines/design.gif) left center no-repeat;
		}
		
	#h2_technical_services {
		background: url(../images/headlines/technical_services.gif) left center no-repeat;
		}
		
	#h2_finance {
		background: url(../images/headlines/finance.gif) left center no-repeat;
		}
		
	#h2_marketing {
		background: url(../images/headlines/marketing.gif) left center no-repeat;
		}
		
	#h2_human_resources {
		background: url(../images/headlines/human_resources.gif) left center no-repeat;
		}
		
	#h2_retail_operations {
		background: url(../images/headlines/retail_operations.gif) left center no-repeat;
		}
		
	#h2_visual_merchandising {
		background: url(../images/headlines/visual_merchandising.gif) left center no-repeat;
		}
		
	#h2_sales_advisor {
		background: url(../images/headlines/sales_advisor.gif) left center no-repeat;
		}
		
	#h2_faqs {
		background: url(../images/headlines/faqs.gif) left center no-repeat;
		}
		
	#h2_case_studies {
		background: url(../images/headlines/case_studies.gif) left center no-repeat;
		}
		
	#h2_current_vacancies {
		background: url(../images/headlines/current_vacancies.gif) left center no-repeat;
		}
		
	#h2_contact_us {
		background: url(../images/headlines/contact_us.gif) left center no-repeat;
		}
		
/* 8. Content blocks */

	#content_wrapper {
		background: url(../images/chrome/content_bgrd.gif) repeat-y;
		min-height: 286px;
		}
		
	* html #content_wrapper { /* IE min-height fix */
		height: 286px;
		}

	.right_column {
		float: right;
		width: 137px;
		min-height: 286px;
		}
		
	* html .right_column { /* IE min-height fix */
		height: 286px;
		}
		
	#left_column {
		width: 285px;
		padding: 15px 0 0 15px;
		float: left;
		color: #FFF;
		}
		
	#left_column p {
		margin: 0 12px 12px 12px;
		}
			
	#centre_column {
		background: #FFF;
		width: 310px;
		padding-bottom: 10px;
		margin-right: 10px;
		float: right;
		}
		
	#centre_column p {
		padding-top: 15px;
		}
		
	.clear {
		clear: both;
		}
		
/* 9. The brands */

	#brands {
		margin-left: 14px;
		}

	#brands a {
		height: 14px;
		display: block;
		margin-top: 10px;
		}
		
	#brands a:active, #brands a:hover, #brands a:focus {
		background-position: left bottom;
		}
		
	#brands_burton {
		padding-top: 15px;
		background: url(../images/brands/burton_logo.gif) no-repeat;
		}
	
	.the_brands a, .the_brands a {
		background: url(../images/brands/the_brand.gif) no-repeat;
		width: 107px;
		}
		
	.fashion_focus a, .fashion_focus a {
		background: url(../images/brands/fashion_focus.gif) no-repeat;
		width: 145px;
		}
		
	#brands_dp {
		margin-top: 20px;
		padding-top: 15px;
		background: url(../images/brands/dp_logo.gif) no-repeat;
		}
		
	* html #brands_burton, * html #brands_dp { /* IE box model fix */
		padding-top: 25px;
		}

/* 10. Departments */

	.departments_images {
		background: url(../images/departments/background.jpg) no-repeat;
		min-height: 312px;
		}
		
	* html .departments_images { /* IE min-height fix */
		height: 312px;
		}
		
	#departments_subnav a {
		height: 26px;
		width: 137px;
		display: block;
		}
		
	#departments_subnav a:active, #departments_subnav a:hover, #departments_subnav a:focus,
		#departments_detail a:active, #departments_detail a:hover, #departments_detail a:focus {
		background-position: left bottom;
		}
		
	#departments_rm a {
		background: url(../images/departments/rm.gif) no-repeat;
		}
		
	#departments_buying a {
		background: url(../images/departments/buying.gif) no-repeat;
		}
		
	#departments_merch a {
		background: url(../images/departments/merch.gif) no-repeat;
		}
		
	#departments_dist a {
		background: url(../images/departments/dist.gif) no-repeat;
		}

	#departments_design a {
		background: url(../images/departments/design.gif) no-repeat;
		}
		
	#departments_ts a {
		background: url(../images/departments/ts.gif) no-repeat;
		}
		
	#departments_finance a {
		background: url(../images/departments/finance.gif) no-repeat;
		}
		
	#departments_mktg a {
		background: url(../images/departments/mktg.gif) no-repeat;
		}
		
	#departments_hr a {
		background: url(../images/departments/hr.gif) no-repeat;
		}
		
	#departments_ro a {
		background: url(../images/departments/ro.gif) no-repeat;
		}
		
	#departments_vm a {
		background: url(../images/departments/vm.gif) no-repeat;
		}
		
	#departments_detail a {
		height: 15px;
		display: block;
		margin: 10px 0 0 -7px;
		}
		
	#departments_overview a {
		background: url(../images/departments/overview.gif) no-repeat;
		width: 167px;
		}
		
	#departments_role a {
		background: url(../images/departments/role.gif) no-repeat;
		width: 121px;
		height: 14px;
		}
		
	#departments_skills a {
		background: url(../images/departments/skills.gif) no-repeat;
		width: 102px;
		height: 17px;
		}
		
	.buying_bgrd {
		background: url(../images/chrome/content_bgrd_buying.gif) repeat-y !important;
		}
		
	.buying_bgrd h3 {
		color: #5A96D6;
		}
		
	.merch_bgrd {
		background: url(../images/chrome/content_bgrd_merch.gif) repeat-y !important;
		}
		
	.merch_bgrd h3 {
		color: #3984D6;
		}
		
	.dist_bgrd {
		background: url(../images/chrome/content_bgrd_dist.gif) repeat-y !important;
		}
		
	.dist_bgrd h3 {
		color: #4A6AA0;
		}
	
	.design_bgrd {
		background: url(../images/chrome/content_bgrd_design.gif) repeat-y !important;
		}
		
	.design_bgrd h3 {
		color: #0D52A2;
		}	
		
	.ts_bgrd {
		background: url(../images/chrome/content_bgrd_ts.gif) repeat-y !important;
		}
		
	.ts_bgrd h3 {
		color: #8BAED4;
		}	
		
	.finance_bgrd { /* also used for visual merchandising as the colour's the same */
		background: url(../images/chrome/content_bgrd_finance.gif) repeat-y !important;
		}
		
	.finance_bgrd h3 {
		color: #5C94D5;
		}	
	
	.mktg_bgrd {
		background: url(../images/chrome/content_bgrd_mktg.gif) repeat-y !important;
		}
		
	.mktg_bgrd h3 {
		color: #4B6AA0;
		}	
		
	.hr_bgrd {
		background: url(../images/chrome/content_bgrd_hr.gif) repeat-y !important;
		}
		
	.hr_bgrd h3 {
		color: #0D53A2;
		}	
		
	.ro_bgrd {
		background: url(../images/chrome/content_bgrd_ro.gif) repeat-y !important;
		}
		
	.ro_bgrd h3 {
		color: #8BAED4;
		}	
		
/* 11. FAQs */

	#faq_images {
		background: url(../images/faq/background.jpg) no-repeat;
		min-height: 286px;
		}
	* html #faq_images { height: 286px; } /* IE min-height fix */
	
	#faq li {
		margin: 0 0 10px -7px;
		}
	
	#faq a {
		height: 17px;
		display: block;
		}
		
	#faq a:active, #faq a:hover, #faq a:focus {
		background-position: left bottom;
		}
		
	#faq_company a {
		background: url(../images/faq/company.gif) no-repeat;
		width: 205px;
		}
		
	#faq_options a {
		background: url(../images/faq/options.gif) no-repeat;
		width: 150px;
		}
		
	#faq_advisors a {
		background: url(../images/faq/advisors.gif) no-repeat;
		width: 145px;
		height: 14px;
		}

/* 12. Case studies */

	#case_images {
		background: url(../images/case/background.jpg) no-repeat;
		}
		
	#case_studies {
		margin-left: 13px;
		}
		
	#case_studies li {
		margin-bottom: 10px;
		}
		
	#case_studies a {
		height: 17px;
		display: block;

		}
		
	#case_studies a:active, #case_studies a:hover, #case_studies a:focus {
		background-position: left bottom;
		}
		
	#case_rm {
		margin-left: -19px !important;
		}
		
	#case_rm a {
		background: url(../images/case/rm.gif) no-repeat;
		width: 185px;
		}
		
	#case_buying {
		background: url(../images/case/head_office.gif) no-repeat;
		padding-top: 25px !important;
		}
		
	#case_buying a {
		background: url(../images/case/buying.gif) no-repeat;
		width: 105px;
		}
		
	#case_merch a {
		background: url(../images/case/merch.gif) no-repeat;
		width: 145px;
		}
		
	#case_dist a {
		background: url(../images/case/dist.gif) no-repeat;
		width: 115px;
		height: 14px;
		}
		
/* 13. Current vacancies */
	
	#vacancies_images {
		background: url(../images/vacancies/background.jpg) no-repeat;
		}
	
	#vacancies a {
		height: 14px;
		display: block;
		margin: 10px 0 0 -7px;
		}
		
	#vacancies a:active, #vacancies a:hover, #vacancies a:focus {
		background-position: left bottom;
		}
		
	#vacancies_current a {
		background: url(../images/vacancies/current_vacancies.gif) no-repeat;
		}
		
	#vacancies_benefits a {
		background: url(../images/vacancies/benefits.gif) no-repeat;
		height: 15px;
		}
		
	#vacancies_account a {
		background: url(../images/vacancies/career_account.gif) no-repeat;
		}
		
	#vacancies_alert a {
		background: url(../images/vacancies/alert.gif) no-repeat;
		}
		
/* 14. Contact us */

	#contact_images {
		background: url(../images/contact/background.jpg) no-repeat;
		}
		
	.contact_bgrd {
		background: url(../images/chrome/content_bgrd_contact.gif) repeat-y !important;
		}

	#contact_address {
		font-weight: bold;
		}
