/* ------------------------------ */
/* ----------- Buttons ---------- */
/* ------------------------------ */

/* General */
.section > .section__button, .section .row > div > .section__button, .section > .section__buttons, .section .row > div > .section__buttons {
    margin-top: 0;
    padding-top: 0;
}
  
.section__button--center, .section__buttons--center {
    text-align: center;
}
  
.section > .section__title + .section__button .button, .section > .section__title + .section__buttons .button {
    margin-top: 0;
}

.section__buttons .button, .buttons .button {
    display: inline-block;
}
  
.section__buttons .button, .buttons .button {
    margin-right: var(--spacing-6);
}
  
.section__buttons .button:last-child, .buttons .button:last-child {
    margin-right: 0;
}


/* Button */
.button a, button, .button {
    position: relative;
    display: inline-block;
    -webkit-transition: color var(--transition-2);
    -o-transition: color var(--transition-2);
    transition: color var(--transition-2);
}

button {
    cursor: pointer;
    padding: 0;
    line-height: var(--line-height-1);
    background-color: transparent;
    border: 0;
}

.button.button--white a, .button--white button {
    color: var(--brand-white);
}

.button--normal a, .button--normal > span, .quform-button-next span, .quform-button-back span, .quform-button-submit span, .button--big a, .button--big span,
a.skip-link:focus-visible, a.skip-link:focus {
    font-weight: 800;
    text-transform: uppercase;
    color: var(--brand-black);
    -webkit-transition: background-color var(--transition-2), color var(--transition-2);
    -o-transition: background-color var(--transition-2), color var(--transition-2);
    transition: background-color var(--transition-2), color var(--transition-2);
}

.button--normal a, .button--normal > span, .button--big a, .button--big span, .quform-button-next span, .quform-button-submit span,
a.skip-link:focus-visible, a.skip-link:focus {
    background-color: var(--brand-turquoise);
}

.quform-button-back span {
    background-color: var(--brand-grey);
}

.button--normal > span, .button--big span, .quform-button-next span, .quform-button-back span, .quform-button-submit span {
    display: block;
    cursor: pointer;
}

.no-touchevents .button--normal a:hover, .no-touchevents .button--normal > span:hover,
.no-touchevents .button--big a:hover, .no-touchevents .button--big span:hover, .no-touchevents .quform-button-next span:hover,
.no-touchevents .quform-button-back span:hover, .no-touchevents .quform-button-submit span:hover {
    background-color: var(--brand-black);
    color: var(--brand-white);
}


/* Arrow */
.button--arrow a, .button--arrow button {
    -webkit-transition: padding var(--transition-1), color var(--transition-2);
    -o-transition: padding var(--transition-1), color var(--transition-2);
    transition: padding var(--transition-1), color var(--transition-2);
}

.no-touchevents .button:not(.button_back).button--arrow a:hover, .no-touchevents .quform-submit:hover {
    color: var(--brand-red);
}

.button--arrow span {
    font-size: var(--font-size-2);
    text-transform: uppercase;
    font-weight: 800;
}

.button--arrow .icon {
    position: absolute;
    top: 50%;
    right: 0;
}



/* Border */
.button--border a {
    font-size: var(--font-size-standard);
    font-weight: 800;
    text-transform: uppercase;
    border: 6px solid;
    padding: 6px 10px 5px;
    -webkit-transition: var(--transition-2);
    -o-transition: var(--transition-2);
    transition: var(--transition-2);
}

.button--border:not(.button--white) a {
    color: var(--brand-black);
}

.button--border.button--white a {
    color: var(--brand-white);
}

.no-touchevents .button--border:not(.button--white) a:hover {
    background-color: var(--brand-black);
    border-color: var(--brand-black);
    color: var(--brand-white);
}

.no-touchevents .button--border.button--white a:hover {
    background-color: var(--brand-white);
    border-color: var(--brand-white);
    color: var(--brand-red);
}


/* ------------------------------ */
/* -------- Media Queries ------- */
/* ------------------------------ */

@media all and (min-width: 768px) {

    .button--arrow a, .button--arrow button {
        padding: 5px 54px 5px 0;
    }

    .no-touchevents .button:not(.button_back).button--arrow a:hover {
        padding-right: 62px;
    }

}

@media all and (min-width: 992px) {

    .button--normal a, .button--normal > span, .quform-button-next span, .quform-button-back span, .quform-button-submit span,
    a.skip-link:focus-visible, a.skip-link:focus {
        font-size: var(--font-size-standard);
    }

}


@media all and (min-width: 1240px) {

    .button--arrow .icon {
        -webkit-transform: translateY(calc(-50% + 1px));
        -ms-transform: translateY(calc(-50% + 1px));
        transform: translateY(calc(-50% + 1px));
    }

}


