/*
-----------------------------------------------
Viktor Web Studios
Site: Outcomes4u
Author:   Hans Styrnell
Version:  21 April 2006
----------------------------------------------- */

/*--- global ---*/ 
* {
	padding:0; 
	margin:0;
	}
		 
html, body, form, fieldset, h1, h2, h3, h4, h5, h6, p, pre, blockquote, label, ul, ol, dl, address, li, dd  {
	margin:0; 
	padding:0;
	}
		 
ul, li {
	list-style-type: none;
	}

a img {
	border: 0;
	}
em {
	font-style: normal;
	text-decoration:underline;
	}
#home #content em {text-decoration: none; font-weight: bold;}	
				
html, body {
	font-family:Verdana, Arial, Helvetica, sans-serif;
		text-align: center; 
 		color: #444;
		}
				 
body {
		background: #7593b1;
		font-size: x-small;/*for IE5/Win */
		voice-family: "\"}\"";
		voice-family: inherit;
		font-size: small; /* for compliant browsers */}
		
html>body {/* be nice to opera */
		font-size: small;
		}
		
/*--- main page elements---*/ 
#wrap {
		position: relative;
		margin: 0 auto 0 auto;
		padding: 0;
		text-align: left; 
		width:743px;
		overflow: auto; 
		height: 1%;
		border: 1px solid #ccc;
		background: #fff url(../i/bkg.jpg) repeat-y top left;
		}
		
#masthead { 
		margin: 0;
		padding: 0;
		width: 743px;
		height: 213px;
		background: #fff url(../i/masthead.jpg) repeat-y top left;
		}
		
#printlogo {
	display: none;
	}
			
#content { 
		clear: left; 
		float: left; 
		width: 425px; 
		margin: 10px 0 0 0; 
		padding: 0 0 30px 46px;
		}
		
#content p {
		text-align:justify; 
		margin-bottom: 0.5em;
		}
	
	
/*--- font-family 
-----------------------------------------*/ 	
h1, h2, h3, h4, legend, .mail ul li {
		font-family:Verdana, Arial, Helvetica, sans-serif;
		font-weight: bold;}
#menuright ul li a { 
		font-family:Verdana, Arial, Helvetica, sans-serif;
		}	
		
/*--- color 
------------------------------------------*/ 	
h2, h3, h4, legend, .mail ul li, .clients li a:hover, #sitemap li, h3#blue, strong {	
		color:#005;
		}
		
h3#green {
		color: #008d50;
		}
		
h3#red {
		color:#c00;
		}
		
p, a, label, .clients li a, .clients li, .address, .mail, .contact, #menuright ul li a, ol.let_list li, #sitemap li, .mail ul li a {
		color: #006;
		}
			
#top_nav a {
		color:#006699;
		}	
	
/*--- font-size 
--------------------------------------------*/ 	
h2, h3, h4, h5 {
		font-size: 75%;
		}

p, #bluehead, #greenhead, #redhead, #menuright ul li a, .clients, ol.let_list li, .address, legend,.mail {
		font-size: 75%;
		}

/*--- headings ---*/ 
#companyname {
	position: relative; 
	left: -1999px;
	}
#companyname a:hover { text-decoration:none;}

h1 a {	
	position: absolute;
	top: 40px;
	left: 31px;
	width: 350px;
	height:70px;
	}

h1 a:link, h1 a:visited {
	border-bottom: none;
	text-decoration:none;	
	}
h1 a:hover {}
h2 {
		margin: 1.1em 0 1.5em 0;
		padding: 0.4em 0 1.6em 1em;
		font-size: 80%;
		color:#fff;}
h2#green_long {
		background: url(../i/g_header_long.gif) no-repeat top left;}
h2#red_long {
		background: url(../i/r_header_long.gif) no-repeat top left;}
h2#blue_long {
		background: url(../i/b_header_long.gif) no-repeat top left;}	  	  
h2.blank {
		background: url(../i/blank_header_2.gif) no-repeat top left;
		color:#fff}	
h3 {
		margin: 1.6em 0 0.2em 0;}
h4#first {
		padding-top: 10px;}
	
p {	
		line-height: 1.4em;
		padding: 0 0 0.7em 0;}
p a:hover {
		color: #000; 
		text-decoration: underline;}
a { 
		text-decoration: none;}
a:hover {  
		text-decoration: underline;}	
li {
		list-style-type: none;}

/*--- navigation ---*/
#top_nav {
		margin: 0; 
		padding: 155px 0 0 48px; 
		list-style-type: none; }
