@charset "utf-8";

/* General styles and typography for main page elements */

html, body, .skip, h1, h2, #movie, #sections, p, #sub {
	margin: 0;
	padding: 0;
}

body {
	font: normal 0.81em/1.32em Helvetica, sans-serif;
}

a:link, a:visited {
	border-bottom: 1px dotted #ccc;
	font-weight: bold;
	text-decoration: none;
	color: #96a30d;
}

a:hover, a:focus {
	border-bottom: 1px solid #999;
	color: #594900;
}

.sitemap a:link, .sitemap a:visited {
	border-bottom: 1px dotted #ccc;
	font-weight: bold;
	text-decoration: none;
	color: #594900;
}

.sitemap a:hover, .sitemap a:focus {
	border-bottom: 1px solid #999;
	color: #96a30d;
}

a img, #sub a:link {
	border: none !important;
}

a[title^="Block this object"] { /* Needs some HHA */ }

#copy {
	color: #534400;
}

p {
	margin: 1em 0;
	text-align: justify;
}

abbr, acronym {
	border: none;
}

*.help {
	border-bottom: 1px dotted #96a30d;
	cursor: help;
}

h2, h3 {
	font: 2.46em normal "Helvetica Neue", Helvetica, sans-serif;
	letter-spacing: -0.03em;
	padding-bottom: 0.3em;
	text-transform: lowercase;
}

h3 {
	color: #96a30d;
	font-size: 2.08em;
	margin-bottom: 0;
	padding: 0;
}

h3 a {
	color: #96a30d;
	font-size: 0.78em;
}

h4 {
	color: #000;
	font-size: 1em;
}

.published {
	font-size: 0.85em;
	margin-top: -0.1em;
}

.highlight {
	background: #ff0;
	text-decoration: none;
}

dt {
	font-weight: bold;
}

dt, dd {
	margin-bottom: 0.5em;
}

#foot, #numbers, address, #credits {
	color: #594900;
	font: normal 0.85em Tahoma, Verdana, sans-serif;
}

#foot a:link, #foot a:visited, address a:link, address a:visited {
	border-bottom: none;
	color: #96a30d;
	text-transform: lowercase;
}

#foot a:hover, address a:hover {
	color: #594900;
	text-transform: lowercase;
}

.news {
	font: 1em Helvetica, sans-serif;
}

blockquote {
	clear: both;
	font-size: 0.87em;
	font-weight: bold;
	margin: 40px;
	padding: 0;
	position: relative;
	z-index: 2;
}

.ldquo, .rdquo {
	height: 39px !important;
	position: absolute;
	width: 49px !important;
	z-index: -1;
}

.ldquo {
	background: url(bg/quote-left.png) no-repeat;
	left: -20px;
	top: -20px;
}

.rdquo {
	background: url(bg/quote-right.png) no-repeat 100% 100%;
	right: -20px;
	bottom: -20px;
}

blockquote p {
	margin-top: 0;
}

blockquote cite {
	display: block;
	text-align: right;
}

blockquote cite a:link, blockquote cite a:visited {
	color: #796920;
}

blockquote cite a:hover, blockquote cite a:focus {
	color: #594900 !important;
}

.pull {
	border-top:  1px dotted #534400;
	border-bottom: 1px dotted #534400;
	float: right;
	font-size: 1.15em;
	font-style: italic;
	font-weight: normal;
	margin: 1em 0 0.3em 15px;
	padding: 0 10px;
	speak: none;
	width: 200px;
}

.pull p {
	margin: 0.5em 0;
}

.pull .switch {
	margin: 0 10px 0.3em 0;
}

#copy img {
	float: right;
	margin: 0 0 10px 20px;
}

#copy *.switch {
	float: left;
	margin: 0 19px 10px 0;
}

#copy .shots img, #copy .shots img.switch, #copy .full img {
	margin: 0;
}

.figure {
	background: #fff;
	font-size: 0.85em;
	float: right;
	margin: 0 0 0.5em 20px;
	padding: 5px;
}

.figure .switch {
	margin: 0 20px 0 0;
}

.figure img {
	border: 1px solid #ccc;
	float: none !important;
	margin: 0 !important;
	padding: 5px;
}

.figure .caption {
	display: block;
	width: 220px;
}

.wide .caption {
	width: 300px;
}

#copy ul li {
	list-style: none; /* Positioning of bullet images is inconsistent, sadly. */
	padding: 0 14px 0 14px;
	background: url(bg/bullet.png) 0 0.51em no-repeat;
}


