Moving Add to Cart button next to Quantity

Hello.

I want to place the Add To Cart button next to the Quantity input on the product details page here:

https://www.skinnies.co.uk/skinnies-shop/p/skinnies-long-island-iced-tea

I've found this code on the forum from a previous thread ( https://forum.squarespace.com/topic/178145-moving-add-to-cart-next-to-quantity-input-squarespace-71/ ) but while it's resizing the button, as you can see from the screenshots it's not actually moving either element.

/* add to cart next to quantity */
@media screen and (min-width:768px) {
.sqs-add-to-cart-button-wrapper {
    width: 70% !important;
    float: left;
    margin-bottom: 0 !important;
    position: relative;
    bottom: -25px;
}
.product-quantity-input {
    width: 30% !important;
    float: left !important;
}
}

I've removed the code again for now, but as I have also reordered the product item details I wondered if this is why the above code isn't having the desired effect.

Any ideas?

Thanks again.

Try adding to Design > Custom CSS

@media screen and (max-width:767px) {
.product-quantity-input {
    width: 30% !important;
    float: left !important;
}
.sqs-add-to-cart-button-wrapper {
    width: 65% !important;
    float: left !important;
    position: relative;
    top: -90px;
    right: -115px;
}
}