@import url(customizer-css.php);
@keyframes fade-in {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-family-main);
    font-weight: var(--main-font-weight);
    color: var(--global-text-color);
    opacity: var(--transparenz);
}

:where(h1, .h1) {
    font-size: var(--headline-h1-size);
    font-weight: var(--headline-h1-weight);
    color: var(--headline-h1-color);
    font-style: var(--headline-h1-style);
    line-height: var(--headline-h1-line-height);
    font-family: var(--font-family-headline, var(--font-family-main));
    letter-spacing: var(--headline-h1-spacing);
}

:where(h2, .h2) {
    font-size: var(--headline-h2-size);
    font-weight: var(--headline-h2-weight);
    color: var(--headline-h2-color);
    font-style: var(--headline-h2-style);
    line-height: var(--headline-h2-line-height);
    font-family: var(--font-family-headline, var(--font-family-main));
    letter-spacing: var(--headline-h2-spacing);
}

:where(h3, .h3) {
    font-size: var(--headline-h3-size);
    font-weight: var(--headline-h3-weight);
    color: var(--headline-h3-color);
    font-style: var(--headline-h3-style);
    line-height: var(--headline-h3-line-height);
    font-family: var(--font-family-headline, var(--font-family-main));
    letter-spacing: var(--headline-h3-spacing);
}

:where(h4, .h4) {
    font-size: var(--headline-h4-size);
    font-weight: var(--headline-h4-weight);
    color: var(--headline-h4-color);
    font-style: var(--headline-h4-style);
    line-height: var(--headline-h4-line-height);
    font-family: var(--font-family-headline, var(--font-family-main));
    letter-spacing: var(--headline-h4-spacing);
}

:where(h5, .h5) {
    font-size: var(--headline-h5-size);
    font-weight: var(--headline-h5-weight);
    color: var(--headline-h5-color);
    font-style: var(--headline-h5-style);
    line-height: var(--headline-h5-line-height);
    font-family: var(--font-family-headline, var(--font-family-main));
    letter-spacing: var(--headline-h5-spacing);
}

:where(h6, .h6) {
    font-size: var(--headline-h6-size);
    font-weight: var(--headline-h6-weight);
    color: var(--headline-h6-color);
    font-style: var(--headline-h6-style);
    line-height: var(--headline-h6-line-height);
    font-family: var(--font-family-headline, var(--font-family-main));
    letter-spacing: var(--headline-h6-spacing);
}

.hl-widget {
    font-size: var(--headline-widget-size);
    font-weight: var(--headline-widget-weight);
    color: var(--headline-widget-color);
    font-style: var(--headline-widget-style);
    font-family: var(--font-family-headline, var(--font-family-main));
    line-height: var(--headline-widget-line-height);
    letter-spacing: var(--headline-widget-spacing);
}

h1:not(:first-child),
h2:not(:first-child),
h3:not(:first-child),
h4:not(:first-child),
h5:not(:first-child),
h6:not(:first-child) {
    margin-top: 3rem;
}

p {
    font-size: var(--p-fs);
    line-height: var(--p-lh);
    font-weight: var(--p-fw);
    letter-spacing: var(--p-ls);
    margin: 1rem 0;
}

strong {
    color: var(--strong-color);
    font-weight: var(--strong-fw);
}

p:is(:first-child),
ul:is(:first-child),
ol:is(:first-child) {
    margin-top: 0 !important;
}

p:is(:last-child),
ul:is(:last-child),
ol:is(:last-child):where(ul:is(:last-child)) {
    margin-bottom: 0 !important;
}

.m-0 {
    margin: 0 !important;
}

.m-1 {
    margin: 0.25rem !important;
}

.m-2 {
    margin: 0.5rem !important;
}

.m-3 {
    margin: 1rem !important;
}

.m-4 {
    margin: 1.5rem !important;
}

.m-5 {
    margin: 3rem !important;
}

.m-auto {
    margin: auto !important;
}

.m-0 {
    margin: 0 !important;
}

.p-0 {
    padding: 0 !important;
}

.m-1 {
    margin: 0.25rem !important;
}

.p-1 {
    padding: 0.25rem !important;
}

.m-2 {
    margin: 0.5rem !important;
}

.p-2 {
    padding: 0.5rem !important;
}

.m-3 {
    margin: 1rem !important;
}

.p-3 {
    padding: 1rem !important;
}

.m-4 {
    margin: 1.5rem !important;
}

.p-4 {
    padding: 1.5rem !important;
}

.m-5 {
    margin: 3rem !important;
}

.p-5 {
    padding: 3rem !important;
}

.m-auto {
    margin: auto !important;
}

.p-auto {
    padding: auto !important;
}

.m-0 {
    margin: 0 !important;
}

