﻿#sse2
{
    /*You can decorate the menu's container, such as adding background images through this block*/
    background-color: #344a6b;
    height: 100%;
    padding: 5px;
    border-radius: 3px;
    box-sizing: content-box;
}
#sses2
{
    /*margin:0 auto;This will make the menu center-aligned. Removing this line will make the menu align left.*/
}
#sses2 ul 
{ 
    position: relative;
    list-style-type: none;
    float:left;
    padding:0;margin:0;
}
#sses2 li
{
    float:left;
    list-style-type: none;
    padding:0;margin:0;background-image:none;
}
/*CSS for background bubble*/
#sses2 li.highlight
{
    background:#465874 no-repeat center bottom;
    top:3px;
    height:23px;
    border-radius: 10px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    z-index: 1;
    position: absolute;
    overflow:hidden;
}
#sses2 li a
{
    height:23px;
    padding-top: 8px;
    margin: 0 20px;/*used to adjust the distance between each menu item. Now the distance is 20+20=40px.*/
    color: #fff;
    font: normal 12px arial;
    text-align: center;
    text-decoration: none;
    float: left;
    display: block;
    position: relative;
    /*z-index: 1;*/
}

#sses3
{
    margin:auto 0;/*This will make the menu center-aligned. Removing this line will make the menu align left.*/
}


#sses4 {
    /*margin:0 auto;This will make the menu center-aligned. Removing this line will make the menu align left.*/
}

    #sses4 ul {
        position: relative;
        list-style-type: none;
        float: left;
        padding: 0;
        margin: 0;
    }

    #sses4 li {
        float: left;
        list-style-type: none;
        padding: 0;
        margin: 0;
        background-image: none;
    }
        /*CSS for background bubble*/
        #sses4 li.highlight {
            background: #465874 no-repeat center bottom;
            top: 3px;
            height: 23px;
            border-radius: 10px;
            -moz-border-radius: 8px;
            -webkit-border-radius: 8px;
            z-index: 1;
            position: absolute;
            overflow: hidden;
        }

        #sses4 li a {
            height: 23px;
            padding-top: 8px;
            margin: 0 20px; /*used to adjust the distance between each menu item. Now the distance is 20+20=40px.*/
            color: #fff;
            font: normal 12px arial;
            text-align: center;
            text-decoration: none;
            float: left;
            display: block;
            position: relative;
            /*z-index: 1;*/
        }

@media (max-width: 1000px) {
    #sse2 {
        background-color: #344a6b;
        height: 100%;
        padding: 5px;
        border-radius: 3px;
        box-sizing: content-box;
    }
    #sses2 {
        /*margin:0 auto;This will make the menu center-aligned. Removing this line will make the menu align left.*/
    }

        #sses2 ul {
            position: relative;
            list-style-type: none;
            float: left;
            padding: 0;
            margin: 0;
            padding-bottom: 20px;
        }

        #sses2 li {
            float: left;
            list-style-type: none;
            padding: 0;
            margin: 0;
            background-image: none;
        }
            /*CSS for background bubble*/
            #sses2 li.highlight {
                background: #465874 no-repeat center bottom;
                top: 3px;
                height: 23px;
                border-radius: 10px;
                -moz-border-radius: 8px;
                -webkit-border-radius: 8px;
                z-index: 1;
                position: absolute;
                overflow: hidden;
            }

            #sses2 li a {
                height: 23px;
                /*width: 300px;*/
                padding-top: 5px;
                /* margin: 0 5px;*/ /*used to adjust the distance between each menu item. Now the distance is 20+20=40px.*/
                color: #fff;
                font: normal 12px arial;
                text-align: left;
                text-decoration: none;
                display: block;
                position: relative;
                /*z-index: 1;*/
            }
    #sses4 {
        display: none;
    }
}