/*  
FILE NAME:project.css 
DATE MODIFIED:09 MAR 2015 11:00
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: dbocca
*/
html {

}
body {
 margin:0;
 
}

#banner{
	background:#66767B url(graphics/banner_bgd.jpg) right top repeat-x;
/*    margin: 0 auto;
    position: relative;
	width:100%;*/
	
	}
#banner p{
	color: #FFFFFF;
	font-family:Futura, Arial, sans-serif;
    font-size: 1.4em;
	padding:0 2em;
    margin: 0 auto;
  	width:800px;

	}
#banner span{
	font-family:Futura, Arial, sans-serif;
	color: #fff;
	margin:0 0 0 -0.6em;
  	vertical-align:2em;
  	font-size:1.5em;

	}
#banner #DECbanner {
	padding: 0;
    margin: 0 auto;
	width:800px;
	}
	
#banner #DECbanner img {
	margin-left:-2em;	
	padding: 1em 0;
	}
#nonFooter {
	
	min-height:98%;
	margin:0;
	background:#22262B url(graphics/bgd.jpg) repeat;
	background-size:cover;
	background-position:center;
	
}

nav {
    margin: 0;
    padding: 0;
	font: 110% Futura-light, Arial, sans-serif;
	width:90%;
	
}
a:link {
	color: #00535E;
	text-decoration: none;
	font-weight: bold;
}
a:hover, a:focus {
    
	text-decoration:underline;
}

a.expandable {
    margin-top:0.5em;
}

.newWindow #nonFooter {
	width:66em;
}
body#popup {
	background:#fff;
}


body#popup.wide #nonFooter {
	width:850px;
	
}
body#popup.wide #content {
	width:800px;
	
}

#title h1 span {
	color:#484848;
	font-size:150%;
    height: 80px;
	padding-top:0.1em;
	padding-left:0.6em;
    text-align: justify;
    width: 820px;
	
	/*background-image:url(graphics/clic_bgd.png);*/
	
}



#bookmarkLink {
	position:absolute;
	top:-25px;
	right:20px;
}
#popup #title{
	
	height:0;
	margin-top:0;
	
	}
	
#popup #header h1{

	padding: 0.01em 0;
	font-size:18px;

}	
#popup #header{
	background:#fff;
	padding: 0.01em 0;

}	

#show #header{
	display:none;
	background:none;
	width:400px;
	margin-left:-10px;
	text-align:left;
	text-shadow:none;
}
#show #title h1 span {
	display:none;
	color:#fff;
	background:none;
	height:0;
	padding-left:5em;
	font-size:larger;
}

#show #title{
		display:block;
	}
	
#popup #title h1 span {
	display:none;
	/*color:#000;
	padding:0.6em 1.5em 0 0;
	width:400px;
	margin-top:30px;
	margin-left:-10px;
	text-align:left;
	text-shadow:none;*/
}
.newWindow #title h1 span {
	color:#fff;
	padding:0.2em 1.5em 0 2em;
	width:660px;
	margin-top:0;
	margin-left:0.2em;
	text-align:left;
}


#show footer #copyright {

	margin-left:30%;
}


#popup footer p, #show footer p {
	top:0px;

}
#popup #content h1{
	display:block;
	font: 150% "Gotham book", Arial, sans-serif;
	padding-bottom:20px;
	
	}
	
#show footer{
	margin-top: -2.3em;
}

#popup footer p{
	background-color: #fff;
    box-shadow: 0 0px 0px #fff;
    
}
body#popup #nonFooter {
	border:3px solid #00535E;
	margin:2em auto 4em;
	width:500px;
	min-height:80%;
}
body#popup #content {
	margin:1em 1em 0 1em;
	padding:1em;
	width:450px;
}

body#popup #content p.figure.centre img {
	margin:10px auto 5px;

}


.newWindow #content {
	top:-65px;
}

body#popup #content p {

}


body#popup p {
	color:#000;
	padding:0 1em 0 1em;
}
body#popup footer {
	font-size:0.7em;
	border: none;
	background-color: transparent;
}