.p-0 {
    padding: 0 !important;
}

.m-1 {
    margin: 0.25rem !important;
}

.p-1 {
    padding: 0.25rem !important;
}

.m-2 {
    margin: 0.5rem !important;
}

.p-2 {
    padding: 0.5rem !important;
}

.m-3 {
    margin: 1rem !important;
}

.p-3 {
    padding: 1rem !important;
}

.m-4 {
    margin: 1.5rem !important;
}

.p-4 {
    padding: 1.5rem !important;
}

.m-5 {
    margin: 3rem !important;
}

.p-5 {
    padding: 3rem !important;
}

.m-auto {
    margin: auto !important;
}

.mt-0 {
    margin-top: 0 !important;
}

.mb-0 {
    margin-bottom: 0 !important;
}

.ml-0 {
    margin-left: 0 !important;
}

.mr-0 {
    margin-right: 0 !important;
}

.mt-1 {
    margin-top: 0.25rem !important;
}

.mb-1 {
    margin-bottom: 0.25rem !important;
}

.ml-1 {
    margin-left: 0.25rem !important;
}

.mr-1 {
    margin-right: 0.25rem !important;
}

.mt-2 {
    margin-top: 0.5rem !important;
}

.mb-2 {
    margin-bottom: 0.5rem !important;
}

.ml-2 {
    margin-left: 0.5rem !important;
}

.mr-2 {
    margin-right: 0.5rem !important;
}

.mt-3 {
    margin-top: 1rem !important;
}

.mb-3 {
    margin-bottom: 1rem !important;
}

.ml-3 {
    margin-left: 1rem !important;
}

.mr-3 {
    margin-right: 1rem !important;
}

.mt-4 {
    margin-top: 1.5rem !important;
}

.mb-4 {
    margin-bottom: 1.5rem !important;
}

.ml-4 {
    margin-left: 1.5rem !important;
}

.mr-4 {
    margin-right: 1.5rem !important;
}

.mt-5 {
    margin-top: 3rem !important;
}

.mb-5 {
    margin-bottom: 3rem !important;
}

.ml-5 {
    margin-left: 3rem !important;
}

.mr-5 {
    margin-right: 3rem !important;
}

.mt-auto {
    margin-top: auto !important;
}

.mb-auto {
    margin-bottom: auto !important;
}

.ml-auto {
    margin-left: auto !important;
}

.mr-auto {
    margin-right: auto !important;
}

.mt-0 {
    margin-top: 0 !important;
}

.pt-0 {
    padding-top: 0 !important;
}

.mb-0 {
    margin-bottom: 0 !important;
}

.pb-0 {
    padding-bottom: 0 !important;
}

.ml-0 {
    margin-left: 0 !important;
}

.pl-0 {
    padding-left: 0 !important;
}

.mr-0 {
    margin-right: 0 !important;
}

.pr-0 {
    padding-right: 0 !important;
}

.mt-1 {
    margin-top: 0.25rem !important;
}

.pt-1 {
    padding-top: 0.25rem !important;
}

.mb-1 {
    margin-bottom: 0.25rem !important;
}

.pb-1 {
    padding-bottom: 0.25rem !important;
}

.ml-1 {
    margin-left: 0.25rem !important;
}

.pl-1 {
    padding-left: 0.25rem !important;
}

.mr-1 {
    margin-right: 0.25rem !important;
}

.pr-1 {
    padding-right: 0.25rem !important;
}

.mt-2 {
    margin-top: 0.5rem !important;
}

.pt-2 {
    padding-top: 0.5rem !important;
}

.mb-2 {
    margin-bottom: 0.5rem !important;
}

.pb-2 {
    padding-bottom: 0.5rem !important;
}

.ml-2 {
    margin-left: 0.5rem !important;
}

.pl-2 {
    padding-left: 0.5rem !important;
}

.mr-2 {
    margin-right: 0.5rem !important;
}

.pr-2 {
    padding-right: 0.5rem !important;
}

.mt-3 {
    margin-top: 1rem !important;
}

.pt-3 {
    padding-top: 1rem !important;
}

.mb-3 {
    margin-bottom: 1rem !important;
}

.pb-3 {
    padding-bottom: 1rem !important;
}

.ml-3 {
    margin-left: 1rem !important;
}

.pl-3 {
    padding-left: 1rem !important;
}

.mr-3 {
    margin-right: 1rem !important;
}

.pr-3 {
    padding-right: 1rem !important;
}

.mt-4 {
    margin-top: 1.5rem !important;
}

.pt-4 {
    padding-top: 1.5rem !important;
}

.mb-4 {
    margin-bottom: 1.5rem !important;
}

.pb-4 {
    padding-bottom: 1.5rem !important;
}

