$(document).ready(function(){
    var subWidthSum = 0;
    $(".sub-container").map(function() {
        var child = $(this);
        id = child.attr('id').substr(4);
        
        child.css('left',subWidthSum+'px');
        
        child.css('width',$("#main-"+id).width() + 4);
        
        subWidthSum += $("#main-"+id).width() + 2;
    });
    
    $(".navigation-main").mouseover(function(){
        var id = $(this).attr('id').substring(5);
        $(".sub-container:not(#sub-"+id+")").slideUp(200);
        $("#sub-"+id).slideDown(200);            
    });
    $(".navigation-container").mouseleave(function(){
        $(".sub-container").slideUp(200);      
    });
    
    $(".navigation-subcell a").mouseover(function(){
        $(this).parent().css('background-color','#7bafde');
    }).mouseout(function(){
        $(this).parent().css('background-color','#fff');
    });
    
});