h1 { color: white; font-family: sans-serif; }

body {
 background: black; 
}
#arena {
 width: 80%;
 height: 80%;
 position: absolute;
 top: 10%;
 left: 10%;
 background: #5096F5 url(clouds.gif) 0 0 repeat-x;
 overflow: hidden; 
}
#field {
 position: absolute;
 width: 100%;
 height: 20%;
 bottom: 0px;
}
#field div {
 width: 100%; height: 35%; margin: 0px; padding: 0px;
 background: #094 url(grass.gif) fixed; 
 text-align: right;
}
#field span {
 display: block; position: absolute; width: 100%; height: 32px;
 top: -15px;
 background: url(tufts.png) repeat-x;
}
#guy {
 position: absolute;
 right: -1000px;
 width: 100px;
 height: 96px;
 z-index: 5;
 background: url(guy.gif) 0 0 no-repeat;
}

#bees div {
 position: absolute;
 width: 16px;
 height: 16px;
 background: url(bee.png) 0 0;
}
#bees div div { 
	position: absolute;
	top: -1em;
	background: none;
	font-size: 60%;
}

#trees-front {
  position: absolute;
  left: 0px;
  bottom: 15%;
  width: 100%;
  height: 256px;
}
#trees-front div {
  z-index: 10000;
  width: 128px;
  height: 256px;
  position: absolute;
  left: 0px; bottom: -15px;
  background: url(tree-big.gif) center bottom no-repeat;
}
#trees-front span {
 display: block; position: absolute; width: 100%; height: 32px;
 bottom: -15px;
 background: url(tufts.png) repeat-x;
 z-index: 10001;
}

#trees-back {
  position: absolute;
  left: 0px;
  bottom: 20%;
  width: 100%;
  height: 192px;
}
#trees-back div {
  z-index: 1;
  width: 128px;
  height: 192px;
  position: absolute;
  left: 0px; bottom: -8px;
  background: url(tree-small.gif) center bottom no-repeat;
  font-size: 75%;
}