/*Base*/
* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    font-style: normal;
}

:root {
    /*Colors*/

    /* new colors */
    --white: #fff;
    --grey-lightest: #FCFAFB;
    --grey-light: #F2F2F2;
    --grey-darkest: #444444;

    /* Zweitwohnagentur */
    --primary-lightest: #EBF5DB;
    --primary-light: #C4E093;
    --primary-main: #9CCC4B;
    --primary-dark: #7DA33C;
    --primary-darker: #3E521E;
    --primary-darkest: #1F290F;
    --secondary-lightest: #FBFBF7;
    --secondary-light: #ACABA3;
    --secondary-main: #737266;
    --secondary-dark: #45443A;
    --secondary-darkest: #22221D;
    --accent-lightest: #FFFEF5;
    --accent-lighter: #FCF9DA;
    --accent-light: #F6EC91;
    --accent-main: #F0DF48;
    --accent-dark: #968B2C;
    --accent-darkest: #3C380F;
}

/*Screen Sizes*/
/*
576px;
768px;
992px;
1200px;
1300px;
1920px;
*/

/* Font Weights

The numerical values 100 to 900 roughly correspond to the following common weight names:

Value	Common weight name
100	Thin (Hairline)
200	Extra Light (Ultra Light)
300	Light
400	Normal
500	Medium
600	Semi Bold (Demi Bold)
700	Bold
800	Extra Bold (Ultra Bold)
900	Black (Heavy)
*/

html {
    height: 100%;
}

body {
    font-family: Teachers, sans-serif;
    font-weight: 400;
    background-color: var(--white);
    position: relative;
    margin: 0;
    margin-top: 7rem;
    min-height: 100%;
}


h1 {
    font-family: Teachers, sans-serif;
    font-weight: 400;
    color: var(--accent-darkest);
    font-size: 48px;
    line-height: 4rem;
    margin-bottom: 2rem;
    text-align: center;
}

h2 {
    font-size: 1.7rem;
    font-family: Teachers, sans-serif;
    font-weight: 600;
    color: var(--grey-darkest);
    text-align: left;
}

@media (min-width: 992px) {
    h2 {
        font-size: 2rem;
    }
}

h3 {
    font-weight: normal;
}

h4 {
    font-weight: normal;
}

/* HX styles */
.like-h1 {
    font-family: Teachers, sans-serif !important;
    font-weight: 400 !important;
    color: var(--accent-darkest) !important;
    font-size: 48px !important;
    line-height: 4rem !important;
    margin-bottom: 2rem !important;
    text-align: center !important;
}

.like-h2 {
    font-size: 1.7rem !important;
    font-family: Teachers, sans-serif;
    font-weight: 600;
    color: var(--grey-darkest);
    text-align: left;
}

@media (min-width: 992px) {
    .like-h2 {
        font-size: 2rem !important;
    }
}

.like-h3 {
    font-family: Teachers, sans-serif !important;
    font-size: 33px !important;
    line-height: 2rem !important;
    font-weight: 600 !important;
    margin-bottom: 1rem !important;
    margin-top: 2rem !important;
    color: var(--grey-darkest) !important;
}

a {
    color: var(--primary-darker);
    text-decoration: none;
}

a.link-red {
    color: var(--primary-main);
}

p {
    font-size: 23px;
    margin-bottom: 1.2rem;
    line-height: 2rem;
}

ul {
    padding-left: 0;
    list-style: none;
}

i,
em {
    font-style: italic;
}

b {
    font-weight: 700;
}

.linethrough {
    text-decoration: line-through;
}

.innersection-spacing {
    height: 3rem;
}

.fw-bold {
    font-weight: 600 !important;
}

@media (min-width: 768px) {
    .innersection-spacing {
        height: 4rem;
    }
}

@media (min-width: 1920px) {
    .innersection-spacing {
        height: 5rem;
    }
}

.btn-basic {
    font-family: Teachers, sans-serif;
    font-size: 16px;
    font-weight: 500;
    display: inline-block;
    padding: .5rem 1rem;
    border: none;
    border-radius: 3rem;
    text-align: center;
    cursor: pointer;
    box-shadow: var(--dark-gray) 6px 6px 0;
}

.btn-primary {
    color: var(--primary-darkest);
    background-color: var(--primary-light);
}

.btn-secondary {
    color: var(--secondary-lightest);
    background-color: var(--primary-light);
    box-shadow: var(--black) 6px 6px 0;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    color: var(--primary-darkest);
    background-color: var(--primary-lightest);
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
    color: var(--secondary-lightest);
    background-color: var(--accent-darkest);
}

section.section-bg-image a.btn-basic {
    color: var(--light-gray);
    font-weight: 500;
}

@media (min-width: 768px) {
    .btn-basic {
        font-size: 28px;
        padding: 1rem 1.7rem;
    }
}

/*
buttons small
and small buttons grouped
*/

.btn-small {
    font-size: 16px;
}

.btn-collection .btn-small {
    margin: 0;
    border-top: 2px solid var(--primary-dark);
    border-bottom: 2px solid var(--primary-dark);
    border-left: 2px solid var(--primary-dark);
}

.btn-collection .btn-small.btn-secondary {
    border-top: 2px solid var(--secondary-dark);
    border-bottom: 2px solid var(--secondary-dark);
    border-left: 2px solid var(--secondary-dark);
}

.btn-collection .btn-small:last-child {
    border-right: 2px solid var(--primary-dark);
}

.btn-collection .btn-small.btn-secondary:last-child {
    border-right: 2px solid var(--secondary-dark);
}

@media (min-width: 768px) {
    .btn-small {
        padding: 0.4rem .9rem;
    }

    .btn-collection .btn-small {
        margin-right: .5rem;
        margin-left: .5rem;
        border: 2px solid var(--primary-main);
    }

    .btn-collection .btn-small.btn-secondary {
        border: 2px solid var(--secondary-dark);
    }

    .btn-collection .btn-small:last-child {
        border-right: 2px solid var(--primary-main);
    }
}

/* Buttons text with icons */
.btn-icon {
    position: relative;
    display: flex;
    /* padding-left: 2.7rem; */
}

.btn-icon .btn-icon-svg {
    background-repeat: no-repeat;
    width: 9px;
    height: 19px;
    position: absolute;
    right: 0;
    top: 2rem;
}

.btn-icon.btn-small {
    color: var(--primary-darker);
}

.btn-icon.btn-small .btn-icon-svg {
    top: 10px;
    right: 0;
}

.btn-icon .btn-icon-svg.search {
    background-image: url(../img/icons/search_bold_grey-lightest.svg);
    top: 1.2rem;
    right: 2rem;
    width: 27px;
    height: 27px;
}

.btn-icon .btn-icon-svg.trashcan {
    background-image: url(../img/icons/trashcan_bold_grey_lightest.svg);
}

.btn-icon .btn-icon-svg.save {
    background-image: url(../img/icons/save_reg_grey_lightest.svg);
    left: 1.2rem;
}

.btn-icon .btn-icon-svg.shoppingkart {
    background-image: url(../img/icons/shopping-kart_bold_grey-lightest.svg);
    top: .5rem;
}

.btn-icon .btn-icon-svg.chevron-right {
    background-image: url(../img/icons/chevron_right_reg_primary-darker.svg);
    top: 1rem;
}

@media (min-width: 768px) {
    .btn-icon {
        padding-left: 3.7rem;
    }

    .btn-icon .btn-icon-svg {
        width: 9px;
        height: 19px;
        right: 2rem;
        top: 1.9rem;
    }

    .btn-icon.btn-small {
        padding-left: .4rem;
        padding-right: 1.4rem;
        font-size: 23px;
    }

    .btn-icon .btn-icon-svg.save {
        /* left: 1rem; */
    }

    .btn-icon .btn-icon-svg.shoppingkart {
        top: .9rem;
    }

    .btn-icon .btn-icon-svg.search {
        top: 1.8rem;
        right: 1.8rem;
    }
}

@media (min-width: 1300px) {
    .btn-icon .btn-icon-svg.search {
        right: 2.5rem;
    }
}

/* Buttons Icons only */
.btn-icon-only {
    width: 48px;
    height: 48px;
    border: none;
    background-color: transparent;
}

section.section-text-image .btn-icon-only img {
    width: 27px;
}

img table {
    width: 100%;
    border-collapse: collapse;
}

table a {
    color: var(--orange);
}

table td:last-child {
    text-align: right;
}

table tr {
    border: 1px solid var(--black);
}

table td {
    padding: 15px;
}

table tr:hover {
    background: var(--black);
    color: #fff !important;
    cursor: pointer;
}

table tr:hover a {
    color: #fff !important;
}

table.table-results tr {
    border: none;
    border-bottom: 2px solid var(--orange);
    color: var(--darker-gray);
}

table.table-results tr:last-child {
    border-bottom: none;
}

table.table-results tr:hover {
    background-color: var(--light-gray);
    color: var(--darker-gray) !important;
}

table.table-results tr:hover a {
    color: var(--orange) !important;
}

table.table-results tr th {
    padding: .5rem;
}

table.table-results tr td {
    padding: .5rem;
}

