#header
{
	background-color:white;
	padding:10px;
	height:auto;
	width:103%;
	margin:-10px 0px 0px -30px;
	padding-bottom:10px;
	text-align:center;
	position:fixed;
	z-index:2;
	border-bottom:6px ridge #330066;
	display:block;
}

#header h1
{
	font-family:arial;
	font-size:1.2em;
	color:#330099;
	margin:0px;
	padding:10px 10px 5px 10px;
	text-decoration:none;
	font-weight:bold;
}

#menu
{
	background-color:#9999CC;
	padding:10px;
	height:auto;
	width:103%;
	margin:55px 0px 0px -30px;
	padding-bottom:10px;
	text-align:center;
	display:block;
	position:fixed;
	z-index:2;
	border-bottom:6px ridge #FFFFFF;
	overflow: auto;
}

#titleHeader
{
	background-color:#666699;
	padding:0px 10px 0px 10px;
	height:auto;
	width:100%;
	margin:-10px auto 0px auto;
	font-family:Arial;
	text-align:center;
	display:block;
	position:fixed;
	z-index:3;
	border-bottom:4px ridge #220066;
}

#smallHeader
{
	background-color:#FFFFFF;
	padding:0px 20px 0px 20px;
	height:auto;
	width:100%;
	margin:50px auto 0px auto;
	font-family:Arial;
	text-align:center;
	display:block;
	position:fixed;
	z-index:4;
	border-bottom:4px ridge #220066;
	overflow:auto;
}

#menu2
{
	background-color:green;
	padding:10px;
	height:auto;
	width:103%;
	margin:-10px 0px 0px -30px;
	padding-bottom:10px;
	text-align:center;
	position:fixed;
	z-index:2;
	border-bottom:6px ridge #330066;
	display:none;
}

.menuHeader
{
	margin-top:10px;
	margin-bottom:0px;
	background-color:#FFFFFF;
	display:block;
	overflow: auto;
}


	
body{
	background-image:url("images/background.png");
}

#main
{
	width:100%;
}

h1
{
	font-family:arial;
	color:#110044;
	text-decoration:none;
}

h2
{
	font-family:arial;
	color:black;
	text-decoration:none;
	margin:20px 5px 10px 5px;
	font-weight:bold;
	font-size:1.1em;
	text-align:center;
}

h3
{
	font-family:arial;
	color:black;
	text-decoration:none;
	margin:15px 0px 15px 0px;
	padding:5px 5px 5px 0px;
	font-size:1.0em;
	text-align:center;
}

h4
{
	font-family:arial;
	color:black;
	text-decoration:none;
	line-height:1.0em;
	font-weight:normal;
	margin:5px 0px 5px 0px;
}

h5
{
	font-family:arial;
	color:#000066;
	text-decoration:none;
	font-size:1.0em;
	margin:20px 5px 20px 0px;
}

h6
{
	font-family:arial;
	color:black;
	text-decoration:none;
	line-height:140%;
	font-size:1.0em;
	font-weight:normal;
	margin:0px 0px 0px 0px;
	padding:0px 0px 0px 0px;
}

p
{
	font-family:arial;
	color:black;
}

.indent
{
	font-family:arial;
	color:black;
	text-decoration:none;
	font-weight:normal;
	line-height:140%;
	margin:0px 0px 20px 50px;
}

/* @media only screen and (max-width: 900px)
{
    #header
    {
        width:890px;
    }
 
}*/

.section {
	background-color:#FFFFFF;
	border:4px ridge #000000;
	border-radius:10px;
	padding:0em 1em 0.5em 1em;
	margin-left:auto;
	margin-right:auto;
	margin-top:0px;
	margin-bottom:10px;
	width:90%;
  }

  
  .introduction {
	background-color:#FFFFFF;
	border:4px ridge #330099;
	border-radius:0px;
	padding:1em 2em 1em 2em;
	margin-left:auto;
	margin-right:auto;
	margin-top:0px;
	margin-bottom:10px;
	min-height:100px;
	width:90%;
  }

  .toc {
	background-color:#FFFFFF;
	border:4px ridge #330099;
	border-radius:0px;
	padding:1em 2em 1em 2em;
	margin-left:auto;
	margin-right:auto;
	margin-top:0px;
	margin-bottom:10px;
	min-height:100px;
	width:90%;
  }

  .info th
  {
	border:2px solid black;
	background-color: #BB99DD;
	margin: 0px 20px 0px 0px;
	padding:0px;
	font-size:6px;
	width:15px;
	height:15px;
  }

  .tool th
  {
	border:2px solid black;
	background-color: #88AAEE;
	margin: 0px 20px 0px 0px;
	padding:0px;
	font-size:6px;
	width:15px;
	height:15px;
  }

  .activity th
  {
	border:2px solid black;
	background-color: #99CC66;
	margin: 0px 20px 0px 0px;
	padding:0px;
	font-size:6px;
	width:15px;
	height:15px;
  }

  .toc h3
  {
	color: black;
	margin:0px 0px 0px 10px;
	line-height:100%;
	padding:0px;
  }

  .toc h4
  {
	color:black;
	text-decoration:none;
	font-weight:normal;
	line-height:140%;
	margin:10px 0px 20px 50px;
  }

