.menu ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    border-top: 1px solid #a1c67b;
}

.menu li {
    border-bottom: 1px solid #a1c67b;
}

.menu ul li a {
    display: block;
    font: bold 12px Verdana, Arial, Helvetica, sans-serif;
    text-decoration: none;
    color: black;
    height: 24px; /*Set to height of bg image-padding within link (ie: 32px - 4px - 4px)*/
    padding: 4px 0 4px 10px;
    line-height: 24px; /*Set line-height of bg image-padding within link (ie: 32px - 4px - 4px)*/
    white-space: normal !important;
    background-color: #ffffff;
    width: 180px;
    /*
        -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
        */
}

.menu li a:hover {
    background-color: #a1c67b;
}









.arrowsidemenu {
    width: 180px; /*width of menu*/
    border-top: 1px solid #a1c67b;
}

    .arrowsidemenu div a { /*header bar links*/
        font: bold 12px Verdana, Arial, Helvetica, sans-serif;
        display: block;
        background: transparent url(arrowgreen.gif) 100% 0;
        height: 24px; /*Set to height of bg image-padding within link (ie: 32px - 4px - 4px)*/
        padding: 4px 0 4px 10px;
        line-height: 24px; /*Set line-height of bg image-padding within link (ie: 32px - 4px - 4px)*/
        text-decoration: none;
        border-bottom: 1px solid #a1c67b;
    }

        .arrowsidemenu div a:link, .arrowsidemenu div a:visited {
            color: #26370A; /* sub menu color*/
        }

        .arrowsidemenu div a:hover {
            background: #a1c67b; /*main menu hover*/
        }

    .arrowsidemenu div.unselected a { /*header that's currently not selected*/
        color: red; /* main menu color*/
    }


    .arrowsidemenu div.selected a { /*header that's currently selected*/
        color: blue; /*when show sub menu*/
        background-position: 100% -64px !important;
    }

    .arrowsidemenu ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }

        .arrowsidemenu ul li {
            border-bottom: 1px solid #a1c67b;
        }


            .arrowsidemenu ul li a { /*sub menu links*/
                display: block;
                font: normal 12px Verdana, Arial, Helvetica, sans-serif;
                text-decoration: none;
                color: black;
                padding: 5px 0;
                padding-left: 20px; /*sub menu left pading*/
                /* For sub menu left line*/
                /*
                        border-left: 10px double #a1c67b; 
                        */
            }

                .arrowsidemenu ul li a:hover {
                    background: #a1c67b; /*submenu hover*/
                }







@media screen and (min-width: 600px) {

    .arrowsidemenu {
        /*display: none;*/
    }
}

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

    .menu {
         /*display: none;*/
    }
}