iframe {
    display: block;
    margin: auto;
    margin-top: 3rem;
    margin-bottom: 3rem;
    height: 250px;
    width: 100%;
}

iframe.google-maps {
    width: 100%;
}

@media (min-width: 576px) {
    iframe {
        width: 80%;
        height: 350px;
    }
}


@media (min-width: 768px) {
    iframe {
        height: 500px;
    }
}

@media (min-width: 1300px) {
    iframe {
        width: 700px;
        height: 393px;
    }
}

.softshadow {
    box-shadow: var(--secondary-dark) 2px 2px 8px;
}

.hardshadow {
    box-shadow: var(--black) 6px 6px 0;
}

/* forms */
.form-default {
    display: block;
    width: 100%;
    padding: 1rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--black);
    background-color: var(--secondary-lightest);
    background-clip: padding-box;
    border: 2px solid var(--primary-main);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0;
}

.form-default:hover {
    background-color: var(--primary-lightest);
}

.form-default:active,
.form-default:focus {
    border: 2px solid var(--primary-main);
    outline: none;
    background-color: var(--primary-light);
}

.form-default::placeholder {
    color: var(--secondary-dark);
}

select.form-default {
    color: var(--primary-darker);
    font-weight: 500;
    min-width: 150px;
}

@media (min-width: 992px) {
    select.form-default {
        min-width: 190px;
    }
}

@media (min-width: 1300px) {
    select.form-default {
        min-width: 200px;
    }
}

select option {
    background-color: var (--secondary-lightest);
    font-weight: 500;
}

select option:active,
select option:focus {
    background-color: var(--primary-dark);
}

textarea.form-default {
    min-height: 80px;
}

label.form-mid-chevron-down {
    position: absolute;
    top: 20px;
    right: 14px;
    background-image: url(../img/icons/chevron_down_reg_primary_main.svg);
    background-repeat: no-repeat;
    width: 18px;
    height: 18px;
    margin-left: .5rem;
}

.label-red {
    color: var(--primary-dark) !important;
}

.form-small {
    height: 40px;
}

/* Header Select and Search */
.form-mid {
    height: 46px;
    padding: .5rem 1rem;
}

.form-search {
    width: 150px;
}

@media (min-width: 1300px) {
    .form-search {
        width: 350px;
    }
}

.btn-search {
    height: 46px;
    padding: 0 10px;
    font-size: unset;
}

.form-company-phone {
    height: 2rem;
    font-size: 1.2rem;
}

.form-company-phone a {
    color: var(--black);
}

.form-company-phone i.fa-phone {
    color: var(--orange);
}

/* Form required asterisks */
.form-req-asterisk {
    color: var(--primary-dark);
}

.tooltip-icon {
    background-image: url(../img/icons/tooltip_bold_red_dark.svg);
    background-repeat: no-repeat;
    background-position: center;
    width: 46px;
    height: 46px;
    position: absolute;
    top: -24px;
    right: -38px;
    z-index: 4;
}

/* ✨ Special normal Forms EXTRAS ✨ - Custom Box to fake the look of normal forms, but put the real forms inside */
.form-normal-input-wrap .bordered-box-for-inner-forms {
    width: 100%;
    min-width: 224px;
    height: 43px;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--black);
    background-color: var(--secondary-lightest);
    background-clip: padding-box;
    border: 2px solid var(--primary-main);
    border-radius: 0;
}

/* Custom Label */
.form-normal-input-wrap .bordered-box-for-inner-forms .inner-forms-label {
    position: absolute;
    z-index: 2;
    top: .5rem;
    left: 1rem;
    color: var(--primary-dark);
    margin-bottom: .75rem;
    font-size: 1rem;
    font-weight: 500;
}

.form-normal-input-wrap .bordered-box-for-inner-forms select.form-default.form-mid {
    border: none;
    color: var(--primary-darker);
    height: 39px;
    position: absolute;
    top: 2px;
    right: 2px;
    width: 98%;
    padding: 0;
    padding-left: 9.5rem;
    min-width: unset;
    z-index: 1;
}

.form-normal-input-wrap .bordered-box-for-inner-forms select.form-default.form-mid:hover,
.form-normal-input-wrap .bordered-box-for-inner-forms select.form-default.form-mid:active,
.form-normal-input-wrap .bordered-box-for-inner-forms select.form-default.form-mid:focus {
    background-color: var(--primary-light);
}

.form-normal-input-wrap .bordered-box-for-inner-forms .form-mid-chevron-down {
    z-index: 2;
}

/* Special large forms for searches and filters*/
.form-large-input-wrap {
    position: relative;
    display: block;
    width: 100%;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--black);
    background-clip: padding-box;
    z-index: 2;
}

.form-large-input-wrap label {
    position: absolute;
    top: .75rem;
    left: 1rem;
    color: var(--primary-darker);
    margin-bottom: .75rem;
    font-size: 19px;
    font-weight: 500;
}

.form-large-input-wrap label.label-dropdown::after {
    /* custom chevron down */
    content: url(../img/icons/chevron-down_bold_primary-darker.svg);
    margin-left: .5rem;
}

/* Custom label für headersearch */
.label-multiforms {
    position: absolute;
    top: 0;
    right: 2.5rem;
    padding: .7rem 1.5rem .5rem 1.5rem;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-left-radius: 25px;
    border-bottom-right-radius: 25px;
    font-weight: 600;
    background-color: var(--primary-main);
}

@media (min-width: 768px) {
    .label-multiforms {
        top: -2.2rem;
        padding: 0.5rem 1rem .2rem 1rem;
        border-top-left-radius: 25px;
        border-top-right-radius: 25px;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }

    /* specific positions */
    .label-multiforms.quicksearch {
        right: unset;
        left: 2.5rem;
    }

    .label-multiforms.directsearch {
        right: unset;
        left: 1rem;
    }
}

.form-large-input-wrap input,
.form-large-input-wrap select {
    display: block;
    width: 100%;
    padding: 2.5rem .75rem 1rem 1rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--black);
    background-color: var(--secondary-lightest);
    background-clip: padding-box;
    border: 2px solid var(--primary-main);
    /* removes default arrow for dropdowns: */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0;
}

.form-large-input-wrap input:focus-visible,
.form-large-input-wrap select:focus-visible {
    outline: none;
}

.form-large-input-wrap input:active,
.form-large-input-wrap input:focus,
.form-large-input-wrap select:active,
.form-large-input-wrap select:focus {
    background-color: var(--primary-light);
}

/* When Dropdown Selects also need up and down Sorting Buttons */
select.form-large-select-with-sorts {
    padding-left: 6.5rem;
}

/* Remove borders if needed */
input.form-large-no-border-top,
select.form-large-no-border-top {
    border-top: none;
}

input.form-large-no-border-bottom,
select.form-large-no-border-bottom {
    border-bottom: none;
}

.form-large-no-border-top {
    border-top: none !important;
}

.form-large-no-border-bottom {
    border-bottom: none !important;
}

.form-large-no-border-bottom-mobile-only,
input.form-large-no-border-bottom-mobile-only,
select.form-large-no-border-bottom-mobile-only {
    border-bottom: none;
}

/* add half-border */
.form-large-half-border {
    position: absolute;
    right: 0;
    top: 11px;
    height: 53px;
    width: 2px;
    background-color: var(--primary-main);
    display: none;
}

.form-large-half-border.border-taller {
    height: 85px;
    display: none;
}

@media (min-width: 992px) {

    input.form-large-no-border-right,
    select.form-large-no-border-right {
        border-right: none;
    }

    .form-large-no-border-right {
        border-right: none !important;
    }

    input.form-large-no-border-left,
    select.form-large-no-border-left {
        border-left: none;
    }

    .form-large-no-border-left {
        border-left: none !important;
    }

    .form-large-half-border {
        display: block;
    }

    .form-large-half-border.border-taller {
        height: 85px;
        display: block;
    }

    .form-large-no-border-bottom-mobile-only,
    input.form-large-no-border-bottom-mobile-only,
    select.form-large-no-border-bottom-mobile-only {
        border-bottom: 2px solid var(--primary-main);
    }
}


/* ✨ Special Large Forms EXTRAS ✨ - Custom Box to fake the look of large forms, but put the real forms inside */
.form-large-input-wrap .bordered-box-for-inner-forms {
    width: 100%;
    padding: 3rem .75rem 1rem 1rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--black);
    background-color: var(--secondary-lightest);
    background-clip: padding-box;
    border: 2px solid var(--primary-main);
    border-radius: 0;
}

/* Custom Label */
.inner-forms-label {
    position: absolute;
    top: .75rem;
    left: 1rem;
    color: var(--primary-darker);
    margin-bottom: .75rem;
    font-size: 19px;
    font-weight: 500;
}

/* ✅🔘 Extra styles for when Check or Radio boxes are used, next to the label */
.bordered-box-for-inner-forms.type-checkradio-boxes {
    padding: .75rem .75rem 2rem 1rem;
}

.bordered-box-for-inner-forms.type-checkradio-boxes .inner-forms-label {
    position: unset;
}

