zeus.ugent.be/content/index.erb

<div class="pure-g">
  <div class="pure-u-xl-1-5 pure-u-lg-1-6 pure-u-md-1-8 pure-u-sm-1-12 pure-u-1-24"></div>
  <div id="container" class="pure-u-xl-3-5 pure-u-lg-2-3 pure-u-md-3-4 pure-u-sm-5-6 pure-u-11-12">
    <header>
      <div class="header-top">
        <img id="logo" src="https://zeus.ugent.be/wp-content/uploads/2009/05/logo-new.png" alt="" />
        <div id="logos">
          <a href="https://github.com/ZeusWPI" target="_blank">
            <i class="logo-link fa fa-github fa-3x"></i>
          </a>
          <a href="https://www.facebook.com/zeus.wpi/" target="_blank">
            <i class="logo-link fa fa-facebook fa-3x"></i>
          </a>
          <a href="#" target="_blank">
            <i class="logo-link fa fa-rss fa-3x"></i>
          </a>
        </div>
      </div>

      <nav id="navbar">
        <span class="navlink">About</span>
        <span class="navlink">All posts</span>
        <span class="navlink">Contact</span>
        <span class="navlink">Cammie</span>
      </nav>
    </header>
    <main>
      <div class="main-event">
        <img class="pure-img" src="https://zeus.ugent.be/wp-content/uploads/2016/02/battlebots_small.jpg" alt="" />
      </div>
      <div id="all-events">
        <div class="pure-g">
          <% 9.times do |n| %>
          <div class="pure-u-1-3">
            <div class="event">
              <img class="pure-img" src='<%= "http://lorempixel.com/400/#{400 + n}/" %>' alt="" />
            </div>
          </div>
          <% end %>
        </div>
      </div>
    </main>
  </div>
</div>