<form>
  <div class="form-group">
    <label for="exampleFormControlInput1">Email address</label>
    <input type="email" class="form-control" id="exampleFormControlInput1" placeholder="name@example.com">
  </div>
  <div class="form-group">
    <label for="exampleFormControlSelect1">Example select</label>
    <select class="form-control" id="exampleFormControlSelect1">
      <option>1</option>
      <option>2</option>
      <option>3</option>
      <option>4</option>
      <option>5</option>
    </select>
  </div>
  <div class="form-group">
    <label for="exampleFormControlSelect2">Example multiple select</label>
    <select multiple class="form-control" id="exampleFormControlSelect2">
      <option>1</option>
      <option>2</option>
      <option>3</option>
      <option>4</option>
      <option>5</option>
    </select>
  </div>
  <div class="form-group">
    <label for="exampleFormControlTextarea1">Example textarea</label>
    <textarea class="form-control" id="exampleFormControlTextarea1" rows="3"></textarea>
  </div>
  <div class="form-check">
    <input class="form-check-input" type="checkbox" value="" id="defaultCheck1">
    <label class="form-check-label" for="defaultCheck1">
      Default checkbox
    </label>
  </div>
  <div class="form-check">
    <input class="form-check-input" type="checkbox" value="" id="defaultCheck2" disabled>
    <label class="form-check-label" for="defaultCheck2">
      Disabled checkbox
    </label>
  </div>
  <div class="form-check mt-5">
    <input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios1" value="option1" checked>
    <label class="form-check-label" for="exampleRadios1">
      Default radio
    </label>
  </div>
  <div class="form-check">
    <input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios2" value="option2">
    <label class="form-check-label" for="exampleRadios2">
      Second default radio
    </label>
  </div>
  <div class="form-check disabled">
    <input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios3" value="option3" disabled>
    <label class="form-check-label" for="exampleRadios3">
      Disabled radio
    </label>
  </div>

  <div class="form-input-wide jf-required radio-switch radio-switch--arrows mt-5 w-md-50" id="cid_9">
    <div aria-labelledby="label_9" class="form-single-column rs__wrapper" data-component="radio" role="group">
      <span class="form-radio-item">
        <input checked="checked" class="form-radio validate[required]" id="input_9_0" name="q9_moreAbout"  required="" type="radio" value="Specific needs"/>
        <label for="input_9_0" id="label_input_9_0"> Specific needs </label>
      </span>
      <span class="form-radio-item">
        <input class="form-radio validate[required]" id="input_9_1" name="q9_moreAbout" required="" type="radio" value="General request"/>
        <label for="input_9_1" id="label_input_9_1"> General request </label>
      </span>
    </div>
  </div>

  <div class="form-input-wide radio-switch mt-5 w-md-50" id="cid_14">
    <div aria-labelledby="label_14" class="form-single-column rs__wrapper" data-component="radio" role="group">
      <span class="form-radio-item" style="clear:left">
        <input class="form-radio" id="input_14_0" name="q14_customPrinting" type="radio" value="Yes"/>
        <label for="input_14_0" id="label_input_14_0"> Yes </label>
      </span>
      <span class="form-radio-item" style="clear:left">
        <span class="dragger-item"> </span>
        <input checked="checked" class="form-radio" id="input_14_1" name="q14_customPrinting" type="radio" value="No"/>
        <label for="input_14_1" id="label_input_14_1"> No </label>
      </span>
    </div>
  </div>
</form>

<h3 class="mt-5 mb-2">Option - Dark form background color</h3>
<form class="form--dark bg-bleu-recyclage p-5">
  <div class="form-group">
    <label for="exampleFormControlInput1">Email address</label>
    <input type="email" class="form-control" id="exampleFormControlInput1" placeholder="name@example.com">
  </div>
</form>