.ml-4 {
    margin-left: 1.5rem !important;
}

.pl-4 {
    padding-left: 1.5rem !important;
}

.mr-4 {
    margin-right: 1.5rem !important;
}

.pr-4 {
    padding-right: 1.5rem !important;
}

.mt-5 {
    margin-top: 3rem !important;
}

.pt-5 {
    padding-top: 3rem !important;
}

.mb-5 {
    margin-bottom: 3rem !important;
}

.pb-5 {
    padding-bottom: 3rem !important;
}

.ml-5 {
    margin-left: 3rem !important;
}

.pl-5 {
    padding-left: 3rem !important;
}

.mr-5 {
    margin-right: 3rem !important;
}

.pr-5 {
    padding-right: 3rem !important;
}

.mt-auto {
    margin-top: auto !important;
}

.mb-auto {
    margin-bottom: auto !important;
}

.ml-auto {
    margin-left: auto !important;
}

.mr-auto {
    margin-right: auto !important;
}

.mx-0 {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.px-0 {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.my-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.py-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.mx-1 {
    margin-left: 0.25rem !important;
    margin-right: 0.25rem !important;
}

.px-1 {
    padding-left: 0.25rem !important;
    padding-right: 0.25rem !important;
}

.my-1 {
    margin-top: 0.25rem !important;
    margin-bottom: 0.25rem !important;
}

.py-1 {
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
}

.mx-2 {
    margin-left: 0.5rem !important;
    margin-right: 0.5rem !important;
}

.px-2 {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
}

.my-2 {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
}

.py-2 {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}

.mx-3 {
    margin-left: 1rem !important;
    margin-right: 1rem !important;
}

.px-3 {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
}

.my-3 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
}

.py-3 {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
}

.mx-4 {
    margin-left: 1.5rem !important;
    margin-right: 1.5rem !important;
}

.px-4 {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
}

.my-4 {
    margin-top: 1.5rem !important;
    margin-bottom: 1.5rem !important;
}

.py-4 {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
}

.mx-5 {
    margin-left: 3rem !important;
    margin-right: 3rem !important;
}

.px-5 {
    padding-left: 3rem !important;
    padding-right: 3rem !important;
}

.my-5 {
    margin-top: 3rem !important;
    margin-bottom: 3rem !important;
}

.py-5 {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
}

.mx-auto {
    margin-left: auto !important;
    margin-right: auto !important;
}

.my-auto {
    margin-top: auto !important;
    margin-bottom: auto !important;
}

.container.flex {
    display: flex;
    flex-wrap: wrap;
}

.w-100 {
    flex: 0 0 100%;
}

.wrapper {
    margin-inline: auto;
    max-width: var(--container-width);
}

:is(section, .container) {
    padding-left: var(--default-padding);
    padding-right: var(--default-padding);
}

.align-self-center {
    align-self: center;
}

[class^=col] {
    flex-basis: 100%;
    flex-grow: 1;
    max-width: 100%;
    width: 100%;
    transition: all var(--main-transition) ease-in-out;
    padding: var(--default-padding) var(--default-padding) var(--default-padding) var(--default-padding);
    flex: 1 0 0%;
}

.col-1 {
    flex: 0 0 8.3333333333%;
}

.col-2 {
    flex: 0 0 16.6666666667%;
}

.col-3 {
    flex: 0 0 25%;
}

.col-4 {
    flex: 0 0 33.3333333333%;
}

.col-5 {
    flex: 0 0 41.6666666667%;
}

.col-6 {
    flex: 0 0 50%;
}

.col-7 {
    flex: 0 0 58.3333333333%;
}

.col-8 {
    flex: 0 0 66.6666666667%;
}

.col-9 {
    flex: 0 0 75%;
}

.col-10 {
    flex: 0 0 83.3333333333%;
}

.col-11 {
    flex: 0 0 91.6666666667%;
}

.col-12 {
    flex: 0 0 100%;
}

.offset-1 {
    margin-left: 8.3333333333%;
}

.offset-2 {
    margin-left: 16.6666666667%;
}

.offset-3 {
    margin-left: 25%;
}

.offset-4 {
    margin-left: 33.3333333333%;
}

.offset-5 {
    margin-left: 41.6666666667%;
}

.offset-6 {
    margin-left: 50%;
}

.offset-7 {
    margin-left: 58.3333333333%;
}

.offset-8 {
    margin-left: 66.6666666667%;
}

.offset-9 {
    margin-left: 75%;
}

.offset-10 {
    margin-left: 83.3333333333%;
}

.offset-11 {
    margin-left: 91.6666666667%;
}

.offset-12 {
    margin-left: 100%;
}

.justify-content-center {
    justify-content: center;
}

.justify-content-end {
    justify-content: end;
}

.justify-content-flex-start {
    justify-content: flex-start;
}

.align-items-end {
    align-items: end;
}

.align-items-flex-start {
    align-items: flex-start;
}

.align-items-center {
    align-items: center;
}

.logo img {
    height: calc(var(--header-height) - 2rem);
    width: auto;
}

.container[style],
section[style] {
    background-color: var(--bg-clr, transparent);
    background-image: var(--bg-img, inherit);
    padding: var(--padding-main, 0 var(--default-padding) 0 var(--default-padding));
}

.row[style] {
    padding: var(--padding-row, 0);
    background-color: var(--bg-clr, transparent);
}

.col[style] {
    padding: var(--padding-col, var(--default-padding) var(--default-padding) var(--default-padding) var(--default-padding));
    background-color: var(--bg-clr, transparent);
    background-image: inherit;
}

.row {
    --gutter-x: 1rem;
    --gutter-y: 1rem;
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    margin-right: calc(-1 * var(--default-padding));
    margin-left: calc(-1 * var(--default-padding));
}

.row[class*=gx-] {
    margin-right: calc(var(--gutter-x) * -0.5);
    margin-left: calc(var(--gutter-x) * -0.5);
}

.row[class*=gx-]>* {
    padding-right: calc(var(--gutter-x) * 0.5);
    padding-left: calc(var(--gutter-x) * 0.5);
}

.row[class*=gy-] {
    margin-top: calc(var(--gutter-x) * -0.5);
    margin-bottom: calc(var(--gutter-x) * -0.5);
}

.row[class*=gy-]>* {
    padding-top: calc(var(--gutter-x) * 0.5);
    padding-bottom: calc(var(--gutter-x) * 0.5);
}

.mx-n3 .col {
    margin-left: -1rem !important;
    margin-right: -1rem !important;
}

:where(main, footer) ul {
    padding-left: var(--ul-ml);
    margin: 1rem 0 1rem;
}

:where(main, footer) ol {
    padding-left: var(--ol-ml);
    margin: 1rem 0 1rem;
}

main ul li {
    color: var(--ul-color);
    font-size: var(--ul-fs);
    list-style-type: var(--ul-list-type);
}

main ul li::marker {
    color: var(--ul-marker-color);
}

main ol li {
    color: var(--ol-color);
    font-size: var(--ol-fs);
    list-style-type: var(--ol-list-type);
}

main ol li::marker {
    color: var(--ol-marker-color);
}

.inline-flex {
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    padding: 0 1rem;
}

#mobile-btn::before {
    content: "\f0c9";
    font-family: var(--font-awesome);
    display: inline-flex;
    align-items: center;
    height: 100%;
}

