/* #########################################
   #    Consider Creative Limited, 2005    #
   # W3C - CSS Level 2, CSS2 Specification #
   #   http://jigsaw.w3.org/css-validator  #
   ######################################### */


/***************************************************
Website colours:
	Purple: #511782;
	V.DarkGrey: #333333;
	Dark grey: #666666;
	Mid grey: #999999;
	Light grey: #e8e8e8;
	Red (Individual): #cc0033;
	Pale red: #ffdddd;
	Green (Advisor): #99cc00;
	Pale green: #c3e169; /txt #e5f2bf;
	Blue (Employer): #6699cc;
	Page blue: #a5c3e1 /txt #d5e4f4;
	
***************************************************/

/***************************************************
				Generics
***************************************************/
body {
	width: 740px;
	margin-left: auto;
	margin-bottom: 0px;
	margin-right: auto;
	margin-top: 0px;
	font-size: 62%;
	font-family: verdana,arial,helvetica,sans-serif;
	font-weight: normal;
}
body.printcontent {
	width: 375px;
	margin: 20px;
}
img {
	border: 0px;
	margin: 0px;
	padding: 0px;
}
/***************************************************
				Header
***************************************************/
#header {
	position: relative;
	width: 740px;
	height: 105px;
	margin: 0px;
	padding: 0px;
	/*border: 1px solid #e8e8e8;*/
}
#header .cfalogo {
	position: relative;
	float: left;
	margin: 5px 0px 0px 20px;
}
#header .applogo {
	position: relative;
	float: right;
	margin: 15px 20px 0px 0px;
}
/***************************************************
				Homepage
***************************************************/
#flash {
	position: relative;
	width: 740px;
	height: 203px;
	margin: 0px 0px 10px 0px;
	padding: 0px;
	/*border: 0px solid #e8e8e8;*/
}
#introtxt {
	position: relative;
	float: left;
	width: 355px;
	height: 180px;
	margin: 0px 10px 0px 10px;
	/*border: 1px solid #e8e8e8;*/
	
}
#introtxt h2 {
	margin: 0px;
	padding: 0px;
	font-size: 110%;
	color: #511782;
}
#introtxt p {
	margin: 0px 20px 10px 0px;
	color: #999999;
}
#introtxt p strong {
	color: #511782;
}
#buttonad {
	position: relative;
	float: right;
	width: 160px;
	height: 180px;
	margin: 0px 0px 0px 0px;
	/*border: 1px solid #e8e8e8;*/
}


