/*
	Importing SCSS Files

	- Do not include the leading underscore '_'
	- Do not include the file extension

	Example:

@import "page-layouts/page-layout";

*/
header {
  position: relative;
  z-index: 10;
  border-bottom: 1px solid #ccc;
  background: #fff;
  width: 100% !important; }
  header svg,
  header li,
  header img {
    vertical-align: middle; }
  header ul {
    list-style: none;
    margin: 0;
    padding: 0; }
  header .logo {
    padding: 1rem; }
    header .logo img {
      height: 46px; }
  header .main {
    text-align: right;
    position: relative; }
    header .main img, header .main svg {
      width: 1.5rem;
      height: 1.5rem;
      padding: 0 0 0.5rem 0; }
    header .main .-text-right a {
      display: inline-block;
      text-align: center;
      margin-right: 1rem; }
  header .hamburger {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    width: 23px;
    height: 3px;
    margin: 2rem;
    background: #cf102b;
    transition: all linear 0.125s; }
    header .hamburger:before {
      top: -8px;
      content: '';
      display: block;
      width: 23px;
      height: 3px;
      background: #cf102b;
      position: absolute;
      z-index: -1;
      -moz-transition: all 0.225s;
      -webkit-transition: all 0.225s;
      transition: all 0.225s; }
    header .hamburger:after {
      top: 8px;
      content: '';
      display: block;
      width: 23px;
      height: 3px;
      background: #cf102b;
      position: absolute;
      z-index: -1;
      -moz-transition: all 0.225s;
      -webkit-transition: all 0.225s;
      transition: all 0.225s; }
  header .toggle.-active .hamburger {
    background: none; }
    header .toggle.-active .hamburger:before {
      top: 0;
      transform: rotate(45deg); }
    header .toggle.-active .hamburger:after {
      top: 0;
      transform: rotate(-45deg); }
  header .logo,
  header .toggle {
    z-index: 4;
    position: relative; }
  header > nav {
    background: rgba(255, 255, 255, 0.925);
    position: fixed;
    top: 0;
    right: 0px;
    padding-right: 20px;
    bottom: 0;
    left: 0;
    pointer-events: none;
    transform-origin: top right;
    opacity: 0;
    transition: 0.175s all ease-in-out; }
    header > nav > ul,
    header > nav li > div {
      margin-top: 100px; }
    header > nav ul {
      width: 100%;
      padding-left: 1rem; }
      header > nav ul li {
        display: block;
        margin: 0;
        /*font-size: 1.25rem;*/ }
        header > nav ul li > div {
          position: absolute;
          top: 0;
          left: 0;
          right: 0;
          bottom: 0;
          transform: translateX(100%);
          transition: 0.225s all ease-in-out;
          background: rgba(255, 255, 255, 0.985);
          overflow-y: auto; }
        header > nav ul li.-active > div {
          transform: none; }
        header > nav ul li a {
          display: block;
          font-size: 1.1rem;
          font-weight: 400;
          color: #626c76;
          margin: 0;
          box-sizing: border-box; }
          header > nav ul li a:hover, header > nav ul li a.-active {
            position: relative; }
            header > nav ul li a:hover::after, header > nav ul li a.-active::after {
              content: "";
              position: absolute;
              bottom: 0;
              left: 1rem;
              right: 0;
              height: 5px;
              width: 2rem;
              background: #cf102b;
              display: block; }
        header > nav ul li .back a {
          color: #8c8c8c; }
    header > nav.-active {
      pointer-events: all;
      opacity: 1; }
    header > nav .flex {
      height: 100%; }
  header a {
    padding: 7px;
    display: inline-block; }
    header a img, header a svg {
      display: block;
      margin: auto; }
    header a + a {
      margin-left: 8px; }
  header .main {
    position: relative; }
    header .main a.-active {
      position: relative; }
      header .main a.-active::after {
        content: "";
        position: absolute;
        height: 5px;
        bottom: 0;
        left: 0;
        right: 0;
        background: #cf102b; }
  header .search {
    position: absolute;
    right: 0;
    left: 0;
    top: 100%;
    transition: all linear 0.195s;
    transform: scale(0);
    transform-origin: top right; }
    header .search label, header .search input {
      margin: 0;
      opacity: 0;
      transition: all linear 0.195s; }
    header .search span {
      position: absolute;
      display: block;
      top: 50%;
      transform: translateY(-50%);
      left: 1rem; }
      header .search span img, header .search span svg {
        width: 1rem;
        height: 1rem;
        padding: 0; }
    header .search input {
      padding-left: 3rem; }
    header .search.-active {
      transform: scale(1); }
      header .search.-active label, header .search.-active input {
        opacity: 1; }
  @media (min-width: 1025px) {
    header .back a {
      padding: 1rem 7px; }
    header .utility img, header .utility svg {
      width: 1rem;
      height: 1rem; }
    header .main {
      padding: 1rem 0; }
      header .main img, header .main svg {
        width: 1.5rem;
        height: 1.5rem; }
      header .main > div:first-child {
        margin-right: 2rem; } }
  @media (max-width: 768px) {
    header .main {
      font-size: 0;
      padding-top: .75rem; }
      header .main img, header .main svg {
        padding: .25rem; }
    header .hamburger {
      margin: 1rem; }
    header .logo img {
      height: 34px; } }
  @media (max-width: 512px) {
    header .main a {
      margin: 0;
      padding: 0; }
      header .main a img, header .main a svg {
        width: 20px;
        height: 20px;
        margin: 0;
        padding-bottom: 0; }
    header .hamburger {
      margin: .5rem; }
    header .logo {
      padding: .5rem; }
      header .logo img {
        height: 34px; }
    header > nav > ul {
      margin-top: 68px; }
    header > nav ul li > div {
      margin-top: 68px; } }

footer .main {
  padding: 0 2rem; }
  footer .main .globe img, footer .main .globe svg {
    width: 44px;
    height: 44px;
    padding: 8px 8px 0 0; }
  footer .main .social img, footer .main .social svg {
    width: 20px;
    height: 20px;
    color: white; }
  footer .main .social a {
    padding: 10px;
    border: 2px solid white;
    border-radius: 50%;
    display: inline-block;
    height: 20px; }
    footer .main .social a:hover, footer .main .social a.-active {
      position: relative;
      background-color: white;
      border-radius: 50%; }
      footer .main .social a:hover img, footer .main .social a:hover svg, footer .main .social a.-active img, footer .main .social a.-active svg {
        color: #626C76; }

footer .grid > div {
  padding: 2rem; }

footer ul {
  width: 100%;
  list-style: none;
  margin: 0;
  padding: 0; }
  footer ul li {
    display: block;
    font-size: .85rem;
    color: white;
    margin: .5rem 0; }

footer p {
  margin: 1rem 0 .25rem 0; }

footer hr {
  border: 0;
  margin: 0;
  width: 2rem;
  color: #fff;
  background-color: #fff;
  height: 3px;
  text-align: left; }

@media (max-width: 512px) {
  footer .-xs-center {
    text-align: center; }
  footer hr {
    margin: auto;
    text-align: center; }
  footer .main {
    padding: 1rem 0 0 0; }
  footer .accordion {
    position: relative; }
    footer .accordion .pane {
      display: none; }
    footer .accordion.-active .pane {
      display: block; } }

@media (min-width: 513px) {
  footer .accordion .pane {
    display: block; }
  footer .accordion span {
    display: none; } }

@media (max-width: 768px) {
  footer .grid > div {
    padding: .5rem 2rem; } }

.-bg-gradient-1 {
  background: #8e9eab;
  background: -webkit-linear-gradient(to top left, #8e9eab, #eef2f3);
  background: linear-gradient(to top left, #8e9eab, #eef2f3); }

.-bg-gradient-2 {
  background: #000000;
  background: -webkit-linear-gradient(to top, #000000, #626c76);
  background: linear-gradient(to top, #000000, #626c76); }

.-bg-gradient-3 {
  background: #24C6DC;
  background: -webkit-linear-gradient(to left, #24C6DC, #514A9D);
  background: linear-gradient(to left, #24C6DC, #514A9D); }

.-bg-gradient-4 {
  background: #f3f3f3;
  background: -webkit-linear-gradient(to top, #f3f3f3, white);
  background: linear-gradient(to top, #f3f3f3, white); }

.featureCards {
  height: 100vh;
  max-height: 1024px;
  position: relative; }
  .featureCards video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    transform: translateX(-50%) translateY(-50%);
    background-size: cover;
    transition: 1s opacity; }
    @media (max-width: 512px) {
      .featureCards video {
        height: 100%; } }
  .featureCards .pagination {
    position: absolute;
    z-index: 3;
    bottom: 0;
    left: 50%;
    width: 40rem;
    max-width: 100%;
    transform: translateX(-50%);
    font-size: 1rem;
    justify-content: center; }
    .featureCards .pagination.-semi-trans:before {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      left: -100vw;
      right: -100vw;
      background: rgba(249, 249, 249, 0.75);
      z-index: -1; }
    .featureCards .pagination > div {
      padding: 10px;
      color: #626C76;
      cursor: pointer; }
      .featureCards .pagination > div img, .featureCards .pagination > div svg {
        max-width: 60px;
        max-height: 60px;
        display: block;
        margin: auto; }
      .featureCards .pagination > div:hover, .featureCards .pagination > div.-active {
        position: relative; }
        .featureCards .pagination > div:hover::after, .featureCards .pagination > div.-active::after {
          content: "";
          position: absolute;
          bottom: 0;
          left: 0;
          right: 0;
          height: 5px;
          background: #cf102b;
          display: block; }
        .featureCards .pagination > div:hover img, .featureCards .pagination > div:hover svg, .featureCards .pagination > div.-active img, .featureCards .pagination > div.-active svg {
          color: #fff;
          background-color: #626C76;
          border-radius: 50%; }
  .featureCards .stage {
    height: 100%;
    position: relative;
    white-space: nowrap;
    -moz-transition: all ease-in-out 0.555s;
    -o-transition: all ease-in-out 0.555s;
    -webkit-transition: all ease-in-out 0.555s;
    transition: all ease-in-out 0.555s; }
    .featureCards .stage > div {
      height: 100%;
      width: 100%;
      position: relative;
      display: inline-block;
      white-space: normal;
      -moz-user-select: none;
      -ms-user-select: none;
      -webkit-user-select: none;
      user-select: none;
      background-size: cover;
      background-position: center center;
      vertical-align: top;
      overflow: hidden; }
      .featureCards .stage > div .pos, .featureCards .stage > div .text {
        -moz-user-select: all;
        -ms-user-select: all;
        -webkit-user-select: all;
        user-select: all; }
  .featureCards .circles {
    position: absolute;
    right: 1rem;
    bottom: 1rem;
    left: auto;
    width: auto;
    transform: none; }
    .featureCards .circles > div {
      padding: 0;
      border-radius: 50%;
      border: 2px solid #fff;
      width: 24px;
      height: 24px;
      cursor: pointer;
      display: inline-block; }
      .featureCards .circles > div::nth-child(n+1) {
        margin-left: 1rem; }
      .featureCards .circles > div:hover, .featureCards .circles > div.-active {
        background-color: #fff; }
        .featureCards .circles > div:hover::after, .featureCards .circles > div.-active::after {
          display: none; }
  @media (max-width: 512px) {
    .featureCards .stage > div .pos.-center {
      left: 0;
      right: 0;
      transform: translateY(-50%);
      margin: 0 1rem;
      top: 50%; }
      .featureCards .stage > div .pos.-center.-top {
        top: 0; }
      .featureCards .stage > div .pos.-center.-bottom {
        top: auto;
        bottom: 0; } }
  @media (min-width: 513px) {
    .featureCards .-xs-stack {
      padding: 0 80px; }
    .featureCards .stage > div .pos {
      max-width: 50%; } }
  @media (max-width: 768px) {
    .featureCards .-m-stack-and-below {
      padding: 40px 40px 170px 40px;
      position: relative;
      z-index: 2; }
    .featureCards .image {
      order: 1; }
    .featureCards .text {
      order: 2; } }
  @media (min-width: 768px) {
    .featureCards .-m-stack-and-below {
      padding: 0 80px;
      position: relative;
      z-index: 1; }
    .featureCards .gradient {
      content: '';
      position: absolute;
      top: 65%;
      right: 0;
      left: 0;
      bottom: 0;
      z-index: 1; } }
  @media (max-width: 767px) {
    .featureCards .pagination {
      font-size: 1rem;
      padding-bottom: 10px; }
    .featureCards.carousel {
      height: 100vh; }
      .featureCards.carousel .stage > div {
        vertical-align: top; }
        .featureCards.carousel .stage > div .pos {
          position: absolute;
          z-index: 2;
          top: auto;
          bottom: 170px;
          right: 0;
          display: block;
          padding: 0 40px;
          box-sizing: border-box;
          max-width: 530px;
          width: 100%;
          left: 50%;
          transform: translateX(-50%); }
      .featureCards.carousel .stage .gradient {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        z-index: 1; }
      .featureCards.carousel .next,
      .featureCards.carousel .previous {
        display: none; } }

.caret {
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3; }
  .caret img, .caret svg {
    width: 25px;
    height: 25px;
    padding: 5px;
    color: #fff;
    background: none;
    border: 2px solid #fff;
    border-radius: 50%; }

.featureCards2 {
  height: 100vh;
  max-height: 1024px;
  position: relative;
  /*
		Full images
	*/
  /*
		min 513 px
	*/
  /*
		Special breakpoints and considerations were asked for
		in the design of feature cards.
	*/ }
  .featureCards2 .stage-container {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0; }
  .featureCards2 video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    transform: translateX(-50%) translateY(-50%);
    background-size: cover;
    transition: 1s opacity; }
  .featureCards2 .circles {
    position: absolute;
    right: 1rem;
    bottom: 1rem;
    left: auto;
    width: auto;
    transform: none; }
    .featureCards2 .circles > div {
      padding: 0;
      border-radius: 50%;
      border: 2px solid #fff;
      width: 24px;
      height: 24px;
      cursor: pointer;
      display: inline-block; }
      .featureCards2 .circles > div::nth-child(n+1) {
        margin-left: 1rem; }
      .featureCards2 .circles > div.-active {
        background-color: #fff; }
  .featureCards2 .caret {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3; }
    .featureCards2 .caret img, .featureCards2 .caret svg {
      width: 25px;
      height: 25px;
      padding: 5px;
      color: #fff;
      background: none;
      border: 2px solid #fff;
      border-radius: 50%; }
  .featureCards2 .pagination > div {
    color: #626C76;
    padding: 0.5rem; }
    .featureCards2 .pagination > div:hover, .featureCards2 .pagination > div.-active {
      position: relative; }
      .featureCards2 .pagination > div:hover::after, .featureCards2 .pagination > div.-active::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 5px;
        background: #cf102b;
        display: block; }
      .featureCards2 .pagination > div:hover.-rmv-redline, .featureCards2 .pagination > div.-active.-rmv-redline {
        background-color: #fff; }
        .featureCards2 .pagination > div:hover.-rmv-redline::after, .featureCards2 .pagination > div.-active.-rmv-redline::after {
          content: "";
          position: absolute;
          bottom: 0;
          left: 0;
          right: 0;
          height: 5px;
          background-color: rgba(0, 0, 0, 0);
          display: block; }
      .featureCards2 .pagination > div:hover img, .featureCards2 .pagination > div:hover svg, .featureCards2 .pagination > div.-active img, .featureCards2 .pagination > div.-active svg {
        color: #fff;
        background-color: #626C76;
        border-radius: 50%; }
  @media screen and (min-width: 769px) {
    .featureCards2 .text.-full {
      max-width: 50%; }
      .featureCards2 .text.-full.-right {
        position: absolute;
        right: 80px; } }
  @media (min-width: 513px) {
    .featureCards2 .stage {
      height: 100%;
      position: relative;
      white-space: nowrap;
      -moz-transition: all ease-in-out 0.555s;
      -o-transition: all ease-in-out 0.555s;
      -webkit-transition: all ease-in-out 0.555s;
      transition: all ease-in-out 0.555s; }
      .featureCards2 .stage > div {
        height: 100%;
        width: 100%;
        position: relative;
        display: inline-block;
        white-space: normal;
        -moz-user-select: none;
        -ms-user-select: none;
        -webkit-user-select: none;
        user-select: none;
        background-size: cover;
        background-position: center center;
        vertical-align: top;
        overflow: hidden; }
        .featureCards2 .stage > div .pos {
          max-width: 50%; }
        .featureCards2 .stage > div .pos, .featureCards2 .stage > div .text {
          -moz-user-select: all;
          -ms-user-select: all;
          -webkit-user-select: all;
          user-select: all; }
    .featureCards2 .pagination {
      position: absolute;
      z-index: 3;
      bottom: 0;
      left: 50%;
      width: 40rem;
      max-width: 100%;
      transform: translateX(-50%);
      font-size: 1rem;
      justify-content: center; }
      .featureCards2 .pagination.-semi-trans:before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: -100vw;
        right: -100vw;
        background: rgba(249, 249, 249, 0.75);
        z-index: -1; }
      .featureCards2 .pagination > div {
        padding: 10px;
        cursor: pointer; }
        .featureCards2 .pagination > div img, .featureCards2 .pagination > div svg {
          max-width: 60px;
          max-height: 60px;
          display: block;
          margin: auto; } }
  @media screen and (max-width: 768px) {
    .featureCards2 .stage > div {
      position: relative;
      overflow: hidden; }
      .featureCards2 .stage > div .text, .featureCards2 .stage > div .pos {
        text-align: center;
        position: absolute;
        max-width: 100%;
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        transform: none;
        background: rgba(255, 255, 255, 0.75);
        padding: 1rem; }
      .featureCards2 .stage > div .pos > .text {
        position: relative;
        background: none; }
      .featureCards2 .stage > div .-fg-white {
        color: #626c76; }
      .featureCards2 .stage > div hr {
        display: none; }
      .featureCards2 .stage > div .mega-header, .featureCards2 .stage > div .header, .featureCards2 .stage > div .title, .featureCards2 .stage > div .title-sub, .featureCards2 .stage > div p {
        margin: 0; }
      .featureCards2 .stage > div .mega-header, .featureCards2 .stage > div .header {
        font-size: 1.2rem; }
      .featureCards2 .stage > div .title, .featureCards2 .stage > div .title-sub {
        font-size: 1rem; }
      .featureCards2 .stage > div .button, .featureCards2 .stage > div button {
        display: none; }
    .featureCards2 .pagination {
      background: rgba(255, 255, 255, 0.75);
      position: relative;
      z-index: 5;
      font-size: 0;
      line-height: 0; }
    .featureCards2 .next, .featureCards2 .previous {
      display: none; }
    .featureCards2 .-m-stack-and-below {
      padding: 40px 40px 170px 40px;
      position: relative;
      z-index: 2; }
    .featureCards2 .text {
      order: 2; }
    .featureCards2 video {
      height: 100%;
      width: auto; }
    .featureCards2 .image {
      order: 1;
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      z-index: -1; }
      .featureCards2 .image.-full {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0; }
        .featureCards2 .image.-full img {
          width: auto;
          max-width: none;
          height: 100%; } }
  @media screen and (min-width: 769px) {
    .featureCards2 .image.-full {
      position: absolute;
      top: 0;
      bottom: 0;
      overflow: hidden; }
      .featureCards2 .image.-full img {
        width: auto;
        max-width: none;
        height: 100%; }
      .featureCards2 .image.-full.-left {
        left: 0;
        right: 50%; }
        .featureCards2 .image.-full.-left img {
          position: absolute;
          right: 0; }
      .featureCards2 .image.-full.-right {
        left: 50%;
        right: 0; }
    .featureCards2 .-m-stack-and-below {
      padding: 0 80px;
      position: relative;
      z-index: 1; }
    .featureCards2 .gradient {
      content: '';
      position: absolute;
      top: 65%;
      right: 0;
      left: 0;
      bottom: 0;
      z-index: 1; } }

.rating {
  position: relative;
  display: inline-block;
  font-size: 1.5rem; }
  .rating .bvr-star-off {
    color: #ccc; }
  .rating .bvr-star-on {
    color: #11aef7;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden; }

.cart {
  /*
		Convention: this is an "item" in the cart display view
	*/
  /* Fix the margin on the select box */
  /* Mobile Breakpoint */
  /* Tablet Breakpoint */ }
  .cart > div {
    border-top: 1px solid #ccc; }
    .cart > div .image {
      padding: 1rem; }
      .cart > div .image img {
        width: 200px; }
        @media (min-width: 768px) and (max-width: 1024px) {
          .cart > div .image img {
            width: 160px; } }
    .cart > div .name {
      margin: 0 1rem; }
      .cart > div .name .title-sub {
        margin: 0; }
    .cart > div .selection > .flex > div,
    .cart > div .options > .flex > div {
      margin: 0 1rem; }
  .cart .select span {
    margin: 0; }
  @media (max-width: 767px) {
    .cart .flex.-stack-s {
      display: block; }
    .cart .item {
      text-align: center; } }

#product-e .bookmark {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  transform: translateY(-100%);
  transition: all linear 0.3s;
  z-index: 2999999999; }
  #product-e .bookmark .title-sub {
    font-size: 1rem;
    margin: 0;
    padding-left: 8px;
    line-height: 44px; }
  .-show-bookmark #product-e .bookmark {
    transform: none;
    position: static; }
  #product-e .bookmark nav > ul > li:hover > a, #product-e .bookmark nav > ul > li.-active > a {
    position: relative; }
    #product-e .bookmark nav > ul > li:hover > a::after, #product-e .bookmark nav > ul > li.-active > a::after {
      content: "";
      position: absolute;
      bottom: 4px;
      right: 0;
      left: 0;
      background: #cf102b;
      height: 5px;
      display: block; }

#product-e.-bookmark .bookmark {
  transform: none; }

.grid.-pad > div {
  padding: 1rem; }

.grid.-pad-half > div {
  padding: 0.5rem; }

.grid img {
  width: 100%; }

#modals {
  overflow-y: auto; }
  #modals .modal {
    padding-top: 72px;
    box-sizing: border-box; }
    #modals .modal .close {
      position: absolute;
      top: 14px;
      right: 10px;
      font-weight: 700;
      font-size: 20px;
      width: 44px;
      height: 44px;
      text-align: center;
      line-height: 40px;
      z-index: 1;
      color: #cf102b;
      box-sizing: border-box;
      padding: 12px;
      cursor: pointer; }
      #modals .modal .close img, #modals .modal .close svg {
        position: relative; }
    #modals .modal h1 {
      background: #fff;
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      padding: 16px 0;
      margin: 0;
      z-index: 1;
      color: #cf102b; }
  #modals #modal-buy {
    padding: 0; }
    #modals #modal-buy > .flex {
      min-height: 100%; }
  #modals #modal-retailers .retailer-list,
  #modals #modal-buy .retailer-list {
    text-align: center; }
    #modals #modal-retailers .retailer-list img,
    #modals #modal-buy .retailer-list img {
      max-height: 44px;
      max-width: 156px;
      width: auto;
      margin: auto; }
  @media (max-width: 767px) {
    #modals .modal {
      top: 0;
      min-height: 100%;
      min-height: 100vh;
      transform: none !important; } }
  @media (min-width: 768px) {
    #modals .modal {
      top: 50%;
      left: 50%;
      max-height: 80%;
      max-height: 80vh;
      max-width: 75%;
      width: 512px;
      overflow-y: auto; }
      #modals .modal.-active {
        transform: translate3d(-50%, -50%, 0); } }
  @media (min-width: 1025px) {
    #modals .modal {
      width: 768px; } }

