/* Metronic Demo12 header layout - extracted from demo12 style.bundle.css Modified: color & background rules moved into a .theme-dark scope. Purpose: layout rules apply for both themes; dark-specific colors apply only when has class="theme-dark". */ /* Layout / structure rules (theme-agnostic) */ @media (min-width: 992px) { .header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-transition: height 0.3s ease; transition: height 0.3s ease; -webkit-box-shadow: none; box-shadow: none; position: relative; z-index: 2; } .header .header-top { height: 110px; display: -webkit-box; display: -ms-flexbox; display: flex; } .header .header-top .container, .header .header-top .container-fluid, .header .header-top .container-sm, .header .header-top .container-md, .header .header-top .container-lg, .header .header-top .container-xl, .header .header-top .container-xxl { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .header .header-top .quick-search .quick-search-form .input-group { } .header .header-top .quick-search .quick-search-form .input-group .input-group-text .svg-icon svg g [fill] { -webkit-transition: fill 0.3s ease; transition: fill 0.3s ease; } .header .header-top .quick-search .quick-search-form .input-group .input-group-text .svg-icon svg:hover g [fill] { -webkit-transition: fill 0.3s ease; transition: fill 0.3s ease; } .header .header-top .quick-search .quick-search-form .input-group .input-group-text .quick-search-close { } .header .header-top .quick-search .quick-search-form .input-group .form-control { } .header .header-top .quick-search .quick-search-form .input-group .form-control::-moz-placeholder { opacity: 1; } .header .header-top .quick-search .quick-search-form .input-group .form-control:-ms-input-placeholder { } .header .header-top .quick-search .quick-search-form .input-group .form-control::-webkit-input-placeholder { } .header .header-top .quick-search .quick-search-form .input-group .form-control:active, .header .header-top .quick-search .quick-search-form .input-group .form-control.active, .header .header-top .quick-search .quick-search-form .input-group .form-control:focus, .header .header-top .quick-search .quick-search-form .input-group .form-control.focus { } .header .header-top .quick-search .quick-search-form .input-group .input-group-append.spinner:before { } .header .header-bottom { height: 70px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; } .header .header-bottom .container, .header .header-bottom .container-fluid, .header .header-bottom .container-sm, .header .header-bottom .container-md, .header .header-bottom .container-lg, .header .header-bottom .container-xl, .header .header-bottom .container-xxl { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .header-fixed[data-header-scroll=on] .header { position: fixed; top: 0; right: 0; left: 0; z-index: 97; height: 70px; -webkit-animation: header-scroll-animation 0.5s ease 1; animation: header-scroll-animation 0.5s ease 1; } .header-fixed[data-header-scroll=on] .header .header-top { height: 70px; } .header-fixed[data-header-scroll=on] .header .header-bottom { display: none; } .header-fixed.header-fixed-bottom[data-header-scroll=on] .header .header-top { display: none; } .header-fixed.header-fixed-bottom[data-header-scroll=on] .header .header-bottom { display: -webkit-box; display: -ms-flexbox; display: flex; height: 70px; } .header .quick-search .input-group { } .header .quick-search .input-group .form-control { } .header .quick-search .input-group .form-control::-moz-placeholder { opacity: 1; } .header .quick-search .input-group .form-control:-ms-input-placeholder { } .header .quick-search .input-group .form-control::-webkit-input-placeholder { } .header .quick-search .input-group .input-group-text i { } .header .quick-search .input-group .input-group-text .svg-icon svg g [fill] { -webkit-transition: fill 0.3s ease; transition: fill 0.3s ease; } .header .quick-search .input-group .input-group-text .svg-icon svg:hover g [fill] { -webkit-transition: fill 0.3s ease; transition: fill 0.3s ease; } } @media (min-width: 992px) { .header-mobile { display: none; } } @media (max-width: 991.98px) { .header-mobile { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0 15px; -webkit-box-shadow: none; box-shadow: none; height: 60px; min-height: 60px; z-index: 3; } .header-mobile-fixed .header-mobile { position: fixed; top: 0; right: 0; left: 0; z-index: 97; } .topbar-mobile-on .header-mobile { -webkit-box-shadow: none; box-shadow: none; } .header-mobile .burger-icon span { } .header-mobile .burger-icon span::before, .header-mobile .burger-icon span::after { } .header-mobile .burger-icon:hover span { background-color: #ffffff; } .header-mobile .burger-icon:hover span::before, .header-mobile .burger-icon:hover span::after { background-color: #ffffff; } .header-mobile .burger-icon-active span { background-color: #ffffff; } .header-mobile .burger-icon-active span::before, .header-mobile .burger-icon-active span::after { background-color: #ffffff; } .header-mobile .btn i { } .header-mobile .btn .svg-icon svg g [fill] { -webkit-transition: fill 0.3s ease; transition: fill 0.3s ease; } .header-mobile .btn .svg-icon svg:hover g [fill] { -webkit-transition: fill 0.3s ease; transition: fill 0.3s ease; } .header-mobile .btn.active i, .header-mobile .btn:focus i, .header-mobile .btn:hover i, .header-mobile .show .btn i { color: #ffffff; } .header-mobile .btn.active .svg-icon svg g [fill], .header-mobile .btn:focus .svg-icon svg g [fill], .header-mobile .btn:hover .svg-icon svg g [fill], .header-mobile .show .btn .svg-icon svg g [fill] { -webkit-transition: fill 0.3s ease; transition: fill 0.3s ease; fill: #ffffff; } .header-mobile .btn:hover .svg-icon svg g [fill], .header-mobile .show .btn .svg-icon svg g [fill] { -webkit-transition: fill 0.3s ease; transition: fill 0.3s ease; fill: #ffffff; } .header-mobile .btn.active .svg-icon svg:hover g [fill], .header-mobile .btn:focus .svg-icon svg:hover g [fill], .header-mobile .btn:hover .svg-icon svg:hover g [fill], .header-mobile .show .btn .svg-icon svg:hover g [fill] { -webkit-transition: fill 0.3s ease; transition: fill 0.3s ease; } } @media (min-width: 992px) { .header-menu { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; height: 100%; margin: 0; } .header-menu .menu-nav { list-style: none; margin: 0; padding: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; } .header-menu .menu-nav > .menu-item .menu-link { display: -webkit-box; display: -ms-flexbox; display: flex; text-decoration: none; position: relative; vertical-align: middle; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; outline: none !important; text-decoration: none; cursor: pointer; } .header-menu .menu-nav > .menu-item .menu-link .menu-text { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; padding: 0; } .header-menu .menu-nav > .menu-item .menu-link .menu-label { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; line-height: 0; white-space: nowrap; } .header-menu .menu-nav > .menu-item .menu-link .menu-icon { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .header-menu .menu-nav > .menu-item .menu-link .menu-arrow { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .header-menu .menu-nav > .menu-item .menu-link:hover, .header-menu .menu-nav > .menu-item .menu-link:active, .header-menu .menu-nav > .menu-item .menu-link:focus { text-decoration: none; } .header-menu .menu-nav > .menu-item > .menu-link > .menu-text { width: auto; } .header-menu .menu-nav > .menu-item.menu-item-icon > .menu-link { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .header-menu .menu-nav > .menu-item.menu-item-icon > .menu-link > .menu-icon { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .header-menu .menu-nav > .menu-item .menu-submenu { display: none; z-index: 98; position: absolute; top: 100%; -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-transform-style: preserve-3d; border-radius: 4px; padding: 20px 0px; } .header-menu .menu-nav > .menu-item .menu-submenu .menu-scroll { position: relative; overflow: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } .header-menu .menu-nav > .menu-item .menu-submenu .menu-subnav { list-style: none !important; padding: 0; margin: 0; } .header-menu .menu-nav > .menu-item .menu-submenu { width: 275px; margin: 0 auto; left: auto; right: auto; } .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-full { margin: 0 auto; width: auto; left: 20px; right: 20px; } .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-fixed { left: auto; right: auto; width: auto; } .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-right { right: 0; left: auto; } .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-right.menu-submenu-pull { margin-right: -40px; } .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-left { right: auto; left: 0; } .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-left.menu-submenu-pull { margin-left: -40px; } .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-center { margin: 0 auto; left: 0; right: 0; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item.menu-item-submenu { position: relative; padding: 0; margin: 0; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item.menu-item-submenu > .menu-submenu { top: 0; display: none; margin-top: 0; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item.menu-item-submenu > .menu-submenu.menu-submenu-left { right: 100%; left: auto; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item.menu-item-submenu > .menu-submenu.menu-submenu-right { left: 100%; right: auto; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item.menu-item-submenu.menu-item-dropup > .menu-submenu { top: auto; bottom: 0; } .header-menu .menu-nav > .menu-item .menu-submenu .menu-content { display: -webkit-box; display: -ms-flexbox; display: flex; list-style: none; padding: 0; margin: 0; } .header-menu .menu-nav > .menu-item .menu-submenu .menu-content > .menu-item { padding: 0; margin: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } .header-menu .menu-nav > .menu-item .menu-submenu .menu-content > .menu-item:last-child { border-right: 0; } .header-menu .menu-nav > .menu-item .menu-submenu .menu-heading { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0; margin: 0; text-decoration: none; position: relative; } .header-menu .menu-nav > .menu-item .menu-submenu .menu-heading .menu-text { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } .header-menu .menu-nav > .menu-item .menu-submenu .menu-heading .menu-label { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; white-space: nowrap; } .header-menu .menu-nav > .menu-item .menu-submenu .menu-heading .menu-icon { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 18px; padding: 0 10px 0 0; } .header-menu .menu-nav > .menu-item .menu-submenu .menu-heading .menu-arrow { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0 0 0 10px; } .header-menu .menu-nav > .menu-item .menu-inner, .header-menu .menu-nav > .menu-item .menu-subnav { list-style: none; margin: 0; padding: 0; } .header-menu .menu-nav > .menu-item .menu-inner > .menu-item, .header-menu .menu-nav > .menu-item .menu-subnav > .menu-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; margin: 0; padding: 10px 20px; } .header-menu .menu-nav > .menu-item .menu-inner > .menu-item .menu-link, .header-menu .menu-nav > .menu-item .menu-subnav > .menu-item .menu-link { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; text-decoration: none; position: relative; } .header-menu .menu-nav > .menu-item .menu-inner > .menu-item .menu-link:hover, .header-menu .menu-nav > .menu-item .menu-inner > .menu-item .menu-link:active, .header-menu .menu-nav > .menu-item .menu-inner > .menu-item .menu-link:focus, .header-menu .menu-nav > .menu-item .menu-subnav > .menu-item .menu-link:hover, .header-menu .menu-nav > .menu-item .menu-subnav > .menu-item .menu-link:active, .header-menu .menu-nav > .menu-item .menu-subnav > .menu-item .menu-link:focus { outline: none; text-decoration: none; } .header-menu .menu-nav > .menu-item .menu-inner > .menu-item .menu-link .menu-text, .header-menu .menu-nav > .menu-item .menu-subnav > .menu-item .menu-link .menu-text { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-weight: 400; font-size: 1rem; text-transform: initial; } .header-menu .menu-nav > .menu-item .menu-inner > .menu-item .menu-link .menu-label, .header-menu .menu-nav > .menu-item .menu-subnav > .menu-item .menu-link .menu-label { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; white-space: nowrap; padding: 0px 0px 0px 5px; } .header-menu .menu-nav > .menu-item .menu-inner > .menu-item .menu-link .menu-icon, .header-menu .menu-nav > .menu-item .menu-subnav > .menu-item .menu-link .menu-icon { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-flex: 0; -ms-flex: 0 0 33px; flex: 0 0 33px; padding: 0; font-size: 1.4rem; } .header-menu .menu-nav > .menu-item .menu-inner > .menu-item .menu-link .menu-bullet, .header-menu .menu-nav > .menu-item .menu-subnav > .menu-item .menu-link .menu-bullet { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; line-height: 0; } .header-menu .menu-nav > .menu-item .menu-inner > .menu-item .menu-link .menu-arrow, .header-menu .menu-nav > .menu-item .menu-subnav > .menu-item .menu-link .menu-arrow { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0px 0px 0px 10px; } .header-menu .menu-nav > .menu-item .menu-inner { padding: 0; } .header-menu .menu-nav > .menu-item .menu-submenu .menu-submenu { margin-left: 1px; } .header-menu .menu-nav > .menu-item .menu-submenu .menu-submenu.menu-submenu-left { margin-right: 1px; } .header-menu .menu-nav > .menu-item.menu-item-submenu.menu-item-tabs > .menu-submenu > .menu-subnav > .menu-item.menu-item-submenu > .menu-submenu { top: 100%; } .header-menu .menu-nav > .menu-item.menu-item-submenu.menu-item-tabs > .menu-submenu > .menu-subnav > .menu-item.menu-item-submenu > .menu-submenu.menu-submenu-left { right: 100%; left: 0; } .header-menu .menu-nav > .menu-item.menu-item-submenu.menu-item-tabs > .menu-submenu > .menu-subnav > .menu-item.menu-item-submenu > .menu-submenu.menu-submenu-right { left: 100%; right: 0; } .header-menu .menu-nav > .menu-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0px 0.25rem; } .header-menu .menu-nav > .menu-item > .menu-link > .menu-arrow { display: none; } .header-menu .menu-nav > .menu-item > .menu-link > .menu-arrow:before { content: "" !important; } .header-menu .menu-nav > .menu-item.menu-item-rel { position: relative; } .header-menu .menu-nav > .menu-item > .menu-link { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; cursor: pointer; padding: 0.25rem 0.5rem; } .header-menu .menu-nav > .menu-item > .menu-link:hover { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .header-menu .menu-nav > .menu-item > .menu-link .menu-icon { font-size: 1.4rem; width: 30px; padding: 0; line-height: 0; } .header-menu .menu-nav > .menu-item > .menu-link .menu-icon.svg-icon { height: 23px; width: 23px; margin-left: -2px; } .header-menu .menu-nav > .menu-item > .menu-link .menu-bullet { width: 20px; } .header-menu .menu-nav > .menu-item > .menu-link .menu-bullet > span { vertical-align: middle; display: inline-block; } .header-menu .menu-nav > .menu-item > .menu-link .menu-bullet.menu-bullet-dot > span { width: 4px; height: 4px; border-radius: 100%; } .header-menu .menu-nav > .menu-item > .menu-link .menu-bullet.menu-bullet-line > span { width: 5px; height: 1px; } .header-menu .menu-nav > .menu-item > .menu-link .menu-text { font-weight: 500; font-size: 1.05rem; text-transform: initial; } .header-menu .menu-nav > .menu-item > .menu-link .menu-label { padding: 0px 0px 0px 5px; } .header-menu .menu-nav > .menu-item > .menu-link .menu-arrow { font-size: 0.6rem; width: 20px; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .header-menu .menu-nav > .menu-item > .menu-link .menu-arrow:before { font-family: Ki; font-style: normal; font-weight: normal; font-variant: normal; line-height: 1; text-decoration: inherit; text-rendering: optimizeLegibility; text-transform: none; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; content: ""; } [direction=rtl] .header-menu .menu-nav > .menu-item > .menu-link .menu-arrow:before { content: "" !important; } .header-menu .menu-nav > .menu-item > .menu-link .menu-item-here { display: none; } .header-menu .menu-nav > .menu-item .menu-submenu { padding: 0px; border-radius: 4px; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item { padding: 0px; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item > .menu-link { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; cursor: pointer; padding: 11px 30px; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item > .menu-link:hover { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item > .menu-link .menu-icon { font-size: 1.4rem; width: 33px; padding: 0; line-height: 0; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item > .menu-link .menu-icon.svg-icon { height: 23px; width: 23px; margin-left: -2px; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item > .menu-link .menu-bullet { width: 20px; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item > .menu-link .menu-bullet > span { vertical-align: middle; display: inline-block; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item > .menu-link .menu-bullet.menu-bullet-dot > span { width: 4px; height: 4px; border-radius: 100%; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item > .menu-link .menu-bullet.menu-bullet-line > span { width: 9px; height: 1px; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item > .menu-link .menu-text { font-weight: 400; font-size: 1rem; text-transform: initial; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item > .menu-link .menu-label { padding: 0px 0px 0px 5px; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item > .menu-link .menu-arrow { font-size: 0.6rem; width: 20px; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; padding: 0px 0px 0px 10px; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item > .menu-link .menu-arrow:before { font-family: Ki; font-style: normal; font-weight: normal; font-variant: normal; line-height: 1; text-decoration: inherit; text-rendering: optimizeLegibility; text-transform: none; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; content: ""; } [direction=rtl] .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item > .menu-link .menu-arrow:before { content: "" !important; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item > .menu-link .menu-item-here { display: none; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content > .menu-item { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; -ms-flex-preferred-size: 0; flex-basis: 0; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content > .menu-item:last-child { border-right: 0 !important; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-heading { padding: 30px 30px 10px 30px; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-heading > .menu-text { font-weight: 500; font-size: 1.07rem; text-transform: initial; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-heading > .menu-icon { font-size: 1.35rem; -webkit-box-flex: 0; -ms-flex: 0 0 30px; flex: 0 0 30px; padding: 0; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-heading .menu-label { padding: 0px 0px 0px 5px; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-inner { padding: 0 0 20px 0; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-inner > .menu-item { padding: 0px; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-inner > .menu-item > .menu-link { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; cursor: pointer; padding: 11px 30px; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-inner > .menu-item > .menu-link:hover { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-inner > .menu-item > .menu-link .menu-icon { font-size: 1.4rem; width: 33px; padding: 0; line-height: 0; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-inner > .menu-item > .menu-link .menu-icon.svg-icon { height: 23px; width: 23px; margin-left: -2px; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-inner > .menu-item > .menu-link .menu-bullet { width: 20px; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-inner > .menu-item > .menu-link .menu-bullet > span { vertical-align: middle; display: inline-block; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-inner > .menu-item > .menu-link .menu-bullet.menu-bullet-dot > span { width: 4px; height: 4px; border-radius: 100%; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-inner > .menu-item > .menu-link .menu-bullet.menu-bullet-line > span { width: 9px; height: 1px; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-inner > .menu-item > .menu-link .menu-text { font-weight: 400; font-size: 1rem; text-transform: initial; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-inner > .menu-item > .menu-link .menu-label { padding: 0px 0px 0px 5px; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-inner > .menu-item > .menu-link .menu-arrow { font-size: 0.6rem; width: 20px; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; padding: 0px 0px 0px 10px; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-inner > .menu-item > .menu-link .menu-arrow:before { font-family: Ki; font-style: normal; font-weight: normal; font-variant: normal; line-height: 1; text-decoration: inherit; text-rendering: optimizeLegibility; text-transform: none; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; content: ""; } [direction=rtl] .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-inner > .menu-item > .menu-link .menu-arrow:before { content: "" !important; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-inner > .menu-item > .menu-link .menu-item-here { display: none; } .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-classic { padding: 20px 0px; } .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-inline { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; } .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-inline > .menu-subnav > .menu-item { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 5px 0; } .header-menu .menu-nav .menu-item.menu-item-resize { display: none; } .header-menu .menu-nav .menu-item.menu-item-active-tab .menu-submenu, .header-menu .menu-nav .menu-item.menu-item-hover .menu-submenu { display: block; -webkit-animation: header-menu-submenu-fade-in 0.3s ease 1, header-menu-submenu-move-down 0.3s ease-out 1; animation: header-menu-submenu-fade-in 0.3s ease 1, header-menu-submenu-move-down 0.3s ease-out 1; } } @media screen and (min-width: 992px) and (-ms-high-contrast: active), (min-width: 992px) and (-ms-high-contrast: none) { .header-menu .menu-nav .menu-item.menu-item-active-tab .menu-submenu, .header-menu .menu-nav .menu-item.menu-item-hover .menu-submenu { -webkit-animation: none; animation: none; } } @media (min-width: 992px) { .header-menu .menu-nav .menu-item.menu-item-active-tab .menu-submenu > .menu-subnav > .menu-item.menu-item-hover > .menu-submenu, .header-menu .menu-nav .menu-item.menu-item-hover .menu-submenu > .menu-subnav > .menu-item.menu-item-hover > .menu-submenu { display: block; -webkit-animation: header-menu-submenu-fade-in 0.3s ease 1, header-menu-submenu-move-up 0.3s ease-out 1; animation: header-menu-submenu-fade-in 0.3s ease 1, header-menu-submenu-move-up 0.3s ease-out 1; } } @media screen and (min-width: 992px) and (-ms-high-contrast: active), (min-width: 992px) and (-ms-high-contrast: none) { .header-menu .menu-nav .menu-item.menu-item-active-tab .menu-submenu > .menu-subnav > .menu-item.menu-item-hover > .menu-submenu, .header-menu .menu-nav .menu-item.menu-item-hover .menu-submenu > .menu-subnav > .menu-item.menu-item-hover > .menu-submenu { -webkit-animation: none; animation: none; } } @media (min-width: 992px) { .header-menu.header-menu-root-arrow .menu-nav > .menu-item > .menu-link > .menu-arrow { display: -webkit-box; display: -ms-flexbox; display: flex; } } @media (min-width: 992px) and (max-width: 1399.98px) { .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-full, .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-fixed, .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-auto, .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-auto.menu-submenu-mimimal-desktop-wide, .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-fixed-xl, .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-fixed-xxl { margin: 0 auto; width: auto; left: 20px; right: 20px; } } @media (min-width: 0) { .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-fixed-xs { width: -60px; } } @media (min-width: 576px) { .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-fixed-sm { width: 516px; } } @media (min-width: 768px) { .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-fixed-md { width: 708px; } } @media (min-width: 992px) { .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-fixed-lg { width: 932px; } } @media (min-width: 1200px) { .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-fixed-xl { width: 1140px; } } @media (min-width: 1400px) { .header-menu .menu-nav > .menu-item .menu-submenu.menu-submenu-fixed-xxl { width: 1340px; } } @-webkit-keyframes header-menu-submenu-fade-out { from { opacity: 1; } to { opacity: 0; } } @keyframes header-menu-submenu-fade-out { from { opacity: 1; } to { opacity: 0; } } @-webkit-keyframes header-menu-submenu-fade-in { from { opacity: 0; } to { opacity: 1; } } @keyframes header-menu-submenu-fade-in { from { opacity: 0; } to { opacity: 1; } } @-webkit-keyframes header-menu-submenu-move-up { from { margin-top: -10px; } to { margin-top: 0; } } @keyframes header-menu-submenu-move-up { from { margin-top: -10px; } to { margin-top: 0; } } @-webkit-keyframes header-menu-submenu-move-down { from { margin-top: 10px; } to { margin-top: 0; } } @keyframes header-menu-submenu-move-down { from { margin-top: 10px; } to { margin-top: 0; } } @media (min-width: 992px) { .header-menu .menu-nav > .menu-item > .menu-link { background-color: none; } .header-menu .menu-nav > .menu-item > .menu-link .menu-icon.svg-icon svg g [fill] { -webkit-transition: fill 0.3s ease; transition: fill 0.3s ease; } .header-menu .menu-nav > .menu-item > .menu-link .menu-icon.svg-icon svg:hover g [fill] { -webkit-transition: fill 0.3s ease; transition: fill 0.3s ease; } .header-menu .menu-nav > .menu-item > .menu-link .menu-bullet.menu-bullet-dot > span { background-color: #5E6278; } .header-menu .menu-nav > .menu-item > .menu-link .menu-bullet.menu-bullet-line > span { background-color: #5E6278; } .header-menu .menu-nav > .menu-item > .menu-link .menu-text { color: #7E8299; } .header-menu .menu-nav > .menu-item > .menu-link .menu-arrow { color: #5E6278; } .header-menu .menu-nav > .menu-item.menu-item-active > .menu-link { background-color: #3445E5; } .header-menu .menu-nav > .menu-item.menu-item-active > .menu-link .menu-icon.svg-icon svg g [fill] { -webkit-transition: fill 0.3s ease; transition: fill 0.3s ease; } .header-menu .menu-nav > .menu-item.menu-item-active > .menu-link .menu-icon.svg-icon svg:hover g [fill] { -webkit-transition: fill 0.3s ease; transition: fill 0.3s ease; } .header-menu .menu-nav > .menu-item.menu-item-active > .menu-link .menu-bullet.menu-bullet-dot > span { background-color: #ffffff; } .header-menu .menu-nav > .menu-item.menu-item-active > .menu-link .menu-bullet.menu-bullet-line > span { background-color: #ffffff; } .header-menu .menu-nav > .menu-item.menu-item-active > .menu-link .menu-text { color: #ffffff; } .header-menu .menu-nav > .menu-item.menu-item-active > .menu-link > .menu-arrow { color: #ffffff; } .header-menu .menu-nav > .menu-item.menu-item-here > .menu-link { background-color: #3445E5; } .header-menu .menu-nav > .menu-item.menu-item-here > .menu-link .menu-icon.svg-icon svg g [fill] { -webkit-transition: fill 0.3s ease; transition: fill 0.3s ease; } .header-menu .menu-nav > .menu-item.menu-item-here > .menu-link .menu-icon.svg-icon svg:hover g [fill] { -webkit-transition: fill 0.3s ease; transition: fill 0.3s ease; } .header-menu .menu-nav > .menu-item.menu-item-here > .menu-link .menu-bullet.menu-bullet-dot > span { background-color: #ffffff; } .header-menu .menu-nav > .menu-item.menu-item-here > .menu-link .menu-bullet.menu-bullet-line > span { background-color: #ffffff; } .header-menu .menu-nav > .menu-item.menu-item-here > .menu-link .menu-text { color: #ffffff; } .header-menu .menu-nav > .menu-item.menu-item-here > .menu-link > .menu-arrow { color: #ffffff; } .header-menu .menu-nav > .menu-item:hover:not(.menu-item-here):not(.menu-item-active) > .menu-link, .header-menu .menu-nav > .menu-item.menu-item-hover:not(.menu-item-here):not(.menu-item-active) > .menu-link { background-color: #27283D; } .header-menu .menu-nav > .menu-item:hover:not(.menu-item-here):not(.menu-item-active) > .menu-link .menu-icon.svg-icon svg g [fill], .header-menu .menu-nav > .menu-item.menu-item-hover:not(.menu-item-here):not(.menu-item-active) > .menu-link .menu-icon.svg-icon svg g [fill] { -webkit-transition: fill 0.3s ease; transition: fill 0.3s ease; } .header-menu .menu-nav > .menu-item:hover:not(.menu-item-here):not(.menu-item-active) > .menu-link .menu-icon.svg-icon svg:hover g [fill], .header-menu .menu-nav > .menu-item.menu-item-hover:not(.menu-item-here):not(.menu-item-active) > .menu-link .menu-icon.svg-icon svg:hover g [fill] { -webkit-transition: fill 0.3s ease; transition: fill 0.3s ease; } .header-menu .menu-nav > .menu-item:hover:not(.menu-item-here):not(.menu-item-active) > .menu-link .menu-bullet.menu-bullet-dot > span, .header-menu .menu-nav > .menu-item.menu-item-hover:not(.menu-item-here):not(.menu-item-active) > .menu-link .menu-bullet.menu-bullet-dot > span { background-color: #ffffff; } .header-menu .menu-nav > .menu-item:hover:not(.menu-item-here):not(.menu-item-active) > .menu-link .menu-bullet.menu-bullet-line > span, .header-menu .menu-nav > .menu-item.menu-item-hover:not(.menu-item-here):not(.menu-item-active) > .menu-link .menu-bullet.menu-bullet-line > span { background-color: #ffffff; } .header-menu .menu-nav > .menu-item:hover:not(.menu-item-here):not(.menu-item-active) > .menu-link .menu-text, .header-menu .menu-nav > .menu-item.menu-item-hover:not(.menu-item-here):not(.menu-item-active) > .menu-link .menu-text { color: #ffffff; } .header-menu .menu-nav > .menu-item:hover:not(.menu-item-here):not(.menu-item-active) > .menu-link > .menu-arrow, .header-menu .menu-nav > .menu-item.menu-item-hover:not(.menu-item-here):not(.menu-item-active) > .menu-link > .menu-arrow { color: #ffffff; } .header-menu .menu-nav > .menu-item .menu-submenu { background-color: #ffffff; -webkit-box-shadow: 0px 15px 50px 0px rgba(82, 63, 105, 0.15); box-shadow: 0px 15px 50px 0px rgba(82, 63, 105, 0.15); } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item > .menu-link .menu-icon { color: #B5B5C3; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item > .menu-link .menu-bullet.menu-bullet-dot > span { background-color: #B5B5C3; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item > .menu-link .menu-text { color: #7E8299; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item.menu-item-active > .menu-link { background-color: #F3F6F9; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item.menu-item-active > .menu-link .menu-icon { color: #3445E5; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav > .menu-item.menu-item-here > .menu-link { background-color: #F3F6F9; } .header-menu .menu-nav > .menu-item:hover:not(.menu-item-here):not(.menu-item-active) > .menu-link .menu-icon.svg-icon svg g [fill] { fill: #ffffff; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content > .menu-item { border-right: 1px solid #EBEDF3; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-heading > .menu-text { color: #181C32; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-heading > .menu-icon { color: #B5B5C3; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-inner > .menu-item > .menu-link .menu-icon { color: #B5B5C3; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-inner > .menu-item > .menu-link .menu-icon.svg-icon svg g [fill] { fill: #B5B5C3; } .header-menu .menu-nav > .menu-item .menu-submenu > .menu-subnav .menu-content .menu-inner > .menu-item > .menu-link .menu-icon.svg-icon svg:hover g [fill] { fill: #B5B5C3; } } /* End of file */