/* Custom inputs and selects inside */
.form-large-input-wrap .bordered-box-for-inner-forms input,
.form-large-input-wrap .bordered-box-for-inner-forms select {
    padding: 1rem .75rem 1rem 1rem;
}

/* Custom Inner Forms sort buttons */
.inner-forms-sort-btns .btn-sort {
    width: 40px;
    height: 40px;
    border: none;
}

/* ⬇️⬆️ Custom Sort Buttons ⬇️⬆️ */
.inner-forms-sort-btns .btn-sort.sort-down {
    background: url(../img/icons/chevron-down_bold_grey_darker.svg);
    background-repeat: no-repeat;
    background-size: 24px;
    background-position: center;
}

.inner-forms-sort-btns .btn-sort.sort-down.active {
    background: url(../img/icons/chevron-down_bold_red_dark.svg);
    background-repeat: no-repeat;
    background-size: 24px;
    background-position: center;
}

.inner-forms-sort-btns .btn-sort.sort-up {
    background: url(../img/icons/chevron-down_bold_grey_darker.svg);
    background-repeat: no-repeat;
    background-size: 24px;
    background-position: center;
    transform: rotate(180deg);
}

.inner-forms-sort-btns .btn-sort.sort-up.active {
    background: url(../img/icons/chevron-down_bold_red_dark.svg);
    background-repeat: no-repeat;
    background-size: 24px;
    background-position: center;
    transform: rotate(180deg);
}

/* Sort buttons for Large Select Input */
.inner-forms-sort-btns.sort-buttons-for-select {
    position: absolute;
    top: 2.3rem;
    left: 1.3rem;
}

/* ✅ Custom Checkbox ✅ START*/

/* The container */
label.checkbox-custom {
    display: block;
    position: relative;
    top: unset;
    left: unset;
    padding-left: 40px;
    margin-right: 1rem;
    margin-bottom: 1.5rem;
    cursor: pointer;
    font-size: 1rem;
    font-weight: 500;
    color: var(--accent-darkest);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default checkbox */
label.checkbox-custom input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

/* Create a custom checkbox */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 32px;
    width: 32px;
    background-color: var(--secondary-lightest);
    border: 2px solid var(--primary-main);
}

/* On mouse-over, add a parchment background color */
label.checkbox-custom:hover input~.checkmark {
    background-color: var(--primary-light);
}

/* add this class if checkbox is selected via tab key to highlight the checkbox - Accessibilty*/
.checkmark.active {
    background-color: var(--primary-light);
}

