/*
Title: SSNZ Coaching - Online Module tests
Description: Stylesheet for tests of SSCNZ Online coaching modules.
Version: 1.0
Author: Doug Somerville
Author URI: http://www.dougsomerville.com/
*/

/* General styles
--------------------------------------------------*/
body {
	font-size: 12px;
	font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
	background: url(../images/bg-body3.gif) no-repeat center top #FFFFFF;
	/* background: url(../images/tile04.gif) #FFFFFF; */
	color: #333;
	margin: 0px;
	border-top: 3px solid #5677A4;
}
div#wrapper {
	width: 600px; 
	margin: 0px auto;
	clear: both;
	/* background: #FFFFFF;
	border-left: 20px solid #FFFFFF;
	border-right: 20px solid #FFFFFF; */
}
h1 {
	color: #5677A4;
	margin: 24px 0px 36px 0px;
	clear: left;
}
div#masthead {
	width: 600px;
	height: 100px;
	margin: 0px auto;
	clear: both;
	/* background: #FFFFFF;
	padding-bottom: 24px;
	border-bottom: 1px dotted #5677A4; */
}
div#masthead img {
	display: block;
	float: left;
	width: 300px;
	height: 100px;
	margin-bottom: 24px;
}
div#masthead div#title-block {
	display: block;
	float: right;
	width: 300px;
	text-align: center;
	padding: 20px 0px;
}
div#masthead div#title-block p {
	margin: 0px;
	line-height: 30px;
	color: #999999;
	font-weight: bold;
	font-size: 120%;
}
div#masthead p#steps span {color: #5677A4;}
p {line-height: 1.5em;}
ul li {
	list-style-image: url(../images/snowflake-small.gif);
}
ol li {margin-bottom: 12px;}

/* Form element styles
--------------------------------------------------*/
input { 
	font-size: 2.0em;
}
ul {
	line-height: 200%;
}
input.largerCheckbox {
	width: 30px;
	height: 30px;
}
p label {font-size: 180%; font-weight: bold;}
/* p.start {width: 350px;} */
p.start {
	height: 100px;
	margin-top: 36px;
	padding-top: 12px;
	border-top: 1px dotted #5677A4;
	text-align: right;
}

/* Navigation styles
--------------------------------------------------*/
div#nav {
	height: 100px;
	margin-top: 36px;
	padding-top: 12px;
	border-top: 1px dotted #5677A4;
}
#nav span.button-next {
	display: block;
	float: right;
}
input.submit {
	font-size: 130%;
	font-weight: bold;
	color: #FFFFFF;
	width: 120px;
	height: 30px;
	line-height: 30px;
	background: url(../images/button-next-off.gif) no-repeat center center;
	border: 0px;
}
input.submit:hover {
	background: url(../images/button-next-on.gif) no-repeat center center;	
}
#nav span.button-back {
	display: block;
	float: left;
}
a.back:link, a.back:active, a.back:visited {
	display: block;
	font-size: 130%;
	font-weight: bold;
	color: #FFFFFF;
	width: 120px;
	height: 30px;
	line-height: 30px;
	background: url(../images/button-back-off.gif) no-repeat center center;
	border: 0px;
	text-align: center;
	text-decoration: none;
}
a.back:hover {
	background: url(../images/button-back-on.gif) no-repeat center center;	
}

/**** Added by james ****/

.clicker {
cursor:pointer;
color:blue;
}

dl {
position:relative;
line-height: 1.5em;
width:20em;
padding: 12px;
}
.abs {
position:absolute;
top:1.5em;
left:20em;
width:20em;
/*padding:3px;
 border:2px solid gray; */
}

.selected {
color:green;
}
a.check-answers {
	background: #5677A4;
	color: #FFFFFF;
	text-decoration: none;
	padding: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	clear: both;
}

/* dlist styles
--------------------------------------------------*/
.dlist1 dt {
	display:block;
	background: #5677A4;
	color: #FFFFFF;
	font-weight: bold;
	padding: 12px;
	margin-bottom: 12px;
	border: 1px solid #5677A4;
}
.dlist1 dt.selected {
	background: #BFDFBF;
	color: green;
	border: 1px solid green;
}
dd {
	margin: 0px;
	font-size: 120%;
}

/* Multichoice step styles
--------------------------------------------------*/
div.multi-choice {
	margin-top: 12px;
	line-height: 1.5em;
}
div.multi-choice div strong {
	display: block;
	font-size: 110%;
}