.maths
{
	font-family:calibri;
	color:black;
	text-decoration:none;
	font-weight:normal;
	font-size:1.1em;
	line-height:2;
	margin:5px 5px 5px 5px;
	white-space:nowrap;
}

.compact
{
	font-family:calibri;
	color:black;
	text-decoration:none;
	font-weight:normal;
	font-size:1.0em;
	line-height:1em;
	margin:0px;
	text-align:center;
	white-space:nowrap;
	width:100%;
}

.polynomial
{
	font-family:courier new;
	text-align:center;
	font-weight:bold;
	color:black;
}

#footer
{
	padding:0px;
	margin:30px 50px 50px 50px;
	font-family:arial;
	font-size:1em;
	text-align:center;
}

#footer .text
{
	font-family:arial;
	font-size:1.2em;
	color:black;
	text-align:center;
	margin:auto;
	margin:5px auto 5px auto;
	font-weight:normal;
}
               
.menulist
{
	font-family:arial;
	font-size:0.95em;
	color:black;
	text-decoration:none;
	font-weight:bold;
	margin:10px 30px 0px 0px;
	text-align: left;
	float:left;
}

#codeexample
{
	background-color:#FFFFFF;
	height:auto;
	position:relative;
	padding:30px;
	z-index:1;
	border:0px solid black;
}

a
{
	font-size: 1em;
	font-family:arial;
	text-decoration:none;
	color:#330099;
	font-weight:bold;
	line-height:150%;

}

.listlink
{
	font-size: 1em;
	font-family:arial;
	text-decoration:none;
	color:#000000;
	font-weight:bold;
	line-height:150%;
	margin-left:80px;

}

textarea 
{
	border:0px;
	font-size: 11pt;
	font-family:arial;
	text-decoration:none;
	font-weight:bold;
	line-height:150%;
}      

.item
{
	display:block;
	border:1px ridge #444444;
	border-radius:5px;
	padding:2px 2px 2px 2px;
	margin:0px 5px 0px 5px;
	width:110px;
	font-family:arial;
	font-size:1em;
	font-weight:bold;
	color:#333333;
	text-align:center;
	float:left;
	background-color:#EEEEEE;
}

.label
{
	display:inline-block;
	position: relative;
	border:2px ridge #444444;
	border-radius:5px;
	padding:2px 2px 2px 2px;
	margin:0px 2px 0px 2px;
	width:120px;
	font-family:arial;
	font-size:1.0em;
	font-weight:bold;
	color:#000000;
	text-align:center;
	background-color:#FFFFFF;
}

.current
{
	display:block;
	border:1px ridge #444444;
	border-radius:5px;
	padding:2px 2px 2px 2px;
	margin:0px 5px 0px 5px;
	width:102px;
	font-family:arial;
	font-size:0.5em;
	font-weight:bold;
	color:#333333;
	text-align:center;
	float:left;
	background-color:#DDDDDD;
}

#menu li:hover
{
	background-color:#EEEEFF;
}

#menu li.item a
{
	text-decoration:none;
	color:#330066;
}

#menu li:hover
{
	position:relative;
	z-index:200;
}

.information
{
	margin:5px 20px 5px 0px;
}

.information h3
{
	font-family:arial;
	font-size:1.0em;
	color:black;
	text-decoration:none;
	font-weight:bold;
	margin:20px 10px 10px 0px;
	text-align: left;
}

.information h4
{
	font-family:arial;
	font-size:1.0em;
	color:black;
	text-decoration:none;
	font-weight:normal;
	line-height:1.5;
	margin:5px 20px 5px 20px;
}

.information h6
{
	font-family:arial;
	font-size:1.0em;
	color:black;
	text-decoration:none;
	font-weight:bold;
	line-height:1.5;
	text-align:center;
	margin:5px 20px 5px 20px;
}

.title
{
	font-family:arial;
	font-size:1.0em;
	color:black;
	text-decoration:none;
	font-weight:bold;
	padding:0px 0px 0px 0px;
	margin:5px 5px 5px 5px;
	text-align:center;
	vertical-align:middle;
}

input
{
	font-family:arial;
	font-size:0.9em;
	font-weight:bold;
	color:black;
	border:2px solid black;
	border-radius:5px;
	padding:5px 5px 5px 5px;
	background:#EEEEEE;
	cursor:pointer;
	margin:10px 4px 10px 4px;
	min-width:50px;
	float:left;
}

