CSS Wont Take effect?

trying to stylize my embed add to cart button with css, it shows exactly how i want it while im in the css panel but as soon as i reload the site it returns to default. any ideas how to help? heres the code

.payhip-add-to-cart-button {
  background-color: black !important;
  background-image: none !important;
  color: white !important;
  border-radius: 0px !important;
}

.payhip-add-to-cart-button {
    font-family: 'bebas-neue' !important;
    box-shadow: none !important;
    padding: 5px 150px !important;
  text-transform: uppercase !important;
  font-size: 25px !important;
  font-weight: 200 !important;
  white-space: nowrap !important;

}

.payhip-add-to-cart-button:hover {
  background-color: white !important;
  color: black !important;
  border: 1px solid black !important;

}

Styling an embed with the Custom CSS is problematic as the embed will likely load after the HTML and after the Custom CSS, which means that it won't be applied. You could try adding the styling code to the code block with the embed code and after it (wrapped in style tags) to see if that allows the CSS to run at the correct time.

thank you for the reply ziggy, i will try that!