Updating Changelog Styling

diff --git a/index.php b/index.php
index 11a1f9a27bf75ca8a1f31451491a310effa635a4..41d2e2b3354c509b3e7f8d9afeb3eb64aec592fd 100644 (file)
--- a/index.php
+++ b/index.php
@@ -102,7 +102,8 @@
     <ul class="large-block-grid-2 changelog">
       <li class="release-number">
         <h3 class="light">1.0</h3>
-        <p>Public Release</p>
+        <p>Initial Release</p>
+        <a href="http://zurb.com/ink/docs.php#v1-0-0">6 Features &raquo;</a>
       </li>
       <li class="changes">
         <div class="release-wrap">
@@ -111,7 +112,6 @@
             <li><span class="point-release-number">1.0.3</span> &mdash; Add compatibility chart of supported/tested clients to the docs. <br><a href="http://zurb.com/ink/docs.php#v1-0-3">+2 more updates &raquo;</a></li>
             <li><span class="point-release-number">1.0.2</span> &mdash; Switch to new button syntax to fully support Microsoft Outlook. <br><a href="http://zurb.com/ink/docs.php#v1-0-2">+1 more updates &raquo;</a></li>
             <li><span class="point-release-number">1.0.1</span> &mdash; Fixed issue in Gmail(mobile, Android, iOS). Added a min-width to <kbd>&lt;center&gt;</kbd> tags</li>
-            <li><span class="point-release-number">1.0.0</span> &mdash; Initial Launch <br><a href="http://zurb.com/ink/docs.php#v1-0-0">+6 more releases &raquo;</a></li>
           </ul>
         </div>
       </li>

