/*------------ This part must be in the beginning ------------------------------------------- */

body, html {
   margin: 0;
   padding: 0;
   background: #ffffff;
   color: #000;
   font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
   font-size:14px;
   min-width:670px;
}

/* --------------------------------------------------------------------------------------------- */
#main {
	width:500px;
	position: relative;
	vertical-align: top;
	left: 200px;
}

#table {
   /* background:#9c9; */
   float:right;
   width:500px;
}

table.columnROB1 {
   /* background:#9c9; */
   float:left;
   width:375px;
}

table.columnROB2 {
   /* background:#9c9; */
   float:right;
   width:375px;
}

table.\2columns {            /* '\' must be included to use number in class names */
	/*float:right;*/
	width:100%;
   text-align:left;
	border-collapse: collapse;
	padding:0;
	margin:0;
	/*background: #CCFFCC;*/
   /*border-width:2px;*/
   /*border-style:solid;*/
   /*border-color:#ffffff;*/
}

table.\2columns tr {
	/*width: 500px;*/
	vertical-align:top;
	padding:0;
	margin:0;
}

table.\2columns td {
	/*width:250px;*/
	width:100%;
	vertical-align:top;
	padding:0;
	margin:0;
}

table.\2columns td.between {
	width: 10px;
	padding:0;
	margin:0;
}

table.t_green {
   /*float:right;*/
   width:100%;
   margin-left:2%;
   margin-right:2%;
   margin:1px;
   background: #CCFFCC;
   border-width:2px;
   border-style:solid;
   border-color:#ffffff;
   text-align:center;
   border-collapse: collapse;
}

table.t_green th.wide {
   width:100%;
   padding:1em;
   font-size:11pt;
}

table.t_green th {
   font-weight: bold;
   font-size:10pt;
   width:33%;
   border:2px;
   margin:0;
   border-style:solid;
   border-color:#ffffff;
}

table.t_green th.session {
   font-size:11pt;
}

table.t_green tr, td {
   font-weight: normal;
   font-size:1em;
   border:2px;
   margin:0;
   border-style:solid;
   border-color:#ffffff;
   padding:1em;
   /* line-height:20px; */
   /* height:20px; */
}

table.t_green tr.columns {
   font-size:11pt;
   line-height:3em;
   height:3em;
}

#fig_above_menu {
	width:167px;
	height:287px;
	padding:0;
	margin:0;
	top:10px; /* IE6 */
	background-image: url(images/image_above_menu.jpg);
	position: absolute;
}

#fig_below_menu {
	position: absolute;
	float: left;
	width: 167px;
	top: 540px;
/*	width:167px;* /
	padding:0;
	left: 133px;
	height: 163px;*/
}

/*#menu {
   /* background:#c9c; * /
   float:left;
   width:200px;
   padding:0;
	top:0;
}*/

#menu {
	/* font-weight: normal; */
   /* color: #fffff0; */
   width: 150px;
	position: absolute;
	font-size: 11px;
	text-align: left;
	background-color: #330066;
	border-width: 1px;
	border-color: #6a6a6a;
	margin: 0;
	padding: 0;
	float:left;
	top:298px;
	z-index: 1000;
}

/* Menu items - lists and links*/

/* First level*/

#menu a {
   display: block;
   text-decoration: none;
   color: #fffff0;
   background-color: #330066;
   width: 150px;
   padding: 4px 9px 4px 4px;
   border-width: 1px;
   border-color: #bebe99;
   border-style: double;
   line-height: 14px;
   position: relative;
}

#menu a:link {

   display: block;
   color: #fffff0;
   background-color: #330066; /* dark purple */
}

#menu a:visited {
   display: block;
   color: #fffff0;
   background-color: #330066; /* dark purple */
}

#menu a:hover {
   background-color: #006600; /* green*/
   color: #ffffcc;
}

/* -- IE bug: A link remains active when the user comes back via the back-button */

#menu a:active {
   display: block;
   color: #fffff0;
   background-color: #330066; /* dark purple */
}

#menu ul {
   font-weight: bold;
   list-style-type: none;
   padding: 0;
   margin: 0;
   width: 150px;
   /* border-bottom: 1px solid #ffffff; */
}