footer {
    position: relative;
    background-image: var(--footer-bg-img);
    background-position: var(--_footer-bg-img-pos);
    background-size: cover;
    background-attachment: fixed;
    z-index: 1;
    color: var(--footer-p-clr);
}

footer .first {
    background-color: var(--footer-bg-clr, transparent);
}

footer .last {
    background-color: var(--footer-bg-clr-last, transparent);
}

footer ul {
    padding-left: 0;
}

footer ul li {
    list-style: none;
}

footer a {
    color: var(--footer-href-clr);
    transition: color var(--main-transition) ease-in-out;
}

footer a:hover {
    color: var(--footer-href-clr-hover);
}

.cr {
    text-align: center;
}

:where(main) a {
    color: var(--href-clr);
    transition: all var(--main-transition) ease-in-out;
    -webkit-text-decoration: var(--href-underline-underline) var(--href-underline-style) underline var(--href-underline-clr);
    text-decoration: var(--href-underline-underline) var(--href-underline-style) underline var(--href-underline-clr);
    text-underline-offset: var(--href-underline-offset);
    font-weight: var(--href-weight);
}

:where(main) a:where(:hover, :focus) {
    color: var(--href-clr-hover);
    -webkit-texttext-decoration: var(--href-underline-underline) var(--href-underline-style) underline var(--href-underline-clr-hover);
    text-decoration: var(--href-underline-underline) var(--href-underline-style) underline var(--href-underline-clr-hover);
    text-underline-offset: var(--href-underline-offset-hover);
}

header :where(.container, .row, .wrapper, nav) {
    height: 100%;
}

header {
    z-index: 6;
    position: relative;
    height: var(--header-height);
    background-color: var(--header-bg-color);
    position: var(--header-position);
    width: 100%;
}

body.overflow-h {
    overflow: hidden;
}


/*NAVIGATION*/

#mobile-btn {
    color: var(--header-mobile-btn-color);
    font-weight: 600;
    z-index: 100;
    margin-left: auto;
    font-size: 26px;
    cursor: pointer;
}

