body,html{
margin:0;
padding:0;
background-color: #e9e9e9;
}

body {
	min-width:720px; /* Prevent content from becoming unreachable in Gecko */
}

/* position:absolute for all browsers - the whole page scrolls */
.homepageheadwrap {
	position:absolute;
	width:100%;
	top:0px;
	left:0px;
	height:178px;
	background-color: #e9e9e9;
}

/* position:fixed for modern browsers - header and footer do not scroll */
body>.homepageheadwrap {
	position:fixed;
}


table.homepagebuttons{
z-index:500;
width:100%;
}

.homepagemenu {
z-index:200;
}

table.homepagemenu{
width:952px;
height:50px;
border-collapse:collapse; 
}

.homepageheader {
  height:178px;
	width:100%;
	margin:0 auto;
}

.homepagebodywrap {
/* set left margin and bottom padding for IE5/Win */
	padding:178px 0 0 0;
	margin-left:0px;
	  background-image: url(../bcocss/2010homepagebackdrop.png);
  background-attachment: scroll; 
  background-repeat: repeat-y; 
  background-position: 50% 50%;
	
/* set left margin and bottom padding for others */
	voice-family: "\"}\""; 
	voice-family:inherit;
	margin-left:16px;
	padding-bottom:0px;
}

/* set left margin for modern browsers */
body>.homepagebodywrap {
	margin-left:0;
}

.homepagebody{
	width:944px;
	margin:0 auto;
  }

table.homepagefooter{
z-index:0;
width:780px;
margin-left:10px;
margin-right:10px;
border-top: solid 1px #00006c;
}


.homepagebottom{
background-image: url(../bcocss/2010backdropbottom.png);
background-position: top center;
background-repeat: no-repeat;
background-color: #e0e0e0;
background-attachment: scroll;
bottom:0;
}

.flashheader {
z-index:49;
}

.RSSlink {
position:absolute;
left:10px;
top:1px;
z-index:500;
margin-top:0px;
height:25px;
}

.picturecolumn {
	width:150px;
	float: left;
}

.bodystuff {
	padding:0px 0px;
	margin-left:150px;
}

table.homepagebodystuff {
  border-collapse:collapse;
  width:780px;
  margin-top:10px;
  margin-bottom:10px;
  }
  
  
table.homepagebodystuff td{
padding-left:10px;
padding-right:10px;
z-index:0;
}



  
table.homepagefooterstuff {
  border-collapse:collapse;
  width:775px;
  margin-right:4px;
  border-top: solid 1px #00006c;
  }

.homepagebottom{
background-image: url(../bcocss/2010homepagebackbottom.png);
background-position: top center;
background-repeat: no-repeat;
background-color: #e9e9e9;
background-attachment: scroll;
bottom:0px;
}


.img-shadow {
  float: left;
  background: url(../bcocss/img-shadow.gif) no-repeat bottom right;
  margin: 8px 0 0 8px !important;
  margin: 8px 0 0px 4px;
  padding: 0px;
  }

.img-shadow div {
  background: url(../bcocss/img-shadow2.png) no-repeat left top !important;
  background: url(../bcocss/img-shadow2.gif) no-repeat left top;
  padding: 0px 4px 0px 0px;

  }
  
.img-shadow img {
  background-color: #ffffff;
  border: 1px solid #00006c;
  padding: 0px;
  }

.img-shadow a.clickableimage img {
  padding: 2px;
  background-color: #ffffff;
  }
  
.img-shadow a.clickableimage:hover img {
  padding: 2px;
  background-color: #880000;
}


h1{
font-family:verdana;
font-size:20pt;
color:#00006c;
font-weight:bold;
line-height: 1;

}

h2{
font-family:verdana;
font-size:16pt;
color:#00006c;
font-weight:bold;
line-height:1;
}

h5{
font-family:verdana;
font-size:10pt;
color:#00006c;
line-height: 1;
font-weight:normal;
}

h3{
font-family:verdana;
font-size:10pt;
color:#00006c;
line-height: 1.1;
font-weight:normal;
text-align: justify;
}

h4{
font-family:verdana;
font-size:8pt;
color:#00006c;
line-height: 1;
font-weight:normal;
}







table.TopPage {
width: 100%;
margin:auto;
border-collapse:collapse;
border:0;
position: relative;
top: 0px;
height:15px;
}

.pic {
	border-left: 0px solid #e9e9e9;
	border-right: 1px solid #bbbbbb;
	border-bottom: 1px solid #bbbbbb;
	border-top: 0px solid #e9e9e9;
	background-image: url(../bcocss/2010picbackground.png);
	background-attachment:scroll;
  background-position: bottom right;
	background-repeat:repeat;
  padding:1px 2px 2px 1px;
  background-color:#747474;
}


