}
}
+// Responsive newsletter callout above the footer.
+
+.newsletter-signup-inner {
+ display: flex;
+ align-items: center;
+}
+
+.newsletter-signup {
+ background: #085a78;
+ padding: 1rem 0;
+
+ h5 {
+ color: $white;
+ font-size: 20px;
+ font-weight: 400;
+ line-height: 24px;
+ margin-bottom: 0;
+ }
+
+ p {
+ clear: both;
+ color: $white;
+ font-size: 13px;
+ margin-bottom: 0;
+ }
+
+ a {
+ color: $white;
+ }
+
+ .button {
+ background: $primary-color;
+
+ &:hover {
+ background: darken($primary-color, 14%);
+ }
+ }
+
+ .row.collapse form {
+ input[type="text"] {
+ border: 0;
+ color: #999;
+ font-size: 17px;
+ font-weight: 200;
+ position: relative;
+ }
+
+ .button {
+ background: #257696;
+ border: 0;
+ box-shadow: none;
+ margin: 0;
+
+ &:hover {
+ background: #1b566d;
+ }
+ }
+ }
+}
+
+#subForm {
+ margin-top: 1rem;
+}
+
+
<a href="http://zurb.com/university/courses">Training</a>
</li>
<li class="footer-nav-menu-item">
- <a href="{{root}}develop/getting-started.html">Building Blocks</a>
+ <a href="http://foundation.zurb.com/develop/getting-started.html">Building Blocks</a>
</li>
<li class="footer-nav-menu-item">
- <a href="{{root}}get-involved/support.html">Get Involved</a>
+ <a href="http://foundation.zurb.com/get-involved/support.html">Get Involved</a>
</li>
<li class="footer-nav-menu-item">
<a href="http://foundation.zurb.com/sites/docs/">Docs</a>
<div class="newsletter-signup layout-{{layout}}">
<div class="row column medium-9 medium-columns">
- <div class="row">
+ <div class="row newsletter-signup-inner">
<div class="medium-7 large-8 columns">
- <a href="{{root}}learn/responsive-reading.html">
+ <a href="http://foundation.zurb.com/learn/responsive-reading.html">
<h5 class="hide-for-medium-only">Download ZURB’s 17 Responsive Trends That Will Shape 2017</h5>
<p>Stay informed with amazing responsive trends each month from ZURB.</p>
</a>
</div>
<div class="medium-5 large-4 footer-signup-form columns">
- <a style="margin-bottom: 0;" href="{{root}}learn/responsive-reading.html" class="button expanded">Download the PDF</a>
+ <a style="margin-bottom: 0;" href="http://foundation.zurb.com/learn/responsive-reading.html" class="button expanded">Download the PDF</a>
</div>
</div>
</div>