body#popup h2 {
	/*font: 120% "Gotham book", Arial, sans-serif;*/
	padding-bottom:0.3em;
	/*padding-left:0.9em;*/
	color:#00535E;
}
body#popup h3 {
	color:#00535E;
}

#popup #content a:visited {
	color:#009999;
}
#popup #content a:focus,
#popup #content a:hover,
#popup #content a:active {
	color:#666666;

	
}
body#popup table.layout {
	margin:0 3em 0 1em;
}



footer #copyright a:link.popup  {
	color:#fff;
	text-decoration:underline;
	
}

footer #copyright a:visited {
	color:#C0C0C0;
	text-decoration:underline;
}
/*-------------------------- navigation --------------------- */

#globalNav ul {
	
}

#popup #nonFooter nav {
	
	margin-top:-30px;
	/*right:25px;
	width:30%;
	float:none;
	text-align:right;
	position:absolute;*/
}

#popup #nonFooter nav ul {
	margin:0;
	padding:0;
	text-align:right;
	border:none;
}

#standard nav{
	background-color:transparent;
    color: #000000;
    height:0;
    padding:0;
	width:800px;
    margin:-0.3em auto 0 auto;
}

nav ul {
   	background-color: transparent;
    margin: 0 0 0 -0.9em;
    padding: 0;
    top: -18px;

}


nav li {
	display:inline;
	font-size:1em;
	color:#fff;
	margin:0 0 0 0;
	font-weight: bold;
	padding:8px 1px;
}

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 {
	color:#FFF;
	background-color:#484848;
	text-decoration:none;
	border-top-right-radius: 7px;
	border-top-left-radius: 7px;
}

nav li a {
	
	margin:1em 0;
	font-weight:bold;
	text-decoration:none;
	padding:8px 15px;

}

#popup nav ul {
	top:0;
}

nav li a:link, 
nav li a:visited, 
nav li a:active {
	color: #00535E;
	

}
nav li a:focus, nav li a:hover {
/*	color:#FFF;
	background-color:#484848;
	text-decoration:none;
	margin:1em 0;*/
	
}

#show nav{
	
	padding-top:25px;
	float:clear;
	}
#show nav li a:link{
	color:#FFF;
	
	}

#popup nav li, #show nav li {
	border:none;
	padding:5px 2px 0px 2px;
	/*background: #FFF;*/
	float:right;
	margin-top:0px;
	

}

#show nav li #closeLink {
	display:none;
	

}


/* ------------------------- Headings ----------------------- */


#title {
	padding:0;
	margin:0;
    z-index: 0;
	border-bottom: 1px solid #484848;background:#22262B url(graphics/bgd.jpg) repeat;
	}
#title img {
	padding:0;
	margin:0;
}
#content p.figure a img {
	border:none;
}
#feedback #title {/* feedback title */
	background: #000 url(graphics/bgd.jpg) repeat-x left bottom;
	padding:5px 0 5px 15px;
	margin:0;
}
#feedback #title h1 {
	font: normal 180%/80% "Futura light", Arial, sans-serif;
}
#title h1 {
	font: 150% "Futura light", Arial, sans-serif;
	position: relative;
	margin: 0 auto;
	background:url(graphics/semi.png) repeat;
	
}
#title span {
	width:100%;
	margin:0 auto;
	color:#009999;

	
}
h1 {
	margin:15px 0 15px 10px;
	font-size:90%;
	color:#00535E;
}
h2 {
	width:90%;
	font-size:115%;
	margin:0;
	color:  #00535E;
	padding:3px 0 0 0;
	
}


h3 {
	
	
	margin:0;
	color: #00535E;
	padding:10px 0;
	font:bold 120% "Gotham book", Arial, sans-serif;
	
}

