/********************
	=CSS reset adapted from Eric Meyer 
	http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/ 
********************/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

hr {
	display: none;
}

img {
	display: block;
}




/******************** 
=Colour 
********************

#826e66 = Workwise brown
#67594d = Workwise dark brown 
          * Headings
          * Nav-main current link
#5ccae6 = Workwise blue
          * Nav-main block
          * One-to-one assessments
#cfcf00 = Workwise green
          * Assessor training

#404040 = Body text
#000    = Text on blue or green

#cdc5c2 = Bullet beige and nav-info separator
#e4e1de = Pale beige
#ebe9e7 = Paler beige

#007eb2 = Link blue
#7b6f65 = Nav-sub current link brown

#78b7d0 = Nav-info link paler blue
#aca49d = Nav-info current link lighter brown

*/




/********************
=Core setup 
********************/

html, body {
	background-color: #f6f5f5;
}

body {
	font-family: "Trebuchet MS", Helvetica, Arial, Candara, sans-serif;
	font-size: 62.5%;      /* Sets everything to 10px assuming defaults */
	line-height: 1.3;
	color: #404040;
	background: #f6f5f5 url("../img/body-bg.gif") fixed repeat-x;
}

#container {
	font-size: 100.01%; /* Fix Firefox rounding errors */
	max-width: 95.2em;
	margin: auto;
	background-color: white;
	padding-bottom: 3em;
}


/* Semantic cues for when styles are disabled */
#top dt, 
#top dd, 
#nav-main dt, 
#nav-info dt {
	position: absolute;
	left: -200em;
}




/********************
=Layout (core) 
********************/

#container {
	position: relative; /* Positioning context for #nav-main */
}

#main {
	position: relative; /* Positioning context for #content-sub and #nav-sub */
}


#header {
	margin-left: 17%;
	padding: 223px 33% 28px 0;
}

#content {
	margin-right: 33%;
	margin-left: 17%;
	padding-bottom: 90px;
}

#sidebar {
	position: absolute;
	top: 0;
	left: 70%;
	width: 24%;
}

#nav-info, 
#backup {
	margin-left: 17%;
	width: 77%;
}

/* Back to the top of page */

#backup a {
	display: block;
	height: 50px;
	background: transparent url('../img/backup.gif') 30px 0 no-repeat;
	text-indent: -200em;
	border-bottom: 1px solid white;
}

#backup a:hover {
	background: transparent url('../img/backup.gif') 30px -100px no-repeat;
}





/********************
=Header 
********************/

/* =Home */

#header {
	color: #67594d;
	letter-spacing: -1px;
	font-weight: normal;
	font-size: 35px;
	line-height: 39px;
}

#header span {
	display: block;
}

.home #header {
	background: transparent url('../img/home-h1-bg.jpg') 96% 0 no-repeat;
}

.assessment #header {
	background: transparent url('../img/assessment-h1-bg.jpg') 96% 0 no-repeat;
}

.training #header {
	background: transparent url('../img/training-h1-bg.jpg') 96% 0 no-repeat;
}




/***** =Branding *****/

#branding {
	position: absolute;
	top: 0;
	left: 0;
}

#branding h1, 
#branding h1 a {
	display: block;
	width: 337px;
	height: 205px;
}

#branding h1 {
	text-indent: -200em;
	background: transparent url("../img/workwise-branding.gif") no-repeat;
}

#branding p.tel {
	position: absolute;
	line-height: 1;
	top: 134px;
	left: 162px;
	color: #cdc5c2;
	font-size: 150%;
}

#branding h1 a:hover {
	background-color: transparent;
}


/* Core link styles */

a, a:link {
	text-decoration: none;
	color: #007eb2;
}

a:visited {
	color: #007eb2; /* Change this later */
}

a:hover, 
#nav-info a:hover, 
#nav-info:hover a:hover {
	color: white;
	background-color: #826e66;
}




/********************
=Nav menus 
********************/


/***** =nav-main and nav-sub *****/

#nav-main {
	position: absolute;
	top: 228px;
	left: 1%;
	width: 14%;
	line-height: 1;
}

#nav-main a, 
#nav-sub a {
	display: block;
	color: white;
	font-size: 150%;
	border-top: 1px solid #7dd5eb;
	background-color: #5ccae6;
}

#nav-sub {
	margin-bottom: 1.95em;
}

#nav-sub dt {
	font-size: 160%;
	margin-bottom: 0.5em;
}