/* Lists at first level - FF */
#menu ul li {
   float: left;
   margin-right: 0;
   position: relative;
   margin: 0;
}

/* Lists at first level - FF */
#menu ul li:hover ul {
   display: block;
   position: absolute;
   top: 0;
   /* left: 150px; */
   width: 150px;
   border-bottom: 1px solid #ffffff;
}

/* Control submenu level 3 in FF but not in IE */
#menu ul li li:hover ul li {
   display: block;
   position: relative;
   top: 0;
   width: 150px;
}
/*
 #menu ul li ul li{
   margin: 0;
   padding: 0;
   list-style: none;
}

*/
/* Second level */
/* #menu ul li li a, #menu ul li li a:visited { */

#menu ul li ul li a, #menu ul li ul li a:visited {
   display: block;
   text-decoration: none;
   font-weight: normal;
   width: 150px;
   padding: 4px 9px 4px 4px;
   border-width: 0;
/*
    border-color: #bebe99;
   border-style: solid;
*/
}

/* Third level */
/* #menu ul li li li a, #menu ul li li li a:visited { */
#menu ul li ul a, #menu ul li ul a:visited {
   display: block;
   text-decoration: none;
   font-weight: normal;
   width: 150px;
   padding: 4px 9px 4px 4px;
   border-width: 0;
}

/* hide the 2nd sub level */
/* Control submenu in FF*/
/* #menu ul ul { */
#menu ul li ul {
   visibility: hidden;
   position: absolute; /* VERY important */
   top: 0;
   left: 164px; /* IE6 */
}

#menu ul li > ul {left: 165px;} /* only to NON-IE browsers */
/* hide the 3rd sub level */
/* Control submenu in IE but not in FF*/
/* #menu ul ul ul { */
#menu ul li ul li ul {
   visibility: hidden;
   position: absolute;
   top: 0;
   left: 163px; /* IE6 */
}

#menu ul li ul li > ul {left: 163px;} /* only to NON-IE browsers */
/* make the second level visible when hover on first level list OR link */
#menu ul li:hover ul, /* VERY important */

#menu ul a:hover ul {
   visibility:visible;
}

/* keep the third level hidden when you hover on first level list OR link */
#menu ul :hover ul ul {
   visibility:hidden;
}

/* keep the fourth level hidden when you hover on second level list OR link * /
#menu ul a:hover ul a:hover ul ul{
   visibility:hidden;
}
*/

/* make the third level visible when you hover over second level list OR link */
#menu ul :hover ul :hover ul {
   visibility:visible;
}

/* make the fourth level visible when you hover over third level list OR link * /
#menu ul a:hover ul a:hover ul a:hover ul {
   visibility:visible;
} */

/* To compensate IE6 bug with hover */
* html #menu ul {margin-left:0;} 
/* To compensate IE6 bug with padding * /
* html p {height:1%;} */
/* get rid of the table  - causing problem with menu + table */

#menu table {
   position: absolute;
   /*border-collapse: collapse;*/
   top: 0;
   left: 0;
   width: 0;
   height: 0;
}

#wrap {
	width:700px;
	height: 700px;
	margin: 0 auto;
}

#header {
	width:500px;
	height:131px;
	margin-top:10px;
	background-image:url(images/Baobab_Centre_top_banner.jpg);
	position: relative;
	left: 200px;
   /*clear:both;*/
}

#title {
	background:#CCFFCC;
	width:500px;
	font-weight: bold;
	text-align:center;
	height: 46px;
	margin: 0 auto;
	position: relative;
	left: 100px;
   /*clear:both;*/
}

#title2 {
	background:#CCFFCC;
	width:500px;
	font-weight: bold;
	text-align:center;
	height:110px;
	position: relative;
	left: 200px;
   /*clear:both;*/
}

#contactus {
	/* background:#9c9; */
   width: 500px;
	height:20px;
	vertical-align:top;
	padding:0;
	position: relative;
	left: 200px;
	margin-top: 5px;
}