h4 + h4 {
	border-left:2px solid #666;
}
h4 a:link, h4 a:visited {
	text-decoration:none;
	color:  #00535E;
}
h4 a:hover {
	text-decoration:underline;
	color: #FFF;
}
h4 {
	margin:25px 0;
	font-size:100%;
	font-weight: bold;
	font-size:100%;
	color: #009999;
}
#content {	
	float:none;
	margin:0 auto;
	width:800px;
	background-color:#fff;
	border-left:0.6px #ccc solid;
	border-right:0.6px #ccc solid;
	border-bottom:0.6px #ccc solid;
}
#content h1 {

	font-size:1.5em;

}
#content p {
 	
    line-height: 1.5;
    margin: 0 0 1.2em;
}
#content li {
	color:#000;
	margin:0 0 0 5px;
}
#content p.caption {
	color:#333;
	
}
#popup p.caption {
	color:#333;
}
#content p.figure .caption {
	padding:3px 0 0 10px;
	background-color:transparent;
	color:#333;
}
#content p.copyright {
	color:#333;
}
#content p sub {
	line-height:1.5;
}
#content H1 + p:first-letter {
}
#content H1 + p:first-line {
}
#content H1 + p {
	/*margin-top:1.8em;*/
}
/* --- Main content image --- */



.cell2 figure{
	
}
.cell1 figure {
   float: right;
   margin-right: 2em;
   padding: 0 0;
}



figure a.external  {
	top:0;
	/*padding-right:0;*/
	background:none;
}

.caption a.external {
	top:0;
	padding-right:12px;
	background: url("graphics/Icon_External_Link.png") no-repeat right;
}
.copyright a.external {
	top:0;
	padding-right:12px;
	background: url("graphics/Icon_External_Link.png") no-repeat right;
}

a img {
	/* ensure linked images do not display a border */ 
	border:0;
}
figure {
	border:0;
	padding:0.3em;
	
}
figure.right {
	
	float:none;
	margin:1em 1em 1em auto;
}
figure.right.wrap {
	float:right;
	margin:1em;
}


figure.right.wrap + p {
	clear:none;
}
figure.right +p {
	clear:right;
}
figure.left {
	text-align:left;
	float:none;
	margin:1em auto 1em 1em;
}
figure.left img{
	margin:0;
}

figure.left.wrap {
	clear:both;
	float:left;
	margin: 0 1em 1em;
}
figure.left.wrap {
	clear:both;
	float:left;
	margin: 1em 1em 1em 0;
}


figure.left.wrap + p + h3{	
	clear:both;
}
/*----------------------------max-width change up from 50%------------------------*/
figure.left.wrap + p{	
	clear:right;
	max-width:95%;
	padding-top:2em;
	margin:0 1em 6em 1em;
	
}
.ui-tabs .ui-tabs-panel figure.left.wrap + p{	
	clear:right;
	max-width:100%;

}
figure.left + p {
	clear:left;
}
#content p.figure .copyright {
	padding:10px 0 0 0;
	background-color:transparent;
	font-size:smaller;
}
#content p.figure {
	margin:0 0.5em;
	padding:0 0.3em;
}
#content p.figure span {
	background-color:#000000;
}
#content div.ft {
	margin:0;
}
strong, b {
	/* Used to emphasise text within a paragraph */
	font-weight: bold;
}
blockquote {
	/* Positions the text style for quotations and extracts.
IMPORTANT: the text is styled with 'blockquote p' */
	background-color:#E8E8E8;
	border-radius: 10px;
	margin: 5px auto 5px 0;
	display:flex;
	max-width:360px;
	padding: 5px;
}
blockquote p {
	/* Renders the text styles for quotations and extracts */
	margin:5px 0;
	font-size:90%;
	color:#08535E;
	padding:10px;
}
blockquote p:first-letter{
	color: #08535E;
    float: left;
    font-family: Georgia;
    font-size: 35px;
    line-height: 20px;
    padding-left: 0px;
    padding-right:0;
    padding-top: 4px;
	
}
	
	
cite 1{
}
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 --------------------- */
ul, ol {
	/*max-width:600px;*/
}
li {
	margin:3px 0 3px 35px;
	color:#000;
	list-style-image:url(../../styles/graphics/dot.gif);	
	list-style-position:outside;
}
li p {
	/* Positions a list item's second or subsequent paragraph(s) */
	margin:5px 0;
	color:#000;
	min-width:0;
/*	max-width:395px;*/
}
ul li ul li {
	/* Unordered list nested once */
/*list-style-image: url(graphics/download.png);*/
	list-style-type:circle;
	margin :5px 5px 5px 35px;
	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;
}
table.layout ul li {
	margin:0 0 0 0px;
}
table.layout ol li {
	margin:0 0 0 -20px;
}
#content table.layout td p {
	margin-top:0.5em;
	margin-bottom:0;
	padding:0;
}
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;
}