/***************************************************
				Navigation
***************************************************/
#navigation {
	position: relative;
	float: left;
	width: 200px;
	margin: 0px 15px 0px 0px;
	text-align: center;
	/*border: 1px solid #e8e8e8;*/
}
#navigation img {
	margin: 0px 0px 4px 0px;
	padding: 0px;
}
/* top image & background colours */
#navigation .individual {
	background: url(../images/common/individual_on_top.gif) top left no-repeat;
  	background-color: #cc0033;
  	margin: 0px 0px 4px 0px;
  	padding: 40px 0px 0px 0px;
}
#navigation .adviser {
	background: url(../images/common/adviser_on_top.gif) top left no-repeat;
	background-color: #99cc00;
  	margin: 0px 0px 4px 0px;
  	padding: 40px 0px 0px 0px;
}
#navigation .employer {
	background: url(../images/common/employer_on_top.gif) top left no-repeat;
	background-color: #6699cc;
  	margin: 0px 0px 4px 0px;
  	padding: 40px 0px 0px 0px;
}
/* styles for nav items within table */
#navigation .individual table, #navigation .adviser table, #navigation .employer table {
	position: relative;
	/*border: 1px dotted #ffffff;*/
	width: 175px;
	margin-left: 12px;
}
/* pale colours:
	Pale red: #e68099 /txt #ffdddd;
	Pale green: #c3e169; /txt #e5f2bf;
	Page blue: #a5c3e1 /txt #d5e4f4;
*/
#navigation .individual table td {
	height: 20px;
	border-top: 1px solid #e68099;
	color: #ffffff;
	text-align: left;
}
#navigation .adviser table td {
	height: 20px;
	border-top: 1px solid #c3e169;
	color: #ffffff;
	text-align: left;
}
#navigation .employer table td {
	height: 20px;
	border-top: 1px solid #a5c3e1;
	color: #ffffff;
	text-align: left;
}
#navigation table td .arrow {
	position: relative;
	float: right;
	margin-top: 3px;
}
#navigation .individual table td.bottom {
	border-bottom: 1px solid #e68099;
}
#navigation .adviser table td.bottom {
	border-bottom: 1px solid #c3e169;
}
#navigation .employer table td.bottom {
	border-bottom: 1px solid #a5c3e1;
}
#navigation .individual a, #navigation .individual a:hover {
	position: relative;
	float: left;
	color: #ffffff;
}
#navigation .adviser a, #navigation .adviser a:hover {
	position: relative;
	float: left;
	color: #ffffff;
}
#navigation .employer a, #navigation .employer a:hover {
	position: relative;
	float: left;
	color: #ffffff;
}
#navigation a {
	text-decoration: none;
}
#navigation a:hover {
	text-decoration: underline;
}
#navigation img.navbottom {
	vertical-align: bottom;
	margin: 0px;
}
#subnav {
	position: relative;
	float: left;
	width: 200px;
	background-color: #e8e8e8;
	text-align: left;
}
#subnav ol {
	margin: 0px 0px 100px 0px;
	padding: 0px 15px 4px 15px;
}
#subnav ol li {
	list-style: none;
	margin: 0px 0px 0px 0px;
	border: 0px;
	padding: 0px 0px 2px 0px;
	color: #666666;
}
#subnav ol li a {
 	text-decoration: none;
 	color: #666666;
}
#subnav ol li a:hover {
	text-decoration: underline;
	color: #666666;
}
#footer {	
	margin: 20px 0px 0px 0px;
	color: #999999;
	text-align: center;
}
#footer img.bottom {
	vertical-align: bottom;
}

/***************************************************
				Content
***************************************************/
#content, #content14, #content15, #content16 {
	position: relative;
	float: left;
	width: 350px;
	margin: 0px 15px 0px 0px;
	border: 0px;
	/*border: 1px solid #e8e8e8;*/
}
#content h2, #content14 h2, #content15 h2, #content16 h2 {
	margin: 0px 0px 10px 0px;
	padding: 0px;
	font-size: 160%;
}
#content h3, #content14 h3, #content15 h3, #content16 h3 {
	margin: 0px 0px 10px 0px;
	padding: 0px;
	font-size: 120%;
}
#content p, #content14 p, #content15 p, #content16 p {
	color: #999999;
	margin: 0px 15px 10px 0px;
}
#content a, #content14 a, #content15 a, #content16 a {
	text-decoration: none;
	color: #666666;
}
#content a:hover, #content14 a:hover, #content15 a:hover, #content16 a:hover {
	text-decoration: underline;
	color: #666666;
}
#content p strong, #content14 p strong, #content15 p strong, #content16 p strong, p.intro {
	color: #333333;
	/* color: #511782; */
	font-size: 110%;
}
#content ul li, #content14 ul li, #content15 ul li, #content16 ul li {
	color: #999999;
	margin: 0px 0px 0px 0px;
}
#content ol li, #content14 ol li, #content15 ol li, #content16 ol li {
	color: #999999;
	margin: 0px 0px 0px 0px;
}
/* generic */
#content h2, #content h3, #content h4, #content .label {
	color: #511782;
}
/* individuals */
#content14 h2, #content14 h3, #content14 h4, #content14 .label, #content14 p strong {
	color: #cc0033;
}
/* advisers */
#content15 h2, #content15 h3, #content15 h4, #content15 .label, #content15 p strong {
	color: #99cc00;
}
/* employers */
#content16 h2, #content16 h3, #content16 h4, #content16 .label, #content16 p strong {
	color: #6699cc;
}
#content14 p.intro strong, #content15 p.intro strong, #content16 p.intro strong{
	color: #333333;
}
.label {
	font-weight: bold;
}
/***************************************************
				Lists
***************************************************/
/* styles for back and forward */
p.backforward {
	min-height: 10px;
	width: 330px;
	text-align: center;
	margin-bottom: 10px;
}
p.backforward .list {
	position: relative;
	float: left;
}
p.backforward .back {
	position: relative;
	float: left;
}
p.backforward .next {
	position: relative;
	float: right;
}

