styling apply box content

opentech/apply/dashboard/templates/dashboard/applicant_dashboard.html

@@ -11,10 +11,10 @@
             <h3 class="heading heading--no-margin">Dashboard</h3>
             <h5>An overview of active and past submissions</h5>
         </div>
-        <div>
-            <h3>Submit a new application</h3>
-            <h4>Apply now for our open rounds</h4>
-            <a href="{% pageurl APPLY_SITE.root_page %}" class="button">Apply</a>
+        <div class="wrapper wrapper--apply-box">
+            <h4 class="heading heading--no-margin">Submit a new application</h4>
+            <h5 class="heading heading--normal">Apply now for our open rounds</h5>
+            <a class="button button--primary" href="{% pageurl APPLY_SITE.root_page %}" class="button">Apply</a>
         </div>
     </div>
 </div>

opentech/static_src/src/sass/apply/components/_heading.scss

@@ -45,4 +45,8 @@
     &--uppercase {
         text-transform: uppercase;
     }
+
+    &--normal {
+        font-weight: $weight--normal;
+    }
 }

opentech/static_src/src/sass/apply/components/_wrapper.scss

@@ -232,6 +232,14 @@
             flex-direction: row;
         }
     }
+
+    &--apply-box {
+        width: 385px;
+        padding: 20px;
+        color: $color--default;
+        background-color: $color--white;
+    }
+
     &--applicant-dashboard {
         display: flex;
         flex-wrap: wrap;