/* --------------------- footer --------------------- */

footer {
	clear: both;
    color: #333;
    font-family: Arial,Helvetica,sans-serif;
    height: 3em;
    margin: -5.5em 0 0;
    padding:2em 0;
    position: relative;
    width: 100%;
	
	border:none;
	background-color:#484848;
	border-bottom:6px #484848 solid;
	
}
footer p {
	margin: 0 auto;
    position: relative;
	width: 500px;
}


footer #DET {
  padding:0 0 0 40px;
}
footer #CLIC{
	margin:20px 0 0 15%;
	padding:0;
}
/* --------------------- NEALS footer with NSW CLIC ------------------------------------------------------------------------------------ */
footer #NEALS{
	margin:20px 0 0 58%;
	padding:0;
}
/* --------------------- copyright footer with NSW CLIC ------------------------------------------------------------------------------------ */

footer #copyright {

	margin:0;
	color:#FFF;
}

footer #copyright img {
	padding-left:10px;
}

#popup footer #copyright {
	font-size:12px;
	top:0.2em;
	left:1.5em;
	color:#333;
 	padding: 20px 0 0 90px;
	height:20px;
	max-width:400px;
}
#popup footer #copyright img {
}
#popup #content p.copyright {
	color:#333;
}
footer a {
	font-size:12px;
	color:#fff;
	margin:0;
}
footer #print {
	padding-right:1em;
}
footer p#pagination {
 	display:none;
}
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:#003366;
}
#show #content{
	position: relative;
    top: 4em;
	/*right:4em;*/	
	width:80%;
	margin: 0 auto;
	}
	
#show #nonFooter {
	background-color:#117DA1;
	background-image:none;
	
}
	
#show .textContain{
	
	max-width: 45em;
	}
	
/* --- 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 #5A5A5A solid;
	border-right:2px #5A5A5A solid;
	background-color:#e5e5e5;
}
p.actbutton a:link {
	color:#000;
}
p.actbutton a:visited {
	color:#575757;
}
p.actbutton a:focus {
	color:#003366;
}
p.actbutton a:hover {
	color:#003366;
}
p.actbutton a:active {
	color:#000;
}
/* --- 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 --- */
.row{
	padding:0;
	}
td.cell1.row1.ta{
	margin:0 1em 0 0;
	vertical-align:top;
	}
	
p.figure + * {
	clear:both;
}

.toggle td.cell1.row1.ta{
	width:1%;!important;
	padding-right: 0.55em;
	
	margin:0 1em 0 0;
	vertical-align:top;
	}
td.cell2.row1.ta{

	width:50%;!important;
	}

td.cell2 h2{
	padding-left: 10px;
	}

td.cell2 h3 {
/*background:url(graphics/office.gif) no-repeat left bottom;*/
/*	padding-top:.7em;*/
	
	margin-bottom:-.3em;
	padding-left: 10px;

}

table.layout td {
	vertical-align:text-top;
}
table.tabular {
	/* Its recommended that the width not exceed 96% */
	width:90%;
	margin:0px 0px 10px 15px;
	border-collapse:collapse;
	min-width:0;
	max-width:670px;
	font-family:Verdana, Helvetica, Arial, sans-serif;
	background-color:#000;

}
caption {
	/* Accessibility related captions for tabular tables */
/* top, right, bottom, left */
	padding:1em 0 .5em 0;
	color:#000;
	font-weight:bold;
	text-align:left;
}
.toggle  {
	
    margin: 0 0 0 2em;
}
.textContain {
	max-width:70em;	
}