/* styles for boxes in list */
.itemdark {
	margin-bottom: 10px;
	background: #ebebeb;
}
.listitemdark {
	margin: 0px 0px 0px 0px;
	border: 0px;
	padding: 0px 10px 0px 10px;
	color: #999999;
	background: #ebebeb;
}
.listitemlight {
	margin: 0px 0px 0px 0px;
	padding: 0px 10px 0px 10px;
	color: #999999;
	background: #f4f4f4;
}
.listitemdark .image, .listitemlight .image {
	position: relative;
	float: left;
}
.listitemdark .text, .listitemlight .text {
	position: relative;
	float: right;
}
.itemlight {
	margin-bottom: 10px;
	background: #f4f4f4;
}
.listitemdark h3, .listitemlight h3 {
	font-size: 120%;
	margin: 0px 0px 10px 0px;
	padding: 0px;
}
p.readmore {
	/*border: 1px dotted #ff6600;*/
	/*width: 310px;*/
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	text-align: right;
}
p.readmore img {
	margin: 0px 0px 0px 10px;
	vertical-align: middle;
}
p.links a {
	text-decoration: none;
	color: #333333;
}
p.links a:hover {
	text-decoration: underline;
	color: #333333;
}
a.readmore {
	text-decoration: none;
	color: #333333;
	font-weight: bold;
}
a.readmore:hover {
	text-decoration: underline;
	color: #333333;
	font-weight: bold;
}

.listitemdark img.people, .listitemlight img.people {
	width: 120px;
	height: 120px;
	margin: 0px 10px 0px 0px;
}
.listitemdark p.topmargin, .listitemlight p.topmargin {
	margin: 10px 0px 0px 0px;
	padding: 0px;
}
img.top {
	margin: 0px 0px 0px 0px;
	padding: 0px;
}
img.bottom {
	vertical-align: bottom;
	margin: 0px 0px 0px 0px;
	padding: 0px;
}
img.acrobat {
	vertical-align: bottom;
	margin: 0px 0px 0px 0px;
}
.alignleft {
	float: left;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
}
/***************************************************
				Lists
***************************************************/
#dropdown14 {
	width: 248px;
	height: 30px;
	margin: 0px 0px 10px 0px;
	background: url(../images/common/individual_drop.gif) top left no-repeat;
	padding: 12px 0px 5px 100px;
}
#dropdown15 {
	width: 248px;
	height: 30px;
	margin: 0px 0px 10px 0px;
	background: url(../images/common/adviser_drop.gif) top left no-repeat;
	padding: 12px 0px 5px 100px;
}
#dropdown16 {
	width: 248px;
	height: 30px;
	margin: 0px 0px 10px 0px;
	background: url(../images/common/employer_drop.gif) top left no-repeat;
	padding: 12px 0px 5px 100px;
}
#dropdown14 form, #dropdown15 form, #dropdown16 form {
	margin: 0px;
	padding: 0px;
}
#dropdown14 select, #dropdown15 select, #dropdown16 select {
	height: 15px;
	width: 200px;
	font-size: 92%;
	margin: 0px;
	border: 1px solid #ffffff;
	padding: 0px;
}
#dropdown14 .submit, #dropdown15 .submit, #dropdown16 .submit {
	vertical-align: bottom;
	margin: 0px 0px 0px 0px;
	padding: 0px;
}
/***************************************************
				Career planner
***************************************************/
#careerplanner ol {
	margin: 0px 0px 0px 22px;
	padding: 0px 0px 0px 0px;
}
#careerplanner select, #careerplanner #qualification_inactive select, #careerplanner #qualification select, #careerplanner #qualification_complete select {
	height: 15px;
	width: 200px;
	font-size: 100%;
	margin: 0px;
	border: 1px solid #ffffff;
	padding: 0px;
}
/* now get backgrounds for the select */
#careerplanner #jobrolelevel {
	width: 251px;
	height: 36px;
	background: url(../images/common/step_one_active.gif) top left no-repeat;
	padding: 40px 0px 0px 95px;
}
#careerplanner #jobrolelevel_complete {
	width: 251px;
	height: 36px;
	background: url(../images/common/step_one_complete.gif) top left no-repeat;
	padding: 40px 0px 0px 95px;
}
#careerplanner #qualification_inactive {
	width: 330px;
	height: 36px;
	background: url(../images/common/step_two_inactive.gif) top left no-repeat;
	padding: 40px 0px 0px 20px;
}
#careerplanner #qualification {
	width: 330px;
	height: 36px;
	background: url(../images/common/step_two_active.gif) top left no-repeat;
	padding: 40px 0px 0px 20px;
}
#careerplanner #qualification_complete {
	width: 330px;
	height: 36px;
	background: url(../images/common/step_two_complete.gif) top left no-repeat;
	padding: 40px 0px 0px 20px;
}
#careerplanner #learningoption_inactive {
	width: 251px;
	height: 36px;
	background: url(../images/common/step_three_inactive.gif) top left no-repeat;
	padding: 40px 0px 0px 95px;
}
#careerplanner #learningoption {
	width: 251px;
	height: 36px;
	background: url(../images/common/step_three_active.gif) top left no-repeat;
	padding: 40px 0px 0px 95px;
}

