/*  
FILE NAME:project.css 
DATE MODIFIED:7 FEB 2011
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: Bocca
*/

body {
color:#000;
font-family:Verdana, helvetica, Arial, sans-serif;
font-size:75%;
background-color:#999;
background-image:none;
margin:0;
padding:0;
height: 100%;
line-height:1.4;
}

#logo{
float:right;
margin:-25px 25px;
}

#standard{
background-color:#999;
}

#nonFooter
{
	width:80em;
	/*margin: 20px auto 0 auto;*/
	min-height: 98%;
	background:#fff url(graphics/slice.jpg) no-repeat bottom;
	border: 2px solid white;
	margin:0 auto;
}

#globalNav{
	height:3em;
	width:100%;
	margin:-35px 0 0 0;
	background-color:transparent;
}
	

body#popup {
background-color:#fff;
color:#000000;
}

	 
body#popup #nonFooter{
	background: #FFF url(graphics/slice.jpg) repeat-x bottom;
	
	width:480px;

}
	
body#popup #content{
	top:20px;
	background-color:transparent;
	width:455px;
	

}
body#popup p{
	
	color:#000;
	padding-bottom:1em;
}	
	
body#popup #footer{
	
	font-size:smaller;
	width:480px;
	

}	
	
body#popup h1{
	color:#003366;
	margin-top:0px;	
	margin-left:0;
}
body#popup h2{
	padding-bottom:0.3em;
}

	
/*-------------------------- navigation --------------------- */

#globalNav ul{
	padding:0;
	margin:0.5em 0 0 1em;

}

#popup #nav{
	background-color:#0B5D5F;
	margin:0;
	padding:0.5em 0;
	width:100%;
}

#standard #nav{
	display:none;
}

#nav ul{
	background-color:#0B5D5F;
	padding:0;
	margin:0 0 0 1em;
	top:0;
}
#globalNav li
{	display:inline;
	padding:0.2em 0.75em 0.2em 0.75em;
	width:40%;
	margin:0;
	list-style:none;
	color:#fff;	
	border-right:2px solid white;
}
#globalNav ul ul{
	
}
#globalNav li a{
	text-decoration:none;
	font-weight:bold;
/*	border:1px red solid;
*/	color:#FFFFFF;
	
}
#globalNav li.current a {
/* This indicates "where you are" */
color:#fff;
}
#globalNav li.current li a:link,
#globalNav li.current li a:visited,
#globalNav li.current li li a:link,
#globalNav li.current li li a:visited{
/* Needed to eliminate children of current being given the same state */
color:#fff;
}
#globalNav li.current li a:focus,
#globalNav li.current li a:hover,
#globalNav li.current li a:active,
#globalNav li.current li li a:focus,
#globalNav li.current li li a:hover,
#globalNav li.current li li a:active{
/* Needed to eliminate children of current being given the same state */

color:#FFFFFF;
}
#bookmarkLink {
	position:absolute;
	top:0px;
	right:20px;
}
#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:#ff0;
text-decoration:none;
}

#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:#FFF;
text-decoration:underline;
}

#popup #nav li, 
#show #nav li {
border:none;
padding:1px 2px 2px 2px;
	}

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

#content h1{
	display:none;
	font-size:1.5em;
	margin:0px -20px -10px 0px;	
}

.textContain{

}

#title {

	background-color:transparent;
	background-image:none;
	padding:0 0 0.5em 0;
	margin:0;
	height:50px;
}

#title img{
	
	padding:0px 0 0px 0px;
	margin:0;

}
#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;
}
#popup #title{
	display:none;
}
#title h1 {
	font: italic 150% "Lucida Grande", Arial, sans-serif;
	position: relative;
	margin:0;
	text-shadow: black 0em 0em 0.1em;
	background-image:none;
	padding-left:0px;
	
}
#title span {

	background-image:none;

	display: block;
	width: 100%;
	/*height: 29px;*/
	color:#006699;
	
}

h1 {

	margin:15px 0;
	font-size:90%;
	color:#00595B;
/*	background:url(graphics/input-mouse.gif) no-repeat left bottom;
	padding-left:25px;*/
}

h2 {
	width:90%;
	font-size:115%;
	margin:0;
	color: #0B5D5F;
	padding:10px 0 0 0;
}

/*h3, p.activityHead {
	margin: 25px 0 5px 0;
	color: #575757;
	font-size:110%;
	
	padding-left:25px;
	padding-top:3px;
}*/

h3 {
	width:90%;
	font-size:115%;
	margin:0;
	color: #0B5D5F;
	padding:0;

}
h4 + h4 {
                
	border-left:2px solid #666;
	
}

