Buy it Now button automatically fades, a faded color of the original color appears.

[yourmojo]

I am using Debutify theme. I dont know what causes this to happen but the Buy it Now button automatically changes color to a faded version of the color set by me. Example black turns grey, red turn lighter shade of red. the outline of button while hovering also does the same thing.

Also the position of Buy it now button has shifted slightly upwards.

URL: www.yourmojo.in

No password

I am using custom style to change the text and color of the button. (Before this script also i had the same problem). Add to cart button has no issues regarding color. 

I will give you custom style i am using in theme setting directly.

.shopify-payment-button__button--unbranded {
    font-size: 0 !important;
    background: black !important;
    color: white !important;        
}
.shopify-payment-button__button--unbranded::before {
    content: 'Order Now - ONLINE PAYMENT \A'; /* Add line break (\A) to stack the lines */
    position: initial;
    visibility: visible;
    top: 0;
    left: 0;
    bottom: 0;
    font-size: 16px;
    display: block;
    white-space: pre; /* Preserve whitespace to render the line break */
}

.shopify-payment-button__button--unbranded::after {
    content: '';
    color: red; /* Change the color of the text after the line break */
    font-size: 16px;
font-weight: bold; /* Adjust the font size if needed */
    display: block;
}

 Even if i remove this code same problem i am having from sometime.

Image with style

Image without style

I dont know why the button has shifted upwards and faded/overlay color.

Please help!