/* navigation */
#nav {
        height:22px;
        width:570px;
        margin-top:153px;
        z-index: 5;
}

#nav ul {
        width:570px;
        margin:0;
        padding:0;
        padding-left:4px;
}

#nav li {
        float:left;
        width:106px;
        list-style-type:none;
        text-align:center;
        margin:0px;
        padding:0px;
        padding-left:5px;
}

#nav a {
        background: url(bg/wb_button_normal.gif);
        color:#333333;
        display:block;
        position:relative;
        font-size:8pt;
        font-weight: normal;
        height:21px;
        text-align: center;
        text-decoration:none;
}

#nav a.current {
        background: url(bg/wb_button_active.gif);
        color:#000000;
        font-weight: bold;
}

#nav span {
        display:block;
        padding:3px;
        padding-top: 3px;
}

/* panes */
#panes {
        width:570px;
        height:193px;
        margin-bottom:-20px;
        padding-bottom:0px;

        /* must be relative so the individual panes can be absolutely positioned */
        position:relative;
}

/* crossfading effect needs absolute positioning from the elements */
#panes div.pane {
        display:none;
        position:absolute;
        top:0px;
        left:0px;
        width:570px;
}

.overlay {
        display:none;
        width:500px;
        padding:20px;
        background-color:#ddd;
}

/**
 * While we're having the loading class set.
 * Removig it, will remove the loading message
 */
DIV#pane1.loading,DIV#pane2.loading,DIV#pane3.loading,DIV#pane4.loading,DIV#pane5.loading {
  background: url(bg/ajax-loader.gif) no-repeat center center;
}