---
title: Email
page-title: Crypto currencies
---

<div class="container">
   <div class="row">
      <div class="col-md-3">
         <h3 class="mb-4">Mail Service</h3>

         <div>
            <div class="list-group list-group-transparent mb-0">
               <a href="#" class="list-group-item list-group-item-action d-flex align-items-center active">
                  <span class="icon mr-3">{% include ui/icon.html icon="inbox" %}</span>Inbox <span class="ml-auto badge bg-blue">14</span>
               </a>
               <a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
                  <span class="icon mr-3">{% include ui/icon.html icon="send" %}</span>Sent Mail
               </a>
               <a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
                  <span class="icon mr-3">{% include ui/icon.html icon="alert-circle" %}</span>Important <span class="ml-auto badge bg-gray">3</span>
               </a>
               <a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
                  <span class="icon mr-3">{% include ui/icon.html icon="star" %}</span>Starred
               </a>
               <a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
                  <span class="icon mr-3">{% include ui/icon.html icon="file" %}</span>Drafts
               </a>
               <a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
                  <span class="icon mr-3">{% include ui/icon.html icon="tag" %}</span>Tags
               </a>
               <a href="#" class="list-group-item list-group-item-action d-flex align-items-center">
                  <span class="icon mr-3">{% include ui/icon.html icon="trash" %}</span>Trash
               </a>
            </div>

            <div class="mt-4">
               <a href="#" class="btn btn-secondary btn-block">Compose new Email</a>
            </div>
         </div>
      </div>
      <div class="col-md-9">
         <div class="card">
            <div class="card-header">
               <h3 class="card-title">Compose new message</h3>
            </div>

            <div class="card-body">

               <form action="">
                  <div class="mb-2">
                     <div class="row align-items-center">
                        <label class="col-sm-2">To:</label>
                        <div class="col-sm-10">
                           <input type="text" class="form-control">
                        </div>
                     </div>
                  </div>

                  <div class="mb-2">
                     <div class="row align-items-center">
                        <label class="col-sm-2">Subject:</label>
                        <div class="col-sm-10">
                           <input type="text" class="form-control">
                        </div>
                     </div>
                  </div>

                  <textarea rows="10" class="form-control"></textarea>

                  <div class="btn-list mt-4 text-right">
                     <button type="button" class="btn btn-secondary btn-space">Cancel</button>
                     <button type="submit" class="btn btn-primary btn-space">Send message</button>
                  </div>
               </form>
            </div>
         </div>

      </div>
   </div>
</div>