-
-
Save sevenspark/602a8fb48b3aa3adc504 to your computer and use it in GitHub Desktop.
UberMenu 960px Responsive Breakpoint
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
* UBERMENU 2.0 - DO NOT EDIT!!! | |
* | |
* Under penalty of death, never, ever, not ever, neverneverevernever edit this file. Swear it! | |
* Seriously, just don't. If you edit this file, or change it in any way, consider your (non-existent) | |
* warranty null and void. You have been warned. | |
* | |
* Need to customize your styles? Check out the Customization section of the Support Guide. | |
*/ | |
/* Reset */ | |
#megaMenu.megaResetStyles div, | |
#megaMenu.megaResetStyles span, | |
#megaMenu ul.megaMenu, | |
#megaMenu ul.sub-menu, | |
#megaMenu ul.um-sidebar, | |
#megaMenu li.menu-item, | |
#megaMenu li.widget, | |
#megaMenu li.menu-item > a, | |
#megaMenu img.um-img { | |
margin: 0; | |
padding: 0; | |
border: 0; | |
font-size: 100%; | |
vertical-align: baseline; | |
background: transparent; | |
text-shadow: none; | |
visibility: visible; | |
opacity: 1; | |
-moz-box-sizing: content-box; | |
-webkit-box-sizing: content-box; | |
box-sizing: content-box; | |
-webkit-backface-visibility: hidden; | |
-moz-backface-visibility: hidden; | |
-ms-backface-visibility: hidden; | |
backface-visibility: visible; | |
} | |
/**** ALL ****/ | |
#megaMenu { | |
position: relative; | |
line-height: 1em; | |
overflow: visible; | |
zoom: 1; | |
display: block; | |
float: left; | |
height: auto; | |
-moz-box-sizing: border-box; | |
-webkit-box-sizing: border-box; | |
box-sizing: border-box; | |
} | |
#megaMenu.megaFullWidth { | |
width: 100%; | |
} | |
#megaMenu ul.megaMenu, | |
#megaMenu ul.sub-menu { | |
/* All UL */ | |
list-style: none outside none; | |
margin: 0px; | |
padding: 0px; | |
position: relative; | |
overflow: visible; | |
zoom: 1; | |
} | |
#megaMenu ul.megaMenu li.menu-item, | |
#megaMenu ul.megaMenu li.widget { | |
margin-bottom: 0px; | |
list-style-type: none; | |
list-style-image: none; | |
border: none; | |
text-align: left; | |
float: none; | |
} | |
#megaMenu ul.megaMenu li.menu-item > a, | |
#megaMenu ul.megaMenu li.menu-item > span.um-anchoremulator { | |
line-height: 1.4em; | |
text-decoration: none; | |
cursor: pointer; | |
-webkit-transition: all 0.1s ease-in-out; | |
-moz-transition: all 0.1s ease-in-out; | |
transition: all 0.1s ease-in-out; | |
} | |
#megaMenu ul.megaMenu li.menu-item > a span, | |
#megaMenu ul.megaMenu li.menu-item > span.um-anchoremulator span { | |
color: inherit; | |
font-size: inherit; | |
} | |
/**** TOP LEVEL ****/ | |
#megaMenu ul.megaMenu { | |
float: left; | |
z-index: 100; | |
} | |
#megaMenu.megaMenuHorizontal ul.megaMenu { | |
width: 100%; | |
} | |
#megaMenu ul.megaMenu > li.menu-item { | |
float: left; | |
position: relative; | |
display: inline-block; | |
/*line-height:1em;*/ | |
padding: 0px 0px; | |
margin: 0px; | |
z-index: 200; | |
zoom: 1; | |
} | |
#megaMenu ul.megaMenu > li.menu-item > a, | |
#megaMenu ul.megaMenu > li.menu-item > span.um-anchoremulator { | |
display: block; | |
padding: 12px 15px; | |
position: relative; | |
float: none; | |
z-index: 400; | |
zoom: 1; | |
border-width: 0px 0px 0px 1px; | |
/* No Bouncing */ | |
border-style: solid; | |
border-color: transparent; | |
} | |
#megaMenu.megaMenuHorizontal ul.megaMenu > li.menu-item:first-child > a { | |
border-left: none; | |
} | |
#megaMenu.megaMenuVertical ul.megaMenu > li.menu-item:first-child > a { | |
border-top: none; | |
} | |
#megaMenu ul.megaMenu > li.menu-item:hover, | |
#megaMenu ul.megaMenu > li.menu-item.megaHover, | |
#megaMenu ul.megaMenu > li.menu-item:hover > a, | |
#megaMenu ul.megaMenu > li.menu-item.megaHover > a, | |
#megaMenu ul.megaMenu > li.menu-item:hover > span.um-anchoremulator, | |
#megaMenu ul.megaMenu > li.menu-item.megaHover > span.um-anchoremulator { | |
z-index: 600; | |
} | |
/**** DROP LEVEL ****/ | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega { | |
position: static; | |
} | |
#megaMenu.megaMenu-nojs ul ul.sub-menu { | |
display: none; | |
} | |
#megaMenu ul ul.sub-menu { | |
position: absolute; | |
left: auto; | |
z-index: 500; | |
float: left; | |
zoom: 1; | |
overflow: visible; | |
visibility: visible; | |
margin: 0; | |
} | |
/*#megaMenu ul ul.sub-menu-1,*/ | |
#megaMenu ul li.menu-item.ss-nav-menu-reg ul.sub-menu-1 { | |
min-width: 99%; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-reg ul.sub-menu ul.sub-menu { | |
min-width: 120px; | |
} | |
#megaMenu.megaMenuHorizontal ul.megaMenu > li.menu-item > ul.sub-menu.sub-menu-1 { | |
/*border-top:none;*/ | |
/* removes border overlap effect */ | |
border-top-left-radius: 2px; | |
border-top-right-radius: 2px; | |
/* IE7 is dumb */ | |
*left: 0; | |
*top: 100%; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul.sub-menu li.menu-item { | |
min-width: 100px; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-reg ul.sub-menu li.menu-item { | |
min-width: 50px; | |
position: relative; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-reg ul.sub-menu li.menu-item > a, | |
#megaMenu ul li.menu-item.ss-nav-menu-reg ul.sub-menu li.menu-item > span.um-anchoremulator { | |
white-space: nowrap; | |
} | |
#megaMenu ul ul.sub-menu li.menu-item > a, | |
#megaMenu ul ul.sub-menu li.menu-item > span.um-anchoremulator { | |
padding: 3px 0px; | |
margin: 3px 0px; | |
line-height: 1.4em; | |
width: auto; | |
display: block; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul ul.sub-menu li.menu-item > a, | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul ul.sub-menu li.menu-item > span.um-anchoremulator, | |
#megaMenu ul ul.sub-menu li.menu-item > a, | |
#megaMenu ul ul.sub-menu li.menu-item > span.um-anchoremulator { | |
background: transparent; | |
} | |
#megaMenu.megaMenu-nojs ul li.menu-item:hover > ul.sub-menu-1 { | |
display: block; | |
visibility: visible; | |
} | |
#megaMenu.megaMenu-withjs ul li.menu-item:hover > ul.sub-menu-1 { | |
display: none; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul.sub-menu ul.sub-menu { | |
display: block; | |
position: relative; | |
top: auto; | |
left: auto; | |
} | |
#megaMenu li.menu-item ul.sub-menu { | |
box-shadow: none; | |
-moz-box-shadow: none; | |
-webkit-box-shadow: none; | |
} | |
#megaMenu li.menu-item.ss-nav-menu-mega ul.sub-menu.sub-menu-1 { | |
border: 1px solid transparent; | |
padding: 0px; | |
width: auto; | |
white-space: nowrap; | |
left: auto; | |
max-width: 100%; | |
} | |
#megaMenu.wpmega-nojs li.menu-item.ss-nav-menu-mega ul.sub-menu.sub-menu-1, | |
#megaMenu.megaFullWidthSubs li.menu-item.ss-nav-menu-mega ul.sub-menu.sub-menu-1, | |
#megaMenu li.menu-item.ss-nav-menu-mega.ss-nav-menu-mega-fullWidth ul.sub-menu.sub-menu-1 { | |
/* Menu Item option */ | |
width: 100%; | |
left: -1px; | |
/*left:0px; | |
box-sizing:border-box;*/ | |
} | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega-floatRight { | |
float: right; | |
} | |
/* Align Submenu Left */ | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega.ss-nav-menu-mega-alignLeft ul.sub-menu.sub-menu-1 { | |
left: 0px; | |
} | |
/* Align Submenu Right */ | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega.ss-nav-menu-mega-alignRight ul.sub-menu.sub-menu-1 { | |
right: 0px; | |
left: auto; | |
} | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega ul.sub-menu-1 > li.menu-item { | |
display: inline-block; | |
float: left; | |
margin-top: 5px; | |
margin-bottom: 5px; | |
position: relative; | |
} | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega ul.sub-menu-1 > li.menu-item > a, | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega ul.sub-menu-1 > li.menu-item > span.um-anchoremulator, | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega ul ul.sub-menu .ss-nav-menu-header > a, | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega ul ul.sub-menu .ss-nav-menu-header > span.um-anchoremulator, | |
#megaMenu .wpmega-widgetarea h2.widgettitle { | |
margin-bottom: .6em; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul ul.sub-menu li.menu-item, | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul ul.sub-menu li.widget { | |
display: block; | |
} | |
#megaMenu ul li.menu-item { | |
font-size: 12px; | |
list-style-image: none; | |
letter-spacing: 0px; | |
} | |
/* Submenu Structure */ | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul.sub-menu li.menu-item, | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul.sub-menu li.widget { | |
font-size: 11px; | |
min-width: 100px; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul.sub-menu li.menu-item > a, | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul.sub-menu li.menu-item > span.um-anchoremulator { | |
width: auto; | |
display: block; | |
background: transparent; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul.sub-menu > li.menu-item:hover > a { | |
background: transparent; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul li.menu-item.ss-nav-menu-item-depth-1 { | |
padding: 11px 27px; | |
/* Do it in pixels, because IE can't handle rounding ems properly */ | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul ul.sub-menu { | |
width: auto; | |
float: none; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul ul.sub-menu li.menu-item { | |
display: block; | |
float: none; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul.sub-menu li.menu-item.ss-nav-menu-verticaldivision { | |
clear: both; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul.sub-menu li.menu-item.sub-menu-newcol { | |
float: left; | |
} | |
#megaMenu li.menu-item.ss-nav-menu-mega .ss-nav-menu-header a, | |
#megaMenu li.menu-item.ss-nav-menu-mega .ss-nav-menu-header span.um-anchoremulator { | |
font-weight: normal; | |
} | |
#megaMenu li.menu-item.ss-nav-menu-mega .ss-nav-menu-header > a, | |
#megaMenu li.menu-item.ss-nav-menu-mega .ss-nav-menu-header > span.um-anchoremulator { | |
font-weight: bold; | |
margin-bottom: 4px; | |
} | |
#megaMenu li.menu-item.ss-nav-menu-mega .megaMenu-thumb { | |
width: 15px; | |
height: 15px; | |
margin-right: 5px; | |
vertical-align: middle; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-reg a, | |
#megaMenu ul li.menu-item.ss-nav-menu-reg span.um-anchoremulator { | |
display: block; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-reg ul.sub-menu-1 { | |
border: 1px solid transparent; | |
padding-top: 6px; | |
padding-bottom: 6px; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-reg ul.sub-menu li.menu-item > a, | |
#megaMenu ul li.menu-item.ss-nav-menu-reg ul.sub-menu li.menu-item > span.um-anchoremulator { | |
margin: 0px; | |
padding: 6px 20px 6px 15px; | |
position: relative; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-reg ul.sub-menu ul.sub-menu { | |
top: -1px; | |
border-style: solid; | |
border-width: 1px; | |
} | |
#megaMenu.megaMenu-nojs ul li.menu-item.ss-nav-menu-reg ul.sub-menu > li.menu-item:hover > ul.sub-menu { | |
display: block; | |
left: 100%; | |
} | |
#megaMenu.megaMenu-withjs ul li.menu-item.ss-nav-menu-reg ul.sub-menu > li.menu-item > ul.sub-menu { | |
display: none; | |
left: 100%; | |
top: -1px; | |
} | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg.ss-nav-menu-flyout-left ul.sub-menu > li.menu-item > ul.sub-menu { | |
left: auto; | |
right: 100%; | |
} | |
#megaMenu ul.megaMenu li.menu-item.uber-flyout-left > ul.sub-menu, | |
#megaMenu ul.megaMenu > li.menu-item.uber-flyout-left-all ul ul.sub-menu, | |
#megaMenu ul.megaMenu ul.sub-menu li.menu-item.uber-flyout-left-all ul.sub-menu { | |
left: auto !important; | |
right: 100% !important; | |
border-left: 1px solid #ddd !important; | |
border-right: none !important; | |
box-shadow: none !important; | |
} | |
/* Flyout menus aligned right and flyout left */ | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg.um-flyout-align-right ul.sub-menu { | |
left: auto; | |
right: 0; | |
} | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg.um-flyout-align-right ul.sub-menu li.menu-item > a, | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg.um-align-right ul.sub-menu li.menu-item > span.um-anchoremulator { | |
padding-left: 20px; | |
padding-right: 10px; | |
} | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg.um-flyout-align-right li.menu-item.megaReg-with-sub > a:after, | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg.um-flyout-align-right li.menu-item.megaReg-with-sub > span.um-anchoremulator:after { | |
border-right-color: #ccc; | |
border-left-color: transparent; | |
left: 3px; | |
right: auto; | |
} | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg.um-flyout-align-right ul.sub-menu > li.menu-item > ul.sub-menu { | |
left: auto; | |
right: 100%; | |
box-shadow: none; | |
} | |
/* Highlights */ | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-highlight > a, | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-highlight > span.um-anchoremulator { | |
color: #4D90FE; | |
} | |
/* Titles and Descriptions */ | |
#megaMenu .wpmega-link-title { | |
display: block; | |
line-height: 1.4em; | |
color: inherit; | |
} | |
#megaMenu .wpmega-item-description { | |
display: block; | |
/* inline */ | |
clear: none; | |
float: none; | |
line-height: 10px; | |
font-size: 11px; | |
padding-bottom: 3px; | |
font-weight: normal; | |
color: inherit; | |
white-space: normal; | |
} | |
/* Non-links */ | |
#megaMenu ul.megaMenu > li.menu-item > .wpmega-nonlink { | |
padding: 3px 12px; | |
} | |
#megaMenu .wpmega-nonlink { | |
width: auto; | |
white-space: normal; | |
} | |
#megaMenu .wpmega-nonlink ul { | |
display: block; | |
position: relative; | |
left: auto; | |
top: auto; | |
width: auto; | |
float: none; | |
box-shadow: none; | |
-moz-box-shadow: none; | |
-webkit-box-shadow: none; | |
zoom: 1; | |
width: 100%; | |
} | |
#megaMenu .wpmega-nonlink ul li.widget { | |
margin-bottom: 1em; | |
float: left; | |
clear: none; | |
} | |
#megaMenu .wpmega-nonlink .widgettitle { | |
margin-bottom: .6em; | |
} | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega ul.sub-menu li.menu-item.ss-nav-menu-item-depth-1.fullWidthRow, | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega ul.sub-menu li.menu-item.ss-nav-menu-item-depth-1.ss-sidebar { | |
margin-right: 0px; | |
width: 100%; | |
/* widget area must be full width */ | |
padding-left: 0; | |
padding-right: 0; | |
} | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega ul.sub-menu li.menu-item.ss-nav-menu-item-depth-1.ss-sidebar > a, | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega ul.sub-menu li.menu-item.ss-nav-menu-item-depth-1.ss-sidebar > span.um-anchoremulator { | |
margin: 0 2.9% 1em 2.9%; | |
} | |
#megaMenu .wpmega-widgetarea h2.widgettitle { | |
font-size: 12px; | |
line-height: 1.6em; | |
} | |
/* Full Width Menu, Widget & Shortcode Columns */ | |
#megaMenu ul ul .wpmega-nonlink.wpmega-widgetarea ul { | |
float: left; | |
} | |
#megaMenu .ss-colgroup .ss-col, | |
#megaMenu .wpmega-nonlink li.widget, | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega.mega-colgroup > ul > li { | |
float: left; | |
padding-left: 2.9%; | |
padding-right: 2.9%; | |
/* width = FLOOR( ( 100 - (n * (5.8) ) ) / n ), .1 )*/ | |
} | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega.mega-colgroup ul.sub-menu li.menu-item { | |
min-width: 0; | |
white-space: normal; | |
} | |
/* 1 */ | |
#megaMenu .wpmega-nonlink.ss-colgroup-1 li, | |
#megaMenu ul.megaMenu li.ss-nav-menu-mega.mega-colgroup-1 > ul > li { | |
width: 94.2%; | |
} | |
/* 1/2 */ | |
#megaMenu .ss-colgroup-2 > .ss-col, | |
#megaMenu .wpmega-nonlink.ss-colgroup-2 li, | |
#megaMenu ul.megaMenu li.ss-nav-menu-mega.mega-colgroup-2 > ul > li { | |
width: 44.2%; | |
} | |
/* 1/3 */ | |
#megaMenu .ss-colgroup-3 > .ss-col, | |
#megaMenu .wpmega-nonlink.ss-colgroup-3 li, | |
#megaMenu ul.megaMenu li.ss-nav-menu-mega.mega-colgroup-3 > ul > li { | |
width: 27.5%; | |
} | |
/* 2/3 */ | |
#megaMenu .ss-colgroup-3 > .ss-col.ss-colspan-2, | |
#megaMenu .wpmega-nonlink.ss-colgroup-3 li.ss-colspan-2 { | |
width: 60.8%; | |
/* (27.5 + 2.9)*2 */ | |
} | |
/* 1/4 */ | |
#megaMenu .ss-colgroup-4 > .ss-col, | |
#megaMenu .wpmega-nonlink.ss-colgroup-4 li, | |
#megaMenu ul.megaMenu li.ss-nav-menu-mega.mega-colgroup-4 > ul > li { | |
width: 19.2%; | |
} | |
/* 2/4 */ | |
#megaMenu .ss-colgroup-4 > .ss-col.ss-colspan-2, | |
#megaMenu .wpmega-nonlink.ss-colgroup-4 li.ss-colspan-2 { | |
width: 44.2%; | |
} | |
/* 3/4 */ | |
#megaMenu .ss-colgroup-4 > .ss-col.ss-colspan-3, | |
#megaMenu .wpmega-nonlink.ss-colgroup-4 li.ss-colspan-3 { | |
width: 69.2%; | |
} | |
/* 1/5 */ | |
#megaMenu .ss-colgroup-5 > .ss-col, | |
#megaMenu .wpmega-nonlink.ss-colgroup-5 li, | |
#megaMenu ul.megaMenu li.ss-nav-menu-mega.mega-colgroup-5 > ul > li { | |
width: 14.2%; | |
} | |
/* 2/5 */ | |
#megaMenu .ss-colgroup-5 > .ss-col.ss-colspan-2, | |
#megaMenu .wpmega-nonlink.ss-colgroup-5 li.ss-colspan-2 { | |
width: 34.2%; | |
} | |
/* 3/5 */ | |
#megaMenu .ss-colgroup-5 > .ss-col.ss-colspan-3, | |
#megaMenu .wpmega-nonlink.ss-colgroup-5 li.ss-colspan-3 { | |
width: 54.2%; | |
} | |
/* 4/5 */ | |
#megaMenu .ss-colgroup-5 > .ss-col.ss-colspan-4, | |
#megaMenu .wpmega-nonlink.ss-colgroup-5 li.ss-colspan-4 { | |
width: 74.2%; | |
} | |
#megaMenu .wpmega-nonlink li.widget li { | |
width: auto; | |
} | |
/* 1/6 */ | |
#megaMenu .ss-colgroup-6 > .ss-col, | |
#megaMenu .wpmega-nonlink.ss-colgroup-6 li, | |
#megaMenu ul.megaMenu li.ss-nav-menu-mega.mega-colgroup-6 > ul > li { | |
width: 10.8%; | |
} | |
/* 1/7 */ | |
#megaMenu .ss-colgroup-7 > .ss-col, | |
#megaMenu .wpmega-nonlink.ss-colgroup-7 li, | |
#megaMenu ul.megaMenu li.ss-nav-menu-mega.mega-colgroup-7 > ul > li { | |
width: 8.4%; | |
} | |
/* 1/8 */ | |
#megaMenu .ss-colgroup-8 > .ss-col, | |
#megaMenu .wpmega-nonlink.ss-colgroup-8 li, | |
#megaMenu ul.megaMenu li.ss-nav-menu-mega.mega-colgroup-8 > ul > li { | |
width: 6.7%; | |
} | |
/* Start new rows automatically in browsers that support nth-child */ | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega.mega-colgroup-2 > ul > li.menu-item:nth-child(2n+1), | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega.mega-colgroup-3 > ul > li.menu-item:nth-child(3n+1), | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega.mega-colgroup-4 > ul > li.menu-item:nth-child(4n+1), | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega.mega-colgroup-5 > ul > li.menu-item:nth-child(5n+1), | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega.mega-colgroup-6 > ul > li.menu-item:nth-child(6n+1) { | |
clear: both; | |
} | |
#megaMenu ul ul.sub-menu li.menu-item .wpmega-nonlink a { | |
padding: 0px; | |
} | |
/* ========================================== */ | |
/* ARROW INDICATORS STYLES */ | |
/* ========================================== */ | |
/* Display links as block */ | |
#megaMenu ul.megaMenu li.menu-item.mega-with-sub > a, | |
#megaMenu ul.megaMenu li.menu-item.mega-with-sub > span.um-anchoremulator, | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega > a, | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega > span.um-anchoremulator { | |
display: block; | |
} | |
/* Pad the right edge to make room for the arrow */ | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg ul.sub-menu li.menu-item.megaReg-with-sub > a, | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg ul.sub-menu li.menu-item.megaReg-with-sub > span.um-anchoremulator, | |
#megaMenu ul.megaMenu li.menu-item.mega-with-sub > a, | |
#megaMenu ul.megaMenu li.menu-item.mega-with-sub > span.um-anchoremulator, | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega > a, | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega > span.um-anchoremulator { | |
padding-right: 20px; | |
} | |
/* Add the arrows as pseudo elements */ | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg li.menu-item.megaReg-with-sub > a:after, | |
#megaMenu ul.megaMenu li.menu-item.mega-with-sub > a:after, | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega > a:after, | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg li.menu-item.megaReg-with-sub > span.um-anchoremulator:after, | |
#megaMenu ul.megaMenu li.menu-item.mega-with-sub > span.um-anchoremulator:after, | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega > span.um-anchoremulator:after { | |
content: ''; | |
position: absolute; | |
top: 50%; | |
right: 8px; | |
margin-top: -1px; | |
display: inline-block; | |
background: transparent; | |
border-style: solid dashed dashed; | |
border-color: transparent; | |
border-top-color: #999; | |
font-size: 0; | |
border-width: 3px 3px 0; | |
padding-top: 1px; | |
} | |
/* For second+ level flyout menus, point the arrow right instead of down */ | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg li.menu-item.megaReg-with-sub > a:after, | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-reg li.menu-item.megaReg-with-sub > span.um-anchoremulator:after { | |
width: 0; | |
height: 0; | |
border-top: 3px solid transparent; | |
border-bottom: 3px solid transparent; | |
border-left: 3px solid #999; | |
padding-top: 0; | |
padding-right: 2px; | |
margin-top: -2px; | |
right: 3px; | |
} | |
/* ========================================== */ | |
/* DIVIDER STYLES */ | |
/* ========================================== */ | |
#megaMenu .wpmega-divider-container { | |
width: 100%; | |
margin: 0px; | |
} | |
#megaMenu .wpmega-divider { | |
border: none; | |
border-top: 1px solid #ddd; | |
border-bottom: 1px solid #fff; | |
/*margin:0px 10px 10px 10px;*/ | |
margin: 0px 0px 10px 0px; | |
clear: both; | |
height: 0px; | |
display: block; | |
} | |
#megaMenu .fullWidthRow .wpmega-divider { | |
margin: 0 2.9% 10px 2.9%; | |
} | |
/* ========================================== */ | |
/* LINK + IMAGE STYLES */ | |
/* ========================================== */ | |
#megaMenu .ss-nav-menu-with-img { | |
min-height: 20px; | |
/* Height of Pic + Space */ | |
} | |
#megaMenu > ul > li.menu-item.ss-nav-menu-with-img { | |
min-height: 0px; | |
} | |
#megaMenu .ss-nav-menu-with-img img { | |
float: left; | |
display: block; | |
} | |
#megaMenu .ss-nav-menu-with-img.ss-nav-menu-notext > a > img, | |
#megaMenu .ss-nav-menu-with-img.ss-nav-menu-notext > span.um-anchoremulator > img { | |
float: none; | |
} | |
#megaMenu .ss-nav-menu-with-img.ss-nav-menu-notext > a > .wpmega-item-description, | |
#megaMenu .ss-nav-menu-with-img.ss-nav-menu-notext > span.um-anchoremulator > .wpmega-item-description { | |
padding-left: 0px; | |
padding-bottom: 0px; | |
} | |
#megaMenu .ss-nav-menu-with-img > a > .wpmega-link-title, | |
#megaMenu .ss-nav-menu-with-img > a > .wpmega-link-description, | |
#megaMenu .ss-nav-menu-with-img > a > .wpmega-item-description, | |
#megaMenu .ss-nav-menu-with-img > span.um-anchoremulator > .wpmega-link-title, | |
#megaMenu .ss-nav-menu-with-img > span.um-anchoremulator > .wpmega-link-description, | |
#megaMenu .ss-nav-menu-with-img > span.um-anchoremulator > .wpmega-item-description { | |
padding-left: 30px; | |
/* Width of Pic + Space */ | |
display: block; | |
} | |
#megaMenu ul li.menu-item ul .ss-nav-menu-with-img > a:before, | |
#megaMenu ul li.menu-item ul .ss-nav-menu-with-img > a:after { | |
content: ""; | |
display: table; | |
} | |
#megaMenu ul li.menu-item ul .ss-nav-menu-with-img > a:after { | |
clear: both; | |
} | |
#megaMenu ul li.menu-item ul .ss-nav-menu-with-img:not(.megaReg-with-sub) > a:after { | |
border: none !important; | |
} | |
/* ========================================== */ | |
/* VERTICAL MENU STYLES */ | |
/* ========================================== */ | |
#megaMenu.megaMenuVertical ul.megaMenu > li.menu-item { | |
padding: 0px; | |
display: block; | |
} | |
#megaMenu ul.megaMenu > li.menu-item > a, | |
#megaMenu ul.megaMenu > li.menu-item > span.um-anchoremulator { | |
border-left: none; | |
} | |
#megaMenu.megaMenuVertical ul.megaMenu li.menu-item.ss-nav-menu-item-depth-0 { | |
display: block; | |
float: none; | |
clear: none; | |
} | |
#megaMenu.megaMenuVertical ul.megaMenu > li.menu-item.ss-nav-menu-mega > a, | |
#megaMenu.megaMenuVertical ul.megaMenu li.menu-item.mega-with-sub > a, | |
#megaMenu.megaMenuVertical ul.megaMenu li.menu-item.ss-nav-menu-mega > a, | |
#megaMenu.megaMenuVertical ul.megaMenu > li.menu-item.ss-nav-menu-mega > span.um-anchoremulator, | |
#megaMenu.megaMenuVertical ul.megaMenu li.menu-item.mega-with-sub > span.um-anchoremulator, | |
#megaMenu.megaMenuVertical ul.megaMenu li.menu-item.ss-nav-menu-mega > span.um-anchoremulator { | |
display: block; | |
} | |
/*#megaMenu.megaMenuVertical ul li.menu-item.ss-nav-menu-reg li.menu-item.megaReg-with-sub > a:after,*/ | |
#megaMenu.megaMenuVertical ul.megaMenu li.menu-item.mega-with-sub > a:after, | |
#megaMenu.megaMenuVertical ul.megaMenu li.menu-item.ss-nav-menu-mega > a:after, | |
#megaMenu.megaMenuVertical ul.megaMenu li.menu-item.mega-with-sub > span.um-anchoremulator:after, | |
#megaMenu.megaMenuVertical ul.megaMenu li.menu-item.ss-nav-menu-mega > span.um-anchoremulator:after { | |
top: 50%; | |
right: 8px; | |
margin-top: -1px; | |
border-style: solid none solid solid; | |
border-color: transparent; | |
border-left-color: #999; | |
border-width: 2px 0px 2px 3px; | |
padding-right: 1px; | |
} | |
#megaMenu.megaMenuVertical ul.megaMenu li.menu-item.ss-nav-menu-item-depth-0 ul.sub-menu-1 { | |
top: 0px; | |
left: 100%; | |
width: auto; | |
max-width: 720px; | |
/*margin-left:-1px;*/ | |
} | |
#megaMenu.megaMenuVertical ul.megaMenu li.menu-item.ss-nav-menu-reg ul.sub-menu { | |
padding: 4px 0px; | |
} | |
/* ========================================== */ | |
/* CENTERING STYLES */ | |
/* ========================================== */ | |
/* Centering Menu Bar */ | |
#megaMenu.megaCenterMenubar, | |
#megaMenu.megaCenterInner ul.megaMenu { | |
margin: 0 auto; | |
float: none; | |
} | |
#megaMenu.megaCenterMenubar ul.megaMenu { | |
float: none; | |
} | |
/* Center menu items */ | |
#megaMenu.megaCenterMenuItems ul.megaMenu { | |
text-align: center; | |
} | |
#megaMenu.megaCenterMenuItems ul.megaMenu > li.menu-item { | |
float: none; | |
} | |
#megaMenu.megaCenterMenuItems.megaMenuHorizontal ul.megaMenu > li.menu-item:first-child > a, | |
#megaMenu.megaCenterMenuItems.megaMenuHorizontal ul.megaMenu > li.menu-item:first-child > span.um-anchoremulator { | |
box-shadow: none; | |
} | |
#megaMenu.megaCenterMenuItems .ss-nav-menu-with-img.ss-nav-menu-notext > a > img, | |
#megaMenu.megaCenterMenuItems .ss-nav-menu-with-img.ss-nav-menu-notext > span.um-anchoremulator > img { | |
display: inline; | |
margin-bottom: -3px; | |
} | |
/* ========================================== */ | |
/* SEARCHBAR STYLES */ | |
/* ========================================== */ | |
/* Top Level Search Bar */ | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-widgetarea { | |
padding-left: 10px; | |
padding-right: 10px; | |
} | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-widgetarea > ul > li { | |
margin: 0px; | |
} | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-widgetarea > ul > li > .widgettitle { | |
float: left; | |
} | |
/* V2 */ | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-nonlink > form#searchform.ubersearch-v2 { | |
margin: 2px 0 0 0; | |
padding: 2px 0 0 0; | |
position: relative; | |
} | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-nonlink > form#searchform.ubersearch-v2 .ubersearch { | |
position: relative; | |
} | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-nonlink > form#searchform.ubersearch-v2 input[type="text"] { | |
width: 155px; | |
height: 26px; | |
border-width: 1px; | |
border-style: solid; | |
float: left; | |
padding: 6px 6px; | |
margin: 0; | |
-moz-border-radius: 0; | |
-webkit-border-radius: 0; | |
border-radius: 0; | |
line-height: 18px; | |
margin-bottom: 0; | |
-moz-box-sizing: border-box; | |
-webkit-box-sizing: border-box; | |
-o-box-sizing: border-box; | |
box-sizing: border-box; | |
background: #999; | |
background: rgba(255, 255, 255, 0.2); | |
border: none; | |
color: white; | |
} | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-nonlink > form#searchform.ubersearch-v2 label { | |
display: none; | |
} | |
#megaMenu ul.megaMenu > li.menu-item > .wpmega-nonlink > form#searchform.ubersearch-v2 input[type="text"]::-webkit-input-placeholder { | |
color: #ddd; | |
} | |
#megaMenu ul.megaMenu > li.menu-item > .wpmega-nonlink > form#searchform.ubersearch-v2 input[type="text"]::-moz-input-placeholder { | |
color: #ddd; | |
} | |
#megaMenu ul.megaMenu > li.menu-item > .wpmega-nonlink > form#searchform.ubersearch-v2 input[type="text"]:-ms-input-placeholder { | |
color: #ddd; | |
} | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-nonlink > form#searchform.ubersearch-v2 input[type="submit"] { | |
display: block; | |
position: absolute; | |
top: 0px; | |
right: 0; | |
-moz-box-sizing: border-box; | |
-webkit-box-sizing: border-box; | |
-o-box-sizing: border-box; | |
box-sizing: border-box; | |
height: 26px; | |
border: none; | |
box-shadow: none; | |
margin: 0; | |
line-height: 12px; | |
font-size: 9px; | |
padding: 2px 8px; | |
cursor: pointer; | |
background: #333; | |
background: rgba(0, 0, 0, 0.5); | |
color: #eee; | |
font-weight: bold; | |
} | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-nonlink > form#searchform.ubersearch-v2 input[type="submit"]:hover { | |
background: #555; | |
background: rgba(0, 0, 0, 0.3); | |
} | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-nonlink > form#searchform.ubersearch-v2 input[type="submit"]:active { | |
background: #111; | |
background: rgba(0, 0, 0, 0.8); | |
} | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-nonlink > form#searchform.ubersearch-v2 input[type="text"] { | |
padding-right: 32px; | |
} | |
/* V1 */ | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-widgetarea > ul > li > form#searchform.ubersearch-v1 div { | |
padding-top: 7px; | |
} | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-widgetarea > ul > li > form#searchform.ubersearch-v1 input[type="text"] { | |
width: 115px; | |
font-size: 12px; | |
border-width: 1px; | |
border-style: solid; | |
height: 16px; | |
float: left; | |
padding: 1px 3px; | |
border-radius: 2px 0px 0px 2px; | |
-moz-border-radius: 2px 0px 0px 2px; | |
-webkit-border-radius: 2px 0px 0px 2px; | |
line-height: 16px; | |
} | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-widgetarea > ul > li > form#searchform.ubersearch-v1 input[type="submit"] { | |
width: 20px; | |
height: 20px; | |
background: #000; | |
border: 1px solid #000; | |
display: inline-block; | |
float: left; | |
cursor: pointer; | |
border-radius: 0px 2px 2px 0px; | |
-moz-border-radius: 0px 2px 2px 0px; | |
-webkit-border-radius: 0px 2px 2px 0px; | |
text-indent: -999em; | |
} | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-nonlink > form#searchform.ubersearch-v1 { | |
margin: 2px 0 0 0; | |
padding: 0; | |
position: relative; | |
min-width: 160px; | |
} | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-nonlink > form#searchform.ubersearch-v1 label { | |
display: none; | |
} | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-nonlink > form#searchform.ubersearch-v1 input { | |
float: left; | |
} | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-nonlink > form#searchform.ubersearch-v1 input[type="text"] { | |
width: 130px; | |
height: 27px; | |
margin: 0; | |
padding: 5px 6px 4px 6px; | |
border-right: none; | |
border-width: 1px; | |
box-sizing: border-box; | |
} | |
#megaMenu.megaMenuVertical > ul.megaMenu > li.menu-item > .wpmega-nonlink > form#searchform.ubersearch-v1 input[type="text"] { | |
margin-bottom: 5px; | |
} | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-nonlink > form#searchform.ubersearch-v1 input[type="submit"] { | |
position: relative; | |
margin: 0; | |
float: none; | |
box-sizing: border-box; | |
background: #eee; | |
/* Old browsers */ | |
background: #eeeeee -moz-linear-gradient(top, rgba(255, 255, 255, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%); | |
/* FF3.6+ */ | |
background: #eeeeee -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.2)), color-stop(100%, rgba(0, 0, 0, 0.2))); | |
/* Chrome,Safari4+ */ | |
background: #eeeeee -webkit-linear-gradient(top, rgba(255, 255, 255, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%); | |
/* Chrome10+,Safari5.1+ */ | |
background: #eeeeee -o-linear-gradient(top, rgba(255, 255, 255, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%); | |
/* Opera11.10+ */ | |
background: #eeeeee -ms-linear-gradient(top, rgba(255, 255, 255, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%); | |
/* IE10+ */ | |
background: #eeeeee linear-gradient(top, rgba(255, 255, 255, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%); | |
/* W3C */ | |
border: 1px solid #aaa; | |
border-top: 1px solid #ccc; | |
border-left: 1px solid #ccc; | |
padding: 2px 8px; | |
color: #444; | |
display: inline-block; | |
font-size: 10px; | |
font-weight: bold; | |
text-decoration: none; | |
text-shadow: 0 1px rgba(255, 255, 255, 0.75); | |
cursor: pointer; | |
line-height: 21px; | |
font-family: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; | |
margin-left: -1px; | |
min-height: 27px; | |
min-height: 20px\9; | |
/* Seriously, IE? */ | |
} | |
#megaMenu > ul.megaMenu > li.menu-item > .wpmega-nonlink > form#searchform.ubersearch-v1 input[type="submit"]:hover { | |
color: #222; | |
background: #ddd; | |
/* Old browsers */ | |
background: #dddddd -moz-linear-gradient(top, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%); | |
/* FF3.6+ */ | |
background: #dddddd -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.3)), color-stop(100%, rgba(0, 0, 0, 0.3))); | |
/* Chrome,Safari4+ */ | |
background: #dddddd -webkit-linear-gradient(top, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%); | |
/* Chrome10+,Safari5.1+ */ | |
background: #dddddd -o-linear-gradient(top, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%); | |
/* Opera11.10+ */ | |
background: #dddddd -ms-linear-gradient(top, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%); | |
/* IE10+ */ | |
background: #dddddd linear-gradient(top, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%); | |
/* W3C */ | |
border: 1px solid #888; | |
border-top: 1px solid #aaa; | |
} | |
/* ========================================== */ | |
/* RECENT POSTS STYLES */ | |
/* ========================================== */ | |
/* Recent Posts */ | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul.sub-menu li.menu-item ul.wpmega-postlist { | |
margin-left: 0; | |
list-style: none; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul.sub-menu li.menu-item ul.wpmega-postlist li { | |
margin-bottom: .5em; | |
clear: both; | |
padding-top: .5em; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul.sub-menu li.menu-item ul.wpmega-postlist img { | |
float: left; | |
/*padding:4px; | |
background:rgba( 255,255,255, .2 ); | |
border:1px solid #e9e9e9;*/ | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul.sub-menu li.menu-item ul.wpmega-postlist-w-img div.wpmega-postlist-title, | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul.sub-menu li.menu-item ul.wpmega-postlist-w-img div.wpmega-postlist-content { | |
padding-left: 60px; | |
color: inherit; | |
} | |
#megaMenu ul li.menu-item.ss-nav-menu-mega ul.sub-menu li.menu-item ul.wpmega-postlist div.wpmega-postlist-title a { | |
padding: 0px 0px; | |
font-size: 13px; | |
text-decoration: none; | |
} | |
/* ========================================== */ | |
/* CONTACT FORM 7 STYLES */ | |
/* ========================================== */ | |
.wpmega-nonlink div.wpcf7 form { | |
margin-bottom: 0; | |
} | |
.wpmega-nonlink div.wpcf7 p { | |
margin-bottom: .1em; | |
clear: both; | |
} | |
.wpmega-nonlink div.wpcf7 label { | |
width: 50px; | |
float: left; | |
padding-top: .4em; | |
color: inherit; | |
} | |
.wpmega-nonlink div.wpcf7 span { | |
position: relative; | |
} | |
.wpmega-nonlink div.wpcf7 input[type="text"], | |
.wpmega-nonlink div.wpcf7 input[type="email"], | |
.wpmega-nonlink div.wpcf7 textarea { | |
/*width:255px;*/ | |
width: 95%; | |
padding: .4em; | |
border: 1px solid #dfdfdf; | |
box-shadow: none; | |
-moz-box-shadow: none; | |
-webkit-box-shadow: none; | |
font-family: inherit; | |
max-height: 100px; | |
font-size: 12px; | |
margin-top: .1em; | |
margin-bottom: .1em; | |
position: relative; | |
float: left; | |
} | |
.wpmega-nonlink div.wpcf7 input[type="text"]:focus, | |
.wpmega-nonlink div.wpcf7 input[type="text"]:hover, | |
.wpmega-nonlink div.wpcf7 textarea:focus, | |
.wpmega-nonlink div.wpcf7 textarea:hover { | |
background: #fcfcfc; | |
} | |
.wpmega-nonlink div.wpcf7 input.wpcf7-submit { | |
font-size: 12px; | |
clear: both; | |
border-width: 1px; | |
margin: 5px 0; | |
} | |
.wpcf7-form-control-wrap span.wpcf7-not-valid-tip { | |
position: absolute; | |
top: -9px; | |
left: 0px; | |
padding: 9px 6px; | |
width: 95%; | |
font-size: 12px; | |
} | |
.wpcf7-form div.wpcf7-response-output { | |
width: 93%; | |
} | |
/* ========================================== */ | |
/* CLEARFIX STYLES */ | |
/* ========================================== */ | |
/* Clearfix */ | |
.uberClearfix:before, | |
.uberClearfix:after, | |
#megaMenu.megaClear ul.megaMenu:before, | |
#megaMenu.megaClear ul.megaMenu:after { | |
content: ""; | |
display: table; | |
} | |
.uberClearfix:after, | |
#megaMenu.megaClear ul.megaMenu:after { | |
clear: both; | |
} | |
.uberClearfix, | |
#megaMenu.megaClear ul.megaMenu { | |
zoom: 1; | |
/* For IE 6/7 (trigger hasLayout) */ | |
} | |
/* ========================================== */ | |
/* RESPONSIVE STYLES */ | |
/* ========================================== */ | |
/* Toggle */ | |
#megaMenu #megaMenuToggle { | |
display: none; | |
padding: 12px 15px; | |
cursor: pointer; | |
font-size: 10px; | |
text-transform: uppercase; | |
text-align: left; | |
} | |
#megaMenu #megaMenuToggle .megaMenuToggle-icon { | |
display: inline-block; | |
background: #999; | |
background: rgba(230, 230, 230, 0.7); | |
height: 2px; | |
width: 16px; | |
position: relative; | |
float: right; | |
margin-top: 10px; | |
text-align: left; | |
} | |
#megaMenu #megaMenuToggle .megaMenuToggle-icon:before { | |
content: ''; | |
position: absolute; | |
background: #999; | |
background: rgba(230, 230, 230, 0.8); | |
height: 2px; | |
width: 16px; | |
top: -4px; | |
} | |
#megaMenu #megaMenuToggle .megaMenuToggle-icon:after { | |
content: ''; | |
position: absolute; | |
background: #999; | |
background: rgba(230, 230, 230, 0.9); | |
height: 2px; | |
width: 16px; | |
top: -8px; | |
} | |
/* #Tablet (Landscape) - 960px | |
================================================== */ | |
@media only screen and (max-width: 960px) { | |
/* Vertical */ | |
#megaMenu.megaResponsive.megaMenuVertical ul.megaMenu li.menu-item.ss-nav-menu-item-depth-0 ul.sub-menu-1 { | |
max-width: 767px; | |
left: 0px; | |
top: auto !important; | |
} | |
#megaMenu.megaResponsive.megaMenuVertical ul.megaMenu li.menu-item.ss-nav-menu-reg.ss-nav-menu-item-depth-0 ul.sub-menu-1 ul.sub-menu { | |
left: 0; | |
top: 100%; | |
} | |
} | |
/* #Mobile through Tablet (Portrait) - 767px | |
================================================== */ | |
@media only screen and (max-width: 959px) { | |
#megaMenu.megaResponsive ul.megaMenu > li.menu-item { | |
width: 100%; | |
} | |
#megaMenu.megaResponsive ul.megaMenu li.menu-item .ss-colgroup > .ss-col, | |
#megaMenu.megaResponsive ul.megaMenu li.menu-item.ss-nav-menu-mega ul.sub-menu.sub-menu-1 > li.menu-item, | |
#megaMenu.megaResponsive ul.megaMenu li.menu-item.ss-nav-menu-mega ul.sub-menu.sub-menu-1 > li.menu-item.ss-sidebar > .wpmega-nonlink > ul > li.widget { | |
width: 80%; | |
padding-left: 10%; | |
padding-right: 10%; | |
max-width: none; | |
} | |
#megaMenu.megaResponsive ul.megaMenu li.menu-item.ss-nav-menu-mega ul.sub-menu.sub-menu-1 > li.menu-item.ss-nav-menu-item-depth-1.fullWidthRow, | |
#megaMenu.megaResponsive ul.megaMenu li.menu-item.ss-nav-menu-mega ul.sub-menu.sub-menu-1 > li.menu-item.ss-nav-menu-item-depth-1.ss-sidebar { | |
padding-left: 0; | |
padding-right: 0; | |
width: 100%; | |
} | |
#megaMenu.megaResponsive ul.megaMenu li.menu-item .ss-colgroup > .ss-col { | |
margin-bottom: 1em; | |
} | |
#megaMenu ul.megaMenu > li.menu-item > .wpmega-nonlink > form#searchform.ubersearch-v2 .ubersearch input[type="text"] { | |
width: 100%; | |
margin-bottom: 5px; | |
} | |
/* Remove box shadow and border on menu items, since we're probably wrapping at this poing */ | |
#megaMenu.megaResponsive.megaMenuHorizontal ul.megaMenu > li.menu-item > a, | |
#megaMenu.megaResponsive.megaMenuHorizontal ul.megaMenu > li.menu-item > span.um-anchoremulator, | |
#megaMenu.megaResponsive ul.megaMenu > li.menu-item:hover > a, | |
#megaMenu.megaResponsive ul.megaMenu > li.menu-item > a:hover, | |
#megaMenu.megaResponsive ul.megaMenu > li.menu-item.megaHover > a { | |
box-shadow: none; | |
border-left: none; | |
} | |
/* No need to float right */ | |
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega-floatRight { | |
float: left; | |
} | |
/* Vertical */ | |
#megaMenu.megaResponsive.megaMenuVertical ul.megaMenu > li.menu-item { | |
width: 100%; | |
} | |
#megaMenu.megaResponsive.megaMenuVertical ul.megaMenu li.menu-item.ss-nav-menu-mega.ss-nav-menu-item-depth-0 ul.sub-menu-1 { | |
max-width: 420px; | |
} | |
/* Flyout Menus */ | |
#megaMenu.megaResponsive ul.megaMenu li.menu-item.ss-nav-menu-reg { | |
position: static; | |
} | |
#megaMenu.megaResponsive ul.megaMenu li.menu-item.ss-nav-menu-reg ul.sub-menu, | |
#megaMenu.megaResponsive ul.megaMenu li.menu-item.ss-nav-menu-reg ul.sub-menu li.menu-item ul.sub-menu { | |
left: -1px; | |
width: 100%; | |
box-shadow: none !important; | |
border-top-left-radius: 0 !important; | |
border-top-right-radius: 0 !important; | |
} | |
#megaMenu.megaResponsive ul.megaMenu li.menu-item.ss-nav-menu-reg ul.sub-menu li.menu-item ul.sub-menu { | |
top: 100%; | |
} | |
#megaMenu.megaResponsive ul.megaMenu li.menu-item.ss-nav-menu-reg ul.sub-menu > li.menu-item > a:after, | |
#megaMenu.megaResponsive ul.megaMenu li.menu-item.ss-nav-menu-reg ul.sub-menu > li.menu-item > span.um-anchoremulator:after { | |
border-color: #ddd transparent transparent transparent; | |
border-width: 3px 3px 0px; | |
border-style: solid dashed dashed; | |
right: 10px; | |
padding-top: 0; | |
padding-right: 2px; | |
margin-top: -3px; | |
} | |
/* Mega Menus */ | |
#megaMenu.megaResponsive ul.megaMenu li.menu-item.ss-nav-menu-mega ul.sub-menu.sub-menu-1 { | |
left: -1px !important; | |
width: 100%; | |
box-sizing: content-box; | |
/*box-sizing:border-box;*/ | |
box-shadow: none !important; | |
border-top-left-radius: 0; | |
border-top-right-radius: 0; | |
} | |
#megaMenu #megaMenuToggle { | |
display: block; | |
} | |
#megaMenu.megaResponsiveToggle ul.megaMenu { | |
display: none; | |
} | |
/* Vertical */ | |
#megaMenu.megaMenuVertical.megaFullWidth { | |
width: 100%; | |
} | |
/* Make centered Items align properly when stacked */ | |
#megaMenu.megaCenterMenuItems ul.megaMenu > li.menu-item { | |
float: left; | |
} | |
} | |
/* #Mobile (Landscape) - 480px - 767px | |
================================================== */ | |
/* Note: Design for a width of 480px */ | |
@media only screen and (min-width: 480px) and (max-width: 959px) { | |
#megaMenu.megaResponsive ul.megaMenu > li.menu-item { | |
width: 50%; | |
} | |
#megaMenu.megaResponsive ul.megaMenu li.menu-item.ss-nav-menu-mega ul.sub-menu.sub-menu-1 > li.menu-item { | |
width: 38%; | |
padding-left: 6%; | |
padding-right: 6%; | |
max-width: none; | |
} | |
#megaMenu.megaResponsive ul.megaMenu li.menu-item.ss-nav-menu-mega ul.sub-menu.sub-menu-1 > li.menu-item.ss-sidebar > .wpmega-nonlink > ul > li.widget { | |
width: 88%; | |
padding-left: 6%; | |
padding-right: 6%; | |
max-width: none; | |
} | |
} | |
@media only screen and (max-width: 479px) { | |
/* Vertical */ | |
#megaMenu.megaResponsive.megaMenuVertical ul.megaMenu li.menu-item.ss-nav-menu-mega.ss-nav-menu-item-depth-0 ul.sub-menu-1 { | |
max-width: 300px; | |
} | |
} | |
@media (min-width: 960px) { | |
#megaMenu.megaResponsiveToggle ul.megaMenu { | |
display: block !important; | |
} | |
#megaMenu ul.megaMenu a span.uber-close, | |
#megaMenu ul.megaMenu span.um-anchoremulator span.uber-close { | |
right: -12px !important; | |
z-index: 700; | |
} | |
} | |
/* Close Button */ | |
#megaMenu ul.megaMenu li.menu-item a span.uber-close, | |
#megaMenu ul.megaMenu li.menu-item span.um-anchoremulator span.uber-close { | |
position: absolute; | |
box-sizing: border-box; | |
text-decoration: none; | |
top: 0; | |
right: 0; | |
height: 100%; | |
width: 30px; | |
text-align: center; | |
line-height: 40px; | |
background: #999; | |
background: rgba(0, 0, 0, 0.9); | |
z-index: 700; | |
font-size: 20px; | |
font-weight: bold; | |
color: #f5f5f5; | |
display: none; | |
} | |
#megaMenu ul.megaMenu a:hover span.uber-close, | |
#megaMenu ul.megaMenu span.um-anchoremulator:hover span.uber-close, | |
#megaMenu ul.megaMenu li.menu-item.megaHover a span.uber-close, | |
#megaMenu ul.megaMenu li.menu-item.megaHover span.um-anchoremulator span.uber-close { | |
display: block; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment