I need help fixing my custom CSS that is no longer working properly for the form block on this page: https://stephanie-elizabeth.com/inner-sanctuary-guided-meditation
This is the code I have in place currently:
// lightbox form styling //
.form-wrapper {
border: 2px solid #F4EEE8;
padding: 20px;
background: #F4EEE8;
}
.form-wrapper .field-list .field .field-element {
padding: 14px;
background: #FFFEFA;
border-radius: 0;
}
.form-wrapper .field-list .title {
display: block;
color: #4D4472;
}
.form-wrapper .field-list .field .caption {
color: #4D4472;
}
.form-wrapper .field-list .description {
font-style: italic;
color: #4D4472;
}
.sqs-modal-lightbox-content .lightbox-inner .lightbox-content .lightbox-close {
color: #4D4472;
}
.sqs-modal-lightbox-content .lightbox-inner .lightbox-content .form-wrapper .form-title {
color: #A991AE;}
.sqs-modal-lightbox-content .lightbox-inner .lightbox-content .form-wrapper {
color: #4D4472;
}
.form-wrapper input[type=submit] {
background-color: #A991AE;
font-family: Montserrat;
font-weight: 700;
font-style: normal;
text-transform: uppercase;
letter-spacing: .3em;
border-radius: 5em;
}
.form-wrapper input[type=submit]:hover {box-shadow: 0px 2px 5px rgba(0,0,0,.3)}
This button looks the way it should:
I want this "Get Access Now" submit button on the form to look the same as the "Download the Meditation" button above, and previously it did. But for some reason the button background color is no longer displaying properly:
What do I need to tweak to get this fixed?