/* When the checkbox is checked, add a blue background */
label.checkbox-custom input:checked~.checkmark {
    background-color: var(--secondary-lightest);
    border: 2px solid var(--primary-main);
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
label.checkbox-custom input:checked~.checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
label.checkbox-custom .checkmark:after {
    left: 10px;
    top: 5px;
    width: 8px;
    height: 14px;
    border: solid var(--primary-main);
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* ✅ Custom Checkbox ✅ END*/

/* 🔘 Custom Radiobox 🔘 START*/
/* The container */

label.radio-custom {
    display: block;
    position: relative;
    top: unset;
    left: unset;
    padding-left: 40px;
    margin-right: 1rem;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 1rem;
    font-weight: 500;
    color: var(--accent-darkest);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default radio button */
label.radio-custom input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

/* Create a custom radio button */
.radiomark {
    position: absolute;
    top: 0;
    left: 0;
    height: 32px;
    width: 32px;
    background-color: var(--secondary-lightest);
    border: 2px solid var(--primary-main);
    border-radius: 45px;
}

/* On mouse-over, add a grey background color */
label.radio-custom:hover input~.radiomark {
    background-color: var(--primary-light);
}

/* add this class if checkbox is selected via tab key to highlight the checkbox - Accessibilty*/
.radiomark.active {
    background-color: var(--primary-light);
}

/* When the radio button is checked, add a blue background */
label.radio-custom input:checked~.radiomark {
    background-color: var(--secondary-lightest);
    border: 2px solid var(--primary-main);
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.radiomark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the indicator (dot/circle) when checked */
label.radio-custom input:checked~.radiomark:after {
    display: block;
}

/* Style the indicator (dot/circle) */
label.radio-custom .radiomark:after {
    left: 6px;
    top: 6px;
    width: 16px;
    height: 16px;
    border-radius: 20px;
    background-color: var(--primary-main);
}

/* 🔘 Custom Radiobox 🔘 END */

/*Grid System*/
.grid-container-1,
.grid-container-2,
.grid-container-2-xl,
.grid-container-3,
.grid-container-3-lg,
.grid-container-4,
.grid-container-5,
.grid-container-4-lg,
.grid-container-4-xl,
.grid-container-6,
.grid-container-12,
.grid-container-boxes,
.grid-container-footer,
.grid-container-large-forms {
    display: grid;
}

.grid-gap-footer {
    grid-gap: 15px;
}

.grid-gap {
    grid-gap: 24px;
}

.grid-gap-10px {
    grid-gap: 10px;
}

.grid-gap-80px {
    grid-gap: 80px;
}

@media (min-width: 768px) {
    .grid-container-boxes {
        grid-template-columns: 1fr 1fr
    }
}

@media (min-width: 768px) {
    .grid-container-footer-sub-cols {
        display: grid;
        grid-template-columns: 1fr 1fr
    }
}

@media (min-width: 768px) {
    .grid-container-1 {
        grid-template-columns: 100%;
    }

    .grid-container-2 {
        grid-template-columns: 1fr 1fr
    }

    .grid-container-3 {
        grid-template-columns: 1fr 1fr 1fr
    }

    .grid-container-4 {
        grid-template-columns: 1fr 1fr 1fr 1fr
    }

    .grid-container-5 {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    }

    .grid-container-6 {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    }

    .grid-container-12 {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    }

    .grid-container-footer {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

@media (min-width: 992px) {
    .grid-container-3-lg {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .grid-container-4-lg {
        grid-template-columns: 1fr 1fr 1fr 1fr;
    }

    .grid-gap-footer {
        grid-gap: 60px;
    }
}

@media (min-width: 992px) {
    .grid-container-footer {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

@media (min-width: 1300px) {
    .grid-container-2-xl {
        grid-template-columns: 1fr 1fr
    }

    .grid-container-4-xl {
        grid-template-columns: 1fr 1fr 1fr 1fr;
    }
}

@media (min-width: 1300px) {
    .grid-container-boxes {
        grid-template-columns: 1fr 1fr 1fr 1fr
    }
}

/*Starts at first col and ends before the third: Goes over two cols*/
.grid-item-col-1-3 {
    grid-column: 1 / 3;
}

.grid-item-col-1-3-md,
.grid-item-col-1-3-lg {
    grid-column: 1;
}

/*Makes larger forms go over a single row in mobile*/
.grid-item-large-forms {
    grid-column: 1 / 3;
}

/* makes grid item end on the start of the third column */
.grid-item-column-end-3 {
    grid-column-start: 1;
    grid-column-end: 3;
}

/* Starts at 1st col and ends before the 2nd: Goes over 1 out of 3 cols */
.grid-item-col-1-2,
.grid-item-col-1-2-xl {
    grid-column: 1;
}

/* Starts at 2nd col and ends at 4th: Goes over the last 2 out of 3 cols */
.grid-item-col-2-4 {
    grid-column: 1;
}

/* Starts at 2nd col and ends at 5th: Goes over the last 3 out of 4 cols */
.grid-item-col-2-5,
.grid-item-col-2-5-xl {
    grid-column: 1;
}

.grid-item-col-3-6-md {
    grid-column: 1;
}

.grid-item-col-3-7-md,
.grid-item-col-3-7-lg {
    grid-column: 1;
}

.grid-item-col-1-4-xl {
    grid-column: 1;
}

.grid-item-col-4-5-xl {
    grid-column: 1;
}

.grid-item-col-7-10-md {
    grid-column: 1;
}

.grid-item-col-10-11-md {
    grid-column: 1;
}

.grid-item-col-11-12-md {
    grid-column: 1;
}

.grid-item-col-12-13-md {
    grid-column: 1;
}

@media (min-width: 768px) {
    .grid-item-col-1-3-md {
        grid-column: 1 / 3;
    }

    .grid-item-col-3-6-md {
        grid-column: 3 / 6;
    }

    .grid-item-col-3-7-md {
        grid-column: 3 / 7;
    }

    .grid-item-col-7-10-md {
        grid-column: 7 / 10;
    }

    .grid-item-col-10-11-md {
        grid-column: 10 / 11;
    }

    .grid-item-col-11-12-md {
        grid-column: 11 / 12;
    }

    .grid-item-col-12-13-md {
        grid-column: 12 / 13;
    }
}

@media (min-width: 992px) {

    /* Starts at 1st col and ends before the 2nd: Goes over 1 out of 3 cols */
    .grid-item-col-1-2 {
        grid-column: 1 / 2;
    }

    .grid-item-col-1-3-lg {
        grid-column: 1 / 3;
    }

    /* Starts at 2nd col and ends at 4th: Goes over the last 2 out of 3 cols */
    .grid-item-col-2-4 {
        grid-column: 2 / 4;
    }

    /* Starts at 2nd col and ends at 5th: Goes over the last 3 out of 4 cols */
    .grid-item-col-2-5 {
        grid-column: 2 / 5;
    }

    .grid-item-col-3-7-lg {
        grid-column: 3 / 7;
    }

    /* Specifics for search results grid table */
    .grid-item-col-7-10-md {
        grid-column: 7 / 9;
    }

    .grid-item-col-10-11-md {
        grid-column: 9 / 10;
    }

    .grid-item-col-11-12-md {
        grid-column: 10 / 11;
    }

    .grid-item-col-12-13-md {
        grid-column: 11 / 13;
    }

    /*Makes larger forms go over all rows in grid container on desktop again */
    .grid-item-large-forms {
        grid-column: unset;
    }
}

@media (min-width: 1300px) {

    /* Specifics for search results grid table */
    .grid-item-col-7-10-md {
        grid-column: 7 / 8;
    }

    .grid-item-col-10-11-md {
        grid-column: 8 / 9;
    }

    .grid-item-col-11-12-md {
        grid-column: 9 / 10;
    }

    .grid-item-col-12-13-md {
        grid-column: 10 / 13;
    }
}

/* Grid items specific locations */

/* Grid items Header Search START */
.grid-item-header-reg .form-large-select {
    border-bottom-left-radius: 80px;
    border-bottom-right-radius: 80px;
    border-top-left-radius: 80px;
    border-top-right-radius: 80px;
}

.grid-item-header-cat .form-large-select {
    border-bottom-left-radius: 80px;
    border-bottom-right-radius: 80px;
    border-top-left-radius: 80px;
    border-top-right-radius: 80px;
}

.grid-item-header-price .form-large-select {
    border-bottom-left-radius: 80px;
    border-bottom-right-radius: 80px;
    border-top-left-radius: 80px;
    border-top-right-radius: 80px;
}

.grid-item-header-objnum input {
    border-bottom-left-radius: 80px;
    border-bottom-right-radius: 80px;
    border-top-left-radius: 80px;
    border-top-right-radius: 80px;
}

/* Labels */
.grid-item-header-reg.form-large-input-wrap label,
.grid-item-header-cat.form-large-input-wrap label,
.grid-item-header-price.form-large-input-wrap label,
.grid-item-header-objnum.form-large-input-wrap label {
    left: 2rem;
}

/* Inputs */
.grid-item-header-reg.form-large-input-wrap input,
.grid-item-header-reg.form-large-input-wrap select,
.grid-item-header-cat.form-large-input-wrap input,
.grid-item-header-cat.form-large-input-wrap select,
.grid-item-header-price.form-large-input-wrap input,
.grid-item-header-price.form-large-input-wrap select,
.grid-item-header-objnum.form-large-input-wrap input,
.grid-item-header-objnum.form-large-input-wrap select {
    padding-left: 2rem;
}

/* Button */
.grid-item-header-btn-search .btn-header-search {
    background-color: var(--primary-main);
    border-radius: 80px;
    padding: 2rem 3rem;
    border: none;
    cursor: pointer;
    position: absolute;
    top: 0;
    right: 0;
}

.grid-item-header-btn-search-reset .btn-header-search-reset {
    margin-top: 1rem;
    background-color: var(--primary-main);
}

.grid-item-fullsearch {
    margin: 0 .5rem;
}

@media (min-width: 768px) {
    .grid-item-fullsearch {
        margin: 0;
    }

    .grid-item-header-reg {
        grid-column: 1 / 4;
    }

    .grid-item-header-reg .form-large-select {
        border-bottom-right-radius: 0;
        border-top-right-radius: 0;
        border-right: none;
    }

    .grid-item-header-cat {
        grid-column: 4 / 7;
    }

    .grid-item-header-cat .form-large-select {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        border-right: none;
    }

    .grid-item-header-price {
        grid-column: 7 / 9;
    }

    .grid-item-header-price .form-large-select {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        border-right: none;
    }

    .grid-item-header-objnum {
        grid-column: 9 / 12;
    }

    .grid-item-header-objnum input {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        border-right: none;
    }

    .grid-item-header-btn-search {
        grid-column: 12 / 13;
    }

    .grid-item-header-btn-search-reset {
        grid-column: 12 / 13;
    }

    /* Labels */
    .grid-item-header-reg.form-large-input-wrap label {
        left: 1.5rem;
    }

    .grid-item-header-cat.form-large-input-wrap label,
    .grid-item-header-price.form-large-input-wrap label,
    .grid-item-header-objnum.form-large-input-wrap label {
        left: 1rem;
    }

    /* Inputs */
    .grid-item-header-reg.form-large-input-wrap input,
    .grid-item-header-reg.form-large-input-wrap select {
        padding-left: 1.5rem;
    }

    .grid-item-header-cat.form-large-input-wrap input,
    .grid-item-header-cat.form-large-input-wrap select,
    .grid-item-header-price.form-large-input-wrap input,
    .grid-item-header-price.form-large-input-wrap select,
    .grid-item-header-objnum.form-large-input-wrap input,
    .grid-item-header-objnum.form-large-input-wrap select {
        padding-left: 1rem;
    }

    /* Button */
    .grid-item-header-btn-search .btn-header-search {
        border-radius: 0 80px 80px 0;
        position: unset;
        padding: 2.64rem;
    }

    .grid-item-header-btn-search-reset .btn-header-search-reset {
        font-size: 16px;
        padding: .5rem 1rem;
        margin-top: .5rem;
    }

    .grid-item-fullsearch {
        grid-row-start: 1;
        grid-row-end: 2;
    }
}

@media (min-width: 1300px) {
    .grid-item-header-reg {
        grid-column: 1 / 3;
    }

    .grid-item-header-cat {
        grid-column: 3 / 5;
    }

    .grid-item-header-price {
        grid-column: 5 / 7;
    }

    .grid-item-header-objnum {
        grid-column: 7 / 12;
    }

    .grid-item-header-btn-search {
        grid-column: 12 / 13;
    }
}

/* Grid items Header Search END */

@media (min-width: 992px) {

    /* Grid items specific locations */
    .grid-item-intro-text {
        grid-row-start: unset;
        grid-row-end: unset;
    }

    .grid-item-fullsearch {
        grid-row-start: unset;
        grid-row-end: unset;
    }
}

@media (min-width: 1300px) {

    /* Starts at 1st col and ends before the 2nd: Goes over 1 out of 3 cols */
    .grid-item-col-1-2-xl {
        grid-column: 1 / 2;
    }

    .grid-item-col-2-5-xl {
        grid-column: 2 / 5;
    }

    .grid-item-col-1-4-xl {
        grid-column: 1 / 4;
    }

    .grid-item-col-4-5-xl {
        grid-column: 4 / 5;
    }
}

/*Layout*/

ul.nav {
    display: flex;
    list-style: none;
}

.nav>li {
    /* display: flex; */
}

.nav>li a,
.nav>li .dropdown-btn {
    display: flex;
    align-self: stretch;
    align-items: center;
}

.nav>li .dropdown-btn i {
    margin-left: 0.3rem;
    font-size: .7rem;
}

/*--------------navs--------------*/


/* Mobile Menu */
.nav-header-container-mobile {
    position: fixed;
    top: 0;
    z-index: 5;
    width: 100%;
    min-height: 8rem;
    padding: 0 2rem;
    background-color: var(--primary-lightest);
    box-shadow: var(--black) 0 6px 0;
    display: flex;
    justify-content: space-between;
}

.nav-header-mobile {
    padding: 0;
    margin: 0;
}

.nav-header-mobile a {
    color: var(--primary-darker);
    font-weight: 500;
    font-size: 19px;
    padding-right: 2rem;
}

.nav-header-lang-mobile a {
    margin: 0;
    padding: .7rem 0 .7rem 1rem;
}

button.nav-header-toggler {
    border: none;
    background-color: transparent;
    font-size: 2rem;
    padding: 0 1rem;
    margin-right: -1rem;
    color: var(--primary-dark);
}

button.nav-header-toggler:hover {
    cursor: pointer;
}

.nav-header-dropdown {
    position: absolute;
    top: 8rem;
    left: 0;
    width: 100%;
    height: auto;
    max-height: 700px;
    list-style: none;
    background-color: var(--primary-light);
    box-shadow: var(--black) 0 6px 0;
    transition: all .1s;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
}

.nav-header-dropdown a:active {
    background-color: var(--darker-gray);
}

.nav-header-dropdown li.first-level {
    border-bottom: 2px solid var(--primary-dark);
    display: flex;
    justify-content: flex-end;
    padding-right: 2rem;
}

.nav-header-dropdown li.first-level a,
.nav-header-dropdown li.first-level .dropdown-btn {
    color: var(--primary-darkest);
    font-family: Teachers, sans-serif;
    font-size: 19px;
    line-height: 3.2rem;
    font-weight: 500;
}

.nav-header-dropdown li.first-level a.icon {
    margin: 0 .5rem;
}

.nav-header-dropdown li.first-level a.icon-facebook {
    font-size: .8rem;
    height: 1.2rem;
}

.nav-header-dropdown li.first-level a.icon-instagram {
    font-size: .9rem;
    height: 1.2rem;
}

.nav-header-dropdown li.first-level a.icon-search {
    font-size: 1.2rem;
}

.nav-header-dropdown li.first-level a.nav-font-awesome-icon {
    font-size: 2rem;
    margin-left: 1rem;
}

.nav-header-dropdown li.second-level {
    margin-left: 1rem;
    /* border-bottom: 2px solid var(--orange); */
}

.nav-header-dropdown li.second-level:last-child {
    border-bottom: 0;
}

.nav-header-dropdown li.second-level .dropdown-item {
    padding: 0;
}

.nav-header-container-mobile .dropdown-item:hover,
.nav-header-container-mobile .dropdown-item:focus,
.nav-header-container-mobile .dropdown-item:active {
    background-color: transparent;
    color: var(--light-gray) !important;
}

.nav-header-dropdown .dropdown-menu {
    border: none;
    border-radius: 0;
    margin: 0 -2rem 0 -2rem;
    padding: 0 0 0 2rem;
    background-color: var(--mid-gray);
}

/* Desktop Menu */

.nav-header-container {
    display: none;
    background-color: var(--primary-lightest);
    box-shadow: var(--black) 0 6px 0;
    position: fixed;
    top: 0;
    z-index: 5;
    width: 100%;
}

.nav-header {
    height: 7rem;
    justify-content: flex-end;
    align-items: center;
}

.nav-header li.first-level {
    position: relative;
}

.nav-header li.first-level:last-child {
    margin-right: -1rem;
}

.nav-header li.first-level:first-child {
    margin-left: -1rem;
}

.nav-header-brand img {
    width: 180px;
    height: auto;
}

@media (min-width: 1300px) {
    .nav-header-brand img {
        width: 220px;
    }
}

.nav-header a,
.nav-header .dropdown-btn {
    font-family: Teachers, sans-serif;
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--primary-darker);
    margin: 0;
    padding: 0 1.2rem;
}

.nav-header a:hover,
.nav-header .dropdown-btn:hover {
    color: var(--primary-darker);
    background-color: var(--primary-light);
    border-radius: 50px;
}

.nav-header a.nav-font-awesome-icon {
    font-size: 2rem;
    color: var(--primary-dark);
    padding: 0 .7rem;
}

.nav-header a.nav-font-awesome-icon:hover {
    color: var(--primary-darkest);
    background-color: transparent;
}

.nav-header .dropdown-content {
    display: none;
    position: absolute;
    top: 5rem;
    left: -1.5rem;
    z-index: 5;
    background-color: var(--darker-gray-trans);
    box-shadow: var(--black) 6px 6px 0;
    width: auto;
    min-width: 300px;
}

.dropdown-desktop:hover .dropdown-content {
    display: block;
}

.nav-header .dropdown-content li.second-level {
    background-color: var(--dark-gray);
}

.nav-header .dropdown-content li.second-level:hover {
    background-color: var(--dark-gray);
}

.nav-header .dropdown-content li.second-level a {
    padding: .5rem;
}

.nav-header a.icon {
    margin: 0 .5rem;
}

.nav-header a.icon-facebook {
    font-size: .8rem;
}

.nav-header a.icon-instagram {
    font-size: .9rem;
}

.nav-header a.icon-search {
    font-size: 1.2rem;
}

.nav-header-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--orange);
    color: var(--white);
    width: 1.45rem;
    height: 1.45rem;
    border-radius: 50%;
}

.nav-header a.icon-facebook .nav-header-icon {
    justify-content: unset;
    padding-left: 8px;
}

.nav-header-icon .fa-instagram {
    color: var(--white)
}

/* Menus Responsive */

@media (min-width: 992px) {
    .nav-header-container-mobile {
        display: none;
    }

    .nav-header-container {
        display: block;
    }

    .nav-header a {
        font-size: 1.3rem;
        padding: 0 .7rem;
    }

    .nav-header a.nav-font-awesome-icon {
        font-size: 1.7rem;
        padding: 0 .5rem;
    }
}

@media (min-width: 1300px) {

    .nav-header a,
    .nav-header .dropdown-btn {
        font-size: 1.4rem;
        margin: 0;
        padding: 0 1.2rem;
    }

    .nav>li .dropdown-btn i {
        margin-left: .7rem;
    }

    .nav-header .dropdown-content {
        min-width: 350px;
        left: -.5rem;
    }
}

/*--------------navs--------------*/
/* Pagination */
/* override content page list style, if it's a pagination */
section.content-page ul.pagination {
    list-style: none;
    padding-left: 0;
}

.page-link {
    background-color: var(--primary-light);
    border: 2px solid var(--primary-dark);
    color: var(--primary-darkest);
}

.page-link:hover,
.page-link:active,
.page-link:focus {
    background-color: var(--primary-dark);
    color: var(--primary-lightest);
    border-color: var(--primary-dark);
}

.page-link-periods {
    background-color: var(--primary-dark);
}

.page-item:first-child .page-link,
.page-item:last-child .page-link {
    border-radius: 0;
}

.page-link.page-link-icon {
    padding: 0.35rem .25rem;
}

.page-link.page-link-icon>span {
    background-repeat: no-repeat;
    background-position: center;
    display: flex;
    width: 28px;
    height: 28px;
}

.page-link.page-link-icon>span.first {
    background-image: url(../img/icons/chevron-left-double_reg_primary-darkest.svg);
}

.page-link.page-link-icon:hover>span.first {
    background-image: url(../img/icons/chevron-left-double_reg_grey-lightest.svg);
}

.page-link.page-link-icon>span.prev {
    background-image: url(../img/icons/chevron_left_reg_primary-darkest.svg);
}

.page-link.page-link-icon:hover>span.prev {
    background-image: url(../img/icons/chevron_left_reg_grey_lightest.svg);
}

.page-link.page-link-icon>span.last {
    background-image: url(../img/icons/chevron-left-double_reg_primary-darkest.svg);
    transform: rotate(180deg);
}

.page-link.page-link-icon:hover>span.last {
    background-image: url(../img/icons/chevron-left-double_reg_grey-lightest.svg);
    transform: rotate(180deg);
}

.page-link.page-link-icon>span.next {
    background-image: url(../img/icons/chevron_left_reg_primary-darkest.svg);
    transform: rotate(180deg);
}

.page-link.page-link-icon:hover>span.next {
    background-image: url(../img/icons/chevron_left_reg_grey_lightest.svg);
    transform: rotate(180deg);
}

.pagination-lg .page-link {
    padding: .3rem .75rem;
}

.pagination-lg .page-link.page-link.page-link-icon {
    padding: .35rem .3rem;
}

.pagination-lg .page-item:last-child .page-link {
    /* border-top-right-radius: 0;
    border-bottom-right-radius: 0; */
}

.pagination-lg .page-item:first-child .page-link {
    /* border-top-left-radius: 0;
    border-bottom-left-radius: 0; */
}

@media (min-width: 1300px) {
    .pagination-lg .page-link {
        padding: .6rem 1.2rem;
    }

    .pagination-lg .page-link.page-link.page-link-icon {
        padding: .65rem .5rem;
    }
}

/*--------------navs--------------*/

.nav-filter {
    height: 1rem;
    margin: .5rem 0;
}

.nav-filter li {
    border-right: 1px solid var(--darker-gray);
}

.nav-filter li:last-child {
    border-right: none;
    margin-right: -.5rem;
}

.nav-filter li:first-child {
    margin-left: -.5rem;
}

.nav-filter a {
    font-size: 1.2rem;
    color: var(--darker-gray);
    margin: 0 1rem;
}

/*--------------navs--------------*/

.nav-footer {
    justify-content: space-between;
}

.nav-footer li:after {
    content: " | ";
}

.nav-footer li:last-child {
    margin-right: -1rem;
}

.nav-footer li:last-child:after {
    content: "";
}

.nav-footer li:first-child {
    margin-left: -1rem;
}

.nav-footer a {
    font-size: 1rem;
    margin: 0 .3rem;
    position: relative;
    white-space: nowrap;
    /* color: var(--orange); */
}

.nav-footer a:hover,
.nav-footer a:focus,
.nav-footer a:active {
    color: var(--white);
}

/* Breadcrumb */
.breadcrumb,
section.content-page ol.breadcrumb {
    padding-left: 0;
}

section.content-page ol.breadcrumb li.breadcrumb-item {
    font-size: 13px;
    font-weight: 800;
    color: var(--primary-main);
}

section.content-page ol.breadcrumb li.breadcrumb-item.active {
    font-size: 13px;
    font-weight: 500;
    color: var(--primary-dark);
}

section.content-page ol.breadcrumb li.breadcrumb-item+.breadcrumb-item {
    padding-left: 0;
}

section.content-page ol.breadcrumb li.breadcrumb-item a {
    color: var(--primary-dark);
}

section.content-page ol.breadcrumb li.breadcrumb-item a:hover,
section.content-page ol.breadcrumb li.breadcrumb-item a:active,
section.content-page ol.breadcrumb li.breadcrumb-item a:focus {
    text-decoration: underline;
}

.breadcrumb-item+.breadcrumb-item::before {
    content: url(../img/icons/chevron_left_reg_primary-main.svg);
    transform: rotate(180deg) scale(0.4);
    height: 35px;
    width: 30px
}

/*--------------navs--------------*/

.main-container,
.main-container-sm {
    margin: 0 auto;
    width: 100%;
}

.main-container-full-width {
    width: 100%;
}

@media (min-width: 768px) {
    .main-container {
        width: 720px;
    }
}

@media (min-width: 920px) {
    .main-container {
        width: 880px;
    }

    .main-container-sm {
        width: 720px;
    }
}

@media (min-width: 1300px) {
    .main-container {
        width: 1200px;
    }

    .main-container-sm {
        width: 720px;
    }
}

#footer {
    background-color: var(--primary-lightest);
    color: var(--light-gray);
    padding: 2rem 0 0 0;
    height: auto;
}

#footer .main-container {
    display: flex;
    flex-direction: row;
}

#footer .main-container ul.footer-contact-list {
    display: flex;
    justify-content: start;
    margin-bottom: 1rem;
    text-align: left;
}

/* copyright sub footer for desktop */
#footer .footer-copyright {
    background-color: var(--primary-light);
    display: block;
}

#footer .footer-copyright .main-container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.footer-copyright {
    display: flex;
    font-size: 13px;
    font-weight: 400;
    color: var(--primary-darkest);
    padding: .7rem 0;
}

@media (min-width: 992px) {
    #footer .main-container {
        display: flex;
        flex-direction: column;
    }

    #footer .footer-copyright .main-container {
        flex-direction: row;
    }

    #footer .main-container ul.footer-contact-list {
        display: flex;
        margin-bottom: 0;
    }
}

