diff --git a/static/css/webslides.css b/static/css/webslides.css
index 7e24cf3..caf5710 100644
--- a/static/css/webslides.css
+++ b/static/css/webslides.css
@@ -1,7 +1,7 @@
 /*!
  * Name: WebSlides
  * Version: 1.3.1
- * Date: 2017-05-29
+ * Date: 2017-05-31
  * Description: Making HTML presentations easy
  * URL: https://github.com/webslides/webslides#readme
  * Credits: @jlantunez, @LuisSacristan, @Belelros
@@ -48,6 +48,11 @@
 	16. Safari Bug (flex-wrap)
 	17. Print
 ----------------------------------------------------------------------------------- */
+/* === 1.2 Animations ================
+Just 5 basic animations:
+.fadeIn, .fadeInUp, .zoomIn, .slideInLeft, and .slideInRight
+https://github.com/daneden/animate.css */
+/*-- fadeIn -- */
 @-webkit-keyframes fadeIn {
   from {
     opacity: 0; }
@@ -63,6 +68,7 @@
   -webkit-animation: fadeIn 1s;
           animation: fadeIn 1s; }
 
+/*-- fadeInUp -- */
 @-webkit-keyframes fadeInUp {
   from {
     opacity: 0;
@@ -72,7 +78,6 @@
     opacity: 1;
     -webkit-transform: none;
             transform: none; } }
