# HG changeset patch
# User Dennis Fink <dennis.fink@c3l.lu>
# Date 2015-10-23 00:30:15
# Node ID 447435fa7bff5547c7d77c3e708bf0d51053ef13
# Parent  0e2b4d4a1c8481d7ccb3cc15183cac240a1b6620
# Parent  9208bc39dd9ae3e2a22fa0dfbae1b8d26c768535

Merge dev

diff --git a/.hgignore b/.hgignore
--- a/.hgignore
+++ b/.hgignore
@@ -16,3 +16,7 @@ test/*
 run.py
 *.csv
 *.json
+*.orig
+
+Ennstatus.egg-info/*
+doc/*
diff --git a/ennstatus/api/views.py b/ennstatus/api/views.py
--- a/ennstatus/api/views.py
+++ b/ennstatus/api/views.py
@@ -12,6 +12,7 @@ import strict_rfc3339
 import pygeoip
 import requests
 
+from ennstatus import csrf
 from ennstatus.status.functions import (single_server, all_servers,
                                         all_servers_by_type)
 from .model import Server
@@ -22,6 +23,7 @@ gi4 = pygeoip.GeoIP('/usr/share/GeoIP/Ge
 gi6 = pygeoip.GeoIP('/usr/share/GeoIP/GeoIPv6.dat', pygeoip.MEMORY_CACHE)
 
 
+@csrf.exempt
 @api_page.route('/update', methods=('POST',))
 @httpauth.login_required
 def update():
diff --git a/ennstatus/root/functions.py b/ennstatus/root/functions.py
--- a/ennstatus/root/functions.py
+++ b/ennstatus/root/functions.py
@@ -44,7 +44,7 @@ def send_membership_mail(form):
                 current_app.logger.debug(body)
                 msg.body = encrypted_body if encrypted_body else body
                 conn.send(msg)
-        flash('Application successfully sended!', 'success')
+        flash('Application successfully submitted!', 'success')
     except KeyError:
         flash(
             'Internal server error! Please get in touch with us at info@enn.lu!',
@@ -92,7 +92,7 @@ def send_bridgeprogram_mail(form):
                 msg.body = encrypted_body if encrypted_body else body
                 conn.send(msg)
         flash(
-            'Application successfully sended! We will send you an email with further information!',
+            'Application successfully submitted! We will send you an email with further information!',
             'success'
         )
     except KeyError:
diff --git a/ennstatus/root/views.py b/ennstatus/root/views.py
--- a/ennstatus/root/views.py
+++ b/ennstatus/root/views.py
@@ -19,11 +19,6 @@ def about():
     return render_template('root/about.html')
 
 
-@root_page.route('/services')
-def services():
-    return render_template('root/services.html')
-
-
 @root_page.route('/partners')
 def partners():
     return render_template('root/partners.html')
diff --git a/ennstatus/static/css/ennstatus.css b/ennstatus/static/css/ennstatus.css
--- a/ennstatus/static/css/ennstatus.css
+++ b/ennstatus/static/css/ennstatus.css
@@ -62,7 +62,6 @@ a, a:hover, a:active, a:visited {
 }
 
 
-
 /* Multi level dropdown menu http://bootsnipp.com/snippets/featured/multi-level-dropdown-menu-bs3 */
 
 .dropdown-submenu {
@@ -166,3 +165,37 @@ a, a:hover, a:active, a:visited {
 .checkbox label, .radio label {
     padding-left: 12px;
 }
+
+.btn {
+    margin-top: 5px;
+    margin-bottom: 5px;
+}
+
+.highlighted-label {
+    font-size: 24px;
+    margin-bottom: 10px;
+    font-weight: 500;
+    line-height: 1.1;
+    box-sizing: border-box;
+    display: inline-block;
+}
+
+.highlighted-label-big {
+    font-size: 30px;
+    margin-bottom: 10px;
+    font-weight: 500;
+    line-height: 1.1;
+    box-sizing: border-box;
+    display: inline-block;
+
+}
+
+.btn-enn {
+    color: #fff;
+    background-color: #00ae18;
+    border-color: #009414;
+}
+
+footer {
+    margin-bottom: 20px;
+}
diff --git a/ennstatus/status/views.py b/ennstatus/status/views.py
--- a/ennstatus/status/views.py
+++ b/ennstatus/status/views.py
@@ -40,8 +40,3 @@ def single(server_name):
     server = single_server(server_name.lower())
     kwargs = {server['server_type'].lower(): [server]}
     return render_template('status/index.html', **kwargs)
-
-
-@status_page.route('/about')
-def about():
-    return render_template('status/about.html')
diff --git a/ennstatus/templates/base.html b/ennstatus/templates/base.html
--- a/ennstatus/templates/base.html
+++ b/ennstatus/templates/base.html
@@ -117,12 +117,16 @@
   {% block content %}
   {% endblock %}
   </div>
-  <footer>
+  <footer class="col-md-12">
     <hr style="margin-bottom: 0.5%;">
-    <div class="col-md-12 text-center">
-      <a class="pull-left" href="https://twitter.com/FrennVunDerEnn" target="blank">@FrennVunDerEnn</a>
-      <address><strong>Frënn vun der Enn a.s.b.l.</strong>  <em>(R.C.S. Luxembourg F 9.478)</em>
-      <a class="pull-right" rel="license" href="http://creativecommons.org/licenses/by-nc-sa/3.0/deed.en_US" target="blank">CC-BY-NC-SA</a></address>
+    <div class="text-center clearfix">
+      <div class="pull-left">
+        <a href="https://twitter.com/FrennVunDerEnn" target="blank">@FrennVunDerEnn</a>
+      </div>
+      <strong>Frënn vun der Enn a.s.b.l.</strong>  <em>(R.C.S. Luxembourg F 9.478)</em>
+      <div class="pull-right">
+        <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/3.0/deed.en_US" target="blank">CC-BY-NC-SA</a>
+      </div>
     </div>
   </footer>
 </div>
diff --git a/ennstatus/templates/donate/index.html b/ennstatus/templates/donate/index.html
--- a/ennstatus/templates/donate/index.html
+++ b/ennstatus/templates/donate/index.html
@@ -23,16 +23,18 @@
 {% endblock %}
 
 {% block content %}
-  <div class="col-md-4 text-center">
-    <img src="{{ url_for('static', filename='images/Support.png') }}" class="img-rounded" alt="WhoIs" width="160"></img>
-    <h2>Support us!</h2>
+  <div class="col-md-4">
+    <img src="{{ url_for('static', filename='images/Support.png') }}" class="img-responsive img-rounded center-block" alt="WhoIs" width="160"></img>
+    <div class="text-center">
+      <h2>Support us!</h2>
+    </div>
   </div>
   <div class="col-md-8">
     <div class="jumbotron">
       <h2>Take action for a <strong>#FreeInternet</strong>! Support us today!</h2>
       <p>As a non-profit organization we are 100% community funded. Donations from our members and supporters will be used to <strong>power Tor nodes</strong>, <strong>print flyers and posters</strong> or cover administrative charges.</p>
-      <h3><a href="{{ url_for('donate.received') }}"><span class="label label-info">Donation history</span></a>
-      <a href="{{ url_for('root.bridgeprogram') }}"><span class="label label-primary">Adopt a Tor Bridge</span></a></h3>
+      <span class='highlighted-label'><a href="{{ url_for('donate.received') }}"><span class="label label-info">Donation history</span></a></span>
+      <span class='highlighted-label'><a href="{{ url_for('root.bridgeprogram') }}"><span class="label label-primary">Adopt a Tor Bridge</span></a></span>
     </div>
   </div>
   <div class="col-md-12">
@@ -58,7 +60,7 @@
        </div>
       </div>
     </div>
-    <div class="col-md-4">
+    <div class="col-md-4 clearfix">
       <div class="thumbnail">
         <center>
           <h3>SnailMail</h3>
@@ -68,12 +70,11 @@
             <form class="form-inline" role="form" method="POST" action"{{ url_for('donate.index') }}">
               {{ form.hidden_tag() }}
               <div class="form-group">
-                {{ form.country(_class="form-class") }}
+                {{ form.country(class_='form-control input-sm', onchange='this.form.submit()') }}
+                <noscript><input type="submit" class="btn btn-enn btn-sm" value="Submit"></noscript>
               </div>
-              <input type="submit" class="btn btn-primary btn-sm" value="Submit">
             </form>
           </div>
-          <div class="clearfix"></div>
           <address>
             <strong>Frënn vun der Ënn, ASBL</strong><br>
                     BPM 381892<br>
@@ -85,7 +86,7 @@
       </div>
     </div>
     <div class="col-md-4">
-      <div>
+      <div class="thumbnail">
         <center>
           <h3>Bitcoin</h3>
         </center>
diff --git a/ennstatus/templates/donate/received.html b/ennstatus/templates/donate/received.html
--- a/ennstatus/templates/donate/received.html
+++ b/ennstatus/templates/donate/received.html
@@ -6,6 +6,8 @@
 {% block content %}
   <div class="col-md-12">
     <h2>Received Donations</h2>
+  </div>
+  <div class="col-md-12 clearfix">
     <div class="pull-left">
       {% if csv_file %}
         <h3>{{ '-'.join([year, month]) }}</h3>
@@ -18,15 +20,14 @@
         {{ form.hidden_tag() }}
         <div class="form-group">
           {{ form.year.label }}
-          {{ form.year(_class="form-control") }}
+          {{ form.year(class_='form-control input-sm') }}
           {{ form.month.label }}
-          {{ form.month(_class="form-control") }}
+          {{ form.month(class_='form-control input-sm') }}
+          <input type="submit" class="btn btn-enn btn-sm" value="Submit">
         </div>
-        <input type="submit" class="btn btn-primary btn-sm" value="Submit">
       </form> 
     </div>
   </div>
-  <div class="clearfix"></div>
   <div class="col-md-12">
     {% if csv_file %}
       {{ macros.create_donations_table(csv_file) }}
diff --git a/ennstatus/templates/root/about.html b/ennstatus/templates/root/about.html
--- a/ennstatus/templates/root/about.html
+++ b/ennstatus/templates/root/about.html
@@ -3,12 +3,6 @@
 {% set title = "Who we are" %}
 
 {% block content %}
-    <!--
-    <div class="col-md-4 text-center">
-      <img class="img-rounded" alt="WhoIs" src="{{ url_for('static', filename='images/WhoIs.png') }}" width="160" height="189"></img>
-      <h3>Who we are</h3>
-      </div> -->
-
   <div class="col-md-offset-1 col-md-11">
     <h2>Who we are</h2>
     <h3>Organization</h3>
diff --git a/ennstatus/templates/root/abuse.html b/ennstatus/templates/root/abuse.html
--- a/ennstatus/templates/root/abuse.html
+++ b/ennstatus/templates/root/abuse.html
@@ -3,10 +3,6 @@
 {% set title = "Abuse" %}
 
 {% block content %}
-  <!-- <div class="col-md-4 text-center">
-    <img src="{{ url_for('static', filename='images/Abuse.png') }}" class="img-rounded" alt="FVDE_Logo_LQ" width="160"></img>
-    <h2>Report Abuse!</h2>
-  </div> -->
   <div class="col-md-offset-1 col-md-11">
     <h2>Abuse handling</h2>
     <p class="lead">We take our mission very seriously and carefully examine abuse cases.</p>
diff --git a/ennstatus/templates/root/bridgeprogram.html b/ennstatus/templates/root/bridgeprogram.html
--- a/ennstatus/templates/root/bridgeprogram.html
+++ b/ennstatus/templates/root/bridgeprogram.html
@@ -75,7 +75,7 @@
       </div>
       <div class="form-group">
         <div class="col-lg-offset-2 col-lg-10">
-          {{ form.submit(class_='btn btn-primary') }}
+          {{ form.submit(class_='btn btn-enn') }}
         </div>
       </div>
     </form>
diff --git a/ennstatus/templates/root/contact.html b/ennstatus/templates/root/contact.html
--- a/ennstatus/templates/root/contact.html
+++ b/ennstatus/templates/root/contact.html
@@ -3,24 +3,25 @@
 {% set title = "Contact" %}
 
 {% block content %}
-  <div class="col-md-4 text-center">
-    <img src="{{ url_for('static', filename='images/Contact.png') }}" class="img-rounded" alt="WhoIs" width="160"></img>
-    <h2>Contact</h2>
+  <div class="col-md-4">
+    <img src="{{ url_for('static', filename='images/Contact.png') }}" class="img-responsive img-rounded center-block" alt="WhoIs" width="160"></img>
+    <div class="text-center">
+      <h2>Contact</h2>
+    </div>
   </div>
-  <div class="col-md-8">
-    <h2>General</h2>
+  <div class="col-md-8 clearfix">
+    <h2 class="pull-left">General</h2>
     <div class="pull-right">
       <form class="form-inline" role="form" method="POST" action="{{ url_for('root.contact') }}">
         {{ form.hidden_tag()}}
         <div class="form-group">
-          {{ form.country.label }}
-          {{ form.country(_class="form-control") }}
+          {{ form.country(class_='form-control input-sm', onchange='this.form.submit()') }}
+          <noscript><input type="submit" class="btn btn-enn btn-sm" value="Submit"></noscript>
         </div>
-        <input type="submit" class="btn btn-primary btn-sm" value="Submit">
       </form>
     </div>
-    <div class="clearfix"></div>
-
+  </div>
+  <div class="col-md-8">
     <p>Please mail all general inquiries to:</p>
     <address>
       <strong>Frënn vun der Ënn, ASBL</strong><br>
diff --git a/ennstatus/templates/root/index.html b/ennstatus/templates/root/index.html
--- a/ennstatus/templates/root/index.html
+++ b/ennstatus/templates/root/index.html
@@ -8,8 +8,8 @@
 {% endblock %}
 
 {% block content %}
-  <div class="col-md-4 text-center">
-    <img class="img-rounded" alt="FVDE_Logo" src="{{ url_for('static', filename='images/logo/FVDE_logo_resize.png') }}"></img>
+  <div class="col-md-4">
+    <img class="img-rounded center-block" alt="FVDE_Logo" src="{{ url_for('static', filename='images/logo/FVDE_logo_resize.png') }}"></img>
   </div>
   <div class="col-md-8">
     <div class="jumbotron">
@@ -17,8 +17,9 @@
 	    <p><em>Luxembourg based non-profit organization defending civil rights on the internet.</em></p>
       <p>We provide high-bandwidth Tor nodes all over the world to protect <strong>online privacy</strong>, <strong>anonymity</strong>, <strong>freedom of speech</strong> and fight <strong>censorship</strong>!
       </p>
-      <h3><a href="{{ url_for('root.member') }}"><span class="label label-success">Become a Member</span></a> <a href="{{ url_for('donate.index') }}"><span class="label label-primary">Donate</span></a>
-        <a class="pull-right" href="https://twitter.com/FrennVunDerEnn" target="blank"><span class="label label-info">@FrennVunDerEnn</span></a></h3>
+      <span class="highlighted-label"><a href="{{ url_for('root.member') }}"><span class="label label-success">Become a Member</span></a></span>
+      <span class="highlighted-label"><a href="{{ url_for('donate.index') }}"><span class="label label-primary">Donate</span></a></span>
+      <span class="highlighted-label pull-right"><a href="https://twitter.com/FrennVunDerEnn" target="blank"><span class="label label-info">@FrennVunDerEnn</span></a></span>
     </div>
   </div>
   <div class="col-md-1">
@@ -38,8 +39,8 @@
     </blockquote>
   </div>
   <div class="col-md-6">
-    <p>
-      <video id="tor-animation" width="560" height="315" controls preload="none" class="video-js vjs-default-skin vjs-big-play-centered" data-setup="">
+    <div class="embed-responsive embed-responsive-16by9">
+      <video id="tor-animation" width="560" height="315" controls preload="none" class="video-js vjs-default-skin vjs-big-play-centered embed-responsive-item" data-setup="">
         <source src="{{ url_for('static', filename='videos/Tor_Animation.webm') }}" type='video/webm' />
         <source src="{{ url_for('static', filename='videos/Tor_Animation.mp4') }}" type='video/mp4' />
 
@@ -64,7 +65,7 @@
         <track src="{{ url_for('static', filename='videos/subtitles/Tor_animation.zh-CN.vtt') }}" srclang="zh-CN" label="Chinese (China)">
         <track src="{{ url_for('static', filename='videos/subtitles/Tor_animation.zh-HK.vtt') }}" srclang="zh-HK" label="Chinese (Hongkong)">
       </video>
-    </p>
+    </div>
   </div>
   <div class="col-md-6">
       <p class=lead>
@@ -74,7 +75,7 @@
       <p>
         By bouncing your communications around a distributed network of relays run by volunteers all around the world, it prevents somebody watching your Internet connection from learning what sites you visit, and it prevents the sites you visit from learning your physical location.
       </p>
-      <h2><a href="http://torproject.lu" target="blank"><span class="label label-info">Learn more about Tor</span></a></h2>
+      <span class="highlighted-label-big"><a href="http://torproject.lu" target="blank"><span class="label label-info">Learn more about Tor</span></a></span>
   </div>
 {% endblock %}
 
diff --git a/ennstatus/templates/root/member.html b/ennstatus/templates/root/member.html
--- a/ennstatus/templates/root/member.html
+++ b/ennstatus/templates/root/member.html
@@ -3,9 +3,11 @@
 {% set title = "Member" %}
 
 {% block content %}
-  <div class="col-md-4 text-center">
-    <img src="{{ url_for('static', filename='images/Partners.png') }}" class="img-rounded" alt="Partners" width="160"></img>
-    <h3>Join</h3>
+  <div class="col-md-4">
+    <img src="{{ url_for('static', filename='images/Partners.png') }}" class="img-responsive img-rounded center-block" alt="Partners" width="160"></img>
+    <div class="text-center">
+      <h2>Join</h2>
+    </div>
   </div>
   <div class="col-md-8">
     <h2>Membership</h2>
diff --git a/ennstatus/templates/root/membership.html b/ennstatus/templates/root/membership.html
--- a/ennstatus/templates/root/membership.html
+++ b/ennstatus/templates/root/membership.html
@@ -60,7 +60,7 @@
       </div>
       <div class="form-group">
         <div class="col-lg-offset-2 col-lg-10">
-        {{ form.submit(class_='btn btn-primary') }}
+        {{ form.submit(class_='btn btn-enn') }}
         </div>
       </div>
     </div>
diff --git a/ennstatus/templates/root/mirrors.html b/ennstatus/templates/root/mirrors.html
--- a/ennstatus/templates/root/mirrors.html
+++ b/ennstatus/templates/root/mirrors.html
@@ -11,9 +11,11 @@
 {% endif %}
 
 {% block content %}
-  <div class="col-md-4 text-center">
-    <img src="{{ url_for('static', filename='images/Services.png') }}" class="img-rounded" alt="Partners" width="160"></img>
-    <h3>Mirrors</h3>
+  <div class="col-md-4">
+    <img src="{{ url_for('static', filename='images/Services.png') }}" class="img-responsive img-rounded center-block" alt="Partners" width="160"></img>
+    <div class="text-center">
+      <h2>Mirrors</h2>
+    </div>
   </div>
   <div class="col-md-8">
     <h2>Mirrors</h2>
diff --git a/ennstatus/templates/root/partners.html b/ennstatus/templates/root/partners.html
--- a/ennstatus/templates/root/partners.html
+++ b/ennstatus/templates/root/partners.html
@@ -3,9 +3,11 @@
 {% set title = "Partners" %}
 
 {% block content %}
-  <div class="col-md-4 text-center">
-    <img src="{{ url_for('static', filename='images/Partners.png') }}" class="img-rounded" alt="Partners" width="160"></img>
-    <h3>Partners</h3>
+  <div class="col-md-4">
+    <img src="{{ url_for('static', filename='images/Partners.png') }}" class="img-responsive img-rounded center-block" alt="Partners" width="160"></img>
+    <div class="text-center">
+      <h2>Partners</h2>
+    </div>
   </div>
   <div class="col-md-8">
     <h2>Partners</h2>
diff --git a/ennstatus/templates/root/services.html b/ennstatus/templates/root/services.html
deleted file mode 100644
--- a/ennstatus/templates/root/services.html
+++ /dev/null
@@ -1,37 +0,0 @@
-{% extends "base.html" %}
-
-{% set title = "Services" %}
-
-{% block content %}
-  <div class="col-md-4 text-center">
-    <img src="{{ url_for('static', filename='images/Services.png') }}" class="img-rounded" alt="FVDE_Logo_LQ" width="160"></img>
-    <h3>Services</h3>
-  </div>
-  <div class="col-md-8">
-    <blockquote>
-      <p>"<em>If you shut up truth, and bury it underground, it will but grow.</em>"</p>
-      <small>Emile Zola, <cite title="Source Title"></cite></small>
-    </blockquote>
-
-    <p>The setup behind the Tor Onion Netork is easy once you've understood how it works. Below you can see a picture of what a conection to any point in the 
-       Internet may look like through Tor.</p>
-    <p><img src="{{ url_for('static', filename='images/Tor-onion-network.png') }}"></p>
-
-    <h2>Entry Nodes</h2>
-    <p>An entry node (Tor Bridge) is the point of entrance to the Tor network. Usually, these are servers with limited computing capacity and bandwith. They serve users to enter the Tor network either by the front door and some other have additional software installed - <a href="https://www.torproject.org/projects/obfsproxy.html.en" target="_blank">obfsproxy</a> - to offer more differienated ways of enerting the Tor network.</p>
-
-    <h2>Middle Nodes</h2>
-    <p>A middle node (Tor Relay) passes on the traffic within the Tor network to the next relay station and eventually to an exit node.</p>
-
-    <h2>Exit Nodes</h2>
-    <p>An exit node (Tor Exit Node) is the last part of the chain for a users traffic. Here it's going to be passed on to the destionation the user has choosen (i.e. http://ixquick.com/).
-    <p>To accomplish our objectives, we need to get more exit nodes online. In order to do this, we focus to spent our gains right to the setup of exit nodes.</p>
-    <p>Finding reliable, freedom and privacy aware hosters is not a trivial task, so we encourage you to share your expericences with us, either on the <a href="//lists.enn.lu/listinfo/discuss">mailing list</a>, the <a href="//wiki.enn.lu/">wiki</a> or simply drop us a <a href="mailto: info@enn.lu">mail</a>.</p>
-		  
-	  <h2>Mirrors</h2>
-    <p>We are an official mirror of the <a href="https://torproject.lu/" target="_blank">Tor Project</a> and <a href="https://tails.boum.org/" target="_blank">Tails</a> - a live operating system to protect your privacy with the help of anonymity and encryption - website.</p>
-
-    <h2>Globe</h2>
-    <p>We also host an <a href="https://globe.torproject.org/" target="_blank">Globe</a> - a tor relay and bridge explorer - instance at <a href="//globe.enn.lu" target="_blank">globe.enn.lu</a>.</p>
-  </div>
-{% endblock %}
diff --git a/ennstatus/templates/statistics/worldmap.html b/ennstatus/templates/statistics/worldmap.html
--- a/ennstatus/templates/statistics/worldmap.html
+++ b/ennstatus/templates/statistics/worldmap.html
@@ -16,7 +16,7 @@
 
 {% block scripts %}
   {{ super() }}
-  <script src="{{ url_for('static', filename="js/d3/d3.min.js") }}"></script>
-  <script src="{{ url_for('static', filename="js/topojson/topojson.js") }}"></script>
-  <script src="{{ url_for('static', filename="js/worldmap.js") }}"></script>
+  <script src="{{ url_for('static', filename='js/d3/d3.min.js') }}"></script>
+  <script src="{{ url_for('static', filename='js/topojson/topojson.js') }}"></script>
+  <script src="{{ url_for('static', filename='js/worldmap.js') }}"></script>
 {% endblock %}
diff --git a/ennstatus/templates/status/about.html b/ennstatus/templates/status/about.html
deleted file mode 100644
--- a/ennstatus/templates/status/about.html
+++ /dev/null
@@ -1,14 +0,0 @@
-{% extends "base.html" %}
-
-{% set title = "Ënnstatus - About" %}
-
-{% block content %}
-  <div class="col-md-12">
-    <h2>Ënnstatus - About</h2>
-    <p>Ënnstatus provides the user with vital information about the status of the organizations Tor servers.</p>
-    <h3>Export</h3>
-    <p><code>/api/export -&gt; /api/export/json/all</code></p>
-    <p><code>/api/export/&lt;any("json", "xml")&gt; -&gt; /api/export/&lt;any("json", "xml")&gt;/all</code></p>
-    <p><code>/api/export/&lt;any("json", "xml")&gt;/&lt;any("all", "exit", "bridge", "relay", "single")&gt;</code></p>
-  </div>
-{% endblock %}
diff --git a/ennstatus/templates/status/macros.html b/ennstatus/templates/status/macros.html
--- a/ennstatus/templates/status/macros.html
+++ b/ennstatus/templates/status/macros.html
@@ -55,46 +55,48 @@
     {% set headers = ('#', 'Name', 'Tor Status', 'Country', 'Fingerprint', 'OBFS', 'FTEProxy', 'Flashproxy', 'meek', 'Last Updated <noscript>(UTC)</noscript>') %}
   {% endif %}
   <h2>{{ server_type|title }}</h2>
-  <table class="table table-bordered table-striped sortable">
-    <thead>
-      <tr>
-        {% for name in headers %}
-          <th>{{ name|safe }}</th>
+  <div class="table-responsive">
+    <table class="table table-bordered table-striped sortable">
+      <thead>
+        <tr>
+          {% for name in headers %}
+            <th>{{ name|safe }}</th>
+          {% endfor %}
+        </tr>
+      </thead>
+      <tbody>
+        {% for server in servers|sort(attribute='name')|sort(attribute='country') %}
+        <tr {% if server.name in config['ENNSTATUS_BRIDGE_PROGRAM'] %}class="info"{% endif %}>
+            <td>{{ loop.index }}</td>
+            {% if server_type in ('exit', 'relay') %}
+              <td>{{ create_name(server.name) }}</td>
+              <td>{{ server.ip }}</td>
+              <td>{{ server.ip6 or 'N/A' }}</td>
+            {% else %}
+              <td>
+                {% if server.name in config['ENNSTATUS_BRIDGE_PROGRAM'] %}
+                  <a href="{{ url_for('root.bridgeprogram') }}">{{ server.name }}</a>
+                {% else %}
+                  {{ server.name }}
+                {% endif %}
+              </td>
+            {% endif %}
+            <td>{{ colorize_status(server.status) }}</td>
+            <td>{{ create_country(server.country) }}</td>
+            <td>{{ create_fingerprint(server.fingerprint, server.type) }}</td>
+            {% if server_type == 'bridge' %}
+              <td>{{ colorize_obfs(server.obfs) }}</td>
+              <td>{{ colorize_obfs(server.fteproxy) }}</td>
+              <td>{{ colorize_obfs(server.flashproxy) }}</td>
+              <td>{{ colorize_obfs(server.meek) }}</td>
+            {% endif %}
+            <td>{{ create_date(server.last_updated) }}
+            </td>
+          </tr>
         {% endfor %}
-      </tr>
-    </thead>
-    <tbody>
-      {% for server in servers|sort(attribute='name')|sort(attribute='country') %}
-      <tr {% if server.name in config['ENNSTATUS_BRIDGE_PROGRAM'] %}class="info"{% endif %}>
-          <td>{{ loop.index }}</td>
-          {% if server_type in ('exit', 'relay') %}
-            <td>{{ create_name(server.name) }}</td>
-            <td>{{ server.ip }}</td>
-            <td>{{ server.ip6 or 'N/A' }}</td>
-          {% else %}
-            <td>
-              {% if server.name in config['ENNSTATUS_BRIDGE_PROGRAM'] %}
-                <a href="{{ url_for('root.bridgeprogram') }}">{{ server.name }}</a>
-              {% else %}
-                {{ server.name }}
-              {% endif %}
-            </td>
-          {% endif %}
-          <td>{{ colorize_status(server.status) }}</td>
-          <td>{{ create_country(server.country) }}</td>
-          <td>{{ create_fingerprint(server.fingerprint, server.type) }}</td>
-          {% if server_type == 'bridge' %}
-            <td>{{ colorize_obfs(server.obfs) }}</td>
-            <td>{{ colorize_obfs(server.fteproxy) }}</td>
-            <td>{{ colorize_obfs(server.flashproxy) }}</td>
-            <td>{{ colorize_obfs(server.meek) }}</td>
-          {% endif %}
-          <td>{{ create_date(server.last_updated) }}
-          </td>
-        </tr>
-      {% endfor %}
-    </tbody>
-  </table>
+      </tbody>
+    </table>
+  </div>
   {% if server_type == 'bridge' %}
     <div class="alert alert-info alert-dismissible" role="alert">
       <button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
diff --git a/setup.py b/setup.py
--- a/setup.py
+++ b/setup.py
@@ -11,7 +11,7 @@ def _get_requirements():
 
 
 setup(name='Ennstatus',
-      version='5.0.3',
+      version='5.0.3-dev',
       description=('Ennstatus provides the user with vital information about '
                    'the status of the organizations Tor servers.'),
       author='Frënn vun der Ënn',