/*
Title:			ETD Training
Description:	Blue Version
Author:			Visualcode Limited
Date: 			Thursday 25th October 2007.
Version:		1.0
*/


body {
	font:12px/18px "Lucida Grande", Geneva, Verdana, Tahoma, Arial, sans-serif;
	color:#333;
	margin:0;
	padding:0;
	background:#455560 url(../../images/blue/bodyBackground.png) repeat;
	}

input, 
button, 
select, 
textarea {
	font:12px/18px "Lucida Grande", Geneva, Verdana, Tahoma, Arial, sans-serif;
	}
	
a:link {
	color: #00bce4;
	text-decoration: none;
}

a:visited {
	color: #00bce4;
	text-decoration: none;
}

a:active {
	color: #00bce4;
	text-decoration: none;
}

 a:hover {
	color: #013c63;
	text-decoration: none;
}

h1, h2, h3{
	padding:0;
	margin:0;
	font-weight:normal;
	}
	
h1 {
	font-size: 1.8em;
	color: #004C86;
	}

h2 {
	color:#666;
	font-size: 1.5em;
	}

h3 {
	color:#333;
	font-size: 1.3em;
	}

hr {
	border: none;
	border-top: 1px solid #00bce4;
	height: 1px;
	margin: 10px auto 20px auto;
	padding: 0;
	color:#FFF;
	}
	


/* ______________________ Start Layout ______________________ */

#container{
	padding:0;
	margin:0;
	background:transparent url(../../images/blue/background.png) repeat-x;
	}

#wrapper {
	width:760px;
	margin:0 auto;
	}
	
#header {
	width:100%;
	height:70px;
	color:#FFF;
	padding-bottom:10px;
	}

#Logo {
	width:130px;
	height:70px;
	background:url(../../images/blue/bLogo.gif) no-repeat;
	float:left;
	}

#printLogo {
	display:none;
	position:absolute;
	left:-300px;
	top:-300px;
	}
/* ______________________ Top Navigation ______________________ */

#Top{height:30px; padding-top:25px;}

#Top a:link{color: #FFF;}
#Top a:visited{color: #FFF;}
#Top a:active{color: #FFF;}
#Top a:hover{color: #00BCE4;}


#Top ul{
	margin: 0 ;
	padding: 0;
	list-style:none;
	font-size:80%;
	}

#Top li {
	padding:0px 10px 0 10px;
	border-right:#455560 solid 1px;
	list-style:none;
	display:inline;
	text-align:center; 
	float:right;
	}

/* ______________________ Intro ______________________ */	

#intro{
	background:url(../../images/blue/introGraphic.gif) no-repeat;
	height:63px;
	padding:15px;
	margin-bottom:10px;
	}

#intro h1{
	font-weight:normal;
	color:#FFF;
	font-size:2.5em;
	}
	
/* ______________________ STAGES ______________________ */	
	
/* -------------- Stage1 Area -------------- */

.stage1{
	background:#FFF url(../../images/blue/stage1top.gif) no-repeat;
	margin-bottom:10px;
	}

.stage1alt{
	background:#FFF url(../../images/blue/stage1top2.gif) no-repeat;
	margin-bottom:10px;
	}
	
.st_inner{
	padding:15px;
	}

.st_xinha ul li{
	background:url(../../images/blue/bullet.gif) no-repeat 3px 4px;
	list-style:none;
	padding-left:30px;
	margin-bottom:10px;
	}

.st_clear{
	background:transparent url(../../images/blue/stage1bottom.gif) no-repeat left bottom;
	height:5px;
	}
	
/* -------------- Stage1 Controls -------------- */

.st_control{
	background:#3f4e58 url(../../images/blue/stageControls.gif) no-repeat left bottom;
	padding:5px 15px 10px 15px;
	color:#FFF;
	}

.st_control a{
	display:block;
	border:#FFF solid 1px;
	text-align:center;
	width:90px;
	float:right;
	margin-left:10px;
	color:#FFF;
	font-weight:bold;
	font-size:9px;
	background:#013b63 url(../../images/blue/button.gif) repeat-x;
	}
	
/* -------------- Stage2 Area -------------- */	
	
.stage2{
	margin:0;
	padding:0;
	}

