body { 
      margin:20px;
      text-align:center;
      background: url("../images/honemacro.jpg") repeat;
      position:relative;
      cursor: url("../images/worker-bee.cur"), default;
	}

table { border:1px solid black; rules:rows; }

tr {border-bottom:1px solid black;}

#maincontainer { 
       left:0px;
       color: black;	
       position:relative;
       background: url("../images/background2.jpg") repeat;
       font-family:Tahoma; 
       font-size:14px; 
       height:1100px;
       width:800px;
       border:2px solid #002D62;
margin-left: auto ;
  margin-right: auto ;
	}

#pagec { width:510px;
	  position:absolute;
          color:black;
	  height:430px;
	  font-size:16px;
	  top:300px;
	  left:240px;
	  border:0px solid #002D62;
	  text-align:left;
	  padding-left:10px;
	}

#pic1 {width:31px;
	height:250px;
        display:inline;
        position:relative;
        top:100px;
        left:400px;
        }

#pic2 {width:31px;
	height:250px;
        position:absolute;
        top:600px;
        left:200px;
        }

.pagech1,.pagech2,.pagech3,.pagech4,.pagech5,.pagech6,.pagech7,.pagech8,.pagech9
        { width:40px;
	  position:absolute;
          display:inline;
          font-family:"Trebuchet MS", Tahoma;
          margin:0px;
          color:black;
	  height:40px;
	  background: url("../images/smallhex.gif")  no-repeat; position:absolute; 
	  font-size:20px;
	  top:220px;
	  border:0px solid #002D62;
	  line-height:2em;
          font-style:italic;
          text-indent:3px;
	  padding-left:0px;}

.pagech1 {left:440px;}
.pagech2 {left:480px;}
.pagech3 {left:520px;}
.pagech4 {left:560px;}
.pagech5 {left:600px;}
.pagech6 {left:640px;}
.pagech7 {left:680px;}
.pagech8 {left:720px;}
.pagech9 {left:760px;}

.pagel {height:20px;
	width:20px;
	position:relative;
        top:2px;
	left:2px;
        border:4px solid #002D62;
       }

.right{float:right;}

img.right { padding: 4px; margin: 0 0 2px 7px; display: inline; }

H1  {clear:both; font-family:"Ariel", Ariel; font-weight:lighter; font-style:normal; color:black; font-size:30px;margin-left:10px; }

H2  {clear:both; font-family:"Trebuchet MS", Tahoma; font-weight:lighter; color:black; font-size:17px;margin-left:10px; text-align:justify}

H3  {clear:both; font-family:"Trebuchet MS", Tahoma; font-weight:lighter; color:black; font-size:17px;  font-style:italic;  top:10px;}

b {z-index:3}

a {color:darkred}
a:hover {color:brown}

/* Header bits */

#headerbit { width:800px;
	  position:absolute;
	  height:200px;
	  top:0px;
	  left:0px;
	  border-bottom:0px solid #002D62;
	  border-top:0px solid #002D62;
	  z-index:1;

	} 	

#banner{ width:715px;
	  position:absolute;
          background: url("../images/image1.gif") no-repeat;
	  height:176px;
	  top:10px;
	  left:40px;	
	  z-index:2}
	
#bee { top:15px; left: 640px;  background: url("../images/worker-bee.gif")  no-repeat; position:absolute; width:90px; height:105px; z-index:1}

#topline { top: 190px; left: 40px;  background:  url("../images/line.gif")  no-repeat; position:absolute; width:700px; height:7px; z-index:4; border:1px}

#charity { top: 170px; left: 20px; width:200px; height:10px; position:absolute}

#bottomline { top:990px; left: 40px;  background:  url("../images/line.gif")  no-repeat; position:absolute; width:700px; height:7px; z-index:4; border:1px}


#bottomtext { top: 1010px; left: 40px;position:absolute; width:700px; height:10px; z-index:4; border:1px}

#email { top: 170px; left: 235px;position:absolute; width:700px; height:10px; z-index:4; border:1px}

#email a:hover {color:green}

#counter2 { top: 970px; left: 40px; position:absolute;}

/* Menu */

#menucontainer {
	  width:200px;
	  position:absolute;
       	  background: url("../images/buttons12.gif") no-repeat;
	  height:730px;
	  top:230px;
	  left:10px;	
	  z-index:0;
	  border:0px solid #002D62;
          text-align:left;
		}


.b1,.b2,.b3,.b4,.b5,.b6,.b7,.b8,.b9,.b10,.b11,.b12 {
	  width:100px;
          color:green;
	  position:absolute;
	 height:100px;
 	  z-index:25;
	  text-align:left;
	  border:0px solid #002D62;
          line-height:500%;
          text-indent:15px;
          font-size:19px;
          letter-spacing:-0px;
          font-style:bold;
   	}