#top_nav li {
		float: left; 
		margin: 0 13px 0 0; 
		padding: 0;
		font-size: 12px;
		font-family:Arial, Helvetica, sans-serif;}
#top_nav a {
		float: left; 
		display: block; 
		margin: 0 12px 0 0; 
		text-decoration: none; 
		font-weight: bold;
		letter-spacing: 0.150em;}
#top_nav a:hover { 
		padding-bottom: 3px; 
		color: #008d50; 
		border-bottom: 4px solid #008d50;}
body#home #home_tab a, body#clients #clients_tab a, body#services #services_tab a, body#contact #contact_tab a {
		padding-bottom: 3px;
		color:#369; 
		border-bottom: 4px solid #369;}

/*--- right menu ---*/	
#menuright { 
		float: right; 
		margin: 23px 12px 0 0;
		width: 200px; 
		display: inline;}
#menuright ul { 
		margin: 0; 
		padding: 0 10px 20px 0; 
		list-style: none;}
#menuright ul li { 
		margin: 0; 
		padding: 0 0 0.1em 0;
		line-height: 1.4em;} 
#menuright ul li a {
		padding-left: 14px;}

#menuright ul li a:hover#psychotest_tab, #menuright ul li a:hover#teamdev_tab, body#teamdev #teamdev_tab, body#psychotest #psychotest_tab {
		background: url(../i/red_dot.gif) no-repeat 0 0;
		text-decoration: none;}
	
#menuright ul li a:hover#strategic_tab, #menuright ul li a:hover#busana_tab, #menuright ul li a:hover#trainingneeds_tab, body#busana #busana_tab, body#strategic #strategic_tab, body#trainingneeds #trainingneeds_tab {
		background: url(../i/blue.gif) no-repeat 0 0;
		text-decoration: none;}

#menuright ul li a:hover, body#workshops #workshops_tab, body#management #management_tab, body#nvq #nvq_tab, body#nvq_admin #nvq_admin_tab, body#nvq_customer #nvq_customer_tab, body#nvq_learning #nvq_learning_tab, body#nvq_management #nvq_management_tab, body#nvq_assessor #nvq_assessor_tab, body#nvq_verifier #nvq_verifier_tab { 
		background: url(../i/green.gif) no-repeat 0 0;
		text-decoration: none;}

#bluehead { 
		margin: 0; 
		padding: 0 8px 0 10px; 
		color: #fff;
		height: 3em;
		line-height: 2.2em;
		background: url(../i/blue_h.gif) no-repeat top left;}
#greenhead { 
		margin: 0; 
		padding: 0 8px 0 10px;
		color: #fff;
		height: 3em;
		line-height: 2.2em;
		background: url(../i/learning.gif) no-repeat top left;}
#greenhead_2 { 
		margin: 0; 
		padding: 0 8px 0 10px;
		color: #fff;
		height: 3em;
		line-height: 2.2em;
		background: url(../i/nvq.gif) no-repeat top left;}
#redhead { 
		margin: 0; 
		padding: 0 8px 0 10px; 
		color: #fff;
		height: 3em;
		line-height: 2.2em;
		background: url(../i/red_h.gif) no-repeat top left;}

#menuright img { 
		padding: 80px 0 0 5px;}	

/*--- footer ---*/ 
#footer_nav {
		float: left; 
		margin: 0; 
		padding: 35px 40px 0.4em 40px; 
		width: 662px; 
		height: 16px;
		color: #999; 
		background: #6699CC url(../i/footer.jpg) no-repeat top left;}
#footer_nav li { 
		float: left;
		margin: 0; 
		padding: 0 5px 0 5px; 
		border-right: 1px solid #999;
		color: #999;
		line-height: 1.1em;
		font-size: 9px;} 
#footer_nav a {
		color: #999;}
#footer_nav a.email {
		padding-left: 20px;
		color: #999;
		background: url(../i/email.gif) no-repeat 0 40%;} 
#footer_nav li#topofpage {
		float: right; 
		border-right: none;}
#footer_nav li#topofpage a#up {
		padding-left: 20px; 
		background: url(../i/uag.gif) no-repeat 0 40%;}

.clients {
		margin: 8px 0 12px 0;
		padding: 0;	
		line-height: 2em;}
.clients li {
		padding-left: 20px; 
		list-style: none; 
		background: url(../i/blue.gif) no-repeat 0% 5px;}
.clients li a {
		text-decoration: none;}
		
.clients li.link_g {
		padding-left: 20px;
		line-height: 2em;
		background: url(../i/link_g.gif) no-repeat 0% 5px;}
