/*
FILE NAME: global.css
DATE MODIFIED:16 July 2009
DESCRIPTION: This style sheet is the default standard for the CLIPS CD-ROM and HTML products.
Please do not alter. All style variables are developed on 'project.css'.
AUTHOR: Centre for Learning Innovation (CLI), New South Wales Department of Education and Training
VERSION:0.8.2
*/
html{
height: 100%;
}

body {
	position: relative;
	color:#000;
	font-family:Verdana, helvetica, Arial, sans-serif;
	font-size:75%;
	padding-left: 0px;
	padding-right: 0px;
	top: 0px;
	vertical-align: top;
	height: auto;
	background: #FFFFFF url(graphics/back.jpg) repeat;
	line-height:1.4;
}
body#standard{
}
body#show{
	margin:0;
	left:0;
	width:600px;
}
body#popup{
 left:0;
 margin:0;
 width:630px;
}
#nonFooter
{
	position: relative;
	min-height: 100%;
	background: #FFFFFF;
	padding: 0px;
	margin:0 auto;
}
#standard #nonFooter{
	width:900px;
}
#show #nonFooter{
	width:600px;
}
#popup #nonFooter{
	width:600px;
}
* html #nonFooter{
	height: 100%;
}
#globalNav{
	float:left;
	left:0;
	width:18em;
	height:100%;
	padding:0;
	margin:0;
	font-size:1.1em;
}

#nav {
	background-color: #264C5A;
	padding:0.5em 0;
	margin:0;
}

#content {
	background: #FFFFFF;
	margin:0;
	border-right: 1px solid #006699;
	border-left: 1px solid #006699;
}
#standard #content{
	width:815px;
	padding-left: 70px;
}
#show #content,
#popup #content{
float:none;
}
#show #footer,
#show #content,
#popup #footer,
#popup #content{
width:600px;
margin:0;
padding:1em;
left:0;
}
.textContain{
	margin:0;
	max-width:600px;
	width: 600px;
	min-width: 600px;
	padding: 0;
}

/*-------------------------- navigation --------------------- */


#nav ul{
	padding:0;
	margin:0 0 0 1em;
	background-color:Transparent;
	top:0;
}
#globalNav ul{
	padding:0;
	margin:0;
}
#globalNav li
{
	padding:0;
	margin:0;
	list-style:none;
}
#globalNav li span{
	font-weight:bold;
	display:inline;
	color:#333;
}
#globalNav li a{
	display:block;
	padding:0.1em 0 0.1em 1.3em;
	background-color:#d1cbc1;
	color:#000;
	background:#E6E6E6 url(themes/images/ui-bg_glass_75.png) repeat-x scroll 50% 50%;/* bg image from jquery theme */
	border:1px solid #D3D3D3;
	border-left:5px solid #ededed;
	text-decoration:none;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
}
#globalNav li a:focus,
#globalNav li a:hover,
#globalNav li a:active{
	border-left:5px solid #6D879F;
	background-color:#fff;
	background-image:none;
}

#globalNav li.selected a {
	color:#000;
}
#globalNav li.selected a li a{
	background-image:none;
}
#globalNav li.selected ul li a{
	background-image:none;
	padding-left:10px;
}
#globalNav li.current a {
	color:#223b4a;
	background-color:#fff;
	background-image:none;
	border-left:5px solid #35506C;
}

/** html #globalNav li a.head{ -- hack for IE6
	background-position: 8px center;
}
*:first-child+html #globalNav li a.head{ -- hack for IE7
background-position: 8px center;
}*/


.ui-icon{
	margin-left:-5px;

}

/* styles specifically overriding jquery ui defaults */
#globalNav ul li a.ui-state-active{
	border-left:5px solid #999;
	background-position:50% 71%;
}
#globalNav .ui-accordion-content{
	padding:0;
	margin:0;
	overflow:visible;
}
#globalNav .ui-accordion-content a{
	text-indent:1em;
}
#globalNav .ui-widget{
	font-size:100%;
}
#globalNav .ui-widget-content{
	border:none;
}
/* end of styles specifically overriding jquery ui defaults */
/* --------------------------------------------- Non-integrated navigation - Secondary --------------------------------------------- */
#nav li{
	list-style:none;
	display:inline;
	font-size:1em;
	color:#fff;
	margin-left:1em;
	font-weight:bold;
}

#nav li.current a:link,
#nav li.current a:visited,
#nav li.current a:focus,
#nav li.current a:hover,
#nav li.current a:active{
	/* This indicates "where you are" */
	color:#FFB267;
	text-decoration:none;
	background-image:none;
	background-color:Transparent;
}

