Make 4xx and 5xx pages full screen.

This makes the 4xx and 5xx pages full screen by changing the
`.error_page` div to be fixed and full screen height.

static/styles/portico.css

@@ -1583,7 +1583,16 @@ input.new-organization-button {
     margin: 0 auto;
 }
 
+.portico-page.error {
+    padding-bottom: 0px;
+}
+
+.portico-page.error .portico-page-container {
+    padding: 0;
+}
+
 .error_page {
+    min-height: calc(100vh - 64px);
     background-color: #c9e9e0;
     font-family: 'Humbug', Helvetica, Arial, sans-serif;
 }

templates/404.html

@@ -1,8 +1,9 @@
 {% extends "zerver/portico.html" %}
 
-{% block portico_content %}
+{% block portico_class_name %}error{% endblock %}
 
-<div class="error_page" style="padding-bottom: 60px;">
+{% block portico_content %}
+<div class="error_page">
     <div class="container">
         <div class="row-fluid">
             <img src="/static/images/400art.svg" alt=""/>
@@ -17,5 +18,4 @@
         </div>
     </div>
 </div>
-
 {% endblock %}

templates/500.html

@@ -5,9 +5,10 @@
 <meta http-equiv="refresh" content="60;URL='/'">
 {% endblock %}
 
-{% block portico_content %}
+{% block portico_class_name %}error{% endblock %}
 
-<div class="error_page" style="padding-bottom: 60px;">
+{% block portico_content %}
+<div class="error_page">
     <div class="container">
         <div class="row-fluid">
             <img src="/static/images/500art.svg" alt=""/>

templates/zerver/portico.html

@@ -49,7 +49,7 @@
             </div>
         </div>
 
-        <div class="app portico-page">
+        <div class="app portico-page {% block portico_class_name %}{% endblock %}">
             <div class="app-main portico-page-container{% block hello_page_container %}{% endblock %}">
                 {% block portico_content %}
                 {% endblock %}