.radio
{
	font-family:arial;
	font-size:12pt;
	font-weight:bold;
	color:black;
	border-radius:5px;
	padding:5px 5px 5px 5px;
	background:#EEEEEE;
	cursor:pointer;
	margin:10px 4px 10px 4px;
	min-width:20px;
	float:left;
}


button
{
	font-family:arial;
	font-size:12pt;
	font-weight:bold;
	color:black;
	border:2px solid black;
	border-radius:5px;
	padding:5px 5px 5px 5px;
	background:#EEEEEE;
	cursor:pointer;
	margin:10px 4px 10px 4px;
	min-width:50px;
	float:left;
}

#menubutton
{
	display:none;
}

.border
{
    border:2px solid black;
	margin-right:20px;
}

select
{
         font-size:1.4em;
         font-family:arial;
         margin-right:10px;
}

#scrollbarlist  {
    border-left: 1px solid #000000;
    width: 500px;
    height: 100px;
    margin: 10px auto 10px auto;
	text-align: left;
    overflow-y: scroll;
    overflow-x: hidden;
}

#scrollbarlist a
{
	margin-left:20px;
}

#htmlcode
{
	font-family:arial;
	font-size:11pt;
}

#codearea
{
	height:400px;
	width:750px;
	border:1px solid black;
	margin:10px 0px 10px 30px;
	color:#000000;
}

.getit
{
	height:60px;
    margin:5px 10px 5px 10px;
}

.widepanel {
	background-color:#FFFFFF;
	padding:10px 20px 10px 20px;
	text-align:center;
	width:100%;
  }

.leftpanel {
	background-color:#FFFFFF;
	padding:10px 20px 10px 20px;
	margin-left:auto;
	margin-right:auto;
	float: left;
}

.panel {
	background-color:#FFFFFF;
	border:1px ridge #444444;
	padding:10px 20px 10px 20px;
	overflow:hidden;
	display:table-cell;
}

.selection
{
	display:block;
	border:1px ridge #444444;
	border-radius:10px;
	padding:2px 2px 2px 2px;
	margin:0px 5px 0px 5px;
	width:180px;
	height:120px;
	font-family:arial;
	font-size:1em;
	font-weight:bold;
	color:#333333;
	text-align:center;
}

.selection a:link {
    color: black;
}

.selection a:visited {
    color: black;
}

.highlightred
{
    font-family:arial;
    font-size:1.0em;
    font-weight:bold;
    color:red;
}

.highlightblue
{
    font-family:arial;
    font-size:1.0em;
    font-weight:bold;
    color:blue;
}

.highlightnavy
{
    font-family:arial;
    font-size:1.0em;
    font-weight:bold;
    color:navy;
}

.highlightpurple
{
    font-family:arial;
    font-size:1.0em;
    font-weight:bold;
    color:purple;
}

.highlightviolet
{
    font-family:arial;
    font-size:1.0em;
    font-weight:bold;
    color:blueviolet;
}

.highlightgreen
{
    font-family:arial;
    font-size:1.0em;
    font-weight:bold;
    color:rgb(6, 109, 6);
}

.highlightcyan
{
    font-family:arial;
    font-size:1.0em;
    font-weight:bold;
    color:rgb(7, 109, 120);
}

.highlightpink
{
    font-family:arial;
    font-size:1.0em;
    font-weight:bold;
    color:rgb(238, 37, 131);
}

.highlightgrey
{
    font-family:arial;
    font-size:1.0em;
    font-weight:bold;
    color:rgb(66, 66, 66);
}

hr
{
    height:2px;
    width:90%;
    border:none;
    color:#000;
    background-color:#000;
    margin-top:20px;
    margin-bottom:20px;
}

.menubreak
{
    background-color:white;
    border:0px;
    border-top:3px black solid;
    width:100%; height:0px;
    margin:5px 0px 0px 0px;
}

.choice
{
    border:1px solid black;
    margin:10px 4px 10px 4px;
    color: #000000;
    font-size: 14pt;
    font-weight: bold;
}

.cell
{
    border:2px solid black;
    margin-right:5px;
    color: #000000;
}

.code
{
    font-family:arial;
    font-size:12pt;
    font-weight:bold;
	color:black;
	margin:50px 4px 10px 4px;
}



.workings
{
	display:none;
	margin-left:40px;
	line-height:2;
}

ul
{
	margin-top:10px;
}

li
{
	border:none;
	font-family:arial;
	font-size:1em;
	text-decoration:none;
	font-weight:normal;
	line-height:1.4em;
}

.submenubuttons
{
    display:table;
    width:100%;
}

.submenubuttons input
{
    font-family:arial;
	font-size:0.9em;
	font-weight:bold;
	color:black;
	border:0px solid black;
	padding:5px 5px 5px 5px;
	background:none;
	cursor:pointer;
	margin:0px 4px 0px 4px;
	min-width:50px;
	float:left;
}

.scroll
{
    display:block;
    overflow:auto;
}