luna-one 3.1.589 → 3.1.590

package/dist/luna/featurettes/Feat4/Feat4.scss

@@ -1,86 +1,86 @@
-@import "../../../global-styles/terra.scss";
-
-.ter-feat-four {
-  @include organism-padding();
-  margin: 0 auto;
-  display: -ms-grid;
-  display: grid;
-  -webkit-box-pack: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-  width: 100%;
-  -webkit-box-sizing: border-box;
-  box-sizing: border-box;
-  position: relative;
-
-  &__header {
-    font-size: $heading-3-size;
-    text-align: center;
-  }
-
-  &__sub-header,
-  &__sub-header-holder p, &__sub-header-holder div, &__sub-header-holder h1, &__sub-header-holder h2,&__sub-header-holder h3,&__sub-header-holder h4,&__sub-header-holder h5,&__sub-header-holder h6,&__sub-header-holder ul,&__sub-header-holder ol,&__sub-header-holder a {
-    max-width: 752px;
-    font-size: $subheading-size;
-    @include benton-light();
-    text-align: center;
-
-    p {
-      margin: 0;
-    }
-  }
-
-  .react-reveal {
-    display: -ms-grid;
-    display: grid;
-  }
-
-  .ter-cta-section {
-    @media screen and (min-width: $breakpoint-xs) {
-      margin: auto;
-      -webkit-box-orient: horizontal;
-      -webkit-box-direction: normal;
-      -ms-flex-direction: row;
-      flex-direction: row;
-      -ms-flex-pack: distribute;
-      justify-content: space-around;
-    }
-
-    .ter-button {
-      margin: spacing("sm") 0 0;
-      display: -webkit-box;
-      display: -ms-flexbox;
-      display: flex;
-      -webkit-box-pack: center;
-      -ms-flex-pack: center;
-      justify-content: center;
-
-      @media screen and (min-width: $breakpoint-xs) {
-        text-align: center;
-        padding-left: spacing("lg");
-        padding-right: spacing("lg");
-        margin-left: spacing("sm");
-        margin-right: spacing("sm");
-      }
-    }
-  }
-
-  &__background-image {
-    position: absolute;
-  }
-}
-
-@media screen and (-ms-high-contrast: active),
-  screen and (-ms-high-contrast: none) {
-  /* IE10+ specific styles go here */
-  .ter-feat-four {
-    &__sub-header,
-    &__sub-header-holder p {
-      margin-top: 65px;
-    }
-
-    .ter-cta-section {
-      margin: 130px;
-    }
-  }
-}
+@import "../../../global-styles/terra.scss";
+
+.ter-feat-four {
+  @include organism-padding();
+  margin: 0 auto;
+  display: -ms-grid;
+  display: grid;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  width: 100%;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+  position: relative;
+
+  &__header {
+    font-size: $heading-3-size;
+    text-align: center;
+  }
+
+  &__sub-header,
+  &__sub-header-holder p, &__sub-header-holder div, &__sub-header-holder h1, &__sub-header-holder h2,&__sub-header-holder h3,&__sub-header-holder h4,&__sub-header-holder h5,&__sub-header-holder h6,&__sub-header-holder ul,&__sub-header-holder ol,&__sub-header-holder a {
+    max-width: 752px;
+    font-size: $subheading-size;
+    @include benton-light();
+    text-align: center;
+
+    p {
+      margin: 0;
+    }
+  }
+
+  .react-reveal {
+    display: -ms-grid;
+    display: grid;
+  }
+
+  .ter-cta-section {
+    @media screen and (min-width: $breakpoint-xs) {
+      margin: auto;
+      -webkit-box-orient: horizontal;
+      -webkit-box-direction: normal;
+      -ms-flex-direction: row;
+      flex-direction: row;
+      -ms-flex-pack: distribute;
+      justify-content: space-around;
+    }
+
+    .ter-button {
+      margin: spacing("sm") 0 0;
+      display: -webkit-box;
+      display: -ms-flexbox;
+      display: flex;
+      -webkit-box-pack: center;
+      -ms-flex-pack: center;
+      justify-content: center;
+
+      @media screen and (min-width: $breakpoint-xs) {
+        text-align: center;
+        padding-left: spacing("lg");
+        padding-right: spacing("lg");
+        margin-left: spacing("sm");
+        margin-right: spacing("sm");
+      }
+    }
+  }
+
+  &__background-image {
+    position: absolute;
+  }
+}
+
+@media screen and (-ms-high-contrast: active),
+  screen and (-ms-high-contrast: none) {
+  /* IE10+ specific styles go here */
+  .ter-feat-four {
+    &__sub-header,
+    &__sub-header-holder p {
+      margin-top: 65px;
+    }
+
+    .ter-cta-section {
+      margin: 130px;
+    }
+  }
+}

