.sign-mm-menu li ul.sub-menu.mega-menu-sub-menu {
    width: 100% !important;
    max-width: 100% !important;
    left: auto !important;
    right: 0px !important;
    display: flex;
    flex-wrap: wrap !important;
    padding: 10px !important;
    /* background-color: #fff !important;    
    border-top: 3px solid #104476; */
    box-shadow: 0 2px 5px rgba(0, 0, 0, .1);
    -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, .1);
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, .1)
}

.sign-mm-menu .sub-menu a:hover{ 
    background-color: rgba(0, 0, 0, .03);
    opacity: .7;
 }
 .sign-mm-menu > li.menu-item-has-children {
    padding-right: 15px;
}
.sign-mm-menu > li.menu-item-has-children a {
    padding-right: 20px;
}

.sign-mm-top-menu-item a, ul.sub-menu.mega-menu-sub-menu li a{
    color: #000;
}

.sign-mm-menu li.sign-mm-top-menu-item {
    /* Keep the mega item as its own positioning context so theme-drawn,
       absolutely-positioned menu badges (e.g. Molti's "NEW" indicator) stay
       anchored to THIS item. The panel itself is pinned with position:fixed via
       JS, which ignores ancestor positioning, so this no longer affects it.
       (Previously this was `initial`, which detached such badges and made them
       drift into the dropdown / to the end of the bar.) */
    position: relative !important;
}

.mega-menu-sub-menu a{
    font-size: 14px;
}

.sign-mm-menu li ul.sub-menu.mega-menu-sub-menu li {
    width:25%;
    border: 0px !important;
}
.sign-mm-menu li ul.sub-menu.mega-menu-sub-menu li {
    display: flex !important;
    flex-wrap: nowrap;
    align-items: center;
}
.sign-mm-menu li ul.sub-menu.mega-menu-sub-menu li a:hover{ 
    background-color: rgba(0, 0, 0, .03);
    opacity: .7;
 }
.sign-mm-menu li ul.sub-menu.mega-menu-sub-menu li a:hover {background: transparent !important;}
ul.sub-menu.mega-menu-sub-menu li a.sign-menu-item-image-link {
    width: auto !important;
    margin-right: 10px;
}
.sign-mm-menu li ul.sub-menu.mega-menu-sub-menu li img {
    width: 100%;
    max-width: 90px;
    min-width: 50px;
    height: 60px;
    object-fit: contain;
    margin-right: 10px;
    vertical-align: middle;
    display: inline-block;
}
.sign-mm-menu li ul.sub-menu.mega-menu-sub-menu li a {
    padding: 0px !important;
    line-height: 1.5;width:auto;
}
.sign-mm-menu li ul.sub-menu.mega-menu-sub-menu li, .sign-mm-menu li ul.sub-menu.mega-menu-sub-menu li {
    padding: 10px 20px !important;
}
.et_header_style_left .logo_container {
    width: 50% !important;
}
.sign-mm-menu li ul.sub-menu.mega-menu-sub-menu li {
    width:33.33%;
    margin-bottom: 15px;
}
.sign-mm-menu li.sign-mm-top-menu-item.mm-col3 ul.sub-menu.mega-menu-sub-menu li {
    width: 33.33%;
}
.sign-mm-menu li.sign-mm-top-menu-item.mm-col4 ul.sub-menu.mega-menu-sub-menu li {
    width: 25%;
}
.sign-mm-menu li.sign-mm-top-menu-item.mm-col5 ul.sub-menu.mega-menu-sub-menu li {
    width: 20%;
}

.menu-item-wrapper-right{display: none;}
.sub-menu-wrapper .menu-item-wrapper-right{display: block;width: 20%;border-left: 1px solid #ddd;
    padding: 0px 20px;}
.sub-menu-wrapper .menu-item-wrapper-right a{
    display: flex;
    flex-direction: column;
    padding: 0;
}
.sub-menu-wrapper .menu-item-wrapper-right a:not(.mm_only_link) {
    height: calc(100% - 20px);
}
.sub-menu-wrapper .menu-item-wrapper-right a:not(.mm_only_link) img{    
    position: absolute;
    height: calc(100% - 45px);
    top: 0;
    
}
.sub-menu-wrapper .menu-item-wrapper-right a:not(.mm_only_link) span{
        bottom: 0;
    position: relative;
    top: auto;
    position: absolute;
}
.sign-mm-menu li .sub-menu-wrapper{
    width: 100% !important;
    max-width: 100% !important;
    left: auto !important;
    right: 0px !important;
    display: flex;
    flex-wrap: wrap !important;
    padding: 10px !important;
    /* background-color: #fff !important;    
    border-top: 3px solid #104476; */
    box-shadow: 0 2px 5px rgba(0, 0, 0, .1);
    -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, .1);
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, .1);
    background-color: #fff;
    position: absolute;
    padding: 20px 0;
    z-index: 9999;
    visibility: hidden;
    opacity: 0;
    border-top: 3px solid #2ea3f2;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .1);
    -moz-box-shadow: 0 2px 5px rgba(0,0,0,.1);
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, .1);
    -webkit-transform: translateZ(0);
    text-align: left;
    flex-direction: row-reverse;
    top: calc(100% - 1px);
}

