.button_1,.button_1-gradient {
    -webkit-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out
}

.button_1-gradient:after,.button_1-gradient:before,.button_1:after,.button_1:before {
    content: "";
    height: 100%;
    position: absolute;
    top: 0;
    -webkit-transition: width .5s ease;
    transition: width .5s ease;
    width: 0;
    z-index: 0
}

.button_1-gradient:before,.button_1:before {
    left: 0
}

.button_1-gradient:after,.button_1:after {
    right: 0
}

.button_1 span,.button_1 svg,.button_1-gradient span,.button_1-gradient svg {
    position: relative;
    z-index: 1
}

.vAll-button.button_1,.vAll-button_footer-secondary.button_1,.vAll-button_footer.button_1,.vAll-button_header-secondary.button_1,.vAll-button_header.button_1,.vAll-button_hero.button_1 {
    background-color: var(--button-bg);
    color: var(--button-color)
}

.vAll-button.button_1:after,.vAll-button.button_1:before,.vAll-button_footer-secondary.button_1:after,.vAll-button_footer-secondary.button_1:before,.vAll-button_footer.button_1:after,.vAll-button_footer.button_1:before,.vAll-button_header-secondary.button_1:after,.vAll-button_header-secondary.button_1:before,.vAll-button_header.button_1:after,.vAll-button_header.button_1:before,.vAll-button_hero.button_1:after,.vAll-button_hero.button_1:before {
    background: var(--button-hover-bg)
}

.vAll-button.button_1-gradient,.vAll-button_footer-secondary.button_1-gradient,.vAll-button_footer.button_1-gradient,.vAll-button_header-secondary.button_1-gradient,.vAll-button_header.button_1-gradient,.vAll-button_hero.button_1-gradient {
    background: -webkit-gradient(linear,left top,right top,from(var(--gradient-color-1)),color-stop(50%,var(--gradient-color-2)),to(var(--gradient-color-3)));
    background: linear-gradient(90deg,var(--gradient-color-1) 0,var(--gradient-color-2) 50%,var(--gradient-color-3) 100%);
    color: var(--button-color)
}

.vAll-button.button_1-gradient:before,.vAll-button_footer-secondary.button_1-gradient:before,.vAll-button_footer.button_1-gradient:before,.vAll-button_header-secondary.button_1-gradient:before,.vAll-button_header.button_1-gradient:before,.vAll-button_hero.button_1-gradient:before {
    background: -webkit-gradient(linear,left top,right top,from(var(--gradient-hover-color-1)),color-stop(50%,var(--gradient-hover-color-2)),to(var(--gradient-hover-color-3)));
    background: linear-gradient(90deg,var(--gradient-hover-color-1) 0,var(--gradient-hover-color-2) 50%,var(--gradient-hover-color-3) 100%)
}

.vAll-button.button_1-gradient:after,.vAll-button_footer-secondary.button_1-gradient:after,.vAll-button_footer.button_1-gradient:after,.vAll-button_header-secondary.button_1-gradient:after,.vAll-button_header.button_1-gradient:after,.vAll-button_hero.button_1-gradient:after {
    background: -webkit-gradient(linear,left top,right top,from(var(--gradient-hover-color-3)),color-stop(50%,var(--gradient-hover-color-2)),to(var(--gradient-hover-color-1)));
    background: linear-gradient(90deg,var(--gradient-hover-color-3) 0,var(--gradient-hover-color-2) 50%,var(--gradient-hover-color-1) 100%)
}

.vAll-button_secondary.button_1 {
    background-color: var(--secondary-button-bg);
    color: var(--secondary-button-color)
}

.vAll-button_secondary.button_1:after,.vAll-button_secondary.button_1:before {
    background: var(--secondary-button-hover-bg)
}

.vAll-button_secondary.button_1-gradient {
    background: -webkit-gradient(linear,left top,right top,from(var(--gradient2-color-1)),color-stop(50%,var(--gradient2-color-2)),to(var(--gradient2-color-3)));
    background: linear-gradient(90deg,var(--gradient2-color-1) 0,var(--gradient2-color-2) 50%,var(--gradient2-color-3) 100%);
    color: var(--secondary-button-color)
}

.vAll-button_secondary.button_1-gradient:before {
    background: -webkit-gradient(linear,left top,right top,from(var(--gradient-hover-color-1)),color-stop(50%,var(--gradient-hover-color-2)),to(var(--gradient-hover-color-3)));
    background: linear-gradient(90deg,var(--gradient-hover-color-1) 0,var(--gradient-hover-color-2) 50%,var(--gradient-hover-color-3) 100%)
}

.vAll-button_secondary.button_1-gradient:after {
    background: -webkit-gradient(linear,left top,right top,from(var(--gradient-hover-color-3)),color-stop(50%,var(--gradient-hover-color-2)),to(var(--gradient-hover-color-1)));
    background: linear-gradient(90deg,var(--gradient-hover-color-3) 0,var(--gradient-hover-color-2) 50%,var(--gradient-hover-color-1) 100%)
}

@media not all and (pointer: coarse) {
    .button_1-gradient:hover:after,.button_1-gradient:hover:before,.button_1:hover:after,.button_1:hover:before {
        width:50%
    }

    .vAll-button.button_1-gradient:hover,.vAll-button.button_1:hover,.vAll-button_footer-secondary.button_1-gradient:hover,.vAll-button_footer-secondary.button_1:hover,.vAll-button_footer.button_1-gradient:hover,.vAll-button_footer.button_1:hover,.vAll-button_header-secondary.button_1-gradient:hover,.vAll-button_header-secondary.button_1:hover,.vAll-button_header.button_1-gradient:hover,.vAll-button_header.button_1:hover,.vAll-button_hero.button_1-gradient:hover,.vAll-button_hero.button_1:hover {
        color: var(--button-hover-color)
    }

    .vAll-button_secondary.button_1-gradient:hover,.vAll-button_secondary.button_1:hover {
        color: var(--secondary-button-hover-color)
    }
}