#nav li a{
margin:0;
padding:0;
text-decoration:none;
}
#nav li a:link,
#nav li a:visited {
color:#fff
}

#nav li a:focus,
#nav li a:hover,
#nav li a:active {
color:#DCFFFF;
text-decoration:underline;
}
/* ------------------------- Headings ----------------------- */

h1 {
	margin:0;
	color:#003366;
	font-size :160%;
	clear:both;
	width: auto;
	padding-bottom: 30px;
	font-family: Arial, Helvetica, sans-serif;
}
#title {
	background-image:none;
	background-color:Transparent;
	height:80px;
	width:100%;
	margin:0;
	padding:0;
	border-right: 1px solid #006699;
	border-left: 1px solid #006699;
}
#feedback #title {/* feedback title */

	background: #000 url(graphics/title_bg.png) repeat-x left bottom;
	padding:5px 0 5px 15px;
	margin:0;
}
#feedback #title h1 {
	font: normal 180%/80% "Lucida Grande", Arial, sans-serif;
}
#title h1 {
	margin:0;
	padding:0;
	color: #000000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 230%;
	font-style: normal;
	line-height: 100%;
	font-weight: normal;
	font-variant: normal;
	width: auto;
	clear:none;
}
#title h1 a{

}
#title h1 img{

}
#title h1 span {
	position:absolute;
	top:13px;
	right:50px;
	width:500px;
	text-align:right;
	margin:0;
	padding:0 0.3em 0.3em 0.3em;
	/*padding: 0 0 15px 0; */
}
h2 {
margin:15px 0 5px 0;
color:#660066;
font-size:110%;
clear:both;
}

h3, p.activityHead {
margin: 15px 0 5px 0;
color: #006699;
font-size:100%;

}

h4 {
	margin:15px 0;
color: #660066
font-size:90%;
	font-weight: bold;
	font-size:100%;
	color: #006699;
}

#content p {
margin:5px 0;
line-height:1.3;
}
#content p sub {
  line-height:1.5;
}
#content H1 + p:first-letter{

}
#content H1 + p:first-line{

}
/* --- Graphics --- */

p.figure img {
/* Positions graphics in main content */
margin:0.3em 0 0 0;
}

a img{/* ensure linked images do not display a border */
	border:0;
}
#content p.figure{
	border:0;
	margin:0.5em;
	padding:0.3em;
	text-align:center;
	clear:both;
}
#content p.figure span{
	display:block;
	background-color:#efefef;
}
#content p.figure.centre{

}
#content p.figure.centre img{
	text-align:center;
	margin:0 auto;

}
#content table div.ft,/* IE7 needs the specificity of table and textContain */
#content .textContain div.ft{
	height:auto;
}
#content table div.ft p,
#content .textContain div.ft p{
background-color:#efefef;
padding:0;
}
#content div.ft + p{ /* the paragraph immediately after the copyright and caption */
clear:both; /*  IE 7 seems to require this */
}
#content div.figure_text_right_wrap + p,
#content div.figure_text_left_wrap + p{
clear:none; /* needed to counteract the global effects of clearing #content div.ft + p */
}

#content div.figure_text_left{
width:98%; /* 98% needed to position correctly in IE6.  Width needed for FF 3 & Safari 3 */
float:left;
clear:left;
}
#content .figure_text_left p.caption,
#content .figure_text_left p.copyright{
text-align:left;
margin:0;
padding:0.3em 0 ;
float:left;
clear:both;
}
#content div.figure_text_left_wrap{
margin:0 0.3em 0 0;
padding:0 0.3em;
float:left;
clear:left;
}
#content .figure_text_left_wrap p.caption,
#content .figure_text_left_wrap p.copyright{
text-align:left;
margin:0 0.3em 0 0;
float:left;
clear:left;
}
#content div.figure_text_centre{
width:98%; /* 98% needed to position correctly in IE6.  Width needed for FF 3 & Safari 3 */
margin:0 auto;
padding:0 0.3em;
float:none;
clear:both;
}
#content .figure_text_centre p.caption,
#content .figure_text_centre p.copyright{
text-align:center;
margin:0 auto;
padding:0.3em 0 ;
float:none;
clear:both;
}
#content div.figure_text_right{
width:98%; /* 98% needed to position correctly in IE6.  Width needed for FF 3 & Safari 3 */
margin:0;
padding:0 0.3em;
float:right;
clear:right;
}
#content .figure_text_right p.caption,
#content .figure_text_right p.copyright{
text-align:right;
margin:0;
padding:0.3em 0 ;
float:right;
clear:both;
}
#content div.figure_text_right_wrap{
margin:0;
padding:0 0.3em;
float:right;
clear:right;
}
#content .figure_text_right_wrap p.caption,
#content .figure_text_right_wrap p.copyright{
text-align:right;
margin:0;
padding:0.3em 0 ;
float:right;
clear:right;
}

