﻿
div#menu {
    height: 41px;
    /*background: url(images/main-bg.png) repeat-x;*/
    direction: rtl;
    text-align: right;
    position: relative;
    /*background-color:hsl(192, 100%, 37%);*/
    box-shadow: 0 -4px 8px -6px inset;
    border-bottom: solid 2px hsl(184, 92%, 46%);
    background-color: #3b5998;
    background-image: linear-gradient(rgba(255, 255, 255, 0.15), rgba(0, 0, 0, 0.1));
    border-bottom: solid 2px #8b9dc3;
}

/* Root = Horizontal, Secondary = Vertical */
ul#navmenu {
    margin: 0;
    border: 0 none;
    padding: 0;
    width: 100%; /*For KHTML*/
    list-style: none;
    height: 24px;
    direction: rtl;
    position: absolute;
    top: 20%;
}

    ul#navmenu li {
        margin: 0;
        border: 0 none;
        padding: 0;
        float: right; /*For Gecko*/
        display: inline;
        list-style: none;
        position: relative;
        height: 21px;
        padding:4px 0;
        /*border-bottom: solid 1px rgb(160,160,160);*/
        color:snow;
    }

    ul#navmenu li:last-child {
        border-bottom: none;
    }
    ul#navmenu ul {
        margin: 0;
        border: 0 none;
        padding: 0;
        width: 225px;
        list-style: none;
        display: none;
        position: absolute;
        top: 25px;
        right: 0;
        /*background-color:hsl(192, 100%, 32%);
        box-shadow: 0 7px 20px -5px black ;*/
        background-color: #3b5998;
        box-shadow: 0 15px 5px -15px black inset;
        border-radius: 2px 2px 8px 8px;
        z-index: 99999;
        padding-bottom: 10px;
        padding-right: 4px;
    }

        ul#navmenu ul:after /*From IE 7 lack of compliance*/ {
            clear: both;
            display: block;
            font: 1px/0px inherit;
            content: ".";
            height: 0;
            visibility: hidden;
        }

        ul#navmenu ul li {
            width: 100%;
            float: left; /*For IE 7 lack of compliance*/
            display: block !important;
            display: inline; /*For IE*/
            margin: 3px auto;
        }


    /* Root Menu */
    ul#navmenu a {
        vertical-align: middle;
        padding: 0 6px;
        float: none !important; /*For Opera*/
        float: left; /*For IE*/
        display: block;
        /*color: White;*/
        /*color:rgb(95,95,95);*/
        color:snow;
        font-family: inherit;
        font-size: 14px;
        text-decoration: none;
        height: auto !important;
        height: 100%; /*For IE*/
            transition: all 0.2s ease-in-out !important;
    }

    /* Root Menu Hover Persistence */ انتخاب ul#navmenu a:hover,
    ul#navmenu li:hover a,
    ul#navmenu li.iehover a {
        /*background: #666;*/
        color: snow ;
        transition: all 0.2s ease-in-out !important;

    }

    /* 2nd Menu */
    ul#navmenu li:hover li a,
    ul#navmenu li.iehover li a {
        float: none;
        /*background: hsla(184, 92%, 46%,0.96);*/
        background-color:transparent;
        color: snow;
        border-right:solid 7px rgb(220,220,220);
        transition: all 0.2s ease-in-out !important;
    }

        /* 2nd Menu Hover Persistence انتخاب*/  ul#navmenu li:hover li a:hover,
        ul#navmenu li:hover li:hover a,
        ul#navmenu li.iehover li a:hover,
        ul#navmenu li.iehover li.iehover a {
            /*background: #666;*/
            color: snow;
        }
        /* 2nd Menu Hover Persistence انتخاب*/
        ul#navmenu li:hover li a:hover,
        /*ul#navmenu li:hover li:hover ,*/
        ul#navmenu li.iehover li a:hover {
            /*ul#navmenu li.iehover li.iehover {*/
            /*border-right:solid 10px rgb(50,50,50);
            transition: all 0.2s ease-in-out !important;*/
            border-right: solid 10px rgb(150,150,150);
            transition: all 0.2s ease-in-out !important;
            border-radius: 0 50px 50px 0;
        }

    /* 3rd Menu */
    ul#navmenu li:hover li:hover li a,
    ul#navmenu li.iehover li.iehover li a {
        
        /*background: hsl(192, 100%, 32%);*/
        color:snow;
    }

        /* 3rd Menu Hover Persistence انتخاب*/  ul#navmenu li:hover li:hover li a:hover,
        ul#navmenu li:hover li:hover li:hover a,
        ul#navmenu li.iehover li.iehover li a:hover,
        ul#navmenu li.iehover li.iehover li.iehover a {
            color: snow;
        }

    /* 4th Menu */
    ul#navmenu li:hover li:hover li:hover li a,
    ul#navmenu li.iehover li.iehover li.iehover li a {
        background: hsl(192, 100%, 37%);
        color:rgb(95,95,95);
    }
    }

        /* 4th Menu Hover */
        ul#navmenu li:hover li:hover li:hover li a:hover,
        ul#navmenu li.iehover li.iehover li.iehover li a:hover {
            color: black;

        }

    ul#navmenu ul ul,
    ul#navmenu ul ul ul {
        display: none;
        position: absolute;
        top: 0;
        right: 160px;
    }

    /* Do Not Move - Must Come Before display:block for Gecko */
ul#navmenu li:hover ul ul,
ul#navmenu li:hover ul ul ul,
ul#navmenu li.iehover ul ul,
ul#navmenu li.iehover ul ul ul {
    display: none;
    box-shadow: 5px 0px 12px -5px black;
}

ul#navmenu li:hover ul,
ul#navmenu ul li:hover ul,
ul#navmenu ul ul li:hover ul,
ul#navmenu li.iehover ul,
ul#navmenu ul li.iehover ul,
ul#navmenu ul ul li.iehover ul {
    display: block;
}



#menu {
    z-index: 1000;
}