a.clickable img.pic {
	border-left: 1px solid #e9e9e9;
	border-right: 1px solid #bbbbbb;
	border-bottom: 1px solid #bbbbbb;
	border-top: 1px solid #e9e9e9;
	background-image: url(../bcocss/2010clickpicbackground.png);
	background-attachment:scroll;
  background-position: bottom right;
	background-repeat:repeat;
  padding:1px 3px 3px 1px;
  background-color:#747474;
}


a.clickable:hover img.pic {
	border-left: 1px solid #00006c;
	border-right: 1px solid #747474;
	border-bottom: 1px solid #747474;
	border-top: 1px solid #00006c;
  padding:1px 3px 3px 1px;
	background-image: url(../bcocss/2010clickpicbackground.png);
	background-attachment:scroll;
  background-position: bottom right;
	background-repeat:repeat;
  background-color:#00006c;
}

a:hover {text-decoration : underline; 
   color : #880000;}
   
a { text-decoration : underline;
   color : #0808d9; }

.clickable{
  border:1px solid #e9e9e9;
}

.clickable:hover{
color: #00006c; 
}


.printeronly {
 display : none;
}


/* first the properties of all list-items <li> of the block of buttons */
.cruiseroute li {
   height: 113px;          /* CHANGE: height of one button */
   margin-bottom: 0px;    /* CAN BE CHANGED: a space of 4px under each button */
   /* THESE CODES CAN STAY UNCHANGED: */ 	
   list-style-type: none; /* list without bullets */
   margin-left: 0px;
   margin-top: 0;  /* no top margin needed */
   font-size: 1px;        /* correction for InternetExplorer */
   line-height: 1px;      /* correction for InternetExplorer */
}

/* then the properties for all links <a> in the button block */

.cruiseroute li a { /* CHANGE to your directory / image name */
   background-image: url('../BCoCSS/route button.png'); 
   height: 113px;          /* CHANGE: height of one button */
   width: 140px;          /* CHANGE: width of one button */
   display: block;
}

/* now we give for each button the normal position in the buttonblock, */
/* and after that the position at hovering (mouse-over) */

#buttonCR { background-position: -140px 0; }
#buttonCR a { background-position: -140px 0; }
#buttonCR a:hover { background-position: 0px 0; } 

/* first the properties of all list-items <li> of the block of buttons */
.compass li {
   height: 130px;          /* CHANGE: height of one button */
   margin-bottom: 0px;    /* CAN BE CHANGED: a space of 4px under each button */
   /* THESE CODES CAN STAY UNCHANGED: */ 	
   list-style-type: none; /* list without bullets */
   margin-right: 0px;    /* each button starting at the left side */
   margin-left: 0px;
   margin-top: 0;  /* no top margin needed */
   font-size: 1px;        /* correction for InternetExplorer */
   line-height: 1px;      /* correction for InternetExplorer */
}

/* then the properties for all links <a> in the button block */

.compass li a { /* CHANGE to your directory / image name */
   background-image: url('../BCoCSS/compass button.png'); 
   height: 130px;          /* CHANGE: height of one button */
   width: 114px;          /* CHANGE: width of one button */
   display: block;
}

/* now we give for each button the normal position in the buttonblock, */
/* and after that the position at hovering (mouse-over) */

#buttonCB { background-position: 0px 0; }
#buttonCB a { background-position: 0px 0; }
#buttonCB a:hover { background-position: -114px 0; } 


/* first the properties of all list-items <li> of the block of buttons */
.buttonTOP li {
   height: 15px;          /* CHANGE: height of one button */
   margin-bottom: 0px;    /* CAN BE CHANGED: a space of 4px under each button */
   /* THESE CODES CAN STAY UNCHANGED: */ 	
   list-style-type: none; /* list without bullets */
   margin-right: -0px;    /* each button starting at the left side */
   margin-top: 0;  /* no top margin needed */
   font-size: 1px;        /* correction for InternetExplorer */
   line-height: 1px;      /* correction for InternetExplorer */
}

/* then the properties for all links <a> in the button block */

.buttonTOP li a { /* CHANGE to your directory / image name */
   background-image: url('../BCoCSS/buttontoppage.png'); 
   height: 15px;          /* CHANGE: height of one button */
   width: 61px;          /* CHANGE: width of one button */
   display: block;
}

/* now we give for each button the normal position in the buttonblock, */
/* and after that the position at hovering (mouse-over) */

#buttonTOP { background-position: -61px 0px; }
#buttonTOP a { background-position: -61px 0px; }
#buttonTOP a:hover { background-position: 0px 0; }