#nav-main a em, 
#nav-sub a em {
	display: block;
	padding: 3px 10px;
	font-style: normal; /* To fix IE inheritance */
}

#nav-main li.first-child a, 
#nav-sub li.first-child a {
	border-top: 0;
	background: #5ccae6 url('../img/9px-tl.png') no-repeat;
}

#nav-main li.first-child a em, 
#nav-sub li.first-child a em {
	padding-top: 10px;
	background: transparent url('../img/9px-tr.png') 100% 0 no-repeat;
}

#nav-main li.last-child a, 
#nav-sub li.last-child a {
	background: #5ccae6 url('../img/9px-bl.png') 0 100% no-repeat;
}

#nav-main li.last-child a em, 
#nav-sub li.last-child a em {
	padding-bottom: 10px;
	background: transparent url('../img/9px-br.png') 100% 100% no-repeat;
}

#nav-main a:hover, 
#nav-main li.first-child a:hover, 
#nav-main li.last-child a:hover, 
#nav-sub a:hover, 
#nav-sub li.first-child a:hover, 
#nav-sub li.last-child a:hover {
	background-color: #826e66;
}

#nav-main .current a, 
#nav-main li.current a:hover, 
#nav-sub .current a, 
#nav-sub li.current a:hover {
	cursor: default;
	background-color: #5ccae6;
	color: #67594d;
}


/***** =sidebar and =content-sub *****/

#sidebar dt {
	font-weight: bold;
	color: #67594d;
}

#content-sub dt, 
#content-sub h2 {
	font-size: 123.08%;
}

#content-sub p {
	margin-top: 0.5em;
}

#content-sub li {
	margin-top: 1.5em;
}

#content-sub li.first-child {
	margin-top: 0;
}

#content-sub blockquote {
	margin-left: -7px;
}

#content-sub blockquote p {
	font-size: 115.38%;
	padding-left: 7px;
}

#content-sub blockquote p cite {
	display: block;
	font-size: 80%;
}


/***** =nav-info *****/

#nav-info {
	background: #ebe9e7 url('../img/9px-tl.png') no-repeat;
	font-size: 120%;
}

#nav-info ul {
	width: 100%;
	overflow: hidden;
}

#nav-info #site-sections {
	background: transparent url('../img/9px-tr.png') 100% 0 no-repeat;
	padding: 1.5em 0 0.25em;
}

#nav-info #legal {
	background: transparent url('../img/9px-br.png') 100% 100% no-repeat;
	padding: 0.25em 0 1.5em;
}

#nav-info li {
	float: left;
	border-right: 1px solid #cdc5c2;
}

#nav-info li.first-child {
	margin-left: 0.5em;
}

#nav-info li.last-child {
	border-right: 0;
}

#nav-info a {
	display: block;
	padding: 2px 0.5em;
	color: #78b7d0;
}

#nav-info:hover a {
	color: #007eb2;
}

#nav-info .current a, 
#nav-info .current a:hover, 
#nav-info:hover .current a:hover {
	color: #aca49d;
	cursor: default;
	background-color: transparent;
}

#nav-info dd {
	background: transparent url('../img/9px-bl.png') 0 100% no-repeat;
}



/***** =Typography *****/

#content, 
#content-sub {
	font-size: 130%;
}

#main strong {
	font-weight: bold;
}

#content em {
	font-style: italic;
}

#main h2, 
#main h3, 
#main h4 {
	font-weight: bold;
	color: #67594d;
}

#content h2 {
	font-size: 146.16%;
	margin-top: 1.3em;
	padding-top: 1.3em;
	border-top: 1px solid #cdc5c2;
}

#content h3 {
	font-size: 123.08%;
	margin-top: 1.95em;
}

#content p {
	margin-top: 1.3em;
}

#content p.first-child {
	font-size: 115.38%;
	margin-top: 0;
}

#content li {
	margin-top: 0.5em;
}

#content ul {
	list-style-image: url('../img/li-bullet.gif')
}

#content ul li {
	margin-left: 1.25em;
}

#content ol {
	list-style: decimal;
}

#content ol li {
	margin-left: 1.75em;
}

.uc {
	text-transform: uppercase;
}

.sc /* Small caps */ {
	font-size: 85%;
}

blockquote {
	background: transparent url('../img/blockquote-bg.gif') no-repeat;
}

blockquote p {
	margin-top: 0.5em;
	font-style: italic;
	color: #826e66;
}

