/*  CSS Code file: dropdown */
        /*  Description: style for a drop down menu */
        /*  Version: 1.0 */
        /*  All source code & concepts (c) copyright 2008, 2009 by ItNix, LLC. */
        /*  All rights reserved worldwide. */
        /*  Last change: 28jul09 */
        /*  Changed by: Ivan Carrazco */
        /*  NOTE: this css file requires a javascript file 'itnix_menus.js' or
                'itnix_fading_menus.js' in order to make the drop down menus appear,
                depending on the project
                ** for some reason if an object tag is used right below this dropdown menu, the object will shift
                the content for no reason at all. To avoid this, make sure that the container ( either a div, o a table ),
                of the object tag uses the following css-rule: "clear: both;"
         */

        #menu  {
          position: relative;
        }

          /** new additions */
          #main_menu {
            position: relative;
            display: block;
            width: 100%;
            height: 25px;
            margin: 5px auto 0px auto;
            padding: 0px;
            list-style-type: none;
          }

          #main_menu li {
            display: block;
            float: left;
            width: 128px;
            height: 25px;
            margin: 0px;
            padding: 0px;
            text-align: center;
            color: #0E159A;
          }


          /** ------------ CSS REFACTORING -------------------- */
          /** #main_menu is an unoredered list, <ul> */
          /** General classes that allows us to save code: li.container, ul.sub_menu_only, ul.sub_menu_only li,
              abs_right, abs_left, abs_down */


            #main_menu li.container {
              position: relative;
              height: 25px;
              display: block;
              float: left;
              margin: 0px;
              padding: 0px;
              z-index: 5;
            }

            #main_menu li:hover {
              background-color: #FFFFFF;
              border: 1px solid #5487E4;
            }

            #main_menu ul.sub_menu_only {
              display: none;
              margin: 0px;
              padding: 0px;
              width: 200px;
              min-height: 25px;
              border: 1px solid #5487E4;
              z-index: 5;
            }

            #main_menu ul.sub_menu_only li  {
                position: relative;
                width: 200px;
                height: 35px;
                display: block;
                float: left;
                border: 0px;
                margin: 0px;
                padding: 20px 0px 0px 0px;
                color: #0E159A;
                background-color: #C8D8FC;
                border-right: 0;
            }

            #main_menu ul.sub_menu_only li {
              color: #0E159A;
              background-color: #C8D8FC;
              z-index: 10;
            }


            #main_menu ul.sub_menu_only li:hover {
              border-bottom: 0px solid #5487E4;
              border-top: 0px solid #5487E4;
              background-color: #FFFFFF;
            }
            .abs_right {
              position: absolute;
              top: 0px;
              left: 128px;
              z-index: 10;
            }

            .abs_left {
              position: absolute;
              top: 0px;
              left: -128px;
              z-index: 10;
            }

            .abs_down {
              position: absolute;
              top: 25px;
              left: 0px;
              z-index: 10;
            }