.sign-mm-menu li > .sub-menu-wrapper ul.mega-menu-sub-menu{
    width: 80% !important;background-color:#ffffff !important;
}

.sign-mm-menu li .sub-menu-wrapper > ul{
position: relative !important;
opacity: 1 !important;
visibility: visible !important;
box-shadow: none !important;
-moz-box-shadow: none !important;
-webkit-box-shadow: none !important;
border: 0px !important;
padding: 0px !important;
display: none !important;
}
nav li:hover>.sub-menu-wrapper{opacity: 1;visibility: visible;}
nav li:hover>.sub-menu-wrapper ul{display: flex !important;}

/* --- Hover-intent open state (JS-controlled; see sign-mm-public-script.js) ---
   The panel is kept open via the `sign-mm-open` class for a short delay after
   the pointer leaves the menu item, so users can travel diagonally onto the
   panel without it snapping shut. Opening another mega item removes this class
   from the previous one immediately, so two panels are never open at once.
   These mirror the :hover rules above, so opening on hover stays instant. */
.sign-mm-menu li.sign-mm-open>.sub-menu-wrapper{opacity: 1 !important;visibility: visible !important;}
.sign-mm-menu li.sign-mm-open>.sub-menu-wrapper ul{display: flex !important;}
.sign-mm-menu li.sign-mm-open>ul.sub-menu.mega-menu-sub-menu{opacity: 1 !important;visibility: visible !important;display: flex !important;}
.menu-item-wrapper-right h3{ font-size: 16px;color:#000}
.menu-item-wrapper-right a span{ font-size: 14px;color:#000;font-family: inherit;margin-top: 15px;display: flex;margin-bottom: 5px;}
.menu-item-wrapper-right a{height: auto;max-width: 100%;}
.menu-item-wrapper-right .mm_only_link{
    font-size: 14px;
    color: #000;
    font-family: inherit;
    margin-bottom: 7px;
    text-decoration: underline;
    text-align: left;
    display: flex;
    align-items: flex-start;
    line-height: normal !important;
    min-height: auto;
}

@media screen and (min-width:981px) {
	.sign-mm-menu li .sub-menu-wrapper, 
	.sign-mm-top-menu-item > .mega-menu-sub-menu {
			position:fixed !important;
			top:auto !important;
	}
}


@media screen and (min-width:1199px) {
    .sign-mm-top-menu-item.menu-item-has-children > a:after {
        font-family: 'ETmodules' !important;
        content: "3" !important;
        font-size: 16px !important;
        position: absolute !important;
        right: 0 !important;    
        top: auto !important;
        font-weight: 800 !important;
        display: inline-block !important;
    }
}
@media screen and (max-width:1299px) {
    header#main-header #logo {
        width: 100%;
        max-width: 150px;
        height: auto;
        max-height: inherit;
    }
    #top-header .container, header#main-header .container {
        width: 100%;
        padding: 0px 20px;
    }
    .sign-mm-menu li ul.sub-menu.mega-menu-sub-menu li {
        width:50%;
    }
}
.sign-mm-mobile-menu li ul.mega-menu-sub-menu {
    width: 100%;
    left: 0;
    display: flex;
    flex-wrap: wrap;
    padding: 10px;
}
 .sign-mm-mobile-menu li ul.mega-menu-sub-menu img {
    width: 100%;
    max-width: 80px;
    height: 50px;
    object-fit: contain;
    margin-right: 10px;
    vertical-align: middle;
    display: inline-block;
}
.sign-mm-mobile-menu li ul.mega-menu-sub-menu li {
    border-bottom: 1px solid rgba(0, 0, 0, .03);
    padding: 10px 5% 10px 10%;
    display: block;    
}
.sign-mm-mobile-menu li ul.mega-menu-sub-menu li a {
    border-bottom: 0px solid rgba(0, 0, 0, .03);
    padding: 0px;
}
ul.mega-menu-sub-menu a {
    border: 0px !important;
}
.dc-dropdown-menu .nav li li a, .et-db #et-boc .et-l .dc-dropdown-menu .et-menu li li a {
    padding: 7px 0 !important;
}
@media screen and (max-width: 991px) {

	ul.sub-menu.mega-menu-sub-menu li a.sign-menu-item-image-link {
		display: none !important;
	}
}
@media screen and (max-width: 980px) {

	.sub-menu-wrapper .menu-item-wrapper-right{
	    width: 100%;
        border-left: 0px;
	}
	.sub-menu-wrapper {
        display: flex;
        flex-direction: column-reverse;
        margin-bottom:10px;
    }
    .sub-menu-wrapper .menu-item-wrapper-right a:not(.mm_only_link) {
      display: flex;
      flex-direction: row;align-items: center;padding-bottom: 10px;
    }
    .sub-menu-wrapper .menu-item-wrapper-right a:not(.mm_only_link) img{
      max-width: 80px;
     margin-right:15px;
    }
    .sub-menu-wrapper .menu-item-wrapper-right a:not(.mm_only_link) img,.sub-menu-wrapper .menu-item-wrapper-right a:not(.mm_only_link) span{
            position: relative;
            height: auto;
            top: auto;
    }
    
}
@media screen and (min-width: 991px) {
	.sign-mm-mobile-menu li ul.mega-menu-sub-menu li{
	    display: flex !important;
	    flex-wrap: nowrap;
	    align-items: center;
	}
}
/* ============================================================
   DIVI 5 THEME BUILDER HEADER COMPATIBILITY  (added support)
   ------------------------------------------------------------
   The classic-header mobile rules were scoped to `.sign-mm-mobile-menu`,
   which the Divi 5 Theme Builder header does not output, so the desktop
   column widths (25%/33%/50%) leaked into the hamburger menu. The rules
   below target the plugin's own mega-menu item classes (added by the PHP
   walker, present in both header types) and stack the mega menu into one
   full-width column.

   IMPORTANT: these are LAYOUT-ONLY rules. We deliberately do NOT force
   `display` on the panel or the submenu list, because doing so overrides
   Divi's mobile accordion collapse (display:none) and leaves the submenu
   stuck open. Letting Divi control visibility keeps open/close working
   exactly like the non-mega items.

   Breakpoint is 1100px to match a raised hamburger breakpoint. Change it
   if your menu collapses to the hamburger at a different width (Divi
   default is 980px).
   ============================================================ */