body.-no-scroll {
  overflow: hidden; }

.button.-hollow,
button.-hollow {
  background: none;
  border: 1px solid #3b5998;
  color: #3b5998; }
  .button.-hollow:hover, .button.-hollow:active,
  button.-hollow:hover,
  button.-hollow:active {
    background: #3b5998;
    color: #fff; }

.promo {
  /*
		Grid Editor for Umbraco
		"Variable Content with Background"
	*/
  /*
		TODO
		- update this text shadow for foreground colors
		we want it to apply to
	*/ }
  .promo .flex.-vertical {
    height: 100%; }
    .promo .flex.-vertical > div {
      flex-grow: 1;
      flex-shrink: 0;
      flex-basis: auto; }
      .promo .flex.-vertical > div.-static {
        flex-grow: 0; }
      .promo .flex.-vertical > div:last-child {
        margin-top: auto !important; }
  .promo.-bg {
    background-size: cover;
    background-position: left center;
    background-repeat: no-repeat;
    position: relative; }
    @media (max-width: 512px) {
      .promo.-bg .flex {
        position: relative; } }
  .promo .promo-header {
    font-size: 3.5rem;
    line-height: 3.8rem;
    font-weight: 700; }
  .promo .title {
    font-size: 1.75rem;
    line-height: 2rem;
    font-weight: 300; }
  .promo .promo-title {
    font-size: 2.4rem;
    font-weight: 500; }
  .promo .text .-fg-white,
  .promo .text .-fg-blue,
  .promo .pos .-fg-white,
  .promo .pos .-fg-blue {
    text-shadow: 0 0 8px rgba(0, 0, 0, 0.3); }
  .promo svg {
    max-width: 100px;
    max-height: 100px; }
  @media (max-width: 512px) {
    .promo .pos.-xs-relative {
      position: relative;
      left: auto;
      right: auto;
      transform: none;
      top: auto;
      bottom: auto; } }
  @media (max-width: 767px) {
    .promo .pos.-s-relative {
      position: relative;
      left: auto;
      right: auto;
      transform: none;
      top: auto;
      bottom: auto; }
    .promo .-pad {
      padding: 1rem; }
    .promo.-mar > div {
      margin: .5rem 0 0 0; }
      .promo.-mar > div:last-child {
        margin-bottom: .5rem; } }
  @media (max-width: 1023px) {
    .promo .title-sub {
      display: none; } }
  @media (max-width: 1024px) {
    .promo p {
      line-height: 1.25rem; }
    .promo .title-sub {
      font-size: 1rem;
      line-height: 1.25rem; }
    .promo .title, .promo .promo-title {
      font-size: 1.45rem;
      line-height: 1.45rem; }
    .promo .header, .promo .mega-header, .promo .promo-header {
      font-size: 2.2rem;
      font-weight: 700;
      line-height: 2.45rem; }
    .promo .detail {
      font-size: 0.8rem; } }
  @media (min-width: 768px) {
    .promo .-pad {
      padding: 1rem; }
    .promo.-mar > div {
      margin: .5rem 0 .5rem 0.5rem; }
      .promo.-mar > div:last-child {
        margin-right: .5rem; } }

/*

*/
form label.-mdl {
  display: block;
  position: relative;
  padding: 1.5rem 0; }
  form label.-mdl input + span {
    display: block;
    position: absolute;
    top: 1.5rem;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 4px 0;
    font-size: 1rem;
    line-height: 1rem;
    color: rgba(0, 0, 0, 0.26);
    pointer-events: none;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-align: left;
    transition-duration: .2s;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
    form label.-mdl input + span:after {
      content: "";
      position: absolute;
      bottom: 1.5rem;
      left: 0;
      right: 0;
      height: 2px;
      background-color: #11aef7;
      transform: scale(0);
      transform-origin: center center;
      transition-duration: .2s;
      transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
  form label.-mdl input[type=text],
  form label.-mdl input[type=password],
  form label.-mdl input[type=date],
  form label.-mdl input[type=email],
  form label.-mdl textarea {
    border: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    display: block;
    font-size: 1rem;
    line-height: 1rem;
    margin: 0;
    padding: 4px 0;
    width: 100%;
    background: 0 0;
    text-align: left;
    color: inherit;
    outline: none;
    box-shadow: none;
    cursor: pointer; }
    form label.-mdl input[type=text]:focus + span,
    form label.-mdl input[type=text].-dirty + span,
    form label.-mdl input[type=password]:focus + span,
    form label.-mdl input[type=password].-dirty + span,
    form label.-mdl input[type=date]:focus + span,
    form label.-mdl input[type=date].-dirty + span,
    form label.-mdl input[type=email]:focus + span,
    form label.-mdl input[type=email].-dirty + span,
    form label.-mdl textarea:focus + span,
    form label.-mdl textarea.-dirty + span {
      color: #11aef7;
      font-size: 0.9rem;
      top: 0;
      visibility: visible; }
      form label.-mdl input[type=text]:focus + span:after,
      form label.-mdl input[type=text].-dirty + span:after,
      form label.-mdl input[type=password]:focus + span:after,
      form label.-mdl input[type=password].-dirty + span:after,
      form label.-mdl input[type=date]:focus + span:after,
      form label.-mdl input[type=date].-dirty + span:after,
      form label.-mdl input[type=email]:focus + span:after,
      form label.-mdl input[type=email].-dirty + span:after,
      form label.-mdl textarea:focus + span:after,
      form label.-mdl textarea.-dirty + span:after {
        transform: none; }
    form label.-mdl input[type=text].input-validation-error,
    form label.-mdl input[type=password].input-validation-error,
    form label.-mdl input[type=date].input-validation-error,
    form label.-mdl input[type=email].input-validation-error,
    form label.-mdl textarea.input-validation-error {
      box-shadow: 0 0 5px 1px #cf102b; }
  form label.-mdl textarea {
    height: 5rem; }

form .select.-mdl {
  margin: 2.5rem 0; }
  form .select.-mdl span {
    font-size: 1rem;
    line-height: 34px;
    color: rgba(0, 0, 0, 0.26);
    border: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    box-shadow: none;
    padding: 0;
    position: relative; }
  form .select.-mdl:after {
    content: "";
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    height: 2px;
    background-color: #11aef7;
    transform: scale(0);
    transform-origin: center center;
    transition-duration: .2s;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
  form .select.-mdl.-valid span, form .select.-mdl.-dirty span {
    color: #333; }
  form .select.-mdl.-valid:after, form .select.-mdl.-dirty:after {
    transform: none; }
  form .select.-mdl ul {
    max-height: 180px;
    overflow-y: auto; }
    form .select.-mdl ul li:hover, form .select.-mdl ul li.-selected {
      color: #fff; }

form .-hidden {
  position: absolute;
  bottom: 0;
  left: -100%;
  width: 0;
  height: 0;
  overflow: hidden !important;
  display: block;
  box-sizing: border-box;
  padding: 0;
  -webkit-appearance: none; }

body .-hidden {
  position: absolute;
  bottom: 0;
  left: -100%;
  width: 0;
  height: 0;
  overflow: hidden !important;
  display: block;
  box-sizing: border-box;
  padding: 0;
  -webkit-appearance: none; }

.ui-datepicker {
  background-color: #626c76; }

.ui-datepicker-header {
  color: white;
  text-align: center; }

.ui-datepicker-prev, .ui-datepicker-next {
  padding: 0 .25rem; }

.ui-datepicker-title {
  font-weight: bold; }

.ui-datepicker-calendar {
  color: #626c76; }

#breadcrumbs {
  font-size: 0.75rem;
  padding: .5rem 1rem;
  color: #626c76;
  font-weight: normal; }
  #breadcrumbs a:hover, #breadcrumbs a.-active {
    color: #cf102b; }
  @media (max-width: 512px) {
    #breadcrumbs {
      display: none; } }
  @media (min-width: 768px) {
    #breadcrumbs {
      margin: auto; } }

.light-banner {
  position: relative;
  overflow: hidden;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat; }
  @media (max-width: 512px) {
    .light-banner {
      height: 125px; } }
  @media (min-width: 513px) {
    .light-banner {
      height: 225px; } }

.productBanner {
  height: 100vh;
  max-height: 1024px; }
  .productBanner .pagination {
    position: absolute;
    z-index: 3;
    top: 0;
    left: 0;
    right: 0;
    font-size: 1rem;
    justify-content: center; }
    .productBanner .pagination.-bg-white:before {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      left: -100vw;
      right: -100vw;
      background: white;
      z-index: -1; }
    .productBanner .pagination > div {
      padding: 1rem;
      color: #626C76;
      cursor: pointer;
      border-left: 1px solid #ccc;
      border-right: 1px solid #ccc; }
      .productBanner .pagination > div img, .productBanner .pagination > div svg {
        max-width: 60px;
        max-height: 60px;
        display: block;
        margin: auto; }
        @media (min-width: 1025px) {
          .productBanner .pagination > div img, .productBanner .pagination > div svg {
            max-width: 70px;
            max-height: 70px; } }
      .productBanner .pagination > div > div {
        margin: 1rem 2rem; }
      .productBanner .pagination > div:hover > div, .productBanner .pagination > div.-active > div {
        position: relative; }
        .productBanner .pagination > div:hover > div::after, .productBanner .pagination > div.-active > div::after {
          content: "";
          position: absolute;
          top: 73px;
          bottom: 0;
          left: 50%;
          transform: translateX(-50%);
          height: 5px;
          background: #cf102b;
          display: block;
          width: 100%;
          max-width: 250px;
          margin: auto; }
  .productBanner .stage {
    height: 100%;
    position: relative;
    white-space: nowrap;
    -moz-transition: all ease-in-out 0.555s;
    -o-transition: all ease-in-out 0.555s;
    -webkit-transition: all ease-in-out 0.555s;
    transition: all ease-in-out 0.555s; }
    .productBanner .stage > div {
      height: 100%;
      width: 100%;
      position: relative;
      display: inline-block;
      white-space: normal;
      -moz-user-select: none;
      -ms-user-select: none;
      -webkit-user-select: none;
      user-select: none;
      background-size: cover;
      background-position: center center;
      vertical-align: top;
      overflow: hidden; }
      .productBanner .stage > div .pos, .productBanner .stage > div .text {
        -moz-user-select: all;
        -ms-user-select: all;
        -webkit-user-select: all;
        user-select: all; }
  .productBanner .circles {
    position: absolute;
    right: 1rem;
    bottom: 1rem;
    left: auto;
    width: auto;
    transform: none; }
    .productBanner .circles > div {
      padding: 0;
      border-radius: 50%;
      border: 2px solid #fff;
      width: 24px;
      height: 24px;
      cursor: pointer;
      display: inline-block; }
      .productBanner .circles > div::nth-child(n+1) {
        margin-left: 1rem; }
      .productBanner .circles > div.-active {
        background-color: #fff; }
  .productBanner .caret {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3; }
    .productBanner .caret img, .productBanner .caret svg {
      width: 25px;
      height: 25px;
      padding: 5px;
      color: #fff;
      background: none;
      border: 2px solid #fff;
      border-radius: 50%; }
  @media (max-width: 512px) {
    .productBanner .pagination > div {
      padding: .75rem 0 0 0; }
      .productBanner .pagination > div:hover > div::after, .productBanner .pagination > div.-active > div::after {
        top: auto; }
    .productBanner .caret {
      display: none; }
      .productBanner .caret.carousel {
        height: 100vh; }
        .productBanner .caret.carousel .stage > div {
          vertical-align: top; }
          .productBanner .caret.carousel .stage > div .pos {
            position: absolute;
            z-index: 2;
            top: 125px;
            bottom: 16px;
            right: 0;
            display: block;
            padding: 0 1rem;
            box-sizing: border-box;
            max-width: 530px;
            width: 100%;
            left: 50%;
            transform: translateX(-50%); }
    .productBanner .flex .flex {
      margin-right: 1rem; }
    .productBanner .stage img, .productBanner .stage svg {
      max-width: 60px;
      max-height: 60px; }
    .productBanner .pos.-center.-middle {
      top: 120px;
      left: 0;
      right: 0;
      bottom: 0;
      transform: none;
      position: absolute;
      padding: 0 1rem; } }
  @media (min-width: 513px) {
    .productBanner .stage img, .productBanner .stage svg {
      max-width: 60px;
      max-height: 60px; }
    .productBanner .-xs-stack {
      padding: 0 16px; }
    .productBanner .pagination img, .productBanner .pagination svg {
      width: 60px;
      height: 60px;
      padding: 0 .5rem .5rem 0; }
    .productBanner .pagination > div {
      padding: 0; }
    .productBanner .pagination .flex .flex > div:first-child {
      margin-right: 1rem; }
    .productBanner .pos {
      position: absolute;
      z-index: 2;
      top: 50%;
      right: 0;
      display: block;
      padding: 0 40px;
      box-sizing: border-box;
      max-width: 530px;
      width: 100%;
      left: 50%;
      transform: translateX(-50%); } }
  @media (max-width: 768px) {
    .productBanner .-m-stack-and-below {
      padding: 40px 40px 170px 40px;
      position: relative;
      z-index: 2; }
    .productBanner .image {
      order: 1; }
    .productBanner .text {
      order: 2; }
    .productBanner .pagination > div > div {
      margin: 0; }
    .productBanner.carousel {
      height: 100vh; }
      .productBanner.carousel .stage > div {
        vertical-align: top; }
      .productBanner.carousel .stage .gradient {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        z-index: 1; } }
  @media (min-width: 768px) {
    .productBanner .-m-stack-and-below {
      padding: 0 80px;
      position: relative;
      z-index: 1; }
    .productBanner .gradient {
      content: '';
      position: absolute;
      top: 65%;
      right: 0;
      left: 0;
      bottom: 0;
      z-index: 1; } }
  @media (max-width: 767px) {
    .productBanner span .-xs-hide {
      display: none; }
    .productBanner .pagination {
      padding-bottom: 0; }
      .productBanner .pagination .title-sub {
        text-align: center;
        font-size: .85rem; }
      .productBanner .pagination > div img, .productBanner .pagination > div svg {
        max-width: 44px;
        max-height: 44px;
        display: block;
        margin: auto; } }

#product-list .flex.-vertical {
  height: 100%; }
  #product-list .flex.-vertical > div {
    flex-grow: 1;
    flex-shrink: 0;
    flex-basis: auto; }
    #product-list .flex.-vertical > div.-static {
      flex-grow: 0; }
    #product-list .flex.-vertical > div:last-child {
      margin-top: auto !important; }

/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.5.1
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2016 Daniel Eden
 */
.animated {
  opacity: 0;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both; }
  .-nojs .animated {
    animation: none;
    opacity: 1; }

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite; }

@-webkit-keyframes fadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

@keyframes fadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn; }

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown; }

@-webkit-keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig; }

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft; }

