.header {position: -webkit-sticky;position: sticky;top: 0;width: 100%;max-width: 1920px;z-index: 9000;margin: 0 auto; } @media (min-width: 992px) {.header {padding-bottom: 0.625rem;margin-bottom: -0.625rem;} } @media (max-width: 991.98px) {.header {border-bottom: solid 1px var(--color3);} } @media (max-width: 991.98px) {.header.animated {transition-duration: 0.15s;transition-property: background;} } .header .header-bg {width: 100%;position: absolute;height: 100%;top: 0;left: 0;right: 0;bottom: 0.625rem;backdrop-filter: blur(0.625rem); } @media (min-width: 992px) {.header .header-bg {height: calc(100% - 0.625rem);} } .header .container {z-index: 1; } .header .nav-bg {background-image: linear-gradient(to right, transparent 0%, var(--primary) 100%);background-repeat: repeat-x;width: 100%;position: absolute;height: 3.125rem;top: 0;transition: height 0.5s, background-image 0.5s; } @media (max-width: 991.98px) {.header .nav-bg {display: none;} } .header .navbar {padding: 0;flex-direction: row;flex-wrap: nowrap;background: var(--color1);transition: background 0.5s;position: relative; } @media (min-width: 992px) {.header .navbar::after {position: absolute;content: "";height: 1px;width: 100%;bottom: 0;left: 0;background: var(--primary);} } .header .navbar .container {height: 9.375rem;transition: height 0.5s;position: relative; } @media (max-width: 991.98px) {.header .navbar .container {height: 6.25rem;} } .header .navbar .row {height: 100%; } .header .navbar.active {background: var(--secondary);transition: background 0.5s; } .header .navbar.active .header-claim {top: 50%;opacity: 1;visibility: visible;transition: top 0.5s, opacity 0.5s, visibility 0.5s; } @media (min-width: 992px) {.header .navbar.active .container {height: 6.25rem;}.header .navbar.active .navbar-nav {height: 3.75rem;}.header .navbar.active .nav {height: 2.5rem;}.header .navbar.active .nav-bg {height: 2.5rem;background-image: linear-gradient(to right, transparent 45%, var(--primary) 100%);}.header .navbar.active .navbar-brand svg {width: 6.875rem;transition: width 0.5s;}.header .navbar.active .container, .header .navbar.active .navbar-nav, .header .navbar.active .nav, .header .navbar.active .nav-bg {transition: height 0.5s;}.header .navbar.active .nav-bg {transition: background-image 0.5s;} } .header .navbar-brand {height: 100%;display: flex;align-items: center;justify-content: center;text-align: center;color: var(--white);position: absolute; } .header .navbar-brand:hover {color: var(--link-hover-color); } .header .navbar-brand svg {width: 11.1875rem;height: auto;transition: width 0.5s; } @media (max-width: 991.98px) {.header .navbar-brand svg {width: auto;} } .header .header-claim {position: absolute;left: 12.5rem;top: -300px;transform: translateY(-50%);opacity: 0;visibility: hidden;transition: top 0.5s, opacity 0.5s, visibility 0.5s; } .header .header-claim h3 {text-transform: uppercase;font-weight: 300;font-size: 2.125rem;margin-bottom: 0; } .header .header-claim h3 b {font-weight: 900; } @media (max-width: 650.98px) {.header .header-claim h3 {font-size: 1.5rem;} } .header .header-nav {width: 100%;transition: height 0.5s; } @media (max-width: 991.98px) {.header .header-nav {display: flex;flex-direction: column;width: 100%;height: calc(100% - (6.25rem + 1px));overflow-y: auto;position: fixed;top: calc(6.25rem + 1px);bottom: 0;left: -100%;backdrop-filter: blur(0.625rem);border-right: solid 1px var(--color3);padding-top: 0.625rem;opacity: 0;background: var(--color1);justify-content: center;align-items: center;} } @media (max-width: 991.98px) {.header .header-nav.animated {transition-duration: 0.15s;transition-property: left, opacity, background;} } @media (max-width: 991.98px) {.header .header-nav.show {left: 0;opacity: 1;} } .header .nav {height: 3.125rem;justify-content: flex-end;width: 100%;font-weight: 700;flex-wrap: nowrap;transition: height 0.5s; } @media (max-width: 991.98px) {.header .nav {order: 2;flex-direction: column;height: auto;font-size: 1.25rem;font-weight: 900;align-items: center;} } .header .nav .social-navs {display: flex;padding: 0 0.9375rem; } .header .nav .nav-link {display: flex;align-items: center;justify-content: center;text-align: center;color: var(--black);text-transform: uppercase; } @media (max-width: 991.98px) {.header .nav .nav-link {color: var(--white);padding: 0.625rem 1.25rem;text-align: left;display: block;font-size: 1.75rem;} } .header .nav .nav-link:hover {color: var(--white); } @media (max-width: 991.98px) {.header .nav .nav-link:hover {color: var(--primary);} } .header .nav .nav-link.nav-social {padding-right: 0.3125rem;padding-left: 0.3125rem; } .header .navbar-nav {height: 6.25rem;flex-direction: row;font-size: 1.25rem;font-weight: 900;text-transform: uppercase;width: 100%;margin: 0;flex-wrap: nowrap;justify-content: flex-end;transition: height 0.5s; } @media (max-width: 991.98px) {.header .navbar-nav {order: 1;flex-direction: column;width: 100%;height: auto;align-items: center;font-size: 1.5rem;} } .header .navbar-nav .nav-item {position: relative; } .header .navbar-nav .nav-item .btn {position: absolute;top: 0;right: -3.125rem;padding: 0.5rem; } @media (min-width: 992px) {.header .navbar-nav .nav-item .btn {display: none;} } .header .navbar-nav .nav-item .btn svg {width: 2.5rem;transform: rotate(90deg);transition: transform 0.5s;color: var(--primary); } .header .navbar-nav .nav-item .btn.collapsed svg {transform: none;transition: transform 0.5s; } @media (min-width: 992px) {.header .navbar-nav .nav-item:hover .nav-dropdown {display: flex;flex-direction: column;gap: 0.625rem;} } .header .navbar-nav .nav-link {height: 100%;padding: 0 2.3125rem;display: flex;flex-direction: row;align-items: center;justify-content: center;text-align: center;color: var(--white);position: relative;} .header .navbar-nav .nav-link::after {content: " ";position: absolute;bottom: -0.28125rem;left: 50%;width: 0.5625rem;height: 0.5625rem;transform: translateX(-50%) rotate(45deg);background: var(--primary); } .header .navbar-nav .nav-link.btn-primary {color: #181817; } .header .navbar-nav .nav-link.btn-primary:hover {color: var(--black); } @media (max-width: 1299.98px) {.header .navbar-nav .nav-link {padding: 0 1.4375rem;} } @media (max-width: 991.98px) {.header .navbar-nav .nav-link {width: 100%;padding: 0.625rem 1.25rem;text-align: left;display: block;height: auto;font-size: 1.75rem;}.header .navbar-nav .nav-link::before {content: none;}.header .navbar-nav .nav-link::after {content: none;} } .header .navbar-nav .nav-link:hover {color: var(--link-hover-color); } .header .navbar-nav .nav-dropdown {white-space: nowrap;list-style: none;padding: 1.25rem;display: none;text-align: center; } @media (min-width: 992px) {.header .navbar-nav .nav-dropdown {position: absolute;bottom: -0.625rem;left: 50%;transform: translateY(100%) translateX(-50%);background: rgba(29, 29, 29, 0.7);backdrop-filter: blur(0.625rem);}.header .navbar-nav .nav-dropdown::before {content: "";position: absolute;top: 0;left: 50%;width: 2px;height: 0.625rem;background: var(--primary);transform: translateY(-100%) translateX(-50%);z-index: 3;}.header .navbar-nav .nav-dropdown::after {content: "";position: absolute;top: 0;left: 0;height: 0.625rem;width: 100%;background: transparent;transform: translateY(-100%);z-index: 2;}.header .navbar-nav .nav-dropdown:hover a {text-decoration: none;}.header .navbar-nav .nav-dropdown.show-breadcrumb {bottom: -3.125rem;}.header .navbar-nav .nav-dropdown.show-breadcrumb::before {height: 3.125rem;}.header .navbar-nav .nav-dropdown.show-breadcrumb::after {height: 3.125rem;} } @media (max-width: 991.98px) {.header .navbar-nav .nav-dropdown.show {display: flex;flex-direction: column;gap: 0.625rem;} } .header .btn-menu {height: 6.25rem;width: auto;aspect-ratio: 1/1;border: 0;border-left: solid 1px var(--color3);color: var(--primary);display: none;box-shadow: none; } @media (max-width: 991.98px) {.header .btn-menu {display: block;} } .header .btn-menu:hover {color: var(--link-hover-color); } .header .btn-menu svg {width: 2.5rem;height: auto; } .header .btn-menu.collapsed {background-color: var(--primary); } .header .btn-menu.collapsed svg {color: var(--secondary); } .heading {position: relative;margin: 0 auto;width: 100%;height: 33.125rem;max-width: 1920px;margin-top: -9.375rem;display: flex;align-items: center;justify-content: center;padding-top: 6.25rem; } .heading .img-fluid {position: absolute;left: 0;top: 0;bottom: 0;right: 0;width: 100%;height: 100%;object-fit: cover; } .heading h1.title, .heading .h1.title {background: #D8D8D8;padding: 1.875rem 2.5rem;color: var(--black);font-style: normal;left: auto;transform: none;margin-top: 0; } .heading h1.title::before, .heading .h1.title::before {content: none; } .heading h1.title::after, .heading .h1.title::after {content: none; }