@charset "utf-8";

body {
	background-color:#EEEEEE;
	min-height:100%;
	padding:20px;
	margin:0px;
	border-width:0px;
	font-family: "Trebuchet MS", Helvetica, sans-serif;
	font-size:14pt;
	color:#000000;	
}

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

#maincontent {
	position:relative;
	padding:20px;
	padding-right:270px;
	height:100%;
}

img {
	border-width:0px;
	
}

.floatimageleft {
	float:left;
	margin:10px;
}

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

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

h3 {
	font-size:100%;
}



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

.navbuttons {
    /* top and bottom */
	position:relative;	
	width:270px;
	height:80px;
	margin-left:auto;
	margin-right:auto;
}

#contentbutton {
	position:absolute;
	top:5px;
	left:95px;
	width:80px;
	height:30px;	
}

.previousbutton {
	position:absolute;
	top:40px;
	left:10px;
	width:80px;
	height:30px;	
}

#upbutton {
	position:absolute;
	top:40px;
	left:95px;
	width:80px;
	height:30px;	
}

.nextbutton {
	position:absolute;
	top:40px;
	left:180px;
	width:80px;
	height:30px;	
}

/* the pop out menus for appearance */

div.menu {
	position:absolute;
	right:5px;
	top:5px;
	border-width:0px;
	padding:0px;
	margin:0px;	
	height:30px;
	z-index:100;
	width:100px;
	font-size:10pt;
	color:#000000;
	}

ul.menu {
	padding: 0px;
	margin:0px;
	border-width:0px;
	list-style-type: none;
	line-height:30px;
	z-index:100;
}

ul.menu li {
	position: relative;							
	width:100px;
	border-width:0px;
	padding:0px;
	margin:0px;
	z-index:100;
	background-color:#EEEEEE;
}

ul.menu li:hover {
	background-color:#CCCCCC;
}
			
ul.menu ul.menu {
	position: absolute;
	left: -100px;
	top: 0px;
	width:100px;	
	display:none;	
}

ul.menu ul.menu ul.menu {
	position: absolute;
	left: -100px;
	top: 0px;
	width:100px;	
	display:none;	
}

ul.menu li:hover > ul {
	display:block;
}

ul.menu li ul.menu li:hover > ul {
	display:block;
}
		
ul.menu a {
	display:block;
	text-decoration:none;
	width:100px;
	line-height:30px;
}

/* end of popout menus */

#copyright {
	text-align:center;
	font-size:80%;
}


#recommendations {
    position:relative;
    width:400px;
    height:30px;
    text-align:center;
    margin-left:auto;
    margin-right:auto;
}

#googlefriendconnect {
	width:290px;
	margin-right:auto;
	margin-left:auto;
	height:inherit;
}

#adwords {
  width:728px;
  margin-left:auto;
  margin-right:auto;
}

#frontpagecontent {
	position:relative;	
	margin:200px;	
}

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

/* any text which has pop up help through title text*/

span[title] {
	border-bottom-style:dashed;
	border-bottom-width:1px;
	border-bottom-color:green;
}

.extra {
	position:absolute;
	right:0px;
	width:240px;
	font-size:70%;
}

.exercise a {
	color:green;
}

.link a {
	color:blue;
}

.info a {
	color:#333333;
}

.example a {
	color:#880000;
}

/* box containing code examples */
pre {
	font-family:Courier, "Courier New", Monospace;
	font-size:90%;
	
	padding:10px;
	border-width:1px;
	border-color:black;
	border-style:solid;
	overflow-x:scroll;
	overflow-y:hidden;
}

/* tables */

table, th, td {
	border-color:black;
	border-width:1px;
	border-style:solid;
}

.dbtable {
	float:left;
	margin:20px;	
	padding:10px;
	background-color:#555555;
}

.dbtable {	
	padding:5px;
	background-color:#FFFFEE;
}

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