.stage2 .small{
	width:250px;
	background:#FFF url(../../images/blue/sm_top.gif) no-repeat;
	float:left;
	}

.stage2 .sm_inner{
	background:transparent url(../../images/blue/sm_bottom.gif) no-repeat left bottom;
	padding:15px;
	}

.stage2 .large{
	width:500px;
	background:#FFF url(../../images/blue/lg_top.gif) no-repeat;
	float:right;
	}

.stage2 .lg_inner{
	background:transparent url(../../images/blue/lg_bottom.gif) no-repeat left bottom;
	padding:15px;
	}

.clearStage{
	clear:both;
	height:10px;
	}

/* -------------- Stage3 Area -------------- */	
	
.stage3{
	margin:0;
	padding:0;
	}

.stage3 .small{
	width:250px;
	background:#FFF url(../../images/blue/sm_top.gif) no-repeat;
	float:right;
	}

.stage3 .sm_inner{
	background:transparent url(../../images/blue/sm_bottom.gif) no-repeat left bottom;
	padding:15px;
	text-align:left;
	}

.stage3 .large{
	width:500px;
	background:#FFF url(../../images/blue/lg_top.gif) no-repeat;
	float:left;
	}

.stage3 .lg_inner{
	background:transparent url(../../images/blue/lg_bottom.gif) no-repeat left bottom;
	padding:15px;
	}

/* ______________________ Footer ______________________ */

#footer {
	padding-top:5px;
	text-align:center;
	color:#FFF;
	font-size:80%;
	}

/* ______________________ Form Elements ______________________ */

.errorMessage p{
	display:block;
	background:#fffbd1;
	padding:5px;
	border:#fff8a8 dotted 1px;
	color:#FF0000;
	}

form {
	margin:0;
	padding:0;
	margin-bottom:25px;
	}

form p {
	margin-top:5px;
	margin-bottom:4px;
	padding-bottom:5px;
	clear:left;
	}

label{
	margin-left:10px;
	display:block;
	float:left;
	width:12em;
	}

textarea{	
	width:300px;
	border:1px solid #CCC;
	font:11px/18px "Lucida Grande", Geneva, Verdana, Tahoma, Arial, sans-serif;
	background:#FFF url(../../images/blue/inputBack.gif) repeat-x left bottom;
	}

select {
	font-size:95%;
	color:#515151;
	border:#CCC solid 1px;
	}

input {
	border:#CCC solid 1px;
	padding:3px;
	background:#FFF url(../../images/blue/inputBack.gif) repeat-x left bottom;
	}

input.button{
	background:#004f8b url(../../images/blue/buttonBack.gif) no-repeat left top;
	font-size:10px;
	border:#004c86 solid 1px;
	color:#FFF;
	font-weight:bold;
	}
	
input file{
	border:#CCC solid 1px;
	padding:3px;
	background:#FFF url(../../images/blue/inputBack.gif) repeat-x left bottom;
	}

.sm_inner input {
	border:#CCC solid 1px;
	padding:3px;
	background:#FFF url(../../images/blue/inputBack.gif) repeat-x left bottom;
	width:120px;
	}


.sm_inner label{
	margin-left:0px;
	display:block;
	float:left;
	width:8em;
	}

/* Table Layout */

table {
	margin:0 auto; 
	padding:0; 
	border-collapse:collapse; 
	border-spacing:0px;
	width:98% !important;
	}

table td{
	font-family: tahoma, arial, sans-serif;
	color:#403F3F;
	border:1px solid #ebebeb;
	padding:2px 5px;
	font-size:1em;
	}

table thead tr td{
	background:#004f8b url(../../images/blue/buttonBack.gif) no-repeat left top;
	color:#FFF;
	}

table td.actions{
	}

table td.actions a{
	display:block;
	text-align:center;
	width:90px;
	float:right;
	margin-left:5px;
	color:#FFF;
	font-weight:bold;
	font-size:9px;
	background:#004f8b url(../../images/blue/buttonBack.gif) no-repeat left top;
	border:#004c86 solid 1px;
	color:#FFF;
	}

table td.actions a:hover{
color:#FFF000;
	}
	
table.options td{
	border:none;
	}

#editor_background table{
	margin:0; 
	padding:0; 
	border-collapse:collapse; 
	border-spacing:0px;
	width:auto !important;
	}