#footer a:hover,
#footer a:active,
#footer a:focus {
    text-decoration: underline;
}

#footer p {
    font-size: 1rem;
    line-height: 2rem;
    margin-bottom: .8rem;
}

#footer h3 {
    font-family: Teachers, sans-serif;
    font-weight: 700;
    font-size: 1.5rem;
}

#footer .footer-heading {
    font-family: Teachers, sans-serif;
    font-weight: 700;
    font-size: 1.5rem;
    line-height: 1.7rem;
    margin-bottom: .5rem;
}

#footer ul li {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.5rem;
}

@media (min-width: 992px) {
    #footer ul li {
        font-size: 1rem;
        line-height: 1.5rem;
    }
}

ul.footer-contact-list a {
    padding: 0;
    color: var(--primary-darkest);
}

ul.footer-contact-list a .footer-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.5rem;
    width: 2rem;
    height: 2rem;
    color: var(--light-gray);
    border-radius: 50%;
    margin: 0 .5rem;
}

ul.footer-contact-list a.nav-font-awesome-icon {
    font-size: 2rem;
    color: var(--primary-dark);
    padding: 0 1rem 0 0;
}

ul.footer-contact-list a.nav-font-awesome-icon:hover {
    color: var(--primary-darkest);
    background-color: transparent;
}