@-webkit-keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig; }

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight; }

@-webkit-keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig; }

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp; }

@-webkit-keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig; }

@-webkit-keyframes fadeOut {
  from {
    opacity: 1; }
  to {
    opacity: 0; } }

@keyframes fadeOut {
  from {
    opacity: 1; }
  to {
    opacity: 0; } }

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut; }

@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0); } }

@keyframes fadeOutDown {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0); } }

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown; }

@-webkit-keyframes fadeOutDownBig {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0); } }

@keyframes fadeOutDownBig {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0); } }

.fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
  animation-name: fadeOutDownBig; }

@-webkit-keyframes fadeOutLeft {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0); } }

@keyframes fadeOutLeft {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0); } }

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft; }

@-webkit-keyframes fadeOutLeftBig {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0); } }

@keyframes fadeOutLeftBig {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0); } }

.fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig; }

@-webkit-keyframes fadeOutRight {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0); } }

@keyframes fadeOutRight {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0); } }

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight; }

@-webkit-keyframes fadeOutRightBig {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0); } }

@keyframes fadeOutRightBig {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0); } }

.fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
  animation-name: fadeOutRightBig; }

@-webkit-keyframes fadeOutUp {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0); } }

@keyframes fadeOutUp {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0); } }

