* {
margin-top:0;
}

html {
color:#000; 
background: #dcdcdc
}

/*The body forms a background for the rest of the page*/
body {
text-align:center; 
font-family:verdana, arial, sans-serif; 
font-size:100%; 
color:#000000; 
background: #dcdcdc; 
padding:0; 
border:0; 
margin:0 auto 0 auto;
}

/*The wrapper forms the middle section of the page which is centred.  All of the page content is contained within the wrapper.*/

#wrapper {
width:750px; 
margin:0 auto; 
text-align:left; 
background: #dcdcdc;
border: 3px #d82e2e outset;}

/*The banner contains the BMB graphic*/

#banner {
width:750px; 
background: #dcdcdc url(graphics/name.jpg) no-repeat; 
position:relative;
height: 80px;
}

/*This section determines how links appear on all pages*/

a, a:visited {color:#606;}
a:hover {
text-decoration:none;
}

/*Don't think this is being used on any pages but if used, will span the wrapper division.*/

#info {
width:750px; 
padding-bottom:12px; 
background:#fff url(info.gif) repeat-x; 
border-bottom:1px solid #444; 
padding-top:20px;
}

/*This section is used on the index page to notify when the site was last udated. It spans the wrapper division*/
#foot {
clear:both; 
width:750px; 
margin:0; 
padding-bottom:10px; 
background:#dcdcdc; 
border-top:1px solid #888888;
margin-top: 10px;
text-align: center;
}
#foot p {
text-align: center;
}

/*determines how heading 2 appears on all pages*/

h2 {
color:#005f8c; 
font-weight:normal; 
font-family: tahoma, geneva, "lucida sans unicode", "lucida grande", verdana, sans-serif; 
font-size:1.2em; 
letter-spacing:0.2em; 
margin:0 0 10px 0; 
padding-top:5px;
}

h2 span {
line-height:1.4em;
}

h3 {
font-size:1.1em;
text-align: center;
}

/*determines how paragraphs appear.  Some divisions have further formatting for paragraphs.*/

p {
font-size:0.9em; 
text-align:justify; 
font-family:verdana, arial, sans-serif; 
margin-top:0;
}

.highlight {
color:#000; 
font-family: verdana, arial, sans-serif; 
width:220px; 
padding:20px 5px 20px 5px; 
border-bottom:1px solid #00f; 
background:#d0d0d0 url(highlight.gif) top left no-repeat;
}

/*The menubar is just that.  There is quite a lot of code to make the menubar work as it does and some code is common to all browsers while other bits of code are specific to Microsoft Internet Explorer*/

#menubar {
float:left;
padding-bottom: 20px;
}

/* common styling */
.menu {
float: left; 
width: 750px; 
font-family: verdana, arial, sans-serif;
border-top:3px solid #800000;  
border-bottom: 3px #800000 solid;
list-style-type:none;
font-size: 10pt;
background: url(graphics/menu.gif) repeat-x top left;
font-weight: bold;
}

.menu ul {
padding:0;margin:0;
list-style-type:none;
}

.menu ul li {
float:left; 
position:relative; 
background: url(graphics/divider.gif) no-repeat top right
}

.menu ul li a, .menu ul li a:visited {
float:left; 
display:block; 
text-decoration:none; 
color: #dcdcdc; 
padding:0px 16px; 
line-height:25px; 
height:30px; 
border-bottom: 3px #dcdcdc solid
}
* html .menu ul li a, .menu ul li a:visited {
height:33px; he\ight:30px;
}

.menu ul li:hover {
width:auto;
}

.menu ul li a.menuone:hover {
border-color:#ff1614; 
color:#ff1614;
}

.menu ul li a.menutwo:hover {
border-color:#bb716d; 
color:#bb716d;
}

.menu ul li a.menuthree:hover {
border-color:#929200; 
color:#929200;
}

.menu ul li a.menufour:hover {
border-color:#008800; 
color:#008800;
}

.menu ul li a.menufive:hover {
border-color:#9900ff; 
color:#9900ff;
}

.menu ul li a.menusix:hover {
border-color:#0000cc; 
color:#0000cc;
}

.menu ul li a.menuseven:hover {
border-color:#e82aee; 
color:#e82aee;
}

.menu ul li a.menueight:hover {
border-color:#ed2940; 
color:#ed2940;
}

.menu ul li:hover a.menuone {
border-color:#ff1614; 
color:#ff1614;
}

.menu ul li:hover a.menutwo {
border-color:#bb716d; 
color:#bb716d;
}

.menu ul li:hover a.menuthree {
border-color:#929200; 
color:#929200;
}

.menu ul li:hover a.menufour {
border-color:#008800; 
color:#008800;
}

.menu ul li:hover a.menufive {
border-color:#9900ff; 
color:#9900ff;
}

.menu ul li:hover a.menusix {
border-color:#0000cc; 
color:#0000cc;
}

.menu ul li:hover a.menuseven {
border-color:#e82aee; 
color:#e82aee;
}

.menu ul li:hover a.menueight {
border-color:#ed2940; 
color:#ed2940;
}


/*This is the start of the "cells" used in the site*/

/*Col1 is one of 2 columns along with col3 - used on the index page only as they have graphics. No background colour has been specified so assumes "gainsboro" from the wrapper div.*/

.col1 {
background-image: url(graphics/cheeta_left.gif);
background-repeat: no-repeat;
width:325px; 
float:left; 
padding: 160px 10px 0em 10px;
text-align: center;
background-position: top;
}

.col1 p {
text-align: center;
}

.col3 {
display:block; 
width:325px; 
float:right; 
padding: 160px 10px 0em 10px; 
margin:0;
background-image: url(graphics/cheeta_right.gif);
background-repeat: no-repeat;
background-position: top;
text-align: center;
}

.col3 ul {
font-size:0.9em; 
line-height:1.4em;
}

/*col4 spans the wrapper division and has a white background.  Used on most pages*/
.col4 {
display:block; 
width:698px; 
float:left; 
background:#ffffff; 
clear:both;
padding: 25px;
font-size: 1em;
border-top: 1px #888888 solid;}

.col4 li {
line-height:1.5em; 
font-size:0.9em;
}

/*col5 can be used to form two columns.as used on the Contact Us page.  There are no imbedded graphics and no background colour has been specified so it assumes "gainsboro" from the wrapper div.*/

.col5 {
display:block; 
width:320px; 
float:left;
padding: 25px;
text-align: center;
}