/* -------------- Controls -------------- */	

.controls{
	height:25px;
	}

.controls a{
	display:block;
	text-align:center;
	width:120px;
	margin:0 5px 5px 0;
	color:#FFF;
	font-weight:bold;
	font-size:9px;
	background:#004f8b url(../../images/blue/buttonBack.gif) no-repeat left top;
	border:#004c86 solid 1px;
	color:#FFF;
	}

.controls a:hover{
	color:#FFF000;
	}

/* -------------- option Controls -------------- */


.optionButton{
	background:transparent url(../../images/blue/optionBleft.gif) no-repeat left top;
	margin:0 15px;
	}

.optionButton a {
	background:transparent url(../../images/blue/optionBright.gif) no-repeat right top;
	display:block;
	vertical-align:middle;
	font-size:13px;
	font-weight:bold;
	padding:12px;
	color:#FFF;
	}

.optionButton a:hover{
	color:#013C63;
	}

/* -------------- Logo Upload -------------- */

.logoHolder{
	background:#FFF url(../../images/blue/logo.gif) no-repeat center center;
	height:100px;
	border:#CCC solid 1px;
	color:#00bce4;
	}

/* -------------- Bread Crumb Nav -------------- */

.breadCrumb{
	font-size:10px;
	}

.breadCrumb b{
	color:#004C86;
	margin-right:5px;
	}

.breadCrumb a{
	border-right:#004C86 solid 1px;
	padding-right:5px;
	margin-right:5px;
	}

/* -------------- Lists and Tables Important -------------- */

.listTitle{
	color:#004C86;
	background:#FFF;
	font-size:13px;
	}

/* -------------- Module List -------------- */

.moduleList{

	}

.moduleList ul{
	margin:0;
	padding:0;
	list-style:none;
	}

.moduleList li{
	display:block;
	clear:both;
	}

.moduleList li a{
	float:right;
	display:block;
	text-align:center;
	width:45px;
	margin:0 5px 5px 0;
	color:#FFF;
	font-weight:bold;
	font-size:9px;
	background:#004f8b url(../../images/blue/buttonBack.gif) no-repeat left top;
	color:#FFF;
	}

.moduletitle{
	float:left;
	clear:both;
	width:450px;
	border:#FFF solid 1px;
	color:#004C86;
	font-size:13px;
	padding-left:20px;
	background:transparent url(../../images/blue/listarrow.gif) no-repeat 0px 2px;
	}

.moduleList ul ul .moduletitle,
.moduleList ul ul ul .moduletitle{
	float:left;
	clear:both;
	width:350px;
	border:#FFF solid 1px;
	color:#333;
	background:#FFF;
	font-size:11px;
	padding-left:20px;
	background:transparent url(../../images/blue/listarrowGrey.gif) no-repeat 0px 2px;
	}

.moduleList ul ul{
	padding:0;
	margin:0;
	margin-left:25px;
	}	
	
.moduleList ul ul ul {
	padding:0;
	margin:0;
	margin-left:50px;
	}	

.moduleClear{
	clear:both;
	height:10px;
	}

/* -------------- Module List -------------- */
.userModuleList{
	font-size:13px;
	background:#FFF;
	padding:10px;
	border:#333 dotted 1px;
	}

.userModuleList ul{
	margin:0;
	padding:0;
	list-style:none;
	}

.userModuleList li{
	display:block;
	margin:0 5px 5px 20px;
	padding:0 0 0 20px;
	width:auto;
	background:transparent url(../../images/blue/listarrowGrey.gif) no-repeat 0px 4px;
	}

.userModuleList li a{
	display:block;
	padding:0 5px 5px 0px;
	width:auto;
	//background:transparent url(../../images/blue/tick.gif) no-repeat right top;
	}
	
.userModuleList li a.complete {
	display:block;
	padding:0 5px 5px 0px;
	width:auto;
	background:transparent url(../../images/blue/tick.gif) no-repeat right top;
	}
	
/* -------------- Flash Controls -------------- */	

#flashControls{
	width:75px;
	text-align:right;
	float:right;
	height:26px;
	padding:3px 3px 0 0;
	}
	
