@charset "utf-8";
/* CSS Document */
@import url("menu.css");

body {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:70%;
	background-color:#f4f4f4;
}

p {
	margin:10px 0;
	padding:0;
	line-height:1.3em;
}

#site {
	margin:0 auto 10px;
	width:960px;
	height:680px;
	border:1px solid #666;
	border-top:0;
	padding-top:20px;
}

#background {
	width:100%;
	float:right;
}

/* Desks Backgrounds and Heights */
#desks #site { background:url(../images/blue-grad.jpg) 0 0 repeat-x; }
#desks #background {
	height:680px;
	background: url(../images/footer-desks.gif) 50% 100% no-repeat;
}

#site.stand, #desks #site.stand #background { height:700px; }
#site.involved, #desks #site.involved #background { height:930px; }

/* Submarine Backgrounds and Heights */
#sub #site { background:url(../images/students-grad.jpg) 0 0 repeat-x; }
#sub #background {
	height:680px;
	background: url(../images/submarine.gif) 50% 0 no-repeat;
}

/* Dark Background and Heights */
#dark #site, #case #site { background-color:#14142a; height:720px; padding-top:0; }
#dark #background, #case #background { background: url(../images/dark.jpg) 50% 100% no-repeat; height:710px; padding-top:20px; }
#dark #site.researchers {
	height:785px; 
}

#facilitator #site { height:680px; background:#274f83 url(../images/blue-grad.jpg) 0 0 repeat-x; }
#facilitator #background { 	height:680px; background: url(../images/footer-desks.gif) 50% 100% no-repeat; }

#dark #site.researchers #background { 
	height:770px; 
}

#dark #site.assistants { height:1035px; }
#dark #site.assistants #background { height:1020px; }
#dark #site.login { height:635px; }
#dark #site.login #background { height:620px; }

#dark #site.login #heading , .files #heading {
	margin-left:340px;
	width:580px;
}






/* Content Containers */
#left {
	width:310px;
	float:left;
}

#right {
	margin-left:340px;
}

#heading {
	background:url(../images/heading.gif) 0 0 no-repeat;
	width:100%;
	height:194px;
	display:block;
	margin:0;
}


/* Link Styles */
.column a, .research a, table a { color:#F5F5F5; }
.column a:hover, .column a:focus, table a:hover, table a:focus, .research a:hover, .research a:focus { text-decoration:none; }



/* Research and Researchers Page Styles */
.research #heading, .researchers #heading, .assistants #heading {
	margin-left:340px;
	width:580px;
}
.research #left, .files #left {
	color:#F5F5F5;
	padding:120px 0 0 25px;
	width:285px;
	background:url(../images/octopus.gif) 100% 100% no-repeat;
}

.researchers #left, .assistants #left {
	color:#F5F5F5;
	padding:15px 0 0 25px;
	width:285px;
}

.research h2, .researchers h2, .assistants h2 { font-size:1.3em; }
.research .text, .researchers .text, .assistants .text { margin:10px 10px 10px 25px; }

.research table, .researchers table, .assistants table {
	border-collapse:collapse;
	background:url(../images/table-bg.png) 0 0 repeat;
}

.research table td, .research table th {
	border-bottom:1px solid #F5F5F5;
	border-right:1px solid #F5F5F5;
	padding:1em;
	vertical-align:top;
}

.research table td.end, .research table th.end { border-right:0; }
.research table td.base { border-bottom:0; }

.researchers td, .assistants td {
	vertical-align:top;
	padding:1em 2em 1em 0;
	width:33%;
}

.researchers td.end {
	background:url(../images/shark.gif) 50% 95% no-repeat;
}

.researchers td img, .assistants td img {
	float:left;
	margin:5px 10px 5px 0;
}








/* Full screen heading */
.parents #heading {
	width:99%;
	text-align:right;
}




.alt {
	position:absolute;
	margin-top:-300em;
}

h1 {
	font-size:1em;
	text-align:center;
	color:#333;
	margin:0;
	padding:0;
}







