Line 86: | Line 86: | ||
</div> | </div> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /********************************* MENU ********************************/ | ||
+ | |||
+ | /*********************new menu formatting*******************/ | ||
+ | |||
+ | .menu-wrap { | ||
+ | width:100%; | ||
+ | background:#FFF; | ||
+ | position:relative; | ||
+ | } | ||
+ | |||
+ | .menu { | ||
+ | margin-top:-6px; | ||
+ | padding:0; | ||
+ | position: fixed; | ||
+ | z-index:1; | ||
+ | left: 0px; | ||
+ | width:100%; | ||
+ | background:#FFF; | ||
+ | } | ||
+ | |||
+ | .menu li { | ||
+ | margin:0px; | ||
+ | list-style:none; | ||
+ | } | ||
+ | |||
+ | .menu a { | ||
+ | transition:all linear 0.15s; | ||
+ | padding:10px; | ||
+ | color:#BDBDBD; | ||
+ | } | ||
+ | |||
+ | .menu li:hover > a, .menu .current-item > a { | ||
+ | text-decoration:none; | ||
+ | color:#000000; | ||
+ | } | ||
+ | |||
+ | .menu .arrow { | ||
+ | font-size:11px; | ||
+ | line-height:0%; | ||
+ | } | ||
+ | |||
+ | /*----- Top Level -----*/ | ||
+ | menu > ul { | ||
+ | white-space: nowrap; | ||
+ | } | ||
+ | |||
+ | |||
+ | .menu > ul > li { | ||
+ | margin-top:-5px; | ||
+ | float:left; | ||
+ | display:inline-block; | ||
+ | position:relative; | ||
+ | font-size:12px; | ||
+ | } | ||
+ | |||
+ | .menu > ul > li > a { | ||
+ | display: inline-block; | ||
+ | float: none; | ||
+ | } | ||
+ | |||
+ | .menu > ul > li:hover > a, .menu > ul > .current-item > a { | ||
+ | background:#DF7F3E; | ||
+ | } | ||
+ | |||
+ | /*----- Bottom Level -----*/ | ||
+ | .menu li:hover ul { | ||
+ | display:block; | ||
+ | } | ||
+ | |||
+ | .sub-menu { | ||
+ | width:200%; | ||
+ | padding:0px 0px; | ||
+ | position:absolute; | ||
+ | top:90%; | ||
+ | left:0px; | ||
+ | transition:opacity linear 0.15s; | ||
+ | box-shadow:0px 2px 3px rgba(0,0,0,0.2); | ||
+ | background:#2e2728; | ||
+ | display:none; | ||
+ | z-index:1; | ||
+ | } | ||
+ | |||
+ | .sub-menu li { | ||
+ | display:block; | ||
+ | font-size:13px; | ||
+ | } | ||
+ | |||
+ | .sub-menu li a { | ||
+ | padding:10px 10px; | ||
+ | display:block; | ||
+ | } | ||
+ | |||
+ | .sub-menu li a:hover, .sub-menu .current-item a { | ||
+ | text-color:#000000; | ||
+ | background:#DF7F3E; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /* Wrapper for the menu */ | ||
+ | .menu_wrapper { | ||
+ | width:100%; | ||
+ | margin-top:-10px; | ||
+ | margin-left:-20px; | ||
+ | height:0px; | ||
+ | position:fixed; | ||
+ | padding:0px; | ||
+ | display:inline; | ||
+ | list-style: none; | ||
+ | box-shadow:0px 1px 3px rgba(0,0,0,0.2); | ||
+ | } | ||
+ | |||
+ | |||
+ | /* styling for the menu items */ | ||
+ | .menu_item { | ||
+ | background-color:#f2f2f2; | ||
+ | width:11%; | ||
+ | float:left; | ||
+ | margin:0px 0px 0px 0px; | ||
+ | padding-top: 10px; | ||
+ | padding-bottom: 10px; | ||
+ | border-bottom: 1px solid #d3d3d3; | ||
+ | font-weight:bold; | ||
+ | text-align: center; | ||
+ | color:#000000; | ||
+ | cursor: pointer; | ||
+ | list-style: none; | ||
+ | } | ||
+ | |||
+ | /* when hovering on a menu item */ | ||
+ | .menu_item:hover { | ||
+ | color:#000000; | ||
+ | background-color: #DF7F3E; | ||
+ | } | ||
+ | |||
+ | /* decoration icon for the menu buttons*/ | ||
+ | .icon { | ||
+ | float:left; | ||
+ | font-size:12px; | ||
+ | font-weight:bold; | ||
+ | } | ||
+ | |||
+ | /* this is the icon for when the content is collapsed */ | ||
+ | .plus::before { | ||
+ | content:"✊"; | ||
+ | color:#CF5300; | ||
+ | } | ||
+ | /* this is the icon for when the content is expanded */ | ||
+ | .less::before { | ||
+ | content: "✌"; | ||
+ | color:#CF5300; | ||
+ | } | ||
+ | |||
+ | /* styling for the ul that creates the buttons */ | ||
+ | ul.menu_items { | ||
+ | width:100%; | ||
+ | margin-left:0px; | ||
+ | padding:0px; | ||
+ | list-style: none; | ||
+ | } | ||
+ | |||
+ | /* styling for the li that are the menu items */ | ||
+ | .menu_items li { | ||
+ | width:100%; | ||
+ | margin-top: 0px; | ||
+ | padding: 0px 0px 0px 0px ; | ||
+ | display:block; | ||
+ | border-bottom: 1px solid #d3d3d3 | ||
+ | font-weight:bold; | ||
+ | text-decoration:none; | ||
+ | color:#000000; | ||
+ | text-align:left; | ||
+ | list-style-type:none; | ||
+ | cursor:pointer; | ||
+ | -webkit-transition: all 0.4s ease; | ||
+ | -moz-transition: all 0.4s ease; | ||
+ | -ms-transition: all 0.4s ease; | ||
+ | -o-transition: all 0.4s ease; transition: all 0.4s ease; | ||
+ | } | ||
+ | |||
+ | .menu_item a { | ||
+ | width: 100%; | ||
+ | margin-left: -20px; | ||
+ | padding: 11px 90px 12px 20px; | ||
+ | text-decoration: none; | ||
+ | color:black; | ||
+ | } | ||
+ | |||
+ | /* When hovering on a menu item */ | ||
+ | .menu_items li:hover { | ||
+ | background-color:#ff9900; | ||
+ | color: #000000; | ||
+ | } | ||
+ | |||
+ | /* styling for the submenus */ | ||
+ | .submenu { | ||
+ | width:100%; | ||
+ | display: none; | ||
+ | font-weight:bold; | ||
+ | cursor:pointer; | ||
+ | |||
+ | } | ||
+ | |||
+ | /* moving the margin for the submenu ul list */ | ||
+ | ul.submenu { | ||
+ | width: 100%; | ||
+ | margin: 10px 0px -11px 0px; | ||
+ | list-style: none; | ||
+ | } | ||
+ | |||
+ | /*styling for the submenu buttons */ | ||
+ | .submenu li { | ||
+ | width: 100%; | ||
+ | margin-left: 10px; | ||
+ | margin-bottom: 0px; | ||
+ | list-style-type: none; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* hover state for the submenu buttons */ | ||
+ | .submenu li a { | ||
+ | width: 100%; | ||
+ | padding: 5px 10px; | ||
+ | display: inline-block; | ||
+ | border-bottom: 1px solid #d3d3d3; | ||
+ | background-color:white; | ||
+ | text-decoration:none; | ||
+ | color:#000000; | ||
+ | } | ||
+ | |||
+ | .submenu li a:hover { | ||
+ | background-color:#000000; | ||
+ | color: #CF5300; | ||
+ | } | ||
+ | |||
+ | |||
+ | /* When the screen is smaller than 680px, the menu has the option to hide/show - this button controls that */ | ||
+ | .collapsable_menu_control { | ||
+ | width:100%; | ||
+ | padding: 15px 0px; | ||
+ | display:none; | ||
+ | background-color:#000000; | ||
+ | text-align:center; | ||
+ | font-weight:bold; | ||
+ | color:#CF5300; | ||
+ | cursor:pointer; | ||
+ | -webkit-transition: all 0.4s ease; | ||
+ | -moz-transition: all 0.4s ease; | ||
+ | -ms-transition: all 0.4s ease; | ||
+ | -o-transition: all 0.4s ease; | ||
+ | transition: all 0.4s ease; | ||
+ | } | ||
+ | |||
+ | /* when hovering on that button */ | ||
+ | .collapsable_menu_control:hover { | ||
+ | background-color: #CF5300; | ||
+ | color:#000000; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
Line 487: | Line 758: | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
Revision as of 21:40, 15 June 2017
×