index.haml

%nav.top-bar{:data => { :topbar => '' }}
  %ul.title-area
    %li.name
      %h1
        %a(href="#") Everything Inbox
    %li.toggle-topbar.menu-icon
      %a(href="#")
        %span Menu

  %section.top-bar-section
    %ul.right
      %li
        %a(href="#") Home
      %li
        %a(href="#") About
      %li
        %a(href="#") Contact
.jumbotron
  .row
    .jumbotron-headers
      %h3.subheader
        Everything you hoped for and more
      %h1.jumbotron-hero Everything Inbox
      %p
        %a.button{role: "button", href: "#"} Get Started


.how-it-works
  .row
    %dl.tabs{"data-tab" => ""}
      %dd.active
        %a{:href => "#panel1"} Tab 1
      %dd
        %a{:href => "#panel2"} Tab 2
      %dd
        %a{:href => "#panel3"} Tab 3
      %dd
        %a{:href => "#panel4"} Tab 4
    .tabs-content
      #panel1.content.active
        .tabs-content-left
          %h2 Simple & Clean
          %p 
            This is the first panel of the basic tab example. This is the first
            panel of the basic tab example.
          %p
            %a.button{role: "button", href: "#"} Get Started
        %figure
          %img(src="http://i.imgur.com/pQNelD3.jpg")
      #panel2.content
        .tabs-content-left
          %h2 Is The Way
          %p 
            This is the first panel of the basic tab example. This is the first
            panel of the basic tab example.
          %p
            %a.button{role: "button", href: "#"} Get Started
        %figure
          %img(src="http://i.imgur.com/C352Jna.jpg")
      #panel3.content
        .tabs-content-left
          %h2 That You’re Making
          %p 
            This is the first panel of the basic tab example. This is the first
            panel of the basic tab example.
          %p
            %a.button{role: "button", href: "#"} Get Started
        %figure
          %img(src="http://i.imgur.com/pQNelD3.jpg")
      #panel4.content
        .tabs-content-left
          %h2 Me Feel Tonight
          %p 
            It's hard to let it go. This is the first panel of the
            basic tab example. This is the first panel of the basic tab
            example.
          %p
            %a.button{role: "button", href: "#"} Get Started
        %figure
          %img(src="http://i.imgur.com/C352Jna.jpg")


.icons
  .row
    %h2.underline-header
      “EZPZ:” A Technical Term
  %ul.row
    %li.icons-item
      %figure
        =image_tag 'compass.svg'
      %h3 Monolithic
      %p
        an expression and Tumblr hashtag typically associated with a picture of
        an alien that looks slumped over with an agape mouth.
    %li.icons-item
      %figure
        =image_tag 'phone.svg'
      %h3 Mobile
      %p
        Not really sure why you would ever want to use this app on your phone,
        but you can.
    %li.icons-item
      %figure
        =image_tag 'knife.svg'
      %h3 Trendy
      %p
        Not sure if it's a great job to describe your product as trendy.

.pricing-tables
  .row
    %h2.underline-header
      Pricing
  %ul.row 
    - (1..3).each do |i|
      %li.pricing-tables-item
        %ul.pricing-table
          %li.title Standard
          %li.price $99.99
          %li.description An awesome description
          %li.bullet-item 1 Database
          %li.bullet-item 5GB Storage
          %li.bullet-item 20 Users
          %li.cta-button
            %a.button{:href => "#"} Buy Now

.testimonials
  .row
    %h2.underline-header
      What Our Users Say About Everything Inbox
  .testimonials-quote.row
    %blockquote
      Finally a unified standards compliant web zone that delivers on its
      promises. I lost 15 pounds with everything inbox. I loved everything
      inbox so much i bought the company.
      %cite Bill Gates
    %figure
      %img(src="http://i.imgur.com/Q2x2Ol9.jpg")
  .testimonials-quote.row
    %blockquote
      Everything Inbox has provided me a solution for fitting the entire known
      universe into my inbox. Physicists hate me now because of my new secret. I am
      now literally God.
      %cite Natalie Portman
    %figure
      %img(src="http://i.imgur.com/6QtrhJc.jpg")


.buy
  .row
    %h2 Buy Now
    %p you really do not have any other choice but to immediately buy
    %p 
      %a.button.large{role: "button", href: "#"}
        Buy