#careerplanner #results {
	width: 321px;
	height: 234px;
	background: url(../images/common/careerp_bkg.gif) top left no-repeat;
	padding: 10px 10px 10px 10px;
}
#careerplanner #results ul {
	margin: 20px 0px 35px 42px;
}
#careerplanner #results ul li {
	list-style-type: none;
	margin: 0px 0px 25px 5px;
	padding: 0px 0px 0px 0px;
	color: #333333;
	font-weight: bold;
}
#careerplanner #results h3 {
	margin: 10px 0px 5px 10px;
}
#careerplanner #results ol {
	margin: 5px 0px 0px 30px;
}
#careerplanner #results ol li {
	list-style-type: disc;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	color: #999999;
	font-weight: normal;
}
#careerplanner img.startagain {
	margin: 0px 0px 0px 20px;
}
/***************************************************
				Real people
***************************************************/
#realpeopledetail {
	width: 330px;
	height: 100px;
	margin: 0px 0px 10px 0px;
}
#realpeopledetail img {
	margin: 0px 10px 0px 0px;
}
#realpeopledetail .bottom {
	margin: 25px 0px 0px 0px;
	text-align: left;
}
/***************************************************
				Job profiles
***************************************************/
#profilepanel {
	width: 350px;
	height: 100px;
	margin: 0px 0px 15px 0px;
	/*border: 1px dotted #cccccc;*/
	padding: 0px 0px 0px 0px;

}
#profiledetails {
	position: relative;
	float: left;
	width: 165px;
	min-height: 170px;
	margin: 0px 10px 5px 0px;
	/*border: 1px dotted #cccccc;*/
	padding: 0px 0px 0px 0px;

}
#profiledetails .bottom {
	margin: 70px 0px 0px 0px;
	text-align: left;
}
#profiledetails .bottom img {
	margin: 0px 0px 0px 0px;
	text-align: left;
}
#anchorpoints {
	position: relative;
	float: right;
	width: 173px;
	min-height: 165px;
	margin: 0px 0px 10px 0px;
	/*border: 1px dotted #cccccc;*/
	padding: 0px 0px 0px 0px;
	background-color: #e8e8e8;
}
#anchorpoints table {
	width: 153px;
	background-color: #e8e8e8;
	margin: 0px 10px 0px 10px;
}
#anchorpoints table td {
	height: 15px;
	margin: 0px 0px 0px 0px;
	border-bottom: 1px solid #ffffff;
	padding: 3px 0px 3px 0px;
	background-color: #e8e8e8;
	text-align: left;
}
#anchorpoints table td.bottom {
	border-bottom: 0px;
}
#anchorpoints table td a {
	text-decoration: none;
	font-weight: bold;
}
#anchorpoints table td a:hover {
	text-decoration: underline;
	font-weight: bold;
}
#content14 #anchorpoints table td a, #content14 #anchorpoints table td a:hover {
	color: #cc0033;
}
#content15 #anchorpoints table td a, #content15 #anchorpoints table td a:hover {
	color: #99cc00;
}
#content16 #anchorpoints table td a, #content16 #anchorpoints table td a:hover {
	color: #6699cc;
}
#anchorpoints img.bottom {
	vertical-align: bottom;
}
/***************************************************
				Contact form
***************************************************/
form.contact {
	margin: 10px 0px 15px 0px;
	width: 340px;
	/*border: 1px dotted #e8e8e8;*/
}
body.printcontent form.contact {
	width: 360px;
}
form.contact label {
	display: block;
	width: 110px;
	float: left;
	margin-bottom: 10px;
	font-weight: normal;
	font-size: 100%;
	/*border: 1px dotted #e8e8e8;*/
}
body.printcontent form.contact label {
	width: 130px;
}
form.contact input, select {
	position: relative;
	width: 200px;
	margin: 0px 0px 10px 0px;
	border: 1px solid #3c2e25;
	background-color: #e5e5e5; 
	font-family:verdana,arial,helvetica,sans-serif;
	font-weight: normal;
	font-size: 100%;
	/*border: 1px dotted #e8e8e8;*/
}
form.contact textarea {
	position: relative;
	width: 200px;
	/*height: 20px;*/
	margin: 0px 0px 10px 0px;
	border: 1px solid #3c2e25;
	background-color: #e5e5e5; 
	font-family:verdana,arial,helvetica,sans-serif;
	font-weight: normal;
	font-size: 96%;
	/*border: 1px dotted #e8e8e8;*/
}
form.contact .submit {
	width: 79px;
	height: 20px;
	border: 0px;
	background-color: #ffffff; 
}


