Need help changing the checkbox colour when clicked with embedded Marketo form on our landing page. Current it is green (old brand), and I need it to remain white, until clicked then #AC88FF purple
Here's the current code:
/* Add your custom CSS below */
a {
color: #A2A1A1 !important;
}
@media screen and (min-width:1px) {
/* Begin Fluid Marketo Forms CSS | paste this into the Custom CSS input */
/* hide these elements */
form.mktoForm .mktoOffset,
form.mktoForm .mktoGutter {
display:none !important;
}
/* form element */
form.mktoForm {padding:20px; box-sizing:border-box;}
/* all form child elements */
form.mktoForm * {font-size: inherit !important; box-sizing:border-box;}
/* make these elements fluid (override fixed widths) */
form.mktoForm,
form.mktoForm .mktoFormRow,
form.mktoForm .mktoButtonRow,
form.mktoForm .mktoFormCol,
form.mktoForm .mktoFieldWrap,
form.mktoForm label.mktoLabel,
form.mktoForm input[type=url],
form.mktoForm input[type=text],
form.mktoForm input[type=date],
form.mktoForm input[type=tel],
form.mktoForm input[type=email],
form.mktoForm input[type=number],
form.mktoForm textarea.mktoField,
form.mktoForm select.mktoField,
form.mktoForm .mktoLogicalField {
width: 100% !important;
}
/* labels */
form.mktoForm label.mktoLabel {
padding-bottom: .5em !important;
font-weight: bold;
}
/* required asterix */
form.mktoForm .mktoAsterix {
float: left !important;
margin-left: -1em !important;
}
/* inputs */
form.mktoForm input[type=url],
form.mktoForm input[type=text],
form.mktoForm input[type=date],
form.mktoForm input[type=tel],
form.mktoForm input[type=email],
form.mktoForm input[type=number],
form.mktoForm textarea.mktoField,
form.mktoForm select.mktoField {
padding: .5em .75em !important;
min-height: 2.5em; /* set input heights */
height: auto !important; /* override */
}
/* checkbox & radio labels */
form.mktoForm .mktoCheckboxList,
form.mktoForm .mktoRadioList {
box-sizing: border-box;
width: 100% !important;
padding: 0 !important;
color: 000 !important;
width:auto !important;
float:left !important;
clear:none !important;
}
form.mktoForm .mktoRadioList label[for],
form.mktoForm .mktoCheckboxList label[for] {
width:100% !important;
margin: 0px !important;
padding: 0 0 .5em 1.75em;
color: 000 !important;
width:auto !important;
float:left !important;
clear:none !important;
}
/* checkbox & radio inputs */
form.mktoForm input[type=checkbox],
form.mktoForm input[type=radio] {
height:1.25em !important;
width:1.25em !important;
text-align: left !important;
color: 000 !important;
}
/* button */
form.mktoForm .mktoButtonWrap {
margin-left: 0 !important; /* override */
width: 100% !important;
color: #611EEC !important;
display: block !important;
text-align: center !important; /* center button */
padding-top: 10px; /* optional space above the button */
}
form.mktoForm button.mktoButton {
display: inline-block !important;
background: #611EEC !important; /* button bg color */
color: #fff !important; /* button text color */
border:2px solid transparent !important; /* button border color */
padding: .5em 2.75em;
font-size:1.2em !important;
line-height:1.2em !important;
}
form.mktoForm button.mktoButton:hover {
background: #AC08FF !important; /* button bg color on hover */
color: #fff !important; /* button text color on hover */
border-color: #AC08FF !important; /* button border color on hover */
}
} /* end 1px+ (mobile) styles */
/* RESPONSIVE STYLES */
@media screen and (min-width:480px) {
form.mktoForm.mktoLayoutLeft label.mktoLabel {
width:30% !important; /* set label width for labels-left setup */
}
form.mktoForm.mktoLayoutLeft input[type=url],
form.mktoForm.mktoLayoutLeft input[type=text],
form.mktoForm.mktoLayoutLeft input[type=date],
form.mktoForm.mktoLayoutLeft input[type=tel],
form.mktoForm.mktoLayoutLeft input[type=email],
form.mktoForm.mktoLayoutLeft input[type=number],
form.mktoForm.mktoLayoutLeft textarea.mktoField,
form.mktoForm.mktoLayoutLeft select.mktoField,
form.mktoForm.mktoLayoutLeft .mktoCheckboxList,
form.mktoForm.mktoLayoutLeft .mktoRadioList {
width: 70% !important; /* set input width for labels-left setup */
}
} /* end @ 768+ */
.png)