#topnav {
    position: absolute;
    display: flex;
    top: 100%;
    right: 0;
    max-width: 360px;
    width: 100%;
    background-color: var(--header-nav-bg-color);
    height: calc(100svh - (var(--header-height) + 40px));
    opacity: 0;
    transform: scalex(0);
    transform-origin: top right;
    z-index: 2;
    transition: all 200ms ease-in;
}

#topnav ul {
    display: flex;
    gap: 0;
    z-index: 3;
    flex-direction: column;
    width: 100%;
    background-color: var(--header-nav-bg-color);
    opacity: 0;
    padding-top: 40px;
    overflow-y: scroll;
    scrollbar-width: none
}

#topnav a {
    padding: 0.5rem 2.5rem .5rem 1rem;
    color: var(--header-mobile-href-color);
    font-size: var(--header-href-fs-mobile);
    font-weight: var(--header-href-weight);
    width: 100%;
    transition: color 250ms ease-in-out;
}

#topnav.active-nav {
    transform: scalex(1);
    opacity: 1;
}

#topnav.active-nav ul {
    opacity: 1;
    transition: all 200ms ease-in 200ms;
}

#topnav .sub-menu {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    z-index: 2;
    padding-top: 40px;
    opacity: 0;
    transform: scalex(0);
    transform-origin: top right;
    box-shadow: none;
    transition: all 250ms ease-in, opacity 200ms ease-in 50ms;
}

#topnav.active-nav .sub-menu {
    opacity: 0;
}

#topnav .sub-menu.show {
    opacity: 1;
    transform: scalex(1);
    transition: all 200ms ease-in, opacity 200ms ease-in 50ms;
}

#topnav ul li {
    position: relative;
    display: inline-flex;
    align-content: center;
}

#topnav ul li.menu-item-has-children .toggler {
    position: absolute;
    height: 100%;
    width: 40px;
    top: 0;
    right: 0;
    z-index: 1;
}

#topnav li.menu-item-has-children::after {
    content: '\f078';
    font-family: var(--font-awesome);
    color: var(--header-child-element-color);
    position: absolute;
    right: 1.5rem;
    top: 0;
    font-size: var(--header-href-fs-mobile);
    height: 100%;
    display: inline-flex;
    align-items: end;
    transform: rotate(-90deg);
}

#topnav ul .sub-menu li {
    width: 100%;
    min-width: auto;
    padding: 0;
}

.back {
    position: absolute;
    top: .5rem;
    right: 0;
    color: var(--white);
    font-size: 22px;
    padding: 0 1rem;
}


/*SOCIALBAR*/

#socialbar {
    position: fixed;
    right: 0;
    top: 50%;
    transform: translateY(-50%) translateX(100%);
    z-index: 5;
    transition: transform 250ms ease-in-out;
    box-shadow: var(--social-bs-x) var(--social-bs-y) var(--social-bs-blur) var(--social-bs-color);
    z-index: 6;
}

#socialbar:is(:hover, a:focus) {
    transform: translateY(-50%) translateX(0%);
}

#socialbar ul {
    display: flex;
    flex-direction: column;
}

#socialbar ul li {
    position: relative;
    list-style: none;
    font-size: var(--social-text-size);
    order: var(--social-order, 20);
}

#socialbar i {
    position: absolute;
    left: -40px;
    height: 100%;
    width: 40px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: var(--social-icon-size);
}

#socialbar a {
    padding: 0.5em 1.5em 0.5em 1em;
    font-weight: var(--social-text-weight);
    display: block;
}

#socialbar :where(ul li, i, a) {
    color: var(--social-text-color);
    background-color: var(--social-bg-color);
    transition: all 250ms ease-in-out;
}

#socialbar li:is(:hover, a:focus),
#socialbar li:is(:hover, :focus) a {
    background-color: var(--social-bg-color-hover);
    color: var(--social-text-color-hover);
}

#socialbar li:is(:hover, :focus) i {
    background-color: var(--social-icon-bg-color-hover);
    color: var(--social-icon-text-color-hover);
}

#socialbar ul li:first-of-type>i {
    border-top-left-radius: var(--rb);
}

#socialbar ul li:last-of-type>i {
    border-bottom-left-radius: var(--rb);
}

.none {
    display: none !important;
}

.swiper-slide img {
    object-fit: cover;
    object-position: revert-layer;
    position: relative;
    height: 100%;
    width: 100%;
}