#content p.figure.right{
text-align:right;
float:none;
clear:both;
margin:0.5em 0 0 0;
}

#content p.figure.left{
text-align:left;
float:none;
clear:both;
margin:0.5em 0 0 0;
padding:0;
}
#content p.figure.right.wrap{
	float:right;
	clear:both;
	margin:0;
}
#content p.figure.left.wrap{
	float:left;
	clear:none;
	margin:0 0.5em 0 0;
}
#content p.figure.right.wrap +p{
	clear:none;
}
#content p.figure.left.wrap +p{
	clear:none;
}
#content p.figure.right +p{
	clear:right;
}
#content p.figure.left +p{
	clear:left;
}
#content  p.caption {
/* Caption text style for graphics rendered in main content */
color:#006699;
font-size:90%;
max-width:100%;
}
#content p.copyright{
color:#4B6075;
font-size:80%;


max-width:100%;
}
/* end of graphics styles */


strong, b {
/* Used to emphasise text within a paragraph */
font-weight: bold;
color: #003366;
}

blockquote {
/* Positions the text style for quotations and extracts.
IMPORTANT: the text is styled with 'blockquote p' */
background: #F2FFFC;
margin:5px 10px 5px 50px;
max-width:445px;
}

blockquote p {
/* Renders the text styles for quotations and extracts */
margin:5px 0;
font-size:95%;
color:#003366;
}

cite {
}

em, i {
/* Used for any italicised texts in a paragraph.
Its recommended that the values are inherited from 'p'
as it could conflit visually with 'strong' */
}

/* popups and audio pages already have a print link so remove this second one in the footer */
#popup a.printLink,
#audio a.printLink{
	display:none;
}
abbr, acronym
{
	cursor:help;
	border-bottom:1px dashed #000;
}

code {
font-family:Courier, "Courier New", monospace;
font-size:110%;
display: block;
white-space: pre;
}

pre
{
	margin:0;
}



/* --------------------- Standard lists --------------------- */
#content ul,#content ol{
max-width:40em;
padding-left:2em; /* left padding needed if max-width is used. */
margin:0;
}

#content li {
margin:0;
color:#000;
}

li p {
/* Positions a list item's second or subsequent paragraph(s) */
margin:5px 0;
color:#000;
vertical-align:text-top;
}

ul li ul li {
/* Unordered list nested once */
list-style-type:circle;
margin:0.3em 0 0.3em 0em;
display:list-item;
}

ol li ol li {
/* Ordered list nested once */
list-style-type: lower-alpha;
margin :5px 5px 5px 35px;
display:list-item;
}

ol li ol li ol li {
/* Ordered list nested twice */
list-style-type:lower-roman;
margin :5px 5px 5px 35px;
display:list-item;
}

dl{
	border:1px solid #5A5A5A;
	padding:0;
	margin:0;
	width:96%;
	max-width:600px;
}
dt{
	border-bottom:1px solid #5A5A5A;
	background-color:#EDF1F5;
	font-weight:bold;
	color:#003366;
	padding:3px;
	margin:0;
}
dd{
	padding:3px;
	margin:0;
}
/* --------------------- Table of content classes --------------------- */
#content div.toc{
	border:solid 1px #efefef;
}
#content div.toc h2{
	border-bottom: 1px dotted #999;
	background-color:#efefef;
	margin:0;
	padding:0 0 0 0.5em;
}
#content div.toc ul
{
	padding:0.5em;
}
#content div.toc li{
	list-style-type:none;
}
#content div.toc a.tocLink:link{
}
/* --------------------- Pseudo classes --------------------- */

/* --- Standard links --- */

