custom assets ported

app/assets/stylesheets/templates/_footer.scss

@@ -0,0 +1,44 @@
+footer {
+  width: 100%;
+  height: 112px;
+  @include outer-container;
+}
+.footer_title {
+  @include span-columns(6);
+  padding:2.5rem 0 1rem;
+  h2 {
+    font-family: $primary-font-face;
+    text-transform: uppercase;
+    font-weight: 700;
+    margin: 0 0 0 0;
+    font-size: 3vw;
+  }
+}
+.pd_logo {
+  @include span-columns(6);
+  @include omega();
+  text-align: right;
+  padding:1.5rem 0 1rem;
+  img {
+    max-height: 45px;
+  }
+}
+.footer_yellow-bar {
+  @include span-columns(12);
+  @include omega();
+  @include slantmix(0, 0, 1.5rem);
+  background-color:$accent-color-2;
+}
+
+@media only screen and (min-width: 480px) {
+  footer {
+    height: 116px;
+  }
+}
+
+
+@media screen and (min-width: 700px) {
+  .footer_title h2 {
+    font-size: 1.25rem;
+  }
+}

app/assets/stylesheets/templates/_header.scss

@@ -0,0 +1,26 @@
+header {
+  @include outer-container;
+  padding-top: 13vw;
+
+  &.no-progressbar {
+    padding-top: 52px;
+  }
+}
+.page-title {
+  @include omega();
+  text-transform: uppercase;
+  padding: 1rem 3rem .5rem;
+
+  div {
+    font: bold 1.25rem $primary-font-face;
+  }
+}
+
+@media screen and (min-width: $desktop) {
+  header {
+    padding-top: 135px;
+  }
+  .page-title {
+    padding:$primary-padding;
+  }
+}

app/assets/stylesheets/templates/_intro.scss

@@ -0,0 +1,26 @@
+.intro_tpl {
+  @include outer-container;
+  padding:$primary-padding;
+  form {
+    margin-top: 3rem;
+    @include span-columns(12);
+    @include omega();
+    button[type='submit']
+    {
+      display: block;
+      width:100%;
+      margin-top: 3rem;
+    }
+  }
+}
+
+@media only screen and (min-width: $desktop) {
+  .intro_tpl {
+    padding:$primary-padding;
+    form {
+      @include span-columns(6);
+      @include shift(3);
+      @include omega();
+    }
+  }
+}

app/assets/stylesheets/templates/_questions.scss

@@ -0,0 +1,71 @@
+.questions_tpl {
+  @include outer-container;
+  .prft-heading,
+  .content-well {
+    padding: 1rem 0;
+    @include outer-container;
+    .column-left,
+    .column-right {
+      @include span-columns(12);
+      @include omega();
+    }
+  }
+  .form-group {
+    position: relative;
+    textarea {
+      + label {
+        position: absolute;
+        left: 3rem;
+        top: 1rem;
+        pointer-events: none;
+      }
+      &:focus,
+      &:valid {
+        + label {
+          top: -10px;
+          font-size: 0.8em;
+        }
+      }
+    }
+  }
+  textarea {
+    // padding: 1rem 3rem;
+    padding: 1rem 0;
+  }
+}
+
+.btn-container-left,
+.btn-container-right {
+  padding-top: 2rem;
+}
+
+.btn-container-left {
+  @include span-columns(5);
+}
+.btn-container-right {
+  @include span-columns(7);
+  @include omega();
+  text-align: right;
+}
+
+.btn-container-summary {
+  text-align: center;
+}
+
+@media only screen and (min-width: $desktop) {
+  .questions_tpl {
+    @include outer-container;
+    .prft-heading,
+    .content-well {
+
+      .column-left {
+        @include omega-reset(6n);
+        @include span-columns(6);
+      }
+      .column-right {
+        @include span-columns(6);
+        @include omega();
+      }
+    }
+  }
+}

app/assets/stylesheets/templates/_summary.scss

@@ -0,0 +1,85 @@
+.summary_tpl {
+  @include outer-container;
+  padding: 2rem 0;
+  .prft-heading {
+    font-size:1.875rem;
+  }
+  .answer-sec {
+    // padding-top:2rem;
+    margin-bottom: 2rem;
+    transition: 0.3s ease;
+    // &.editable {
+    //   background-color: #f2f2f2;
+    // }
+    .question-heading {
+      @include outer-container;
+      .question-title {
+        @include span-columns(12);
+        @include omega();
+        padding-top: .75rem;
+        h3 {
+          font-size: 1.25rem;
+        }
+      }
+      .answer-buttons {
+        @include span-columns(12);
+        @include omega();
+        white-space: nowrap;
+      }
+    }
+    .answer-container {
+      padding:2rem 0;
+    }
+  }
+}
+
+.editable {
+  background-color: #f2f2f2;
+  padding: 2rem;
+  margin: 0 -2rem;
+}
+
+#summary-form {
+  margin-top: 3rem;
+}
+
+.success {
+    text-align: center;
+    background-color: $accent-color-3;
+    color: #fff;
+    padding-top: .5rem;
+    padding-bottom: .5rem;
+    margin-bottom: .5rem; 
+}
+
+@media only screen and (min-width: $tablet) {
+  .summary_tpl {
+    .answer-sec {
+      .question-heading {
+        .question-title {
+          @include span-columns(8);
+        }
+        .answer-buttons {
+          @include span-columns(4);
+          @include omega();
+          text-align: right;
+        }
+      }
+    }
+  }
+}
+
+@media only screen and (min-width: $desktop) {
+  .summary_tpl {
+    .answer-sec {
+      .question-heading {
+        .question-title {
+          @include span-columns(9);
+        }
+        .answer-buttons {
+          @include span-columns(3);
+        }
+      }
+    }
+  }
+}