Completely CSS: Custom checkboxes, radio buttons and select boxes

<div class="container">
  <div class="control-group">
    <h1>Checkboxes</h1>
    <label class="control control--checkbox">First checkbox
      <input type="checkbox" checked="checked"/>
      <div class="control__indicator"></div>
    </label>
    <label class="control control--checkbox">Second checkbox
      <input type="checkbox"/>
      <div class="control__indicator"></div>
    </label>
    <label class="control control--checkbox">Disabled
      <input type="checkbox" disabled="disabled"/>
      <div class="control__indicator"></div>
    </label>
    <label class="control control--checkbox">Disabled & checked
      <input type="checkbox" disabled="disabled" checked="checked"/>
      <div class="control__indicator"></div>
    </label>
  </div>
  <div class="control-group">
    <h1>Radio buttons</h1>
    <label class="control control--radio">First radio
      <input type="radio" name="radio" checked="checked"/>
      <div class="control__indicator"></div>
    </label>
    <label class="control control--radio">Second radio
      <input type="radio" name="radio"/>
      <div class="control__indicator"></div>
    </label>
    <label class="control control--radio">Disabled
      <input type="radio" name="radio2" disabled="disabled"/>
      <div class="control__indicator"></div>
    </label>
    <label class="control control--radio">Disabled & checked
      <input type="radio" name="radio2" disabled="disabled" checked="checked"/>
      <div class="control__indicator"></div>
    </label>
  </div>
  <div class="control-group">
    <h1>Select boxes</h1>
    <div class="select">
      <select>
        <option>First select</option>
        <option>Option</option>
        <option>Option</option>
      </select>
      <div class="select__arrow"></div>
    </div>
    <div class="select">
      <select>
        <option>Second select</option>
        <option>Option</option>
        <option>Option</option>
      </select>
      <div class="select__arrow"></div>
    </div>
    <div class="select">
      <select disabled="disabled">
        <option>Disabled</option>
        <option>Option</option>
        <option>Option</option>
      </select>
      <div class="select__arrow"></div>
    </div>
  </div>
</div>