.links a {
	width:277px;
	height:206px;
	display:block;
	background-position:100% 100%;
	background-repeat:no-repeat;
	margin-bottom:5px;
	margin-left:30px;
}

.links a.stand { background-image:url(../images/link-stand.gif); margin-top:0px; }
.links a.meet { background-image:url(../images/link-meet.gif); }
.links a:hover, .links a:focus { background-position:100% 0%; }





.text {
	color:#F5F5F5;
	line-height:1.4em;
	margin-top:20px;
	padding-right:10px;
}

.text .left {
	width:280px;
	float:left;
	margin:0;
	padding:0;
}

.text .left p {
	margin:0;
	padding:0;
}

.text .right {
	width:280px;
	margin:0 0 0 310px;
	padding:0;
}

.text .indent {
	margin-left:200px;
}

.text h2 {
	font-size:1.2em;
}

.text h3 {
	font-size:1.1em;
}

.text ol {
	margin-left:20px;
	padding-left:0;
}

.text li {
	padding-left:0;
	margin-left:0;
}

.episodes .text {
	margin:100px 0 0 120px;
	text-align:center;
}

.episodes .text a {
	color:#fff;
	font-size:1.2em;
}

.episodes .text a:hover, .episodes .text a:focus {
	text-decoration:none;
}

.whats #left {
	color:#fff;
	margin-top:0;
	margin-left:20px;
	padding-bottom:110px;
	background:url(../images/line-up.gif) 50% 100% no-repeat;

}

.whats #left h2 {
	font-size:1.3em;
}

.meet .text, .whats .text {
	margin-top:50px;
	margin-left:120px;
}

.whats .text {
	margin-top:30px;
}

.text p.lower {
	margin-left:150px;
}


.module {
	background:url(../images/module-two.gif) 0 0 no-repeat;
	width:295px;
	margin:0 0 10px 20px;
	padding:10px 0;
}

.one {
	background:url(../images/module-one.gif) 0 0 no-repeat;
}

.module a {
	color:#333;
	text-decoration:none;
}

.module a:hover, .module a:focus {
	text-decoration:underline;
}

.module h2 {
	font-size:1em;
	color:#F5F5F5;
	margin:0 0 0 10px;
	width:260px;
	line-height:1.4em
}


.module ul, .module li {
	margin:0;
	padding:0;
}

.module ul {
	margin-top:20px;
	margin-left:40px;
}

.episodes .module {
	background:url(../images/module-episodes.gif) 0 0 no-repeat;
}

.episodes .module p {
	margin:12px 0 5px 30px;
}

/* Meet Okki Styles */

.meet #left {
	background:url(../images/starfish.gif) 50% 50% no-repeat;
	height:300px;
}

.wide, .downloads .wide {
	width:99%;
	text-align:center;
}

.downloads .wide {
	text-align:left;
	margin-left:10px;
}

table.kool {
	width:765px;
	margin:0 auto;
	color:#f5f5f5;
}

table.kool td {
	text-align:center;
	font-size:1.3em;
	font-weight:bold;

}

table.kool td.k {
	width:180px;
}

table.kool td.o {
	width:180px;
}

.video {
	height:510px;
}








/* Column Styles */

.column {
	float:left;
	margin:0 10px;
	color:#f5f5f5;
}

.involved .column { width:300px; }
.steps .column { width:200px; }
.downloads .column, .files .column { width:170px; border-left:1px solid #f5f5f5; padding-left:20px; text-align:center; }
.downloads .left, .files .left { border-left:0; margin-left:50px; }

.downloads .wide {
	margin-left:100px;
	color:#f5f5f5;
}

.steps h2 {
	color:#f5f5f5;
	margin-left:10px;
	font-size:1.9em;
	width:650px;
	margin-top:20px;
}

.steps .column h3 {
	font-size:1.3em;
}

.steps #octopus {
	width:275px;
	height:450px;
	background:url(../images/right-pink-octopus.gif) 100% 100% no-repeat;
	float:right;
}

.stepOne, .stepTwo, .stepThree { 
	padding-top:65px; 
	background-position:30px 0;
	background-repeat:no-repeat;
	
}