package/dist/luna/featurettes/Feat5/Feat5.scss

@@ -1,235 +1,235 @@
-@import "../../../global-styles/terra.scss";
-
-.luna-feat-five {
-  padding: spacing("super") calc((100vw - 1200px) / 2);
-  text-align: center;
-  font-family: $font-sans-serif;
-  padding: 96px 0;
-  margin: auto;
-  position: relative;
-  overflow: hidden;
-
-  &__header {
-    font-size: $heading-3-size;
-    @include benton-very-bold();
-    margin: 0 0 38px;
-  }
-
-  &__sub-header, &__sub-header-holder p {
-    font-size: $subheading-size;
-    @include benton-light();
-  }
-
-  &__text-content {
-    padding: 0 32px;
-    max-width: 752px;
-    margin: auto;
-  }
-
-  &__thumbnail-container {
-    padding: 32px;
-    @media screen and (max-width: 400px) {
-      padding: 0;
-    }
-  }
-
-  &__thumbnail {
-    max-width: 752px;
-    min-width: 688px;
-    max-height: 387px;
-    -o-object-fit: cover;
-    object-fit: cover;
-    display: block;
-    margin: auto;
-    -webkit-transition: 0.2s;
-    -o-transition: 0.2s;
-    transition: 0.2s;
-
-    @media screen and (max-width: 740px) {
-      max-width: 600px;
-      min-width: 600px;
-      min-height: 387px;
-      max-height: 387px;
-    }
-
-    @media screen and (max-width: 655px) {
-      max-width: 550px;
-      min-width: 550px;
-      min-height: 309px;
-      max-height: 309px;
-    }
-
-    @media screen and (max-width: 610px) {
-      max-width: 500px;
-      min-width: 500px;
-      min-height: 281px;
-      max-height: 281px;
-    }
-
-    @media screen and (max-width: 555px) {
-      max-width: 450px;
-      min-width: 450px;
-      min-height: 253px;
-      max-height: 253px;
-    }
-
-    @media screen and (max-width: 510px) {
-      max-width: 400px;
-      min-width: 400px;
-      min-height: 225px;
-      max-height: 225px;
-    }
-
-    @media screen and (max-width: 455px) {
-      max-width: 350px;
-      min-width: 350px;
-      min-height: 197px;
-      max-height: 197px;
-    }
-
-    @media screen and (max-width: 410px) {
-      max-width: 325px;
-      min-width: 325px;
-      min-height: 182px;
-      max-height: 182px;
-    }
-
-    @media screen and (max-width: 380px) {
-      max-width: 275px;
-      min-width: 275px;
-      min-height: 155px;
-      max-height: 155px;
-    }
-
-    &--is-hovering {
-      -webkit-transform: scale(1.03);
-      -ms-transform: scale(1.03);
-      transform: scale(1.03);
-      cursor: pointer;
-    }
-
-    &-container {
-      position: relative;
-    }
-  }
-
-  &__play-btn {
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    margin: auto;
-
-    &--is-hovering {
-      -webkit-transform: scale(1.03);
-      -ms-transform: scale(1.03);
-      transform: scale(1.03);
-      cursor: pointer;
-    }
-  }
-
-  &__video-wrapper {
-    position: relative;
-    -webkit-transition: 0.3s;
-    -o-transition: 0.3s;
-
-    transition: 0.3s;
-    -webkit-transform: translateY(50px);
-    -ms-transform: translateY(50px);
-    transform: translateY(50px);
-
-    &--default {
-      padding-bottom: 56.25%; /* 16:9 */
-      padding-top: 25px;
-      height: 0;
-    }
-
-    &--is-deployed {
-      -webkit-transform: translateY(0);
-      -ms-transform: translateY(0);
-      transform: translateY(0);
-    }
-
-    iframe {
-      position: absolute;
-      top: 0;
-      bottom: 0;
-      left: 0;
-      right: 0;
-      max-width: 70%;
-      max-height: 70%;
-      margin: 60px auto 0;
-
-      @media screen and (max-width: 1980px) {
-        max-width: 1200px;
-        max-height: 675px;
-      }
-    }
-  }
-
-  &__modal {
-    position: fixed;
-    height: 100vw;
-    width: 100vw;
-    background: rgba(0, 0, 0, 0.5);
-    z-index: 100;
-    top: 0;
-    left: 0;
-    overflow: hidden;
-    -webkit-transition: 0.3s;
-    -o-transition: 0.3s;
-    transition: 0.3s;
-    opacity: 0;
-    -webkit-animation: fade-in 0.5s linear;
-    animation: fade-in 0.5s linear;
-    height: 100vh;
-    width: 100vw;
-    opacity: 0;
-    visibility: hidden;
-    display: -ms-grid;
-    display: grid;
-    -webkit-box-align: center;
-    -ms-flex-align: center;
-    align-items: center;
-
-    &--is-deployed {
-      opacity: 1;
-      visibility: visible;
-    }
-  }
-
-  &__background-image {
-    position: absolute;
-    opacity: 1;
-
-    &--hidden {
-      opacity: 0;
-    }
-  }
-
-  &__wrapper {
-    position: relative;
-    overflow: hidden;
-  }
-
-  .luna-feat-five__header,
-  .luna-feat-five__sub-header,
-  .luna-feat-five__thumbnail-container,
-  .luna-feat-five__thumbnail {
-    -webkit-transition: opacity 0.2s;
-    -o-transition: opacity 0.2s;
-    transition: opacity 0.2s;
-  }
-
-  &--deployed {
-    overflow-y: visible;
-
-    .luna-feat-five__header,
-    .luna-feat-five__sub-header,
-    .luna-feat-five__thumbnail-container,
-    .luna-feat-five__thumbnail {
-      opacity: 0;
-    }
-  }
-}
+@import "../../../global-styles/terra.scss";
+
+.luna-feat-five {
+  padding: spacing("super") calc((100vw - 1200px) / 2);
+  text-align: center;
+  font-family: $font-sans-serif;
+  padding: 96px 0;
+  margin: auto;
+  position: relative;
+  overflow: hidden;
+
+  &__header {
+    font-size: $heading-3-size;
+    @include benton-very-bold();
+    margin: 0 0 38px;
+  }
+
+  &__sub-header, &__sub-header-holder p {
+    font-size: $subheading-size;
+    @include benton-light();
+  }
+
+  &__text-content {
+    padding: 0 32px;
+    max-width: 752px;
+    margin: auto;
+  }
+
+  &__thumbnail-container {
+    padding: 32px;
+    @media screen and (max-width: 400px) {
+      padding: 0;
+    }
+  }
+
+  &__thumbnail {
+    max-width: 752px;
+    min-width: 688px;
+    max-height: 387px;
+    -o-object-fit: cover;
+    object-fit: cover;
+    display: block;
+    margin: auto;
+    -webkit-transition: 0.2s;
+    -o-transition: 0.2s;
+    transition: 0.2s;
+
+    @media screen and (max-width: 740px) {
+      max-width: 600px;
+      min-width: 600px;
+      min-height: 387px;
+      max-height: 387px;
+    }
+
+    @media screen and (max-width: 655px) {
+      max-width: 550px;
+      min-width: 550px;
+      min-height: 309px;
+      max-height: 309px;
+    }
+
+    @media screen and (max-width: 610px) {
+      max-width: 500px;
+      min-width: 500px;
+      min-height: 281px;
+      max-height: 281px;
+    }
+
+    @media screen and (max-width: 555px) {
+      max-width: 450px;
+      min-width: 450px;
+      min-height: 253px;
+      max-height: 253px;
+    }
+
+    @media screen and (max-width: 510px) {
+      max-width: 400px;
+      min-width: 400px;
+      min-height: 225px;
+      max-height: 225px;
+    }
+
+    @media screen and (max-width: 455px) {
+      max-width: 350px;
+      min-width: 350px;
+      min-height: 197px;
+      max-height: 197px;
+    }
+
+    @media screen and (max-width: 410px) {
+      max-width: 325px;
+      min-width: 325px;
+      min-height: 182px;
+      max-height: 182px;
+    }
+
+    @media screen and (max-width: 380px) {
+      max-width: 275px;
+      min-width: 275px;
+      min-height: 155px;
+      max-height: 155px;
+    }
+
+    &--is-hovering {
+      -webkit-transform: scale(1.03);
+      -ms-transform: scale(1.03);
+      transform: scale(1.03);
+      cursor: pointer;
+    }
+
+    &-container {
+      position: relative;
+    }
+  }
+
+  &__play-btn {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    margin: auto;
+
+    &--is-hovering {
+      -webkit-transform: scale(1.03);
+      -ms-transform: scale(1.03);
+      transform: scale(1.03);
+      cursor: pointer;
+    }
+  }
+
+  &__video-wrapper {
+    position: relative;
+    -webkit-transition: 0.3s;
+    -o-transition: 0.3s;
+
+    transition: 0.3s;
+    -webkit-transform: translateY(50px);
+    -ms-transform: translateY(50px);
+    transform: translateY(50px);
+
+    &--default {
+      padding-bottom: 56.25%; /* 16:9 */
+      padding-top: 25px;
+      height: 0;
+    }
+
+    &--is-deployed {
+      -webkit-transform: translateY(0);
+      -ms-transform: translateY(0);
+      transform: translateY(0);
+    }
+
+    iframe {
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      left: 0;
+      right: 0;
+      max-width: 70%;
+      max-height: 70%;
+      margin: 60px auto 0;
+
+      @media screen and (max-width: 1980px) {
+        max-width: 1200px;
+        max-height: 675px;
+      }
+    }
+  }
+
+  &__modal {
+    position: fixed;
+    height: 100vw;
+    width: 100vw;
+    background: rgba(0, 0, 0, 0.5);
+    z-index: 100;
+    top: 0;
+    left: 0;
+    overflow: hidden;
+    -webkit-transition: 0.3s;
+    -o-transition: 0.3s;
+    transition: 0.3s;
+    opacity: 0;
+    -webkit-animation: fade-in 0.5s linear;
+    animation: fade-in 0.5s linear;
+    height: 100vh;
+    width: 100vw;
+    opacity: 0;
+    visibility: hidden;
+    display: -ms-grid;
+    display: grid;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+
+    &--is-deployed {
+      opacity: 1;
+      visibility: visible;
+    }
+  }
+
+  &__background-image {
+    position: absolute;
+    opacity: 1;
+
+    &--hidden {
+      opacity: 0;
+    }
+  }
+
+  &__wrapper {
+    position: relative;
+    overflow: hidden;
+  }
+
+  .luna-feat-five__header,
+  .luna-feat-five__sub-header,
+  .luna-feat-five__thumbnail-container,
+  .luna-feat-five__thumbnail {
+    -webkit-transition: opacity 0.2s;
+    -o-transition: opacity 0.2s;
+    transition: opacity 0.2s;
+  }
+
+  &--deployed {
+    overflow-y: visible;
+
+    .luna-feat-five__header,
+    .luna-feat-five__sub-header,
+    .luna-feat-five__thumbnail-container,
+    .luna-feat-five__thumbnail {
+      opacity: 0;
+    }
+  }
+}