/* ============================================================= */ /* =================== Main tab styling ======================== */ /* ============================================================= */ .MenuWrapper, div.MenuWrapperMega {z-index:1; display:block; margin:0px auto; padding:0px; /*background:url(images/top_shadow7px.png) bottom left repeat-x;*/ position:relative; height:34px;} .MenuWrapper div.PfNav, div.MenuWrapperMega div.PfNav {margin:auto; text-align:center; padding:0px 0px 0px 0px; /*border-top:4px solid #403c35; border-bottom:4px solid #262422; background:#F8F8ED;*/ } /* ============================================================= */ /* =================== Main tab styling (level 0) ============== */ /* ============================================================= */ /* =================== styling for non-Mega ==================== */ .MenuWrapper ul {margin:auto; list-style:none; font-weight:bold; margin:0px 0px 0px 0px; padding:0px; text-align:center; vertical-align:top; display:inline-block; position:static; } .MenuWrapper ul li { margin:0px 0px 0px 0px; width:auto; padding:0px 0px 0px 0px; text-align:center; border-bottom:none; display:inline-block; float:left; background:url(images/sep.gif) 0px 2px no-repeat;} .MenuWrapper ul {font-family: Helvetica, Arial, sans-serif; position:static;} .MenuWrapper ul a {text-decoration:none; color:#ffffff; font-weight:normal; font-size:13px; display:block; padding: 0px 0px 0px 15px; font-family: Helvetica, Arial, sans-serif; line-height:42px; } .MenuWrapper ul li:hover a {color:#000000; background:url(images/top_hover.png) top left no-repeat; padding:5px 0px 11px 0px;} .MenuWrapper ul li.Last {width:auto;} .MenuWrapper ul li:first-child {background:none;} .MenuWrapper ul li:hover {padding:0px 0px 0px 0px; margin:0px 0px 0px 0px; z-index:1;} .MenuWrapper ul li.Active a {color:#ffffff; padding: 0px 0px 0px 15px; background:url(images/top_hover_left_Active_v2.png) no-repeat left top;} .MenuWrapper ul li.Active a span.MenuText {display:block; padding: 0px 15px 0px 0px; line-height:42px; background:url(images/top_hover_right_Active_v2.png) no-repeat right top;} .MenuWrapper ul li:hover a {color:#000000; padding: 0px 0px 0px 15px; background:url(images/top_hover_left.png) no-repeat left top;} .MenuWrapper ul li a span.MenuText {display:block; padding: 0px 15px 0px 0px; line-height:42px;} .MenuWrapper ul li:hover a span.MenuText {background:url(images/top_hover_right.png) no-repeat right top;} /* =================== styling for Mega ======================== */ ul#PfNavMega {margin:auto; list-style:none; font-weight:bold; margin:0px 0px 0px 0px; padding:1px 0 0; text-align:center; vertical-align:top; display:inline-block; float: right;} ul#PfNavMega {font-family: Helvetica, Arial, sans-serif; position:static;} ul#PfNavMega li {margin:0px 0px 0px 0px; width:auto; padding:0px 0px 0px 0px; text-align:center; border-bottom:none; display:inline-block; float:left; background:url(images/sep.gif) /*0px 2px*/ no-repeat;} ul#PfNavMega li:first-child { /* background:none; */} ul#PfNavMega li:hover {padding:0px 0px 0px 0px; margin:0px 0px 0px 0px; z-index:1;} ul#PfNavMega li.Last {width:auto;} ul#PfNavMega a {text-decoration:none; color:#ffffff; font-weight:normal; font-size:13px; display:block; padding: 0px 0px 0px 15px; font-family: Helvetica, Arial, sans-serif; line-height:42px;} ul#PfNavMega li.Active a {color:#ffffff; padding: 0px 0px 0px 15px; background:url(images/top_hover_left_Active_v2.png) no-repeat left top;} ul#PfNavMega li:hover a {color:#116c93; padding: 0px 0px 0px 15px; background:url(images/top_hover_left.png) no-repeat left top;} ul#PfNavMega li a span.MenuText {display:block; padding: 0px 15px 0px 0px; line-height:34px;} ul#PfNavMega li.Active a span.MenuText {display:block; padding: 0px 15px 0px 0px; line-height:34px; background:url(images/top_hover_right_Active_v2.png) no-repeat right top;} ul#PfNavMega li:hover a span.MenuText { background:url(images/top_hover_right.png) no-repeat right top;} /* icon handling */ ul#PfNavMega .IconImgBefore {margin-right: 3px; margin-top:0px;} /* ============================================================= */ /* =================== DropMenu Styling ============== */ /* ============================================================= */ /******************************* Normal CSS begin *************************/ ul#PfNavMega div.shadow {z-index:-1; display:none; position:absolute; left:-5px; margin:0px; width:972px; background:url(images/divShadow.png) bottom center no-repeat; padding:0px 6px 6px 6px; text-align:center; overflow:auto; /*CSS3 >>*/ opacity: 0.0; /* Firefox */ -moz-transition: opacity 0.25s ease 0.1s; /* WebKit */ -webkit-transition: opacity 0.25s ease 0.1s; /* Opera */ -o-transition: opacity 0.25s ease 0.1s; /* Standard */ transition: opacity 0.25s ease 0.1s; /*<< CSS3*/} ul#PfNavMega div.shadow div { /* overflow:auto;*/ margin:-8px 0 0; /*width:940px;*/ background:#ffffff; padding:0px; text-align:left; /*border:1px solid #000000;*/ border-top:none; z-index:1;} /* show drop divs */ ul#PfNavMega li:hover div {display:block;} /*neg margin is for shadow */ ul#PfNavMega li:hover div.shadow {left:-5px; top:34px; opacity:1;} /*neg margin is for shadow */ /******************************* Normal CSS end ***************************/ /******************************* jQuery CSS begin *************************/ ul#PfNavMega div.jShadow {overflow:auto; z-index:1; display:none; position:absolute; left:-2px; margin:0px; width:699px; background:url(images/divShadow.png) bottom center no-repeat; padding:0px 6px 6px 6px; text-align:center; top:34px;} ul#PfNavMega div.jShadow div {z-index:1; margin:-8px 0 0; width:942px; background:#ffffff; padding:25px; text-align:left; border:1px solid #000000; border-top:none;} /* show drop divs */ ul#PfNavMega li:hover div.jShadow {} /*neg margin is for shadow */ /******************************* jQuery CSS end ***************************/ .HtmlBeforeLevel0 {display:block; float:left; margin-right:20px;} ul#PfNavMega li div.Column {display:inline; border:none; vertical-align:top;} ul#PfNavMega li:hover div.Column {display:inline; border:none; vertical-align:top;} ul#PfNavMega li .shadow .InnerMegaDiv .Column {border: 0px solid red; width: 188px !important; /*padding: 5px;*/ text-align: center !important;} ul#PfNavMega li .shadow .InnerMegaDiv ul li {text-align: center;} ul#PfNavMega li .shadow .InnerMegaDiv .Column ul li a {font-size: 14px; color: #116c93;} ul#PfNavMega li .shadow .InnerMegaDiv .Column ul li span {font-weight: normal;} /* ============================================================= */ /* =================== Column Heading Styling (level 1) ======== */ /* ============================================================= */ ul#PfNavMega ul {list-style:none; margin:0px; padding:0px;} ul#PfNavMega div ul {position:relative; display:inline-block; margin:10px 0px 0px 0px; /*vertical-align:top;*/} ul#PfNavMega ul li {background:none; border:none; padding:0px 0px 0px 0px; margin:5px 0px 0px 0px; text-align:left; vertical-align:top;} ul#PfNavMega div ul li {background:none; border:none; padding:0px 5px 0px 5px; margin:5px 0px 5px 0px; text-align:left; vertical-align:top; width:auto; clear:both; display:block; position:relative;} ul#PfNavMega ul li:hover {background:none; padding:0px 0px 0px 0px; margin:5px 0px 0px 0px;} ul#PfNavMega div ul li:hover {background:none; border:none; padding:0px 5px 0px 5px; margin:5px 0px 5px 0px; text-align:left; vertical-align:top; display:block; position:relative;} ul#PfNavMega ul li a {font-size:13px; font-weight:bold; color:#000000; font-family: Helvetica, Arial, sans-serif; line-height:125%;} ul#PfNavMega li div ul li a {background:none; border:none;} ul#PfNavMega li:hover div ul li a {background:none; border:none; padding-left:0px; color:#000000;} ul#PfNavMega li:hover div ul li a:hover {/*background:url(images/megaL1_hover.png) left center no-repeat;*/} /* icon handling */ ul#PfNavMega div ul li .IconImgBefore {margin: 2px 5px 5px 0px; display:block; float: left;} /* ============================================================= */ /* =================== Menu item styling (level 2) ============= */ /* ============================================================= */ ul#PfNavMega ul li ul li a {font-size:13px; font-weight:normal; color:#000000; font-family: Helvetica, Arial, sans-serif;} ul#PfNavMega div ul li ul {margin:5px 0px 0px 0px;} ul#PfNavMega div ul li ul li {display:block; position:relative; background:none; border-bottom:1px solid #e1e1e1; padding:0px 0px 0px 0px; margin:0px 0px 0px 0px; text-align:left; vertical-align:top;} ul#PfNavMega div ul li ul li:hover {display:block; position:relative; background:none; border-bottom:1px solid #e1e1e1; padding:0px 0px 0px 0px; margin:0px 0px 0px 0px; text-align:left; vertical-align:top;} ul#PfNavMega li:hover div ul li ul li a {color:#000000; padding:0px 0px 0px 8px; margin:3px 0px; line-height:24px;} ul#PfNavMega li:hover div ul li ul li a:hover, ul#PfNavMega li:hover div ul li ul li.Active a {color:#f2f2f2; background:#6B6B6B;} /* ============================================================= */ /* =================== Main Template styling/layout ============ */ /* ============================================================= */ body {background:#ebe7de;} .HeaderMainContainer {} .TopNavigationMainContainer {background:url(images/topnav_bg.png) top center no-repeat;} .TopNavigationMain {} .ContentMainContainer {background:url(images/mid_bg.png) top center repeat-y;} .patos {background:url(images/botShadow.png) top center no-repeat; width:974px; height:6px;} .outerBorder {background:none;} .HeaderMain {background:none;} .ContentMain {background:#ffffff;} .ContentMain .LeftContent {} .ContentMain .RightContent {} .ContentMain .td_LeftContent {border-right:1px solid #d6cdba;} .ContentMain .td_RightContent {} /* ============================================================= */ /* =================== Header styling/layout =================== */ /* ============================================================= */ /* =================== MiniNav styling/layout ================== */ .HeaderMiniNav {color:#000000;} .HeaderMiniNav .miniNavUser, .HeaderMiniNav a.miniNavUser, .HeaderMiniNav a.miniNavUser:link, .HeaderMiniNav a.miniNavUser:visited, .HeaderMiniNav a.miniNavUser:active, .HeaderMiniNav a.miniNavUser:hover {color:#000000; text-decoration:none; font-family: Helvetica, Arial, sans-serif; text-transform:uppercase; font-size:13px;} .HeaderMiniNav .miniNavLogin, .HeaderMiniNav a.miniNavLogin, .HeaderMiniNav a.miniNavLogin:link, .HeaderMiniNav a.miniNavLogin:visited, .HeaderMiniNav a.miniNavLogin:active, .HeaderMiniNav a.miniNavLogin:hover {color:#000000; text-decoration:none; font-family: Helvetica, Arial, sans-serif; text-transform:uppercase; font-size:13px;} .HeaderMiniNav .miniNavDate {color:#000000; text-decoration:none; font-family: Helvetica, Arial, sans-serif; font-size:13px;} /* =================== Search styling/layout =================== */ .HeaderSearch .NormalTextBox {border:2px solid #9f9f9f; color:#333333;} .HeaderSearch .searchbox, .HeaderSearch a.searchbox {border:2px solid #9f9f9f; font-size:13px; background:#333333; color:#ffffff; text-decoration:none; font-family: Helvetica, Arial, sans-serif;} /* ============================================================= */ /* =================== MainContent styling/layout ============== */ /* ============================================================= */ .Breadcrumb {color:#797979; text-decoration:none; font-family: Helvetica, Arial, sans-serif; font-size:13px;} .Breadcrumb a, .Breadcrumb a:link, .Breadcrumb a:visited, .Breadcrumb a:active, .Breadcrumb a:hover {color:#3a3a3a; text-decoration:none; font-family: Helvetica, Arial, sans-serif; font-size:13px;} /* ============================================================= */ /* =================== Footer styling/layout =================== */ /* ============================================================= */ .FooterMain {color:#6b6b6b; background:none; text-decoration:none; font-family: Helvetica, Arial, sans-serif; font-size:13px;} .FooterMain a, .FooterMain a:link, .FooterMain a:visited, .FooterMain a:active, .FooterMain a:hover {color:#000000; text-decoration:none; font-family: Helvetica, Arial, sans-serif; font-size:13px;} /* ============================================================= */ /* =================== DNN Control styling/layout ============== */ /* ============================================================= */ .AdminMenuControl {background:#ffffff; border:2px solid #403c35;} .AdminMenuControl .main_dnnmenu_submenu2 {background:#ffffff; border:2px solid #403c35;} /* IE7 RULES - joe commented out (why?) */ /* ul#PfNavMega div ul {!display:inline;} */ /* joe - wct menu custom styles */ /* found under html structure: /* -- dnn:
.NavBar
.Navigation
#dnn_horzNav_MenuDiv ... */ /* -- packflash: ...
.MenuWrapperMega
.PfNav
    #PfNavMega .pf_lvl_0
  • #Menu{x}
    .shadow
    #Menu{x}Div .InnerMegaDiv
    #Menu{x}_Col{x} .Column
      .pf_lvl1
    • #Menu{x}_Col{x}_L{x}_{x} #HTMLBefore_Menu{x}_Col{x}{x}_{x} .HTMLBefoerLevel1 */ .HtmlBeforeLevel1 { } ul#PfNavMega div.shadow div.wctMenu {padding: 0px;} ul#PfNavMega div.shadow div.wctMenu, ul#PfNavMega div.shadow div.wctMenu div { display: block; position: static; border: 0px solid white; margin: 0px; width:auto; } .wctMenu, .wctMenu a, ul#PfNavMega li .shadow .InnerMegaDiv .Column ul li .wctMenu a {font-family:Helvetica, Arial; font-size:12px; font-weight:normal; text-decoration:none; color:#116c93;} .wctMenu a:hover, ul#PfNavMega li .shadow .InnerMegaDiv .Column ul li .wctMenu a:hover {text-decoration:underline;} .wctMenu table {table-layout:fixed; width:100%} .wctMenuCol {padding:2px 12px 2px 0px; vertical-align:top;} .wctMenu td:not(:last-child).wctMenuCol {border-right:1px dotted #cfcfcf;} .wctMenuCol th h1 {padding:0px; margin:6px 2px 12px 16px; text-align:left; font-size:16px; font-weight:500; border-bottom:1px solid #116c93;} .wctMenuItem, ul#PfNavMega div.shadow div.wctMenu .wctMenuItem {vertical-align:top; padding:2px 2px 16px 2px; margin-top:4px;} .wctMenuItemHdr, a.wctMenuItemHdr, ul#PfNavMega li .shadow .InnerMegaDiv .Column ul li .wctMenu a.wctMenuItemHdr {display:block; font-size:14px; font-weight:bold; margin:6px 2px 0px 0px;} .wctMenuItemHdr img {float:left; margin-right:6px;margin-top:-6px;} .wctMenuItemHdr img:hover {float:left; margin-right:6px;margin-top:-6px; background-image: url(images/icon-highlight.png);} .wctMenuItemLinks {display:block; padding:4px 2px 2px 0px;} .wctMenuItemLinks a {font-variant:small-caps; } .wctMenuItemLinks a:first-of-type {float:left;} .wctMenuItemLinks a:last-of-type {float:right; margin-right:4px;} .wctMenuItemFtr, span.wctMenuItemFtr {display:block; padding:4px 2px 2px 0px; font-style:italic; color:#8f8f8f;} span.wctMenuItemFtr a, ul#PfNavMega li .shadow .InnerMegaDiv .Column ul li .wctMenu .wctMenuItemFtr a {display:inline; padding:4px 2px 2px 0px; font-style:italic; color:#afafaf; white-space:nowrap;} span.wctMenuItemFtr a:hover, ul#PfNavMega li .shadow .InnerMegaDiv .Column ul li .wctMenu .wctMenuItemFtr a:hover {display:inline; padding:4px 2px 2px 0px; font-style:italic; color:#116c93; white-space:nowrap; text-decoration:underline;} span.wctMenuItemFtr a:last-of-type, ul#PfNavMega li .shadow .InnerMegaDiv .Column ul li .wctMenu .wctMenuItemFtr a:last-of-type {display:inline; padding:4px 2px 2px 0px; font-style:normal; color:#116c93; white-space:nowrap; float:right;} span.wctMenuItemFtr a:last-of-type {font-variant:small-caps;} .wctMenuItemSep, ul#PfNavMega div.shadow div.wctMenu div.wctMenuItemSep {line-height: 0px; margin:4px 48px 6px; border-bottom:1px dotted #1792C6;} a.wctMenuItemHdrSm, ul#PfNavMega li .shadow .InnerMegaDiv .Column ul li .wctMenu a.wctMenuItemHdrSm {display:block; margin:6px 2px 0px 8px;} .wctMenuItemHdrSm img {float:left; margin-right:6px;} .wctMenuItemHdrSm img:hover {float:left; margin-right:6px; background-image: url(images/icon-highlight-sm.png);} /* tech note on these syles designed by joe - this css style sheet '~/.../Skins/XLeratorDB/themes/Xlerator/theme.css' is for the PackFlash MegaMenu component and was initially designed by MadDevelopment and later modified by Joe Stampf with a new design built to work with updated version of the PackFlash MegaMenu v4.05.26 these styles are designed to work with a PF MegaMenu configured with just one column and one node - the displayed 'columns' are defined in the embedded 'html-before-level-1' aspect of the menu that references these styles beginning with the css class '.wctMenu' the long css selectors are necessary to override selector conflicts in earlier parts of the css designed by MadDev. (ie the 'specificity' aspect of css inheritance/cascading model which applies styles based on number of ids(#) classes(.) and html tags present in the selector) (refer to diagram of PF MegaMenu structure in support@westclintech.com google docs lucidchart doc) */ /* end joe */ /* --- just for comparison reference, this was in the main skin.css ... .HtmlBeforeLevel1 {display: inline-block; overflow: hidden; min-height: 70px;} */ /* --- and this was in the pfmegamenu stock bridgeportxxx theme.css that was used until jun-2016 ... span.HtmlBeforeLevel1 {padding: 20px 0 0; display:inline-block;} span.HtmlBeforeLevel1 a:link {color: #000 !important; font-weight: normal !important;} span.HtmlBeforeLevel1 a:visited {color: #000 !important; font-weight: normal !important;} span.HtmlBeforeLevel1 a:hover {color: #000 !important; font-weight: normal !important;} span.HtmlBeforeLevel1 a:active {color: #000 !important; font-weight: normal !important;} span.HtmlAfterLevel1 {padding: 0 0 20px; display: inline-block;} span.HtmlAfterLevel1 a:Link {color: #333 !important; font-size: 12px !important; font-weight: normal !important;} span.HtmlAfterLevel1 a:visited {color: #333 !important; font-size: 12px !important; font-weight: normal !important;} span.HtmlAfterLevel1 a:hover {color: #116c93 !important; font-size: 12px !important; font-weight: normal !important; text-decoration: underline !important;} span.HtmlAfterLevel1 a:active {color: #333 !important; font-size: 12px !important; font-weight: normal !important;} -- joe commented out these styles - i have no idea why they are setting styles specifically only for the 3rd menu item div.MenuWrapperMega div.PfNav ul#PfNavMega li#Menu3 div.shadow div#Menu3Div.InnerMegaDiv div#Menu3_Col1.Column, div.MenuWrapperMega div.PfNav ul#PfNavMega li#Menu3 div.shadow div#Menu3Div.InnerMegaDiv div#Menu3_Col2.Column, div.MenuWrapperMega div.PfNav ul#PfNavMega li#Menu3 div.shadow div#Menu3Div.InnerMegaDiv div#Menu3_Col3.Column, div.MenuWrapperMega div.PfNav ul#PfNavMega li#Menu3 div.shadow div#Menu3Div.InnerMegaDiv div#Menu3_Col4.Column { width: 200px !important; border: 0px solid red !important; display: inline-block !important; float: left !important; text-align: left !important; padding: 0 0 0 30px !important;} div#Menu3_Col1.Column ul li#Menu3_Col1_L1_1 a, div#Menu3_Col2.Column ul li#Menu3_Col2_L1_1 a, div#Menu3_Col3.Column ul li#Menu3_Col2_L1_1 a, div#Menu3_Col4.Column ul li#Menu3_Col2_L1_1 a {text-align: left;} ul#PfNavMega li#Menu3 .shadow .InnerMegaDiv ul li { text-align: left; } -- end joe */