/* Navbar */
#navbar {

        clear: both;
        margin: 0 30px 0 270px;
        padding: 19px 0 0 0;
        font: bold 18px 'trebuchet ms', verdana, arial, sans-serif;

}


#navbar p {margin: 0 ; padding: 0;}

#navbar ul {
        list-style: none;

}


/* Rollover state */
#navbar li {
        float: left;
        height: 32px;
        margin: 0;
        display: block;
        position: relative;
        overflow: visible;
        padding: 8px 0 0 12px;
        margin: 0 5px
}


#navbar li.active {background: #fff;}
#training #navbar li.active {background: #cc2030;}
#agency #navbar li.active {background: #103562;}
#mad #navbar li.active {background: #085a17;}
#tbt #navbar li.active {background: #5f2f1b;}


#navbar li:hover {background: #fff;}
#training #navbar li.active:hover {background: #cc2030;}
#agency #navbar li.active:hover {background: #103562;}
#mad #navbar li.active:hover {background: #085a17;}
#tbt #navbar li.active:hover {background: #5f2f1b;}


/* Rolloff state */
#navbar li a, #navbar li a:link { display: block; width: 100%; height: 31px; background-position: 0 -1px; position: relative; overflow: hidden; color: #fff;}

#navbar li.active a {color: #161616;}
#training #navbar li.active a {color: #fff;}
#agency #navbar li.active a {color: #fff;}
#mad #navbar li.active a {color: #fff;}
#tbt #navbar li.active a {color: #fff;}

#navbar li:hover a {color: #161616;}
#training #navbar li.active:hover a {color: #fff;}
#agency #navbar li.active:hover a {color: #fff;}
#mad #navbar li.active:hover a {color: #fff;}
#tbt #navbar li.active:hover a {color: #fff;}

#navbar li a:hover {color: #161616;}
#training #navbar li.active a:hover {color: #fff;}
#agency #navbar li.active a:hover {color: #fff;}
#mad #navbar li.active a:hover {color: #fff;}
#tbt #navbar li.active a:hover {color: #fff;}







/* Hide <a> text and hide off-state image when rolling over (prevents flicker in IE) */
/*#navbar li span a strong                { display: none; }*/
/*#navbar li span a:hover        { background-image: none; }*/

#navbar li span { position: absolute; width: 100%; height: 100%; cursor: pointer; margin-top: -1px;}

/*
#navbar li a:hover span         { background-position: 0 -32px; }
#navbar li a .hovering                 { background-position: 0 -32px; }
*/



/* Big button dimensions  */
#navbar li.but-1  { width: 92px; }
#navbar li.but-2  { width: 77px; }
#navbar li.but-3  { width: 47px; }
#navbar li.but-4  { width: 129px; }
#navbar li.but-5  { width: 112px; }
#navbar li.but-6  { width: 54px; }
#navbar li.but-7  { width: 92px; } 

#navbar li.but-1, #navbar li.but-2,#navbar li.but-3, #navbar li.but-4, #navbar li.but-5, #navbar li.but-6 {

         text-transform: uppercase;
         font-weight: bold;



   }

/* Big button images */
.but-1 span { background-image: url("./images/but_about.gif"); }
.but-2 span { background: url("./images/but_dev.gif"); }
.but-3 span { background: url("./images/but_downloads.gif"); }
.but-4 span { background: url("./images/but_community.gif"); }
.but-5 span { background: url("./images/but_support.gif"); }
.but-6 span { background: url("./images/but_customise.gif"); }


/* Always active states */
body.about li.but-1 span,
body.development li.but-2 span,
body.downloads li.but-3 span,
body.languages li.but-4 span,
body.customise li.but-5 span,
body.mods li.but-6 span{
        background-position: 0 -64px;
}

/* Always hover for active states */
body.about li.but-1 span:hover,
body.development li.but-2 span:hover,
body.downloads li.but-3 span:hover,
body.languages li.but-4 span:hover,
body.customise li.but-5 span:hover,
body.mods li.but-6 span {
        background-position: 0 -32px;
}





/* ---------------------------


         SUB-MENU

------------------------------- */



.sub-menu {
        background: url(pics/back_submenu_w.png) no-repeat transparent;
        position: absolute;
        z-index: 999;
        padding: 10px 10px 0 10px;
        margin: 0 0 0 -10px;
        top: 40px;
        width: 410px;
        left: 0;
        overflow: visible;
        display: none;
        font: normal 10px verdana, arial, sans-serif;
        text-transform: none;
        border-left: 1px solid #e4e4e4;

}


#impressum li.active .sub-menu {background: url(pics/back_submenu_w.png) no-repeat transparent;}
#training li.active .sub-menu {background: url(pics/back_submenu_red.png) no-repeat transparent; border: none;}
#agency li.active .sub-menu {background: url(pics/back_submenu_blue.png) no-repeat transparent; border: none;}
#mad li.active .sub-menu {background: url(pics/back_submenu_green.png) no-repeat transparent; border: none;}
#tbt li.active .sub-menu {background: url(pics/back_submenu_brown.png) no-repeat transparent; border: none;}

.sub-menu ul {

        float: left;
        margin-left: 0px;


}




#navbar .sub-menu li {
        display: block;
        float:  left;
        width: 145px;
        height: 50px;
        padding: 6px 46px 20px 6px;
        margin: 0 4px 4px 0;
        font: bold 16px 'trebuchet ms', verdana, arial, sans-serif;
        text-transform: uppercase;


}

#navbar .sub-menu li.firstclass {display: none;}

#navbar .sub-menu li .speaking_block {width: 145px; display: block; font-size: 11px; text-transform: none; line-height: 13px; padding: 2px 0 0 0;}

.sub-menu-extra {
        padding-bottom: 5px;
}

.sub-menu-extra .sub-menu-bottom {
        background: url(pics/back_submenu_bw.png) no-repeat;
        clear:both;
        height: 45px;
        clear: both;
        width: 380px;
        position: absolute;
        bottom: -45px;
        left: -1px;
        margin-top: 0;
        padding: 0 25px;
        padding-bottom: 0px;
        text-align: right;
        color: #161616;


}

#training .active .sub-menu-extra .sub-menu-bottom {background: url(pics/back_submenu_bred.png) 1px 0 no-repeat;}
#agency .active .sub-menu-extra .sub-menu-bottom {background: url(pics/back_submenu_bblue.png) 1px 0 no-repeat;}
#mad .active .sub-menu-extra .sub-menu-bottom {background: url(pics/back_submenu_bgreen.png) 1px 0 no-repeat;}
#tbt .active .sub-menu-extra .sub-menu-bottom {background: url(pics/back_submenu_bbrown.png) 1px 0 no-repeat;}

.sub-menu-bottom a {
        border-top: 1px dashed #b2b8bd;
        display: block;
        padding-top: 10px;
        font-weight: bold;
        color: #161616;

}

#training .active .sub-menu-bottom a {border-top: 1px dashed #fff;}
#agency .active .sub-menu-bottom a {border-top: 1px dashed #fff;}
#mad .active .sub-menu-bottom a {border-top: 1px dashed #fff;}
#tbt .active .sub-menu-bottom a {border-top: 1px dashed #fff;}

#navbar li .sub-menu-bottom a:hover {
        color: #161616;

}

#training .active .sub-menu-bottom a:hover {color: #fff;}
#agency .active .sub-menu-bottom a:hover {color: #fff;}
#mad .active .sub-menu-bottom a:hover {color: #fff;}
#tbt .active .sub-menu-bottom a:hover {color: #fff;}

#navbar li .sub-menu a {
        background: none;
        display:block;
        height:auto;
        overflow:hidden;
        position: static;
        width: auto;
        color: #252525;
        font-weight: normal;
}

#training .active .sub-menu a {color: #FFF;}
#agency .active .sub-menu a {color: #FFF;}
#mad .active .sub-menu a {color: #FFF;}
#tbt .active .sub-menu a {color: #FFF;}


#navbar .sub-menu a:hover {
        color: #FFF;
        text-decoration: none;

}




#navbar .sub-menu li:hover, .hover_ie {
        background: url(pics/back_sub_hover_w.jpg) repeat-x;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        -moz-box-shadow: 0 0px 2px rgba(0,0,0,0.3);
        -webkit-box-shadow: 0 0px 4px rgba(0,0,0,0.3);
        padding: 6;
}

#training .active .sub-menu li:hover, .hover_ie {background: url(pics/back_sub_hover_red.jpg) repeat-x;}
#agency .active .sub-menu li:hover, .hover_ie {background: url(pics/back_sub_hover_blue.jpg) repeat-x;}
#mad .active .sub-menu li:hover, .hover_ie {background: url(pics/back_sub_hover_green.jpg) repeat-x;}
#tbt .active .sub-menu li:hover, .hover_ie {background: url(pics/back_sub_hover_brown.jpg) repeat-x;}

#navbar .sub-menu li:hover a, #navbar .hover_ie p a, #navbar .hover_ie p a:hover {
        color: #161616;
        text-shadow: none;
}

#training .active .sub-menu li:hover a, #training .active .hover_ie p a, #training active .hover_ie p a:hover {
        color: #e8e6e6;
        text-shadow: none;
}

#agency .active .sub-menu li:hover a, #agency.active .hover_ie p a, #agency active .hover_ie p a:hover {
        color: #e8e6e6;
        text-shadow: none;
}


#mad .active .sub-menu li:hover a, #mad .active .hover_ie p a, #mad active .hover_ie p a:hover {
        color: #e8e6e6;
        text-shadow: none;
}

#tbt .active .sub-menu li:hover a, #tbt.active .hover_ie p a, #tbt active .hover_ie p a:hover {
        color: #e8e6e6;
        text-shadow: none;
}