@media (min-width: 0) {
    .col-xs-1 {
        flex: 0 0 8.3333333333%;
    }
    .col-xs-2 {
        flex: 0 0 16.6666666667%;
    }
    .col-xs-3 {
        flex: 0 0 25%;
    }
    .col-xs-4 {
        flex: 0 0 33.3333333333%;
    }
    .col-xs-5 {
        flex: 0 0 41.6666666667%;
    }
    .col-xs-6 {
        flex: 0 0 50%;
    }
    .col-xs-7 {
        flex: 0 0 58.3333333333%;
    }
    .col-xs-8 {
        flex: 0 0 66.6666666667%;
    }
    .col-xs-9 {
        flex: 0 0 75%;
    }
    .col-xs-10 {
        flex: 0 0 83.3333333333%;
    }
    .col-xs-11 {
        flex: 0 0 91.6666666667%;
    }
    .col-xs-12 {
        flex: 0 0 100%;
    }
    .offset-xs-1 {
        margin-left: 8.3333333333%;
    }
    .offset-xs-2 {
        margin-left: 16.6666666667%;
    }
    .offset-xs-3 {
        margin-left: 25%;
    }
    .offset-xs-4 {
        margin-left: 33.3333333333%;
    }
    .offset-xs-5 {
        margin-left: 41.6666666667%;
    }
    .offset-xs-6 {
        margin-left: 50%;
    }
    .offset-xs-7 {
        margin-left: 58.3333333333%;
    }
    .offset-xs-8 {
        margin-left: 66.6666666667%;
    }
    .offset-xs-9 {
        margin-left: 75%;
    }
    .offset-xs-10 {
        margin-left: 83.3333333333%;
    }
    .offset-xs-11 {
        margin-left: 91.6666666667%;
    }
    .offset-xs-12 {
        margin-left: 100%;
    }
}

@media (min-width: 576px) {
    .col-sm-1 {
        flex: 0 0 8.3333333333%;
    }
    .col-sm-2 {
        flex: 0 0 16.6666666667%;
    }
    .col-sm-3 {
        flex: 0 0 25%;
    }
    .col-sm-4 {
        flex: 0 0 33.3333333333%;
    }
    .col-sm-5 {
        flex: 0 0 41.6666666667%;
    }
    .col-sm-6 {
        flex: 0 0 50%;
    }
    .col-sm-7 {
        flex: 0 0 58.3333333333%;
    }
    .col-sm-8 {
        flex: 0 0 66.6666666667%;
    }
    .col-sm-9 {
        flex: 0 0 75%;
    }
    .col-sm-10 {
        flex: 0 0 83.3333333333%;
    }
    .col-sm-11 {
        flex: 0 0 91.6666666667%;
    }
    .col-sm-12 {
        flex: 0 0 100%;
    }
    .offset-sm-1 {
        margin-left: 8.3333333333%;
    }
    .offset-sm-2 {
        margin-left: 16.6666666667%;
    }
    .offset-sm-3 {
        margin-left: 25%;
    }
    .offset-sm-4 {
        margin-left: 33.3333333333%;
    }
    .offset-sm-5 {
        margin-left: 41.6666666667%;
    }
    .offset-sm-6 {
        margin-left: 50%;
    }
    .offset-sm-7 {
        margin-left: 58.3333333333%;
    }
    .offset-sm-8 {
        margin-left: 66.6666666667%;
    }
    .offset-sm-9 {
        margin-left: 75%;
    }
    .offset-sm-10 {
        margin-left: 83.3333333333%;
    }
    .offset-sm-11 {
        margin-left: 91.6666666667%;
    }
    .offset-sm-12 {
        margin-left: 100%;
    }
}

@media (min-width: 768px) {
    .col-md-1 {
        flex: 0 0 8.3333333333%;
    }
    .col-md-2 {
        flex: 0 0 16.6666666667%;
    }
    .col-md-3 {
        flex: 0 0 25%;
    }
    .col-md-4 {
        flex: 0 0 33.3333333333%;
    }
    .col-md-5 {
        flex: 0 0 41.6666666667%;
    }
    .col-md-6 {
        flex: 0 0 50%;
    }
    .col-md-7 {
        flex: 0 0 58.3333333333%;
    }
    .col-md-8 {
        flex: 0 0 66.6666666667%;
    }
    .col-md-9 {
        flex: 0 0 75%;
    }
    .col-md-10 {
        flex: 0 0 83.3333333333%;
    }
    .col-md-11 {
        flex: 0 0 91.6666666667%;
    }
    .col-md-12 {
        flex: 0 0 100%;
    }
    .offset-md-1 {
        margin-left: 8.3333333333%;
    }
    .offset-md-2 {
        margin-left: 16.6666666667%;
    }
    .offset-md-3 {
        margin-left: 25%;
    }
    .offset-md-4 {
        margin-left: 33.3333333333%;
    }
    .offset-md-5 {
        margin-left: 41.6666666667%;
    }
    .offset-md-6 {
        margin-left: 50%;
    }
    .offset-md-7 {
        margin-left: 58.3333333333%;
    }
    .offset-md-8 {
        margin-left: 66.6666666667%;
    }
    .offset-md-9 {
        margin-left: 75%;
    }
    .offset-md-10 {
        margin-left: 83.3333333333%;
    }
    .offset-md-11 {
        margin-left: 91.6666666667%;
    }
    .offset-md-12 {
        margin-left: 100%;
    }
}