/***************************************************
				Sidepanel
***************************************************/
#printbar {
	width: 350px;
	height: 30px;
	margin: 0px 0px 0px 0px;
	border-top: 1px solid #e8e8e8;
	padding: 10px 0px 20px 0px;
}
#printbar .print, #printbar .email {
	position: relative;
	float: left;
	margin: 0px 5px 0px 0px;
}
#printbar .top, #printbar .back {
	position: relative;
	float: right;
	margin: 0px 0px 0px 5px;
}

/***************************************************
				Sidepanel
***************************************************/
#sidepanel {
	position: relative;
	float: right;
	width: 160px;
	margin: 0px 0px 0px 0px;
	/*border: 1px solid #e8e8e8;*/
}
#sidepanel #jobprofiles img {
	margin-top: 10px;
}
#sidepanel #jobprofiles ul {
	margin: 0px 0px 0px 0px;
	padding: 10px 10px 0px 10px;
}
#sidepanel #jobprofiles li {
	list-style: none;
	margin: 0px 0px 10px 0px;
	color: #999999;
	
}
#sidepanel #jobprofiles li h4 {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	font-size: 100%;
	color: #333333;
}
#sidepanel #jobprofiles li .date {
	color: #333333;
}
#sidepanel #jobprofiles li a {
	color: #999999;
	text-decoration: none;
}
#sidepanel #jobprofiles li h4 a {
	color: #333333;
	text-decoration: none;
}
#sidepanel #jobprofiles li a:hover {
	color: #999999;
	text-decoration: underline;
}
#sidepanel #jobprofiles li h4 a:hover {
	color: #333333;
	text-decoration: underline;
}