@media screen and (max-width: 1100px) {

    /* Panel flows inline in the mobile menu. No display/visibility forcing. */
    .sign-mm-menu li .sub-menu-wrapper {
        position: static !important;
        width: 100% !important;
        max-width: 100% !important;
        flex-direction: column !important;
        padding: 0 !important;
        box-shadow: none !important;
        border-top: 0 !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
    }

    /* Mega submenu list: layout only -- NO `display` override here. */
    .sign-mm-menu li ul.sub-menu.mega-menu-sub-menu,
    ul.sub-menu.mega-menu-sub-menu {
        width: 100% !important;
        max-width: 100% !important;
        flex-direction: column !important;
        flex-wrap: wrap !important;
        padding: 0 !important;
    }

    /* Each mega item: full width, stacked. (li display:block is safe --
       when Divi collapses the parent list, these are not rendered.) */
    .sign-mm-menu li ul.sub-menu.mega-menu-sub-menu li,
    ul.sub-menu.mega-menu-sub-menu li,
    .sign-mm-menu li.sign-mm-top-menu-item.mm-col3 ul.sub-menu.mega-menu-sub-menu li,
    .sign-mm-menu li.sign-mm-top-menu-item.mm-col4 ul.sub-menu.mega-menu-sub-menu li,
    .sign-mm-menu li.sign-mm-top-menu-item.mm-col5 ul.sub-menu.mega-menu-sub-menu li {
        width: 100% !important;
        display: block !important;
        margin-bottom: 0 !important;
        padding: 12px 20px !important;
        border-bottom: 1px solid rgba(0, 0, 0, .05) !important;
    }

    /* Keep each item's link/image on one tidy row */
    .sign-mm-menu li ul.sub-menu.mega-menu-sub-menu li a {
        display: inline-flex !important;
        align-items: center !important;
    }

    /* Optional right-hand promo column drops below, full width */
    .sub-menu-wrapper .menu-item-wrapper-right {
        width: 100% !important;
        border-left: 0 !important;
        padding: 0 20px !important;
    }
}


/* Divi 5 mobile fix (cont.): image-link anchors inside mega items are
   normally hidden on mobile via a rule gated on .mega-menu-sub-menu.
   Since that class is now stripped on mobile (see the JS) so the theme
   accordion can toggle the sub-menu, hide the image links here too,
   independently of that class. */
@media screen and (max-width: 1100px) {
    a.sign-menu-item-image-link {
        display: none !important;
    }
}