Add large map to headquarters page

assets/css/style.css

@@ -1063,7 +1063,7 @@ GLOBAL STYLES
     font-size: 125%;
     transition: transform 0.5s; }
   body.sotto-dritto {
-    transform: rotate(2deg); }
+    transform: rotate(3deg); }
   .content {
     padding-top: 0;
     position: relative;
@@ -1078,7 +1078,7 @@ GLOBAL STYLES
       position: absolute;
       top: -2em;
       left: 0;
-      transform: skewY(-2deg);
+      transform: skewY(-3deg);
       transform-origin: bottom left; }
   .content.bg-dark:after {
     background: #212121; }
@@ -1201,7 +1201,7 @@ POST STYLING
       position: absolute;
       top: -2em;
       left: 0;
-      transform: skewY(-2deg);
+      transform: skewY(-3deg);
       transform-origin: bottom left; }
   /***************
 POST NAV STYLING
@@ -1229,6 +1229,8 @@ FOOTER STYLES
       max-width: 800px; }
     .footer.content:after {
       height: 5em; }
+  .no-footer-margin + .footer {
+    margin-top: 0; }
   /***************
 CONTACT PAGE STYLING
 ***************/
@@ -1242,8 +1244,8 @@ CONTACT PAGE STYLING
     float: right;
     margin-right: 0; }
   #home-hq-map {
-    -webkit-clip-path: polygon(0% calc(100vw * 0.035), 100% 0%, 100% calc(100% - calc(100vw * 0.035)), 0% 100%);
-    clip-path: polygon(0% calc(100vw * 0.035), 100% 0%, 100% calc(100% - calc(100vw * 0.035)), 0% 100%); }
+    -webkit-clip-path: polygon(0% calc(100vw * 0.052), 100% 0%, 100% calc(100% - calc(100vw * 0.052)), 0% 100%);
+    clip-path: polygon(0% calc(100vw * 0.052), 100% 0%, 100% calc(100% - calc(100vw * 0.052)), 0% 100%); }
   .before-map {
     padding-bottom: 35px; }
     .before-map p:last-of-type {

assets/scss/breakpoints/_800up.scss

@@ -8,7 +8,7 @@ body {
 }
 
 body.sotto-dritto {
-  transform: rotate(2deg);
+  transform: rotate(3deg);
 }
 
 .content {
@@ -26,7 +26,7 @@ body.sotto-dritto {
 		position: absolute;
 		top: -2em;
 		left: 0;
-		transform: skewY(-2deg);
+		transform: skewY(-3deg);
 		transform-origin: bottom left; 
 	}
 }
@@ -229,7 +229,7 @@ POST STYLING
 			position: absolute;
 			top: -2em;
 			left: 0;
-			transform: skewY(-2deg);
+			transform: skewY(-3deg);
 			transform-origin: bottom left;
 		}
 	}
@@ -284,6 +284,9 @@ FOOTER STYLES
   }
 }
 
+.no-footer-margin + .footer {
+  margin-top: 0;
+}
 
 /***************
 CONTACT PAGE STYLING
@@ -305,8 +308,8 @@ CONTACT PAGE STYLING
 }
 
 #home-hq-map {
-  -webkit-clip-path: polygon(0% calc(100vw * 0.035), 100% 0%, 100% calc(100% - calc(100vw * 0.035)), 0% 100%);
-  clip-path: polygon(0% calc(100vw * 0.035), 100% 0%, 100% calc(100% - calc(100vw * 0.035)), 0% 100%);
+  -webkit-clip-path: polygon(0% calc(100vw * 0.052), 100% 0%, 100% calc(100% - calc(100vw * 0.052)), 0% 100%);
+  clip-path: polygon(0% calc(100vw * 0.052), 100% 0%, 100% calc(100% - calc(100vw * 0.052)), 0% 100%);
 }
 
 .before-map {

hq.html

 ---
-layout: page 
+layout: main 
 title: Headquarters
 ---
 
-<p>
-We are located at the ground floor of <a href="https://go.polimi.it/maps/MIA0113" rel="noopener" target="_blank">Building 9A, Leonardo Campus</a>.
-</p>
-<p>
-To get there: <ul>
-  <li>Enter Building 9</li>
-  <li>Follow directions to room 9.0.4</li>
-  <li>Exit the building and walk towards the big gate</li>
-  <li>Our headquarters are on the left</li>
-</ul>
-</p>
 
-<p>
-Be sure to check <a href="https://bits.poul.org">B.I.T.S.</a> to see if we are open!
-</p>
+<div class="content before-map">
+  <div class="container post">
+    <div class="post">
+      <h1 class="postTitle">Headquarters</h1>
+    
+      <p>
+      We are located at the ground floor of <a href="https://go.polimi.it/maps/MIA0113" rel="noopener" target="_blank">Building 9A, Leonardo Campus</a>.
+      </p>
+      <p>
+      To get there: <ul>
+        <li>Enter Building 9</li>
+        <li>Follow directions to room 9.0.4</li>
+        <li>Exit the building and walk towards the big gate</li>
+        <li>Our headquarters are on the left</li>
+      </ul>
+      </p>
+      
+      <p>
+      Be sure to check <a href="https://bits.poul.org">B.I.T.S.</a> to see if we are open!
+      </p>
+    </div>
+  </div>
+</div>
 
-{% include leaflet.html id="hqmap" height="400" lat="45.4771659" long="9.2297918" zoom="19" marker="true" %}
+{% include headquarters_map.html %}
+
+<span class="no-footer-margin"></span>