Homepage mobile improvements. (#596)

* Modify padding on page footer to ensure no overlap on small mobile screens.
* Correct the markup of highlighted projects on small screens.

Author: freakboy3742

assets/static/beeware.css

@@ -406,7 +406,7 @@ html {
 
 body {
   /* Margin bottom by footer height */
-  margin-bottom: 60px;
+  margin-bottom: 10rem;
 }
 
 .footer {

templates/home.html

@@ -199,7 +199,7 @@ <h4><a href="{{ event|url(alt=this.alt) }}">{{ event.title }}</a></h4>
     <h2><a href="{{ '/project'|url(alt=this.alt) }}">{{ t_projects }}</a></h2>
     {% set project_types = site.query('/project', alt=this.alt) %}
     {% for project in project_types %}
-        {% if project.showcase %}
+        {% if not project.project_page_description %}
     <div>
       <h4><a href="{{ project|url(alt=this.alt) }}"><img src="{{ site.get(project.path, alt='_primary')|url }}{{ project.image }}" height="32px" alt="{{ project.name }}"> {{ project.name }}</h4></a>
       {{ project.short_description|safe }}