@charset "utf-8";

body {
	background-color:#FFFFEE;
	min-height:100%;
	padding:5px;
	margin:0px;
	margin-left:8%;
	margin-right:8%;
	border-width:0px;
	font-family: "Trebuchet MS", Helvetica, sans-serif;
	font-size:14pt;
}

img {
	border-width:0px;
	
}

p {
	clear:both;
}

h1 {
	text-align:center;
	font-size:150%;
}

h2 {
	clear:both;  /* why? **** */
	font-size:120%;
}

h3 {
	font-size:100%;
}

div {
	padding:0px;
	margin:0px;
	border-width:0px;
}

dl {
	margin-left:50px;
}

dt {
	font-style:italic;
	margin-top:10px;
}

h1.frontpage {	/* looks like standard paragraph but contains keywords */
	text-align:left;
	font-size:100%;
	font-weight:normal;
}

.bold {
	font-weight:bolder;
}

.underline {
	text-decoration:underline;
}

/* the page header which contains links and logo */
#header {
	position:relative;
	width:100%;
	height:135px;	
	text-align:center;
}

#forumslink {
	position:absolute;
	top:0px;
	right:5px;
}

/* links for the bottom bar */
.left {
	position:absolute;
	bottom:0px;
	left:5px;
}

.centre {
	position:absolute;
	bottom:0px;
	left:50%;
	width:110px;
	margin-left:-50px;
}


.right {
	position:absolute;
	bottom:0px;
	right:5px;
}

/* the copyright notice goes under the bottom bar */
#copyright {
	clear:both;
	text-align:center;
	font-size:80%;
	margin-top:60px;
}

#frontpagelogo {
	position:absolute;
	left:50%;
	margin-left:-559px;
	width:1118px;
	height:600px;
	top:80px;
	bottom:0px;
	z-index:-1;
}

#frontpagecontent {
	position:absolute;
	top:270px;
	left:250px;
	right:250px;
}

#frontpageads {
	position:relative;
	top:690px;
	text-align:center;
}

/* any text which has pop up help */
.tipped {				
	position:relative;		
	border-bottom-style:dashed;
	border-bottom-width:1px;
	border-bottom-color:green;
}

/* the pop up help text **** problem if near right edge or bottom */
.tip {	
	position:absolute;
	display:none;
	text-align:left;
	background-color:#CCCCCC;				
	bottom:1.25em;
	left:5em;
	width:250px;
	border-width:1px;
	border-style:solid;
	border-color:#999999;
	font-style:normal;
	font-weight:normal;
	font-size:90%;
	z-index:99;
}

.tipped:hover span {	
	display:inline;	
}

/* box containing code examples */
.code {
	font-family:Courier, "Courier New", Monospace;
	font-size:90%;
	margin:15px;
	padding:10px;
	border-width:1px;
	border-color:black;
	border-style:solid;
	
}

.code:hover {
	background-color:#FFFFBB;
}

.code p {
	margin-top:0px;
	margin-bottom:0px;
}


/* indented text for inside the code boxes */
.indent1 {
	padding-left:25px;
}

.indent2 {
	padding-left:50px;
}

.indent3 {
	padding-left:75px;
}

.indent4 {
	padding-left:100px;
}

.indent5 {
	padding-left:125px;
}

.indent6 {
	padding-left:150px;
}

.indent7 {
	padding-left:175px;
}

.indent8 {
	padding-left:200px;
}

table.dbtable {
	float:left;
	margin:20px;
	border-color:black;
	border-width:1px;
	border-style:solid;
	padding:10px;
	background-color:#555555;
}

table.dbtable td, th  {
	border-color:black;
	border-width:1px;
	border-style:solid;
	padding:5px;
	background-color:#FFFFEE;
}

/* the CSS box model example (move to separate sheet****) */
#boxtoycontainer {
	position:relative;
	margin:20px;
	padding:0px;
	border:10px;
	border-style:ridge;
	border-color:#555555;
	height:570px;
	background-color:#CCCCCC;
	overflow:hidden;
	min-width:850px;
}

#boxtoy {
	position:relative;
	float:left;
	background-color:blue;
	width:250px;
	height:250px;
	margin:100px;
	padding:50px;
	border-style:dashed;
	border-color:red;
	border-width:10px;
	color:white;
}

#boxtoycontrols{
	position:absolute;
	right:0px;
	top:0px;
}

/* warning paragraph */
.warning {
	font-weight:bold;
	margin:10px;
	border-style:solid;
	border-width:2px;
	border-color:red;
}