a:link {color:#006699;}
a:visited {color:#993399;}
a:focus {color:#990066;}
a:hover {color:#990033;}
a:active {color:#993399;}

a.wikipedia{
	background: url(graphics/wikipedia.png) no-repeat center right;
	padding-right:18px;
	text-decoration:none;
	border-bottom:dotted 1px #999;
}
a.dictionary{
	background: url(graphics/dict.gif) no-repeat center right;
	padding-right:18px;
	text-decoration:none;
	border-bottom:dotted 1px #999;
}
p.expand{
clear:both;
}
#content div.toggle p.expand,
#content div.toggle div.toggle{ /* nested expandable sections */
	margin-left:1em;
}
a.expandable{
	padding-left:18px;
	display:inline-block; /* fixes an IE bug where the first plus is not clickable */
}
a.closed{
	background: url(graphics/plus.png) no-repeat center left;
}
a.open{
	background: url(graphics/minus.png) no-repeat center left;
}
/* --------------------- footer --------------------- */
#footer {
	position: relative;
	left: 50%;
	clear:both;
	width:878px;
	font-size:0.8em;
	color:#000;
	border-top:0.4em solid #99CCCC;
	margin-top: -5.5em;
	height:3em;
	border-right: 1px solid #006699;
	border-bottom: 1px solid #006699;
	border-left: 1px solid #006699;
	margin-left: -450px;
	padding:1em;
	margin-top: -5.5em; /* negative value of (Height + Padding + Borders)+ small amount to cover browser differences in rounding.  Better to use a consistent unit (em or px) - easier to add */
	height:3em;
}


#show #nav,
#popup #nav{
float:none;
text-align:right;
width:100%;
margin:0;
padding:0;
border-right: 1px solid #006699;
border-left: 1px solid #006699;

margin:0;
}
#popup #nav li,
#show #nav li{
border:none;
}
#show #nav ul#navList li a:link,
#show #nav ul#navList li a:visited,
#show #nav ul#navList li a:focus,
#show #nav ul#navList li a:hover,
#show #nav ul#navList li a:active,
#popup #nav ul#navList li a:link,
#popup #nav ul#navList li a:visited,
#popup #nav ul#navList li a:focus,
#popup #nav ul#navList li a:hover,
#popup #nav ul#navList li a:active{
	color:#fff;
	border:none;
	}
#footer p{
margin:0;
}
#footer p#secondaryFooterInfo{
max-width:100%;
padding:0.5em 0;
}
#footer #copyright{
	/*background:url(graphics/neals.gif) no-repeat left;*/
	padding:5px 0 5px 65px;
}
#footer #print{
	padding-left:1em;
}
#footer p#pagination{
	padding:0;
	margin:0 auto;
	height:2em;
	width:450px;
}
#footer p#pagination span{
	width:18%;
	float:left;
}
#footer p#pagination span#start{
}
#footer p#pagination span#back{
}
#footer p#pagination span#location{
	text-align:center;
}
#footer p#pagination span#next{

	text-align:right;
}
#footer p#pagination span#end{
	float:right;
	text-align:right;
}

a.printLink
{
	margin-left:1.5em;
}
a.printLink:link,
a.printLink:visited
{
	color:#575757;
}
a.printLink:focus,
a.printLink:hover,
a.printLink:active
{
	color:#660066;
}
/* --- Bottom navigation styles --- */

p.navBot {
/* Text style */
color:#575757;
font-size:0.8em;
text-align:right;
margin-right:15px;
margin-top:0;
padding-right:0;
max-width:100%;
}
a.navBot{
font-weight:normal;
}
a.navBot:link {
color:#575757;
}

a.navBot:visited {
color:#575757;
text-decoration:none;
}


a.navBot:focus, a.navBot:hover, a.navBot:active {
color:#003366;
}

/* ----------------- Activity styles ---------------- */

.actdiv {
background-color:#fff;
padding:0.5em;
width:90%;
border:1px #5A5A5A dashed;
margin:0.5em 0;
}

.actdiv  p {
/* Paragraph text style for activity.
Questions are tagged within strong tags and rendered using the the style for 'strong' */
margin:0.5em;
color:#000;
font-size:100%;
}
.activityTitle{
font-weight:bold;
}
label.activityLabel{

}
input{

}
.actinput, textarea {
/* Renders the text styles for 'input' box (missing word activities) and
'textarea' (short answer question activities). */
font-family:Arial, Verdana, helvetica, sans-serif;
font-size:95%;
color:#000;
}
.shortAnswerTextarea{
	width:95%;
}
.actinput {
/* Renders the margins either side of the 'input' box */
margin:0;
padding:0;
width:3em;
display: block;
float: left;
}
p.actbutton{
padding:1em 0;
margin:0.1em 0;
}
p.actbutton a{
/* These attributes render the look and feel of the feedback buttons */
/* top, right, bottom, left */
margin:0;
font-family:Verdana, helvetica, Arial, sans-serif;
font-size:90%;
text-decoration:none;
font-weight:bold;
padding:0.3em;
border-bottom:2px #660099 solid;
border-right:2px #996699 solid;
background-color:#DFF0FF;
color: #006699;
}