.stepOne { background-image:url(../images/step-one.gif); }
.stepTwo { background-image:url(../images/step-two.gif); }
.stepThree { background-image:url(../images/step-three.gif); }



.column ul {
	margin:0;
	padding-left:20px;
}

.column h2 {
	font-size:1.2em;
	border:0;
}

.column h3 {
	font-size:1em;
	margin-bottom:0;
	padding-bottom:0;
}

#site.involved #heading, #site.steps #heading, #site.downloads #heading  {
	background:url(../images/heading.gif) 100% 0 no-repeat;
	float:right;
	width:575px;
	height:194px;
	display:inline;
	margin:10px 10px 10px 0;
}

#site.downloads #heading  {
	background-position:70% 0;
	width:99%;
}

/* Contact Table */
.contact #heading { background-position:310px 0; } 

.contact table { border-collapse:collapse; margin-left:22px; }
.contact .text { margin-top:5px; }
.contact .text h2 { font-size:1.9em; line-height:1.9em; margin:0 0 5px 44px; padding-top:0; }

.contact table.list th, .contact table.list td { border-bottom:0; } 
.contact table.list table th, .contact table.list table td { border-bottom:1px solid #fff; padding:5px; font-weight:bold; } 
.contact table.list table tr.last th, .contact table.list table tr.last td { border-bottom:0; }
.contact table th {
	text-align:left;
	vertical-align:top;
	padding-right:15px;
}

#desks form input, #sub form input { width:150px; }
#desks form input.btn, #sub form input.btn { margin-left: 75px; width:160px; }

#case .text h2 {
	font-weight:700;
}

/* Facilitator Files */

.files #left {
	padding:160px 0 0 20px;
	font-size:1.3em;
}

.files .text {
	min-height:220px;
}

.files .text .column p { margin:10px 0; }

#facilitator .text {
	background:url(../images/table-bg.png) 0 0 repeat;
	margin:0 20px;
	padding:10px 10px 0;
}

#case .text {
	background:url(../images/table-bg.png) 0 0 repeat;
	margin:0 20px;
	padding:10px;
}


p.error, p.success {
	width:760px;
	margin:0 auto 5px;
	padding:0.5em 0;
	border:1px solid #999;
	text-align:center;
}

p.error { background-color:#853857; }
p.success { background-color:#0096a9; }

#desks .text p.error, #sub .text p.error, #dark p.error {	width:235px; border:0; margin:0;}
#desks .text p.success, #sub .text p.success, #dark p.success {	width:235px; border:0; margin:0;}

#sub form, #dark form, #dark p.error, #dark p.success {
	margin:0 0 0 300px;
}
#sub .text p.error, #sub .text p.success { margin:80px 0 0 300px; }

.footnote {
	font-size:80%;
	color:#666;
}

p.loadtime {
	font-size:80%;
	color:#666;
	text-align:center;
	clear:both;
}

h2 {
	font-size:1em;
	width:99%;
	display:block;
}

ul.deleteList {
	margin:0;
	padding:0 0 0 10px;
}

ul.deleteList li {
	list-style-type:none;
	line-height:20px;
}

ul.deleteList li img {
	margin-bottom:-3px;
}

ul.deleteList .cat , body#case .cat {
	font-size:80%;
	color:#999;
	position:relative;
	top:-2px;
}

img.required {
	top:3px;
	position:relative;
}

select.editQuestion, input.editQuestion {
	width:490px;
	display:block;
	float:left;
	margin-right:5px;
}

label, body#case.login label, body#case.create label {
	width:7em;
	float:left;
	margin-top:5px;
}

#dark #site.login label {
	width:9em;
}

body#case label, body#admin.view label {
	width:auto;
	float:none;
	padding:5px 5px 5px 0;
}

body#case.create label {
	width:11em;
	text-align:right;
	margin-top:0;
	padding:2px 5px 0 0;
}

body#case label:hover {
	cursor:pointer;
}

body#case.login label, body#case.login input {
	margin:0;
	padding:0;
}

body#case.create textarea, body#case.create input {
	width:220px;
}

