Alignment for added "checkout" button that shows under "add-to-cart"

Site URL: http://demeriflowers.com

Can someone help me figure out how to get the second button ("checkout") to align to the left, like the "add-to-cart" button above it?

This is the code I pasted into the Footer, via Advanced>Code Injection:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<script>
$(document).ready(function(){
  $(".sqs-add-to-cart-button").one("click", function(){
    $("<a class='checkoutbutton' href='/commerce/show-cart'>CHECKOUT</a>").insertAfter(".sqs-add-to-cart-button");
});
  });
</script>

And this is the corresponding styling I added to the Design>CustomCSS section:

.checkoutbutton {
  display:block;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 2px;
  color:#000000;
  font-weight: 500;
  font-style: normal;
  line-height: normal;
  opacity:1;
  text-align: center;
  width: auto;
  height: auto;
  text-decoration: none;
  padding: 0px 20px;
  background-color: white;
  border-radius: 3px;
  transition: .1s opacity linear;
  cursor: pointer;
  border-color: #000000;
  border-width:2px;
  border-style:solid;
  margin-top:10px;} 
.checkoutbutton:hover {color: #fff; background-color: #000000;}

************

I don't know if this other code is interfering, that I'm also using to add buttons to my product description from the "additional information":

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
  $(document).ready(function() { 
        $('section.ProductItem-additional .button-block').appendTo('.ProductItem-details .sqs-add-to-cart-button-wrapper');
    });
</script>
 

And in Custom CSS section for those:

/* button design for additional buttons after add-to-cart button on product pages*/
.checkoutbutton {
 font-family:'Julius Sans One'!important;
 font-size: 14px!important;
 color: #000000!important;
 font-weight: normal;
 font-style: normal;
 text-align: center;
 text-decoration: none;
 min-width: 8ch!important;
  max-width: 10ch!important;
 padding: 1.05em 1.3em!important;
 background-color: #ffffff;
 margin: 15px;
 border-style: solid!important;
 border-width: 2px!important;
 border-radius: 3px!important;
}

.checkoutbutton:hover {
 color: #ffffff!important;
 background-color: #000000!important;
 border-style: solid!important;
 border: 2px solid #000000;
}

Quote

/* button design for additional buttons after add-to-cart button on product pages*/
.checkoutbutton {
 font-family:'Julius Sans One'!important;
 font-size: 14px!important;
 color: #000000!important;
 font-weight: normal;
 font-style: normal;
 text-align: center;
 text-decoration: none;
 min-width: 8ch!important;
  max-width: 10ch!important;
 padding: 1.05em 1.3em!important;
 background-color: #ffffff;
 margin: 15px;
 border-style: solid!important;
 border-width: 2px!important;
 border-radius: 3px!important;
}

.checkoutbutton:hover {
 color: #ffffff!important;
 background-color: #000000!important;
 border-style: solid!important;
 border: 2px solid #000000;
}

In this code change margin: 15px; to margin: 0px;

Let me know if thats what you wanted.