#copyright {
	/* background:#9c9; */
   width: 500px;
	height:40px;
	vertical-align:top;
	padding:0;
	position: relative;
	left: 200px;
	margin-top: 5px;
	font-size: 10px;
}

#signup {
	/* background:#9c9; */
   width: 500px;
	font-weight: bold;
	font-size:12px;
	padding:0;
	position: relative;
	height: 46px;
	left: 200px;
}

#breadcrumb_section {
	width:500px;
	height:26px;
	padding:5px;
	margin:0;
	left: 200px;
	position: relative;
}

#header h1 {
    /*padding:5px;*/
    /*margin:0;*/
}

#main h2, #main h3, #main p {
    /*padding:0 10px;*/
}

#sidebar ul {
    margin-bottom:0;
}

#sidebar h3, #sidebar p {
    padding:0 10px;
}

/*----------------------------*/
p {
	padding:3px;
	margin:3px;
}

/* ----- Breadcrumb test 1 ---------------- */
.breadcrumb {
	/* "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif; */
	font-weight:bold;
	font-size:14px;
	/*font-family:Arial, Helvetica, sans-serif;*/
}

.breadcrumb a {
	background: transparent url(images/breadcrumb.gif) no-repeat center right;
	text-decoration: none;
	padding-right: 18px; /*adjust bullet image padding*/
	color: #330066;
}

.breadcrumb a:visited, .breadcrumb a:active {
	color: #330066; /* dark purple */
}

.breadcrumb a:hover {
	text-decoration: underline;
}

/* ----- Breadcrumb test 2 ---------------- */

#breadCrumb_2 {
	/* height: 18px; / * This is the height we want on our breadcrumb */
	/*padding: 4px 0 0 8px;*/
	/* background: #999; / * This is our background color */
	color: #000000; /*This is our color on the text which isn't a link */
	margin:5px;
	padding:0;
}

#breadCrumb_2 li {
	/*float: left;*/
	display: inline;
	/*margin-right: 4px;*/
}

#breadCrumb_2 a {
	background: transparent url(images/breadcrumb.gif) center right no-repeat;
	text-decoration: none;
	padding-right: 18px; /* We need to add some padding to the right of the link */
	color: #330066;
	font-weight: bold;
}

#breadCrumb_2 a:visited, #breadCrumb_2 a:active {
	color: #330066; /* dark purple */
}

#breadCrumb_2 a:hover {
	text-decoration: underline;
	color: #333;
	/*background: transparent url(images/breadcrumb.gif) center right no-repeat;*/
}

#footer {
	width:520px;
	position: relative;
	left: 190px;
	vertical-align: top;
	padding: 0;
	/*background-image:url(images/Baobab_Centre_bottom_banner.jpg);*/
}

#footer p {
    /*padding:5px;*/
    /*margin:0;*/
}

/* Three boxes in the footer of all pages */
table.box {
	/*width:150px;*/
	height:58px;
	border-collapse: collapse;
	/*padding:0;*/
	margin:5px;
	border:0;
}

table.box tr {
	/*padding:0;*/
	margin:0;
}

table.box td.left {
	margin:0;
	width:150px;
	padding-top:10px;
	padding-bottom:10px;
   padding-left:0px;
	padding-right:0px;
	text-align:center;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight:bold;
	line-height:100%;
	background-image:url(images/box_background150.gif);
}

table.box td.center {
	margin:0;
	width:150px;
	padding-top:10px;
	padding-bottom:10px;
	padding-left:0px;
	padding-right:0px;
	text-align:center;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
	font-weight:bold;
	line-height:100%;
	background-image:url(images/box_background150.gif);
}

table.box td.right {
	margin:0;
	width:155px;
	padding-left:0px;
	padding-right:0px;
	padding-top:10px;
	padding-bottom:10px;
	text-align:center;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
	background-image:url(images/box_background155.gif);
	line-height: 100%;
}

table.box td.between {
	width: 10px;
	padding:0;
	margin:0;
}

table.box p.green {
	color: #4CA04B;
	padding:0;
	margin:0;
	font-weight:normal;
	font-size:10px;
	font:Geneva;
}

table.box p.purple {
	color: #330066;
	padding:0;
	margin:0;
	font-weight:normal;
}