@media (min-width: 992px) {
    .col-lg-1 {
        flex: 0 0 8.3333333333%;
    }
    .col-lg-2 {
        flex: 0 0 16.6666666667%;
    }
    .col-lg-3 {
        flex: 0 0 25%;
    }
    .col-lg-4 {
        flex: 0 0 33.3333333333%;
    }
    .col-lg-5 {
        flex: 0 0 41.6666666667%;
    }
    .col-lg-6 {
        flex: 0 0 50%;
    }
    .col-lg-7 {
        flex: 0 0 58.3333333333%;
    }
    .col-lg-8 {
        flex: 0 0 66.6666666667%;
    }
    .col-lg-9 {
        flex: 0 0 75%;
    }
    .col-lg-10 {
        flex: 0 0 83.3333333333%;
    }
    .col-lg-11 {
        flex: 0 0 91.6666666667%;
    }
    .col-lg-12 {
        flex: 0 0 100%;
    }
    .offset-lg-1 {
        margin-left: 8.3333333333%;
    }
    .offset-lg-2 {
        margin-left: 16.6666666667%;
    }
    .offset-lg-3 {
        margin-left: 25%;
    }
    .offset-lg-4 {
        margin-left: 33.3333333333%;
    }
    .offset-lg-5 {
        margin-left: 41.6666666667%;
    }
    .offset-lg-6 {
        margin-left: 50%;
    }
    .offset-lg-7 {
        margin-left: 58.3333333333%;
    }
    .offset-lg-8 {
        margin-left: 66.6666666667%;
    }
    .offset-lg-9 {
        margin-left: 75%;
    }
    .offset-lg-10 {
        margin-left: 83.3333333333%;
    }
    .offset-lg-11 {
        margin-left: 91.6666666667%;
    }
    .offset-lg-12 {
        margin-left: 100%;
    }
    /*NAVIGATION*/
    .toggler,
    .back,
    #mobile-btn {
        display: none;
    }
    #topnav {
        position: relative;
        display: flex;
        max-width: inherit;
        background-color: inherit;
        top: inherit;
        height: var(--nav-height, 100%);
        opacity: 1;
        transform: scalex(1);
        padding: 0;
        margin-left: auto;
        transition: opacity 200ms ease-in 500ms;
    }
    #topnav a {
        width: inherit;
        padding: .5rem 1rem;
        font-size: var(--header-href-fs);
        color: var(--header-href-clr);
        height: 100%;
        display: flex;
        align-items: center;
    }
    #topnav a:is(:hover, :focus) {
        color: var(--header-href-hover);
    }
    #topnav ul {
        margin-left: auto;
        flex-direction: row;
        padding: 0;
        opacity: 1;
        overflow-y: inherit;
        box-shadow: none;
        width: auto;
        background-color: inherit;
    }
    #topnav ul .sub-menu {
        position: absolute;
        overflow-y: inherit;
        flex-direction: column;
        opacity: 0;
        height: auto;
        transform: scalex(1);
        background-color: var(--header-sub-menu-color);
        display: none;
        padding: var(--sub-pt, inherit) var(--sub-pr, inherit) var(--sub-pb, inherit) var(--sub-pl, inherit);
        top: 100%;
        left: 0;
        animation: fade-in 250ms ease-out;
        border-bottom-left-radius: var(--ul-br-bl, none);
        border-bottom-right-radius: var(--ul-br-br, none);
        border-top-left-radius: var(--ul-br-tl, none);
        border-top-right-radius: var(--ul-br-tr, none);
        box-shadow: var(--menu-bs-x) var(--menu-bs-y) var(--menu-bs-blur) var(--menu-bs-color);
    }
    #topnav ul li {
        display: block;
    }
    #topnav ul .sub-menu .sub-menu {
        top: 0;
        left: 100%;
    }
    #topnav ul .sub-menu .sub-menu .sub-menu {
        left: 0;
        transform: translateX(-80%);
    }
    #topnav ul li:hover>.sub-menu {
        display: block;
        opacity: 1;
    }
    #topnav ul .sub-menu li {
        min-width: max-content;
        transition: all 250ms ease-in-out;
    }
    #topnav ul .sub-menu li a {
        padding: .5rem 2rem .5rem 1rem;
        color: var( --header-sub-href-color);
    }
    #topnav ul .sub-menu li a:is(:hover, :focus) {
        color: var(--header-sub-href-hover-color);
    }
    #topnav ul>li:hover {
        background-color: var(--menu-li-bg-hover);
    }
    #topnav ul .sub-menu>li:hover {
        background-color: var(--header-sub-menu-hover-color);
    }
    #topnav li.menu-item-has-children::after {
        right: 0;
        display: var(--icon-desktop, none);
        align-items: center;
        font-size: calc(var(--header-href-fs) - 3px);
        transform: rotate(0deg);
        color: var(--header-icon-color);
        width: 2rem;
        justify-content: center;
    }
    #topnav li.menu-item-has-children a {
        padding: .5rem var(--menu-icon-extra-padding, 1rem) .5rem 1rem;
    }
    #topnav .sub-menu>.menu-item-has-children::after {
        transform: rotate(-90deg);
        right: 0;
    }
}

