@charset "utf-8";
body 
{
margin:auto;
position:relative;
width:800px;
background-color:#CCFFFF;
}

#sitebanner
{
margin:0;
height:82px;
}

#sitebanner h1
{
margin:0;
position:relative;
width:800px;
height:82px;
overflow:hidden;
}

#sitebanner h1 span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:800px;
height:82px;
background:url(/images/sitebanner.gif) 0 0 no-repeat;
}

#pagebanner
{
margin:0;
height:50px;
}

#pagebanner h1
{
margin:0;
position:relative;
width:800px;
height:50px;
overflow:hidden;
}

#pagebanner h1 span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:800px;
height:50px;
}

#pagebanner h1.index span
{
background:url(/images/pagebanner-index.gif) 0 0 no-repeat;
}

#pagebanner h1.promo span
{
background:url(/images/pagebanner-promo.gif) 0 0 no-repeat;
}

#pagebanner h1.tryenter span
{
background:url(/images/pagebanner-tryenter.gif) 0 0 no-repeat;
}

#pagebanner h1.manage span
{
background:url(/images/pagebanner-manage.gif) 0 0 no-repeat;
}

#pagebanner h1.enter span
{
background:url(/images/pagebanner-enter.gif) 0 0 no-repeat;
}

#pagebanner h1.exit span
{
background:url(/images/pagebanner-exit.gif) 0 0 no-repeat;
}

#pagebanner h1.char-list span
{
background:url(/images/pagebanner-char-list.gif) 0 0 no-repeat;
}

#pagebanner h1.char-edit span
{
background:url(/images/pagebanner-char-edit.gif) 0 0 no-repeat;
}

#pagebanner h1.stor-list span
{
background:url(/images/pagebanner-stor-list.gif) 0 0 no-repeat;
}

#pagebanner h1.stor-edit span
{
background:url(/images/pagebanner-stor-edit.gif) 0 0 no-repeat;
}

#pagebanner h1.activity1 span
{
background:url(/images/pagebanner-activity1.gif) 0 0 no-repeat;
}

#pagebanner h1.activity2 span
{
background:url(/images/pagebanner-activity2.gif) 0 0 no-repeat;
}

#pagebanner h1.our-char-list span
{
background:url(/images/pagebanner-our-char-list.gif) 0 0 no-repeat;
}

#pagebanner h1.our-stor-list span
{
background:url(/images/pagebanner-our-stor-list.gif) 0 0 no-repeat;
}

#pagebanner h1.lessons span
{
background:url(/images/pagebanner-lessons.gif) 0 0 no-repeat;
}

#pagebanner h1.clas-list span
{
background:url(/images/pagebanner-clas-list.gif) 0 0 no-repeat;
}

#pagebanner h1.comps span
{
background:url(/images/pagebanner-comps.gif) 0 0 no-repeat;
}

#pagebanner h1.comp span
{
background:url(/images/pagebanner-comp.gif) 0 0 no-repeat;
}

#pagebanner h1.winner span
{
background:url(/images/pagebanner-winner.gif) 0 0 no-repeat;
}

#pagebanner h1.winners span
{
background:url(/images/pagebanner-winners.gif) 0 0 no-repeat;
}

#pagebanner h1.workshops span
{
background:url(/images/pagebanner-workshops.gif) 0 0 no-repeat;
}

#menu
{
float:left;
width:199px;
margin:0;
padding:0;
}

#menu ul
{
list-style-type:none;
margin:0;
padding:0;
}

#treetop a
{
display:block;
padding:0px;
position:relative;
width:199px;
height:80px;
overflow:hidden;
}

#treetop a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:199px;
height:80px;
background:url(/images/treetop.gif) 0 0 no-repeat;
}

#treetop a:hover span
{
background-position:-199px 0;
}

#treetop a:active span
{
background-position:-398px 0;
}

#theatre1 a
{
display:block;
padding:0px;
position:relative;
width:199px;
height:69px;
overflow:hidden;
}

#theatre1 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:199px;
height:69px;
background:url(/images/theatre1.gif) 0 0 no-repeat;
}

#theatre1 a:hover span
{
background-position:-199px 0;
}

#theatre1 a:active span
{
background-position:-398px 0;
}

#games1 a
{
display:block;
padding:0px;
position:relative;
width:199px;
height:59px;
overflow:hidden;
}

#games1 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:199px;
height:59px;
background:url(/images/games1.gif) 0 0 no-repeat;
}

#games1 a:hover span
{
background-position:-199px 0;
}

#games1 a:active span
{
background-position:-398px 0;
}

#teachers a
{
display:block;
padding:0px;
position:relative;
width:199px;
height:60px;
overflow:hidden;
}