/* Hidden structural markup and text */

.skip, #newsletter legend, #git legend {
	left: 0;
	list-style: none;
	position: absolute;
	text-indent: -999em;
	top: 0;
}

.skip a:active, .skip a:focus {
	background: #ccc;
	display: block;
	padding: 5px;
	position: absolute;
	text-indent: 0;
	top: 0;
}

h1, #sections, #credits, #sub, #call, #recycle, .logo, .ldquo, .rdquo, #git label em {
	overflow: hidden;
}

h1 a, #sections a, #credits a, #newsletter label, #sub a, #call a, #recycle a, .logo, .ldquo, .rdquo, #git label em {
	border: none;
	display: block;
	height: 100%;
	text-indent: -9999em;
	width: 100%;
}


/* Layout */

html {
	background: url(bg/site.png) repeat-x;
}

body {
	background: #fff;
	border: 1px solid #d6d1be;
	border-top: none;
	margin: 122px auto 30px;
	position: relative;
	width: 775px;
}

/* Top header */

h1 {
	background: url(bg/header.png);
	font: normal 2.08em Helvetica, sans-serif;
	height: 100px;
	left: -1px;
	position: absolute;
	text-align: right;
	top: -111px;
	width: 777px;
}

h1 a {
	float: right;
	position: relative;
	text-transform: lowercase;
	width: 170px;
	line-height: 260px;
}

/* Section movie */

#movie {
	margin-bottom: 14px;
}

/* Main document copy */

#copy {
	background: url(bg/sub.png) 0 0 no-repeat;
	float: right;
	min-height: 208px;
	margin-left: -11px;
	padding: 0 20px 20px 21px;
	position: relative;
	width: 540px;
}

.no-subsections #copy {
	background: none;
	width: 510px;
}

.copy-only #copy {
	background: none;
	width: 735px;
}

/* News area */

.news {
	background: url(bg/news-middle.png) 0 0 repeat-y;
	display: block;
	margin-top: 30px;
	width: 516px;
	padding: 0;
}

.news h3 {
	background: url(bg/news-top.png) no-repeat;
	color: #534400;
	font-size: 21px;
	line-height: 1.43em;
	margin: 0;
	padding: 10px 10px 0;
}

.news h4 {
	cursor: pointer;
	float: left;
	margin: 0;
	width: 80%;
}

.news div, .news .press {
	padding: 0 10px;
}

.news div div {
	padding: 0;
}

.news .published {
	cursor: pointer;
	font-size: 0.8em;
	float: right;
	margin: 0 0 5px;
	width: 20%;
}

.news div, .news .press {
	clear: both;
}

.news .summary, .news .read {
	margin: 1em auto;
	width: 90%;
}

.news .read {
	text-align: right;
	text-transform: lowercase;
	width: 90%;
}

.news .press {
	background: url(bg/news-bottom.png) no-repeat 0 100%;
	margin: 0;
	padding: 10px;
}

/* List of sections beneath header */

#sections {
	font: normal 1.17em Helvetica, sans-serif;
	left: 0;
	position: absolute;
	text-transform: lowercase;
	top: -51px;
}

#sections li {
	display: block;
	height: 40px;
	float: left;
	text-align: center;
}

#sections a {
	background: url(bg/sections.png) no-repeat;
	position: relative;
}

#home a {
	background-position: 18px -22px;
	width: 68px;
}

#home a:hover, #home a:focus, #home.current a {
	background-position: 18px 12px;
}

#values a {
	background-position: -50px -22px;
	width: 80px;
}

#values a:hover, #values a:focus, #values.current a {
	background-position: -50px 12px;
}

#brands a {
	background-position: -130px -22px;
	width: 88px;
}

#brands a:hover, #brands a:focus, #brands.current a {
	background-position: -130px 12px;
}

#solutions a {
	background-position: -218px -22px;
	width: 97px;
}

#solutions a:hover, #solutions a:focus, #solutions.current a {
	background-position: -218px 12px;
}

#customers a {
	background-position: -315px -22px;
	width: 107px;
}

#customers a:hover, #customers a:focus, #customers.current a {
	background-position: -315px 12px;
}

#press a {
	background-position: -422px -22px;
	width: 93px;
}

#press a:hover, #press a:focus, #press.current a {
	background-position: -422px 12px;
}

