diff --git a/assets/scss/_tpo.scss b/assets/scss/_tpo.scss
index 6e2e451..aabb7c1 100644
--- a/assets/scss/_tpo.scss
+++ b/assets/scss/_tpo.scss
@@ -44,6 +44,15 @@ footer .border{
   border-bottom: 1px solid rgba(255,255,255,0.3) !important;
 }
 
+.footer .onion-pattern {
+  direction: rtl;
+  max-height: 280px;
+}
+
+.footer .download-section {
+  max-width: 36rem;
+}
+
 main{
   padding-bottom: 5em;
 }
@@ -54,14 +63,6 @@ main{
   background-size: cover;
 }
 
-.onion-bg{
-  background: url("../images/circle-pattern.png");
-  background-color: rgba(0, 0, 0, 0);
-  background-position-x: -85%;
-  background-repeat: no-repeat;
-  background-size: 65%;
-}
-
 .btn-shadow {
   box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.20000000298023224);
   opacity: 0.8;
@@ -129,8 +130,11 @@ main{
        font-size: 1.3rem;
    }
   .window-bg,
-  .onion-bg {
-      background: none;
+  .footer .onion-pattern {
+    display: none !important;
+  }
+  .footer .download-section {
+    margin: 3rem auto 0 !important;
   }
   .hero > p{
     font-size: 2.5rem;
diff --git a/templates/footer.html b/templates/footer.html
index a73fa23..1aaf95b 100644
--- a/templates/footer.html
+++ b/templates/footer.html
@@ -6,22 +6,22 @@
 
   {% if this.path != '/download' %}
 
-  <div class="row onion-bg">
-    <div class="col-12 d-flex justify-content-right">
-      <div class="container pt-5 justify-content-right">
-        <div class="offset-lx-2 offset-sm-4 mt-5">
-           <h2 class="text-white text-bold">{{ _('Download Tor Browser') }}</h2>
-            <p class="text-white">{{ _('Download Tor Browser to experience real private browsing without tracking, surveillance, or censorship.') }}</p>
-            {% set download = site.get('/download') %}
-            {% if download == None %}
-              <a class="btn text-primary bg-white btn-light pull-right mt-2" href="https://www.torproject.org/download/">
-            {% else %}
-              <a class="btn text-primary bg-white btn-light pull-right mt-2" href="{{ this.url_to(download, alt=this.alt) }}">
-            {% endif %}
-
-              {{ _("Download Tor Browser") }}<i class="ml-2 pt-1 fas fa-arrow-down-png-purple"></i>
-            </a>
-        </div>
+  <div class="row">
+      <div class="col-4 d-flex onion-pattern">
+          <img src="{{ '/static/images/circle-pattern.png'|asseturl }}" class="img-svg">
+    </div>
+    <div class="col-sm-8 d-flex download-section mt-auto">
+      <div class="container pb-2 justify-content-right">
+         <h2 class="text-white text-bold">{{ _('Download Tor Browser') }}</h2>
+         <p class="text-white">{{ _('Download Tor Browser to experience real private browsing without tracking, surveillance, or censorship.') }}</p>
+          {%- set download = site.get('/download') -%}
+          {% if download == None -%}
+            <a class="btn text-primary bg-white btn-light pull-right mt-2" href="https://www.torproject.org/download/">
+          {% else %}
+            <a class="btn text-primary bg-white btn-light pull-right mt-2" href="{{ this.url_to(download, alt=this.alt) }}">
+          {% endif -%}
+          {{ _("Download Tor Browser") }}<i class="ml-2 pt-1 fas fa-arrow-down-png-purple"></i>
+         </a>
       </div>
     </div>
   </div>