diff --git a/sass/app.scss b/sass/app.scss
index 7eef0471551c33b644fde1f5e063b181d3a637b2..b8cc44108cb00f0b7e94cfa88119c29841b23316 100644 (file)
--- a/sass/app.scss
+++ b/sass/app.scss
@@ -217,7 +217,10 @@ hr { border-style: dashed; }
 
 ul.changelog { 
   li { list-style: none !important; 
-  &.release-number { width: 17%; padding-top: 12px; }
+  &.release-number { width: 17%; padding-top: 12px; 
+    p { margin-bottom: 0px !important; }
+    a { font-size: 14px; }
+  }
   &.changes { border-left: #cccccc 1px solid; width: 82.5555% ; }
     span.point-release-number { font-weight: 600; color: #333; }
     .release-wrap {  }

diff --git a/stylesheets/app.css b/stylesheets/app.css
index e6fd4e122fa77f82aa9429eb71eb66b5cfff6ace..6da06748a91e9d913a1dc4d6a8dd529ea40eb326 100644 (file)
--- a/stylesheets/app.css
+++ b/stylesheets/app.css
@@ -11603,33 +11603,41 @@ ul.changelog li.release-number {
   padding-top: 12px;
 }
 /* line 221, ../sass/app.scss */
+ul.changelog li.release-number p {
+  margin-bottom: 0px !important;
+}
+/* line 222, ../sass/app.scss */
+ul.changelog li.release-number a {
+  font-size: 14px;
+}
+/* line 224, ../sass/app.scss */
 ul.changelog li.changes {
   border-left: #cccccc 1px solid;
   width: 82.5555%;
 }
-/* line 222, ../sass/app.scss */
+/* line 225, ../sass/app.scss */
 ul.changelog li span.point-release-number {
   font-weight: 600;
   color: #333;
 }
-/* line 224, ../sass/app.scss */
+/* line 227, ../sass/app.scss */
 ul.changelog li .release-description {
   margin-top: 10px;
 }
-/* line 225, ../sass/app.scss */
+/* line 228, ../sass/app.scss */
 ul.changelog li .release-description li {
   padding: 12px 0;
   border-bottom: #ddd dashed 1px;
   line-height: 22px;
 }
-/* line 226, ../sass/app.scss */
+/* line 229, ../sass/app.scss */
 ul.changelog li .release-description a {
   font-size: 13px;
   margin-left: 60px;
 }
 
 @media only screen and (max-width: 767px) {
-  /* line 234, ../sass/app.scss */
+  /* line 237, ../sass/app.scss */
   ul.changelog li.release-number {
     width: 100%;
     padding-top: 12px;
@@ -11637,7 +11645,7 @@ ul.changelog li .release-description a {
     padding-bottom: 0px;
     border-bottom: #dddddd 1px solid;
   }
-  /* line 235, ../sass/app.scss */
+  /* line 238, ../sass/app.scss */
   ul.changelog li.changes {
     width: 100%;
     border-left: none;
@@ -11645,7 +11653,7 @@ ul.changelog li .release-description a {
   }
 }
 /* templates */
-/* line 243, ../sass/app.scss */
+/* line 246, ../sass/app.scss */
 .template-thumbs .preview-post {
   position: absolute;
   top: 47%;
@@ -11654,14 +11662,14 @@ ul.changelog li .release-description a {
   display: none;
   z-index: 1;
 }
-/* line 244, ../sass/app.scss */
+/* line 247, ../sass/app.scss */
 .template-thumbs .preview-post h5 {
   color: #ffffff;
   margin: 0px;
   line-height: 1;
   display: inline;
 }
-/* line 245, ../sass/app.scss */
+/* line 248, ../sass/app.scss */
 .template-thumbs .preview-post img {
   display: inline-block;
   width: 20px;
@@ -11670,7 +11678,7 @@ ul.changelog li .release-description a {
 }
 
 @media only screen {
-  /* line 248, ../sass/app.scss */
+  /* line 251, ../sass/app.scss */
   .preview {
     -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
     box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset;
@@ -11679,62 +11687,62 @@ ul.changelog li .release-description a {
     transition: background-color 400ms ease-in-out;
   }
 }
-/* line 256, ../sass/app.scss */
+/* line 259, ../sass/app.scss */
 .template-thumbs {
   margin-bottom: 50px;
 }
-/* line 257, ../sass/app.scss */
+/* line 260, ../sass/app.scss */
 .template-thumbs a {
   display: block;
   position: relative;
 }
-/* line 258, ../sass/app.scss */
+/* line 261, ../sass/app.scss */
 .template-thumbs a.button {
   display: inline-block;
   width: 45%;
 }
-/* line 259, ../sass/app.scss */
+/* line 262, ../sass/app.scss */
 .template-thumbs a img.thumb {
   display: block;
   margin-bottom: 15px;
   border: #f1f1f1 1px solid;
   width: 100%;
 }
-/* line 260, ../sass/app.scss */
+/* line 263, ../sass/app.scss */
 .template-thumbs a.preview:hover {
   background-color: rgba(0, 0, 0, 0.5);
 }
-/* line 261, ../sass/app.scss */
+/* line 264, ../sass/app.scss */
 .template-thumbs a.preview:hover img.thumb {
   opacity: 0.4;
 }
-/* line 262, ../sass/app.scss */
+/* line 265, ../sass/app.scss */
 .template-thumbs a.preview:hover .preview-post {
   display: block;
 }
-/* line 265, ../sass/app.scss */
+/* line 268, ../sass/app.scss */
 .template-thumbs span {
   display: block;
   color: #333;
 }
-/* line 266, ../sass/app.scss */
+/* line 269, ../sass/app.scss */
 .template-thumbs span.description {
   font-size: 0.875em;
   margin-bottom: 15px;
 }
-/* line 268, ../sass/app.scss */
+/* line 271, ../sass/app.scss */
 .template-thumbs h6.name {
   font-size: 1.3125em;
   font-family: "Proxima Nova", "proxima-nova", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
   color: #0d2b40;
   display: inline;
 }
-/* line 269, ../sass/app.scss */
+/* line 272, ../sass/app.scss */
 .template-thumbs h6.name span {
   display: inline-block;
   font-weight: 400;
 }
-/* line 270, ../sass/app.scss */
+/* line 273, ../sass/app.scss */
 .template-thumbs h6.name a {
   display: inline-block;
   float: right;
@@ -11744,27 +11752,27 @@ ul.changelog li .release-description a {
   line-height: 24px;
 }
 
-/* line 273, ../sass/app.scss */
+/* line 276, ../sass/app.scss */
 .thumb-select {
   margin-top: 20px;
 }
-/* line 274, ../sass/app.scss */
+/* line 277, ../sass/app.scss */
 .thumb-select label, .thumb-select select {
   display: inline-block;
 }
-/* line 275, ../sass/app.scss */
+/* line 278, ../sass/app.scss */
 .thumb-select select {
   width: 110px;
   margin-left: 10px;
 }
 
-/* line 277, ../sass/app.scss */
+/* line 280, ../sass/app.scss */
 .how-to-use {
   position: relative;
   padding: 30px 0;
 }
 
-/* line 278, ../sass/app.scss */
+/* line 281, ../sass/app.scss */
 .inky-small {
   height: 377px;
   width: 323px;
@@ -11774,7 +11782,7 @@ ul.changelog li .release-description a {
   z-index: 2;
 }
 
-/* line 279, ../sass/app.scss */
+/* line 282, ../sass/app.scss */
 .inky-small.load {
   animation-name: small-inky;
   -webkit-animation-name: small-inky;
@@ -11784,7 +11792,7 @@ ul.changelog li .release-description a {
   -webkit-animation-iteration-count: infinite;
 }
 
-/* line 281, ../sass/app.scss */
+/* line 284, ../sass/app.scss */
 .inky-comp {
   height: 220px;
   width: 240px;
@@ -11794,7 +11802,7 @@ ul.changelog li .release-description a {
   z-index: 2;
 }
 
-/* line 282, ../sass/app.scss */
+/* line 285, ../sass/app.scss */
 .inky-comp.load {
   animation-name: small-inky;
   -webkit-animation-name: small-inky;
@@ -11805,12 +11813,12 @@ ul.changelog li .release-description a {
 }
 
 /* downloading */
-/* line 285, ../sass/app.scss */
+/* line 288, ../sass/app.scss */
 .main-text {
   position: relative;
 }
 
-/* line 286, ../sass/app.scss */
+/* line 289, ../sass/app.scss */
 .inky-fish {
   background: url(../images/inky-mobile-hold.svg) no-repeat center center;
   background-size: cover;
@@ -11821,48 +11829,48 @@ ul.changelog li .release-description a {
   top: 40px;
 }
 
-/* line 287, ../sass/app.scss */
+/* line 290, ../sass/app.scss */
 .under-inky-fish {
   margin-top: 50px;
   margin-bottom: 50px;
 }
-/* line 288, ../sass/app.scss */
+/* line 291, ../sass/app.scss */
 .under-inky-fish ul {
   font-size: 0.875em;
   margin-left: 15px;
 }
 
-/* line 290, ../sass/app.scss */
+/* line 293, ../sass/app.scss */
 .read-docs {
   margin-top: 20px;
 }
-/* line 291, ../sass/app.scss */
+/* line 294, ../sass/app.scss */
 .read-docs a {
   background: #e5ecee url(../images/icons/read-docs.png) no-repeat 38px center;
   padding: 23px 23px 23px 97px;
   background-size: 32px 44px;
   display: block;
 }
-/* line 292, ../sass/app.scss */
+/* line 295, ../sass/app.scss */
 .read-docs span {
   margin-bottom: 0;
   display: block;
 }
-/* line 293, ../sass/app.scss */
+/* line 296, ../sass/app.scss */
 .read-docs span.title {
   color: #0c2739;
   font-size: 1.3125em;
   font-family: "Proxima Nova", "proxima-nova", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
   margin-bottom: 10px;
 }
-/* line 294, ../sass/app.scss */
+/* line 297, ../sass/app.scss */
 .read-docs span.description {
   font-size: 0.875em;
   color: #333;
   line-height: 1.6;
 }
 
-/* line 298, ../sass/app.scss */
+/* line 301, ../sass/app.scss */
 .inky-fish.load {
   animation-name: inky-fishes;
   -webkit-animation-name: inky-fishes;
@@ -11877,54 +11885,54 @@ ul.changelog li .release-description a {
 }
 
 @keyframes inky-fishes {
-  /* line 300, ../sass/app.scss */
+  /* line 303, ../sass/app.scss */
   0% {
     transform: rotate(-15deg);
   }
 
-  /* line 301, ../sass/app.scss */
+  /* line 304, ../sass/app.scss */
   50% {
     transform: rotate(15deg);
   }
 
-  /* line 302, ../sass/app.scss */
+  /* line 305, ../sass/app.scss */
   100% {
     transform: rotate(-15deg);
   }
 }
 
 @-webkit-keyframes inky-fishes {
-  /* line 306, ../sass/app.scss */
+  /* line 309, ../sass/app.scss */
   0% {
     -webkit-transform: rotate(-15deg);
   }
 
-  /* line 307, ../sass/app.scss */
+  /* line 310, ../sass/app.scss */
   50% {
     -webkit-transform: rotate(15deg);
   }
 
-  /* line 308, ../sass/app.scss */
+  /* line 311, ../sass/app.scss */
   100% {
     -webkit-transform: rotate(-15deg);
   }
 }
 
 /* process */
-/* line 315, ../sass/app.scss */
+/* line 318, ../sass/app.scss */
 .how-to-use {
   position: relative;
 }
-/* line 316, ../sass/app.scss */
+/* line 319, ../sass/app.scss */
 .how-to-use.one {
   margin-bottom: 10px;
 }
-/* line 317, ../sass/app.scss */
+/* line 320, ../sass/app.scss */
 .how-to-use.one p, .how-to-use.one img, .how-to-use.one h3 {
   width: 430px;
   margin-left: 80px;
 }
-/* line 318, ../sass/app.scss */
+/* line 321, ../sass/app.scss */
 .how-to-use.one .process-1 {
   background: url(../images/inky-outlook.svg) no-repeat center center;
   height: 335px;
@@ -11934,20 +11942,20 @@ ul.changelog li .release-description a {
   right: 65px;
   top: -50px;
 }
-/* line 319, ../sass/app.scss */
+/* line 322, ../sass/app.scss */
 .how-to-use.one .bump-space {
   margin-left: 120px;
 }
-/* line 321, ../sass/app.scss */
+/* line 324, ../sass/app.scss */
 .how-to-use.two {
   margin-bottom: 10px;
 }
-/* line 322, ../sass/app.scss */
+/* line 325, ../sass/app.scss */
 .how-to-use.two p, .how-to-use.two img, .how-to-use.two h3 {
   width: 460px;
   margin-left: 110px;
 }
-/* line 323, ../sass/app.scss */
+/* line 326, ../sass/app.scss */
 .how-to-use.two .process-2 {
   height: 134px;
   width: 231px;
@@ -11956,29 +11964,29 @@ ul.changelog li .release-description a {
   left: 8px;
   top: 38px;
 }
-/* line 324, ../sass/app.scss */
+/* line 327, ../sass/app.scss */
 .how-to-use.two .process-2 img {
   margin-left: 0px;
 }
-/* line 326, ../sass/app.scss */
+/* line 329, ../sass/app.scss */
 .how-to-use.two .bump-space {
   margin-left: 270px;
 }
-/* line 328, ../sass/app.scss */
+/* line 331, ../sass/app.scss */
 .how-to-use.three {
   margin-bottom: 30px;
 }
-/* line 329, ../sass/app.scss */
+/* line 332, ../sass/app.scss */
 .how-to-use.three p, .how-to-use.three img, .how-to-use.three h3 {
   width: 460px;
   margin-left: 110px;
 }
-/* line 330, ../sass/app.scss */
+/* line 333, ../sass/app.scss */
 .how-to-use.three p.with-border {
   border-bottom: 1px solid #ddd;
   padding-bottom: 20px;
 }
-/* line 331, ../sass/app.scss */
+/* line 334, ../sass/app.scss */
 .how-to-use.three .process-3 {
   height: 377px;
   width: 273px;
@@ -11987,35 +11995,35 @@ ul.changelog li .release-description a {
   right: 110px;
   top: -80px;
 }
-/* line 332, ../sass/app.scss */
+/* line 335, ../sass/app.scss */
 .how-to-use.three .process-3 img {
   margin-left: 0px;
 }
-/* line 333, ../sass/app.scss */
+/* line 336, ../sass/app.scss */
 .how-to-use.three .process-3 .inky-point {
   background: url(../images/inky-point.svg) no-repeat center center;
   height: 386px;
   width: 349px;
   background-size: cover;
 }
-/* line 335, ../sass/app.scss */
+/* line 338, ../sass/app.scss */
 .how-to-use.three .bump-space {
   margin-left: 50px;
 }
-/* line 337, ../sass/app.scss */
+/* line 340, ../sass/app.scss */
 .how-to-use.four {
   margin-bottom: 30px;
 }
-/* line 338, ../sass/app.scss */
+/* line 341, ../sass/app.scss */
 .how-to-use.four p, .how-to-use.four img, .how-to-use.four h3 {
   width: 460px;
   margin-left: 110px;
 }
-/* line 339, ../sass/app.scss */
+/* line 342, ../sass/app.scss */
 .how-to-use.four .bump-space {
   margin-left: 300px;
 }
-/* line 340, ../sass/app.scss */
+/* line 343, ../sass/app.scss */
 .how-to-use.four .process-4 {
   background: url(../images/fish-3.svg) no-repeat center center;
   height: 116px;
@@ -12025,7 +12033,7 @@ ul.changelog li .release-description a {
   right: 0;
   top: 35px;
 }
-/* line 341, ../sass/app.scss */
+/* line 344, ../sass/app.scss */
 .how-to-use.four .process-4-2 {
   height: 63px;
   width: 96px;
@@ -12034,30 +12042,30 @@ ul.changelog li .release-description a {
   left: 201px;
   top: -16px;
 }
-/* line 342, ../sass/app.scss */
+/* line 345, ../sass/app.scss */
 .how-to-use.four .process-4-2 img {
   margin-left: 0px;
 }
-/* line 346, ../sass/app.scss */
+/* line 349, ../sass/app.scss */
 .how-to-use.five {
   padding-bottom: 190px;
 }
-/* line 347, ../sass/app.scss */
+/* line 350, ../sass/app.scss */
 .how-to-use.five .number {
   top: -13px;
 }
-/* line 348, ../sass/app.scss */
+/* line 351, ../sass/app.scss */
 .how-to-use.five p, .how-to-use.five img, .how-to-use.five h3 {
   width: 460px;
   margin-left: 110px;
 }
-/* line 349, ../sass/app.scss */
+/* line 352, ../sass/app.scss */
 .how-to-use.five .bump-space {
   margin-left: 185px;
   position: relative;
   z-index: 2;
 }
-/* line 350, ../sass/app.scss */
+/* line 353, ../sass/app.scss */
 .how-to-use.five .process-5 {
   height: 377px;
   width: 273px;
@@ -12066,7 +12074,7 @@ ul.changelog li .release-description a {
   left: 0;
   top: -120px;
 }
-/* line 351, ../sass/app.scss */
+/* line 354, ../sass/app.scss */
 .how-to-use.five .process-5-2 {
   height: 56px;
   width: 217px;
@@ -12075,15 +12083,15 @@ ul.changelog li .release-description a {
   right: 20px;
   top: 92px;
 }
-/* line 352, ../sass/app.scss */
+/* line 355, ../sass/app.scss */
 .how-to-use.five .process-5-2 img {
   margin-left: 0px;
 }
-/* line 355, ../sass/app.scss */
+/* line 358, ../sass/app.scss */
 .how-to-use h3 {
   margin-bottom: 10px;
 }
-/* line 356, ../sass/app.scss */
+/* line 359, ../sass/app.scss */
 .how-to-use .number {
   display: block;
   font-family: "Proxima Nova", "proxima-nova", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
@@ -12093,20 +12101,20 @@ ul.changelog li .release-description a {
   position: absolute;
   top: 23px;
 }
-/* line 357, ../sass/app.scss */
+/* line 360, ../sass/app.scss */
 .how-to-use .campaign-monitor {
   background: url(../images/campaign-monitor.png) no-repeat left center;
   background-size: 18px 12px;
   padding-left: 30px;
 }
 
-/* line 359, ../sass/app.scss */
+/* line 362, ../sass/app.scss */
 .water {
   background: #004454;
   height: 80px;
 }
 
-/* line 360, ../sass/app.scss */
+/* line 363, ../sass/app.scss */
 .process-5-3 {
   background: url(../images/inky-boat.svg) bottom center no-repeat;
   height: 327px;
@@ -12117,13 +12125,13 @@ ul.changelog li .release-description a {
   top: -210px;
 }
 @media only screen and (max-width: 767px) {
-  /* line 360, ../sass/app.scss */
+  /* line 363, ../sass/app.scss */
   .process-5-3 {
     width: 100%;
   }
 }
 
-/* line 364, ../sass/app.scss */
+/* line 367, ../sass/app.scss */
 .process-2.load img {
   animation-name: fish1;
   -webkit-animation-name: fish1;
@@ -12135,40 +12143,40 @@ ul.changelog li .release-description a {
 }
 
 @keyframes fish1 {
-  /* line 366, ../sass/app.scss */
+  /* line 369, ../sass/app.scss */
   0% {
     transform: translateX(0%);
   }
 
-  /* line 367, ../sass/app.scss */
+  /* line 370, ../sass/app.scss */
   50% {
     transform: translateX(3%);
   }
 
-  /* line 368, ../sass/app.scss */
+  /* line 371, ../sass/app.scss */
   100% {
     transform: translateX(0%);
   }
 }
 
 @-webkit-keyframes fish1 {
-  /* line 372, ../sass/app.scss */
+  /* line 375, ../sass/app.scss */
   0% {
     -webkit-transform: translateX(0%);
   }
 
-  /* line 373, ../sass/app.scss */
+  /* line 376, ../sass/app.scss */
   50% {
     -webkit-transform: translateX(3%);
   }
 
-  /* line 374, ../sass/app.scss */
+  /* line 377, ../sass/app.scss */
   100% {
     -webkit-transform: translateX(0%);
   }
 }
 
-/* line 378, ../sass/app.scss */
+/* line 381, ../sass/app.scss */
 .process-3.load div {
   animation-name: small-inky;
   -webkit-animation-name: small-inky;
@@ -12182,40 +12190,40 @@ ul.changelog li .release-description a {
 }
 
 @keyframes small-inky {
-  /* line 390, ../sass/app.scss */
+  /* line 393, ../sass/app.scss */
   0% {
     transform: translateY(0%);
   }
 
-  /* line 391, ../sass/app.scss */
+  /* line 394, ../sass/app.scss */
   50% {
     transform: translateY(2%);
   }
 
-  /* line 392, ../sass/app.scss */
+  /* line 395, ../sass/app.scss */
   100% {
     transform: translateY(0%);
   }
 }
 
 @-webkit-keyframes small-inky {
-  /* line 396, ../sass/app.scss */
+  /* line 399, ../sass/app.scss */
   0% {
     -webkit-transform: translateY(0%);
   }
 
-  /* line 397, ../sass/app.scss */
+  /* line 400, ../sass/app.scss */
   50% {
     -webkit-transform: translateY(2%);
   }
 
-  /* line 398, ../sass/app.scss */
+  /* line 401, ../sass/app.scss */
   100% {
     -webkit-transform: translateY(0%);
   }
 }
 
-/* line 402, ../sass/app.scss */
+/* line 405, ../sass/app.scss */
 .process-4-2.load img {
   animation-name: fish2;
   -webkit-animation-name: fish2;
@@ -12226,40 +12234,40 @@ ul.changelog li .release-description a {
 }
 
 @keyframes fish2 {
-  /* line 404, ../sass/app.scss */
+  /* line 407, ../sass/app.scss */
   0% {
     transform: translateY(0%);
   }
 
-  /* line 405, ../sass/app.scss */
+  /* line 408, ../sass/app.scss */
   50% {
     transform: translateY(12%);
   }
 
-  /* line 406, ../sass/app.scss */
+  /* line 409, ../sass/app.scss */
   100% {
     transform: translateY(0%);
   }
 }
 
 @-webkit-keyframes fish2 {
-  /* line 410, ../sass/app.scss */
+  /* line 413, ../sass/app.scss */
   0% {
     -webkit-transform: translateY(0%);
   }
 
-  /* line 411, ../sass/app.scss */
+  /* line 414, ../sass/app.scss */
   50% {
     -webkit-transform: translateY(12%);
   }
 
-  /* line 412, ../sass/app.scss */
+  /* line 415, ../sass/app.scss */
   100% {
     -webkit-transform: translateY(0%);
   }
 }
 
-/* line 415, ../sass/app.scss */
+/* line 418, ../sass/app.scss */
 .process-5-2.load img {
   animation-name: fish3;
   -webkit-animation-name: fish3;
@@ -12270,98 +12278,98 @@ ul.changelog li .release-description a {
 }
 
 @keyframes fish3 {
-  /* line 417, ../sass/app.scss */
+  /* line 420, ../sass/app.scss */
   0% {
     transform: translateX(0%);
   }
 
-  /* line 418, ../sass/app.scss */
+  /* line 421, ../sass/app.scss */
   50% {
     transform: translateX(5%);
   }
 
-  /* line 419, ../sass/app.scss */
+  /* line 422, ../sass/app.scss */
   100% {
     transform: translateX(0%);
   }
 }
 
 @-webkit-keyframes fish3 {
-  /* line 423, ../sass/app.scss */
+  /* line 426, ../sass/app.scss */
   0% {
     -webkit-transform: translateX(0%);
   }
 
-  /* line 424, ../sass/app.scss */
+  /* line 427, ../sass/app.scss */
   50% {
     -webkit-transform: translateX(5%);
   }
 
-  /* line 425, ../sass/app.scss */
+  /* line 428, ../sass/app.scss */
   100% {
     -webkit-transform: translateX(0%);
   }
 }
 
 /* docs  */
-/* line 430, ../sass/app.scss */
+/* line 433, ../sass/app.scss */
 .doc-nav {
   list-style: none;
   margin-top: 50px;
 }
-/* line 431, ../sass/app.scss */
+/* line 434, ../sass/app.scss */
 .doc-nav li {
   display: block;
   width: 100%;
   font-size: 0.875em;
   margin-bottom: 10px;
 }
-/* line 432, ../sass/app.scss */
+/* line 435, ../sass/app.scss */
 .doc-nav li a {
   color: #333;
   display: block;
 }
-/* line 433, ../sass/app.scss */
+/* line 436, ../sass/app.scss */
 .doc-nav li a.current {
   font-weight: bold;
   margin-bottom: 10px;
 }
-/* line 434, ../sass/app.scss */
+/* line 437, ../sass/app.scss */
 .doc-nav li a:hover {
   color: #000;
 }
-/* line 436, ../sass/app.scss */
+/* line 439, ../sass/app.scss */
 .doc-nav li ul li {
   font-size: 1em;
 }
 
-/* line 440, ../sass/app.scss */
+/* line 443, ../sass/app.scss */
 .docs h1 {
   margin-top: 30px;
   margin-bottom: 0;
 }
-/* line 441, ../sass/app.scss */
+/* line 444, ../sass/app.scss */
 .docs .label {
   background: #ddd;
   color: #333;
 }
-/* line 442, ../sass/app.scss */
+/* line 445, ../sass/app.scss */
 .docs table {
   width: 100%;
   font-size: 0.9375em;
 }
-/* line 443, ../sass/app.scss */
+/* line 446, ../sass/app.scss */
 .docs table td {
   line-height: 1.6;
   vertical-align: top;
 }
-/* line 445, ../sass/app.scss */
+/* line 448, ../sass/app.scss */
 .docs hr.section {
   margin-top: 50px;
   border-style: solid;
   border-width: 2px;
 }
-/* line 450, ../sass/app.scss */
+/* line 453, ../sass/app.scss */
 .docs code.geshi {
   display: block;
   padding: 15px;
@@ -12369,13 +12377,13 @@ ul.changelog li .release-description a {
   font-size: 14px;
   color: #fff;
 }
-/* line 457, ../sass/app.scss */
+/* line 460, ../sass/app.scss */
 .docs iframe {
   width: 100%;
   border: 1px solid #ddd;
 }
 
-/* line 462, ../sass/app.scss */
+/* line 465, ../sass/app.scss */
 .prev-next-section {
   *zoom: 1;
   border-top: 1px dashed #ddd;
@@ -12391,19 +12399,19 @@ ul.changelog li .release-description a {
 .prev-next-section:after {
   clear: both;
 }
-/* line 463, ../sass/app.scss */
+/* line 466, ../sass/app.scss */
 .prev-next-section a {
   font-weight: bold;
   color: #333;
 }
 
 @media only screen and (max-width: 767px) {
-  /* line 468, ../sass/app.scss */
+  /* line 471, ../sass/app.scss */
   .top-area {
     position: relative;
   }
 
-  /* line 469, ../sass/app.scss */
+  /* line 472, ../sass/app.scss */
   .top-area .inky-phone {
     display: block;
     background: url(../images/inky-mobile-hold.svg);
@@ -12417,33 +12425,33 @@ ul.changelog li .release-description a {
     background-size: cover;
   }
 
-  /* line 470, ../sass/app.scss */
+  /* line 473, ../sass/app.scss */
   .top-area .home-text {
     padding: 40px 0 50px;
     position: relative;
     z-index: 2;
   }
 
-  /* line 471, ../sass/app.scss */
+  /* line 474, ../sass/app.scss */
   .templates-callout {
     top: 0px;
     margin-bottom: 50px;
   }
 
-  /* line 474, ../sass/app.scss */
+  /* line 477, ../sass/app.scss */
   .how-to-use h3, .how-to-use p {
     width: 100% !important;
     margin-left: 0 !important;
   }
-  /* line 475, ../sass/app.scss */
+  /* line 478, ../sass/app.scss */
   .how-to-use .bump-space {
     margin-left: 0 !important;
   }
-  /* line 476, ../sass/app.scss */
+  /* line 479, ../sass/app.scss */
   .how-to-use .process-1, .how-to-use .process-2, .how-to-use .process-3, .how-to-use .process-4, .how-to-use .process-4-2, .how-to-use .process-5, .how-to-use .process-5-2 {
     display: none !important;
   }
-  /* line 477, ../sass/app.scss */
+  /* line 480, ../sass/app.scss */
   .how-to-use .number {
     position: relative;
     text-align: left;
@@ -12451,13 +12459,13 @@ ul.changelog li .release-description a {
     font-size: 3.625em;
     top: auto;
   }
-  /* line 478, ../sass/app.scss */
+  /* line 481, ../sass/app.scss */
   .how-to-use img {
     margin-left: 0 !important;
     width: 100% !important;
   }
 
-  /* line 480, ../sass/app.scss */
+  /* line 483, ../sass/app.scss */
   .callout .row .stamp {
     width: 129px;
     right: 0;
@@ -12465,16 +12473,16 @@ ul.changelog li .release-description a {
     top: -54px;
   }
 }
-/* line 483, ../sass/app.scss */
+/* line 486, ../sass/app.scss */
 ul.mobile-nav {
   display: block;
   margin-bottom: 0;
 }
-/* line 484, ../sass/app.scss */
+/* line 487, ../sass/app.scss */
 ul.mobile-nav li {
   display: block;
 }
-/* line 485, ../sass/app.scss */
+/* line 488, ../sass/app.scss */
 ul.mobile-nav a {
   display: block;
   padding: 10px;
@@ -12483,33 +12491,33 @@ ul.mobile-nav a {
   border-bottom: 1px solid rgba(255, 255, 255, 0.5);
   font-weight: bold;
 }
-/* line 486, ../sass/app.scss */
+/* line 489, ../sass/app.scss */
 ul.mobile-nav a.current {
   background: #002f3b;
 }
 
 @media only screen and (min-width: 767px) and (max-width: 1024px) {
-  /* line 491, ../sass/app.scss */
+  /* line 494, ../sass/app.scss */
   .callout .row .stamp {
     top: -134px;
     right: 0;
   }
 
-  /* line 492, ../sass/app.scss */
+  /* line 495, ../sass/app.scss */
   .inky {
     right: -620px;
   }
 
-  /* line 493, ../sass/app.scss */
+  /* line 496, ../sass/app.scss */
   .how-to-use {
     position: relative;
   }
-  /* line 495, ../sass/app.scss */
+  /* line 498, ../sass/app.scss */
   .how-to-use.one p, .how-to-use.one img, .how-to-use.one h3 {
     width: 400px;
     margin-left: 70px;
   }
-  /* line 496, ../sass/app.scss */
+  /* line 499, ../sass/app.scss */
   .how-to-use.one .process-1 {
     background: url(../images/inky.svg) no-repeat center center;
     height: 325px;
@@ -12519,20 +12527,20 @@ ul.mobile-nav a.current {
     right: -13px;
     top: -50px;
   }
-  /* line 497, ../sass/app.scss */
+  /* line 500, ../sass/app.scss */
   .how-to-use.one .bump-space {
     margin-left: 60px;
   }
-  /* line 499, ../sass/app.scss */
+  /* line 502, ../sass/app.scss */
   .how-to-use.two {
     margin-bottom: 10px;
   }
-  /* line 500, ../sass/app.scss */
+  /* line 503, ../sass/app.scss */
   .how-to-use.two p, .how-to-use.two img, .how-to-use.two h3 {
     width: 440px;
     margin-left: 100px;
   }
-  /* line 501, ../sass/app.scss */
+  /* line 504, ../sass/app.scss */
   .how-to-use.two .process-2 {
     height: 65px;
     width: 124px;
@@ -12542,29 +12550,29 @@ ul.mobile-nav a.current {
     top: 38px;
     z-index: -1;
   }
-  /* line 502, ../sass/app.scss */
+  /* line 505, ../sass/app.scss */
   .how-to-use.two .process-2 img {
     margin-left: 0px;
   }
-  /* line 504, ../sass/app.scss */
+  /* line 507, ../sass/app.scss */
   .how-to-use.two .bump-space {
     margin-left: 100px;
   }
-  /* line 506, ../sass/app.scss */
+  /* line 509, ../sass/app.scss */
   .how-to-use.three {
     margin-bottom: 30px;
   }
-  /* line 507, ../sass/app.scss */
+  /* line 510, ../sass/app.scss */
   .how-to-use.three p, .how-to-use.three img, .how-to-use.three h3 {
     width: 350px;
     margin-left: 100px;
   }
-  /* line 508, ../sass/app.scss */
+  /* line 511, ../sass/app.scss */
   .how-to-use.three p.with-border {
     border-bottom: 1px solid #ddd;
     padding-bottom: 20px;
   }
-  /* line 509, ../sass/app.scss */
+  /* line 512, ../sass/app.scss */
   .how-to-use.three .process-3 {
     height: 377px;
     width: 273px;
@@ -12573,28 +12581,28 @@ ul.mobile-nav a.current {
     right: 70px;
     top: -100px;
   }
-  /* line 510, ../sass/app.scss */
+  /* line 513, ../sass/app.scss */
   .how-to-use.three .process-3 img {
     margin-left: 0px;
   }
-  /* line 512, ../sass/app.scss */
+  /* line 515, ../sass/app.scss */
   .how-to-use.three .bump-space {
     margin-left: 0;
   }
-  /* line 514, ../sass/app.scss */
+  /* line 517, ../sass/app.scss */
   .how-to-use.four {
     margin-bottom: 30px;
   }
-  /* line 515, ../sass/app.scss */
+  /* line 518, ../sass/app.scss */
   .how-to-use.four p, .how-to-use.four img, .how-to-use.four h3 {
     width: 350px;
     margin-left: 100px;
   }
-  /* line 516, ../sass/app.scss */
+  /* line 519, ../sass/app.scss */
   .how-to-use.four .bump-space {
     margin-left: 150px;
   }
-  /* line 517, ../sass/app.scss */
+  /* line 520, ../sass/app.scss */
   .how-to-use.four .process-4 {
     background: url(../images/fish-3.png) no-repeat center center;
     height: 116px;
@@ -12604,7 +12612,7 @@ ul.mobile-nav a.current {
     right: 0;
     top: 35px;
   }
-  /* line 518, ../sass/app.scss */
+  /* line 521, ../sass/app.scss */
   .how-to-use.four .process-4-2 {
     height: 63px;
     width: 96px;
@@ -12613,30 +12621,30 @@ ul.mobile-nav a.current {
     left: 40px;
     top: -16px;
   }
-  /* line 519, ../sass/app.scss */
+  /* line 522, ../sass/app.scss */
   .how-to-use.four .process-4-2 img {
     margin-left: 0px;
   }
-  /* line 523, ../sass/app.scss */
+  /* line 526, ../sass/app.scss */
   .how-to-use.five {
     padding-bottom: 160px;
   }
-  /* line 524, ../sass/app.scss */
+  /* line 527, ../sass/app.scss */
   .how-to-use.five .number {
     top: -13px;
   }
-  /* line 525, ../sass/app.scss */
+  /* line 528, ../sass/app.scss */
   .how-to-use.five p, .how-to-use.five img, .how-to-use.five h3 {
     width: 470px;
     margin-left: 100px;
   }
-  /* line 526, ../sass/app.scss */
+  /* line 529, ../sass/app.scss */
   .how-to-use.five .bump-space {
     margin-left: 20px;
     position: relative;
     z-index: 2;
   }
-  /* line 527, ../sass/app.scss */
+  /* line 530, ../sass/app.scss */
   .how-to-use.five .process-5 {
     height: 377px;
     width: 273px;
@@ -12645,7 +12653,7 @@ ul.mobile-nav a.current {
     left: 0;
     top: -120px;
   }
-  /* line 528, ../sass/app.scss */
+  /* line 531, ../sass/app.scss */
   .how-to-use.five .process-5-2 {
     height: 80px;
     width: 130px;
@@ -12654,15 +12662,15 @@ ul.mobile-nav a.current {
     right: 50px;
     top: 92px;
   }
-  /* line 529, ../sass/app.scss */
+  /* line 532, ../sass/app.scss */
   .how-to-use.five .process-5-2 img {
     margin-left: 0px;
   }
-  /* line 532, ../sass/app.scss */
+  /* line 535, ../sass/app.scss */
   .how-to-use h3 {
     margin-bottom: 10px;
   }
-  /* line 533, ../sass/app.scss */
+  /* line 536, ../sass/app.scss */
   .how-to-use .number {
     display: block;
     font-family: "Proxima Nova", "proxima-nova", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
@@ -12672,97 +12680,97 @@ ul.mobile-nav a.current {
     position: absolute;
     top: 23px;
   }
-  /* line 534, ../sass/app.scss */
+  /* line 537, ../sass/app.scss */
   .how-to-use .campaign-monitor {
     background: url(../images/campaign-monitor.png) no-repeat left center;
     background-size: 18px 12px;
     padding-left: 30px;
   }
 
-  /* line 536, ../sass/app.scss */
+  /* line 539, ../sass/app.scss */
   .inky-small.load {
     right: -250px;
     width: 283px;
   }
 
-  /* line 537, ../sass/app.scss */
+  /* line 540, ../sass/app.scss */
   .top-bar-section .has-form {
     padding: 11px 15px;
     height: 45px;
   }
 
-  /* line 538, ../sass/app.scss */
+  /* line 541, ../sass/app.scss */
   .button.tiny {
     padding: 5px 10px;
   }
 
-  /* line 539, ../sass/app.scss */
+  /* line 542, ../sass/app.scss */
   .top-area.main {
     overflow-x: hidden;
   }
 }
 /* coming-soon */
-/* line 543, ../sass/app.scss */
+/* line 546, ../sass/app.scss */
 .coming-soon {
   background: #004454;
 }
-/* line 544, ../sass/app.scss */
+/* line 547, ../sass/app.scss */
 .coming-soon .home-text {
   padding: 80px 0 83px;
 }
-/* line 545, ../sass/app.scss */
+/* line 548, ../sass/app.scss */
 .coming-soon .cs-text {
   margin-bottom: 5px;
   color: rgba(255, 255, 255, 0.5);
 }
-/* line 546, ../sass/app.scss */
+/* line 549, ../sass/app.scss */
 .coming-soon input {
   height: 42px;
 }
-/* line 547, ../sass/app.scss */
+/* line 550, ../sass/app.scss */
 .coming-soon .confirm {
   font-size: 1em;
   font-style: italic;
 }
-/* line 548, ../sass/app.scss */
+/* line 551, ../sass/app.scss */
 .coming-soon .confirm.error {
   color: red;
 }
 
 @media only screen and (max-width: 767px) {
-  /* line 554, ../sass/app.scss */
+  /* line 557, ../sass/app.scss */
   .coming-soon h1, .coming-soon p {
     text-align: center;
   }
-  /* line 555, ../sass/app.scss */
+  /* line 558, ../sass/app.scss */
   .coming-soon .home-text {
     padding: 20px 0 0 0;
   }
 
-  /* line 558, ../sass/app.scss */
+  /* line 561, ../sass/app.scss */
   .zurb-footer-top .global .footer-link-block.services {
     background: url(../images/icons/footer-studios.png) left top no-repeat;
   }
-  /* line 559, ../sass/app.scss */
+  /* line 562, ../sass/app.scss */
   .zurb-footer-top .global .footer-link-block.foundation {
     background: url(../images/icons/footer-foundation.png) left top no-repeat;
   }
-  /* line 560, ../sass/app.scss */
+  /* line 563, ../sass/app.scss */
   .zurb-footer-top .global .footer-link-block.apps {
     background: url(../images/icons/footer-products.png) left top no-repeat;
   }
-  /* line 561, ../sass/app.scss */
+  /* line 564, ../sass/app.scss */
   .zurb-footer-top .global .footer-link-block.expo {
     background: url(../images/icons/footer-expo.png) left top no-repeat;
   }
 }
-/* line 565, ../sass/app.scss */
+/* line 568, ../sass/app.scss */
 .cs-inky {
   background: url(../images/inky-mobile.svg) no-repeat right bottom;
   background-size: 624px 558px;
 }
 @media only screen and (max-width: 767px) {
-  /* line 565, ../sass/app.scss */
+  /* line 568, ../sass/app.scss */
   .cs-inky {
     background: url(../images/inky-mobile-hold.svg) no-repeat center bottom;
     background-size: 147px 200px;
@@ -12771,11 +12779,11 @@ ul.mobile-nav a.current {
 }
 
 /* inliner */
-/* line 574, ../sass/app.scss */
+/* line 577, ../sass/app.scss */
 .inliner-form .inactive {
   display: none;
 }
-/* line 575, ../sass/app.scss */
+/* line 578, ../sass/app.scss */
 .inliner-form textarea {
   min-height: 500px;
   font-family: "Lucida Console", Monaco, monospace;
@@ -12786,61 +12794,61 @@ ul.mobile-nav a.current {
   -ms-transition: all 0.7s ease-out;
   -o-transition: all 0.7s ease-out;
 }
-/* line 585, ../sass/app.scss */
+/* line 588, ../sass/app.scss */
 .inliner-form label {
   margin-bottom: 8px;
   line-height: 1.4;
 }
-/* line 586, ../sass/app.scss */
+/* line 589, ../sass/app.scss */
 .inliner-form.options label {
   margin-bottom: 0;
 }
 
-/* line 588, ../sass/app.scss */
+/* line 591, ../sass/app.scss */
 .inky-inliner {
   margin-bottom: 50px;
 }
-/* line 589, ../sass/app.scss */
+/* line 592, ../sass/app.scss */
 .inky-inliner h4 {
   margin-bottom: 5px;
 }
-/* line 590, ../sass/app.scss */
+/* line 593, ../sass/app.scss */
 .inky-inliner p {
   margin-bottom: 10px;
 }
-/* line 591, ../sass/app.scss */
+/* line 594, ../sass/app.scss */
 .inky-inliner .button:not(.secondary) {
   background: #004454;
   color: #FFF;
 }
-/* line 592, ../sass/app.scss */
+/* line 595, ../sass/app.scss */
 .inky-inliner .button:not(.secondary):hover {
   background: #002B36;
 }
-/* line 594, ../sass/app.scss */
+/* line 597, ../sass/app.scss */
 .inky-inliner textarea.result {
   min-height: 300px;
 }
-/* line 597, ../sass/app.scss */
+/* line 600, ../sass/app.scss */
 .inky-inliner .show-on-submit {
   display: none;
 }
-/* line 600, ../sass/app.scss */
+/* line 603, ../sass/app.scss */
 .inky-inliner .alert-box {
   background: #004454;
   border-color: 002932;
 }
-/* line 603, ../sass/app.scss */
+/* line 606, ../sass/app.scss */
 .inky-inliner .alert-box a {
   color: #fff;
 }
 
-/* line 608, ../sass/app.scss */
+/* line 611, ../sass/app.scss */
 .inline-advantages {
   margin-left: 25px;
 }
 
-/* line 609, ../sass/app.scss */
+/* line 612, ../sass/app.scss */
 #previewModal {
   height: 100%;
   width: 100%;
@@ -12851,7 +12859,7 @@ ul.mobile-nav a.current {
   z-index: 45;
   display: none;
 }
-/* line 619, ../sass/app.scss */
+/* line 622, ../sass/app.scss */
 #previewModal .control-bar {
   width: 100%;
   position: fixed;
@@ -12860,77 +12868,77 @@ ul.mobile-nav a.current {
   background: #f7f7f7;
   box-shadow: 0 0 3px 5px rgba(0, 0, 0, 0.25);
 }
-/* line 627, ../sass/app.scss */
+/* line 630, ../sass/app.scss */
 #previewModal .control-bar .close-btn {
   margin: 14px 10px;
   display: inline-block;
 }
-/* line 632, ../sass/app.scss */
+/* line 635, ../sass/app.scss */
 #previewModal .control-bar .report-btn {
   margin: 5px 10px;
   float: right;
 }
-/* line 638, ../sass/app.scss */
+/* line 641, ../sass/app.scss */
 #previewModal iframe {
   margin-top: 47px;
   border: none;
   width: 100%;
   height: 100%;
 }
-/* line 645, ../sass/app.scss */
+/* line 648, ../sass/app.scss */
 #previewModal.active {
   display: block;
 }
 
-/* line 650, ../sass/app.scss */
+/* line 653, ../sass/app.scss */
 #inlinerReportModal ol {
   margin-left: 2em;
 }
 
 /* compatibility */
-/* line 657, ../sass/app.scss */
+/* line 660, ../sass/app.scss */
 table span {
   display: block;
   text-align: center;
 }
-/* line 658, ../sass/app.scss */
+/* line 661, ../sass/app.scss */
 table .check {
   color: green;
 }
-/* line 659, ../sass/app.scss */
+/* line 662, ../sass/app.scss */
 table .x {
   color: red;
 }
 
-/* line 661, ../sass/app.scss */
+/* line 664, ../sass/app.scss */
 .compatibility-section {
   background: #f8f8f8;
   border: 1px solid #ddd;
   padding: 15px;
 }
-/* line 662, ../sass/app.scss */
+/* line 665, ../sass/app.scss */
 .compatibility-section p {
   margin-bottom: 0;
 }
-/* line 663, ../sass/app.scss */
+/* line 666, ../sass/app.scss */
 .compatibility-section a.reveal-table {
   font-size: 0.875em;
   display: block;
   text-align: right;
   line-height: 22px;
 }
-/* line 664, ../sass/app.scss */
+/* line 667, ../sass/app.scss */
 .compatibility-section table {
   display: none;
   margin: 20px 0 0;
 }
-/* line 665, ../sass/app.scss */
+/* line 668, ../sass/app.scss */
 .compatibility-section.active table {
   display: block;
 }
 
 /* magellan */
-/* line 669, ../sass/app.scss */
+/* line 672, ../sass/app.scss */
 [data-magellan-expedition] {
   background: transparent;
   left: auto;
@@ -12938,25 +12946,25 @@ table .x {
   min-width: 0;
 }
 
-/* line 672, ../sass/app.scss */
+/* line 675, ../sass/app.scss */
 ul.sub-nav li a {
   display: block;
   font-size: 0.875em;
   padding: 5px 0;
   color: #333;
 }
-/* line 673, ../sass/app.scss */
+/* line 676, ../sass/app.scss */
 ul.sub-nav li.active a {
   color: #CC7691;
   font-weight: bold;
 }
 
 /* copy/paste */
-/* line 678, ../sass/app.scss */
+/* line 681, ../sass/app.scss */
 h6 {
   position: relative;
 }
-/* line 679, ../sass/app.scss */
+/* line 682, ../sass/app.scss */
 h6 small.cp {
   position: absolute;
   right: 0;