View file File name : below-header-style.css Content :/*---------- Media Query min-width Structure ----------*/ /*---------- Media Query max-width Structure ----------*/ /*---------- Break-point min-width Structure ----------*/ /*---------- Break-point max-width Structure ----------*/ /*---------- Media Query min-width Structure ----------*/ /*---------- Media Query max-width Structure ----------*/ /*---------- Break-point min-width Structure ----------*/ /*---------- Break-point max-width Structure ----------*/ .ast-below-header { z-index: 3; } .ast-below-header { border-bottom: 1px solid #ffffff; margin-left: auto; margin-right: auto; position: relative; transition: all 0.2s linear; /* Search widget. */ /* Woocommerce Below Header cart*/ } .ast-below-header .ast-button-wrap { display: none; } .ast-below-header .astra-search-icon { -js-display: flex; display: flex; } .ast-below-header .user-select { position: relative; } .ast-below-header .ast-search-icon { display: block; } .ast-below-header .widget_search .search-field, .ast-below-header .widget_search .search-field:focus { width: 100%; padding: .66666em 3em .66666em 1em; } .ast-below-header .ast-addon-cart-wrap { padding: 0 .6em; } .below-header-section-1 .ast-search-menu-icon .search-form { right: auto; left: -1em; padding-left: 3em; padding-right: 0; } .below-header-user-select { padding-top: 0; align-items: center; } .below-header-user-select .widget { margin: 0 .5em; display: inline-block; vertical-align: middle; } .below-header-user-select .widget p, .below-header-user-select .widget a { margin-bottom: 0; } .below-header-user-select .ast-no-widget-row .widget-title { text-transform: capitalize; } .below-header-user-select .ast-no-widget-row .no-widget-text { margin: 0; } .ast-below-header .below-header-user-select { text-align: center; } .ast-below-header-wrap { position: relative; } /* Below Header menu li class */ .ast-below-header-menu-items, .ast-below-header-custom-menu-items { display: none; } /* Responsive Style */ .ast-header-break-point { /* Hide Below Header for mobile devices */ /* Separate Header CSS */ /* Merged Header CSS */ } .ast-header-break-point.ast-below-header-hide-on-mobile .ast-below-header-wrap { display: none; } .ast-header-break-point .ast-below-header-section-separated .ast-below-header-wrap { position: relative; } .ast-header-break-point .ast-below-header-section-separated .ast-below-header-actual-nav { display: none; background: #414042; position: absolute; padding: 0 20px; bottom: 0; transform: translateY(100%); left: 0; width: 100%; overflow-y: auto; } .ast-header-break-point .ast-below-header-section-separated .ast-below-header .ast-button-wrap { display: inline-block; } .ast-header-break-point .ast-below-header-section-separated .ast-below-header .ast-button-wrap .menu-below-header-toggle .mobile-menu { font-size: 15px; font-size: 1rem; font-weight: 600; } .ast-header-break-point .ast-below-header-section-separated.ast-below-header-mobile-stack .ast-below-header .ast-container { padding: 0; } .ast-header-break-point .ast-below-header-section-separated.ast-below-header-mobile-stack .below-header-section-1 { z-index: 5; } .ast-header-break-point .ast-below-header-section-separated.ast-below-header-mobile-stack .ast-below-header-section-wrap { flex-direction: column; } .ast-header-break-point .ast-below-header-section-separated.ast-below-header-mobile-stack .ast-below-header-navigation, .ast-header-break-point .ast-below-header-section-separated.ast-below-header-mobile-stack .below-header-user-select { width: 100%; } .ast-header-break-point .ast-below-header-section-separated.ast-below-header-mobile-stack .below-header-section-2 { padding: 1em 0 0 0; } .ast-header-break-point .ast-below-header-section-separated.ast-below-header-mobile-stack.ast-swap-below-header-sections .below-header-section-2 { padding: 0 0 1em 0; } .ast-header-break-point .ast-below-header-section-separated.ast-below-header-mobile-stack .below-header-section-1, .ast-header-break-point .ast-below-header-section-separated.ast-below-header-mobile-stack .below-header-section-2 { justify-content: center; text-align: left; } .ast-header-break-point.ast-header-custom-item-outside .ast-primary-menu-disabled.ast-below-header-merged-responsive .ast-mobile-menu-buttons { display: block; } .ast-header-break-point .ast-below-header-merged-responsive { /* Below Header menu li class*/ } .ast-header-break-point .ast-below-header-merged-responsive .ast-below-header { display: none; } .ast-header-break-point .ast-below-header-merged-responsive .toggle-on .ast-below-header-menu-items, .ast-header-break-point .ast-below-header-merged-responsive .toggle-on .ast-below-header-custom-menu-items { display: block; width: 100%; } .ast-header-break-point .ast-below-header-merged-responsive .below-header-section-2 { padding-top: .66em; padding-bottom: .66em; } .ast-header-break-point .ast-below-header-menu-items .sub-menu { list-style: none; margin: 0; padding-left: 0; position: relative; } .ast-header-break-point .ast-below-header-menu-items .menu-item { list-style: none; position: relative; } .ast-header-break-point .ast-below-header-menu-items .menu-item .menu-link { padding: 0 20px; display: inline-block; width: 100%; border-bottom-width: 1px; border-style: solid; border-color: var(--ast-border-color); } .ast-header-break-point .ast-below-header-menu-items.main-header-menu { border-top: 0; } .ast-header-break-point .ast-below-header-section-wrap { min-height: initial; } .ast-header-break-point .ast-below-header { border-bottom: none; } .ast-header-break-point .ast-below-header-menu { display: block; margin: 0 -20px; border-top-width: 1px; border-style: solid; border-color: var(--ast-border-color); } .ast-header-break-point .ast-below-header-menu .sub-menu .sub-menu { top: 0; } .ast-header-break-point .menu-item-has-children > .menu-link:after { display: none; } .ast-header-break-point .below-header-user-select .ast-search-menu-icon .search-field { max-height: initial; } .ast-header-break-point .below-header-user-select .widget { margin: .5em 0; display: block; } .ast-header-break-point .below-header-user-select .ast-addon-cart-wrap { padding: 0 .6em; } .ast-header-break-point .ast-below-header { border-top: 1px solid var(--ast-border-color); } .ast-header-break-point .menu-below-header-toggle { padding: 0 .5em; width: auto; } .ast-header-break-point .header-main-layout-2 .menu-below-header-toggle { margin-left: 0; } /* EDD cart for Below Header Section 1 */ .below-header-section-1 .ast-edd-site-header-cart:focus .widget_edd_cart_widget, .below-header-section-1 .ast-edd-site-header-cart:hover .widget_edd_cart_widget { right: auto; left: 0; } .below-header-section-1 .ast-edd-site-header-cart .widget_edd_cart_widget { right: -999em; left: auto; } .below-header-section-1 .ast-edd-site-header-cart .widget_edd_cart_widget:before, .below-header-section-1 .ast-edd-site-header-cart .widget_edd_cart_widget:after { left: 8px; right: auto; } .below-header-section-1 .ast-edd-site-header-cart .widget_edd_cart_widget:after { margin-left: -2px; } /*---------- Media Query min-width Structure ----------*/ /*---------- Media Query max-width Structure ----------*/ /*---------- Break-point min-width Structure ----------*/ /*---------- Break-point max-width Structure ----------*/ .ast-below-header-menu { /** Fixed submenu dropdown position */ } .ast-below-header-menu .sub-menu { line-height: 1.45; } .ast-below-header-menu .menu-link { text-decoration: none; padding: 0 1em; display: inline-block; transition: all 0.2s linear; } .ast-below-header-menu .menu-item { position: relative; } .ast-below-header-menu .menu-item:hover > .sub-menu, .ast-below-header-menu .menu-item.focus > .sub-menu { left: 0; right: auto; } .ast-below-header-menu .ast-left-align-sub-menu:hover > .sub-menu, .ast-below-header-menu .ast-left-align-sub-menu.focus > .sub-menu { right: 0; left: auto; } @media (min-width: 769px) { .ast-below-header-menu .ast-sub-menu-goes-outside:hover > .sub-menu, .ast-below-header-menu .ast-sub-menu-goes-outside.focus > .sub-menu { left: -100%; } .ast-below-header-menu .ast-left-align-sub-menu .sub-menu .menu-item:hover > .sub-menu, .ast-below-header-menu .ast-left-align-sub-menu .sub-menu .menu-item.focus > .sub-menu { left: -100%; } } .ast-below-header-menu .sub-menu .sub-menu { top: 0; } .ast-below-header-menu.submenu-with-border .sub-menu .sub-menu { top: -1px; } .ast-below-header-menu .sub-menu { width: 240px; background: #ffffff; left: -999em; position: absolute; top: 100%; z-index: 99999; } @media (min-width: 769px) { .ast-below-header-menu .sub-menu .menu-item:hover > .sub-menu, .ast-below-header-menu .sub-menu .menu-item.focus > .sub-menu { left: 100%; right: auto; } .ast-below-header-menu .sub-menu .ast-left-align-sub-menu:hover > .sub-menu, .ast-below-header-menu .sub-menu .ast-left-align-sub-menu.focus > .sub-menu, .ast-below-header-menu .sub-menu .ast-left-align-sub-menu:hover * .sub-menu, .ast-below-header-menu .sub-menu .ast-left-align-sub-menu:focus * .sub-menu { left: -100%; } } .ast-below-header-menu .sub-menu .menu-link { padding: 0.9em 1em; display: block; word-wrap: break-word; } .ast-below-header-menu .sub-menu .menu-item.menu-item-has-children > .menu-link .icon-arrow svg { position: absolute; right: 1em; top: 50%; transform: translate(0, -50%) rotate(270deg); } .ast-below-header-actual-nav ul { list-style: none; margin: 0; padding-left: 0; } .ast-below-header #ast-search-form.header-cover .search-field { font-size: 1.7em; } .ast-fullscreen-below-menu-overlay .ast-header-break-point .ast-below-header-menu .sub-menu { top: 0; } .ast-header-break-point .ast-button-wrap .menu-below-header-toggle.toggled .menu-toggle-icon:before { content: "\e5cd"; } .ast-header-break-point .ast-below-header { line-height: 3; padding: 1em 0; } .ast-header-break-point .ast-below-header ul { top: 0; } .ast-header-break-point .ast-below-header-actual-nav ul .menu-item .menu-link { padding: 0 20px; display: inline-block; width: 100%; border-bottom-width: 1px; border-style: solid; border-color: var(--ast-border-color); } .ast-header-break-point .ast-below-header-actual-nav ul .menu-item .menu-link { padding-left: 30px; } .ast-header-break-point .ast-below-header-actual-nav ul > .menu-item:first-child { border-top: 0; } .ast-header-break-point .ast-below-header-actual-nav ul ul { left: auto; right: auto; } .ast-header-break-point .ast-below-header-actual-nav .sub-menu .menu-item .menu-item .menu-link { padding-left: 40px; } .ast-header-break-point .ast-below-header-actual-nav .sub-menu .menu-item .menu-item .menu-item .menu-link { padding-left: 50px; } .ast-header-break-point .ast-below-header-actual-nav .sub-menu .menu-item .menu-item .menu-item .menu-item .menu-link { padding-left: 60px; } .ast-header-break-point .ast-below-header-actual-nav li { width: 100%; } .ast-header-break-point .ast-below-header-actual-nav .menu-item-has-children .sub-menu { display: none; } .ast-header-break-point .ast-below-header-actual-nav .menu-item-has-children > .ast-menu-toggle { display: inline-block; position: absolute; right: 20px; cursor: pointer; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; padding: 0 0.907em; font-size: inherit; font-weight: normal; line-height: inherit; } .ast-header-break-point .ast-below-header-actual-nav .ast-submenu-expanded > .ast-menu-toggle::before { transform: rotateX(180deg); } .ast-header-break-point .ast-below-header-menu .sub-menu { line-height: 3; } .ast-header-break-point .ast-below-header-menu .sub-menu .ast-left-align-sub-menu:hover > .sub-menu, .ast-header-break-point .ast-below-header-menu .sub-menu .ast-left-align-sub-menu.focus > .sub-menu { left: 0; } .ast-header-break-point .ast-below-header-menu .sub-menu { position: relative; opacity: 1; visibility: visible; border: 0; width: auto; } .ast-header-break-point .ast-below-header-menu .sub-menu .menu-link { border: 0; } .ast-header-break-point .ast-below-header-menu .ast-sub-menu-goes-outside:hover > .sub-menu, .ast-header-break-point .ast-below-header-menu .ast-sub-menu-goes-outside.focus > .sub-menu { left: auto; } .ast-fullscreen-below-menu-enable.ast-header-break-point .ast-below-header-navigation ul .menu-item .menu-link { padding-left: 0; } .ast-fullscreen-below-menu-enable.ast-header-break-point .ast-below-header-navigation ul .menu-item .menu-item .menu-link { padding-left: 0; } .ast-fullscreen-below-menu-enable.ast-header-break-point .ast-below-header-navigation ul .menu-item .menu-item .menu-item .menu-link { padding-left: 0; } .ast-fullscreen-below-menu-enable.ast-header-break-point .ast-below-header-navigation ul .menu-item .menu-item .menu-item .menu-item .menu-link { padding-left: 0; } .ast-desktop .ast-below-header-menu .sub-menu { box-shadow: 0 4px 10px -2px rgba(0, 0, 0, 0.1); } .ast-desktop .ast-below-header-menu .astra-full-megamenu-wrapper { box-shadow: 0 4px 10px -2px rgba(0, 0, 0, 0.1); } .ast-desktop .ast-below-header-menu .astra-full-megamenu-wrapper .sub-menu { box-shadow: none; } .ast-desktop .ast-below-header-menu .astra-megamenu .sub-menu { box-shadow: none; }