#contact a {
	background-position: -515px -22px;
	width: 76px;
}

#contact a:hover, #contact a:focus, #contact.current a {
	background-position: -515px 12px;
}

/* Content along left side of page */

#sub, #newsletter, #call, #recycle {
	list-style: none;
	margin: 14px 0 14px 20px;
	padding: 0;
	width: auto;
}

/* Subsection list */

.sub {
	color: #534400;
	font-size: 1.08em;
	line-height: 1.6em;
	margin: 22px 11px -18px;
	width: 173px;
}

#sub {
	display: block;
	height: auto;
	margin-left: 11px;
	width: 183px;
}

#sub li {
	display: block;
	height: 23px;
	margin-top: 4px;
}

#sub a {
	background-position: 100% 0;
	position: relative;
	width: 173px;
}

#sub a:hover, #sub a:focus, #sub .current a {
	background-position: 100% 50%;
	width: 183px;
}

#sub .current a {
	background-position: 100% 50% !important;
	width: 183px !important;
}

#brands-charity a { background-image: url(bg/nav/brands_charity.png); }
#buying a { background-image: url(bg/nav/buy.png); }
#connect a { background-image: url(bg/nav/brands_connect.png); }
#enterprise a { background-image: url(bg/nav/brands_enterprise.png); }
#mopay a { background-image: url(bg/nav/brands_mopay.png); }
#brands-solutions a { background-image: url(bg/nav/brands_solutions.png); }
#direct a { background-image: url(bg/nav/contact_directly.png); }
#online a { background-image: url(bg/nav/contact_online.png); }
#where a { background-image: url(bg/nav/contact_where.png); }
#orange a { background-image: url(bg/nav/customers_orange.png); }
#wcrf a { background-image: url(bg/nav/customers_WCRF.png); }
#woolworths a { background-image: url(bg/nav/customers-woolworths.png); }
#accolades a { background-image: url(bg/nav/press_accolades.png); }
#downloads a { background-image: url(bg/nav/press_downloads.png); }
#news a { background-image: url(bg/nav/press_news.png); }
#press-press a { background-image: url(bg/nav/press_press.png); }
#hal a { background-image: url(bg/nav/solutions_hal.png); }
#marketing a { background-image: url(bg/nav/solutions_marketing.png); }
#support a { background-image: url(bg/nav/solutions_support.png); }
#whitelabel a { background-image: url(bg/nav/solutions_whitelabel.png); }
#charity a { background-image: url(bg/nav/values_charity.png); }
#corporate a { background-image: url(bg/nav/values_corporate.png); }
#employees a { background-image: url(bg/nav/values_employees.png); }
#environment a { background-image: url(bg/nav/values_environment.png); }
#weee a { background-image: url(bg/nav/values_WEEE.png); }


/* Newsletter signup form */

#newsletter {
	border: none;
	height: 109px;
	left: 20px;
	margin: 14px 0;
	padding: 0;
	position: relative;
	width: 207px;
}

#newsletter legend {
	margin-bottom: -10em;
}

#newsletter p {
	height: 109px;
	width: 207px;
}

#newsletter label {
	background: url(bg/newsletter.png);
	left: 0;
	position: absolute;
	top: 0;
}

#newsletter input {
	background: url('bg/ok.png');
	border: none;
	content: "";
	cursor: pointer;
	height: 0;
	left: 154px;
	padding: 24px 0 0;
	position: absolute;
	top: 56px;
	width: 40px;
}

#newsletter input.email {
	background: #fff url(bg/input.png) repeat-x !important;
	border: 1px solid #ececd4;
	cursor: text;
	height: 17px;
	left: 15px;
	padding: 2px;
	top: 57px;
	width: 134px;
}

/* Ajax validation */

#newsletter .ajax__validatorcallout {
	margin-left: 40px;
}

.ajax__validatorcallout div, .ajax__validatorcallout_icon_cell, .ajax__validatorcallout_error_message_cell, .ajax__validatorcallout_close_button_cell {
	background: #faffc4 !important;
	font: normal 1em Helvetica, sans-serif !important;
}

/* Best Companies (call to action) */

#call {
	background: url(bg/best-companies.png);
	display: block;
	height: 284px;
	width: 205px;
}

/* Recycle link (call to action) */

#recycle {
	background: url(bg/recycle-sub.png);
	display: block;
	height: 147px;
	margin: 15px 0 15px 11px;
	width: 171px;
}