#teachers a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:199px;
height:60px;
background:url(/images/teachers.gif) 0 0 no-repeat;
}

#teachers a:hover span
{
background-position:-199px 0;
}

#teachers a:active span
{
background-position:-398px 0;
}

#charlink1 a
{
display:block;
padding:0px;
position:relative;
width:199px;
height:60px;
overflow:hidden;
}

#charlink1 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:199px;
height:60px;
background:url(/images/charlink1.gif) 0 0 no-repeat;
}

#charlink1 a:hover span
{
background-position:-199px 0;
}

#charlink1 a:active span
{
background-position:-398px 0;
}

#ourslink1 a
{
display:block;
padding:0px;
position:relative;
width:199px;
height:60px;
overflow:hidden;
}

#ourslink1 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:199px;
height:60px;
background:url(/images/ourslink1.gif) 0 0 no-repeat;
}

#ourslink1 a:hover span
{
background-position:-199px 0;
}

#ourslink1 a:active span
{
background-position:-398px 0;
}

#lesslink1 a
{
display:block;
padding:0px;
position:relative;
width:199px;
height:60px;
overflow:hidden;
}

#lesslink1 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:199px;
height:60px;
background:url(/images/lesslink1.gif) 0 0 no-repeat;
}

#lesslink1 a:hover span
{
background-position:-199px 0;
}

#lesslink1 a:active span
{
background-position:-398px 0;
}

#about1 a
{
display:block;
padding:0px;
position:relative;
width:199px;
height:60px;
overflow:hidden;
}

#about1 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:199px;
height:60px;
background:url(/images/about1.gif) 0 0 no-repeat;
}

#about1 a:hover span
{
background-position:-199px 0;
}

#about1 a:active span
{
background-position:-398px 0;
}

#storlink1 a
{
display:block;
padding:0px;
position:relative;
width:199px;
height:60px;
overflow:hidden;
}

#storlink1 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:199px;
height:60px;
background:url(/images/storlink1.gif) 0 0 no-repeat;
}

#storlink1 a:hover span
{
background-position:-199px 0;
}

#storlink1 a:active span
{
background-position:-398px 0;
}

#ourslink2 a
{
display:block;
padding:0px;
position:relative;
width:199px;
height:60px;
overflow:hidden;
}

#ourslink2 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:199px;
height:60px;
background:url(/images/ourslink2.gif) 0 0 no-repeat;
}

#ourslink2 a:hover span
{
background-position:-199px 0;
}

#ourslink2 a:active span
{
background-position:-398px 0;
}

#claslink1 a
{
display:block;
padding:0px;
position:relative;
width:199px;
height:60px;
overflow:hidden;
}

#claslink1 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:199px;
height:60px;
background:url(/images/claslink1.gif) 0 0 no-repeat;
}

#claslink1 a:hover span
{
background-position:-199px 0;
}

#claslink1 a:active span
{
background-position:-398px 0;
}

#resources1 a
{
display:block;
padding:0px;
position:relative;
width:199px;
height:60px;
overflow:hidden;
}

#resources1 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:199px;
height:60px;
background:url(/images/resources1.gif) 0 0 no-repeat;
}

#resources1 a:hover span
{
background-position:-199px 0;
}

#resources1 a:active span
{
background-position:-398px 0;
}

#manage a
{
display:block;
padding:0px;
position:relative;
width:199px;
height:60px;
overflow:hidden;
}

#manage a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:199px;
height:60px;
background:url(/images/manage.gif) 0 0 no-repeat;
}

#manage a:hover span
{
background-position:-199px 0;
}

#manage a:active span
{
background-position:-398px 0;
}

#stump em
{
display:block;
padding:0px;
position:relative;
width:199px;
height:60px;
overflow:hidden;
}

#stump em span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:199px;
height:60px;
background:url(/images/stump.gif) 0 0 no-repeat;
}

#snailtales a
{
display:block;
padding:0px;
position:relative;
width:199px;
height:126px;
overflow:hidden;
}

#snailtales a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:199px;
height:126px;
background:url(/images/snailtales.gif) 0 0 no-repeat;
}

#snailtales a:hover span
{
background-position:-199px 0;
}

#snailtales a:active span
{
background-position:-398px 0;
}

#logout a
{
display:block;
padding:0px;
position:relative;
width:199px;
height:126px;
overflow:hidden;
background-color:#99FFFF;
}

#logout a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:199px;
height:126px;
background:url(/images/logout.gif) 0 0 no-repeat;
}

#logout a:hover span
{
background-position:-199px 0;
}

