Mobile style

[bilalq]

I added a meta tag and changed the pure grid classes used to be responsive. Also, I noticed that tabs were being used for indentation of HTML/CSS, so I changed those to 2-space indents.

[x]

Yeah, so I tried doing this, but the issue I ran into is that pure-g-r will switch to "mobile" mode (where the div takes a full 1 unit" at 768px. Currently the center div is max-width 600px, so it's always full width and causes the whale and logo to be on separate lines.

Ideally I'd like the mobile view to be something similar to what we had with the separate loading CSS (but responsive) It'd go something like

• Remove .title h1 and .title h2, or sub .title h1 for just "SW"
• change logo to about half width of page
• change bar width to 3-4 and button to 1-4, or split them onto two full width lines

[bilalq]

Ah, I see what you mean. I'll probably have to mess with media queries.