<main>
  <div class="cdt-container">
  <div class="cdt-row">
    <div class="cdt-12">
      <div class="cdt-list">
        <ul>  
          <li>
            <div class="cdt-list-item">
              <span class="avatar">
               <i class="material-icons">
                 assessment
               </i>
              </span>
              <div class="item">
                Assessments
              </div>
            </div>
          </li>
          <li>
            <div class="cdt-list-item">
              <span class="avatar">
                <i class="material-icons">
                event
                </i>
              </span>
              <div class="item">Calendar events</div>
            </div>
          </li>
          <li>
            <div class="cdt-list-item">
              <span class="avatar">
                <i class="material-icons">
                credit_card
                </i>
              </span>
              <div class="item">
                Credit card  
              </div>
            </div>
          </li>
        </ul>
      </div>
    </div>
  </div>
</div>
</main>
@import 'https://fonts.googleapis.com/icon?family=Material+Icons';

main {
  margin: 10px;
}
i {
  font-size: 30px !important;
  color: #666;
}
li {
  padding: 10px 0;
  border-bottom: 1px solid #eee;
}