-
 @keyframes fadeInUp {
   from {
     opacity: 0;
@@ -87,13 +92,13 @@
   -webkit-animation: fadeInUp 1s;
           animation: fadeInUp 1s; }
 
+/*-- zoomIn -- */
 @-webkit-keyframes zoomIn {
   from {
     -webkit-transform: scale3d(0.3, 0.3, 0.3);
             transform: scale3d(0.3, 0.3, 0.3); }
   50% {
     opacity: 1; } }
-
 @keyframes zoomIn {
   from {
     -webkit-transform: scale3d(0.3, 0.3, 0.3);
@@ -105,6 +110,7 @@
   -webkit-animation: zoomIn 1s;
           animation: zoomIn 1s; }
 
+/*-- slideInLeft -- */
 @-webkit-keyframes slideInLeft {
   from {
     -webkit-transform: translate3d(-100%, 0, 0);
@@ -113,7 +119,6 @@
   to {
     -webkit-transform: translate3d(0, 0, 0);
             transform: translate3d(0, 0, 0); } }
-
 @keyframes slideInLeft {
   from {
     -webkit-transform: translate3d(-100%, 0, 0);
@@ -129,6 +134,7 @@
   -webkit-animation-fill-mode: both;
           animation-fill-mode: both; }
 
+/*-- slideInRight -- */
 @-webkit-keyframes slideInRight {
   from {
     -webkit-transform: translate3d(100%, 0, 0);
@@ -137,7 +143,6 @@
   to {
     -webkit-transform: translate3d(0, 0, 0);
             transform: translate3d(0, 0, 0); } }
-
 @keyframes slideInRight {
   from {
     -webkit-transform: translate3d(100%, 0, 0);
@@ -153,6 +158,7 @@
   -webkit-animation-fill-mode: both;
           animation-fill-mode: both; }
 
+/* Animated Background (Matrix) */
 @-webkit-keyframes anim {
   0% {
     -webkit-transform: translateY(0);
@@ -160,7 +166,6 @@
   100% {
     -webkit-transform: translateY(-1200px);
             transform: translateY(-1200px); } }
-
 @keyframes anim {
   0% {
     -webkit-transform: translateY(0);
@@ -169,6 +174,7 @@
     -webkit-transform: translateY(-1200px);
             transform: translateY(-1200px); } }
 
+/* Duration */
 .slow {
   -webkit-animation-duration: 4s;
           animation-duration: 4s; }
@@ -439,6 +445,37 @@ dt {
 dd {
   margin: 0; }
 
+/*=== Clearing === */
+header:before, header:after,
+main:before,
+main:after,
+section:before,
+section:after,
+aside:before,
+aside:after,
+footer:before,
+footer:after,
+.clear:before,
+.clear:after,
+.wrap:before,
+.wrap:after {
+  content: '';
+  display: table; }
+
+header:after,
+main:after,
+section:after,
+aside:after,
+footer:after,
+.clear:after,
+.wrap:after {
+  clear: both; }
+
+/*=========================================
+1. Base --> Baseline: 8px = .8rem
+=========================================== */
+/* -- Disable elastic scrolling/bounce:
+webslides.js will add .ws-ready automatically. Don't worry :) -- */
 .ws-ready,
 .ws-ready body {
   height: 100%;
@@ -597,8 +634,2248 @@ pre {
 code {
   padding: .4rem; }
 
+/*============================
+2. TYPOGRAPHY & LISTS
+============================== */
+html,
 body {
-  background-color: #edf2f7;
+  font-weight: 300;
+  line-height: 1;
+  text-rendering: optimizeLegibility; }
+
+html,
+body,
+input,
+select,
+textarea {
+  font-family: 'Roboto', 'San Francisco', helvetica, arial, sans-serif;
+  font-size: 62.5%; }
+
+body,
+textarea {
+  font-size: 1.8rem; }
+
+p,
+li,
+dt,
+dd,
+time,
+table,
+big,
+textarea,
+label {
+  line-height: 3.2rem;
+  margin-bottom: 3.2rem; }
+
+li,
+p:last-child {
+  margin-bottom: 0; }
+
+ul > li,
+ol > li {
+  margin-left: 3.2rem; }
+
+li li {
+  font-size: 100%; }
+
+ul.description {
+  padding: 0; }
+  ul.description + p {
+    margin-top: 3.2rem; }
+  ul.description li {
+    padding-bottom: .8rem;
+    padding-top: .8rem;
+    position: relative;
+    -webkit-transition: .3s;
+    transition: .3s; }
+  ul.description li:hover {
+    padding-left: .4rem; }
+
+ul.description li,
+.column ul li {
+  list-style: none;
+  margin-left: 0; }
+
+.column ol > li {
+  margin-left: 1.6rem; }
+
+h1 svg,
+h2 svg,
+h3 svg,
+h4 svg {
+  margin-top: -.8rem; }
+
+.text-intro svg,
+.text-quote p svg,
+.wall p svg,
+.try svg {
+  margin-top: -.4rem; }
+
+h1 {
+  font-size: 4rem;
+  line-height: 5.6rem; }
+  @media (min-width: 768px) {
+    h1 {
+      font-size: 5.6rem;
+      line-height: 7.2rem; } }
+
+h1 span {
+  font-style: italic; }
+
+h2 {
+  font-size: 3.2rem;
+  line-height: 4.8rem; }
+  @media (min-width: 768px) {
+    h2 {
+      font-size: 4.8rem;
+      line-height: 6.4rem; } }
+
+h3 {
+  font-size: 2.4rem;
+  line-height: 4rem; }
+  @media (min-width: 768px) {
+    h3 {
+      font-size: 4rem;
+      line-height: 5.6rem; } }
+
+h4 {
+  font-size: 2.2rem;
+  line-height: 4rem; }
+  @media (min-width: 768px) {
+    h4 {
+      font-size: 3.2rem;
+      line-height: 4.8rem; } }
+
+h5 {
+  font-size: 2rem;
+  font-weight: 600;
+  line-height: 3.2rem; }
+
+h6 {
+  font-size: 1.8rem;
+  font-weight: 600;
+  line-height: 3.2rem; }
+
+h2.alignleft + p.alignright {
+  margin-bottom: 0;
+  margin-top: 1.2rem; }
+
+h3.alignleft + p.alignright {
+  margin-bottom: 0;
+  margin-top: .4rem; }
+
+h1 + h1 {
+  margin-top: .8rem; }
+
+h1 + h2 {
+  margin-top: .8rem; }
+
+h1 + h3 {
+  margin-top: .8rem; }
+
+h1 + h4 {
+  margin-top: .8rem; }
+
+h1 + h5 {
+  margin-top: .8rem; }
+
+h1 + h6 {
+  margin-top: .8rem; }
+
+h2 + h1 {
+  margin-top: .8rem; }
+
+h2 + h2 {
+  margin-top: .8rem; }
+
+h2 + h3 {
+  margin-top: .8rem; }
+
+h2 + h4 {
+  margin-top: .8rem; }
+
+h2 + h5 {
+  margin-top: .8rem; }
+
+h2 + h6 {
+  margin-top: .8rem; }
+
+h3 + h1 {
+  margin-top: .8rem; }
+
+h3 + h2 {
+  margin-top: .8rem; }
+
+h3 + h3 {
+  margin-top: .8rem; }
+
+h3 + h4 {
+  margin-top: .8rem; }
+
+h3 + h5 {
+  margin-top: .8rem; }
+
+h3 + h6 {
+  margin-top: .8rem; }
+
+h4 + h1 {
+  margin-top: .8rem; }
+
+h4 + h2 {
+  margin-top: .8rem; }
+
+h4 + h3 {
+  margin-top: .8rem; }
+
+h4 + h4 {
+  margin-top: .8rem; }
+
+h4 + h5 {
+  margin-top: .8rem; }
+
+h4 + h6 {
+  margin-top: .8rem; }
+
+h5 + h1 {
+  margin-top: .8rem; }
+
+h5 + h2 {
+  margin-top: .8rem; }
+
+h5 + h3 {
+  margin-top: .8rem; }
+
+h5 + h4 {
+  margin-top: .8rem; }
+
+h5 + h5 {
+  margin-top: .8rem; }
+
+h5 + h6 {
+  margin-top: .8rem; }
+
+h6 + h1 {
+  margin-top: .8rem; }
+
+h6 + h2 {
+  margin-top: .8rem; }
+
+h6 + h3 {
+  margin-top: .8rem; }
+
+h6 + h4 {
+  margin-top: .8rem; }
+
+h6 + h5 {
+  margin-top: .8rem; }
+
+h6 + h6 {
+  margin-top: .8rem; }
+
+h1 + img,
+h2 + img,
+h3 + img {
+  margin-bottom: 4.8rem;
+  margin-top: 4.8rem; }
+
+[class*='content-'] > [class*='content-'] h2,
+[class*='content-'] > [class*='content-'] h3,
+[class*='content-'] > [class*='content-'] h4 {
+  font-size: 2.4rem;
+  line-height: 4rem; }
+
+h1[class*='bg-'] {
+  padding: 2.4rem; }
+
+h2[class*='bg-'] {
+  padding: 2.4rem; }
+
+h3[class*='bg-'] {
+  padding: 2.4rem; }
+
+h4[class*='bg-'] {
+  padding: 2.4rem; }
+
+h5[class*='bg-'] {
+  padding: 2.4rem; }
+
+h6[class*='bg-'] {
+  padding: 2.4rem; }
+
+ul[class*='bg-'],
+ol[class*='bg-'],
+li[class*='bg-'],
+p[class*='bg-'] {
+  padding: 2.4rem; }
+
+h1 [class*='bg-'],
+h2 [class*='bg-'],
+h3 [class*='bg-'] {
+  padding: .4rem .8rem; }
+
+.text-intro,
+[class*='content-'] p {
+  font-size: 2.4rem;
+  line-height: 4rem; }
+
+.text-serif,
+h1 span {
+  font-family: 'Maitree', times, serif; }
+
+.text-landing {
+  letter-spacing: .4rem;
+  text-transform: uppercase; }
+  @media (min-width: 768px) {
+    .text-landing {
+      letter-spacing: 1.6rem; } }
+
+.text-subtitle {
+  letter-spacing: .2rem;
+  margin-bottom: 0;
+  text-transform: uppercase; }
+  .text-subtitle p.text-subtitle {
+    font-size: 1.6rem; }
+    .text-subtitle p.text-subtitle svg {
+      vertical-align: text-top; }
+  .text-subtitle + p {
+    margin-top: 3.2rem; }
+
+.text-uppercase {
+  text-transform: uppercase; }
+
+.text-lowercase {
+  text-transform: lowercase; }
+
+.text-emoji {
+  font-size: 6.8rem;
+  line-height: 8.8rem; }
+  @media (min-width: 768px) {
+    .text-emoji {
+      font-size: 12.8rem;
+      line-height: 16rem; } }
+
+.text-data {
+  font-size: 6.4rem;
+  line-height: 8rem;
+  margin-bottom: .8rem; }
+  @media (min-width: 768px) {
+    .text-data {
+      font-size: 15.2rem;
+      line-height: 16.8rem; } }
+
+.text-label {
+  display: inline-block;
+  font-weight: 600;
+  text-transform: uppercase;
+  width: 12.8rem; }
+
+@media (min-width: 768px) {
+  .text-cols {
+    -webkit-column-count: 2;
+            column-count: 2;
+    -webkit-column-gap: 4.8rem;
+            column-gap: 4.8rem;
+    text-align: left; }
+  .text-landing + .text-cols {
+    margin-top: 3.2rem; } }
+
+.text-cols p:first-child:first-letter {
+  float: left;
+  font-size: 11rem;
+  font-weight: 600;
+  line-height: 1;
+  margin: -.4rem 1.6rem 0 0;
+  padding: 0;
+  text-transform: uppercase; }
+
+.text-context {
+  position: relative; }
+  .text-context:before {
+    content: '';
+    display: block;
+    height: .2rem;
+    margin-bottom: .6rem;
+    width: 12rem; }
+    .column .text-context:before {
+      width: 100%; }
+  .text-context.text-uppercase {
+    letter-spacing: .1rem; }
+
+.text-symbols {
+  font-weight: 600;
+  letter-spacing: .8rem;
+  text-align: center; }
+
+.text-separator {
+  margin-top: 2.4rem; }
+  .text-separator:before {
+    content: '';
+    height: .4rem;
+    left: 0;
+    margin-top: -1.6rem;
+    position: absolute;
+    width: 16%; }
+  @media (min-width: 568px) {
+    .text-separator {
+      margin-left: 20%;
+      margin-top: 0;
+      width: 80%; }
+      .text-separator:before {
+        margin-top: 1.2rem; } }
+
+[class*='text-pull'] {
+  font-size: 2.4rem;
+  font-weight: 400;
+  line-height: 4rem;
+  margin-bottom: 3.2rem;
+  margin-left: 2.4rem;
+  margin-right: 2.4rem;
+  position: relative; }
+
+[class*='text-pull-'] {
+  margin-top: .8rem;
+  padding-top: 1.4rem; }
+  @media (min-width: 1024px) {
+    [class*='text-pull-'] {
+      margin-left: -4.8rem;
+      margin-right: -4.8rem; } }
+
+@media (min-width: 568px) {
+  [class*='text-pull-'] {
+    max-width: 40%; }
+  .text-pull-right {
+    float: right;
+    margin-left: 2.4rem;
+    margin-right: -2.4rem; }
+  .text-pull-left {
+    float: left;
+    margin-left: -2.4rem;
+    margin-right: 2.4rem; } }
+
+img[class*='text-pull-'],
+figure[class*='text-pull-'] {
+  margin-top: .8rem;
+  padding-top: 0; }
+
+.text-interview dt {
+  font-weight: 600;
+  margin-bottom: 0;
+  text-transform: uppercase; }
+
+@media (min-width: 1024px) {
+  .text-interview dt {
+    margin-left: -34%;
+    position: absolute;
+    text-align: right;
+    white-space: nowrap;
+    width: 30%; } }
+
+.text-info {
+  font-size: 1.6rem;
+  line-height: 2.4rem; }
+
+.text-apple,
+.bg-apple {
+  font-family: 'San Francisco', helvetica, arial, sans-serif; }
+
+@font-face {
+  font-family: 'San Francisco';
+  font-weight: 100;
+  src: url("https://applesocial.s3.amazonaws.com/assets/styles/fonts/sanfrancisco/sanfranciscodisplay-ultralight-webfont.woff2"); }
+
+@font-face {
+  font-family: 'San Francisco';
+  font-weight: 200;
+  src: url("https://applesocial.s3.amazonaws.com/assets/styles/fonts/sanfrancisco/sanfranciscodisplay-thin-webfont.woff2"); }
+
+@font-face {
+  font-family: 'San Francisco';
+  font-weight: 400;
+  src: url("https://applesocial.s3.amazonaws.com/assets/styles/fonts/sanfrancisco/sanfranciscodisplay-regular-webfont.woff2"); }
+
+@font-face {
+  font-family: 'San Francisco';
+  font-weight: bold;
+  src: url("https://applesocial.s3.amazonaws.com/assets/styles/fonts/sanfrancisco/sanfranciscodisplay-bold-webfont.woff2"); }
+
+/*=== 1.3 Responsive Media (videos, iframe...) === */
+.embed {
+  height: 0;
+  overflow: hidden;
+  /*aspect ratio:16:9*/
+  padding-bottom: 56.6%;
+  /*aspect ratio: 4:3*/
+  /*padding-bottom: 75%;*/
+  position: relative;
+  /* -- Responsive background video
+  https://fvsch.com/code/video-background/ -- */ }
+  .embed iframe,
+  .embed object,
+  .embed embed,
+  .embed video {
+    height: 100%;
+    left: 0;
+    margin: 0;
+    position: absolute;
+    top: 0;
+    width: 100%; }
+  .fullscreen > .embed {
+    bottom: 0;
+    height: auto;
+    left: 0;
+    padding-bottom: 0;
+    position: fixed;
+    right: 0;
+    top: 0;
+    /* 1. No object-fit support: */ }
+    .fullscreen > .embed > iframe,
+    .fullscreen > .embed > object,
+    .fullscreen > .embed > embed,
+    .fullscreen > .embed > video {
+      /* 2. If supporting object-fit, overriding (1): */ }
+      @media (min-aspect-ratio: 16 / 9) {
+        .fullscreen > .embed > iframe,
+        .fullscreen > .embed > object,
+        .fullscreen > .embed > embed,
+        .fullscreen > .embed > video {
+          height: 300%;
+          top: -100%; } }
+      @media (max-aspect-ratio: 16 / 9) {
+        .fullscreen > .embed > iframe,
+        .fullscreen > .embed > object,
+        .fullscreen > .embed > embed,
+        .fullscreen > .embed > video {
+          left: -100%;
+          width: 300%; } }
+      @supports ((-o-object-fit: cover) or (object-fit: cover)) {
+        .fullscreen > .embed > iframe,
+        .fullscreen > .embed > object,
+        .fullscreen > .embed > embed,
+        .fullscreen > .embed > video {
+          height: 100%;
+          left: 0;
+          -o-object-fit: cover;
+             object-fit: cover;
+          top: 0;
+          width: 100%; } }
+
+/*=== HTML Browser (Screenshots) ================ */
+/* <figure class="browser"> img </figure> */
+.browser {
+  border-radius: .3rem;
+  margin: 0 auto 3.2rem;
+  max-width: 1024px;
+  overflow: hidden; }
+  li .browser {
+    margin-bottom: 0; }
+  h1 + .browser,
+  h2 + .browser,
+  p + .browser {
+    margin-top: 4.8rem; }
+  .browser figcaption {
+    padding: 2.4rem; }
+  .browser:before {
+    content: '\25CF   \25CF   \25CF';
+    font-size: .8rem;
+    left: 0;
+    line-height: 0;
+    padding: 1.6rem;
+    position: absolute;
+    text-align: left;
+    top: 0;
+    width: 100%; }
+    @media (min-width: 768px) {
+      .browser:before {
+        font-size: 1.6rem; } }
+
+/*=== 1.4. Basic Grid (Flexible blocks)
+Auto-fill & Equal height === */
+.grid {
+  clear: both;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -ms-flex-wrap: wrap;
+      flex-wrap: wrap;
+  margin-left: auto;
+  margin-right: auto; }
+  .grid:after {
+    clear: both; }
+  .grid:before {
+    content: '';
+    display: table; }
+  .grid > .column {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-flex: 1;
+        -ms-flex: auto;
+            flex: auto;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+    padding: 2.4rem;
+    position: relative;
+    -webkit-transition: .3s;
+    transition: .3s;
+    width: 100%; }
+  .grid.vertical-align .column {
+    -webkit-box-pack: center;
+        -ms-flex-pack: center;
+            justify-content: center; }
+  @media (min-width: 768px) {
+    .grid > .column {
+      width: 25%; }
+    .grid.sm .column:nth-child(1) {
+      width: 30%; }
+    .grid.sm .column:nth-child(2) {
+      width: 70%; }
+    .grid.ms .column:nth-child(1) {
+      width: 70%; }
+    .grid.ms .column:nth-child(2) {
+      width: 30%; }
+    .grid.sms .column:nth-child(2) {
+      width: 50%; } }
+
+/*=========================================
+3. Header & Footer
+=========================================== */
+/* -- If you want an unique, global header/footer,read this:
+https://github.com/webslides/webslides/issues/57 -- */
+header,
+footer,
+#navigation {
+  padding: 2.4rem;
+  -webkit-transition: all .4s ease-in-out;
+  transition: all .4s ease-in-out;
+  width: 100%; }
+
+header p,
+footer p {
+  line-height: 4.8rem;
+  margin-bottom: 0; }
+
+header[role='banner'] img,
+footer img {
+  height: 4rem;
+  vertical-align: middle; }
+
+footer {
+  position: relative; }
+
+header,
+footer {
+  z-index: 3; }
+
+header,
+.ws-ready footer {
+  left: 0;
+  position: absolute;
+  top: 0; }
+
+.ws-ready footer {
+  bottom: 0;
+  top: auto; }
+
+header[role='banner'] {
+  opacity: 0; }
+  header[role='banner']:hover {
+    opacity: 1; }
+
+@media (max-width: 767px) {
+  footer .alignleft,
+  footer .alignright {
+    display: block;
+    float: none; } }
+
+/*=== 3.1. Logo === */
+.logo {
+  text-transform: lowercase; }
+  .logo a {
+    background: url("../images/logos/logo.svg") no-repeat 0 0;
+    background-size: 4.8rem;
+    float: left;
+    height: 4.8rem;
+    text-indent: -4000px;
+    /*If you remove text-indent and add: */
+    /*padding-left: 6rem;*/
+    vertical-align: middle;
+    width: 4.8rem; }
+
+/*=========================================
+4. Navigation
+=========================================== */
+/*=== 4.1. Navbars === */
+nav ul {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -ms-flex-wrap: wrap;
+      flex-wrap: wrap;
+  /*====align left====*/
+  -webkit-box-pack: start;
+      -ms-flex-pack: start;
+          justify-content: flex-start;
+  /* ==== align center ====*/
+  /*justify-content: center; */
+  /*====align right====*/
+  /* justify-content: flex-end; */
+  /*====separated columns li a====*/
+  /* justify-content: space-between; */
+  /*====separated columns centered li a====*/
+  /*justify-content: space-around;*/ }
+  nav ul li {
+    float: left;
+    list-style: none;
+    position: relative; }
+
+nav ul li:first-child,
+nav[role='navigation'] ul li {
+  margin-left: 0; }
+
+nav[role='navigation'] li a {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  line-height: 4.8rem;
+  max-width: 100%;
+  padding: 0 1.6rem;
+  position: relative;
+  text-decoration: none; }
+  nav[role='navigation'] li a svg {
+    margin: 1.5rem .4rem 1.5rem 0; }
+
+header nav ul {
+  -webkit-box-pack: end;
+      -ms-flex-pack: end;
+          justify-content: flex-end;
+  margin: 0; }
+
+nav.aligncenter ul,
+.aligncenter nav ul {
+  /* ==== align center ====*/
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center; }
+
+nav.navbar ul li {
+  /*====full float li a ====*/
+  -webkit-box-flex: 1;
+      -ms-flex: 1 1 auto;
+          flex: 1 1 auto; }
+
+@media (max-width: 568px) {
+  nav.navbar ul {
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-flow: column wrap;
+            flex-flow: column wrap;
+    padding: 0; }
+  nav.navbar li a {
+    -webkit-box-pack: start;
+        -ms-flex-pack: start;
+            justify-content: flex-start; } }
+
+/*============================================
+5. SLIDES (Full Screen)
+Vertically and horizontally centered
+============================================== */
+/* Fade transition to all slides.
+* = All HTML elements will have those styles.*/
+section * {
+  -webkit-animation: fadeIn .6s ease-in-out;
+          animation: fadeIn .6s ease-in-out; }
+
+section .background,
+section .light,
+section .dark {
+  -webkit-animation-duration: 0s;
+          animation-duration: 0s; }
+
+/*=== Section = Slide === */
+section,
+.slide {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  min-height: 100vh;
+  /*Fullscreen*/
+  /* Prototyping? min-height: 720px (Baseline: 8px = .8rem)*/
+  padding: 2.4rem;
+  /*Fixed/Visible header? padding-top: 12rem; */
+  page-break-after: always;
+  position: relative;
+  word-wrap: break-word; }
+  @media (min-width: 1024px) {
+    section,
+    .slide {
+      padding-bottom: 12rem;
+      padding-top: 12rem; } }
+
+/*slide with no padding (full card, .embed youtube video...) */
+.fullscreen {
+  padding: 0;
+  /* Fixed/Visible header?
+  padding:8.2rem 0 0 0;
+  */ }
+
+/* slide alignment - top */
+.slide-top {
+  -webkit-box-pack: start;
+      -ms-flex-pack: start;
+          justify-content: flex-start; }
+
+/* slide alignment - bottom */
+.slide-bottom {
+  -webkit-box-pack: end;
+      -ms-flex-pack: end;
+          justify-content: flex-end; }
+
+/*== 5.1. Mini container width:50%
+Aligned items [class*="content-"]=== */
+[class*='content-'] {
+  position: relative;
+  text-align: left; }
+
+.wrap[class*='bg-'],
+.wrap.frame,
+[class*='content-'][class*='bg-'],
+[class*='content-'].frame,
+[class*='align'][class*='bg-'] {
+  padding: 4.8rem; }
+
+form[class*='bg-'] {
+  padding: 2.4rem; }
+
+[class*='content-'] > [class*='content-'] p {
+  font-size: 1.8rem;
+  line-height: 3.2rem; }
+
+.content-center {
+  margin: 0 auto;
+  text-align: center; }
+
+@media (min-width: 768px) {
+  [class*='content-'] {
+    width: 50%; }
+    [class*='content-']:after, [class*='content-']:before {
+      content: '';
+      display: table; }
+    [class*='content-']:after {
+      clear: both; }
+  .content-left {
+    float: left; }
+  .content-right {
+    float: right; }
+  [class*='content-'] + [class*='content-'] {
+    margin-bottom: 4.8rem;
+    padding-left: 2.4rem; }
+  [class*='content-'] + [class*='size-'] {
+    clear: both;
+    margin-top: 6.4rem; } }
+
+/*=== 5.3 Slides - Background Images/Videos === */
+.background,
+[class*='background-'] {
+  background-repeat: no-repeat;
+  bottom: 0;
+  left: 0;
+  position: absolute;
+  right: 0;
+  top: 0; }
+
+/*=== BG Positions === */
+.background {
+  background-position: center;
+  background-size: cover;
+  /*fullscreen video
+    <video class="background-video">
+  */ }
+  .background-top {
+    background-position: top;
+    background-size: cover; }
+  .background-bottom {
+    background-position: bottom;
+    background-size: cover; }
+  .background-center {
+    background-position: center; }
+  .background-center-top {
+    background-position: center top; }
+  .background-right-top {
+    background-position: right top; }
+  .background-left-top {
+    background-position: left top; }
+  .background-center-bottom, .background-left-bottom, .background-right-bottom, .background-left, .background-right {
+    background-position: center bottom; }
+  @media (min-width: 1024px) {
+    .background-left-bottom {
+      background-position: left bottom; }
+    .background-right-bottom {
+      background-position: right bottom; }
+    .background-right {
+      background-position: right; }
+    .background-left {
+      background-position: left; } }
+  .background-video {
+    height: 100%;
+    -o-object-fit: fill;
+       object-fit: fill;
+    width: 100%; }
+
+/*=== bg image/video overlay === */
+/*-- [class*="bg-"] .background.dark, [class*="bg-"] .embed.dark...  -- */
+[class*='bg-'] .light,
+[class*='bg-'] .light {
+  opacity: .8; }
+
+[class*='bg-'] .dark,
+[class*='bg-'] .dark {
+  opacity: .2; }
+
+[class*='bg-'] .background-video.dark {
+  opacity: .5; }
+
+@media (max-width: 1023px) {
+  [class*='background-'] {
+    -webkit-animation: fadeIn ease-in .2;
+            animation: fadeIn ease-in .2;
+    opacity: .2; }
+  .background-video {
+    opacity: .8; } }
+
+/*=== Animated Background Image === */
+.background.anim {
+  -webkit-animation: anim 80s linear infinite;
+          animation: anim 80s linear infinite;
+  background-position: center top;
+  background-repeat: repeat;
+  background-size: 100%;
+  height: 200%; }
+
+/*=== Background with a frame === */
+/*<span class="background" style="background-image:url('image.jpg')"></span>
+<span class="background frame"></span>*/
+[class*='background'].frame {
+  margin: 2.4rem; }
+
+/* === 5.2 Counter / Navigation Slides  === */
+#navigation {
+  -webkit-animation: fadeIn 8s;
+          animation: fadeIn 8s;
+  bottom: 0;
+  left: 0;
+  margin-left: auto;
+  margin-right: auto;
+  opacity: 0;
+  position: fixed;
+  right: 0;
+  width: 24.4rem;
+  /* hover/visibility */
+  z-index: 4; }
+  #navigation:hover {
+    opacity: 1; }
+  #navigation p {
+    margin-bottom: 0; }
+
+#counter {
+  display: block;
+  line-height: 4.8rem;
+  margin-left: auto;
+  margin-right: auto;
+  position: relative;
+  text-align: center;
+  width: 10rem; }
+  #counter a:hover {
+    padding: .8rem; }
+
+a#next,
+a#previous {
+  border-radius: .4rem;
+  cursor: pointer;
+  font-size: 2.4rem;
+  height: 4rem;
+  padding: .8rem;
+  position: absolute;
+  text-align: center;
+  width: 4rem; }
+
+a#next {
+  right: 3.2rem; }
+
+a#previous {
+  left: 3.2rem; }
+
+@media (max-width: 1024px) {
+  #navigation {
+    -webkit-animation: fadeIn 6s;
+            animation: fadeIn 6s;
+    background: url("../images/swipe.svg") no-repeat center top;
+    background-size: 4.8rem; }
+  #navigation a,
+  #counter {
+    display: none; } }
+
+/*===============================================================
+6. Magic blocks with flexbox (Auto-fill & Equal Height)
+Blocks Links li>a = .flexblock.blink (.blink required)
+================================================================= */
+.flexblock {
+  clear: both;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -ms-flex-wrap: wrap;
+      flex-wrap: wrap;
+  margin-left: auto;
+  margin-right: auto;
+  padding: 0; }
+  .flexblock:after {
+    clear: both; }
+  .flexblock:before {
+    content: '';
+    display: table; }
+  .flexblock li,
+  .flexblock.blink li > a {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-direction: column;
+            flex-direction: column;
+    margin: 0;
+    padding: 2.4rem;
+    position: relative; }
+  .flexblock li {
+    -webkit-box-flex: 1;
+        -ms-flex: auto;
+            flex: auto;
+    text-align: left;
+    -webkit-transition: .3s;
+    transition: .3s;
+    width: 100%; }
+    .flexblock li:hover {
+      -webkit-transform: translateY(-0.2rem);
+              transform: translateY(-0.2rem); }
+    @media (min-width: 600px) {
+      .flexblock li {
+        width: 50%; } }
+    @media (min-width: 1024px) {
+      .flexblock li {
+        width: 25%; } }
+  .flexblock.aligncenter li {
+    text-align: center; }
+  .flexblock.vertical-align li {
+    -webkit-box-pack: center;
+        -ms-flex-pack: center;
+            justify-content: center; }
+  .flexblock.blink li {
+    padding: 0; }
+  .flexblock li h2 svg,
+  .flexblock li h3 svg {
+    margin-top: 0; }
+
+h1 + .flexblock,
+h2 + .flexblock,
+h3 + .flexblock,
+div + ul,
+div + ol {
+  margin-top: 3.2rem; }
+
+.flexblock li h2,
+.flexblock li h3,
+footer .column h2,
+footer .column h3 {
+  font-size: 1.8rem;
+  font-weight: 600;
+  line-height: 3.2rem;
+  margin-bottom: 0; }
+
+.flexblock li li,
+.flexblock.blink li li {
+  padding: 0;
+  width: 100%; }
+
+[class*='content-'] .flexblock li p {
+  font-size: 1.8rem;
+  line-height: 3.2rem; }
+
+.content-right .flexblock.features li,
+.content-left .flexblock.features li {
+  width: 46%; }
+
+/*====================================================================
+6.1 Features <ul class="flexblock features">
+====================================================================== */
+.flexblock.features > li {
+  border-radius: .4rem;
+  margin-bottom: 4.8rem;
+  width: 100%; }
+
+.flexblock.features li h2 {
+  text-transform: uppercase; }
+
+.flexblock.features li span {
+  font-weight: 300; }
+
+.flexblock.features li p {
+  margin: 0; }
+
+.flexblock.features li p em {
+  display: block; }
+
+.flexblock.features li span,
+.flexblock.features li svg {
+  display: block;
+  font-size: 6.4rem;
+  line-height: 1;
+  margin: 0; }
+
+.flexblock.features li img {
+  width: 6.4rem; }
+
+.flexblock.features li span sup {
+  font-size: 3rem; }
+
+@media (min-width: 1200px) {
+  .flexblock.features li span,
+  .flexblock.features li svg,
+  .flexblock.features li img {
+    float: left;
+    margin-right: .8rem; } }
+
+@media (min-width: 768px) {
+  .flexblock.features {
+    margin-left: -2%;
+    margin-right: -2%; }
+  .flexblock.features > li {
+    margin-left: 2%;
+    margin-right: 2%;
+    width: 29%; }
+  .size-50 .flexblock.features > li {
+    width: 46%; }
+  .column .flexblock.features > li {
+    width: 100%; }
+  footer .flexblock.features > li {
+    margin-bottom: 0; } }
+
+/*=====================================================================
+6.2 Clients Logos <ul class="flexblock clients">
+======================================================================= */
+.flexblock.clients.blink li > a,
+.flexblock.clients li {
+  padding: 0; }
+
+.flexblock.clients li figcaption {
+  padding: 0 2.4rem 2.4rem; }
+
+.flexblock.clients.border li figcaption {
+  padding-top: 2.4rem; }
+
+.clients.blink li > a,
+.clients li {
+  -webkit-box-pack: inherit;
+      -ms-flex-pack: inherit;
+          justify-content: inherit; }
+
+.clients li img,
+.clients li svg {
+  display: block;
+  padding: 2.4rem; }
+
+.clients.border li img,
+.clients.border li svg {
+  display: block;
+  margin-left: auto;
+  margin-right: auto; }
+
+.clients li:hover {
+  z-index: 1; }
+
+/*==================================================
+6.3 flexblock.steps <ul class="flexblock steps">
+About, Philosophy...
+=================================================== */
+.steps li {
+  width: 100%; }
+  .steps li img,
+  .steps li span {
+    display: block;
+    margin: 0 auto .8rem; }
+  .steps li span {
+    font-size: 6.4rem; }
+  @media (min-width: 768px) {
+    .steps li {
+      width: 50%; } }
+
+@media (min-width: 1024px) {
+  .steps li {
+    width: 25%; }
+  .process {
+    border-left-style: solid;
+    border-left-width: 15px;
+    height: 0;
+    left: 0;
+    position: absolute;
+    top: 60px;
+    width: 0; } }
+
+/*=================================================
+6.4 Block Numbers - <ul class="flexblock metrics">
+=================================================== */
+.metrics li {
+  text-align: center;
+  width: 100%; }
+  @media (min-width: 568px) {
+    .metrics li {
+      width: 50%; } }
+  @media (min-width: 1024px) {
+    .metrics li {
+      width: 25%; } }
+
+.metrics li strong {
+  display: block; }
+
+.metrics li span,
+.metrics li svg {
+  display: block;
+  font-size: 6.4rem;
+  line-height: 7.2rem;
+  margin: 0 auto; }
+
+.card-50 .metrics li {
+  width: 50%; }
+
+/*=====================================================
+6.5 Specs/Items: <ul class="flexblock specs">
+======================================================= */
+.specs li {
+  text-align: left;
+  width: 100%; }
+  .specs li:after {
+    bottom: -2.4rem;
+    content: '';
+    display: block;
+    height: 1px;
+    position: relative; }
+  .specs li:hover {
+    -webkit-transform: translateX(0.2rem);
+            transform: translateX(0.2rem); }
+  .specs li span,
+  .specs li svg {
+    display: block;
+    font-size: 6.4rem;
+    line-height: 1;
+    margin: 0; }
+  .specs li img {
+    width: 6.4rem; }
+  .specs li span {
+    font-weight: 300; }
+    .specs li span sup {
+      font-size: 3rem; }
+  @media (min-width: 1024px) {
+    .specs li span,
+    .specs li svg,
+    .specs li img {
+      float: left;
+      margin-right: 2.4rem; } }
+
+.flexblock.reasons li {
+  counter-increment: list;
+  text-align: left;
+  width: 100%; }
+  .flexblock.reasons li:hover {
+    -webkit-transform: translateY(-0.2rem);
+            transform: translateY(-0.2rem); }
+  .flexblock.reasons li:after {
+    bottom: -2.4rem;
+    content: '';
+    display: block;
+    height: 1px;
+    position: relative; }
+  .flexblock.reasons li:before {
+    content: counter(list) ".";
+    font-size: 6.4rem;
+    line-height: 1; }
+
+@media (min-width: 768px) {
+  .flexblock.reasons {
+    padding-left: 8.8rem;
+    /* You need two digits? (1-10)*/
+    /*padding-left: 12rem; */ }
+    .flexblock.reasons:before {
+      left: 2.4rem;
+      position: absolute; } }
+
+/*=================================================
+6.7 Gallery - <ul class="flexblock gallery">
+Block Thumbnails li+.overlay+image
+img size recommended:800x600px
+=================================================== */
+.flexblock.gallery li {
+  margin-bottom: 4.8rem; }
+  .flexblock.gallery li:nth-child(n+4) {
+    -webkit-box-flex: inherit;
+        -ms-flex: inherit;
+            flex: inherit; }
+  .flexblock.gallery li figcaption {
+    padding: 1.6rem;
+    position: relative; }
+    .flexblock.gallery li figcaption:before {
+      content: '';
+      height: 0;
+      left: 20%;
+      margin-left: -.5em;
+      position: absolute;
+      top: .4rem;
+      -webkit-transform: rotate(135deg);
+              transform: rotate(135deg);
+      -webkit-transform-origin: 0 0;
+              transform-origin: 0 0;
+      -webkit-transition: .1s;
+      transition: .1s;
+      width: 0; }
+  .flexblock.gallery li figcaption,
+  .flexblock.gallery li:hover figcaption:before {
+    top: .3rem; }
+
+.aligncenter .flexblock.gallery li figcaption:before {
+  left: 55%;
+  margin-left: 0; }
+
+.flexblock.gallery li,
+.flexblock.gallery.blink li > a {
+  padding: 0; }
+
+.flexblock.gallery h2 {
+  text-transform: uppercase; }
+
+.flexblock.gallery h2 + p,
+.flexblock.gallery h3 + p {
+  margin-top: .8rem; }
+
+.flexblock.gallery p {
+  font-size: 1.6rem;
+  line-height: 2.4rem;
+  margin-bottom: 0; }
+
+.flexblock.gallery li footer {
+  margin-top: .8rem;
+  padding: 1.2rem 0 0;
+  position: relative; }
+
+.flexblock.gallery li img {
+  display: block;
+  margin-left: auto;
+  margin-right: auto; }
+
+@media (min-width: 600px) {
+  .flexblock.gallery {
+    margin-left: -2%;
+    margin-right: -2%; }
+    .flexblock.gallery li {
+      margin-left: 2%;
+      margin-right: 2%;
+      width: 46%; } }
+
+@media (min-width: 1024px) {
+  .flexblock.gallery li {
+    width: 21%; }
+  .grid.sm .flexblock.gallery li,
+  .grid.ms .flexblock.gallery li {
+    width: 29%; }
+  .grid.sms .flexblock.gallery li {
+    width: 46%; } }
+
+.overlay {
+  bottom: 0;
+  cursor: pointer;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  height: 100%;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  left: 0;
+  opacity: 1;
+  position: absolute;
+  right: 0;
+  top: 0;
+  -webkit-transition: all .3s linear;
+  transition: all .3s linear;
+  width: 100%;
+  z-index: 2; }
+
+li .overlay {
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center; }
+
+li .overlay h2 {
+  letter-spacing: .2rem;
+  margin: 0;
+  padding: 0 2.4rem;
+  text-align: center;
+  text-transform: uppercase;
+  width: 100%; }
+
+.overlay p,
+.overlay time {
+  margin-bottom: 0; }
+
+li:hover .overlay {
+  cursor: pointer; }
+
+/*===============================================
+6.8 Plans / Pricing <ul class="flexblock plans">
+================================================= */
+.flexblock.plans > li {
+  border-radius: 3px;
+  margin-bottom: 4.8rem;
+  text-align: center;
+  z-index: 1; }
+
+.flexblock.plans li,
+.flexblock.plans.blink li > a {
+  padding: 0; }
+
+.flexblock.plans.blink li > a div,
+.flexblock.plans li div {
+  padding-bottom: 3.2rem; }
+
+.flexblock.plans li p,
+.flexblock.plans li h2 {
+  padding: .8rem 3.2rem; }
+
+.flexblock.plans li h2 {
+  float: left;
+  font-weight: 400;
+  letter-spacing: .1rem;
+  text-transform: uppercase;
+  width: 100%; }
+
+.flexblock.plans .price {
+  clear: both;
+  display: block;
+  font-size: 4.8rem;
+  font-weight: 400;
+  line-height: 6.2rem;
+  padding: 2.4rem; }
+  .flexblock.plans .price sup {
+    font-size: 1.8rem;
+    margin-right: .4rem; }
+  .flexblock.plans .price li ul {
+    margin-bottom: 2.4rem; }
+
+.flexblock.plans li ul li {
+  display: block;
+  padding: .8rem 3.2rem;
+  text-align: left;
+  width: 100%; }
+
+@media (min-width: 1024px) {
+  .flexblock.plans {
+    margin-left: -2%;
+    margin-right: -2%; }
+    .flexblock.plans > li {
+      margin-left: 2%;
+      margin-right: 2%;
+      width: 29%; }
+    .flexblock.plans > li:hover,
+    .flexblock.plans > li:nth-child(2) {
+      position: relative;
+      -webkit-transform: scale(1.08);
+              transform: scale(1.08);
+      z-index: 2; }
+    .flexblock.plans:hover li:nth-child(2):not(:hover) {
+      position: relative;
+      -webkit-transform: scale(1);
+              transform: scale(1);
+      z-index: 1; } }
+
+/*===========================================
+6.9 Block Activity <ul class="activity">
+CV / News
+============================================= */
+.flexblock.activity {
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column; }
+  .flexblock.activity li {
+    -webkit-box-flex: 1;
+        -ms-flex: 1;
+            flex: 1;
+    position: relative;
+    width: auto; }
+  .flexblock.activity p {
+    margin-bottom: 0;
+    vertical-align: top; }
+  .flexblock.activity img {
+    display: block; }
+  .flexblock.activity .year,
+  .flexblock.activity .title {
+    display: inline;
+    font-weight: 600; }
+  .flexblock.activity .summary {
+    width: 100%; }
+  .flexblock.activity .title {
+    margin-left: 1rem; }
+  @media (min-width: 768px) {
+    .flexblock.activity p {
+      float: left; }
+    .flexblock.activity .year {
+      width: 15%; }
+    .flexblock.activity .title {
+      margin-left: 4%;
+      margin-right: 4%;
+      width: 27%; }
+    .flexblock.activity .summary {
+      width: 50%; } }
+
+/*=============================================
+7. Promos/Offers (pricing, tagline, CTA...)
+=============================================== */
+.cta {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -ms-flex-wrap: wrap;
+      flex-wrap: wrap;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center; }
+
+.number,
+.cta .benefit {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+  max-width: 100%;
+  padding: .8rem; }
+
+.number {
+  text-align: center; }
+
+.cta .benefit {
+  max-width: 100%;
+  text-align: center; }
+
+.number span {
+  display: block;
+  font-size: 8rem;
+  line-height: 8rem; }
+
+.number span sup {
+  font-size: 4rem; }
+
+.cta p {
+  margin-bottom: 0; }
+
+@media (min-width: 768px) {
+  .number,
+  .cta .benefit {
+    max-width: 50%;
+    padding: 4.8rem; }
+  .cta .benefit {
+    text-align: left; }
+  .number span {
+    font-size: 16rem;
+    line-height: 16rem; }
+    .number span sup {
+      font-size: 6rem;
+      vertical-align: middle; } }
+
+/* --- Header CTA --- */
+.cta-cover {
+  display: table;
+  width: 100%; }
+  .cta-cover h1 strong {
+    font-weight: 400; }
+  @media (min-width: 1024px) {
+    .cta-cover h1 {
+      float: left;
+      max-width: 80%; }
+    .cta-cover h1 strong {
+      display: block; }
+    .cta-cover .button {
+      margin-top: 1.2rem; }
+    .cta-cover .try {
+      text-align: center; } }
+  @media (max-width: 1023px) {
+    .cta-cover .alignright {
+      float: none; } }
+
+/*=========================================
+8. Work/Resumé/CV <ul class="work">
+=========================================== */
+.work {
+  clear: both;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  text-align: left; }
+  h1 + .work,
+  h2 + .work,
+  h3 + .work,
+  p + .work {
+    margin-top: 4.8rem; }
+  .work li {
+    -webkit-box-flex: 1;
+        -ms-flex: 1;
+            flex: 1;
+    list-style: none;
+    margin: 0;
+    position: relative; }
+  .work p {
+    margin-bottom: 0;
+    -webkit-transition: .3s;
+    transition: .3s; }
+  .work li a {
+    display: block;
+    float: left;
+    height: 100%;
+    padding: 2.4rem 0;
+    width: 100%; }
+  .work li p {
+    padding-left: 1.2rem; }
+  .work li.work-label p {
+    padding-left: 0; }
+  .work li a:hover p:first-child {
+    padding-left: 1.6rem; }
+  .work li p:last-child {
+    position: absolute;
+    right: 1.2rem;
+    top: 2.4rem; }
+  .work li.work-label p:last-child {
+    right: 0;
+    top: 0; }
+  .work-label {
+    float: left;
+    font-weight: 600;
+    padding: 0 0 2.4rem;
+    width: 100%; }
+  .work-title {
+    display: block;
+    padding-right: 1.2rem;
+    width: 75%; }
+
+@media (min-width: 768px) {
+  .work-label p,
+  .work li p {
+    float: left;
+    margin-right: 2%;
+    width: 25%; }
+  .work li.work-label p:last-child,
+  .work li p:last-child {
+    float: right;
+    margin-right: 0;
+    padding-right: 1.2rem;
+    position: relative;
+    right: auto;
+    text-align: right;
+    top: auto; }
+  .work li p.work-date {
+    width: 120px; } }
+
+@media (max-width: 768px) {
+  .work-client,
+  .work-label .work-services {
+    clip: rect(1px, 1px, 1px, 1px);
+    height: 1px;
+    overflow: hidden;
+    position: absolute;
+    width: 1px; } }
+
+/*===========================================
+9. Table of contents
+============================================= */
+.toc,
+.toc ol > li:before,
+.chapter {
+  position: relative;
+  z-index: 2; }
+
+.toc ol {
+  counter-reset: item;
+  position: relative; }
+  .toc ol > li:before {
+    content: counters(item, ".") ". ";
+    display: table-cell;
+    padding-right: .8rem;
+    width: 2.4rem; }
+  .toc ol li li:before {
+    content: counters(item, ".") " "; }
+
+.toc li {
+  counter-increment: item;
+  display: table;
+  font-weight: 400;
+  margin-bottom: .8rem;
+  margin-left: 0;
+  -webkit-transition: .3s;
+  transition: .3s;
+  width: 100%; }
+  .toc li li {
+    font-weight: 300;
+    margin-bottom: 0;
+    margin-left: 0; }
+  .toc li .toc-page:before {
+    content: '';
+    display: block;
+    left: 0;
+    margin-top: 1.8rem;
+    position: absolute;
+    right: 4rem; }
+  .toc li > a {
+    display: inline-block;
+    width: 100%; }
+  .toc li a:hover span {
+    font-weight: 600; }
+  .toc li a:hover .toc-page:before {
+    border-bottom-width: 2px; }
+
+/*===========================================
+10. Cards
+============================================= */
+[class*='card-'],
+[class*='card-'] > a {
+  clear: both;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: horizontal;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: row;
+          flex-direction: row;
+  position: relative; }
+
+.fullscreen [class*='card-'],
+.fullscreen [class*='card-'] > a {
+  min-height: 100vh; }
+
+[class*='card-'] figure img,
+[class*='card-'] figure iframe {
+  display: block;
+  margin: 0 auto; }
+
+[class*='card-'] figure figcaption {
+  bottom: 0;
+  font-size: 1.4rem;
+  left: 0;
+  line-height: 2.4rem;
+  padding: .8rem 2.4rem;
+  position: absolute;
+  z-index: 2; }
+  [class*='card-'] figure figcaption svg {
+    font-size: 1rem; }
+
+@media (min-width: 768px) {
+  [class*='card'][class*='bg-'] figure,
+  .fullscreen [class*='card'] figure {
+    max-height: 100%;
+    min-width: 380px;
+    text-align: center;
+    vertical-align: middle; }
+  [class*='card-'][class*='bg-'] figure img,
+  [class*='card-'][class*='bg-'] figure iframe,
+  .fullscreen [class*='card-'] figure img,
+  .fullscreen [class*='card-'] figure iframe {
+    height: 100%;
+    left: 0;
+    -o-object-fit: cover;
+       object-fit: cover;
+    position: absolute;
+    top: 0;
+    width: 100%;
+    z-index: 1; } }
+
+.flex-content,
+[class*='card'] blockquote {
+  padding: 2.4rem;
+  position: relative; }
+
+[class*='card-'] .flex-content,
+[class*='card-'] blockquote {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center; }
+
+.flex-content p {
+  position: relative; }
+
+@media (min-width: 768px) {
+  .card-50 figure,
+  .card-50 blockquote,
+  .card-50 .flex-content {
+    width: 50%; }
+  .card-30 figure,
+  .card-70 .flex-content,
+  .card-70 blockquote {
+    width: 30%; }
+  .card-40 figure,
+  .card-60 .flex-content,
+  .card-60 blockquote {
+    width: 40%; }
+  .card-60 figure,
+  .card-40 .flex-content,
+  .card-40 blockquote {
+    width: 60%; }
+  .card-70 figure,
+  .card-30 .flex-content,
+  .card-30 blockquote {
+    width: 70%; }
+  [class*='card']:nth-child(odd) figure {
+    -webkit-box-ordinal-group: 1;
+        -ms-flex-order: 0;
+            order: 0; }
+  [class*='card']:nth-child(even) figure {
+    -webkit-box-ordinal-group: 2;
+        -ms-flex-order: 1;
+            order: 1; }
+  .flex-content,
+  [class*='card'] blockquote {
+    padding: 4.8rem; }
+  .fullscreen [class*='card'] .flex-content,
+  .fullscreen [class*='card'] blockquote {
+    padding: 6.4rem; } }
+
+@media (max-width: 767px) {
+  [class*='card-'],
+  [class*='card-'] > a {
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+        -ms-flex-flow: column;
+            flex-flow: column; }
+  .card figure,
+  .card header {
+    width: 100%; } }
+
+/*=========================================
+11. Quotes
+=========================================== */
+blockquote {
+  display: inline-block;
+  position: relative; }
+  blockquote p {
+    font-size: 2.4rem;
+    line-height: 4rem; }
+    blockquote p:last-child {
+      margin-bottom: 3.2rem; }
+
+/* -- Interviews dl.text-interview -- */
+dd blockquote p:last-child {
+  margin-bottom: 0; }
+
+cite {
+  display: block;
+  text-align: center; }
+  cite:before {
+    content: '\2014   \2009';
+    margin-right: 6px; }
+
+cite span {
+  display: block; }
+
+/* -- A big Blockquote -- */
+/* .wall will be deprecated soon. Use .text-quote ;) */
+.text-quote,
+.wall {
+  /* Versatility: blockquote, p, h2... */
+  position: relative; }
+  .text-quote:before,
+  .wall:before {
+    content: '\201C';
+    font-family: arial, sans-serif;
+    font-size: 12rem;
+    height: 5.6rem;
+    left: -.8rem;
+    line-height: 1;
+    position: absolute;
+    text-align: center;
+    top: -4rem;
+    width: 5.6rem; }
+  @media (min-width: 768px) {
+    .text-quote,
+    .wall {
+      padding-left: 6.4rem; }
+      .text-quote p,
+      .wall p {
+        font-size: 3.2rem;
+        line-height: 4.8rem; }
+      .text-quote:before,
+      .wall:before {
+        left: .8rem;
+        top: -1.6rem; } }
+
+/*=========================================
+12. Avatars - uifaces.com
+=========================================== */
+cite img,
+img[class*='avatar-'] {
+  display: inline-block;
+  margin-right: 6px;
+  vertical-align: middle; }
+
+img[class*='avatar-'] {
+  border-radius: 50%; }
+
+img.avatar-40 {
+  height: 40px;
+  width: 40px; }
+
+img.avatar-48 {
+  height: 48px;
+  width: 48px; }
+
+img.avatar-56 {
+  height: 56px;
+  width: 56px; }
+
+img.avatar-64 {
+  height: 64px;
+  width: 64px; }
+
+img.avatar-72 {
+  height: 72px;
+  width: 72px; }
+
+img.avatar-80 {
+  height: 80px;
+  width: 80px; }
+
+/*=========================================
+13. Tables
+=========================================== */
+table {
+  margin-bottom: 3.2rem;
+  margin-top: 3.2rem; }
+
+td,
+th,
+thead {
+  border-spacing: 0;
+  padding: .7rem 2.4rem; }
+
+thead th,
+th {
+  cursor: default;
+  font-weight: 600;
+  text-align: left;
+  text-transform: uppercase;
+  white-space: nowrap; }
+
+thead,
+td.goals {
+  font-weight: 600;
+  text-shadow: none; }
+
+tr > td {
+  font-weight: 400; }
+
+/*=========================================
+14. Forms
+=========================================== */
+form {
+  text-align: left; }
+  form + p,
+  form input + p,
+  form textarea + p {
+    margin-top: .8rem; }
+
+input[type='text'],
+input[type='email'],
+input[type='tel'],
+input[type='url'],
+input[type='search'],
+input[type='password'] {
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  border-radius: 0; }
+
+input,
+button,
+select {
+  display: inline-block;
+  font-size: 1.6rem;
+  font-weight: 400;
+  height: 4.8rem;
+  margin: 0;
+  padding: .7rem;
+  position: relative;
+  width: 100%; }
+
+input[type='radio'],
+input[type='checkbox'] {
+  height: auto;
+  padding: 4px;
+  width: auto; }
+
+button[type='submit'],
+textarea {
+  width: 100%; }
+
+textarea {
+  padding: .7rem; }
+
+button {
+  cursor: pointer;
+  text-align: center;
+  width: auto; }
+
+.button {
+  cursor: pointer;
+  display: inline-block;
+  font-size: 1.8rem;
+  font-weight: 400;
+  line-height: 4.8rem;
+  min-width: 16rem;
+  padding: 0 1.6rem;
+  text-align: center; }
+  .button svg {
+    font-size: 2.4rem; }
+
+.button.radius,
+input.radius {
+  border-radius: 2.4rem; }
+
+button,
+input[type='submit'] {
+  font-weight: 400;
+  letter-spacing: .1rem;
+  text-transform: uppercase; }
+
+.plans .button {
+  margin-left: auto;
+  margin-right: auto;
+  width: 50%; }
+
+.try {
+  display: block;
+  font-size: 1.6rem;
+  margin-top: 1.6rem; }
+
+fieldset {
+  padding: 2.4rem; }
+
+legend {
+  border: 0;
+  font-weight: 400;
+  letter-spacing: .1rem;
+  padding: 1.6rem 2.4rem;
+  text-align: center;
+  text-transform: uppercase;
+  width: 100%; }
+
+input:focus,
+textarea:focus,
+select:focus {
+  border-width: 1px; }
+
+a.button:hover,
+button[type='submit']:hover,
+input[type='submit']:hover {
+  -webkit-transform: scale(1.01);
+          transform: scale(1.01); }
+
+:disabled,
+button:disabled:hover {
+  cursor: not-allowed; }
+
+.user input {
+  margin-bottom: 0; }
+  .user input[type='email'], .user input[type='search'], .user input[type='text'] {
+    width: 100%; }
+    @media (min-width: 500px) {
+      .user input[type='email'], .user input[type='search'], .user input[type='text'] {
+        float: left;
+        width: 70%; } }
+
+.user button,
+.user input[type='submit'] {
+  left: 0;
+  width: 100%; }
+  @media (min-width: 500px) {
+    .user button,
+    .user input[type='submit'] {
+      cursor: pointer;
+      width: 30%; } }
+
+/* Buttons/Badges */
+@media (min-width: 500px) {
+  [class*='button'] + [class*='button'] {
+    margin-left: 1.8rem; } }
+
+@media (max-width: 499px) {
+  [class*='button'] + [class*='button'] {
+    margin-top: .8rem; } }
+
+/*=== App Store Badges === */
+/* Change width and height: 216x64px, 162x48px, 135x40... */
+[class*='badge-'] {
+  background-repeat: no-repeat;
+  background-size: cover;
+  border-radius: .6rem;
+  display: inline-block;
+  height: 40px;
+  line-height: 4rem;
+  text-indent: -4000px;
+  width: 135px; }
+  [class*='badge-']:hover {
+    opacity: .7; }
+  @media (min-width: 1024px) {
+    [class*='badge-'] {
+      height: 48px;
+      line-height: 4.8rem;
+      width: 162px; } }
+  @media (min-width: 500px) {
+    [class*='badge-'] + [class*='badge-'] {
+      margin-left: 1.8rem; } }
+  @media (max-width: 499px) {
+    [class*='badge-'] + [class*='badge-'] {
+      margin-top: .8rem; } }
+
+.badge-ios {
+  background-image: url("../images/bt-appstore.png"); }
+
+.badge-android {
+  background-image: url("../images/bt-playstore.png"); }
+
+/*=========================================
+15. Longform
+=========================================== */
+/* -- Posts = .wrap.longform -- */
+.longform {
+  width: 72rem;
+  /* Why 72rem=720px?
+  90-95 characters per line = better reading speed */
+  /* Mobile: video full width */ }
+  .longform.alignleft, .longform.alignright {
+    max-width: 40%; }
+  .longform img.aligncenter,
+  .longform .longform figure.aligncenter {
+    margin-bottom: 3.2rem;
+    margin-top: 3.2rem; }
+  .longform ul,
+  .longform ol {
+    margin-bottom: 3.2rem; }
+  .longform ul ol,
+  .longform ol ul,
+  .longform ul ul,
+  .longform ol ol {
+    margin-bottom: 0; }
+  .longform figcaption p,
+  .longform [class*='text-pull-'] p {
+    font-size: 1.6rem;
+    line-height: 2.4rem; }
+  .longform .text-pull.embed {
+    margin-left: -2.4rem;
+    margin-right: -2.4rem;
+    padding-bottom: 60.6%; }
+  @media (min-width: 1280px) {
+    .longform [class*='text-pull-'] {
+      max-width: 32%; }
+    .longform .text-pull-right {
+      margin-right: -256px; }
+    .longform .text-pull-left {
+      margin-left: -256px; } }
+  @media (min-width: 1024px) {
+    .longform .text-quote {
+      margin-left: -4.8rem;
+      margin-right: -4.8rem; } }
+
+/*=========================================
+16. SAFARI BUGS (flex-wrap)
+Solution: stackoverflow.com/questions/34250282/flexbox-safari-bug-flex-wrap
+=========================================== */
+.flexblock:before,
+.flexblock:after,
+.grid:before,
+.grid:after,
+.cta:before,
+.cta:after {
+  width: 0; }
+
+/*=========================================
+16. PRINT
+=========================================== */
+@media print {
+  @page {
+    margin: .5cm;
+    size: A4 landscape; }
+  * {
+    background: transparent !important;
+    color: #000 !important;
+    -webkit-filter: none !important;
+            filter: none !important;
+    text-shadow: none !important; }
+  html,
+  body,
+  #webslides {
+    height: auto !important;
+    overflow: auto !important;
+    width: auto !important; }
+  #webslides {
+    overflow-x: auto !important;
+    overflow-y: auto !important; }
+  section,
+  .slide {
+    display: -webkit-box !important;
+    display: -ms-flexbox !important;
+    display: flex !important;
+    height: auto !important; }
+  section * {
+    -webkit-animation: none;
+            animation: none; }
+  table,
+  figure {
+    page-break-inside: avoid; }
+  #counter,
+  #navigation {
+    display: none; } }
+
+/*=========================================
+Colors
+=========================================== */
+/* -- Disable elastic scrolling/bounce:
+webslides.js will add .ws-ready automatically. Don't worry :) -- */
+body {
+  background-color: #f7f9fb;
   color: #333; }
 
 :focus {
@@ -639,7 +2916,7 @@ hr:after {
 
 abbr,
 acronym {
-  border-bottom: 1px dotted #edf2f7; }
+  border-bottom: 1px dotted #f7f9fb; }
 
 mark,
 ins {
@@ -679,7 +2956,7 @@ code,
   background-color: #67d; }
 
 .bg-light {
-  background-color: #edf2f7; }
+  background-color: #f7f9fb; }
 
 .bg-black {
   background-color: #111; }
@@ -1205,2122 +3482,3 @@ form .flexblock li:hover {
 
 footer[role='contentinfo'] {
   background-color: #fff; }
-
-html,
-body {
-  font-weight: 300;
-  line-height: 1;
-  text-rendering: optimizeLegibility; }
-
-html,
-body,
-input,
-select,
-textarea {
-  font-family: 'Roboto', 'San Francisco', helvetica, arial, sans-serif;
-  font-size: 62.5%; }
-
-body,
-textarea {
-  font-size: 1.8rem; }
-
-p,
-li,
-dt,
-dd,
-time,
-table,
-big,
-textarea,
-label {
-  line-height: 3.2rem;
-  margin-bottom: 3.2rem; }
-
-li,
-p:last-child {
-  margin-bottom: 0; }
-
-ul > li,
-ol > li {
-  margin-left: 3.2rem; }
-
-li li {
-  font-size: 100%; }
-
-ul.description {
-  padding: 0; }
-  ul.description + p {
-    margin-top: 3.2rem; }
-  ul.description li {
-    padding-bottom: .8rem;
-    padding-top: .8rem;
-    position: relative;
-    -webkit-transition: .3s;
-    transition: .3s; }
-  ul.description li:hover {
-    padding-left: .4rem; }
-
-ul.description li,
-.column ul li {
-  list-style: none;
-  margin-left: 0; }
-
-.column ol > li {
-  margin-left: 1.6rem; }
-
-h1 svg,
-h2 svg,
-h3 svg,
-h4 svg {
-  margin-top: -.8rem; }
-
-.text-intro svg,
-.text-quote p svg,
-.wall p svg,
-.try svg {
-  margin-top: -.4rem; }
-
-h1 {
-  font-size: 4rem;
-  line-height: 5.6rem; }
-  @media (min-width: 768px) {
-    h1 {
-      font-size: 5.6rem;
-      line-height: 7.2rem; } }
-
-h1 span {
-  font-style: italic; }
-
-h2 {
-  font-size: 3.2rem;
-  line-height: 4.8rem; }
-  @media (min-width: 768px) {
-    h2 {
-      font-size: 4.8rem;
-      line-height: 6.4rem; } }
-
-h3 {
-  font-size: 2.4rem;
-  line-height: 4rem; }
-  @media (min-width: 768px) {
-    h3 {
-      font-size: 4rem;
-      line-height: 5.6rem; } }
-
-h4 {
-  font-size: 2.2rem;
-  line-height: 4rem; }
-  @media (min-width: 768px) {
-    h4 {
-      font-size: 3.2rem;
-      line-height: 4.8rem; } }
-
-h5 {
-  font-size: 2rem;
-  font-weight: 600;
-  line-height: 3.2rem; }
-
-h6 {
-  font-size: 1.8rem;
-  font-weight: 600;
-  line-height: 3.2rem; }
-
-h2.alignleft + p.alignright {
-  margin-bottom: 0;
-  margin-top: 1.2rem; }
-
-h3.alignleft + p.alignright {
-  margin-bottom: 0;
-  margin-top: .4rem; }
-
-h1 + h1 {
-  margin-top: .8rem; }
-
-h1 + h2 {
-  margin-top: .8rem; }
-
-h1 + h3 {
-  margin-top: .8rem; }
-
-h1 + h4 {
-  margin-top: .8rem; }
-
-h1 + h5 {
-  margin-top: .8rem; }
-
-h1 + h6 {
-  margin-top: .8rem; }
-
-h2 + h1 {
-  margin-top: .8rem; }
-
-h2 + h2 {
-  margin-top: .8rem; }
-
-h2 + h3 {
-  margin-top: .8rem; }
-
-h2 + h4 {
-  margin-top: .8rem; }
-
-h2 + h5 {
-  margin-top: .8rem; }
-
-h2 + h6 {
-  margin-top: .8rem; }
-
-h3 + h1 {
-  margin-top: .8rem; }
-
-h3 + h2 {
-  margin-top: .8rem; }
-
-h3 + h3 {
-  margin-top: .8rem; }
-
-h3 + h4 {
-  margin-top: .8rem; }
-
-h3 + h5 {
-  margin-top: .8rem; }
-
-h3 + h6 {
-  margin-top: .8rem; }
-
-h4 + h1 {
-  margin-top: .8rem; }
-
-h4 + h2 {
-  margin-top: .8rem; }
-
-h4 + h3 {
-  margin-top: .8rem; }
-
-h4 + h4 {
-  margin-top: .8rem; }
-
-h4 + h5 {
-  margin-top: .8rem; }
-
-h4 + h6 {
-  margin-top: .8rem; }
-
-h5 + h1 {
-  margin-top: .8rem; }
-
-h5 + h2 {
-  margin-top: .8rem; }
-
-h5 + h3 {
-  margin-top: .8rem; }
-
-h5 + h4 {
-  margin-top: .8rem; }
-
-h5 + h5 {
-  margin-top: .8rem; }
-
-h5 + h6 {
-  margin-top: .8rem; }
-
-h6 + h1 {
-  margin-top: .8rem; }
-
-h6 + h2 {
-  margin-top: .8rem; }
-
-h6 + h3 {
-  margin-top: .8rem; }
-
-h6 + h4 {
-  margin-top: .8rem; }
-
-h6 + h5 {
-  margin-top: .8rem; }
-
-h6 + h6 {
-  margin-top: .8rem; }
-
-h1 + img,
-h2 + img,
-h3 + img {
-  margin-bottom: 4.8rem;
-  margin-top: 4.8rem; }
-
-[class*='content-'] > [class*='content-'] h2,
-[class*='content-'] > [class*='content-'] h3,
-[class*='content-'] > [class*='content-'] h4 {
-  font-size: 2.4rem;
-  line-height: 4rem; }
-
-h1[class*='bg-'] {
-  padding: 2.4rem; }
-
-h2[class*='bg-'] {
-  padding: 2.4rem; }
-
-h3[class*='bg-'] {
-  padding: 2.4rem; }
-
-h4[class*='bg-'] {
-  padding: 2.4rem; }
-
-h5[class*='bg-'] {
-  padding: 2.4rem; }
-
-h6[class*='bg-'] {
-  padding: 2.4rem; }
-
-ul[class*='bg-'],
-ol[class*='bg-'],
-li[class*='bg-'],
-p[class*='bg-'] {
-  padding: 2.4rem; }
-
-h1 [class*='bg-'],
-h2 [class*='bg-'],
-h3 [class*='bg-'] {
-  padding: .4rem .8rem; }
-
-.text-intro,
-[class*='content-'] p {
-  font-size: 2.4rem;
-  line-height: 4rem; }
-
-.text-serif,
-h1 span {
-  font-family: 'Maitree', times, serif; }
-
-.text-landing {
-  letter-spacing: .4rem;
-  text-transform: uppercase; }
-  @media (min-width: 768px) {
-    .text-landing {
-      letter-spacing: 1.6rem; } }
-
-.text-subtitle {
-  letter-spacing: .2rem;
-  margin-bottom: 0;
-  text-transform: uppercase; }
-  .text-subtitle p.text-subtitle {
-    font-size: 1.6rem; }
-    .text-subtitle p.text-subtitle svg {
-      vertical-align: text-top; }
-  .text-subtitle + p {
-    margin-top: 3.2rem; }
-
-.text-uppercase {
-  text-transform: uppercase; }
-
-.text-lowercase {
-  text-transform: lowercase; }
-
-.text-emoji {
-  font-size: 6.8rem;
-  line-height: 8.8rem; }
-  @media (min-width: 768px) {
-    .text-emoji {
-      font-size: 12.8rem;
-      line-height: 16rem; } }
-
-.text-data {
-  font-size: 6.4rem;
-  line-height: 8rem;
-  margin-bottom: .8rem; }
-  @media (min-width: 768px) {
-    .text-data {
-      font-size: 15.2rem;
-      line-height: 16.8rem; } }
-
-.text-label {
-  display: inline-block;
-  font-weight: 600;
-  text-transform: uppercase;
-  width: 12.8rem; }
-
-@media (min-width: 768px) {
-  .text-cols {
-    -webkit-column-count: 2;
-            column-count: 2;
-    -webkit-column-gap: 4.8rem;
-            column-gap: 4.8rem;
-    text-align: left; }
-  .text-landing + .text-cols {
-    margin-top: 3.2rem; } }
-
-.text-cols p:first-child:first-letter {
-  float: left;
-  font-size: 11rem;
-  font-weight: 600;
-  line-height: 1;
-  margin: -.4rem 1.6rem 0 0;
-  padding: 0;
-  text-transform: uppercase; }
-
-.text-context {
-  position: relative; }
-  .text-context:before {
-    content: '';
-    display: block;
-    height: .2rem;
-    margin-bottom: .6rem;
-    width: 12rem; }
-    .column .text-context:before {
-      width: 100%; }
-  .text-context.text-uppercase {
-    letter-spacing: .1rem; }
-
-.text-symbols {
-  font-weight: 600;
-  letter-spacing: .8rem;
-  text-align: center; }
-
-.text-separator {
-  margin-top: 2.4rem; }
-  .text-separator:before {
-    content: '';
-    height: .4rem;
-    left: 0;
-    margin-top: -1.6rem;
-    position: absolute;
-    width: 16%; }
-  @media (min-width: 568px) {
-    .text-separator {
-      margin-left: 20%;
-      margin-top: 0;
-      width: 80%; }
-      .text-separator:before {
-        margin-top: 1.2rem; } }
-
-[class*='text-pull'] {
-  font-size: 2.4rem;
-  font-weight: 400;
-  line-height: 4rem;
-  margin-bottom: 3.2rem;
-  margin-left: 2.4rem;
-  margin-right: 2.4rem;
-  position: relative; }
-
-[class*='text-pull-'] {
-  margin-top: .8rem;
-  padding-top: 1.4rem; }
-  @media (min-width: 1024px) {
-    [class*='text-pull-'] {
-      margin-left: -4.8rem;
-      margin-right: -4.8rem; } }
-
-@media (min-width: 568px) {
-  [class*='text-pull-'] {
-    max-width: 40%; }
-  .text-pull-right {
-    float: right;
-    margin-left: 2.4rem;
-    margin-right: -2.4rem; }
-  .text-pull-left {
-    float: left;
-    margin-left: -2.4rem;
-    margin-right: 2.4rem; } }
-
-img[class*='text-pull-'],
-figure[class*='text-pull-'] {
-  margin-top: .8rem;
-  padding-top: 0; }
-
-.text-interview dt {
-  font-weight: 600;
-  margin-bottom: 0;
-  text-transform: uppercase; }
-
-@media (min-width: 1024px) {
-  .text-interview dt {
-    margin-left: -34%;
-    position: absolute;
-    text-align: right;
-    white-space: nowrap;
-    width: 30%; } }
-
-.text-info {
-  font-size: 1.6rem;
-  line-height: 2.4rem; }
-
-.text-apple,
-.bg-apple {
-  font-family: 'San Francisco', helvetica, arial, sans-serif; }
-
-@font-face {
-  font-family: 'San Francisco';
-  font-weight: 100;
-  src: url("https://applesocial.s3.amazonaws.com/assets/styles/fonts/sanfrancisco/sanfranciscodisplay-ultralight-webfont.woff2"); }
-
-@font-face {
-  font-family: 'San Francisco';
-  font-weight: 200;
-  src: url("https://applesocial.s3.amazonaws.com/assets/styles/fonts/sanfrancisco/sanfranciscodisplay-thin-webfont.woff2"); }
-
-@font-face {
-  font-family: 'San Francisco';
-  font-weight: 400;
-  src: url("https://applesocial.s3.amazonaws.com/assets/styles/fonts/sanfrancisco/sanfranciscodisplay-regular-webfont.woff2"); }
-
-@font-face {
-  font-family: 'San Francisco';
-  font-weight: bold;
-  src: url("https://applesocial.s3.amazonaws.com/assets/styles/fonts/sanfrancisco/sanfranciscodisplay-bold-webfont.woff2"); }
-
-.flexblock:before,
-.flexblock:after,
-.grid:before,
-.grid:after,
-.cta:before,
-.cta:after {
-  width: 0; }
-
-header:before, header:after,
-main:before,
-main:after,
-section:before,
-section:after,
-aside:before,
-aside:after,
-footer:before,
-footer:after,
-.clear:before,
-.clear:after,
-.wrap:before,
-.wrap:after {
-  content: '';
-  display: table; }
-
-header:after,
-main:after,
-section:after,
-aside:after,
-footer:after,
-.clear:after,
-.wrap:after {
-  clear: both; }
-
-cite img,
-img[class*='avatar-'] {
-  display: inline-block;
-  margin-right: 6px;
-  vertical-align: middle; }
-
-img[class*='avatar-'] {
-  border-radius: 50%; }
-
-img.avatar-40 {
-  height: 40px;
-  width: 40px; }
-
-img.avatar-48 {
-  height: 48px;
-  width: 48px; }
-
-img.avatar-56 {
-  height: 56px;
-  width: 56px; }
-
-img.avatar-64 {
-  height: 64px;
-  width: 64px; }
-
-img.avatar-72 {
-  height: 72px;
-  width: 72px; }
-
-img.avatar-80 {
-  height: 80px;
-  width: 80px; }
-
-[class*='badge-'] {
-  background-repeat: no-repeat;
-  background-size: cover;
-  border-radius: .6rem;
-  display: inline-block;
-  height: 40px;
-  line-height: 4rem;
-  text-indent: -4000px;
-  width: 135px; }
-  [class*='badge-']:hover {
-    opacity: .7; }
-  @media (min-width: 1024px) {
-    [class*='badge-'] {
-      height: 48px;
-      line-height: 4.8rem;
-      width: 162px; } }
-  @media (min-width: 500px) {
-    [class*='badge-'] + [class*='badge-'] {
-      margin-left: 1.8rem; } }
-  @media (max-width: 499px) {
-    [class*='badge-'] + [class*='badge-'] {
-      margin-top: .8rem; } }
-
-.badge-ios {
-  background-image: url("../images/bt-appstore.png"); }
-
-.badge-android {
-  background-image: url("../images/bt-playstore.png"); }
-
-h1 + .browser,
-h2 + .browser,
-p + .browser {
-  margin-top: 4.8rem; }
-
-.browser {
-  border-radius: .3rem;
-  margin: 0 auto 3.2rem;
-  max-width: 1024px;
-  overflow: hidden; }
-  li .browser {
-    margin-bottom: 0; }
-  h1 + .browser,
-  h2 + .browser,
-  p + .browser {
-    margin-top: 4.8rem; }
-  .browser figcaption {
-    padding: 2.4rem; }
-  .browser:before {
-    content: '\25CF   \25CF   \25CF';
-    font-size: .8rem;
-    left: 0;
-    line-height: 0;
-    padding: 1.6rem;
-    position: absolute;
-    text-align: left;
-    top: 0;
-    width: 100%; }
-    @media (min-width: 768px) {
-      .browser:before {
-        font-size: 1.6rem; } }
-
-@media (min-width: 500px) {
-  [class*='button'] + [class*='button'] {
-    margin-left: 1.8rem; } }
-
-@media (max-width: 499px) {
-  [class*='button'] + [class*='button'] {
-    margin-top: .8rem; } }
-
-[class*='card-'],
-[class*='card-'] > a {
-  clear: both;
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: horizontal;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: row;
-          flex-direction: row;
-  position: relative; }
-
-.fullscreen [class*='card-'],
-.fullscreen [class*='card-'] > a {
-  min-height: 100vh; }
-
-[class*='card-'] figure img,
-[class*='card-'] figure iframe {
-  display: block;
-  margin: 0 auto; }
-
-[class*='card-'] figure figcaption {
-  bottom: 0;
-  font-size: 1.4rem;
-  left: 0;
-  line-height: 2.4rem;
-  padding: .8rem 2.4rem;
-  position: absolute;
-  z-index: 2; }
-  [class*='card-'] figure figcaption svg {
-    font-size: 1rem; }
-
-@media (min-width: 768px) {
-  [class*='card'][class*='bg-'] figure,
-  .fullscreen [class*='card'] figure {
-    max-height: 100%;
-    min-width: 380px;
-    text-align: center;
-    vertical-align: middle; }
-  [class*='card-'][class*='bg-'] figure img,
-  [class*='card-'][class*='bg-'] figure iframe,
-  .fullscreen [class*='card-'] figure img,
-  .fullscreen [class*='card-'] figure iframe {
-    height: 100%;
-    left: 0;
-    -o-object-fit: cover;
-       object-fit: cover;
-    position: absolute;
-    top: 0;
-    width: 100%;
-    z-index: 1; } }
-
-.flex-content,
-[class*='card'] blockquote {
-  padding: 2.4rem;
-  position: relative; }
-
-[class*='card-'] .flex-content,
-[class*='card-'] blockquote {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-  -webkit-box-pack: center;
-      -ms-flex-pack: center;
-          justify-content: center; }
-
-.flex-content p {
-  position: relative; }
-
-@media (min-width: 768px) {
-  .card-50 figure,
-  .card-50 blockquote,
-  .card-50 .flex-content {
-    width: 50%; }
-  .card-30 figure,
-  .card-70 .flex-content,
-  .card-70 blockquote {
-    width: 30%; }
-  .card-40 figure,
-  .card-60 .flex-content,
-  .card-60 blockquote {
-    width: 40%; }
-  .card-60 figure,
-  .card-40 .flex-content,
-  .card-40 blockquote {
-    width: 60%; }
-  .card-70 figure,
-  .card-30 .flex-content,
-  .card-30 blockquote {
-    width: 70%; }
-  [class*='card']:nth-child(odd) figure {
-    -webkit-box-ordinal-group: 1;
-        -ms-flex-order: 0;
-            order: 0; }
-  [class*='card']:nth-child(even) figure {
-    -webkit-box-ordinal-group: 2;
-        -ms-flex-order: 1;
-            order: 1; }
-  .flex-content,
-  [class*='card'] blockquote {
-    padding: 4.8rem; }
-  .fullscreen [class*='card'] .flex-content,
-  .fullscreen [class*='card'] blockquote {
-    padding: 6.4rem; } }
-
-@media (max-width: 767px) {
-  [class*='card-'],
-  [class*='card-'] > a {
-    -webkit-box-orient: vertical;
-    -webkit-box-direction: normal;
-        -ms-flex-flow: column;
-            flex-flow: column; }
-  .card figure,
-  .card header {
-    width: 100%; } }
-
-.flexblock {
-  clear: both;
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -ms-flex-wrap: wrap;
-      flex-wrap: wrap;
-  margin-left: auto;
-  margin-right: auto;
-  padding: 0; }
-  .flexblock:after {
-    clear: both; }
-  .flexblock:before {
-    content: '';
-    display: table; }
-  .flexblock li,
-  .flexblock.blink li > a {
-    display: -webkit-box;
-    display: -ms-flexbox;
-    display: flex;
-    -webkit-box-orient: vertical;
-    -webkit-box-direction: normal;
-        -ms-flex-direction: column;
-            flex-direction: column;
-    margin: 0;
-    padding: 2.4rem;
-    position: relative; }
-  .flexblock li {
-    -webkit-box-flex: 1;
-        -ms-flex: auto;
-            flex: auto;
-    text-align: left;
-    -webkit-transition: .3s;
-    transition: .3s;
-    width: 100%; }
-    .flexblock li:hover {
-      -webkit-transform: translateY(-0.2rem);
-              transform: translateY(-0.2rem); }
-    @media (min-width: 600px) {
-      .flexblock li {
-        width: 50%; } }
-    @media (min-width: 1024px) {
-      .flexblock li {
-        width: 25%; } }
-  .flexblock.aligncenter li {
-    text-align: center; }
-  .flexblock.vertical-align li {
-    -webkit-box-pack: center;
-        -ms-flex-pack: center;
-            justify-content: center; }
-  .flexblock.blink li {
-    padding: 0; }
-  .flexblock li h2 svg,
-  .flexblock li h3 svg {
-    margin-top: 0; }
-
-h1 + .flexblock,
-h2 + .flexblock,
-h3 + .flexblock,
-div + ul,
-div + ol {
-  margin-top: 3.2rem; }
-
-.flexblock li h2,
-.flexblock li h3,
-footer .column h2,
-footer .column h3 {
-  font-size: 1.8rem;
-  font-weight: 600;
-  line-height: 3.2rem;
-  margin-bottom: 0; }
-
-.flexblock li li,
-.flexblock.blink li li {
-  padding: 0;
-  width: 100%; }
-
-[class*='content-'] .flexblock li p {
-  font-size: 1.8rem;
-  line-height: 3.2rem; }
-
-.content-right .flexblock.features li,
-.content-left .flexblock.features li {
-  width: 46%; }
-
-.flexblock.activity {
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column; }
-  .flexblock.activity li {
-    -webkit-box-flex: 1;
-        -ms-flex: 1;
-            flex: 1;
-    position: relative;
-    width: auto; }
-  .flexblock.activity p {
-    margin-bottom: 0;
-    vertical-align: top; }
-  .flexblock.activity img {
-    display: block; }
-  .flexblock.activity .year,
-  .flexblock.activity .title {
-    display: inline;
-    font-weight: 600; }
-  .flexblock.activity .summary {
-    width: 100%; }
-  .flexblock.activity .title {
-    margin-left: 1rem; }
-  @media (min-width: 768px) {
-    .flexblock.activity p {
-      float: left; }
-    .flexblock.activity .year {
-      width: 15%; }
-    .flexblock.activity .title {
-      margin-left: 4%;
-      margin-right: 4%;
-      width: 27%; }
-    .flexblock.activity .summary {
-      width: 50%; } }
-
-.flexblock.clients.blink li > a,
-.flexblock.clients li {
-  padding: 0; }
-
-.flexblock.clients li figcaption {
-  padding: 0 2.4rem 2.4rem; }
-
-.flexblock.clients.border li figcaption {
-  padding-top: 2.4rem; }
-
-.clients.blink li > a,
-.clients li {
-  -webkit-box-pack: inherit;
-      -ms-flex-pack: inherit;
-          justify-content: inherit; }
-
-.clients li img,
-.clients li svg {
-  display: block;
-  padding: 2.4rem; }
-
-.clients.border li img,
-.clients.border li svg {
-  display: block;
-  margin-left: auto;
-  margin-right: auto; }
-
-.clients li:hover {
-  z-index: 1; }
-
-.flexblock.features > li {
-  border-radius: .4rem;
-  margin-bottom: 4.8rem;
-  width: 100%; }
-
-.flexblock.features li h2 {
-  text-transform: uppercase; }
-
-.flexblock.features li span {
-  font-weight: 300; }
-
-.flexblock.features li p {
-  margin: 0; }
-
-.flexblock.features li p em {
-  display: block; }
-
-.flexblock.features li span,
-.flexblock.features li svg {
-  display: block;
-  font-size: 6.4rem;
-  line-height: 1;
-  margin: 0; }
-
-.flexblock.features li img {
-  width: 6.4rem; }
-
-.flexblock.features li span sup {
-  font-size: 3rem; }
-
-@media (min-width: 1200px) {
-  .flexblock.features li span,
-  .flexblock.features li svg,
-  .flexblock.features li img {
-    float: left;
-    margin-right: .8rem; } }
-
-@media (min-width: 768px) {
-  .flexblock.features {
-    margin-left: -2%;
-    margin-right: -2%; }
-  .flexblock.features > li {
-    margin-left: 2%;
-    margin-right: 2%;
-    width: 29%; }
-  .size-50 .flexblock.features > li {
-    width: 46%; }
-  .column .flexblock.features > li {
-    width: 100%; }
-  footer .flexblock.features > li {
-    margin-bottom: 0; } }
-
-.flexblock.gallery li {
-  margin-bottom: 4.8rem; }
-  .flexblock.gallery li:nth-child(n+4) {
-    -webkit-box-flex: inherit;
-        -ms-flex: inherit;
-            flex: inherit; }
-  .flexblock.gallery li figcaption {
-    padding: 1.6rem;
-    position: relative; }
-    .flexblock.gallery li figcaption:before {
-      content: '';
-      height: 0;
-      left: 20%;
-      margin-left: -.5em;
-      position: absolute;
-      top: .4rem;
-      -webkit-transform: rotate(135deg);
-              transform: rotate(135deg);
-      -webkit-transform-origin: 0 0;
-              transform-origin: 0 0;
-      -webkit-transition: .1s;
-      transition: .1s;
-      width: 0; }
-  .flexblock.gallery li figcaption,
-  .flexblock.gallery li:hover figcaption:before {
-    top: .3rem; }
-
-.aligncenter .flexblock.gallery li figcaption:before {
-  left: 55%;
-  margin-left: 0; }
-
-.flexblock.gallery li,
-.flexblock.gallery.blink li > a {
-  padding: 0; }
-
-.flexblock.gallery h2 {
-  text-transform: uppercase; }
-
-.flexblock.gallery h2 + p,
-.flexblock.gallery h3 + p {
-  margin-top: .8rem; }
-
-.flexblock.gallery p {
-  font-size: 1.6rem;
-  line-height: 2.4rem;
-  margin-bottom: 0; }
-
-.flexblock.gallery li footer {
-  margin-top: .8rem;
-  padding: 1.2rem 0 0;
-  position: relative; }
-
-.flexblock.gallery li img {
-  display: block;
-  margin-left: auto;
-  margin-right: auto; }
-
-@media (min-width: 600px) {
-  .flexblock.gallery {
-    margin-left: -2%;
-    margin-right: -2%; }
-    .flexblock.gallery li {
-      margin-left: 2%;
-      margin-right: 2%;
-      width: 46%; } }
-
-@media (min-width: 1024px) {
-  .flexblock.gallery li {
-    width: 21%; }
-  .grid.sm .flexblock.gallery li,
-  .grid.ms .flexblock.gallery li {
-    width: 29%; }
-  .grid.sms .flexblock.gallery li {
-    width: 46%; } }
-
-.overlay {
-  bottom: 0;
-  cursor: pointer;
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-  height: 100%;
-  -webkit-box-pack: center;
-      -ms-flex-pack: center;
-          justify-content: center;
-  left: 0;
-  opacity: 1;
-  position: absolute;
-  right: 0;
-  top: 0;
-  -webkit-transition: all .3s linear;
-  transition: all .3s linear;
-  width: 100%;
-  z-index: 2; }
-
-li .overlay {
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center; }
-
-li .overlay h2 {
-  letter-spacing: .2rem;
-  margin: 0;
-  padding: 0 2.4rem;
-  text-align: center;
-  text-transform: uppercase;
-  width: 100%; }
-
-.overlay p,
-.overlay time {
-  margin-bottom: 0; }
-
-li:hover .overlay {
-  cursor: pointer; }
-
-.metrics li {
-  text-align: center;
-  width: 100%; }
-  @media (min-width: 568px) {
-    .metrics li {
-      width: 50%; } }
-  @media (min-width: 1024px) {
-    .metrics li {
-      width: 25%; } }
-
-.metrics li strong {
-  display: block; }
-
-.metrics li span,
-.metrics li svg {
-  display: block;
-  font-size: 6.4rem;
-  line-height: 7.2rem;
-  margin: 0 auto; }
-
-.card-50 .metrics li {
-  width: 50%; }
-
-.flexblock.plans > li {
-  border-radius: 3px;
-  margin-bottom: 4.8rem;
-  text-align: center;
-  z-index: 1; }
-
-.flexblock.plans li,
-.flexblock.plans.blink li > a {
-  padding: 0; }
-
-.flexblock.plans.blink li > a div,
-.flexblock.plans li div {
-  padding-bottom: 3.2rem; }
-
-.flexblock.plans li p,
-.flexblock.plans li h2 {
-  padding: .8rem 3.2rem; }
-
-.flexblock.plans li h2 {
-  float: left;
-  font-weight: 400;
-  letter-spacing: .1rem;
-  text-transform: uppercase;
-  width: 100%; }
-
-.flexblock.plans .price {
-  clear: both;
-  display: block;
-  font-size: 4.8rem;
-  font-weight: 400;
-  line-height: 6.2rem;
-  padding: 2.4rem; }
-  .flexblock.plans .price sup {
-    font-size: 1.8rem;
-    margin-right: .4rem; }
-  .flexblock.plans .price li ul {
-    margin-bottom: 2.4rem; }
-
-.flexblock.plans li ul li {
-  display: block;
-  padding: .8rem 3.2rem;
-  text-align: left;
-  width: 100%; }
-
-@media (min-width: 1024px) {
-  .flexblock.plans {
-    margin-left: -2%;
-    margin-right: -2%; }
-    .flexblock.plans > li {
-      margin-left: 2%;
-      margin-right: 2%;
-      width: 29%; }
-    .flexblock.plans > li:hover,
-    .flexblock.plans > li:nth-child(2) {
-      position: relative;
-      -webkit-transform: scale(1.08);
-              transform: scale(1.08);
-      z-index: 2; }
-    .flexblock.plans:hover li:nth-child(2):not(:hover) {
-      position: relative;
-      -webkit-transform: scale(1);
-              transform: scale(1);
-      z-index: 1; } }
-
-.flexblock.reasons li {
-  counter-increment: list;
-  text-align: left;
-  width: 100%; }
-  .flexblock.reasons li:hover {
-    -webkit-transform: translateY(-0.2rem);
-            transform: translateY(-0.2rem); }
-  .flexblock.reasons li:after {
-    bottom: -2.4rem;
-    content: '';
-    display: block;
-    height: 1px;
-    position: relative; }
-  .flexblock.reasons li:before {
-    content: counter(list) ".";
-    font-size: 6.4rem;
-    line-height: 1; }
-
-@media (min-width: 768px) {
-  .flexblock.reasons {
-    padding-left: 8.8rem; }
-    .flexblock.reasons:before {
-      left: 2.4rem;
-      position: absolute; } }
-
-.specs li {
-  text-align: left;
-  width: 100%; }
-  .specs li:after {
-    bottom: -2.4rem;
-    content: '';
-    display: block;
-    height: 1px;
-    position: relative; }
-  .specs li:hover {
-    -webkit-transform: translateX(0.2rem);
-            transform: translateX(0.2rem); }
-  .specs li span,
-  .specs li svg {
-    display: block;
-    font-size: 6.4rem;
-    line-height: 1;
-    margin: 0; }
-  .specs li img {
-    width: 6.4rem; }
-  .specs li span {
-    font-weight: 300; }
-    .specs li span sup {
-      font-size: 3rem; }
-  @media (min-width: 1024px) {
-    .specs li span,
-    .specs li svg,
-    .specs li img {
-      float: left;
-      margin-right: 2.4rem; } }
-
-.steps li {
-  width: 100%; }
-  .steps li img,
-  .steps li span {
-    display: block;
-    margin: 0 auto .8rem; }
-  .steps li span {
-    font-size: 6.4rem; }
-  @media (min-width: 768px) {
-    .steps li {
-      width: 50%; } }
-
-@media (min-width: 1024px) {
-  .steps li {
-    width: 25%; }
-  .process {
-    border-left-style: solid;
-    border-left-width: 15px;
-    height: 0;
-    left: 0;
-    position: absolute;
-    top: 60px;
-    width: 0; } }
-
-form {
-  text-align: left; }
-  form + p,
-  form input + p,
-  form textarea + p {
-    margin-top: .8rem; }
-
-input[type='text'],
-input[type='email'],
-input[type='tel'],
-input[type='url'],
-input[type='search'],
-input[type='password'] {
-  -webkit-appearance: none;
-     -moz-appearance: none;
-          appearance: none;
-  border-radius: 0; }
-
-input,
-button,
-select {
-  display: inline-block;
-  font-size: 1.6rem;
-  font-weight: 400;
-  height: 4.8rem;
-  margin: 0;
-  padding: .7rem;
-  position: relative;
-  width: 100%; }
-
-input[type='radio'],
-input[type='checkbox'] {
-  height: auto;
-  padding: 4px;
-  width: auto; }
-
-button[type='submit'],
-textarea {
-  width: 100%; }
-
-textarea {
-  padding: .7rem; }
-
-button {
-  cursor: pointer;
-  text-align: center;
-  width: auto; }
-
-.button {
-  cursor: pointer;
-  display: inline-block;
-  font-size: 1.8rem;
-  font-weight: 400;
-  line-height: 4.8rem;
-  min-width: 16rem;
-  padding: 0 1.6rem;
-  text-align: center; }
-  .button svg {
-    font-size: 2.4rem; }
-
-.button.radius,
-input.radius {
-  border-radius: 2.4rem; }
-
-button,
-input[type='submit'] {
-  font-weight: 400;
-  letter-spacing: .1rem;
-  text-transform: uppercase; }
-
-.plans .button {
-  margin-left: auto;
-  margin-right: auto;
-  width: 50%; }
-
-.try {
-  display: block;
-  font-size: 1.6rem;
-  margin-top: 1.6rem; }
-
-fieldset {
-  padding: 2.4rem; }
-
-legend {
-  border: 0;
-  font-weight: 400;
-  letter-spacing: .1rem;
-  padding: 1.6rem 2.4rem;
-  text-align: center;
-  text-transform: uppercase;
-  width: 100%; }
-
-input:focus,
-textarea:focus,
-select:focus {
-  border-width: 1px; }
-
-a.button:hover,
-button[type='submit']:hover,
-input[type='submit']:hover {
-  -webkit-transform: scale(1.01);
-          transform: scale(1.01); }
-
-:disabled,
-button:disabled:hover {
-  cursor: not-allowed; }
-
-.user input {
-  margin-bottom: 0; }
-  .user input[type='email'], .user input[type='search'], .user input[type='text'] {
-    width: 100%; }
-    @media (min-width: 500px) {
-      .user input[type='email'], .user input[type='search'], .user input[type='text'] {
-        float: left;
-        width: 70%; } }
-
-.user button,
-.user input[type='submit'] {
-  left: 0;
-  width: 100%; }
-  @media (min-width: 500px) {
-    .user button,
-    .user input[type='submit'] {
-      cursor: pointer;
-      width: 30%; } }
-
-.grid {
-  clear: both;
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -ms-flex-wrap: wrap;
-      flex-wrap: wrap;
-  margin-left: auto;
-  margin-right: auto; }
-  .grid:after {
-    clear: both; }
-  .grid:before {
-    content: '';
-    display: table; }
-  .grid > .column {
-    display: -webkit-box;
-    display: -ms-flexbox;
-    display: flex;
-    -webkit-box-flex: 1;
-        -ms-flex: auto;
-            flex: auto;
-    -webkit-box-orient: vertical;
-    -webkit-box-direction: normal;
-        -ms-flex-direction: column;
-            flex-direction: column;
-    padding: 2.4rem;
-    position: relative;
-    -webkit-transition: .3s;
-    transition: .3s;
-    width: 100%; }
-  .grid.vertical-align .column {
-    -webkit-box-pack: center;
-        -ms-flex-pack: center;
-            justify-content: center; }
-  @media (min-width: 768px) {
-    .grid > .column {
-      width: 25%; }
-    .grid.sm .column:nth-child(1) {
-      width: 30%; }
-    .grid.sm .column:nth-child(2) {
-      width: 70%; }
-    .grid.ms .column:nth-child(1) {
-      width: 70%; }
-    .grid.ms .column:nth-child(2) {
-      width: 30%; }
-    .grid.sms .column:nth-child(2) {
-      width: 50%; } }
-
-header,
-footer,
-#navigation {
-  padding: 2.4rem;
-  -webkit-transition: all .4s ease-in-out;
-  transition: all .4s ease-in-out;
-  width: 100%; }
-
-header p,
-footer p {
-  line-height: 4.8rem;
-  margin-bottom: 0; }
-
-header[role='banner'] img,
-footer img {
-  height: 4rem;
-  vertical-align: middle; }
-
-footer {
-  position: relative; }
-
-header,
-footer {
-  z-index: 3; }
-
-header,
-.ws-ready footer {
-  left: 0;
-  position: absolute;
-  top: 0; }
-
-.ws-ready footer {
-  bottom: 0;
-  top: auto; }
-
-header[role='banner'] {
-  opacity: 0; }
-  header[role='banner']:hover {
-    opacity: 1; }
-
-@media (max-width: 767px) {
-  footer .alignleft,
-  footer .alignright {
-    display: block;
-    float: none; } }
-
-.logo {
-  text-transform: lowercase; }
-  .logo a {
-    background: url("../images/logos/logo.svg") no-repeat 0 0;
-    background-size: 4.8rem;
-    float: left;
-    height: 4.8rem;
-    text-indent: -4000px;
-    vertical-align: middle;
-    width: 4.8rem; }
-
-.longform {
-  width: 72rem; }
-  .longform.alignleft, .longform.alignright {
-    max-width: 40%; }
-  .longform img.aligncenter,
-  .longform .longform figure.aligncenter {
-    margin-bottom: 3.2rem;
-    margin-top: 3.2rem; }
-  .longform ul,
-  .longform ol {
-    margin-bottom: 3.2rem; }
-  .longform ul ol,
-  .longform ol ul,
-  .longform ul ul,
-  .longform ol ol {
-    margin-bottom: 0; }
-  .longform figcaption p,
-  .longform [class*='text-pull-'] p {
-    font-size: 1.6rem;
-    line-height: 2.4rem; }
-  @media (min-width: 1280px) {
-    .longform [class*='text-pull-'] {
-      max-width: 32%; }
-    .longform .text-pull-right {
-      margin-right: -256px; }
-    .longform .text-pull-left {
-      margin-left: -256px; } }
-  @media (min-width: 1024px) {
-    .longform .text-quote {
-      margin-left: -4.8rem;
-      margin-right: -4.8rem; } }
-
-.embed {
-  height: 0;
-  overflow: hidden;
-  padding-bottom: 56.6%;
-  position: relative; }
-  .embed iframe,
-  .embed object,
-  .embed embed,
-  .embed video {
-    height: 100%;
-    left: 0;
-    margin: 0;
-    position: absolute;
-    top: 0;
-    width: 100%; }
-  .fullscreen > .embed {
-    bottom: 0;
-    height: auto;
-    left: 0;
-    padding-bottom: 0;
-    position: fixed;
-    right: 0;
-    top: 0; }
-    @media (min-aspect-ratio: 16 / 9) {
-      .fullscreen > .embed > iframe,
-      .fullscreen > .embed > object,
-      .fullscreen > .embed > embed,
-      .fullscreen > .embed > video {
-        height: 300%;
-        top: -100%; } }
-    @media (max-aspect-ratio: 16 / 9) {
-      .fullscreen > .embed > iframe,
-      .fullscreen > .embed > object,
-      .fullscreen > .embed > embed,
-      .fullscreen > .embed > video {
-        left: -100%;
-        width: 300%; } }
-    @supports ((-o-object-fit: cover) or (object-fit: cover)) {
-      .fullscreen > .embed > iframe,
-      .fullscreen > .embed > object,
-      .fullscreen > .embed > embed,
-      .fullscreen > .embed > video {
-        height: 100%;
-        left: 0;
-        -o-object-fit: cover;
-           object-fit: cover;
-        top: 0;
-        width: 100%; } }
-
-nav ul {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -ms-flex-wrap: wrap;
-      flex-wrap: wrap;
-  -webkit-box-pack: start;
-      -ms-flex-pack: start;
-          justify-content: flex-start; }
-  nav ul li {
-    float: left;
-    list-style: none;
-    position: relative; }
-
-nav ul li:first-child,
-nav[role='navigation'] ul li {
-  margin-left: 0; }
-
-nav[role='navigation'] li a {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-pack: center;
-      -ms-flex-pack: center;
-          justify-content: center;
-  line-height: 4.8rem;
-  max-width: 100%;
-  padding: 0 1.6rem;
-  position: relative;
-  text-decoration: none; }
-  nav[role='navigation'] li a svg {
-    margin: 1.5rem .4rem 1.5rem 0; }
-
-header nav ul {
-  -webkit-box-pack: end;
-      -ms-flex-pack: end;
-          justify-content: flex-end;
-  margin: 0; }
-
-nav.aligncenter ul,
-.aligncenter nav ul {
-  -webkit-box-pack: center;
-      -ms-flex-pack: center;
-          justify-content: center; }
-
-nav.navbar ul li {
-  -webkit-box-flex: 1;
-      -ms-flex: 1 1 auto;
-          flex: 1 1 auto; }
-
-@media (max-width: 568px) {
-  nav.navbar ul {
-    -webkit-box-orient: vertical;
-    -webkit-box-direction: normal;
-        -ms-flex-flow: column wrap;
-            flex-flow: column wrap;
-    padding: 0; }
-  nav.navbar li a {
-    -webkit-box-pack: start;
-        -ms-flex-pack: start;
-            justify-content: flex-start; } }
-
-@media print {
-  @page {
-    margin: .5cm;
-    size: A4 landscape; }
-  * {
-    background: transparent !important;
-    color: #000 !important;
-    -webkit-filter: none !important;
-            filter: none !important;
-    text-shadow: none !important; }
-  html,
-  body,
-  #webslides {
-    height: auto !important;
-    overflow: auto !important;
-    width: auto !important; }
-  #webslides {
-    overflow-x: auto !important;
-    overflow-y: auto !important; }
-  section,
-  .slide {
-    display: -webkit-box !important;
-    display: -ms-flexbox !important;
-    display: flex !important;
-    height: auto !important; }
-  section * {
-    -webkit-animation: none;
-            animation: none; }
-  table,
-  figure {
-    page-break-inside: avoid; }
-  #counter,
-  #navigation {
-    display: none; } }
-
-.cta {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -ms-flex-wrap: wrap;
-      flex-wrap: wrap;
-  -webkit-box-pack: center;
-      -ms-flex-pack: center;
-          justify-content: center; }
-
-.number,
-.cta .benefit {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-  -webkit-box-pack: center;
-      -ms-flex-pack: center;
-          justify-content: center;
-  max-width: 100%;
-  padding: .8rem; }
-
-.number {
-  text-align: center; }
-
-.cta .benefit {
-  max-width: 100%;
-  text-align: center; }
-
-.number span {
-  display: block;
-  font-size: 8rem;
-  line-height: 8rem; }
-
-.number span sup {
-  font-size: 4rem; }
-
-.cta p {
-  margin-bottom: 0; }
-
-@media (min-width: 768px) {
-  .number,
-  .cta .benefit {
-    max-width: 50%;
-    padding: 4.8rem; }
-  .cta .benefit {
-    text-align: left; }
-  .number span {
-    font-size: 16rem;
-    line-height: 16rem; }
-    .number span sup {
-      font-size: 6rem;
-      vertical-align: middle; } }
-
-.cta-cover {
-  display: table;
-  width: 100%; }
-  .cta-cover h1 strong {
-    font-weight: 400; }
-  @media (min-width: 1024px) {
-    .cta-cover h1 {
-      float: left;
-      max-width: 80%; }
-    .cta-cover h1 strong {
-      display: block; }
-    .cta-cover .button {
-      margin-top: 1.2rem; }
-    .cta-cover .try {
-      text-align: center; } }
-  @media (max-width: 1023px) {
-    .cta-cover .alignright {
-      float: none; } }
-
-blockquote {
-  display: inline-block;
-  position: relative; }
-  blockquote p {
-    font-size: 2.4rem;
-    line-height: 4rem; }
-    blockquote p:last-child {
-      margin-bottom: 3.2rem; }
-
-dd blockquote p:last-child {
-  margin-bottom: 0; }
-
-.bg-apple blockquote p {
-  font-family: 'San Francisco', 'Roboto', helvetica, arial, sans-serif;
-  font-weight: 300; }
-
-cite {
-  display: block;
-  text-align: center; }
-  cite:before {
-    content: '\2014   \2009';
-    margin-right: 6px; }
-
-cite span {
-  display: block; }
-
-.text-quote,
-.wall {
-  position: relative; }
-  .text-quote:before,
-  .wall:before {
-    content: '\201C';
-    font-family: arial, sans-serif;
-    font-size: 12rem;
-    height: 5.6rem;
-    left: -.8rem;
-    line-height: 1;
-    position: absolute;
-    text-align: center;
-    top: -4rem;
-    width: 5.6rem; }
-  @media (min-width: 768px) {
-    .text-quote,
-    .wall {
-      padding-left: 6.4rem; }
-      .text-quote p,
-      .wall p {
-        font-size: 3.2rem;
-        line-height: 4.8rem; }
-      .text-quote:before,
-      .wall:before {
-        left: .8rem;
-        top: -1.6rem; } }
-
-section * {
-  -webkit-animation: fadeIn .6s ease-in-out;
-          animation: fadeIn .6s ease-in-out; }
-
-section .background,
-section .light,
-section .dark {
-  -webkit-animation-duration: 0s;
-          animation-duration: 0s; }
-
-section,
-.slide {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-  -webkit-box-pack: center;
-      -ms-flex-pack: center;
-          justify-content: center;
-  min-height: 100vh;
-  padding: 2.4rem;
-  page-break-after: always;
-  position: relative;
-  word-wrap: break-word; }
-  @media (min-width: 1024px) {
-    section,
-    .slide {
-      padding-bottom: 12rem;
-      padding-top: 12rem; } }
-
-.fullscreen {
-  padding: 0; }
-
-.slide-top {
-  -webkit-box-pack: start;
-      -ms-flex-pack: start;
-          justify-content: flex-start; }
-
-.slide-bottom {
-  -webkit-box-pack: end;
-      -ms-flex-pack: end;
-          justify-content: flex-end; }
-
-[class*='content-'] {
-  position: relative;
-  text-align: left; }
-
-.wrap[class*='bg-'],
-.wrap.frame,
-[class*='content-'][class*='bg-'],
-[class*='content-'].frame,
-[class*='align'][class*='bg-'] {
-  padding: 4.8rem; }
-
-form[class*='bg-'] {
-  padding: 2.4rem; }
-
-[class*='content-'] > [class*='content-'] p {
-  font-size: 1.8rem;
-  line-height: 3.2rem; }
-
-.content-center {
-  margin: 0 auto;
-  text-align: center; }
-
-@media (min-width: 768px) {
-  [class*='content-'] {
-    width: 50%; }
-    [class*='content-']:after, [class*='content-']:before {
-      content: '';
-      display: table; }
-    [class*='content-']:after {
-      clear: both; }
-  .content-left {
-    float: left; }
-  .content-right {
-    float: right; }
-  [class*='content-'] + [class*='content-'] {
-    margin-bottom: 4.8rem;
-    padding-left: 2.4rem; }
-  [class*='content-'] + [class*='size-'] {
-    clear: both;
-    margin-top: 6.4rem; } }
-
-.background,
-[class*='background-'] {
-  background-repeat: no-repeat;
-  bottom: 0;
-  left: 0;
-  position: absolute;
-  right: 0;
-  top: 0; }
-
-.background {
-  background-position: center;
-  background-size: cover; }
-  .background-top {
-    background-position: top;
-    background-size: cover; }
-  .background-bottom {
-    background-position: bottom;
-    background-size: cover; }
-  .background-center {
-    background-position: center; }
-  .background-center-top {
-    background-position: center top; }
-  .background-right-top {
-    background-position: right top; }
-  .background-left-top {
-    background-position: left top; }
-  .background-center-bottom, .background-left-bottom, .background-right-bottom, .background-left, .background-right {
-    background-position: center bottom; }
-  @media (min-width: 1024px) {
-    .background-left-bottom {
-      background-position: left bottom; }
-    .background-right-bottom {
-      background-position: right bottom; }
-    .background-right {
-      background-position: right; }
-    .background-left {
-      background-position: left; } }
-  .background-video {
-    height: 100%;
-    -o-object-fit: fill;
-       object-fit: fill;
-    width: 100%; }
-
-[class*='bg-'] .light,
-[class*='bg-'] .light {
-  opacity: .8; }
-
-[class*='bg-'] .dark,
-[class*='bg-'] .dark {
-  opacity: .2; }
-
-[class*='bg-'] .background-video.dark {
-  opacity: .5; }
-
-@media (max-width: 1023px) {
-  [class*='background-'] {
-    -webkit-animation: fadeIn ease-in .2;
-            animation: fadeIn ease-in .2;
-    opacity: .2; }
-  .background-video {
-    opacity: .8; } }
-
-.background.anim {
-  -webkit-animation: anim 80s linear infinite;
-          animation: anim 80s linear infinite;
-  background-position: center top;
-  background-repeat: repeat;
-  background-size: 100%;
-  height: 200%; }
-
-[class*='background'].frame {
-  margin: 2.4rem; }
-
-#navigation {
-  -webkit-animation: fadeIn 8s;
-          animation: fadeIn 8s;
-  bottom: 0;
-  left: 0;
-  margin-left: auto;
-  margin-right: auto;
-  opacity: 0;
-  position: fixed;
-  right: 0;
-  width: 24.4rem;
-  z-index: 4; }
-  #navigation:hover {
-    opacity: 1; }
-  #navigation p {
-    margin-bottom: 0; }
-
-#counter {
-  display: block;
-  line-height: 4.8rem;
-  margin-left: auto;
-  margin-right: auto;
-  position: relative;
-  text-align: center;
-  width: 10rem; }
-  #counter a:hover {
-    padding: .8rem; }
-
-a#next,
-a#previous {
-  border-radius: .4rem;
-  cursor: pointer;
-  font-size: 2.4rem;
-  height: 4rem;
-  padding: .8rem;
-  position: absolute;
-  text-align: center;
-  width: 4rem; }
-
-a#next {
-  right: 3.2rem; }
-
-a#previous {
-  left: 3.2rem; }
-
-@media (max-width: 1024px) {
-  #navigation {
-    -webkit-animation: fadeIn 6s;
-            animation: fadeIn 6s;
-    background: url("../images/swipe.svg") no-repeat center top;
-    background-size: 4.8rem; }
-  #navigation a,
-  #counter {
-    display: none; } }
-
-table {
-  margin-bottom: 3.2rem;
-  margin-top: 3.2rem; }
-
-td,
-th,
-thead {
-  border-spacing: 0;
-  padding: .7rem 2.4rem; }
-
-thead th,
-th {
-  cursor: default;
-  font-weight: 600;
-  text-align: left;
-  text-transform: uppercase;
-  white-space: nowrap; }
-
-thead,
-td.goals {
-  font-weight: 600;
-  text-shadow: none; }
-
-tr > td {
-  font-weight: 400; }
-
-.toc,
-.toc ol > li:before,
-.chapter {
-  position: relative;
-  z-index: 2; }
-
-.toc ol {
-  counter-reset: item;
-  position: relative; }
-  .toc ol > li:before {
-    content: counters(item, ".") ". ";
-    display: table-cell;
-    padding-right: .8rem;
-    width: 2.4rem; }
-  .toc ol li li:before {
-    content: counters(item, ".") " "; }
-
-.toc li {
-  counter-increment: item;
-  display: table;
-  font-weight: 400;
-  margin-bottom: .8rem;
-  margin-left: 0;
-  -webkit-transition: .3s;
-  transition: .3s;
-  width: 100%; }
-  .toc li li {
-    font-weight: 300;
-    margin-bottom: 0;
-    margin-left: 0; }
-  .toc li .toc-page:before {
-    content: '';
-    display: block;
-    left: 0;
-    margin-top: 1.8rem;
-    position: absolute;
-    right: 4rem; }
-  .toc li > a {
-    display: inline-block;
-    width: 100%; }
-  .toc li a:hover span {
-    font-weight: 600; }
-  .toc li a:hover .toc-page:before {
-    border-bottom-width: 2px; }
-
-.work {
-  clear: both;
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
-  text-align: left; }
-  h1 + .work,
-  h2 + .work,
-  h3 + .work,
-  p + .work {
-    margin-top: 4.8rem; }
-  .work li {
-    -webkit-box-flex: 1;
-        -ms-flex: 1;
-            flex: 1;
-    list-style: none;
-    margin: 0;
-    position: relative; }
-  .work p {
-    margin-bottom: 0; }
-  .work li a {
-    display: block;
-    float: left;
-    height: 100%;
-    padding: 2.4rem 0;
-    width: 100%; }
-  .work li a p,
-  .work li:first-child a:hover p:first-child {
-    -webkit-transition: .3s;
-    transition: .3s; }
-  .work li p {
-    padding-left: 1.2rem; }
-  .work li.work-label p {
-    padding-left: 0; }
-  .work li a:hover p:first-child {
-    padding-left: 1.6rem; }
-  .work li p:last-child {
-    position: absolute;
-    right: 1.2rem;
-    top: 2.4rem; }
-  .work li.work-label p:last-child {
-    right: 0;
-    top: 0; }
-  .work-label {
-    float: left;
-    font-weight: 600;
-    padding: 0 0 2.4rem;
-    width: 100%; }
-  .work-title {
-    display: block;
-    padding-right: 1.2rem;
-    width: 75%; }
-
-@media (min-width: 768px) {
-  .work-label p,
-  .work li p {
-    float: left;
-    margin-right: 2%;
-    width: 25%; }
-  .work li.work-label p:last-child,
-  .work li p:last-child {
-    float: right;
-    margin-right: 0;
-    padding-right: 1.2rem;
-    position: relative;
-    right: auto;
-    text-align: right;
-    top: auto; }
-  .work li p.work-date {
-    width: 120px; } }
-
-@media (max-width: 768px) {
-  .work-client,
-  .work-label .work-services {
-    clip: rect(1px, 1px, 1px, 1px);
-    height: 1px;
-    overflow: hidden;
-    position: absolute;
-    width: 1px; } }
-
-.text-pull.embed {
-  margin-left: -2.4rem;
-  margin-right: -2.4rem;
-  padding-bottom: 60.6%; }