#nav-wrap
{
    font-size: 105%;
    margin: 0 auto;
    text-align: center;
}

.inner_page_menu #nav-wrap
{
    float: right;
}

@media screen and (-webkit-min-device-pixel-ratio:0)
{
    .inner_page_menu #nav-wrap
    {
        margin-left: 0%;
    }
}
/* menu icon */
#menu-icon
{
    display: none; /* hide menu icon initially */
}

#nav, #nav li
{
    margin: 0;
    padding: 0;
}

    #nav li
    {
        list-style: none;
        float: left;
        position: relative;
    }

        #nav li:last-child
        {
            border: 0;
        }
    /* nav link */
    #nav a.toplink
    {
        text-decoration: none;
        display: block;
        padding: 0px 0px 2px 0;
        margin: 0 11px;
        color: #3A2E7A;
    }


        #nav a.toplink:hover, #nav li:hover a.toplink
        {
            color: #3A2E7A;
            border-bottom: 2px solid #473368;
            font-weight: bold;
        }

    #nav li a.active a.toplink
    {
        color: #473368;
        border-bottom: 2px solid #473368;
    }

    #nav a.active
    {
        color: #3A2E7A;
        border-bottom: 2px solid #473368;
    }


    /* nav dropdown */
    #nav ul
    {
        background: #a2ced3;
        padding: 0px;
        position: absolute;
        left: -1px;
        top: 66px;
        display: none;
        width: 200px;
        border: 1px solid #e1e4e4;
        border-top: 0px;
    }

        #nav ul li
        {
            float: none;
            margin: 0;
            padding: 0 0px;
            border: 0px;
        }

        #nav ul a
        {
            text-decoration: none;
            padding: 10px 12px;
            display: block;
            color: #FFF; /*background:url(../images/nav_bullet.png) left 14px no-repeat; */
        }

            #nav ul a:hover
            {
                color: #ffc003; /*url(../images/nav_bullet-hover.png) left 14px no-repeat;*/
            }

            #nav ul a.active
            {
                color: #ffc003;
            }

    #nav li:hover > ul
    {
        display: block;
        /* show dropdown on hover */
    }
    
 /* nav dropdown */
#nav ul { background:#3c3279;   position: absolute; left:11px; top:25px;  display: none;  width: 200px; text-align:left;z-index:99999; }
#nav ul li { float: none; margin: 0; padding:5px 10px; border:0px; border-bottom:1px solid #444444; }
#nav ul a { text-decoration:none; padding: 0px 0px; display: block; color: #FFF;  /*background:url(../images/nav_bullet.png) left 14px no-repeat; */   }
#nav ul a:hover { color: #D9DCFF;font-weight: bold; /*url(../images/nav_bullet-hover.png) left 14px no-repeat;*/ }
#nav ul a.active {color:#ffc003 }
#nav li:hover > ul { display: block; 
/* show dropdown on hover */ }
    #nav ul li a span {
        font-size :80%;
        
    }
  


@media only screen and (min-width: 768px) and (max-width: 999px)
{
    .inner_page_menu #nav-wrap
    {
        float: left;
        position: relative;
    }

    #nav-wrap
    {
        font-size: 83%;
        float: left;
    }

    .inner_page_menu #nav-wrap #nav
    {
        display: blcck !important;
    }

    .inner_page_menu #menu-icon
    {
        color: #FFF;
        width: 50px;
        height: 35px;
        line-height: 30px;
        margin-top: 5px;
        background: url(../images/menu-icon.png) no-repeat 10px center;
        padding: 5px 10px 0 36px;
        cursor: pointer;
        display: block; /* show menu icon */
    }

        .inner_page_menu #menu-icon:hover
        {
            background-color: #473368;
        }

        .inner_page_menu #menu-icon.active
        {
            background-color: #473368;
        }
    /* main nav */
    .inner_page_menu #nav
    {
        clear: both;
        position: absolute;
        top: 45px;
        width: 160px;
        z-index: 10000;
        padding: 5px;
        background: #1b1b1b;
        display: none; /* visibility will be toggled with jquery */
    }

        .inner_page_menu #nav li
        {
            clear: both;
            float: none;
            margin: 5px 5px 8px 5px;
            border: none;
            border-bottom: 1px solid #2a2725;
        }

        .inner_page_menu #nav a.toplink
        {
            height: auto;
            border-bottom: 0px!important;
        }

        .inner_page_menu #nav a.toplink, #nav ul a
        {
            font: inherit;
            background: none !important;
            display: block;
            padding: 0 !important;
            color: #FFF;
            border: none;
        }

            .inner_page_menu #nav a.toplink:hover, #nav ul a:hover
            {
                background: none !important;
                color: #9076bb !important;
            }
        /* dropdown */
        .inner_page_menu #nav ul
        {
            width: auto;
            position: static;
            display: block;
            border: none;
            background: inherit;
        }

            .inner_page_menu #nav ul li
            {
                margin: 6px 0 3px 15px;
            }
}


@media screen and (max-width: 767px)
{

    #nav-wrap
    {
        float: left;
        position: relative;
    }
    /* menu icon */
    #menu-icon
    {
        color: #FFF;
        width: 50px;
        height: 35px;
        line-height: 30px;
        /*margin-top: 6px;*/
        background: url(../images/menu-icon.png) no-repeat 10px center;
        padding: 5px 10px 0 36px;
        cursor: pointer;
        display: block; /* show menu icon */
        background-color: #3A2E7A;
    }

        #menu-icon:hover
        {
            background-color: #3A2E7A;
            color: #FFF;
        }

        #menu-icon.active
        {
            background-color: #3A2E7A;
        }
    /* main nav */
    #nav
    {
        clear: both;
        position: absolute;
        top: 40px;
        width: 300px;
        z-index: 10000;
        padding: 5px;
        background: #1b1b1b;
        display: none; /* visibility will be toggled with jquery */
    }

        #nav li
        {
            clear: both;
            float: none;
            margin: 5px 5px 8px 5px;
            border: none;
            border-bottom: 1px solid #2a2725;
        }

        #nav a.toplink
        {
            height: auto;
            border-bottom: 0px!important;
        }

        #nav a.toplink, #nav ul a
        {
            font: inherit;
            background: none !important;
            display: block;
            padding: 0 !important;
            color: #FFF;
            border: none;
            text-align: left;
        }

            #nav a.toplink:hover, #nav ul a:hover
            {
                background: none !important;
                color: #3A2E7A !important;
            }
        /* dropdown */
        #nav ul
        {
            width: auto;
            position: static;
            display: block;
            border: none;
            background: inherit;
        }

            #nav ul li
            {
                margin: 6px 0 3px 15px;
            }
}

@media screen and (min-width: 767px)
{
    /* ensure #nav is visible on desktop version */
    #nav
    {
        display: block !important;
    }
}