.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
  animation-name: fadeOutUp; }

@-webkit-keyframes fadeOutUpBig {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0); } }

@keyframes fadeOutUpBig {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0); } }

.fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
  animation-name: fadeOutUpBig; }

.-show-en ._lang._es {
  display: none; }

.-show-en ._lang._fr {
  display: none; }

.-show-es ._lang._en {
  display: none; }

.-show-es ._lang._fr {
  display: none; }

.-show-fr ._lang._en {
  display: none; }

.-show-fr ._lang._es {
  display: none; }

.productBanner {
  height: 100vh;
  max-height: 1024px; }
  .productBanner .pagination {
    position: absolute;
    z-index: 3;
    top: 0;
    left: 0;
    right: 0;
    font-size: 1rem;
    justify-content: center; }
    .productBanner .pagination.-bg-white:before {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      left: -100vw;
      right: -100vw;
      background: white;
      z-index: -1; }
    .productBanner .pagination > div {
      padding: 1rem;
      color: #626C76;
      cursor: pointer;
      border-left: 1px solid #ccc;
      border-right: 1px solid #ccc; }
      .productBanner .pagination > div img, .productBanner .pagination > div svg {
        max-width: 60px;
        max-height: 60px;
        display: block;
        margin: auto; }
        @media (min-width: 1025px) {
          .productBanner .pagination > div img, .productBanner .pagination > div svg {
            max-width: 70px;
            max-height: 70px; } }
      .productBanner .pagination > div > div {
        margin: 1rem 2rem; }
      .productBanner .pagination > div:hover > div, .productBanner .pagination > div.-active > div {
        position: relative; }
        .productBanner .pagination > div:hover > div::after, .productBanner .pagination > div.-active > div::after {
          content: "";
          position: absolute;
          top: 73px;
          bottom: 0;
          left: 50%;
          transform: translateX(-50%);
          height: 5px;
          background: #cf102b;
          display: block;
          width: 100%;
          max-width: 250px;
          margin: auto; }
  .productBanner .stage {
    height: 100%;
    position: relative;
    white-space: nowrap;
    -moz-transition: all ease-in-out 0.555s;
    -o-transition: all ease-in-out 0.555s;
    -webkit-transition: all ease-in-out 0.555s;
    transition: all ease-in-out 0.555s; }
    .productBanner .stage > div {
      height: 100%;
      width: 100%;
      position: relative;
      display: inline-block;
      white-space: normal;
      -moz-user-select: none;
      -ms-user-select: none;
      -webkit-user-select: none;
      user-select: none;
      background-size: cover;
      background-position: center center;
      vertical-align: top;
      overflow: hidden; }
      .productBanner .stage > div .pos, .productBanner .stage > div .text {
        -moz-user-select: all;
        -ms-user-select: all;
        -webkit-user-select: all;
        user-select: all; }
  .productBanner .circles {
    position: absolute;
    right: 1rem;
    bottom: 1rem;
    left: auto;
    width: auto;
    transform: none; }
    .productBanner .circles > div {
      padding: 0;
      border-radius: 50%;
      border: 2px solid #fff;
      width: 24px;
      height: 24px;
      cursor: pointer;
      display: inline-block; }
      .productBanner .circles > div::nth-child(n+1) {
        margin-left: 1rem; }
      .productBanner .circles > div.-active {
        background-color: #fff; }
  .productBanner .caret {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3; }
    .productBanner .caret img, .productBanner .caret svg {
      width: 25px;
      height: 25px;
      padding: 5px;
      color: #fff;
      background: none;
      border: 2px solid #fff;
      border-radius: 50%; }
  @media (max-width: 512px) {
    .productBanner .pagination > div {
      padding: .75rem 0 0 0; }
      .productBanner .pagination > div:hover > div::after, .productBanner .pagination > div.-active > div::after {
        top: auto; }
    .productBanner .caret {
      display: none; }
      .productBanner .caret.carousel {
        height: 100vh; }
        .productBanner .caret.carousel .stage > div {
          vertical-align: top; }
          .productBanner .caret.carousel .stage > div .pos {
            position: absolute;
            z-index: 2;
            top: 125px;
            bottom: 16px;
            right: 0;
            display: block;
            padding: 0 1rem;
            box-sizing: border-box;
            max-width: 530px;
            width: 100%;
            left: 50%;
            transform: translateX(-50%); }
    .productBanner .flex .flex {
      margin-right: 1rem; }
    .productBanner .stage img, .productBanner .stage svg {
      max-width: 60px;
      max-height: 60px; }
    .productBanner .pos.-center.-middle {
      top: 120px;
      left: 0;
      right: 0;
      bottom: 0;
      transform: none;
      position: absolute;
      padding: 0 1rem; } }
  @media (min-width: 513px) {
    .productBanner .stage img, .productBanner .stage svg {
      max-width: 60px;
      max-height: 60px; }
    .productBanner .-xs-stack {
      padding: 0 16px; }
    .productBanner .pagination img, .productBanner .pagination svg {
      width: 60px;
      height: 60px;
      padding: 0 .5rem .5rem 0; }
    .productBanner .pagination > div {
      padding: 0; }
    .productBanner .pagination .flex .flex > div:first-child {
      margin-right: 1rem; }
    .productBanner .pos {
      position: absolute;
      z-index: 2;
      top: 50%;
      right: 0;
      display: block;
      padding: 0 40px;
      box-sizing: border-box;
      max-width: 530px;
      width: 100%;
      left: 50%;
      transform: translateX(-50%); } }
  @media (max-width: 768px) {
    .productBanner .-m-stack-and-below {
      padding: 40px 40px 170px 40px;
      position: relative;
      z-index: 2; }
    .productBanner .image {
      order: 1; }
    .productBanner .text {
      order: 2; }
    .productBanner .pagination > div > div {
      margin: 0; }
    .productBanner.carousel {
      height: 100vh; }
      .productBanner.carousel .stage > div {
        vertical-align: top; }
      .productBanner.carousel .stage .gradient {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        z-index: 1; } }
  @media (min-width: 768px) {
    .productBanner .-m-stack-and-below {
      padding: 0 80px;
      position: relative;
      z-index: 1; }
    .productBanner .gradient {
      content: '';
      position: absolute;
      top: 65%;
      right: 0;
      left: 0;
      bottom: 0;
      z-index: 1; } }
  @media (max-width: 767px) {
    .productBanner span .-xs-hide {
      display: none; }
    .productBanner .pagination {
      padding-bottom: 0; }
      .productBanner .pagination .title-sub {
        text-align: center;
        font-size: .85rem; }
      .productBanner .pagination > div img, .productBanner .pagination > div svg {
        max-width: 44px;
        max-height: 44px;
        display: block;
        margin: auto; } }

.productCarousel {
  position: relative;
  font-size: 0;
  width: 100%;
  overflow: hidden;
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-user-select: none;
  user-select: none;
  /*
		Stage and Scenes
	*/
  /*
		Stacked
	*/
  /*
		Next and Previous Links
	*/
  /*
		Light UI
	*/ }
  .productCarousel .stage {
    height: 100%;
    width: 100%;
    position: relative;
    white-space: nowrap;
    -moz-transition: all ease-in-out 0.555s;
    -o-transition: all ease-in-out 0.555s;
    -webkit-transition: all ease-in-out 0.555s;
    transition: all ease-in-out 0.555s;
    margin: 1rem 0 4rem 0; }
    .productCarousel .stage > div,
    .productCarousel .stage > .scene {
      height: 100%;
      position: relative;
      white-space: normal;
      -moz-user-select: none;
      -ms-user-select: none;
      -webkit-user-select: none;
      user-select: none;
      background-size: cover;
      background-position: center center; }
      .productCarousel .stage > div img,
      .productCarousel .stage > .scene img {
        width: 100%; }
      .productCarousel .stage > div .pos,
      .productCarousel .stage > .scene .pos {
        position: absolute; }
        .productCarousel .stage > div .pos.-top,
        .productCarousel .stage > .scene .pos.-top {
          top: 80px; }
        .productCarousel .stage > div .pos.-bot,
        .productCarousel .stage > .scene .pos.-bot {
          bottom: 80px; }
        .productCarousel .stage > div .pos.-middle,
        .productCarousel .stage > .scene .pos.-middle {
          top: 50%;
          transform: translateY(-50%); }
        .productCarousel .stage > div .pos.-left,
        .productCarousel .stage > .scene .pos.-left {
          left: 80px; }
        .productCarousel .stage > div .pos.-right,
        .productCarousel .stage > .scene .pos.-right {
          right: 80px; }
  .productCarousel.-stack .stage > div,
  .productCarousel.-stack .stage > .scene {
    display: block;
    position: absolute;
    top: 0;
    left: 0; }
  .productCarousel .next,
  .productCarousel .previous {
    width: 44px;
    position: absolute;
    top: 0;
    bottom: 0;
    color: #303030;
    cursor: pointer; }
    .productCarousel .next img,
    .productCarousel .next svg,
    .productCarousel .previous img,
    .productCarousel .previous svg {
      position: absolute;
      top: 50%;
      -moz-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      -o-transform: translateY(-50%);
      -webkit-transform: translateY(-50%);
      transform: translateY(-50%);
      width: 100%;
      height: auto;
      padding: 12px;
      -moz-box-sizing: border-box;
      -webkit-box-sizing: border-box;
      box-sizing: border-box; }
      .productCarousel .next img:active,
      .productCarousel .next svg:active,
      .productCarousel .previous img:active,
      .productCarousel .previous svg:active {
        margin-top: 2px; }
    .productCarousel .next:hover,
    .productCarousel .previous:hover {
      background: rgba(0, 0, 0, 0.1); }
  .productCarousel .previous {
    left: 0; }
  .productCarousel .next {
    right: 0; }
  .productCarousel.-light .next,
  .productCarousel.-light .previous {
    color: #cfcfcf; }

.carousel.-singleProduct {
  height: auto;
  background: #fff; }
  .carousel.-singleProduct .pagination {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 1rem;
    text-align: center; }
    .carousel.-singleProduct .pagination.circles > div {
      padding: 0;
      border-radius: 50%;
      border: 2px solid #626c76;
      width: 24px;
      height: 24px;
      cursor: pointer;
      display: inline-block; }
      .carousel.-singleProduct .pagination.circles > div:nth-child(n+1) {
        margin-left: 1rem; }
      .carousel.-singleProduct .pagination.circles > div:hover, .carousel.-singleProduct .pagination.circles > div.-active {
        background-color: #626c76; }
        .carousel.-singleProduct .pagination.circles > div:hover::after, .carousel.-singleProduct .pagination.circles > div.-active::after {
          display: none; }

.pane {
  display: none; }
  .pane.-active {
    display: block; }

.modal-reveal {
  padding-bottom: 1rem; }
  .modal-reveal *[data-reveal] {
    cursor: pointer; }
  .modal-reveal .dot {
    display: inline-block;
    margin: 1rem 0.8rem 0;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background-color: rgba(90, 90, 90, 0.1);
    user-select: none; }
    .modal-reveal .dot.-active {
      background-color: config("colors.primary2"); }
  .modal-reveal .pane {
    max-height: 0;
    padding: 0 2rem;
    transition: all cubic-bezier(0.22, 0.61, 0.36, 1) 0.355s;
    overflow: hidden;
    display: none; }
    @media (max-width: config("breakpoints.s.max")) {
      .modal-reveal .pane {
        padding: 0; } }
    .modal-reveal .pane.-active {
      max-height: 100%;
      display: block; }

body#faq .-wrap-1400 {
  max-width: 1400px;
  margin: auto;
  padding: 0 0 2rem; }

body#faq .categories {
  min-width: 300px;
  padding: 2rem; }

body#faq .faqs {
  padding: 2.5rem 2rem; }

body#faq .tabs .tab {
  display: block;
  flex: none;
  padding: 0;
  box-shadow: none; }
  body#faq .tabs .tab a {
    font-weight: bold;
    padding: 1rem;
    display: block;
    height: 1.3rem; }
  body#faq .tabs .tab.-active {
    color: white;
    background-color: #cf102b; }
    body#faq .tabs .tab.-active .arrow {
      position: relative;
      z-index: 1;
      width: 0;
      height: 0;
      border-top: solid 10px transparent;
      border-bottom: solid 10px transparent;
      border-left: solid 10px #cf102b;
      border-right: solid 10px transparent;
      -ms-transform: translateY(100%);
      -webkit-transform: translateY(100%);
      transform: translateY(50%);
      transform: translateY(-100%);
      left: 284px; }
      @media (max-width: 768px) {
        body#faq .tabs .tab.-active .arrow {
          position: relative;
          left: 50%;
          top: 15px;
          width: 0;
          height: 0;
          border-top: solid 10px #cf102b;
          border-bottom: solid 10px transparent;
          border-left: solid 10px transparent;
          border-right: solid 10px transparent;
          -ms-transform: translateX(-50%);
          -webkit-transform: translateX(-50%);
          transform: translateX(-50%); } }
    body#faq .tabs .tab.-active:hover {
      color: white;
      background-color: #cf102b; }

