Give Your Buttons a 50% Opacity Hover State

Give Your Buttons a 50% Opacity Hover State

This modification creates a smooth hover animation. Your buttons will transition to 50% opacity upon hover to give the user a subtle interaction cue using this CSS. To add this change, simply just copy and paste the following code into the Custom CSS box in ePanel and click Save. If you decide to change back to the original style, simply delete the code from the Custom CSS field.

/*DIVI CTA BUTTONS - HOVER*/
 
.et_pb_promo_button, .et_pb_newsletter_button, a.et_pb_more_button, .et_pb_pricing_table_button {
    -moz-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
 
.et_pb_promo_button:hover, .et_pb_newsletter_button:hover, a.et_pb_more_button:hover, .et_pb_pricing_table_button:hover {
    opacity:.75;
}