Riverworks Logo

Basic Jotform Styles

Code SnippetsJotform

/*Remove background, box shadow, max-width*/
body, .supernova, .jotform-form .form-all, .form-all {
  background: none !important;
  box-shadow: none;
  max-width: 100%;
}

/*Remove extra padding around form*/
body, .jotform-form .page-section, .page-section, .jotform-form .form-all, .form-all {
  padding: 0;
  margin: 0;
}

/*Set your own padding/margin for fields*/
.jotform-form .form-line, .form-line {
  margin: 0 0 10px !important;
  padding: 0 !important;
}

/*Remove Label*/
/*form.jotform-form .form-label {*/
/*  display: none;*/
/*}*/

/*Align asterisk label to left*/
.jotform-form .form-line, .form-line {
  flex-wrap: nowrap;
}

.jotform-form .form-label, .form-label {
  width: 10px;
  margin-right: 10px;
}

/*Add padding between side-by-side columns*/
.jotform-form .form-line.form-line-column:nth-of-type(odd), .form-line.form-line-column:nth-of-type(odd) {
  padding-right: 10px !important;
  width: 50%;
}

.jotform-form .form-line.form-line-column:nth-of-type(even), .form-line.form-line-column:nth-of-type(even) {
  padding-left: 10px !important;
  width: 50%;
}

.jotform-form .form-input, .form-input {
  width: 100%;
}

/*Remove extra podding and border around button*/
.jotform-form .form-buttons-wrapper, .form-buttons-wrapper {
  padding: 0;
  margin: 0;
  border: none;
}

/*Custom button styles*/
.jotform-form .submit-button, .submit-button {
  background-color: #102A43;
  transition: 0.5s ease-in-out;
  border: none;
}

.jotform-form .submit-button:hover, .submit-button:hover {
  background-color: #0074D9;
  transition: 0.5s ease-in-out;
}