#logout a:active span
{
background-position:-398px 0;
}

#login a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#login a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/login.gif) 0 0 no-repeat;
}

#login a:hover span
{
background-position:-120px 0;
}

#register a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#register a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/register.gif) 0 0 no-repeat;
}

#register a:hover span
{
background-position:-120px 0;
}

#games2 a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#games2 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/games2.gif) 0 0 no-repeat;
}

#games2 a:hover span
{
background-position:-120px 0;
}

#resources2 a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#resources2 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/resources2.gif) 0 0 no-repeat;
}

#resources2 a:hover span
{
background-position:-120px 0;
}

#theatre2 a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#theatre2 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/theatre2.gif) 0 0 no-repeat;
}

#theatre2 a:hover span
{
background-position:-120px 0;
}

#about2 a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#about2 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/about2.gif) 0 0 no-repeat;
}

#about2 a:hover span
{
background-position:-120px 0;
}

#promo1 a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#promo1 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/promo1.gif) 0 0 no-repeat;
}

#promo1 a:hover span
{
background-position:-120px 0;
}

#promo2 a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#promo2 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/promo2.gif) 0 0 no-repeat;
}

#promo2 a:hover span
{
background-position:-120px 0;
}

#promo3 a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#promo3 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/promo3.gif) 0 0 no-repeat;
}

#promo3 a:hover span
{
background-position:-120px 0;
}

#read a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#read a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/read.gif) 0 0 no-repeat;
}

#read a:hover span
{
background-position:-120px 0;
}

#storlink2 a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#storlink2 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/storlink2.gif) 0 0 no-repeat;
}

#storlink2 a:hover span
{
background-position:-120px 0;
}

#charlink2 a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#charlink2 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/charlink2.gif) 0 0 no-repeat;
}

#charlink2 a:hover span
{
background-position:-120px 0;
}

#game1 a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#game1 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/game1.gif) 0 0 no-repeat;
}

#game1 a:hover span
{
background-position:-120px 0;
}

#game2 a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#game2 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/game2.gif) 0 0 no-repeat;
}

#game2 a:hover span
{
background-position:-120px 0;
}

#charlink3 a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#charlink3 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/charlink3.gif) 0 0 no-repeat;
}

#charlink3 a:hover span
{
background-position:-120px 0;
}

#nextpage a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#nextpage a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/nextpage.gif) 0 0 no-repeat;
}

#nextpage a:hover span
{
background-position:-120px 0;
}

#lastpage a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#lastpage a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/lastpage.gif) 0 0 no-repeat;
}

#lastpage a:hover span
{
background-position:-120px 0;
}

#finish a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#finish a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/finish.gif) 0 0 no-repeat;
}

#finish a:hover span
{
background-position:-120px 0;
}

#claslink2 a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#claslink2 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/claslink2.gif) 0 0 no-repeat;
}

#claslink2 a:hover span
{
background-position:-120px 0;
}

#lesslink2 a
{
display:block;
padding:0px;
position:relative;
width:120px;
height:120px;
overflow:hidden;
}

#lesslink2 a span
{
display:block;
z-index:1;
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
width:120px;
height:120px;
background:url(/images/lesslink2.gif) 0 0 no-repeat;
}

#lesslink2 a:hover span
{
background-position:-120px 0;
}

#content
{
margin:0;
padding:0;
width:601px;
float:right;
}

#content p,#content h1,#content h3
{
padding:0 20px 10px;
}

#content ul
{
padding:0 20px 10px 40px;
}

#content h1
{
font-size:120%;
}

#bubblehead
{
margin:0;
padding:0;
height:39px;
background:url(/images/bubblehead.png) 0 0 no-repeat;
}

#bubblebody
{
margin:0;
background:url(/images/bubblebody.png) 0 0;
background-repeat:repeat-y;
}

#contentmenu,#form,#contentlist,#picturecontent,#charactercontent,#storycontent,#details,#title
{
margin:0;
padding:0 40px 0;
}

#bubblefoot
{
margin:0 0 10px 0;
padding:0;
height:20px;
background:url(/images/bubblefoot.png) 0 0 no-repeat;
}

#contentmenu ul
{
list-style-type:none;
margin:0;
padding:0;
text-align:center;
}

#contentmenu li
{
display:inline-block;
zoom:1;
*display:inline;
margin:5px;
}

p,form,#bubblebody li,ul
{
margin:0;
padding:0 0 7px 0;
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
}

ul,h3,h2,h1
{
font-family:Arial, Helvetica, sans-serif;
}

#form
{
padding:0 0 0 150px;
}

#picturecontent img
{
max-width:300px;
padding:0 40px 10px;
}
