/* CSS Document */ /* * MENU SETTINGS * Applies to the first level menu container */ .nature { font-family: Arial,Helvetica,Verdana,sans-serif; font-size: 12px; font-weight: bold; border: thin none; } /* * MENU SETTINGS * Applies to second (or more) level menu containers */ .nature ul { font-weight:bold; font-size: 11px; } /* * MENU ITEM SETTINGS * Applies to all menu items in all menu levels */ .nature li { background-image: none; background-repeat: no-repeat; width: 159px; border-bottom: solid 0px #eff3f8; margin-bottom: 1px; } /* * MENU ITEM SETTINGS * Applies to second (or more) level menu items */ .nature ul li { background-image: none; background-color: #ededed; width: 229px; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #9F9F9F; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } /* these settings are specific to NATURE skin only */ /* this applies to the skin of the 3rd level */ .nature ul li ul li { background-image: none; background-color: #ededed; width: 190px; border-bottom: solid 1px #333333; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; } /* NATURE SKIN ONLY */ /* this applies to the last item of the first level */ .nature li.last { margin: 0px; } /* * MENU LINK SETTINGS * Applies to links orinetation, FONTS and button height in the vertical navigation bar that are to be found within the menu items, no matter the menu level. */ .nature a { text-decoration: none; color: #ffffff; line-height: 25px; padding: 0px 0px 0px 3px; /* * Top; Bottom; Right; Left */ cursor: hand; } /* * MENU LINK SETTINGS * Applies to link fonts and button height located in the second (or more) level menu items, color and height */ .nature ul a { color: #444444; line-height: 22px; } /*************************************************************************** * MOUSE-OVER ACTIONS * ***************************************************************************/ /* * MOUSE OVER ON MENU ITEMS * Applies to all menu items in all menu containers */ .nature li.hover { background-image: none !important; background-color: #015A9E; } /* * MOUSE OVER ON MENU ITEMS * Applies to second (or more) level menu items */ .nature ul li.hover { background-image: none !important; background-color: #CCCCCC !important; } /* * MOUSE OVER ON LINKS * Applies to all dropdown link FONTS in all menu items */ .nature a.hover { color: #FFFFFF !important; } /* * MOUSE OVER ON LINKS * Applies to link FONTS located in the second (or more) level menu items */ .nature ul a.hover { color: #A41B02 !important; } /***************************************************************************** * MENU ITEM DELECTION * *****************************************************************************/ /* * SELECTED MENU ITEM * Applies to selected menu items in all menu containers (selected menu item background color) */ .nature li.selected { background-image: none; background-color:#015A9E; /*#005A9C*/ /*#486A99*/ /*#D9D0BB*/ } /* * SELECTED MENU ITEM * Applies to second (or more) level selected menu items */ .nature ul li.selected { background-image: none; background-color: #0A3B80; /* Pale Blue */ } /* * SELECTED LINKS * Applies to selected links in all menu items */ .nature a.selected { color: #ffffff; } /* * SELECTED LINKS * Applies to selected links located in the second (or more) level menu items */ .nature ul a.selected { color: #ffffff; } /****************************************************************************** * In this section, we will define the menu arrows behavior * * An arrow is inserted next to the menu item when the menu item has sub-menus * ******************************************************************************/ /* * Define the arrow * Applies to all menu items that have sub-menus */ .nature .arrow { background-image:url(../images/white_arrow_horizontal.gif); background-repeat: no-repeat; background-position: 150px 9px; } /* * Define the arrow * Applies to all menu items that have sub-menus located in the second (or more) level */ /* .nature .hover ul .arrow, .nature ul .arrow { background-image:url(img/green_arrow_horizontal.gif); background-position: 14px 5px; } /* * Define the arrow on mouse over * Applies to all menu items that have sub-menus on mouse over */ .nature .hover .arrow { background-image:url(../images/red_arrow_horizontal.gif); } /* * Define the arrow on mouse over * Applies to all menu items that have sub-menus located in the second (or more) level */ .nature .hover ul .arrow, .nature ul .arrow { background-image:url(../images/black_arrow_horizontal.gif); background-position: 217px 9px; } .nature ul .arrow.selected { background-image:url(../images/white_arrow_horizontal.gif); background-position: 217px 9px; } /* * Define the arrow on mouse over * Applies to all menu items that have sub-menus on mouse over */ .nature .hover .arrow { background-image:url(../images/red_arrow_horizontal.gif); } /* * Define the arrow on mouse over * Applies to all menu items that have sub-menus located in the second (or more) level on mouse over */ .nature ul .hover .arrow { background-image:url(../images/red_arrow_horizontal.gif); } .nature .arrow.selected { background-image:url(../images/red_arrow_horizontal.gif); } /************************************************************************* * LAYOUT STYYLE DEFINITION FOR THE CSS MENU * * CARE SHOULD BE TAKEN HERE IF YOU DON'T KNOW WHAT YOU ARE DOING * *************************************************************************/ /* controls the Width of the overlay for Main Navigation */ div.vertical { padding-left: 2px; padding-right: 2px; padding-top: 5px; clear: both; } div.vertical br { clear: both; } div.vertical ul { margin: 0px; padding: 0px; display: block; float: left; clear: both; } div.vertical li { list-style-type: none; display: block; float: left; clear: both; text-align: left; position: static; } div.vertical li img { border: none; } div.vertical a { clear: both; display: block; margin: 0px; } div.vertical ul li ul { position: absolute; left: -5000px; top: -5000px; visibility: hidden; clear: both; } div.vertical ul li ul li { clear: both; } div.vertical ul li ul li a { clear: both; } .hasImg, .hasImg a { padding: 0px !important; margin: 0px !important; border: none !important; outline: none !important; background: transparent !important; width: auto !important; }