@media (min-width: 992px) {
    #footer .footer-copyright a {
        color: var(--primary-darker);
        text-decoration: underline;
    }
}

.social-media {
    position: relative;
}

.social-media-buttons {
    background-color: var(--black);
    z-index: 2;
    padding: 0 1rem;
}

.social-media:before {
    content: '';
    position: absolute;
    background-color: var(--darker-gray);
    height: 1px;
    width: 100%;
    top: 50%;
    left: 0;
    z-index: 1;
}

.social-media a.btn-social-media {
    color: var(--darker-gray);
    border: 3px solid var(--darker-gray);
    border-radius: 50%;
    width: 35px;
    height: 35px;
    margin: 0 .5rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.copyright {
    font-size: .8rem;
    color: var(--white);
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 4rem;
    /*Adjust padding-bottom of body to height of footer!*/
    padding: 0 2rem;
}

@media (min-width: 768px) {
    .copyright {
        padding: 0;
    }
}

.copyright-text {
    height: 100%;
}

/*Modules*/
/* Header image container full width banner */
.header-img-container {
    /* height: 100vh; */
    height: 550px;
    padding-top: 5rem;
    position: relative;
}

@media (min-width: 768px) {
    .header-img-container {
        height: 232px;
    }
}

.header-bg-img,
.full-width-bg-img {
    /*background-image inline style in cms*/
    /* background-image: url(../img/af20c2_87580e662d31442ea9d1fafbe0dce955_mv2.webp); */
    background-size: cover;
    background-position: top;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
}

.full-width-bg-img {
    /* background-image: url(../img/profil.jpg); */
    background-size: cover;
    background-position: top;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
}

/* Sliders */
/* Slider Promo aka Short Profile START */

/*Teaser Boxes for new catalogs and other custom stuff START*/
.short-profile-container {
    background-color: var(--primary-lightest);
    border: 2px solid var(--primary-main);
    border-radius: 1rem;
    margin: 0 1rem;
}

.short-profile-image {
    overflow: hidden;
    margin-bottom: 0;
    aspect-ratio: 16/9;
    width: 100%;
}

.sp-smaller .short-profile-image {
    width: 100%;
}

.sp-bg-image {
    background-repeat: no-repeat;
    background-position: top;
    background-size: 50%;
}

@media (min-width: 576px) {
    .sp-bg-image {
        background-size: 30%;
    }
}

@media (min-width: 768px) {
    .short-profile-container {
        margin: 0;
    }
}

@media (min-width: 992px) {
    .sp-bg-image {
        background-size: 100%;
    }
}

@media (min-width: 1200px) {
    .sp-smaller {
        min-height: 357px;
    }
}

@media (min-width: 1300px) {
    .sp-smaller {
        min-height: 467px;
    }
}

.short-profile-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

h3.short-profile-name {
    font-size: 19px;
    text-align: left;
    font-family: Teachers, sans-serif;
    font-weight: 500;
    color: var(--primary-darker);
    margin-bottom: 1rem;
    padding: 0;
    box-shadow: var(--black) 6px 6px 0;
    display: inline-block;
    padding: 1rem 1rem 0 1rem;
    min-height: 6.5rem;
}

@media (min-width: 1300px) {
    h3.short-profile-name {
        font-size: 23px;
    }
}

.short-profile-description {
    background-color: var(--dark-gray);
    box-shadow: var(--black) 6px 6px 0;
    padding: 0;
    font-size: 14px;
    font-weight: 700;
}

.short-profile-description .date-rent {
    /* display: grid;
    grid-template-columns: 1fr 1fr; */
    display: flex;
    justify-content: space-between;
    padding: .4rem 1rem;
    margin-bottom: 1rem;
    background-color: var(--primary-light);
    color: var(--primary-darkest);
}

.short-profile-description .summary {
    height: auto;
    /* min-height: 5rem; */
    padding: 0 1rem 0 1rem;
}

@media (min-width: 576px) {
    .short-profile-description .summary {
        min-height: 6rem;
    }
}

@media (min-width: 992px) {
    .short-profile-description .summary {
        min-height: 6rem;
    }
}

@media (min-width: 1200px) {
    .short-profile-description .summary {
        min-height: 5.5rem;
    }

    .short-profile-description .summaryDesc {
        min-height: 10.5rem;
    }
}

@media (min-width: 1300px) {
    .short-profile-description .summaryDesc {
        min-height: 7.5rem;
    }
}

.short-profile-description .summary p {
    font-family: Teachers, sans-serif;
    font-size: 1rem;
    font-weight: 500;
    line-height: 120%;
    color: var(--primary-darker);
}

.short-profile-description .summary .summary-info p {
    font-weight: 600;
}

.short-profile-description ul {
    font-family: Teachers, sans-serif;
    font-size: 1.2rem;
    line-height: 2rem;
    list-style: square;
    padding-left: 1.5rem;
}

a.btn-sp-more {
    position: relative;
    padding: .5rem 1.5rem .5rem 1rem;
    font-size: 1.2rem;
    font-weight: 500;
}

a.btn-sp-more:hover {
    color: var(--primary-darker);
}

.btn-sp-more .btn-icon-svg.chevron-right {
    position: absolute;
    top: .8rem;
    right: 0.4rem;
    width: 9px;
    height: 19px;
    background-image: url(../img/icons/chevron_right_reg_primary-darker.svg);
    background-repeat: no-repeat;
}

@media (min-width: 1300px) {
    a.btn-sp-more {
        font-size: 1.5rem;
    }

    .btn-sp-more .btn-icon-svg.chevron-right {
        top: 1rem;
    }
}

/*Slider Promo aka Short Profile END*/

/* Slider container for controls */

.slider-promo-container {
    position: relative;
}

/* Slider Gradient that indicates there is more */

.slider-gradient {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
    width: 20px;
    height: 100%;
    background: var(--white);
    /* background: linear-gradient(-90deg, rgba(255, 254, 245, 1) 55%, rgba(255, 254, 245, 0) 100%); */
    background: linear-gradient(-90deg, rgba(255, 255, 255, 1) 55%, rgba(255, 255, 255, 0) 100%);
}

@media (min-width: 768px) {
    .slider-promo-container {
        margin: 0 1.5rem;
    }
}

@media (min-width: 992px) {
    .slider-promo-container {
        margin: 0 0;
    }
}

@media (min-width: 1300px) {
    .slider-gradient {
        right: -30px;
        top: -20px;
        width: 70px;
        height: 110%;
    }
}

/* Slider controls */
.btn-slider-promo-control {
    position: absolute;
    top: 40%;
    z-index: 2;
    display: flex;
    width: 49px;
    height: 49px;
    justify-content: center;
    align-items: center;
    padding: 0;
    display: none;
}

.btn-slider-promo-control.prev {
    left: -25px;
    right: unset;
}

.btn-slider-promo-control.next {
    left: unset;
    right: -30px;
}

.btn-slider-promo-control .btn-slider-promo-control-icon {
    display: block;
    background-repeat: no-repeat;
    width: 40px;
    height: 49px;
}

.btn-slider-promo-control .btn-slider-promo-control-icon.prev {
    background-image: url(../img/icons/chevron_left_reg_primary-main.svg);
}

.btn-slider-promo-control .btn-slider-promo-control-icon.next {
    background-image: url(../img/icons/chevron_left_reg_primary-main.svg);
    transform: rotate(180deg);
}


.dm-slider-wrap {
    overflow: visible !important;
    margin: auto;
    width: 100% !important;
}

.dm-slider-wrap .bx-wrapper .bx-viewport {
    overflow: visible;
    height: 370px !important;
    padding-top: 15px;

}

.dm-slider-left,
.dm-slider-right {
    z-index: 4 !important;
}

/* Slider Product Page START */
.slider-product-page-large-img-container {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--secondary-lightest);
    width: 100%;
    margin-bottom: .5rem;
    border-radius: 24px;
    position: relative;
}

