ul
{
   overflow: hidden;
}

div > ul
{
   margin-top: 0;
   margin-left: 0;         /* Opera, xPloder */
   padding-left: 0;        /* Firefox, Safari */
}

li > ul
{
   margin-left: 1em;       /* Opera, xPloder */
   padding-left: 0;        /* Firefox, Safari */
}

li
{
   list-style: none;
   list-style-position: inside;
   padding-top: .2em;
   white-space: nowrap;
}

ul ul > li
{
   margin-left: .4em;
}

   /* top level LIs */
#gebarenbos,
#gebarenfabriek,
#gebarenwereld,
#gebarenwinkel
{
   padding: .4em 0;
}

a
{
   text-decoration: none;
}

a:focus
{
   outline: none;          /* for xPloder this is done in script */
}

span
{
   border: 1px solid transparent;
   font-size: 1em;
   font-weight: bold;
   letter-spacing: .05em;
   margin-left: .3em;
   padding: 0 .3em;
   -moz-border-radius: 6px;
   -webkit-border-radius: 6px;
}

li.folder > span
{
   cursor: pointer;
}

li.folder > span:before    /* default state: closed */
{
   content: "\25ba";       /* state glyph */
   font-size: 80%;
   margin-right: .25em;
   vertical-align: 5%;
}

li.folder > span.inbetween:before
{
   content: "\25e2";
   margin-right: .5em;
   vertical-align: 15%;
}

li.folder > span.open:before
{
   content: "\25bc";
}

li li.file span
{
   margin-left: .4em;
}

li li li.file span
{
   margin-left: -.05em;
}

#gebarenbos > span,
#gebarenfabriek > span,
#gebarenwereld > span,
#gebarenwinkel > span
{
   font-size: 1.25em;
}

#iconWrapper
{
   height: 5.6em;
}

#homeIcon,
#mailIcon
{
   border: none;
   cursor: pointer;
   margin: 2em 0 1em 1em;
   width: 2em;
   height: auto;
}