@media (min-width: 1200px) {
    .col-xl-1 {
        flex: 0 0 8.3333333333%;
    }
    .col-xl-2 {
        flex: 0 0 16.6666666667%;
    }
    .col-xl-3 {
        flex: 0 0 25%;
    }
    .col-xl-4 {
        flex: 0 0 33.3333333333%;
    }
    .col-xl-5 {
        flex: 0 0 41.6666666667%;
    }
    .col-xl-6 {
        flex: 0 0 50%;
    }
    .col-xl-7 {
        flex: 0 0 58.3333333333%;
    }
    .col-xl-8 {
        flex: 0 0 66.6666666667%;
    }
    .col-xl-9 {
        flex: 0 0 75%;
    }
    .col-xl-10 {
        flex: 0 0 83.3333333333%;
    }
    .col-xl-11 {
        flex: 0 0 91.6666666667%;
    }
    .col-xl-12 {
        flex: 0 0 100%;
    }
    .offset-xl-1 {
        margin-left: 8.3333333333%;
    }
    .offset-xl-2 {
        margin-left: 16.6666666667%;
    }
    .offset-xl-3 {
        margin-left: 25%;
    }
    .offset-xl-4 {
        margin-left: 33.3333333333%;
    }
    .offset-xl-5 {
        margin-left: 41.6666666667%;
    }
    .offset-xl-6 {
        margin-left: 50%;
    }
    .offset-xl-7 {
        margin-left: 58.3333333333%;
    }
    .offset-xl-8 {
        margin-left: 66.6666666667%;
    }
    .offset-xl-9 {
        margin-left: 75%;
    }
    .offset-xl-10 {
        margin-left: 83.3333333333%;
    }
    .offset-xl-11 {
        margin-left: 91.6666666667%;
    }
    .offset-xl-12 {
        margin-left: 100%;
    }
}

@media (min-width: 1400px) {
    .col-xxl-1 {
        flex: 0 0 8.3333333333%;
    }
    .col-xxl-2 {
        flex: 0 0 16.6666666667%;
    }
    .col-xxl-3 {
        flex: 0 0 25%;
    }
    .col-xxl-4 {
        flex: 0 0 33.3333333333%;
    }
    .col-xxl-5 {
        flex: 0 0 41.6666666667%;
    }
    .col-xxl-6 {
        flex: 0 0 50%;
    }
    .col-xxl-7 {
        flex: 0 0 58.3333333333%;
    }
    .col-xxl-8 {
        flex: 0 0 66.6666666667%;
    }
    .col-xxl-9 {
        flex: 0 0 75%;
    }
    .col-xxl-10 {
        flex: 0 0 83.3333333333%;
    }
    .col-xxl-11 {
        flex: 0 0 91.6666666667%;
    }
    .col-xxl-12 {
        flex: 0 0 100%;
    }
    .offset-xxl-1 {
        margin-left: 8.3333333333%;
    }
    .offset-xxl-2 {
        margin-left: 16.6666666667%;
    }
    .offset-xxl-3 {
        margin-left: 25%;
    }
    .offset-xxl-4 {
        margin-left: 33.3333333333%;
    }
    .offset-xxl-5 {
        margin-left: 41.6666666667%;
    }
    .offset-xxl-6 {
        margin-left: 50%;
    }
    .offset-xxl-7 {
        margin-left: 58.3333333333%;
    }
    .offset-xxl-8 {
        margin-left: 66.6666666667%;
    }
    .offset-xxl-9 {
        margin-left: 75%;
    }
    .offset-xxl-10 {
        margin-left: 83.3333333333%;
    }
    .offset-xxl-11 {
        margin-left: 91.6666666667%;
    }
    .offset-xxl-12 {
        margin-left: 100%;
    }
}