body#faq .accordions *[data-reveal],
body#faq .accordions .toggle {
  cursor: pointer;
  position: relative;
  padding: 0 1rem;
  background-color: #ffffff;
  background-color: white;
  border-width: 1px 1px 1px 2px;
  border-style: solid;
  border-color: #e1e1e1;
  color: #cf102b; }
  body#faq .accordions *[data-reveal].-active, body#faq .accordions *[data-reveal]:hover,
  body#faq .accordions .toggle.-active,
  body#faq .accordions .toggle:hover {
    border-left-color: #cf102b;
    color: black; }
  body#faq .accordions *[data-reveal] img,
  body#faq .accordions *[data-reveal] svg,
  body#faq .accordions .toggle img,
  body#faq .accordions .toggle svg {
    width: 16px;
    margin: 1rem; }
  body#faq .accordions *[data-reveal] .on,
  body#faq .accordions .toggle .on {
    display: none; }
  body#faq .accordions *[data-reveal].-active .on,
  body#faq .accordions .toggle.-active .on {
    display: block; }
  body#faq .accordions *[data-reveal].-active .off,
  body#faq .accordions .toggle.-active .off {
    display: none; }

body#faq .accordions .pane {
  background-color: white;
  max-height: 0;
  transition: all cubic-bezier(0.1, 0.59, 0.92, 0.68) 0.08s;
  overflow: hidden;
  border-width: 0 1px 1px 2px;
  border-style: solid;
  border-color: #e1e1e1;
  margin-bottom: .75rem; }
  body#faq .accordions .pane.-active {
    overflow: auto;
    color: #626c76;
    max-height: 100%;
    padding: 1rem; }

