Hi Roy, there's no background-color for the Submit button... only border that I could change but i need to change the entire background colour . See below html:
<form data-template-id="c8453286-d610-4f84-9b28-ed82da4cf8e1" class="one-column-form" data-container="true">
<style>
div[data-editorblocktype=Field-radioButtons] {
width:25%;
}
div[data-editorblocktype=Field-radioButtons] input {
width: auto;
height: auto;
margin-bottom: 3px;
float: right;
}
div[data-editorblocktype=Field-checkboxList] input,
div[data-editorblocktype=Field-checkbox] input {
width: auto;
height: auto;
margin-bottom: 3px;
margin-right: 8px;
float: left;
}
div[data-editorblocktype=Field-checkboxList] span.lp-checkboxListItem,
div[data-editorblocktype=Field-radioButtons] span.lp-radioButton {
/* This rule is needed to style all radio button fields. For product constraints each option is defined as input and label wrapped into a span*/
display: block;
margin: 2px;
}
form {
padding: 22px;
margin: 0 auto;
}
.one-column-form {
max-width: 450px;
}
.lp-form-header {
font-weight: bold;
margin-bottom: 21px;
}
label {
margin: 0;
}
input {
border-radius: 3px;
border: 1px solid #333333;
height: 40px;
width: 100%;
margin-bottom: 28px;
text-indent: 10px;
}
input[type="radio"] {
width: 1.5em;
height: 1.5em;
display: inline-block;
margin: 0 5px 0 0;
}
input[type=checkbox] {
width: 1.5em;
height: 1.5em;
display: inline-block;
margin: 0 5px 0 0;
vertical-align: middle;
}
select {
border-radius: 3px;
border: 1px solid #333333;
height: 40px;
width: 100%;
margin-bottom: 28px;
}
textarea {
border-radius: 3px;
border: 1px solid #333333;
width: 100%;
margin-bottom: 28px;
height: 120px;
overflow: auto;
}
button {
border-radius: 3px;
border: 1px solid #fa7c1e;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
height: 60px;
vertical-align: bottom;
margin-top: 12px;
font-weight: bold;
text-transform: uppercase;
}
</style>
<div class="wrapperContainer" data-container="true">
<div data-editorblocktype="Text">
<p class="lp-form-header">
[Form heading]
</p>
</div>
<div data-editorblocktype="Field-text">
<div class="marketing-field">
<div class="lp-form-field">
<label class="lp-label lp-ellipsis" for="3f746946-34b4-442c-a677-e232cdd2bc40" title="">
First Name
</label>
<input class="lp-form-fieldInput" id="3f746946-34b4-442c-a677-e232cdd2bc40" name="3f746946-34b4-442c-a677-e232cdd2bc40" placeholder="First" title="" type="text" value="">
</div>
</div>
</div>
<div data-editorblocktype="Field-text">
<div class="marketing-field">
<div class="lp-form-field">
<label class="lp-label lp-ellipsis" for="e1dfc514-f301-4cb2-855a-4c8fa8331207" title="">
Last Name
</label>
<input class="lp-form-fieldInput" id="e1dfc514-f301-4cb2-855a-4c8fa8331207" name="e1dfc514-f301-4cb2-855a-4c8fa8331207" placeholder="Last" title="" type="text" value="">
</div>
</div>
</div>
<div data-editorblocktype="Field-email">
<div class="marketing-field">
<div class="lp-form-field">
<label class="lp-label lp-ellipsis" for="7f685ebb-7c54-4cff-a1bc-772562d25c38" title="">
Email
</label>
<span class="lp-required" style="color: rgb(255, 0, 0);">
*
</span>
<input arai-required="true" class="lp-form-fieldInput" id="7f685ebb-7c54-4cff-a1bc-772562d25c38" name="7f685ebb-7c54-4cff-a1bc-772562d25c38" placeholder="Email" required="required" title="" type="email" value="">
</div>
</div>
</div>
</div>
<div class="wrapperContainer" data-container="true">
<div data-editorblocktype="SubmitButtonBlock">
<div class="lp-form-field">
<button class="lp-form-button lp-form-fieldInput" name="submit2a115e8b-ee65-4c7c-bdc0-87a08982bd7e" type="submit">
Submit
</button>
</div>
</div>
</div>
</form>