#flashControls div.play{
	background:transparent url(../../images/blue/wButtonPlay.gif) no-repeat left top;
	height:27px;
	float:right;
	}

#flashControls div.pause{
	background:transparent url(../../images/blue/wButtonPause.gif) no-repeat left top;
	height:27px;
	float:right;
	}

#flashControls a{
	background:transparent url(../../images/blue/wButtonEnd.gif) no-repeat right top;
	display:block;
	float:right;
	height:23px;
	padding:3px 15px 0px 20px;
	font-size:9px;
	}
	
/* -------------- Risk Assessment -------------- */		
	
.riskassessment, .riskassessment table {
	font:11px/18px "Lucida Grande", Geneva, Verdana, Tahoma, Arial, sans-serif;
}
.riskassessment table {	
	width: 100%;
	border-collapse:collapse;
}
.riskassessment table th, .riskassessment table td {
	border: 1px solid #00bce5;
	text-align:left;
	vertical-align:top;
	padding: 3px;
}
.riskassessment table th {
	background-color: #d5eff8;
}

.riskassessment h1 {
	font:15px/18px "Lucida Grande", Geneva, Verdana, Tahoma, Arial, sans-serif;
	font-weight:bold;
	color: #00bce5;
	padding:5pt 0; 
}
.riskassessment h2 {
	font:13px/18px "Lucida Grande", Geneva, Verdana, Tahoma, Arial, sans-serif;
	font-weight:bold;
	color: #00bce5;
	padding-top:5pt 0;	
}

.riskassessment input {
	background: none;
	background-color: #ffffff;
	width:auto;
	padding:0;
	margin:0;
}

.riskassessment input.text {
	border: 1px solid #ffffff;
	width: 98%;
}
.riskassessment textarea {
	border: 1px solid #ffffff;
	width: 98%;
	overflow: auto;
	background: none;
	background-color: #ffffff;
}


.riskassessment label {
	cursor:pointer;
	cursor:hand;
	float: none;
	width: auto;
	display:inline;
	margin-left:0;
	
}
.riskassessment label.fullwidth {
	display:block;
}

/* -------------- Risk Assessment tabs -------------- */	

#stepTab{	
	border-bottom:#CCC solid 1px;
	margin:10px 0;
	height:30px;
	padding-left:6px;
	}
	
#stepTab ul {
	list-style:none; 
	display:inline;
	padding:0;
	margin:0;
	}
	
#stepTab ul li {
	display:inline; 
	padding:0; 
	margin:0;
	background: url(../../images/blue/tabLeft.gif) no-repeat left 5px;
	border-right:2px solid #FFF;
	float:left;	
	}

#stepTab ul li a {
	color:#666;
	text-decoration:none;
	background:transparent url(../../images/blue/tabRight.gif) no-repeat right 5px;
	height:20px;
	display:block;
	padding:10px 15px 0px 15px;
	position:relative;
	text-align:center;
	font-weight:bold;
	}	
	
#stepTab li.current {
	display:inline; 
	padding:0; 
	margin:0;
	background: url(../../images/blue/tabLeftcurrent.gif) no-repeat left 0px;
	border-right:2px solid #FFF;
	float:left;	
	}

#stepTab li.current a {
	color:#00bce5;
	text-decoration:none;
	background:transparent url(../../images/blue/tabRightcurrent.gif) no-repeat right 0px;
	height:20px;
	display:block;
	padding:8px 35px 2px 15px;
	position:relative;
	text-align:center;
	font-weight:bold;
	}	


#stepTab li a:hover{
	color:#00bce5;
	}

/* -------------- Public Answers -------------- */	


.question{
	border:#CCC dotted 1px;
	background:#eff9ff url(../../images/blue/question.gif) no-repeat;
	margin-bottom:10px;
	padding:10px 0px 5px 40px;
	}

.question .html,
.question .image{		
	background:#FFF;
	margin-top:5px;
	}	
	
table.answerstable td{
	border:none;
	}

table.answerstable td.radio{
	text-align:left;
	width:30px;
	padding-left:35px;
	}
	
/* -------------- List Items Displayed  -------------- */	

.st_inner ul.list li{
	list-style:none;
	margin-bottom:10px;
	padding-left:20px;
	background:transparent url(../../images/blue/listarrow.gif) no-repeat 0px 2px;
	}