@media (min-width: 768px) {
  body#faq .tabs-dropdown {
    display: none; } }

@media (max-width: 767px) {
  body#faq .categories,
  body#faq .faqs {
    padding: 1rem; }
  body#faq .tabs .tab {
    display: none; }
    .always-show-tabs body#faq .tabs .tab {
      display: block;
      text-align: center;
      border: solid 1px #cecbc5 !important; }
      .always-show-tabs body#faq .tabs .tab img {
        display: block;
        width: 100%; }
    body#faq .tabs .tab.-active {
      display: block; }
  body#faq .tabs-dropdown {
    text-align: center;
    height: 0;
    transform: scaleY(0);
    transform-origin: top;
    opacity: 0;
    transition: all ease-in .2s;
    overflow: hidden; }
    body#faq .tabs-dropdown.-show {
      padding-top: 0;
      height: auto;
      opacity: 1;
      transform: none; }
      body#faq .tabs-dropdown.-show .tab {
        display: block;
        color: #626c76;
        background: white;
        border: none;
        box-shadow: none;
        font-weight: bold; }
    body#faq .tabs-dropdown .tab {
      color: #626c76;
      background-color: white; }
      body#faq .tabs-dropdown .tab:last-child:after {
        display: none; }
      body#faq .tabs-dropdown .tab.-active {
        display: none; }
        body#faq .tabs-dropdown .tab.-active:after {
          display: none; } }