body#case.create input.btn {
	width:8em;
	margin-left:125px;
}

body#case.view input {
	padding:5px 10px;
}

.listInfo {
	font-size:80%;
	color:#999;
}

table.users {
	width:99%;
	border-collapse: collapse;
	border:1px solid #999;
}

table.users th, table.users td {
	border:1px solid #999;
}

table.users td {
	text-align:center;
	vertical-align:top;
}


/* Case Details */
table.caseDetails {
	width:99%;
	border-collapse:collapse;
	margin-bottom:10px;
}

table.caseDetails th, table.caseDetails td {
	padding:4px;
	border:1px solid #c4c4c4; 
}

table.caseDetails th { 
	text-align:left;
	width:160px;
	font-size:85%;
	vertical-align:top;
}

/* Quiz Styles */
table.quizInfo {
	width:80%;
	margin:5px auto 10px;
	border-collapse:collapse;
}

table.quizInfo th, table.quizInfo td {
	text-align:center;
	width:20%;
}

table.quizInfo td { font-size:85%; }

.hide { display:none; }
.show { display:block; }

.qInput { float:right; }	
.qControl {	float:left; }

.qText {
	padding:1em 0;
	text-align:center;
	width:100%;
	font-size:1.3em;
}

.progress {
	width:510px;
	height:5px;
	border:1px solid #999;
	margin:10px auto 10px;
	padding:0;
	display:block;
	background: #fff url(../images/progress-510.gif) no-repeat;
}

.progress {
	position:relative; 
	top:-25px; 
}

.clear {
	width:100%;
	display:block;
	clear:both;
	margin:5px 0;
}

.catStyle1, .catStyle2, .catStyle3, .catStyle4, .catStyle5, .catStyle6, .catStyle7, .catStyle8 {
	padding:10px; 
	color:#333;
	height:550px;
}

.catStyle1 { background: #000 url(../images/cat-class.jpg) 0 0 no-repeat;  }
.catStyle2 { background: #000 url(../images/cat-bus.gif) 0 0 no-repeat; }
.catStyle3 { background: #000 url(../images/cat-home.gif) 0 0 no-repeat; }
.catStyle4 { background: #000 url(../images/cat-mum.gif) 0 0 no-repeat; }
.catStyle5 { background: #000 url(../images/cat-shark.gif) 0 0 no-repeat; }
.catStyle6 { background: #000 url(../images/cat-soccer.gif) 0 0 no-repeat; }
.catStyle7 { background: #000 url(../images/cat-stairs.gif) 0 0 no-repeat; }

/* Specific Styles */

.catStyle1 .qText { color: #F5F5F5; text-shadow: #333 5px 5px 2px; }
.catStyle1 td { color: #F5F5F5; }



.altButton {
	width: 40px;
  height: 40px;
	cursor: pointer;
}

/* Results Comparison */
table.results {
	width:99%;
	border-collapse:collapse;
}

table.results th { font-size:85%; }
table.results th, table.results td { 
	text-align:center; 
	border:1px solid #c4c4c4; 
	padding:4px;
}

table.results td.cat, table.results td.txt {
	text-align:left;
}

/* Slider scale styles */

.slider input { width:20px; clear:both; }
#facilitator input { padding:5px; }
/*#facilitator ol, #facilitator li { margin-left:15px; }
#facilitator li { padding-left:0; }*/

#facilitator input:hover { cursor:pointer; }

.slider { width:200px; margin:10px auto 40px; }
.slider a:hover { cursor:pointer; }

#facilitator .text h2 { text-align:center; }

#facilitator .slidersLeft {
	width:430px;
	float:left;
}

#facilitator .slidersRight {
	width:430px;
	margin-left:450px;
}

#facilitator .slidersLeft, #facilitator .slidersRight {
	text-align:center;
	padding:5px;
}

.slidersLeft div, .slidersRight div {
	background-color:#FF0000;
	padding-left:20px;
	padding-right:20px;
}

.slidersLeft div:hover, .slidersRight div:hover {
 cursor:pointer;
}