/*  
FILE NAME: ips2.css 
DATE MODIFIED:13 August 2007
DESCRIPTION: This style sheet is the default standard for the CLI Resource Management Framework (RMF) CD-ROM and HTML products.
Please do not alter. All style variables are developed on 'unit2.css'. 
AUTHOR: Centre for Learning Innovation (CLI), New South Wales Department of Education and Training
VERSION:  6.2.4

/* ------------------ Core Layout styles --------------------- */
body {
color:#000;
font-family:Verdana, helvetica, Arial, sans-serif;
font-size:75%;
margin:0;
background-color:#FFF;
}

.lyrTop {
background-color: #494949;
height:24px;
width:100%;
padding:10px 0 0 0;
top:0;
z-index:1;
}

/* --- Content Layers --- */

.lyrContent {
position:relative;
width:97%;
vertical-align:top;
height:80%;
margin:0;
padding:0 0 15px 15px;
background-color: transparent; /* background colour is declared in body */
}

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

h1 {
margin:15px 0;
color:#006699;
font-size :130%;
}

h1.LOTitle {
margin:10px 0 -10px 0; 
padding-bottom:3px;
color: #575757; 
border-bottom:1px dotted #B1B1B1;
font-size:85%; 
}

h2 {
margin:15px 0 5px 0;
color:#003366;
font-size:115%;
}

h3, p.activityHead {
margin: 15px 0 5px 0;
color: #575757;
font-size:110%;
}

h4 {
/* Recommended for use in LOs only */
margin:15px 0;
font-size:100%;
font-weight: bold;
font-size:100%;
}

/* ------------------- Block level values ------------------- */

p {
margin:5px 0;
max-width:400px;
line-height:1.3;
}

p.caption {
/* Caption text style for graphics rendered in main content */
margin:0 0 10px 0;
color:#204162;
font-size:90%;
}

strong, b {
/* Used to emphasise text within a paragraph .
   Important: activity questions use this style*/
font-weight: bold;
}

blockquote {
/* Positions the text style for quotations and extracts.
IMPORTANT: the text is styled with 'blockquote p' */
margin:5px 10px 5px 50px;
max-width:345px;
}

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' */
}

.footer {
/* Renders copyright text at the end of each page */
margin:40px 20px 0 0;
color:#575757;
font-size:0.8em;
padding:2px 0 6px 65px; /* left padding to deal with neals logo */
background:url(graphics/neals.gif) no-repeat left;
border-top:1px #e4e4e4 solid;
max-width:100%;
}
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;
}
/* 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;
}

/* --- Main content image --- */

img {
/* Positions graphics in main content */
margin:10px 0 5px 0;
}

/* --------------------- Standard lists --------------------- */
ul, ol{
max-width:600px;
}
li {
margin:3px 0 3px 35px;
color:#000;
}

li p {
/* Positions a list item's second or subsequent paragraph(s) */
margin:5px 0;
color:#000;
min-width:0;
max-width:400px;
}

ul li ul li {
/* Unordered list nested once */
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;
}

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;
}

/* --------------- Top Navigation Menu styles --------------- */

.topNav {
/* Style for the containing span around menu links and separators */
font-size:1em;
color:#fff;
margin-left:15px;
}

.topNavCurrent {
/* This indicates "where you are" */
margin-left:3px;
margin-right:3px;
color:#fff;
text-decoration : underline;
font-weight:bold;
}

/* --------------------- Pseudo classes --------------------- */

/* --- Standard links --- */