.-bg-custom-001 {
  position: relative;
  padding: 1rem 0; }
  .-bg-custom-001::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: -200%;
    right: -200%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: -1; }

#error .errors {
  position: relative;
  background-size: cover;
  background-position: center; }
  @media (max-width: 512px) {
    #error .errors {
      height: 100%; }
      #error .errors::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(255, 255, 255, 0.4); }
      #error .errors .pos {
        padding: 1rem;
        position: relative;
        top: 0; } }
  @media (min-width: 513px) {
    #error .errors {
      height: 80%; } }

body#all-b .flex {
  position: relative; }

body#all-b button, body#all-b .button {
  margin: 0 auto;
  text-align: center; }

body#all-b .-disabled {
  opacity: 0.35; }

body#all-b .linear-nav {
  list-style: none;
  margin: 0 auto;
  padding: 0; }
  body#all-b .linear-nav li {
    display: inline-block;
    list-style: none;
    margin: 0;
    padding: 6px; }
    body#all-b .linear-nav li a.-active {
      color: #cf102b; }

body#all-b .grid > div {
  margin: auto; }

body#category-a .flex {
  position: relative; }

body#category-a button, body#category-a .button {
  margin: 0 auto;
  text-align: center; }

body#category-a .-disabled {
  opacity: 0.35; }

body#category-a .linear-nav {
  list-style: none;
  margin: 0 auto;
  padding: 0; }
  body#category-a .linear-nav li {
    display: inline-block;
    list-style: none;
    margin: 0;
    padding: 6px; }
    body#category-a .linear-nav li a.-active {
      color: #cf102b; }

body#category-a .title {
  position: relative;
  z-index: 1; }

body#subcategory-a .list {
  margin-bottom: 2rem; }

body#subcategory-a button, body#subcategory-a .button {
  margin: 0;
  text-align: center; }

body#subcategory-a .-disabled {
  opacity: 0.35; }

body#subcategory-a .tab {
  margin: 0; }

body#subcategory-a .accordion img {
  float: right; }

body#subcategory-a .swatches {
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 14px;
  height: 40px; }

body#subcategory-a .grid.-pad > * {
  padding: .5rem; }

body#subcategory-a .grid > div > div:first-child {
  position: relative; }
  body#subcategory-a .grid > div > div:first-child > a {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0; }

body#subcategory-a form {
  max-width: 300px; }
  body#subcategory-a form .accordion span {
    display: block;
    background: #f9f9f9;
    padding: 0.5rem;
    margin-bottom: 0.5rem;
    margin-top: 0.5rem; }

body#subcategory-a .pagination {
  margin-top: 2rem;
  float: right;
  width: auto; }

body#subcategory-a .circles {
  margin: 0 1rem; }
  body#subcategory-a .circles > a {
    padding: 0;
    border-radius: 50%;
    border: 2px solid #626c76;
    width: 24px;
    height: 24px;
    cursor: pointer;
    display: inline-block; }
    body#subcategory-a .circles > a::nth-child(n+1) {
      margin-left: 1rem; }
    body#subcategory-a .circles > a:hover {
      background-color: #eee; }
    body#subcategory-a .circles > a.-active, body#subcategory-a .circles > a:focus {
      background-color: #626c76; }

body#subcategory-a .overlay {
  position: absolute;
  right: 0;
  top: 0;
  width: 60px; }

body#subcategory-a #modal-filter {
  padding-bottom: 50px; }

body#subcategory-a input {
  margin: .5rem; }

body#subcategory-a #modal-sort {
  padding-bottom: 50px; }
  body#subcategory-a #modal-sort .radio {
    margin: 0; }

body#subcategory-a #product-list > div {
  position: relative; }

body#subcategory-a #product-list .title-sub {
  margin: .5rem 0; }

body#subcategory-a #product-list p {
  margin: .5rem 0; }

@media (max-width: 767px) {
  body#subcategory-a flex.-xs-stack, body#subcategory-a flex.-s-stack {
    display: block;
    flex: none; }
  body#subcategory-a .list {
    margin-right: 0.25rem;
    margin-left: 0.25rem; } }

@media (max-width: 512px) {
  body#subcategory-a .grid.-pad > * {
    padding: .25rem; } }