h4 a:link, h4 a:visited{
	text-decoration:none;
	color: #0B5D5F;
}



h4 a:hover{
	text-decoration:underline;
	
	color: #0B5D5F;
}


h4 {
margin:15px 0;
font-size:100%;
font-weight: bold;
font-size:100%;
color: #0B5D5F;
}


#content p {
margin:0px 30px 0 0px ;
line-height:1.3;
}

#content p.figure .caption{
	
	padding:3px 0 0 10px;
	background-color:transparent;
}




#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 --- */



div.figure img {
/* Positions graphics in main content */

}
a img{
	/* ensure linked images do not display a border */ 
	border:0;
}
div.figure{
	border:0;
	margin:1em;
	padding:0.3em;
	text-align:center;
	
}
div.figure.right{
text-align:right;
float:none;
margin:1em 1em 1em auto;
}
div.figure.right.wrap{
	float:right;	
	margin:1em;
}
div.figure.right.wrap +p{
	clear:none;
}
div.figure.right +p{
	clear:right;
}

div.figure.left{
text-align:left;
float:none;
margin:1em auto 1em 1em ;

}
div.figure.left.wrap{
	float:left;
	margin:1em;
	
}
div.figure.left.wrap +p{
	clear:none;
	
	
}
div.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 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' */
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' */
}

/* 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;
vertical-align:top;
}

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{
/*
border:1px solid red;*/
margin:0 0 0 0px;
}

table.layout ol li{

/*border:1px solid red;*/
margin:0 0 0 -20px;
}
#content table.layout td p{
	margin-top:0.5em;
}


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


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

/* --- Standard links --- 
a:link, a:visited, a:active{
	color:#003366;
}
a:hover{
	color:#000099;
}*/

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


p.expand{
clear:both;
}
a.expandable{
	padding-left:18px;
}
a.closed{
	background: url(graphics/plus.png) no-repeat center left;
}
a.open{
	background: url(graphics/minus.png) no-repeat center left;
}
#content {
	padding:0 3em 3.5em 1em;
	top:0px;
	float:none;
	}
/* --------------------- footer --------------------- */

#footer {
	font-size:12px;
	position:relative;
	clear:both;
	margin:-3.5em auto 2em auto;
	width:80em;
	padding: 0;
	background-color:#E8E8E8;
	height:3.5em;
	text-align:left;
	color:#575757;
	border-top:2px #fff dashed;
 }
 
 
#footer p{
	margin:0;
	padding:0 0 2em 0;
	top:3px;
	left:0;
	background-image:none;
	
}

#footer img{
	position:relative;
	margin:0.2em 0 0em 0;
	padding:0 0.5em;
}
#footer #DET{
	/*position:absolute;
	border:1px red solid;
	*/
	top:-6px;
	left:5px;
	padding:0;
}
#footer #CLIC{
	/*position:absolute;border:1px green solid;*/
	left:-20px;
	top:-6px;
	padding:0;
}
#footer p#secondaryFooterInfo{
	max-width:100%;
	padding:0.5em 0;
}
#footer #copyright{
	background:transparent url no-repeat scroll left bottom;
	color:#000000;
	padding:0 0 3px 65px;
	display:inline-block;
	margin-top:0;
	left:50%;
}
#popup #footer #copyright{
	left:15%;
}

#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:#003366;
}
/* --- 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 --- */

p.figure + *{

clear:both;

}


table.layout td {
vertical-align:text-top;

}


table.tabular {
	/* Its recommended that the width not exceed 96% */
width:99%;
	margin:-10px 0px 10px 30px;
	border-collapse:collapse;
	min-width:0;
	max-width:600px;
	font-family:Verdana, Helvetica, Arial, sans-serif;
background: url(graphics/h1_back1.jpg) repeat-y top right;

	
}

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




#content table div.ft p, #content .textContain div.ft p {

	background-color:transparent;

}


table.tabular th {
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' */
color:#000;
font-size:90%;
text-align:left;
padding:3px 5px;
/*background-color:#fff;
border:1px #5A5A5A solid;*/
vertical-align:top;
}

.cell2 h3{
/*background:url(graphics/office.gif) no-repeat left bottom;*/

}


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

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


/*-----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;
	
	}
.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{
	border:dotted 1px #999;
	padding:0.5em;
}
/*---------------End of audio styles -------------------------- */

.right{
	float:right;
}
.left{
float:left;
}
.wrap{
}
.forty{
width:40%;
}
.clear{
	clear:both;
}
.clearLeft{
	
	clear:left;

}

.clearLeft p{
	width:90%;
}

.qStem{
/*stem for a question */
font-weight:bold;
}
.push {
	height:0;
}