section.section-text-image .slider-product-page-large-img-container img {
    height: 324px;
    width: 100%;
    object-fit: cover;
    border-radius: 24px;
}

section.section-text-image .slider-product-page-large-img-container.no-images {
    flex-direction: column;
}

section.section-text-image .slider-product-page-large-img-container.no-images>div {
    color: var(--secondary-dark);
    font-size: 19px;
}

.slider-product-page-small-img-container {
    position: relative;
}

.slider-product-page-small-img-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.slider-product-page-small-img-wrap a.slider-product-page-small-img {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--secondary-lightest);
    height: 65px;
    width: 65px;
    padding-top: 1rem;
    padding-bottom: 1rem;
    border-radius: 16px;
}

section.section-text-image .slider-product-page-small-img-wrap a.slider-product-page-small-img img {
    height: 65px;
    width: 65px;
    object-fit: cover;
    border-radius: 16px;
}

.slider-product-page .btn-slider-promo-control {
    background-color: rgba(255, 254, 245, .9);
    top: 45%;
}

.slider-product-page .btn-slider-promo-control.prev {
    left: 5px;
}

.slider-product-page .btn-slider-promo-control.next {
    right: 5px;
}

.slider-product-page .btn-slider-promo-control .btn-slider-promo-control-icon {
    transform: scale(0.5);
}

.slider-product-page .btn-slider-promo-control .btn-slider-promo-control-icon.next {
    transform: scale(0.5) rotate(180deg);
}

.slider-product-page-btn-icons {
    position: unset;
}

@media (min-width: 768px) {
    .btn-slider-promo-control.prev {
        left: -40px;
    }

    .btn-slider-promo-control.next {
        /* right: -49px; */
    }

    .btn-slider-promo-control {
        display: flex;
    }
}

@media (min-width: 992px) {

    .slider-product-page-btn-icons {
        position: absolute;
        top: -40px;
        right: 0;
    }

    .btn-slider-promo-control.prev {
        left: -49px;
        right: unset;
    }

    .btn-slider-promo-control.next {
        left: unset;
        right: -40px;
    }

    .btn-slider-promo-control .btn-slider-promo-control-icon {
        width: 40px;
        height: 49px;
    }
}

.price-large {
    font-size: 28px;
    font-weight: 900;
    color: var(--primary-dark);
}

/* Slider Product Page END */

/* Product Page Info Content START*/
.product-page-info-container {
    background-color: var(--grey-light);
    padding: 1rem;
    border-radius: 24px;
}

.product-page-info-container a {
    color: var(--primary-main);
    font-weight: 800;
}

.product-page-info-container .additional-info p {
    margin-bottom: 0;
}

.product-page-info-container .description p {
    font-size: 1.2rem;
    line-height: 1.7rem;
}

.sbp-label {
    color: var(--secondary-darkest);
}

.sbp-price {
    color: var(--primary-dark);
}

.sbp-price-sum {
    font-size: 19px;
}

.sbp-desktop-btns {
    display: none;
}

@media (min-width: 768px) {
    .product-page-info-container {
        padding: 1.5rem 1.7rem;
    }
}

@media (min-width: 1300px) {
    .sbp-desktop-btns {
        display: flex;
    }
}

/* Product Page Info Content END*/


.section-wrapper {
    position: relative;
}

section {
    padding: 1rem 2rem 4rem 2rem;
    position: relative;
}

/* Search Results */
.search-result-item {
    background-color: var(--grey-lightest);
    border-radius: 10px;
    border: 2px solid var(--primary-main);
    overflow: hidden;
    margin-bottom: 1rem;
}

.search-result-item:hover,
.search-result-item:active,
.search-result-item:focus {
    background-color: var(--primary-lightest);
}

.sr-item-head {
    font-size: 19px;
    font-weight: 500;
    color: var(--grey-darkest);
    background-color: var(--primary-lightest);
    padding: .5rem 1rem;
}

.sr-item-content {
    color: var(--primary-darkest);
    line-height: 1.2rem;
    padding: .5rem 1rem;
}

.sr-item-content a.sr-item-content-descr {
    color: var(--primary-darker);
    word-wrap: break-word;
}

.sr-item-content a.sr-item-content-descr:hover {
    text-decoration: underline;
}

.sr-item-content .sr-item-content-descr img {
    border-radius: .5rem;
}

@media (min-width: 1300px) {

    /* container: */
    .search-result-wrapper {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1rem;
        grid-template-rows: 1fr 2.5rem;
    }
}

/*Section basic content types*/
section.section-paragraphs {
    padding: 4rem 2rem 4rem 2rem;
}

section.section-text-image {
    padding: 0 2rem;
    margin-top: 2rem;
    margin-bottom: 2rem;
}

section.section-text-image img {
    width: 100%;
}

@media (min-width: 768px) {
    section.section-text-image {
        margin-top: 3rem;
        margin-bottom: 0;
    }
}

section.content-page h1 {
    font-size: 33px;
    font-weight: 600;
    line-height: 48px;
    text-align: left;
    font-family: Teachers, sans-serif;
    color: var(--grey-darkest);
    margin-bottom: 2rem;
}

section.content-page h2 {
    font-size: 19px;
    font-weight: 500;
    line-height: 32px;
    text-align: left;
    font-family: Teachers, sans-serif;
    color: var(--accent-darkest);
    margin-bottom: 1rem;
}

section.section-bg-primary.content-page h1,
section.section-bg-primary.content-page h2,
section.section-bg-primary.content-page h3,
section.section-bg-primary.content-page h4 {
    color: var(--grey-darkest);
}

@media (min-width: 768px) {
    section.content-page h1 {
        font-size: 48px;
        line-height: 56px;
        margin-bottom: 2rem;
        text-align: left;
    }
}

/* Search results H1 Styling */
section.content-page h1.search-results-headline {
    color: var(--primary-dark);
}

section.content-page h1.search-results-headline .sr-found-for,
section.content-page h1.search-results-headline .sr-term-entry {
    font-size: 19px;
}

section.content-page h1.search-results-headline .sr-term-entry {
    color: var(--primary-main);
}

section.content-page h3,
section.content-page h4 {
    font-family: Teachers, sans-serif;
    font-size: 33px;
    line-height: 2rem;
    font-weight: 600;
    margin-bottom: 1rem;
    margin-top: 0rem;
    color: var(--grey-darkest);
}

section.content-page h4 {
    font-size: 1.3rem;
    margin-bottom: .2rem;
    margin-top: 0rem;
    font-weight: 500;
}

section.section-paragraphs p,
section.content-page p {
    color: var(--grey-darkest);
}

section.section-paragraphs p.smaller-grey-darkest,
section.content-page p.smaller-grey-darkest {
    font-size: 1rem;
    line-height: 1.5rem;
    font-weight: 500;
    color: var(--grey-darkest);
}

section.content-page ul {
    list-style: square;
    padding-left: 1.5rem;
}

section.content-page ol {
    padding-left: 1.5rem
}

section.content-page ul.dropdown-menu,
section.content-page ul.section-slider-items {
    list-style: none;
    padding-left: 0;
}

section.content-page ul li,
section.content-page ol li {
    font-size: 28px;
    line-height: 2.2rem;
    color: var(--darker-gray);
}

section.content-page ul.list-text-p li,
section.content-page ol.list-text-p li {
    font-size: 1.2rem;
}

section.content-page figure.figure-section {
    margin-top: 1.5rem;
}

@media (min-width: 768px) {
    section {
        padding: 1rem 0 1rem 0;
        position: relative;
    }

    section.section-paragraphs {
        padding: 10rem 0 10rem 0;
    }

    section.content-page {
        padding: 0 0 0 0;
    }
}