.textContain + .ui-tabs {
   
	padding-bottom:3em;
}


#content div.toggle p.expand, #content div.toggle div.toggle {
    margin-left: 0;
	margin-bottom: 4em;
}
#content table div.ft p, #content .textContain div.ft p {
	background-color:transparent;

}

#content table.tabular p {
	color:#000;
	margin:5px;
}

table.tabular th {
	color:#99CB2A;
	font-weight:bold;
	padding:3px 5px;
	background-color:#000;
	vertical-align:top;

}
table.tabular td {
	background-color:#FAF8F8;	
}

table.tabular td.ba {
	/* 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:0;
	vertical-align:top;
}



#content table.layout td.cell2 p {

	margin-top:1.5em;
	padding-right: 1em;
	/*padding-left: 1em;*/
	padding-bottom: 0.5em;
}

#content table.tabular ul, #content table.tabular  ol{
	
	padding-left:2em;
	}


#popup table.tabular p {
	/* Paragraph text style for tabular tables */
	margin:0;
	color:#000;
}
table.tabular p {
	/* Paragraph text style for tabular tables */
	margin:5px 5px 5px 0;
	color:#000;	
}

table.tabular li {
	/* Ordered and unordered list style for tabular tables */
	color:#000;
	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:#039;
	text-align:left;
}
table.tabular img {
	/* Positions graphics inserted in tables */
	margin:0;
	text-align:center;
}

/*-----the first element after a layout table should be cleared  ------- */
.layout {
	display:table;
	border-collapse:collapse;
}
.layout + * {
	clear:both;
}
.layout div {
	float:left;
	margin: 0 0.3em 0 2em;
}
.layout div.row {
	clear:both;
	width:100%;
	display:table-row;
}
.layout div.row p {
	width:95%;
}
.layout div.right {
	float:right;
}
.layout div.right wrap {
}
/* --------------- 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:0em;
}
/*---------------End of audio styles -------------------------- */

.right {
	float:right;
}
.left {
	
}
.wrap + p  + p + h3 {
	
	clear: both;
}

.forty {
	width:40%;
}
.clear {
	clear:both;
}
.clearLeft {
	clear:left;
}
.clearLeft p {
	width:90%;
}
.push {
    height:5em;
	margin-bottom:0;!important
}

#show .push{
	height:11em;
	
	}

/*---------------TABS
-------------------------- */


#popup .ui-tabs ul {
	padding-left:2em;
}

#popup .textContain li {
    margin-left:1.5em;
}

#content ul, #content ol {

    max-width: 60em;
	padding-left:1em;
 
}

.ui-tabs .ui-tabs-nav li a,
#popup #content .ui-tabs .ui-tabs-nav li a { 
	float: left; 
	text-decoration: none; 
	font-weight: normal;
	padding: 0.5em 1em;
	color:#000;
}

.ui-tabs .ui-tabs-nav li a:hover {
	color:#000;
}


.ui-tabs { 
	padding:0.2em 0.2em 4em 0.2em;
	zoom: 1;
	min-height:252px; 
	
}

.ui-tabs .ui-tabs-panel {
    font-size: 0.9em;
}





.layout td.cell2.ta .popup_wide{
	
/*	float:right;*/
	
	}


.ui-widget-header {
	background-color:#66757B;
	background-image:none;

}

.ui-tabs .ui-tabs-nav li.ui-tabs-selected a {
    color:#00535E;
	background-color:#fff;
	border-bottom:none;
}



.ui-widget-header {
	border:none;
}
/*.ui-widget-content { border:none;}*/

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
  /* For portrait layouts only */
 #banner #DECbanner {width:735px;}
 #standard nav, #content {width:750px;}
  
  #banner p{padding:0 1em;}
  
}