#product-e {
  /*.flex {
		position: relative;
	}*/ }
  #product-e .-pad {
    padding: 1rem; }
  #product-e .-pad-2 {
    padding: 2rem; }
  #product-e .-pad-4 {
    padding-right: 4rem;
    padding-left: 4rem; }
  #product-e ._product {
    padding-bottom: 3rem; }
  #product-e .info p {
    margin: 0; }
  #product-e .info .title {
    margin: 0; }
  #product-e .info .title-sub {
    font-size: 1.25rem;
    margin: 0;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden; }
  #product-e .info button,
  #product-e .info .button {
    width: 100%;
    text-align: center;
    margin: 0;
    padding-top: 13px;
    padding-bottom: 13px; }
    #product-e .info button.-small,
    #product-e .info .button.-small {
      padding: 6px;
      font-size: 0.8rem; }
    #product-e .info button.-active,
    #product-e .info .button.-active {
      background-color: #cf102b;
      color: #fff; }
  #product-e .colors {
    color: #404040;
    max-width: 536px;
    margin: auto;
    text-align: center; }
    #product-e .colors img {
      display: block;
      margin: auto; }
    #product-e .colors svg {
      width: 100%;
      color: #cf102b; }
  #product-e .accessories img, #product-e .accessories svg {
    max-width: 145px;
    max-height: 145px; }
  #product-e .shortcuts.-pad > div:nth-child(n+3) {
    padding-top: 0; }
  #product-e .shortcuts.-pad > div:nth-child(2n+1) {
    padding-right: 0.5rem; }
  #product-e .shortcuts.-pad > div:nth-child(2n) {
    padding-left: 0.5rem; }
  #product-e .shortcuts img {
    width: 44px; }
  #product-e .shortcuts-b button {
    margin: 0.25rem 0; }
  #product-e .buttons button + button {
    margin-top: 1rem; }
  #product-e .overlay {
    position: absolute;
    right: 0;
    top: 0;
    width: 100px; }
  #product-e .-was {
    color: #a9a9a9;
    font-weight: normal; }
  #product-e .-was-b {
    font-weight: normal; }
  #product-e .-was,
  #product-e .-was-b,
  #product-e .-now {
    font-weight: bold;
    text-align: center; }
    #product-e .-was span,
    #product-e .-was-b span,
    #product-e .-now span {
      font-size: 0.75rem;
      font-weight: normal; }
  #product-e .-fg-promo {
    font-size: 0.75rem;
    font-weight: bold;
    color: #cf102b; }
  #product-e .callout {
    min-height: 300px; }
    #product-e .callout .header {
      font-size: 2rem; }
    #product-e .callout.-no-min {
      min-height: 0; }
  #product-e > .-on-page {
    max-width: 60rem;
    margin: auto;
    padding: 2rem; }
    #product-e > .-on-page .close {
      display: none; }
  #product-e .colors img {
    border-radius: 50%;
    overflow: hidden; }
  #product-e .colors ._swatch {
    border: 3px solid white; }
    #product-e .colors ._swatch:hover, #product-e .colors ._swatch.-active {
      border: 3px solid #cf102b;
      border-radius: 50%; }
  #product-e .colors .flex {
    justify-content: center; }
    #product-e .colors .flex > div {
      flex-basis: 44px;
      flex-grow: 0;
      flex-shrink: 0;
      padding: 0.25rem; }
  #product-e .colors .toggle {
    position: relative;
    background: #fff;
    transition: all linear 0.255s; }
    #product-e .colors .toggle img, #product-e .colors .toggle svg {
      padding: 10px;
      box-sizing: border-box;
      width: 100%;
      transform: rotate(-135deg);
      transition: all linear 0.195s;
      border-radius: 50%;
      border: 2px solid #ccc; }
    #product-e .colors .toggle.-active img, #product-e .colors .toggle.-active svg {
      transform: none; }
  #product-e .colors .count {
    position: absolute;
    top: -2px;
    right: -2px;
    width: 1.3rem;
    height: 1.3rem;
    border-radius: 50%;
    background: #cf102b;
    color: #fff;
    font-size: 0.8rem;
    font-weight: bold;
    line-height: 1.3rem; }
  #product-e .swatch-drawer {
    transform-origin: top right;
    transform: scale(0);
    transition: all linear 0.255s;
    opacity: 0;
    height: 0; }
    #product-e .swatch-drawer.-active {
      transform: scale(1);
      opacity: 1;
      height: auto; }
  @media (max-width: 512px) {
    #product-e > .-on-page {
      display: none; }
    #product-e ._product {
      padding-bottom: .75rem; } }
  @media (max-width: 767px) {
    #product-e .info {
      padding-bottom: 0; }
      #product-e .info > div {
        padding: 0; }
    #product-e .colors img, #product-e .colors svg {
      width: 44px;
      height: 44px; } }
  @media (max-width: 768px) {
    #product-e .swatch-drawer {
      display: block; }
      #product-e .swatch-drawer > div {
        display: inline-block; } }
  @media (min-width: 768px) {
    #product-e .m-columns {
      font-size: 0; }
      #product-e .m-columns > div {
        width: 55%;
        padding-right: 20px;
        display: inline-block;
        box-sizing: border-box;
        vertical-align: text-top; }
        #product-e .m-columns > div:nth-child(2) {
          width: 45%; }
      #product-e .m-columns .pagination {
        margin: 2rem 0; }
        #product-e .m-columns .pagination > div {
          border: 3px solid white;
          border-right-color: white; }
          #product-e .m-columns .pagination > div:last-child {
            border-right-color: white; }
          #product-e .m-columns .pagination > div:hover, #product-e .m-columns .pagination > div.-active {
            border: 3px solid #cf102b; } }
  @media (min-width: 1025px) {
    #product-e .m-columns {
      font-size: 0; }
      #product-e .m-columns > div {
        width: 600px;
        padding-right: 20px;
        display: inline-block;
        box-sizing: border-box;
        vertical-align: text-top; }
        #product-e .m-columns > div:nth-child(2) {
          width: calc(100% - 600px); } }

@media (min-width: 768px) {
  .flex.-m-stack {
    display: block; }
    .flex.-m-stack > div, .flex.-m-stack > a, .flex.-m-stack > button {
      width: 100%;
      margin: 1rem auto !important; } }

#interstitial-a .select > span {
  margin-top: 0; }

#interstitial-a .select img {
  vertical-align: middle;
  width: 22px; }

#interstitial-a .accessories {
  margin: 0 6rem 2rem 6rem; }
  #interstitial-a .accessories .title-sub {
    font-size: 1rem;
    padding: 0 6px; }
  @media (max-width: 767px) {
    #interstitial-a .accessories {
      margin: 1rem; }
      #interstitial-a .accessories > div:nth-of-type(n+4) {
        display: none; } }

#interstitial-a .buttons {
  text-align: center; }

body#cart-a .select > span {
  margin-top: 0; }

body#cart-a .select img {
  vertical-align: middle;
  width: 22px; }

body#cart-a .accessories {
  text-align: center; }
  body#cart-a .accessories .title-sub {
    padding: 0 6px; }

body#cart-a .buttons {
  text-align: center; }

body#cart-a .bookmark {
  background-color: #fff;
  z-index: 2;
  position: relative; }

body#cart-a .remove {
  position: absolute;
  top: 0;
  right: 0;
  padding: 10px;
  display: block; }

body#checkout-b .boxlink {
  margin: 1rem auto;
  text-align: left;
  clear: both;
  text-decoration: none;
  padding-right: 4rem;
  position: relative; }
  body#checkout-b .boxlink img {
    vertical-align: middle;
    margin-right: 1rem; }
  body#checkout-b .boxlink .arrow {
    position: absolute;
    top: 50%;
    right: 0;
    width: 1.25rem;
    transform: translateY(-50%); }

body#checkout-b table td {
  vertical-align: middle; }

body#checkout-b #details td + td {
  text-align: left; }

body#checkout-b #details > div .-pad-1 {
  padding: .5rem; }

body#checkout-b #modals a,
body#checkout-b .button {
  text-decoration: none; }

body#checkout-b .step {
  font-size: 3rem;
  opacity: 0.4;
  font-weight: bold;
  padding-right: 1rem; }

@media (min-width: 768px) {
  body#checkout-b #details {
    width: 320px; } }

body#friends-family .-bg {
  height: 450px; }

body#friends-family .-wrap-400 {
  margin-top: 0; }

body#friends-family .number {
  padding-right: 1rem; }

body#friends-family .questions {
  padding-bottom: 6rem; }
  body#friends-family .questions p {
    margin: 0; }

body#friends-family .-wrap-1400 {
  max-width: 1400px;
  margin: auto;
  padding: 0 0 2rem 0; }
  body#friends-family .-wrap-1400 .details {
    padding-right: 3rem; }

@media (max-width: 767px) {
  body#friends-family .-bg {
    height: 300px; } }

.recall-card {
  margin-bottom: 1rem; }

.-pad-1 {
  padding: 1rem; }

.-pad-2 {
  padding: 2rem; }