a:link {color:#000;}
a:visited {color:#575757;}
a:focus {color:#003366;}
a:hover {color:#003366;}
a:active {color:#575757;}

/* --- Top Navigation Menu links --- */
a.topNav{
margin-left:5px;
margin-right:4px;
text-decoration:none;
font-weight:bold;
}
a.topNav:link {
color:#fff;
}

a.topNav:visited {
color:#fff
}

a.topNav:focus, a.topNav:hover {
color:#DCFFFF;
text-decoration:underline;
}

/* --- 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 {
/* Its recommended that the width not exceed 96%.*/
background-color:#fff;
width:83%;
padding:10px;
border:1px #5A5A5A dashed;
margin-left:0;
}

.actdiv  p {
/* Paragraph text style for activity. 
Questions are tagged within strong tags and rendered using the the style for 'strong' */
margin:5px;
color:#000;
font-size:100%;
}

.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;
}

.actinput {
/* Renders the margins either side of the 'input' box */
margin:0;
padding:0;
}

.actbutton {
/* 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:2px;
padding-left:6px;
border-bottom:2px #5A5A5A solid;
border-right:2px #5A5A5A solid;
background-color:#e5e5e5;
}

a.actbutton:link {color:#000;}
a.actbutton:visited {color:#575757;}
a.actbutton:focus {color:#003366;}
a.actbutton:hover {color:#003366;}
a.actbutton: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 --- */

table.tabular {
/* Its recommended that the width not exceed 96% */
width:96%;
margin:10px 0 10px 0;
border-collapse:collapse;
min-width:0;
max-width:600px;
}

caption {
/* Accessibility related captions for tabular tables */
/* top, right, bottom, left */
padding:1em 0 0.5em 0;
color:#000;
font-weight:bold;
text-align:left;
}

table.tabular th {
font-family:Verdana, Helvetica, Arial, sans-serif;
color:#003366;
font-weight:bold;
padding:3px 5px;
background-color:#EDF1F5;
border:1px #5A5A5A solid;
vertical-align:top;
}

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' */
font-family:Verdana, Helvetica, Arial, sans-serif;
color:#000;
font-size:90%;
text-align:left;
padding:3px 5px;
background-color:#fff;
border:1px #5A5A5A solid;
vertical-align:top;
}

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

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:#204162;
text-align:left;
}

table.tabular img {
/* Positions graphics inserted in tables */
margin:0;
}

/* ---- Layout table styles --- */

table.layout {
/* This table is used to vary the layout of content. 
IMPORTANT: It should not be used for tabular tables */
margin:10px 0 20px 0;
width:83%;
border-collapse:collapse;
min-width:0;
max-width:600px;
}

table.layout th {
font-family:Verdana, Helvetica, Arial, sans-serif;
color:#204162;
font-weight:bold;
text-align:left;
padding:3px 5px;
background-color:#EDF1F5;
border:0;
vertical-align:top;
}

table.layout td {
/* Contains the default text style for layout data.
IMPORTANT: Its recommended that text within layout tables 
appear within p tags and styled using 'table.layout p' */
font-family:Verdana, Helvetica, Arial, sans-serif;
padding:0 0 3px 0;
background-color:#fff;
border:0;
color:#575757;
text-align:left;
vertical-align:top;
}

table.layout p {
/* Paragraph text style for layout tables */
margin:5px 10px 5px 10px;
color:#575757;
}

table.layout p.caption {
/* Caption style for graphics rendered in layout tables */
margin:5px;
color:#204162;
text-align:left;
}

table.layout img {
/* Positions graphics inserted in layout tables */
margin:0;
}

/* --- List style used within Layout tables --- 
           (not for tabular tables) */

table.layout li {
/* Applied to ordered and unordered lists in layout tables */
margin:5px 5px 5px 20px;
list-style-position:outside;
color:#575757;
display:list-item;
text-align:left;
}

/* --- Layout table links --- */
a.layout {
font-size:100%;
font-weight:normal;	
}
a.layout:link {color:#575757;}
a.layout:visited {color:#575757;}
a.layout:focus {color: #003366;}
a.layout:hover {color:#003366;}
a.layout:active {color: #666;}

/* --------------- Feedback styles ------------------- 
IMPORTANT: These styles render the texts in the feedback windows */

h1.feedback, p.feedback  {
margin:15px;
}

/*---------------Audio styles -------------------------- */
#audioDiv
{
	position:relative;
	width:100%;
	height:300px;
	top:0;
	left:0;
	padding:0;
	border:1px solid #333;
}
#audioMedia
{
	position:absolute;
	top:0;
	left:0;
	width:280px;
	padding:5px;
}

#audioShow
{
	position:absolute;
	display:none;
	top:60px;
	right:20px;
}
#transcript
{
	visibility:visible;
}
#audioText
{
	width:270px;
	height:280px;
	overflow:auto;
	padding:10px;
	margin:0 0 0 290px;
	border-left:1px dotted #333;
}

#audioText h2
{
	font-size:90%;
	margin:0 0 5px 0;
	padding:0 0 5px 0;
	color:#003366;
	border-bottom:1px dotted #5A5A5A;
}

#transcript p
{
	margin:0;
	padding:0;
}