<main>
  <div class="cdt-container">
  <div class="cdt-row">
    <div class="cdt-12">
      <div class="cdt-list">
        <ul>
          <li>
            <div class="cdt-list-item">
              <div class="item">
                <h6>Email</h6>
                <p>Enable disable showing your email adress.</p>
              </div>
              <div class="extra">
              <span class="cdt-toggle">
                <input type="checkbox" id="toggle-1" />
              </span>
            </div>
            </div>
          </li>
          <li>
            <div class="cdt-list-item">
              <div class="item">
                <h6>Push notifications</h6>
                <p>get realtime notification on your device.</p>
              </div>
              <div class="extra">
              <span class="cdt-toggle">
                <input type="checkbox" id="toggle-1" checked />
              </span>
            </div>
            </div>
          </li>
        </ul>
      </div>
    </div>
  </div>
</div>
</main>
@import 'https://fonts.googleapis.com/icon?family=Material+Icons';

main {
  margin: 10px;
}
li {
  border-bottom: 1px solid #eee;
}
.cdt-list-item, .cdt-list header {
  padding-left: 10px;
}