/*Text only; Add to main-container*/
@media (min-width: 768px) {
    .text-only {
        padding-top: 6rem;
    }
}

/*Text and Image: Text left, single large Image right*/
.text-image-wrapper {
    display: flex;
    flex-direction: column;
}

.text-image-wrapper .text-image-content {
    order: 1;
}

.text-image-wrapper .text-image-image {
    order: 2;
}

@media (min-width: 768px) {
    .text-image-wrapper {
        display: grid;
    }

    .text-image-wrapper .text-image-content {
        order: 0;
    }

    .text-image-wrapper .text-image-image {
        order: 0;
    }
}

.text-image-content {
    padding: 0;
}

.text-image-content-inner {
    padding: 4rem 2rem 4rem 2rem;
    width: 100%;
}

.text-image-image {
    width: 100%;
    height: 500px;
    background-position: top;
    background-size: cover;
    background-repeat: no-repeat;
}

@media (min-width: 768px) {
    .text-image-content-inner {
        padding: 6rem 0px 8rem;
        width: 300px;
    }

    .text-image-content-inner.text-right {
        margin-left: 50px;
    }

    .text-image-content-inner.text-left {
        margin-right: 50px;
    }

    .text-image-image {
        height: 100%;
    }
}

@media (min-width: 992px) {
    .text-image-content-inner {
        width: 370px;
    }

    .text-image-content-inner.text-right {
        margin-left: 60px;
    }

    .text-image-content-inner.text-left {
        margin-right: 60px;
    }
}

@media (min-width: 1300px) {
    .text-image-content-inner {
        width: 500px;
    }

    .text-image-content-inner.text-right {
        margin-left: 120px;
    }

    .text-image-content-inner.text-left {
        margin-right: 120px;
    }

    .full-width-banner-container .full-width-banner-content .banner-text {
        width: 700px;
    }
}

section.section-bg-dark,
section.section-bg-white,
section.section-bg-primary {
    /* background-color: var(--primary-light); */
    padding-bottom: 0;
}

section.section-bg-dark {
    background-color: var(--darker-gray);
}

section.section-bg-primary {
    background-color: var(--grey-light);
}

section.section-bg-white:first-child,
section.section-bg-white:last-child,
section.section-bg-dark:first-child,
section.section-bg-dark:last-child,
section.section-bg-primary:first-child,
section.section-bg-primary:last-child {
    padding-bottom: 5rem;
}

section.section-bg-image,
section.section-bg-red {
    z-index: 3;
}

section.section-bg-image h2,
section.section-bg-image p,
section.section-bg-image ul li,
section.section-bg-dark h2,
section.section-bg-dark p,
section.section-bg-dark ul li,
section.section-bg-primary h2,
section.section-bg-primary ul li,
section.section-bg-primary p {
    color: var(--primary-darkest);
}

section.section-bg-image h2 {
    text-shadow: 2px 2px var(--primary-darkest);
}

section.section-bg-image a {
    color: var(--light-redbrown);
    font-weight: 500;
}


section.section-bg-red h2 {
    color: var(--light-gray);
}

section.section-bg-primary p {
    font-size: 1.6rem;
    line-height: 2.2rem;
    font-weight: 500;
}


.section-bg-image-img,
.section-bg-color-mix-blend {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.section-bg-image-img {
    z-index: 1;
    /*background later inline style for cms ?*/
    /* background: url(); */
    background-size: 100% auto;
}

.section-bg-color-mix-blend {
    z-index: 2;
    /*background-color later inline style for cms*/
    /* background-color: var(--darker-gray); */
    mix-blend-mode: multiply;
}

.section-padding-reset {
    padding: 0;
}

.section-slider {
    position: relative;
}

.section-slider a.btn-section-slider {
    position: absolute;
    top: 47%;
    left: -30px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 30px;
    font-size: 1.5rem;
    color: var(--darker-gray);
}

.section-slider a.btn-section-slider:last-child {
    left: unset;
    right: -30px;
}

.section-slider-item {
    overflow: hidden;
}

ul.section-slider-items {
    list-style: none;
}

li.section-slider-item.info-box a {
    padding: 1.5rem;
    height: 100%;
    background-color: var(--darkest-gray-trans);
    color: var(--white);
}

li.section-slider-item.info-box a h3 {
    font-family: Teachers, sans-serif;
    font-size: 1.3rem;
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 1rem;
    color: var(--darkerst-gray)
}

li.section-slider-item.info-box a h4 {
    font-size: 1.2rem;
    margin-top: 0;
    margin-bottom: 0;
    color: var(--darkerst-gray)
}

li.section-slider-item.info-box .info-box-text {
    line-height: 1.8rem;
    width: 100%;
    display: flex;
    flex-direction: column;
    padding-top: 1rem;
}

li.section-slider-item.info-box .info-box-icon-container {
    width: 80px;
}

li.section-slider-item.info-box .info-box-icon-container img.info-box-icon {
    width: 100%;
}

/* Table-Styled Grid with lables*/
.table-style-section {
    display: flex;
}

.table-style-section .label {
    width: 12rem;
    font-weight: 500;
}

/*Helpers*/

.text-small {
    font-size: 13px !important;
}

.text-color-primary-darkest {
    color: var(--primary-darkest);
}

.text-color-primary-darkest:hover {
    color: var(--primary-darkest);
}

.d-flex {
    display: flex;
}

.d-flex-1300px {
    display: none;
}

.d-none-1300px {
    display: flex;
}

.color-greydarkest {
    color: var(--grey-darkest) !important;
}

@media (min-width: 1300px) {
    .d-flex-1300px {
        display: flex;
    }

    .d-none-1300px {
        display: none;
    }
}

.flex-direction-column {
    flex-direction: column;
}

.flex-direction-column-md {
    flex-direction: column;
}

@media (min-width: 768px) {
    .flex-direction-column-md {
        flex-direction: row;
    }
}

.flex-wrap-wrap {
    flex-wrap: wrap;
}

.justify-content-center {
    justify-content: center;
}

.justify-content-space-around {
    justify-content: space-around;
}

.justify-content-space-between {
    justify-content: space-between;
}

.align-items-center {
    align-items: center;
}

.d-block {
    display: block;
}

.m-auto {
    margin: 0 auto;
}

.overflow-hidden {
    overflow: hidden;
}

.position-relative {
    position: relative;
}

.mt-1 {
    margin-top: 1rem;
}

.mt-2 {
    margin-top: 2rem;
}

.mt-3 {
    margin-top: 3rem;
}

.mt-4 {
    margin-top: 4rem;
}

.mt-5 {
    margin-top: 5rem;
}

.mr-2 {
    margin-right: 2rem;
}

.mb-0 {
    margin-bottom: 0 !important;
}

.mb-1 {
    margin-bottom: 1rem;
}

.mb-2 {
    margin-bottom: 2rem;
}

.mb-2-max-md {
    margin-bottom: 2rem;
}

@media (min-width: 768px) {
    .mb-2-max-md {
        margin-bottom: 0;
    }
}

.mb-3 {
    margin-bottom: 3rem;
}

.mb-4 {
    margin-bottom: 4rem;
}

.mb-5 {
    margin-bottom: 5rem;
}

.ml-0 {
    margin-left: 0 !important;
}

.ml-1 {
    margin-left: 1rem;
}

.pb-5 {
    padding-bottom: 5rem;
}

.bold {
    font-weight: 700;
}

.ratio-1x1 {
    aspect-ratio: 1 / 1;
    width: 100%;
}

.ratio-2x1 {
    aspect-ratio: 2 / 1;
    width: 100%;
}

.ratio-1x2 {
    aspect-ratio: 1 / 2;
    width: 100%;
}

.border-top-left-rad-large {
    border-top-left-radius: 80px !important;
}

.border-top-right-rad-large {
    border-top-right-radius: 80px !important;
}

.border-bottom-left-rad-large {
    border-bottom-left-radius: 80px !important;
}

.border-bottom-right-rad-large {
    border-bottom-right-radius: 80px !important;
}

.border-radius-24 {
    border-radius: 24px;
}

/* position */
.float-left {
    float: left;
}

.cursor-pointer {
    cursor: pointer;
}

/*Animations*/
/*simple parallax*/
.parallax-effect {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.imageBG {
    width: 100%;
    height: 250px;
    background-position: top;
    background-size: cover;
    background-repeat: no-repeat;
}

.fit-content-h {
    height: fit-content;
}

.slider-product-page-small-img-wrapper {
    overflow: hidden;
    width: 384px;
}

.slider-product-page-small-img-wrap {
    display: flex;
    transition: transform 0.3s ease;
}

.slider-product-page-small-img {
    flex: 0 0 25%; /* Jedes Thumbnail nimmt 25% ein (4 Thumbnails = 100%) */
    min-width: 25%;
    opacity: 0.6;
    transition: opacity 0.3s ease;
}

.slider-product-page-small-img:hover,
.slider-product-page-small-img.active {
    opacity: 1;
}

.slider-product-page-small-img img {
    width: 100%;
    height: auto;
    display: block;
}