diff --git a/assets/css/main.scss b/assets/css/main.scss
index f5b88885..b1ec2f1c 100644
--- a/assets/css/main.scss
+++ b/assets/css/main.scss
@@ -9,7 +9,7 @@
 }
 
 .container {
-  @apply px-8;
+  @apply px-4 md:px-12;
 }
 
 .fade-enter-active, .fade-leave-active {
diff --git a/components/download/DownloadHeading.vue b/components/download/DownloadHeading.vue
index 71da15ff..33331f80 100644
--- a/components/download/DownloadHeading.vue
+++ b/components/download/DownloadHeading.vue
@@ -44,11 +44,12 @@ const css = useCssModule();
       @apply flex flex-col space-y-4 mb-16;
 
       .title {
-        @apply text-rui-light-primary text-h6;
+        @apply text-rui-light-primary text-h6 font-medium;
       }
 
       .description {
-        @apply text-rui-text text-h3;
+        @apply text-rui-text text-h4 md:text-h3;
+        @apply font-normal #{!important};
       }
     }
 
diff --git a/components/download/DownloadPreview.vue b/components/download/DownloadPreview.vue
index e3d14f65..594b7e6d 100644
--- a/components/download/DownloadPreview.vue
+++ b/components/download/DownloadPreview.vue
@@ -82,10 +82,10 @@ scanImages();
     }
 
     .controls {
-      @apply flex flex-col absolute -bottom-[2.8125rem] z-10 -left-2 -right-2 items-center justify-center;
+      @apply flex flex-col absolute -bottom-[1.75rem] md:-bottom-[3rem] z-10 left-5 right-5 items-center justify-center;
 
       .preview {
-        @apply px-8 py-6 rounded-xl border border-black/[.12] bg-white text-h4;
+        @apply px-4 py-3 md:px-8 md:py-6 rounded-xl border border-black/[.12] bg-white text-h5 md:text-h4 font-bold;
         box-shadow: 4px 32px 80px 0 rgba(191, 194, 203, 0.24);
       }
     }