.clients li.link_g a {
		color: #006;}
			
.clients li.link_r {
		padding-left: 20px;
		line-height: 2em;
		background: url(../i/link_r.gif) no-repeat 0% 5px;}
.clients li.link_r a{
		color: #006;}
.clients li.link_r li{
		padding-left: 20px;
		background: url(../i/red_dot.gif) no-repeat 0% 3px; 
		color:#006;}					

.clients li.link_b {
		padding-left: 20px;
		line-height: 2em;		
		background: url(../i/link_b.gif) no-repeat 0% 5px;}
.clients li.link_b a{
		color: #006;}
.clients li.link_b li {
		padding-left: 20px;
		background: url(../i/blue.gif) no-repeat 0% 4px; 
		color: #006;}
		
.clients li a:hover {
		text-decoration: underline;}
.clients li ol li { 	
		margin-left: 5px;
		padding-left: 20px; 
		list-style: none; 
		background: url(../i/green.gif) no-repeat 0% 3px;}			

ol.let_list {
		margin: 8px 0 12px 0;
		padding: 0;	
		line-height: 1.8em;}
ol.let_list li {
		margin: 0 0 8px 20px;
		padding-left: 10px;
		line-height: 1.4em;
		list-style:decimal;}	

/*--- site map ---*/
ul#sitemap { 
		margin: 20px 0 20px 5px;	
		font-size: 80%;}
ul#sitemap li { 
		font-weight: bold;}	
#sitemap li ul {
		margin: 0 0 10px 5px; 
		padding: 5px 0 10px 10px;	
		font-weight: normal;}
#sitemap li ul li {
		margin: 10px 0 0 10px;
		list-style-type:square;
		font-weight: normal;}
#sitemap li ul li ul {
		margin: 0 0 0 15px;
		padding: 5px 0 0 0;}	
#sitemap li ul li ul li {
		margin: 8px 0 0 0;
		list-style-type: circle;}

/*--- contact page ---*/
ul.address { 
		margin: 0 0 20px 0;
		list-style-type: none;}
ul.address li { 
		line-height: 1.5em;}

ul.mail {	
		float: left;
		margin: 0 20px 15px 0;
		padding: 0;
		display: inline;}
ul.mail li { 
		line-height: 1.5em;
		list-style-type: none;}

#contact_form {
		margin: 20px 0 20px 0; 
		padding: 0;}
fieldset { 
		clear: left; 
		margin: 10px 0 0 0; 
 		padding: 20px 0 20px 20px; 
		width: 400px;
		border: #d5d5d5 solid 1px;}
legend { 
		margin: 0;
		padding: 5px 10px 5px 10px; 
		border: #ccc solid 1px; 	
		font-weight: bold; 
		letter-spacing: 0.100em;
		background-color: #527aa2;
		color:#fff;}
form p { 
		margin-bottom: 20px; 
		padding-top: 10px;}
form dl { 
		margin-top: 20px;}	
form dd { 
		margin: 0 0 10px 0; 
		text-align: left; 
		font-size: 80%; }
form dt {
		float: left; 
		width: 75px; 
		text-align: right;}
label {
		font-size: 80%;}
.inputfield { 
		margin-left: 10px; 
		background: #eee;}
#button {
		margin: 5px 0 0 10px;
		padding: 0;
		background: #eee; 
		border: 2px #ccc outset; 
		font-size: 100%; 
		font-weight: bold;
		color: #49878a;}
		
/*--- make short page browser window high ---*/
#nvq_admin #menuright ul, #nvq_customer #menuright ul, #nvq_learning #menuright ul, #nvq_assessor #menuright ul, #nvq_verifier #menuright ul {
		margin-bottom: 250px;}

.clr { 
		clear: both;}

/* style switcher font-size
================================================*/

#styles {
	position: relative;
	float: right;
	margin-right: 30px;
	margin-top: 23px;
	display: inline;
	}

#styles li {
	float: left; 
	list-style-type: none;
	}

#styles li a {
	padding: 2px 6px;
	display: block;
	border: 1px solid #fff;
	color: #fff;
	text-decoration: none;
	}

#styles li a:hover {
	background-color:#fff;
	color: #369;
	}

#smaller { 
	font-size: 9px; 
	font-weight: 600;
	}

#larger {
	font-size: 15px; 
	font-weight:600;
	}
							
#styles li a#largea {
	margin-left: 2px;
	}
#styles li a#smalla {
	margin-top: 6px;
	}