-
ninaonlineAsked on May 16, 2014 at 12:25 PM
Hello,
I want to change the light yellow background of the Contact Form with Blue Envelope Theme to white? I am not talking about the background color behind the form (currently white), which can be changed in the JotForm editor in Form Style > Background.
Thanks,
Nina
-
Jeanette JotForm SupportReplied on May 16, 2014 at 3:35 PM
You cannot change the yellow color, as this is an image, sliced in 3 files:
https://shots.jotform.com/elton/images/bg_envelope_02.gifhttps://shots.jotform.com/elton/images/bg_envelope_wrapper.gif
https://shots.jotform.com/elton/images/bg_envelope_11.gif
So you must download the images, and edit them with a photo editor (such as Photoshop or GIMP) in order to change the color.
Once you are done, upload them, get the URL (you can use dropbox or gdrive), and replace the URL files in the Custom CSS code, make sure you keep the format (gif)
.form-all{
padding-top: 0;
font-family:"Verdana", sans-serif;
}
/*--red border on error--*/
.form-validation-error {
border: 1px solid #FFB0B0 !important;
}
/*---form textbox styles fixed---*/.form-textarea, .form-textbox {
border: 1px solid #b7bbbd;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
padding: 4px;
background:transparent !important;
width:100%;
-webkit-appearance: none;
-webkit-box-shadow: inset 0 0 4px rgba(0,0,0,0.2), 0 1px 0 rgb(255,255,255);
-moz-box-shadow: inset 0 0 4px rgba(0,0,0,0.2), 0 1px 0 rgb(255,255,255);
box-shadow: inset 0 0 4px rgba(0,0,0,0.2), 0 1px 0 rgb(255,255,255);
border: 1px solid #AEAEAE;
color: #333;
font-family:"Verdana", sans-serif;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}ul.form-section li.form-line:first-child {
background:url('https://shots.jotform.com/elton/images/bg_envelope_02.gif') no-repeat 0 2px;
}.form-line{
background:url('https://shots.jotform.com/elton/images/bg_envelope_wrapper.gif') repeat-y;
}/*---remove error message---*/
.form-error-message {
display: none !important;
}
.form-line-error {
background: url('https://shots.jotform.com/elton/images/bg_envelope_wrapper.gif') repeat-y;
}/*---submit button move--*/
.form-submit-button{
margin-top:60px;
cursor: pointer;}.form-textarea:focus, .form-textbox:focus{
outline:none !important;
}/*--fix captcha--*/.form-captcha .form-textbox{
width:130px !important;
}
.form-line {
padding: 6px 28px 6px 30px;
width: auto;
}
.form-buttons-wrapper{
text-align:center !important;
background: url('https://shots.jotform.com/elton/images/bg_envelope_11.gif') no-repeat 32px -10px;
height: 315px;
margin: -10px -100px -8px -100px;
}
.form-button-error {
position: absolute;
top: 120px;
left: 131px;
width: 195px;
} -
safaReplied on July 17, 2015 at 7:07 PM