@media all and (min-width: 1400px) {

    .section > div.section__text + .section__button {
        padding-top: var(--spacing-8);
    }

    .button--normal a, .button--normal > span, .quform-button-next span, .quform-button-back span, .quform-button-submit span,
    a.skip-link:focus-visible, a.skip-link:focus {
        padding: 7px 18px 6px;
    }

    .macos .button--normal a, .macos .button--normal > span, .macos .quform-button-next span, .macos .quform-button-back span, .macos .quform-button-submit span,
    .ios .button--normal a, .ios .button--normal > span, .ios .quform-button-next span, .ios .quform-button-back span, .ios .quform-button-submit span {
        padding: 6px 18px 7px;
    }

    .button--big a, .button--big span {
        font-size: var(--font-size-4);
        padding: 8px 24px;
    }

    .macos .button--arrow .icon, .ios .button--arrow .icon {
        margin-top: 2px;
    }

}


@media all and (max-width: 1399.98px) and (min-width: 1240px) {

    .section > div.section__text + .section__button {
        padding-top: var(--spacing-7);
    }

    .button--normal a, .button--normal > span, .quform-button-next span, .quform-button-back span, .quform-button-submit span,
    a.skip-link:focus-visible, a.skip-link:focus {
        padding: 7px 16px 6px;
    }

    .macos .button--normal a, .macos .button--normal > span, .macos .quform-button-next span, .macos .quform-button-back span, .macos .quform-button-submit span,
    .ios .button--normal a, .ios .button--normal > span, .ios .quform-button-next span, .ios .quform-button-back span, .ios .quform-button-submit span {
        padding: 6px 16px 7px;
    }

    .button--big a, .button--big span {
        font-size: var(--font-size-3);
        padding: 8px 20px;
    }

}


@media all and (max-width: 1239.98px) and (min-width: 992px) {

    .section > div.section__text + .section__button {
        padding-top: var(--spacing-7);
    }

    .button--normal a, .button--normal > span, .quform-button-next span, .quform-button-back span, .quform-button-submit span,
    a.skip-link:focus-visible, a.skip-link:focus {
        padding: 7px 15px;
    }

    .button--arrow .icon {
        -webkit-transform: translateY(calc(-50% + 1px)) scale(.95);
        -ms-transform: translateY(calc(-50% + 1px)) scale(.95);
        transform: translateY(calc(-50% + 1px)) scale(.95);
    }

    .button--big a, .button--big span {
        font-size: var(--font-size-3);
        padding: 8px 19px 7px;
    }

    .macos .button--big a, .macos .button--big span, .ios .button--big a, .ios .button--big span {
        padding-bottom: 8px;
    }

}


@media all and (max-width: 991.98px) {

    .button--normal a, .button--normal > span, .quform-button-next span, .quform-button-back span, .quform-button-submit span,
    a.skip-link:focus-visible, a.skip-link:focus {
        font-size: var(--font-size-standard-small);
    }

}


@media all and (max-width: 991.98px) and (min-width: 768px) {

    .section > div.section__text + .section__button {
        padding-top: var(--spacing-7);
    }

    .button--normal a, .button--normal > span, .quform-button-next span, .quform-button-back span, .quform-button-submit span,
    a.skip-link:focus-visible, a.skip-link:focus {
        padding: 7px 15px;
    }

    .button--arrow .icon {
        -webkit-transform: translateY(calc(-50% + 1px)) scale(.9);
        -ms-transform: translateY(calc(-50% + 1px)) scale(.9);
        transform: translateY(calc(-50% + 1px)) scale(.9);
    }

    .button--big a, .button--big span {
        font-size: var(--font-size-3);
        padding: 8px 19px 7px;
    }

    .macos .button--big a, .macos .button--big span, .ios .button--big a, .ios .button--big span {
        padding-bottom: 8px;
    }

}


@media all and (max-width: 767.98px) {

    .section > div.section__text + .section__button {
        padding-top: var(--spacing-7);
    }

    .button--normal a, .button--normal > span, .quform-button-next span, .quform-button-back span, .quform-button-submit span,
    a.skip-link:focus-visible, a.skip-link:focus {
        padding: 7px 13px;
    }

    .button--arrow a, .button--arrow button {
        padding: 5px 52px 5px 0;
    }

    .no-touchevents .button:not(.button_back).button--arrow a:hover {
        padding-right: 57px;
    }

    .button--arrow .icon {
        -webkit-transform: translateY(calc(-50% + 1px)) scale(.85);
        -ms-transform: translateY(calc(-50% + 1px)) scale(.85);
        transform: translateY(calc(-50% + 1px)) scale(.85);
    }

    .button--big a, .button--big span {
        font-size: var(--font-size-3);
        padding: 7px 15px 6px;
    }

    .macos .button--big a, .macos .button--big span, .ios .button--big a, .ios .button--big span {
        padding-bottom: 7px;
    }

}


@media all and (max-width: 767.98px) {

    .macos .button--normal a, .macos .button--normal > span, .macos .quform-button-next span, .macos .quform-button-back span, .macos .quform-button-submit span,
    .ios .button--normal a, .ios .button--normal > span, .ios .quform-button-next span, .ios .quform-button-back span, .ios .quform-button-submit span {
        padding-top: 6px;
    }

}