index.html

<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel='stylesheet' href='./style.css'>
<link href='https://fonts.googleapis.com/css?family=Sacramento' rel='stylesheet'>

<script type='text/javascript' src='./script.js'></script>

<h1 class='title'>Toe-Touching challenge</h1>
<div class='subtitle'></div>

<div class='congratulations'>
  <div class='congratulations-text'>
    completed!
  </div>
</div>
<div class='content'>
  <div class='contestant a'>
    <a href="https://twitter.com/aslushnikov">
      <img src='a.jpg' class='avatar'></img>
    </a>
    <a href='https://github.com/aslushnikov/toetouching-challenge/blob/master/toetouching.js' class='progress-wrap'>
      <div class='progress progress-today'>
        <div class='progress-fill'></div>
        <div class='progress-label'>today</div>
      </div>
      <div class='progress progress-total'>
        <div class='progress-fill'></div>
        <div class='progress-label'>total</div>
      </div>
    </a>
  </div>
  <div class='contestant s'>
    <a href="https://twitter.com/megaserg">
      <img src='s.png' class='avatar'></img>
    </a>
    <a href='https://github.com/aslushnikov/toetouching-challenge/blob/master/toetouching.js' class='progress-wrap'>
      <div class='progress progress-today'>
        <div class='progress-fill'></div>
        <div class='progress-label'>today</div>
      </div>
      <div class='progress progress-total'>
        <div class='progress-fill'></div>
        <div class='progress-label'>total</div>
      </div>
    </a>
  </div>
  <div class='contestant t'>
    <a href="https://twitter.com/_ttim">
      <img src='t.jpeg' class='avatar'></img>
    </a>
    <a href='https://github.com/aslushnikov/toetouching-challenge/blob/master/toetouching.js' class='progress-wrap'>
      <div class='progress progress-today'>
        <div class='progress-fill'></div>
        <div class='progress-label'>today</div>
      </div>
      <div class='progress progress-total'>
        <div class='progress-fill'></div>
        <div class='progress-label'>total</div>
      </div>
    </a>
  </div>
  <div class='contestant i'>
    <a href='https://fb.com/ira.vasilinets'>
      <img src='i.jpg' class='avatar'></img>
    </a>
    <a href='https://github.com/aslushnikov/toetouching-challenge/blob/master/toetouching.js' class='progress-wrap'>
      <div class='progress progress-today'>
        <div class='progress-fill'></div>
        <div class='progress-label'>today</div>
      </div>
      <div class='progress progress-total'>
        <div class='progress-fill'></div>
        <div class='progress-label'>total</div>
      </div>
    </a>
  </div>
  <div class='contestant sv'>
    <a href='https://twitter.com/ZelenetS'>
      <img src='sv.jpg' class='avatar'></img>
    </a>
    <a href='https://github.com/aslushnikov/toetouching-challenge/blob/master/toetouching.js' class='progress-wrap'>
      <div class='progress progress-today'>
        <div class='progress-fill'></div>
        <div class='progress-label'>today</div>
      </div>
      <div class='progress progress-total'>
        <div class='progress-fill'></div>
        <div class='progress-label'>total</div>
      </div>
    </a>
  </div>
</div>