p.actbutton a:link {color: #006699;}
p.actbutton a:visited {color:#006699;}
p.actbutton a:focus {color:#660066;}
p.actbutton a:hover {color:#993399;}
p.actbutton a:active {color:#660066;}
/* --- Table style for JavaScript activities --- */

table.activity {
/* If this table is not rendered in the '.actfieldset' then
its recommended that the width not exceed 96% */
margin:0 0 15px 0;
width:100%;
border-collapse:collapse;
}

table.activity td {
/* Contains the text style for JavaScript activities */
font-family:Verdana, Helvetica, Arial, sans-serif;
color:#000;
background-color:transparent;
padding:0;
border:0 #000 solid;
vertical-align:middle;
}

/* -------------------- Styles for tables ------------------- */

/* --- Tabular table styles --- */

table.tabular {
/* Its recommended that the width not exceed 96% */
width:96%;
margin:10px 0 10px 0;
border: 1px solid #99CCCC;
border-collapse:collapse;
min-width:0;
max-width:600px;
font-family:Verdana, Helvetica, Arial, sans-serif;
}

caption {
/* Accessibility related captions for tabular tables */
/* top, right, bottom, left */
padding:1em 0 0.5em 0;
color:#003366;
font-weight:bold;
text-align:left;
}

table.tabular th {
	background: #F2FFFC;
	font-size: 90%;
	border-top: 1px solid #99CCCC;
	border-right: 1px solid #99CCCC;
	color: #006699;
	border-left: 1px solid #99CCCC;
	border-bottom: 1px solid #0099CC;
	text-align: center;
	font-weight: bold;
}

table.tabular td {
/* Contains the default text style for tabular data.
IMPORTANT: Its recommended that text within tabular tables
appear within p tags and styled with 'td p' */
color:#000;
font-size:90%;
text-align:left;
padding:3px 5px;
background-color:#fff;
border:1px #99CCCC solid;
vertical-align:top;
}
table.tabular th.ta,
table.tabular td.ta,
table.layout th.ta,
table.layout td.ta{
	vertical-align:top;
}
table.tabular th.ma,
table.tabular td.ma,
table.layout th.ma,
table.layout td.ma{
	vertical-align:middle;
}
table.tabular th.ba,
table.tabular td.ba,
table.layout th.ba,


table.layout td.ba{
	vertical-align:bottom;
}
table.tabular  p {
/* Paragraph text style for tabular tables */
margin:5px 5px 5px 0;
color:##003366;
}

table.tabular li {
/* Ordered and unordered list style for tabular tables */
color:#003366;
margin:0 5px 5px -10px;
display:list-item;
text-align:left;
}

table.tabular ol li ol li {
/* Nested ordered list for tabular tables */
list-style-type:lower-alpha;
margin:5px 0 0 -10px;
}

table.tabular p.caption {
/* Caption text style for graphics rendered in tabular tables */
margin:5px;
color:#660066;
text-align:left;
}

table.tabular img {
/* Positions graphics inserted in tables */
margin:0;
}


/*-----the first element after a layout table should be cleared  ------- */
table.layout{
	padding:0;
	margin:0;
	border-collapse:collapse;
}

table.layout tr {
	vertical-align:top;

}

.layout + * {
clear:both;
}

/* --------------- Feedback styles -------------------
IMPORTANT: These styles render the texts in the feedback windows */

h1.feedback, p.feedback  {
margin:15px;
}

/*---------------Audio styles -------------------------- */
.transcript{
	visibility:visible;
}
.audio{
	padding:0.5em;
}
/*---------------End of audio styles -------------------------- */
form{
	margin:0;
	padding:0;
}
.right{
	float:right;
}
.left{
float:left;
}
.wrap{
}
.forty{
width:40%;
}
.clear{
clear:both;
}
.clearLeft{
clear:left;
}
.qStem{
/*stem for a question */
font-weight:bold;
}
.printOnly{/* for footnoteLinks */
	display:none;
}
/*skip links */
p.skip, p.skip a {
	position:absolute;
	left: 0;
	top:-20px;
	padding: 0 0.5em;
	margin:0;
	width: 13.2em;
	z-index: 0;
	background-color:#000;
}
.skip a:focus, .skip a:active {display: inline; z-index: 2;
   border: solid black 1px; color: #cc0; text-decoration: none;
   position: absolute; top:20px; left: 0}
.skip a#cont {
	position: absolute;
	top: -100px;
	width: 13.2em;
}
.skip a#cont:focus, .skip a#cont:active {
   top:0;
   left:0;
   z-index: 2
}
.skip a:hover {cursor: default}
.ui-tabs .ui-tabs-hide { display: none !important; }