blockquote p cite {
	color: #404040;
	font-weight: bold;
	font-style: normal;
}

blockquote .title, 
blockquote .org, 
blockquote .fn {
	display: block;
}

blockquote cite .delimiter {
	display: none;
}

/* =service-list */

#content #service-list li {
	margin-top: 1em;
	list-style: none;
	margin-left: 0;
}

#service-list a {
	display: block;
	padding-left: 178px;
	padding-right: 9px;
}

#service-list h2 {
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}

#service-list p {
	margin-top: 0;
	background: transparent url('../img/9px-br.png') 100% 100% no-repeat;
}

#service-list h2 a {
	color: white;
	padding-top: 6px;
	background: transparent url('../img/9px-tr.png') 100% 0 no-repeat;
}

#service-list p a {
	padding-top: 0.33em;
	color: black;
	padding-bottom: 0.67em;
	background: transparent url('../img/9px-bl.png') 0 100% no-repeat;
	min-height: 5.2em;
}

#risk-assessment {
	background: #5ccae6 url('../img/li-risk-assessment-bg.jpg') no-repeat;
}

#assessor-training {
	background: #cfcf00 url('../img/li-assessor-training-bg.jpg') no-repeat;
}

#assessor-training p a {
	padding-bottom: 2.5em;
}

#service-list h2 a span {
	border-bottom: 1px dotted white;
}

#service-list p a em {
	border-bottom: 1px dotted #808080;
	font-style: normal;
}

#service-list li:hover {
	background-color: #826e66;
}

#service-list li:hover p a {
	color: white;
}

#service-list li:hover p a em {
	border-bottom: 1px dotted white;
}





/******************** 
=Forms (global styles) 
********************/

fieldset {
	width: 100%;
}

#content fieldset ul, 
#content fieldset ol {
	list-style: none;
}

#content fieldset li {
	margin-left: 0;
}

input.text, 
textarea, 
select {
  font-size: 10pt;
  color: #404040;
	font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
  vertical-align: middle;
  background-color: #f6f5f5;
}

input.text, 
textarea {
  padding: 3px;
}

input.text:focus, 
textarea:focus {
  border: 2px solid #cfcf00;
  background-color: white;
  color: #404040;
}

input.submit {
  font-weight: bold;
	color: #007eb2;
  padding: 3px;
}

input.submit:hover {
  cursor: pointer;
  color: black;
}


/* Error reporting */

.invalid {
  font-weight: bold;
  color: #f00;
  margin-bottom: 1em;
}

#contact .error {
	color: #f00;
	display: block;
}

#contact .no-error {
	display: none;
}

/* Confirmation message */

#confirmation {
	background-color: #ebe9e7;
	padding: 12px;
}




/***** =Contact *****/

/* vCard/hCard */

#content-sub dd {
	margin-top: 0.5em;
}

#content-sub .delimiter {
	display: none;
}

#content-sub .street-address-1, 
#content-sub .street-address-2, 
#content-sub .locality, 
#content-sub .region, 
#content-sub .postal-code, 
#content-sub .country-name {
	white-space: nowrap;
}

#content-sub .adr .delimiter {
	display: inline;
}

#content-sub .adr {
	display: block;
}

#content-sub .org {
	font-weight: bold;
}

/* Enquiry form */

#contact {
	margin-top: 1em;
}

#contact legend span {
	position: absolute;
	top: 0;
	left: -200em;
}

#contact li {
	margin-bottom: 1em;
}

#contact label {
	display: block;
	font-weight: bold;
  color: #7b6f65;
}

#contact label input, 
#contact label textarea, 
#contact label select, 
#contact #optin-subscribe {
  font-weight: normal;
  color: #404040;
}

#contact li.required label {
  color: #404040;
}

#contact label span {
  display: block;
  font-weight: normal;
	color: #aca49d;
}

#contact li.required span.required {
	display: inline;
	margin-left: 0.3em;
}


/* Layout */

#contact .half {
	width: 50%;
}

#contact input.text, 
#contact textarea {
	display: block;
	width: 96%;
}




/******************** 
=sIFR [http://wiki.novemberborn.net/sifr/] 
********************/

/***** These are standard sIFR styles... do not modify *****/

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

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

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

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */

.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

/* sIFR is best used only for the internal pages (class="sub") due to limitations with transparent backgrounds over the home header image. */

.sIFR-hasFlash .sub #header h1 {
	visibility: hidden;
	font-size: 42px;
}