a {text-decoration:none;}

span.hide {display:none;}

.b1:hover,.b2:hover,.b3:hover,.b4:hover,.b5:hover,.b6:hover,.b7:hover,.b8:hover,.b9:hover,.b10:hover,.b11:hover,.b12:hover{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    height:100px;
    width:100px;
    top:0px; left:0px;
    border:0px solid #0cf;
    z-index:25;
    line-height:505%;
    text-indent:16px;
    color:red;
    }

.b1 {
	  top:0px;
	  left:8px;	
}

.b2 {
	  top:75px;
	  left:60px;	
		}
.b3 {
          letter-spacing:-2px;
	  top:152px;
	  left:105px;	
		}

.b4 {
	  top:150px;
	  left:12px;}	

.b5 {

          letter-spacing:-0px;
 	  top:225px;
	  left:60px;	
		}


.b6 {
          letter-spacing:-1px;
	  top:300px;
	  left:10px;	
		}

.b7 {
	  top:300px;
	  left:105px;	
		}

.b8 {
          letter-spacing:-1px;
	  top:375px;
	  left:60px;	
		}
.b9 {
          letter-spacing:-0px;
	  top:448px;
	  left:12px;	
		}
.b10 {
	  top:448px;
	  left:105px;	
		}
.b11 {
	  top:523px;
	  left:60px;	
		}
.b12 {
          letter-spacing:-0px;
	  top:598px;
	  left:12px;	
		}


.b1:hover {
	  top:0px;
	  left:8px;
 		}

.b2:hover {
	  top:75px;
	  left:60px;	
		}
.b3:hover {
          letter-spacing:-2px;
	  top:152px;
	  left:105px;	
		}

.b4:hover {
 	  top:150px;
	  left:12px;}	

.b5:hover {
 	  top:225px;
	  left:60px;	
		}

.b6:hover {
          letter-spacing:-2px;
	  top:300px;
	  left:10px;	
		}

.b7:hover {
	  top:300px;
	  left:105px;	
		}

.b8:hover {
	  top:375px;
	  left:60px;	
		}
.b9:hover {
          letter-spacing:-0px;
	  top:448px;
	  left:12px;	
		}
.b10:hover {
	  top:448px;
	  left:105px;	
		}
.b11:hover {
	  top:523px;
	  left:60px;	
		}
.b12:hover {
          letter-spacing:-0px;
	  top:598px;
	  left:12px;	
		}




#menubee{
	  width:65px;
	  position:absolute;
          display:block;
	  height:65px;
	 background:url("../images/worker-bee2.png") no-repeat; left:-10px; top:100px;
	  z-index:2;
	  border:0px solid #002D62;
          text-align:left;
		}

.menubee2{
	  width:65px;
	  position:absolute;
	  height:65px;
	 background:url("../images/bee scared.gif") no-repeat; left:135px; top:680px;
	  z-index:2;
	  border:0px solid #002D62;
          text-align:left;
		}
#news {	 background:url("../images/news.gif") no-repeat; 
         left:50px; top:-60px;
	position:absolute;
         height:565px;
	 width:361px;
         border:0px solid black;}

.jan,.feb,.mar,.apr,.may,.jun,.jul,.aug,.sep,.oct,.nov,.dec {
	  width:100px;
	  position:absolute;
	 height:100px;
 	  z-index:25;
	  text-align:center;
	  border:0px solid #002D62;
          line-height:430%;
          text-indent:0px;
          font-size:22px;
          letter-spacing:-0px;
          font-style:bold;
   

		}
.jan {top:10px;left:50px}
.feb {top:10px;left:70px}
.mar {top:10px;left:160px}
.apr {top:90px;left:20px}
.may {top:90px;left:200px}
.jun {top:160px;left:70px}
.jul {top:160px;left:160px}
.aug {top:240px;left:30px}
.sep {top:320px;left:70px}
.oct {top:320px;left:160px}
.nov {top:395px;left:20px}
.dec {top:395px; left:110px}

.jan:hover,.feb:hover,.mar:hover,.apr:hover,.may:hover,.jun:hover,.jul:hover,.aug:hover,.sep:hover,.oct:hover,.nov:hover,.dec:hover{ /*the span will display just on :hover state*/
{    display:block;
    position:absolute;
    height:100px;
    width:100px;
    top:0px; left:0px;
    border:0px solid #0cf;
    z-index:25;
    line-height:460%;
    text-indent:5px;
    color:yellow;
    }