/* Table styles
--------------------------------------------------*/
td {border-right: 1px dotted #5677A4;}
td.inside {border-right: none;}
td.outside {border-left: 1px dotted #5677A4;}
tr.options td a {
	display: block;
	padding: 12px;
	background: #5677A4;
	color: #FFFFFF;
	text-decoration: none;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
}


/* Step 22 table styles
--------------------------------------------------*/
table#protection th {
	text-align: left;
	border-bottom: 1px solid #5677A4;
	line-height: 1.5em;
}
table#protection td {
	border-bottom: 1px dotted #CCCCCC;
	padding: 12px 0px 12px 12px;
	border-right: 0px;
}
table#protection th.option {text-align: center;}
table#protection td.option {text-align: center; padding-left:0px;}
tr.even td {background: #EFF2F6;}
table#protection td.correct {text-align: center; background: #80C080; padding-left:0px;}
table#protection td.incorrect {text-align: center; background: #FF8080; padding-left:0px;}

/* Step 24 table styles
--------------------------------------------------*/
table#responsibility th {
	text-align: left;
	border-bottom: 1px solid #5677A4;
	line-height: 1.5em;
}
table#responsibility td {
	border-bottom: 1px dotted #CCCCCC;
	padding: 12px 0px 12px 12px;
	border-right: 0px;
}
table#responsibility th.option {text-align: center;}
table#responsibility td.option {text-align: center; padding-left:0px;}
tr.even td {background: #EFF2F6;}
table#responsibility td.correct {text-align: center; background: #80C080; padding-left:0px;}
table#responsibility td.incorrect {text-align: center; background: #FF8080; padding-left:0px;}


/* Safe Environment list
--------------------------------------------------*/
ul.safe-env {
	width: 608px;
	height: 288px;
	padding: 2px 0px 0px 2px;
	background: url(../images/bg-grid.jpg) no-repeat center center;
}
ul.safe-env li {
	float: left;
	list-style-image: none;
	list-style-type: none;
	border: 1px solid #FFFFFF;
	padding: 0px;
	margin: 0px 2px 2px 0px;
	text-align: center;
	font-weight: bold;
}
ul.safe-env li a {
    display: block;
    width: 124px;
	height: 128px;
    font-size: 400%;
    line-height: 2em;
    color: #000000;
    padding: 12px 12px 0px 12px;
    text-decoration: none;
    cursor: help;
}
ul.safe-env li span {
    display: block;
    width: 124px;
	height: 128px;
    color: #000000;
    line-height: 1.2em;
    background: url(../images/semitrans50.gif);
    padding: 12px 12px 0px 12px;
}


/* Safety slide styles
--------------------------------------------------*/
div#frame-s18 {
	background: url(../images/bg-frame-s18.jpg) no-repeat center top;
}

/* RICED styles
--------------------------------------------------*/
ul#riced {
	width: 600px;
	margin: 0px;
	padding: 0px;
}
ul#riced li {
	float: left;
	width: 98px;
	margin: 0px 25px 0px 0px;
	padding: 0px;
	list-style-image: none;
	list-style-type: none;
}
ul#riced li.last {margin-right: 0px;}
ul#riced li span.letter {
	display:block;
	width: 1.5em;
	line-height: 1.5em;
	font-size: 200%;
	font-weight: bold;
	text-align: center;
	background: #5677A4;
	color: #FFFFFF;
}
ul#riced li p {
	width: 100px;
	height: 80px;
	margin: 0px 0px 12px 0px;
	border: 1px solid #CCCCCC;
}
ul#riced li p#letter-r {
	background: url(../images/riced-r.jpg) no-repeat center center;
	cursor:help;
}
ul#riced li p#letter-i {
	background: url(../images/riced-i.jpg) no-repeat center center;
	cursor:help;
}
ul#riced li p#letter-c {
	background: url(../images/riced-c.jpg) no-repeat center center;
	cursor:help;
}
ul#riced li p#letter-e {
	background: url(../images/riced-e.jpg) no-repeat center center;
	cursor:help;
}
ul#riced li p#letter-d {
	background: url(../images/riced-d.jpg) no-repeat center center;
	cursor:help;
}
ul#riced li p.definition {border: 0px;}
ul#riced li p.definition strong {display:block;}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}


/* Drag-n-drop lists styles
--------------------------------------------------*/
#todoList {
	padding: 0px;
}
#todoList li.sortable {
	background-color: #5677A4;
	list-style-image: none;
	list-style-type: none;
	color: #FFFFFF;
	margin-bottom: 12px;
	padding: 6px 0px 6px 12px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
}
li.sortable {
	cursor: move;
	
}