.no-subsections #recycle {
	background: url(bg/recycle.png);
	height: 176px;
	margin-left: 20px;
	width: 204px;
}

/* Final content on page */

#foot, #numbers, address, #credits {
	clear: both;
	margin: 0.1em 0;
	text-align: center;
}

/* Footer navigation */

#foot {
	background: url(bg/footer.png) no-repeat 0 23px;
	padding: 40px 8px 8px;
	margin: 0 0 1em 205px;
	width: 400px;
}

#foot li {
	background: url(bg/dash.png) no-repeat 100% 50%;
	display: block;
	float: left;
	padding: 0 10px;
	width: auto;
}

#foot .copyright {
	background: none;
	width: auto;
}

/* List of external accreditations */

#credits {
	margin: 0;
	padding: 30px 0 10px 68px;
	height: 60px;
}

#credits li {
	display: block;
	height: 57px;
	float: left;
}

#credits a {
	background: url(bg/logos.png);
}

#iso-14001 a {
	width: 104px;
}

#iso-14001 a:hover, #iso-14001 a:focus {
	background-position: 0 -57px;
}

#iso-9001 a {
	background-position: -97px 0;
	margin-left: 44px;
	width: 106px;
}

#iso-9001 a:hover, #iso-9001 a:focus {
	background-position: -97px -57px;
}

#checkmend a {
	background-position: -203px 0;
	margin-left: 47px;
	width: 123px;
}

#checkmend a:hover, #checkmend a:focus {
	background-position: -203px -57px;
}

#iip a {
	background-position: -326px 0;
	margin-left: 37px;
	width: 79px;
}

#iip a:hover, #iip a:focus {
	background-position: -326px -57px;
}

#stop a {
	background-position: -407px 0;
	margin-left: 37px;
	width: 54px;
}

#stop a:hover, #stop a:focus {
	background-position: -407px -57px;
}

/* Contact pages */

p#buy {
	background: #f6f9d6;
	border: 1px dotted #594900;
	font-weight: bold;
	padding: 5px 8px;
}

#git {
	background: url(bg/git-bg.png) repeat;
	border: none;
	margin: 0 auto;
	padding: 0 0 0 10px;
	width: 524px;
}

#git .first {
	background: url(bg/git-top.png) no-repeat;
	margin: 0 0 0 -10px;
	padding: 40px 10px 0 10px;
}

#git dt.first {
	background: url(bg/direct-top.png) no-repeat;
	padding: 40px 0 5px 25px;
}

#git.buying .first {
	background: url(bg/buy-top.png) no-repeat;
}

#git p {
	clear: both;
	line-height: 1.7em;
	margin: 0.85em 0 0;
	margin-right: 10px;
	min-height: 1.7em;
	width: auto;
}

#git dt {
	padding-left: 15px;
}

#git dd {
	cursor: text;
	margin-left: 0;
	padding-left: 50px;
}

#git legend {
	margin-bottom: -3em;
}

#git label {
	cursor: pointer;
	display: block;
	float: left;
	margin: 0 0 0.9em 0;
	position: relative;
	text-align: right;
	width: 35%;
}

#git label em {
	color: #f6f9d6;
	font-style: normal;
	left: 485px;
	position: absolute;
	top: 0;
	width: 0.5em;
}

#git label em:after, q.required em:before {
	color: #c30;
	content: '*';
	font-weight: bold;
	font-size: 1.2em;
	text-indent: 0;
	visibility: visible;
}

#git label span {
	display: block;
	font-size: 0.85em;
	font-style: italic;
	margin: 0 0 -0.3em 186px;
	text-align: left;
	width: 289px;
}

#git .text label span {
	position: relative;
	margin-top: 6em;
}

#git label span.error {
	color: #c00;
	font-style: normal;
	font-weight: bold;
	line-height: 1.3em;
	margin-top: 0.2em;
}

#git input, #git select, #git textarea {
	background: #fff url(bg/git-input.png) repeat-x;
	border: 1px solid #d9ddb0;
	font: 1em Helvetica, sans-serif !important;
	height: 1.5em;
	float: left;
	margin: -2px 38px 0 7px;
	padding: 0.3em 2px 0;
	width: 55%;
}

#git input:focus, #git select:focus, #git textarea:focus {
	border-color: #96a30d;
}

#git select {
	height: 1.9em;
	margin-top: 0;
	margin-bottom: 0.7em;
	min-width: 56%;
	padding: 1px;
	width: auto;
}

#git .text {
	margin-top: 1.1em;
}

#git textarea {
	height: 8em;
}

#git .checkbox input {
	border: none;
	width: auto;
}

#git .submit, #git .email {
	background: url(bg/git-bottom.png) 0 100% no-repeat;
	margin: 0 0 0 -10px;
	padding: 10px 0 15px 0;
}

#git .email {
	margin-top: -10px;
	padding: 10px 0 15px 60px;
}

#git .submit input {
	background: url('bg/git-submit.png');
	border: none;
	content: "";
	cursor: pointer;
	float: right;
	height: 0;
	margin-right: 48px;
	padding: 26px 0 0;
	width: 61px;
}


/* Special styles for JavaScript animation */

#sub span, #sections span {
	cursor: pointer;
	display: block;
	height: 100%;
	position: absolute;
	top: 0;
}

#sections span {
	background-image: url(bg/sections.png);
	background-repeat: no-repeat;
	width: 100%;
	left: 0;
}

#sub.js a, #sub.js a:hover {
	background-position: 100% 100%;
	width: 173px;
}

#sub.js a:focus {
	width: 183px;
}

.fade {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
}

.after {
	background-position: 100% 50%;
	right: 0;
	width: 100%;
}

.base-mask {
	background: url(bg/mask.png);
	left: 0;
	width: 4px;
}

.mask {
	background: url(bg/mask.png) 0 100%;
	left: 0;
	width: 4px;
}

/* Logos on brands pages */

.logo {
	height: 72px;
}

#shp-charity {
	background: url(bg/brands/charity.png) no-repeat;
}

#shp-connect {
	background: url(bg/brands/connect.png) no-repeat;
}

#shp-enterprise {
	background: url(bg/brands/enterprise.png) no-repeat;
}

#shp-solutions {
	background: url(bg/brands/solutions.png) no-repeat;
}

#mopay-co-uk {
	background: url(bg/brands/mopay.png) no-repeat;
	height: 53px;
}

img.recycle {
	margin: 0 -20px 10px 0 !important;
}

img.brand {
	margin: 1em -20px 1.8em 0 !important;
}

.shots {
	margin: 1.8em 0;
}

.site {
	clear: both;
	font-size: 1.6em;
	margin-bottom: 0;
	padding-top: 0.5em;
	text-align: right;
}

.site a {
	color: #96a30d;
	font-weight: normal;
}

/* Google Map */

div#map {
	border: 1px solid #ccc;
	height: 400px;
	margin-top: 1em;
	width: 500px;
}

#map h3 {
	font-size: 1.4em;
	margin-top: 5px;
}

#map p {
	padding-bottom: 0;
}

/* sIFR styles */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
	padding: 0;
}

.sIFR-replaced, .sIFR-ignore {
	visibility: visible !important;
}

.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

.sIFR-replaced div.sIFR-fixfocus {
	margin: 0pt;
	padding: 0pt;
	overflow: auto;
	letter-spacing: 0px;
	float: none;
}

.sIFR-replaced {
	height: auto !important;
}

.sIFR-active object {
	display: block;
}

.sIFR-active h2, .sIFR-active h3 {
	padding: 0;
}

.sIFR-active .news h3 {
	padding: 10px 10px 0;
}

/* White label section */

.white-label h3 {
	clear: both;
	margin-top: 0;
}

/* Remastered news section */

#latest {
	background: url(bg/news-middle.png) 0 0 repeat-y;
	display: block;
	margin-top: 30px;
	width: 516px;
	padding: 0;
}

#latest h3 {
	background: url(bg/news-top.png) no-repeat;
	color: #534400;
	font-size: 21px;
	margin: 0;
	padding: 10px 10px 0;
}

#latest h4 {
	cursor: pointer;
	margin: 0
}

#latest .press {
	padding: 0 10px;
}

#latest .published {
	cursor: pointer;
	font-size: 0.8em;
	float: right;
	margin: 0 0 5px;
}

#latest div, #latest .press {
	clear: both;
}

#latest .summary, #latest .read {
}

#latest .read {
	text-align: right;
	text-transform: lowercase;
	width: 90%;
}

#latest .press {
	background: url(bg/news-bottom.png) no-repeat 0 100%;
	margin: 0;
	padding: 10px;
	width: 100%;
}

#back {
	margin-top: 2em;
	text-align: right;
	text-transform: lowercase;
}