/*------------------------------------*\
    BASE (imports)
\*------------------------------------*/
/*------------------------------------*\
    Fonts Styles Reader
\*------------------------------------*/
@font-face {
  font-family: 'PlayfairDisplayBlack';
  src: url("../../../shared/fonts/playfair-display/playfair-display-black/PlayfairDisplay-Black.eot?#iefix") format("embedded-opentype"), url("../../../shared/fonts/playfair-display/playfair-display-black/PlayfairDisplay-Black.woff") format("woff"), url("../../../shared/fonts/playfair-display/playfair-display-black/PlayfairDisplay-Black.woff2") format("woff2"), url("../../../shared/fonts/playfair-display/playfair-display-black/PlayfairDisplay-Black.ttf") format("truetype"), url("../../../shared/fonts/playfair-display/playfair-display-black/PlayfairDisplay-Black.svg#PlayfairDisplay-Black") format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: "Reader Regular";
  src: url("../../../shared/fonts/reader-regular.eot?1400260016");
  src: url("../../../shared/fonts/reader-regular.eot?&1400260016#iefix") format("embedded-opentype"), url("../../../shared/fonts/reader-regular.woff?1400260016") format("woff"), url("../../../shared/fonts/reader-regular.ttf?1400260016") format("truetype"), url("../../../shared/fonts/reader-regular.svg?1400260016") format("svg"); }

@font-face {
  font-family: "Reader Bold";
  src: url("../../../shared/fonts/reader-bold.eot?1400260016");
  src: url("../../../shared/fonts/reader-bold.eot?&1400260016#iefix") format("embedded-opentype"), url("../../../shared/fonts/reader-bold.woff?1400260016") format("woff"), url("../../../shared/fonts/reader-bold.ttf?1400260016") format("truetype"), url("../../../shared/fonts/reader-bold.svg?1400260016") format("svg"); }

@font-face {
  font-family: "Reader Medium";
  src: url("../../../shared/fonts/reader-medium.eot?1400260016");
  src: url("../../../shared/fonts/reader-medium.eot?&1400260016#iefix") format("embedded-opentype"), url("../../../shared/fonts/reader-medium.woff?1400260016") format("woff"), url("../../../shared/fonts/reader-medium.ttf?1400260016") format("truetype"), url("../../../shared/fonts/reader-medium.svg?1400260016") format("svg"); }

@font-face {
  font-family: "Reader Regular Italic";
  src: url("../../../shared/fonts/reader-regular-italic.eot?1400260016");
  src: url("../../../shared/fonts/reader-regular-italic.eot?&1400260016#iefix") format("embedded-opentype"), url("../../../shared/fonts/reader-regular-italic.woff?1400260016") format("woff"), url("../../../shared/fonts/reader-regular-italic.ttf?1400260016") format("truetype"), url("../../../shared/fonts/reader-regular-italic.svg?1400260016") format("svg"); }

@font-face {
  font-family: "Reader Bold Italic";
  src: url("../../../shared/fonts/reader-bold-italic.eot?1400260016");
  src: url("../../../shared/fonts/reader-bold-italic.eot?&1400260016#iefix") format("embedded-opentype"), url("../../../shared/fonts/reader-bold-italic.woff?1400260016") format("woff"), url("../../../shared/fonts/reader-bold-italic.ttf?1400260016") format("truetype"), url("../../../shared/fonts/reader-bold-italic.svg?1400260016") format("svg"); }

@font-face {
  font-family: "Reader Medium Italic";
  src: url("../../../shared/fonts/reader-medium-italic.eot?1400260016");
  src: url("../../../shared/fonts/reader-medium-italic.eot?&1400260016#iefix") format("embedded-opentype"), url("../../../shared/fonts/reader-medium-italic.woff?1400260016") format("woff"), url("../../../shared/fonts/reader-medium-italic.ttf?1400260016") format("truetype"), url("../../../shared/fonts/reader-medium-italic.svg?1400260016") format("svg"); }

/*------------------------------------*\
    UTILITIES
\*------------------------------------*/
/*------------------------------------*\
    VARIABLES
\*------------------------------------*/
/* ----- Paths ----- */
/* ----- Colors ----- */
/* ----- Typography ----- */
/* ----- Responsive & Grid ----- */
/* ----- Layering ----- */
/* Animation delays */
/*3.2s;*/
/*------------------------------------*\
    MIXINS
\*------------------------------------*/
/* ----- Responsive ----- */
/*
 * Keyframe cycle
 */
/*
 * animation cycle
 */
/* ----- Fonts ----- */
/* ----- Misc ----- */
/*---------- Button -----------*/
/*------------------------------------*\
    TYPOGRAPHY
\*------------------------------------*/
/* ----- Interstitial component styles ----- */
/*------------------------------------*\
    UTILITIES
\*------------------------------------*/
/*------------------------------------*\
    VARIABLES
\*------------------------------------*/
/* ----- Paths ----- */
/* ----- Colors ----- */
/* ----- Typography ----- */
/* ----- Responsive & Grid ----- */
/* ----- Layering ----- */
/* Animation delays */
/*3.2s;*/
/*------------------------------------*\
    MIXINS
\*------------------------------------*/
/* ----- Responsive ----- */
/*
 * Keyframe cycle
 */
/*
 * animation cycle
 */
/* ----- Fonts ----- */
/* ----- Misc ----- */
/*---------- Button -----------*/
/*------------------------------------*\
    TYPOGRAPHY
\*------------------------------------*/
/*------------------------------------*\
    Grid Styles
\*------------------------------------*/
.grid {
  margin: 20px 0;
  padding: 0 20px;
  min-height: 40px;
  width: 100%; }
  form .grid {
    padding-left: 0;
    padding-right: 0;
    margin-top: 0 !important;
    margin-bottom: 0 !important; }
  @media (min-width: 640px) {
    .grid {
      max-width: 620px;
      margin: 20px auto; }
      .grid .grid {
        margin: 10px auto; } }
  @media (min-width: 1024px) {
    .grid {
      max-width: 940px;
      padding: 0; } }
  .grid__items {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column; }
    @media (min-width: 640px) {
      .grid__items {
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
            -ms-flex-wrap: wrap;
                flex-wrap: wrap;
        -webkit-flex-direction: row;
            -ms-flex-direction: row;
                flex-direction: row;
        -webkit-align-items: stretch;
            -ms-flex-align: stretch;
                align-items: stretch;
        -webkit-justify-content: space-between;
            -ms-flex-pack: justify;
                justify-content: space-between;
        margin: 0; } }
  .grid__item {
    padding: 0;
    margin: 20px 0;
    box-sizing: content-box;
    width: 100%; }
    @media (min-width: 640px) {
      .grid__item {
        -webkit-flex: 1 1 48.5%;
            -ms-flex: 1 1 48.5%;
                flex: 1 1 48.5%;
        max-width: 48.5%;
        margin: 10px 0; } }
    @media (min-width: 1024px) {
      .grid__item {
        -webkit-flex: 1 1 33.33%;
            -ms-flex: 1 1 33.33%;
                flex: 1 1 33.33%;
        max-width: 300px; }
        .grid__item .grid__item {
          max-width: 32%; } }
    form .grid__item {
      margin-top: 0 !important;
      margin-bottom: 0 !important; }
    .grid__item > .text > :first-child span {
      margin-top: 0 !important;
      padding-top: 0 !important; }
    .grid__item img {
      max-width: 100%;
      line-height: 0;
      margin: 0; }
    @media (min-width: 640px) {
      .grid__item.grid__item--2-of-3 {
        -webkit-flex: 1 1 48.5%;
            -ms-flex: 1 1 48.5%;
                flex: 1 1 48.5%;
        max-width: 48.5%; } }
    @media (min-width: 1024px) {
      .grid__item.grid__item--2-of-3 {
        -webkit-flex: 2 2 66.6%;
            -ms-flex: 2 2 66.6%;
                flex: 2 2 66.6%;
        max-width: 620px; }
        .grid__item .grid__item.grid__item--2-of-3 {
          max-width: 64%; } }
    @media (min-width: 640px) {
      .grid__item.grid__item--3-of-3 {
        -webkit-flex: 3 3 100%;
            -ms-flex: 3 3 100%;
                flex: 3 3 100%;
        max-width: 940px; }
        .grid__item .grid__item.grid__item--3-of-3 {
          max-width: 100%; } }
    @media (min-width: 1024px) {
      .grid__item.grid__item--1-of-2 {
        -webkit-flex: 1 1 48.5%;
            -ms-flex: 1 1 48.5%;
                flex: 1 1 48.5%;
        max-width: 48.5%; }
        .grid__item .grid__item.grid__item--1-of-2 {
          -webkit-flex: 1 1 49%;
              -ms-flex: 1 1 49%;
                  flex: 1 1 49%;
          max-width: 49%; } }
    @media (min-width: 1024px) {
      .grid__item.grid__item--1-of-4 {
        -webkit-flex: 1 1 25%;
            -ms-flex: 1 1 25%;
                flex: 1 1 25%;
        max-width: 25%; } }
    @media (max-width: 767px) {
      .grid__item.grid__item--hide-sm {
        display: none; } }
    @media (min-width: 768px) {
      .grid__item.grid__item--hide-lg {
        display: none; } }
    @media (max-width: 767px) {
      .grid__item--order-sm1 {
        -webkit-order: 1;
            -ms-flex-order: 1;
                order: 1; } }
    @media (min-width: 768px) {
      .grid__item--order-lg1 {
        -webkit-order: 1;
            -ms-flex-order: 1;
                order: 1; } }
    @media (max-width: 767px) {
      .grid__item--order-sm2 {
        -webkit-order: 2;
            -ms-flex-order: 2;
                order: 2; } }
    @media (min-width: 768px) {
      .grid__item--order-lg2 {
        -webkit-order: 2;
            -ms-flex-order: 2;
                order: 2; } }
    @media (max-width: 767px) {
      .grid__item--order-sm3 {
        -webkit-order: 3;
            -ms-flex-order: 3;
                order: 3; } }
    @media (min-width: 768px) {
      .grid__item--order-lg3 {
        -webkit-order: 3;
            -ms-flex-order: 3;
                order: 3; } }
    @media (max-width: 767px) {
      .grid__item--order-sm4 {
        -webkit-order: 4;
            -ms-flex-order: 4;
                order: 4; } }
    @media (min-width: 768px) {
      .grid__item--order-lg4 {
        -webkit-order: 4;
            -ms-flex-order: 4;
                order: 4; } }
    @media (max-width: 767px) {
      .grid__item--order-sm5 {
        -webkit-order: 5;
            -ms-flex-order: 5;
                order: 5; } }
    @media (min-width: 768px) {
      .grid__item--order-lg5 {
        -webkit-order: 5;
            -ms-flex-order: 5;
                order: 5; } }
    @media (max-width: 767px) {
      .grid__item--order-sm6 {
        -webkit-order: 6;
            -ms-flex-order: 6;
                order: 6; } }
    @media (min-width: 768px) {
      .grid__item--order-lg6 {
        -webkit-order: 6;
            -ms-flex-order: 6;
                order: 6; } }
    @media (max-width: 767px) {
      .grid__item--order-sm7 {
        -webkit-order: 7;
            -ms-flex-order: 7;
                order: 7; } }
    @media (min-width: 768px) {
      .grid__item--order-lg7 {
        -webkit-order: 7;
            -ms-flex-order: 7;
                order: 7; } }
    @media (max-width: 767px) {
      .grid__item--order-sm8 {
        -webkit-order: 8;
            -ms-flex-order: 8;
                order: 8; } }
    @media (min-width: 768px) {
      .grid__item--order-lg8 {
        -webkit-order: 8;
            -ms-flex-order: 8;
                order: 8; } }
    @media (max-width: 767px) {
      .grid__item--order-sm9 {
        -webkit-order: 9;
            -ms-flex-order: 9;
                order: 9; } }
    @media (min-width: 768px) {
      .grid__item--order-lg9 {
        -webkit-order: 9;
            -ms-flex-order: 9;
                order: 9; } }
    @media (max-width: 767px) {
      .grid__item--order-sm10 {
        -webkit-order: 10;
            -ms-flex-order: 10;
                order: 10; } }
    @media (min-width: 768px) {
      .grid__item--order-lg10 {
        -webkit-order: 10;
            -ms-flex-order: 10;
                order: 10; } }
    @media (max-width: 767px) {
      .grid__item--order-sm11 {
        -webkit-order: 11;
            -ms-flex-order: 11;
                order: 11; } }
    @media (min-width: 768px) {
      .grid__item--order-lg11 {
        -webkit-order: 11;
            -ms-flex-order: 11;
                order: 11; } }
    @media (max-width: 767px) {
      .grid__item--order-sm12 {
        -webkit-order: 12;
            -ms-flex-order: 12;
                order: 12; } }
    @media (min-width: 768px) {
      .grid__item--order-lg12 {
        -webkit-order: 12;
            -ms-flex-order: 12;
                order: 12; } }
    @media (max-width: 767px) {
      .grid__item--order-sm13 {
        -webkit-order: 13;
            -ms-flex-order: 13;
                order: 13; } }
    @media (min-width: 768px) {
      .grid__item--order-lg13 {
        -webkit-order: 13;
            -ms-flex-order: 13;
                order: 13; } }
    @media (max-width: 767px) {
      .grid__item--order-sm14 {
        -webkit-order: 14;
            -ms-flex-order: 14;
                order: 14; } }
    @media (min-width: 768px) {
      .grid__item--order-lg14 {
        -webkit-order: 14;
            -ms-flex-order: 14;
                order: 14; } }
    @media (max-width: 767px) {
      .grid__item--order-sm15 {
        -webkit-order: 15;
            -ms-flex-order: 15;
                order: 15; } }
    @media (min-width: 768px) {
      .grid__item--order-lg15 {
        -webkit-order: 15;
            -ms-flex-order: 15;
                order: 15; } }
    @media (max-width: 767px) {
      .grid__item--order-sm16 {
        -webkit-order: 16;
            -ms-flex-order: 16;
                order: 16; } }
    @media (min-width: 768px) {
      .grid__item--order-lg16 {
        -webkit-order: 16;
            -ms-flex-order: 16;
                order: 16; } }
    @media (max-width: 767px) {
      .grid__item--order-sm17 {
        -webkit-order: 17;
            -ms-flex-order: 17;
                order: 17; } }
    @media (min-width: 768px) {
      .grid__item--order-lg17 {
        -webkit-order: 17;
            -ms-flex-order: 17;
                order: 17; } }
    @media (max-width: 767px) {
      .grid__item--order-sm18 {
        -webkit-order: 18;
            -ms-flex-order: 18;
                order: 18; } }
    @media (min-width: 768px) {
      .grid__item--order-lg18 {
        -webkit-order: 18;
            -ms-flex-order: 18;
                order: 18; } }
    @media (max-width: 767px) {
      .grid__item--order-sm19 {
        -webkit-order: 19;
            -ms-flex-order: 19;
                order: 19; } }
    @media (min-width: 768px) {
      .grid__item--order-lg19 {
        -webkit-order: 19;
            -ms-flex-order: 19;
                order: 19; } }
    @media (max-width: 767px) {
      .grid__item--order-sm20 {
        -webkit-order: 20;
            -ms-flex-order: 20;
                order: 20; } }
    @media (min-width: 768px) {
      .grid__item--order-lg20 {
        -webkit-order: 20;
            -ms-flex-order: 20;
                order: 20; } }
    @media (max-width: 767px) {
      .grid__item--hide-sm {
        display: none; } }
    @media (min-width: 768px) {
      .grid__item--hide-lg {
        display: none; } }
  .grid--no-space {
    margin: 0 auto; }
    .grid--no-space .grid__item {
      max-width: none !important;
      margin: 0;
      position: relative; }
      @media (min-width: 640px) {
        .grid--no-space .grid__item {
          border-top: none; } }
  .grid--one-col .grid__item {
    max-width: 700px !important;
    margin: 0 auto; }
  @media (min-width: 640px) and (max-width: 1023px) {
    .grid--two-col .grid__item {
      -webkit-flex: 1 1 100%;
          -ms-flex: 1 1 100%;
              flex: 1 1 100%;
      max-width: 100%;
      margin: 10px 0; } }
  @media (min-width: 640px) and (max-width: 1023px) {
    .grid--two-col .grid__item.grid__item--2-of-3 {
      -webkit-flex: 1 1 100%;
          -ms-flex: 1 1 100%;
              flex: 1 1 100%;
      max-width: 100%; } }

.seperator {
  background-color: #f9c606;
  content: "";
  display: block;
  height: 5px;
  margin: 22px auto 0;
  width: 30px; }
  @media (min-width: 768px) {
    .seperator {
      margin: 45px auto 0; } }

/* author - rajkishore */
.js-tooltip {
  display: inline-block;
  position: relative;
  border-bottom: 3px dashed red; }
  .js-tooltip__pointer {
    position: absolute;
    top: 100%;
    left: 50%;
    margin-top: 6px;
    border-top: none;
    border-left: 16px solid transparent;
    border-right: 16px solid transparent;
    border-bottom: 14px solid #fff;
    -webkit-transform: translate(-50%, 0px);
            transform: translate(-50%, 0px);
    z-index: 9999; }
  .js-tooltip__modal {
    margin-top: 15px; }

/* Skip Navigation Link css*/
a.skip-main {
  left: -999px;
  position: absolute;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
  z-index: -999; }

a.skip-main:focus, a.skip-main:active {
  color: #fff;
  background: #000;
  left: auto;
  top: auto;
  width: 30%;
  height: auto;
  overflow: auto;
  margin: 10px 35%;
  padding: 5px;
  text-align: center;
  z-index: 999; }

/*------------------------------------*\
    Buttons Styles
\*------------------------------------*/
button:focus {
  outline: thin dotted #333333 !important;
  outline: 5px auto -webkit-focus-ring-color !important;
  outline-offset: -2px; }

/*------------------------------------*\
    Forms & Buttons
\*------------------------------------*/

/* ----- Responsive image component styles ----- */
/*------------------------------------*\
    UTILITIES
\*------------------------------------*/
/*------------------------------------*\
    VARIABLES
\*------------------------------------*/
/* ----- Paths ----- */
/* ----- Colors ----- */
/* ----- Typography ----- */
/* ----- Responsive & Grid ----- */
/* ----- Layering ----- */
/* Animation delays */
/*3.2s;*/
/*------------------------------------*\
    MIXINS
\*------------------------------------*/
/* ----- Responsive ----- */
/*
 * Keyframe cycle
 */
/*
 * animation cycle
 */
/* ----- Fonts ----- */
/* ----- Misc ----- */
/*---------- Button -----------*/
/*------------------------------------*\
    TYPOGRAPHY
\*------------------------------------*/
.flavor-attribute {
  -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  max-width: 352px;
  width: 98%;
  position: relative;
  background-color: #fff;
  padding: 45px 20px 20px;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 16px auto;
  z-index: 99;
  box-shadow: 34.103px 7.873px 59.4px 6.6px rgba(0, 0, 0, 0.2);
  left: 0;
  position: absolute;
  right: 0;
  /*Tool Tip Modal CSS*/
  /*close button*/ }
  @media only screen and (min-width: 760px) {
    .flavor-attribute {
      padding: 31px 20px; } }
  @media (min-width: 768px) {
    .flavor-attribute {
      max-width: 1052px;
      width: 99%;
      -webkit-flex-direction: row;
          -ms-flex-direction: row;
              flex-direction: row;
      padding: 31px 35px;
      -webkit-justify-content: initial;
          -ms-flex-pack: initial;
              justify-content: initial; } }
  @media only screen and (min-width: 760px) {
    .flavor-attribute .close {
      top: 21px !important;
      right: 21px !important; } }
  .flavor-attribute__image {
    text-align: center; }
    .flavor-attribute__image img {
      width: 313px; }
      @media (min-width: 768px) {
        .flavor-attribute__image img {
          width: 491px; } }
  .flavor-attribute__content {
    padding: 20px 20px 0; }
    .flavor-attribute__content--inner .seperator {
      margin-top: 31px !important;
      margin-bottom: 30px; }
      @media (min-width: 768px) {
        .flavor-attribute__content--inner .seperator {
          margin-left: 0; } }
    @media (min-width: 768px) {
      .flavor-attribute__content {
        padding: 0 20px 20px 80px;
        margin-left: 0; }
        .flavor-attribute__content--inner {
          max-width: 280px; }
          .flavor-attribute__content--inner .seperator {
            margin-top: 32px !important;
            margin-bottom: 37px !important; } }
  .flavor-attribute__description {
    color: #333;
    font-size: 16px;
    margin: 0;
    padding: 0;
    text-align: center;
    line-height: 22px;
    letter-spacing: 0.025em; }
    @media (min-width: 768px) {
      .flavor-attribute__description {
        text-align: left; } }
  .flavor-attribute__name-block {
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-bottom: 20px; }
    @media (min-width: 768px) {
      .flavor-attribute__name-block {
        -webkit-justify-content: inherit;
            -ms-flex-pack: inherit;
                justify-content: inherit;
        margin-bottom: 40px; } }
    .flavor-attribute__name-block img {
      width: 30px; }
  .flavor-attribute__name {
    font-family: Reader Bold;
    font-size: 14px;
    letter-spacing: 0.075em;
    padding-left: 10px;
    text-transform: uppercase; }
  .flavor-attribute__title {
    font-family: "Reader Bold";
    font-size: 27.5px;
    margin: 0;
    padding: 0;
    text-align: center;
    color: #333;
    letter-spacing: 0.025em; }
    @media (min-width: 768px) {
      .flavor-attribute__title {
        text-align: left;
        line-height: 38px;
        margin-top: 20px; } }
  .flavor-attribute__details {
    background-color: #fff;
    box-shadow: 6px 1px 45px 1px rgba(0, 0, 0, 0.2);
    display: inline-block;
    left: 0;
    margin: 10px auto !important;
    position: absolute;
    right: 0;
    z-index: 999; }

@media only screen and (max-width: 760px) {
  .flavor-attribute__content--inner .seperator {
    margin-top: 25px; } }

/*------------------------------------*\
    UTILITIES
\*------------------------------------*/
/*------------------------------------*\
    VARIABLES
\*------------------------------------*/
/* ----- Paths ----- */
/* ----- Colors ----- */
/* ----- Typography ----- */
/* ----- Responsive & Grid ----- */
/* ----- Layering ----- */
/* Animation delays */
/*3.2s;*/
/*------------------------------------*\
    MIXINS
\*------------------------------------*/
/* ----- Responsive ----- */
/*
 * Keyframe cycle
 */
/*
 * animation cycle
 */
/* ----- Fonts ----- */
/* ----- Misc ----- */
/*---------- Button -----------*/
/*------------------------------------*\
    TYPOGRAPHY
\*------------------------------------*/
.free-taste-kit {
  transition: all 0.4s ease-in-out 2.2s;
  margin-top: 0;
  opacity: 1;
  background-color: #333333;
  color: #fff;
  /*kit end*/ }
  .free-taste-kit__box {
    margin: 45px auto 0;
    padding: 21px 15px 0;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
    /*box end*/ }
    @media only screen and (min-width: 760px) {
      .free-taste-kit__box {
        margin: 0;
        padding: 90px 50px 90px 75px;
        -webkit-flex-direction: row;
            -ms-flex-direction: row;
                flex-direction: row; } }
  .free-taste-kit__privacy {
    font-family: "Reader Regular";
    font-size: 11px;
    padding: 15px 50px 0 50px; }
    .free-taste-kit__privacy a {
      color: #2a82e3;
      font-family: "Reader Bold"; }
    @media only screen and (min-width: 760px) {
      .free-taste-kit__privacy {
        padding: 15px 0 0 0; } }
  .free-taste-kit__heading {
    margin: 0 auto 60px;
    letter-spacing: 0.025em; }
    @media only screen and (min-width: 760px) {
      .free-taste-kit__heading {
        margin: 90px auto 60px;
        font-size: 56px; } }
  .free-taste-kit__content {
    max-width: 100%;
    text-align: center; }
    @media only screen and (min-width: 760px) {
      .free-taste-kit__content {
        max-width: 46%;
        text-align: left;
        padding-left: 20px; } }
  .free-taste-kit h4 {
    font-family: "Reader Regular";
    line-height: 1.1;
    font-size: 41px;
    margin-bottom: 15px;
    color: #fff;
    letter-spacing: 0.025em; }
    .free-taste-kit h4:after {
      margin: 15px auto !important; }
    @media only screen and (min-width: 760px) {
      .free-taste-kit h4 {
        margin-bottom: 20px;
        line-height: 1.1;
        font-size: 40px; }
        .free-taste-kit h4:after {
          margin: 25px 0 20px !important; } }
  .free-taste-kit .highlight {
    margin: 0 auto 17px;
    font-size: 41px;
    line-height: 48px;
    position: relative;
    top: -10px; }
    .free-taste-kit .highlight:after {
      width: 30px;
      content: "";
      height: 5px;
      background-color: #f9c606;
      display: block;
      margin: 26px auto 0 !important; }
    @media only screen and (min-width: 760px) {
      .free-taste-kit .highlight {
        margin: 0 auto 23px;
        font-size: 56px;
        line-height: 62.5px;
        padding: 0; }
        .free-taste-kit .highlight:after {
          margin: 24px 0 -2px !important; } }
  .free-taste-kit__btn {
    font-size: 14px;
    font-family: "Reader Bold"; }
    .free-taste-kit__btn:hover, .free-taste-kit__btn:focus {
      background-color: #f9c606; }
    @media only screen and (min-width: 760px) {
      .free-taste-kit__btn {
        margin: 0; } }
  .free-taste-kit__title {
    font-family: "Reader Bold";
    text-transform: uppercase;
    font-size: 14px;
    margin-bottom: 0;
    letter-spacing: 0.025em; }
    @media only screen and (min-width: 760px) {
      .free-taste-kit__title {
        font-family: "Reader Bold";
        text-transform: uppercase;
        margin-bottom: 16px; } }
  .free-taste-kit__email {
    position: relative;
    margin: 14px 0 10px;
    letter-spacing: 0.025em;
    max-width: 360px;
    margin-left: auto;
    margin-right: auto; }
    @media only screen and (min-width: 760px) {
      .free-taste-kit__email {
        margin: 0;
        max-width: 100%; } }
    .free-taste-kit__email__input {
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-direction: row;
          -ms-flex-direction: row;
              flex-direction: row; }
  .free-taste-kit__subscribed__msg {
    font-family: reader regular;
    font-size: 14px;
    margin-top: 15px; }
    .free-taste-kit__subscribed__msg a {
      color: #2a82e3; }
  .free-taste-kit__input {
    border-radius: 0;
    font-size: 16px;
    font-family: "Reader Regular";
    color: #939393; }
    @media only screen and (min-width: 760px) {
      .free-taste-kit__input {
        border-radius: 0; } }
  .free-taste-kit__btn {
    width: 49px;
    height: 45px;
    border-radius: 0;
    background-color: #f9c606;
    padding-right: 1rem;
    background-image: url("../images/right-arrow.png");
    background-repeat: no-repeat;
    background-size: 50%;
    background-position: 10px 13px;
    position: absolute;
    right: 0;
    top: 0; }
    @media only screen and (min-width: 760px) {
      .free-taste-kit__btn {
        position: relative;
        right: 1px; } }
  .free-taste-kit__error {
    font-family: "Reader Regular";
    color: #FA4000;
    font-size: 12px;
    letter-spacing: 0.025em;
    max-width: 360px;
    margin: 10px auto;
    text-align: left; }
    .free-taste-kit__error--icon {
      background: transparent url("../images/error-icon.png") no-repeat 0 0;
      width: 20px;
      height: 20px;
      display: inline-block;
      position: relative;
      top: 5px;
      padding-right: 1.5em; }
    @media only screen and (min-width: 760px) {
      .free-taste-kit__error {
        margin: 10px 0; } }
  .free-taste-kit__success {
    letter-spacing: 0.025em; }
    .free-taste-kit__success--icon {
      background: transparent url("../images/select-icon.png") no-repeat 0 0;
      width: 20px;
      height: 20px;
      display: inline-block;
      position: relative;
      top: 5px;
      padding-right: 2em; }
    .free-taste-kit__success__desc {
      font-size: 14px;
      font-family: "Reader Regular";
      text-align: center;
      margin-bottom: 32px;
      margin-top: 10px; }
      .free-taste-kit__success__desc a {
        display: block;
        color: #2a82e3 !important;
        margin-top: 20px; }
      @media only screen and (min-width: 760px) {
        .free-taste-kit__success__desc {
          margin-bottom: 25px;
          font-size: 16px;
          text-align: left;
          max-width: 71%; } }
  .free-taste-kit__desc {
    font-size: 14px;
    font-family: "Reader Regular";
    text-align: center;
    margin-bottom: 32px;
    margin-top: 20px;
    letter-spacing: 0.025em;
    padding: 0 30px; }
    .free-taste-kit__desc a {
      display: block;
      color: #2a82e3 !important;
      margin-top: 20px; }
    @media only screen and (min-width: 760px) {
      .free-taste-kit__desc {
        font-family: "Reader Regular";
        margin-bottom: 31px;
        font-size: 16px;
        line-height: 22.5px;
        text-align: left;
        padding: 0; }
        .free-taste-kit__desc a {
          display: block;
          color: #2a82e3 !important;
          margin-top: 20px; } }
  .free-taste-kit--img {
    text-align: center;
    margin: 0 -15px; }
    .free-taste-kit--img img {
      width: 100%;
      display: block; }
    @media only screen and (min-width: 760px) {
      .free-taste-kit--img {
        width: 50%;
        margin: 0;
        max-width: 526px; }
        .free-taste-kit--img img {
          max-width: 540px; } }
  @media only screen and (min-width: 760px) {
    .free-taste-kit .connector {
      width: 70%;
      height: 5px;
      border-top: 3px dashed #eee;
      margin: 0 auto;
      top: 100px;
      position: absolute;
      z-index: 0;
      display: block; } }
  .free-taste-kit input[type="text"] {
    border-radius: 0;
    font-family: "Reader Regular";
    height: 45px;
    margin: 0;
    display: inline;
    padding-right: 60px;
    float: none;
    width: 100%; }
    @media only screen and (min-width: 760px) {
      .free-taste-kit input[type="text"] {
        float: left;
        width: 300px;
        padding-right: 20px; } }
  @media only screen and (min-width: 760px) {
    .free-taste-kit .works .connector__horizontal {
      width: 70% !important; } }
  .free-taste-kit--bold {
    font-family: "Reader Bold"; }
  .free-taste-kit__input__error {
    font-family: "Reader Bold" !important;
    color: #FA4000 !important; }

/*
    on load animation
*/
body.inprogress .free-taste-kit {
  opacity: 0;
  margin-top: 0.5em !important; }

.free-taste-kit__box--bold {
  font-family: "Reader Bold";
  text-transform: uppercase; }

/* -----Landing Page styles ----- */
/*------------------------------------*\
    UTILITIES
\*------------------------------------*/
/*------------------------------------*\
    VARIABLES
\*------------------------------------*/
/* ----- Paths ----- */
/* ----- Colors ----- */
/* ----- Typography ----- */
/* ----- Responsive & Grid ----- */
/* ----- Layering ----- */
/* Animation delays */
/*3.2s;*/
/*------------------------------------*\
    MIXINS
\*------------------------------------*/
/* ----- Responsive ----- */
/*
 * Keyframe cycle
 */
/*
 * animation cycle
 */
/* ----- Fonts ----- */
/* ----- Misc ----- */
/*---------- Button -----------*/
/*------------------------------------*\
    TYPOGRAPHY
\*------------------------------------*/
.hero {
  color: #fff;
  z-index: 1;
  background: transparent;
  display: block; }
  .hero__image {
    z-index: 1;
    width: 100%; }
  .hero__content {
    max-width: 310px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: auto;
    display: inline-table;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%); }
    .hero__content sup {
      font-size: 17px;
      top: -4px;
      vertical-align: super;
      font-family: "Reader Bold"; }
      @media only screen and (min-width: 767px) {
        .hero__content sup {
          font-size: 17px;
          top: -15px; } }
  .hero__heading {
    text-align: center; }
    .hero__heading h3 {
      color: #f9c606;
      font-family: "Reader Bold";
      font-size: 14px;
      letter-spacing: 0.075em;
      text-transform: uppercase; }
    .hero__heading .hero__heading--h1 {
      font-family: "PlayfairDisplayBlack";
      font-style: normal;
      font-weight: 700;
      margin: 10px 0 25px;
      color: #fff;
      line-height: 49px;
      letter-spacing: 0.025em; }
      .hero__heading .hero__heading--h1:after {
        content: "";
        width: 30px;
        height: 5px;
        background-color: #f9c606;
        display: block;
        margin: 15px auto 0px; }
  .hero__description {
    text-align: center;
    margin-bottom: 20px;
    font-family: "Reader Regular";
    font-size: 19px;
    line-height: 27px; }
  .hero__info {
    font-family: "Reader Regular Italic";
    font-size: 12px;
    margin: 10px auto 0 auto;
    text-align: center;
    display: block; }
  .hero__quiz {
    height: 45px;
    width: 170px;
    background-color: #f9c606 !important;
    margin: 0 auto;
    display: block;
    font-size: 14px;
    font-family: "Reader Bold";
    color: #333;
    line-height: 45px;
    text-align: center;
    letter-spacing: 0.075em;
    text-transform: uppercase; }
  .hero .result-link {
    font-size: 14px;
    color: #fff !important;
    border-bottom: #f9c606 2px solid;
    margin: 0 auto;
    line-height: inherit;
    margin-top: 25px;
    font-family: "Reader Bold";
    letter-spacing: 0.075em;
    position: relative;
    left: 50%;
    -webkit-transform: translate(-50%);
            transform: translate(-50%);
    text-transform: uppercase; }
    @media only screen and (max-width: 370px) {
      .hero .result-link {
        margin-top: 20px; } }

.result-link {
  display: inline-block;
  font-size: 14px; }

.result-link.hidden {
  display: none; }

@media only screen and (min-width: 320px) and (min-width: 759px) {
  .hero__heading .hero__heading--h1 {
    font-size: 48px; } }

@media only screen and (min-width: 460px) {
  .hero__content {
    max-width: 90%;
    width: 100%; } }

@media only screen and (min-width: 760px) {
  .hero__heading .hero__heading--h1 {
    margin: 27px 0 31px;
    font-size: 60px; }
    .hero__heading .hero__heading--h1:after {
      margin: 40px auto 2px; }
  .hero__heading h3 {
    font-size: 16px; }
  .hero__description {
    font-size: 24px;
    line-height: 36px;
    margin: 0 auto 20px;
    width: 756px; }
  .hero__info {
    width: 70%;
    margin: 15px auto 0 auto;
    font-size: 16px; } }

.row.mar--b--30.cup__container {
  position: relative;
  top: -50px;
  margin-bottom: -20px !important; }

.slick-slide {
  height: auto !important; }

.slick-slide img {
  width: 100%;
  max-height: 200px; }

.slick-disabled.slick-next:before,
.slick-disabled.slick-prev:before {
  color: black !important; }

.hintsOfCups .slick-track {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding-bottom: 65px; }

.hintsOfCups__taste {
  margin-left: 15px;
  margin-right: 15px;
  box-shadow: 17px 30.622px 70px 0px rgba(0, 0, 0, 0.1);
  margin-bottom: 30px;
  -webkit-flex-grow: 1;
      -ms-flex-positive: 1;
          flex-grow: 1; }
  .hintsOfCups__taste p {
    text-align: center;
    padding: 0 25px;
    font-size: 14px;
    margin-bottom: 30px;
    line-height: 19px; }

.hintsOfCups {
  max-width: 1200px;
  /*margin-bottom: 60px;*/ }

.strike {
  display: block;
  text-align: center;
  overflow: hidden;
  white-space: nowrap;
  width: 90%;
  margin: 40px auto 35px;
  font-size: 24px;
  line-height: 24px; }

.strike.perfect__cups__hints {
  margin: 40px auto 31px; }
  @media (min-width: 768px) {
    .strike.perfect__cups__hints {
      margin-bottom: 25px; } }

.strike > span {
  position: relative;
  display: inline-block; }

.strike > span:before,
.strike > span:after {
  content: "";
  position: absolute;
  top: 49%;
  width: 9999px;
  height: 2px;
  background: #e2e2e2; }

.strike > span:before {
  right: 100%;
  margin-right: 15px; }

.strike > span:after {
  left: 100%;
  margin-left: 15px; }

.hintsOfCups__name__container {
  text-align: center;
  margin: 35px 0 20px; }
  .hintsOfCups__name__container .hintsOfCups__name__caption__img {
    width: 28px;
    display: inline-block;
    position: relative;
    top: 3px;
    left: -4px; }
  .hintsOfCups__name__container .hintsOfCups__name {
    display: inline-block;
    margin: 0;
    font-size: 19px;
    font-family: "Reader Bold";
    letter-spacing: 0.075em; }

.hintsOfCups .slick-prev {
  left: 35%;
  z-index: 100000;
  top: auto !important;
  bottom: -10px; }
  .hintsOfCups .slick-prev:before {
    color: #f9c606 !important; }

.hintsOfCups .slick-next {
  right: 35%;
  z-index: 100000;
  top: auto !important;
  bottom: -10px; }
  .hintsOfCups .slick-next:before {
    color: #f9c606 !important; }

.cups .perfect__heading {
  margin-top: 82px;
  line-height: 48px;
  letter-spacing: 0.025em; }

.cups .strike > span {
  font-family: "Reader Bold";
  letter-spacing: 0.025em; }

.perfect {
  background-color: #fff;
  border-radius: 5px; }
  .perfect__heading {
    text-align: center;
    font-size: 41px;
    font-family: "Reader Regular";
    margin: 60px auto 55px;
    max-width: 90%; }
  .perfect__cups {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
    -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
            justify-content: space-around;
    -webkit-align-items: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    width: 82%;
    margin: 0 auto;
    /* .img__container {
            width: 75px;
            height: 75px;
            border-radius: 50%;
            background-color: $web_mud;
            display: inline-flex;
            position: relative;
            img {
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                margin: auto;
                width: 50%;
            }
        }*/ }
    .perfect__cups .center {
      max-width: 81px; }
    .perfect__cups .hintsOfCups__name__caption__img {
      width: 15px;
      position: relative;
      top: 2px; }
    .perfect__cups__name {
      display: inline-block;
      margin: 17px 0 25px;
      font-size: 15px;
      font-family: "Reader Bold";
      letter-spacing: 0.075em;
      text-transform: uppercase; }

@media only screen and (min-width: 1024px) {
  .hintsOfCups .slick-track {
    -webkit-transform: translate3d(0px, 0px, 0px) !important;
            transform: translate3d(0px, 0px, 0px) !important;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100% !important;
    padding-bottom: 0; } }

@media only screen and (min-width: 760px) {
  .strike {
    font-size: 28px;
    line-height: 28px; }
  .hintsOfCups__name__container {
    margin: 40px 0 15px; }
    .hintsOfCups__name__container .hintsOfCups__name {
      font-size: 24px; }
  .hintsOfCups {
    margin-bottom: 20px; }
  .hintsOfCups__taste {
    margin-bottom: 70px; }
    .hintsOfCups__taste p {
      margin-bottom: 40px;
      font-size: 16px;
      line-height: 24px; }
  .cups .perfect__heading {
    margin-top: 130px;
    margin-bottom: 90px; }
  .perfect {
    /* &__heading {
            margin: 90px auto 60px;
            font-size: 56px;
        }*/ }
    .perfect__cups {
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-direction: row;
          -ms-flex-direction: row;
              flex-direction: row;
      -webkit-flex-wrap: nowrap;
          -ms-flex-wrap: nowrap;
              flex-wrap: nowrap;
      -webkit-justify-content: space-around;
          -ms-flex-pack: distribute;
              justify-content: space-around;
      -webkit-align-items: baseline;
          -ms-flex-align: baseline;
              align-items: baseline;
      width: 70%;
      max-width: 700px;
      margin: 0 auto; }
      .perfect__cups .center {
        max-width: 100%; }
      .perfect__cups__name {
        display: inline-block;
        margin: 20px 0 47px;
        font-size: 24px; }
      .perfect__cups .img__container {
        width: 150px;
        height: 150px; }
        .perfect__cups .img__container img {
          width: auto; }
      .perfect__cups .hintsOfCups__name__caption__img {
        width: 20px;
        position: relative;
        top: 4px; } }

.hintsOfCups__desc {
  font-family: "Reader Regular";
  text-align: center;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  color: #333;
  font-size: 18px;
  line-height: 1.35; }
  @media only screen and (min-width: 760px) {
    .hintsOfCups__desc {
      font-size: 24px;
      line-height: 1.5;
      margin-bottom: 30px; } }

.symbols {
  top: -30px !important;
  padding: 0 !important;
  font-family: "Reader Regular";
  color: #fff;
  font-weight: 700;
  font-size: 18px;
  position: relative; }

.highlight:after {
  content: "";
  width: 30px;
  height: 5px;
  background-color: #f9c606;
  display: block;
  margin: 15px auto; }

.highlight--center:after {
  content: "";
  width: 35px;
  height: 5px;
  background-color: #f9c606;
  display: block;
  margin: 15px auto 0; }

.equal--margin {
  margin-bottom: 60px !important; }

.works {
  background-color: #333333 !important; }
  .works .connector__arrow {
    color: #f9c606 !important; }
  .works .connector__horizontal {
    border-top: 3px dashed #f9c606 !important;
    width: 82% !important; }
  .works .vertical__connector {
    border-left: 3px dashed #f9c606 !important; }
  .works .perfect__heading {
    color: #fff;
    letter-spacing: 0.025em; }
  .works--left img {
    width: 50%;
    left: 8% !important; }
  .works--right img {
    width: 70%; }
  .works--center img {
    width: 126% !important;
    max-width: 126% !important; }

.perfect {
  background-color: #fff;
  border-radius: 5px;
  /*  &__heading {
        text-align: center;
        font-size: 41px;
        font-family: $font-reader-regular;
        margin: 60px auto 40px;
        max-width: 90%;
    }*/ }
  .perfect .connector {
    display: none; }
  .perfect .connector__arrow {
    border-right: 3px solid;
    border-bottom: 3px solid;
    width: 15px;
    height: 15px;
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
    margin: 0 auto 10px;
    color: #eeeeee; }
  .perfect .connector__horizontal {
    width: 87%;
    height: 5px;
    border-top: 3px dashed #eeeeee;
    margin: 0 auto; }
  .perfect .vertical__connector {
    width: 2px;
    height: 40px;
    border-left: 3px dashed #eeeeee;
    margin: 7px auto 0; }
  .perfect__quizbox {
    margin: 30px auto 60px;
    width: 85%;
    padding: 40px 15px 15px;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    background-color: #fff;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse; }
    .perfect__quizbox__img {
      text-align: center; }
    .perfect__quizbox__content {
      max-width: 100%;
      text-align: center;
      padding: 0 15px; }
      .perfect__quizbox__content h4 {
        font-family: "Reader Bold";
        line-height: 26px;
        font-size: 20px;
        margin-bottom: 15px;
        letter-spacing: 0.025em; }
        .perfect__quizbox__content h4:after {
          margin: 15px auto !important; }
      .perfect__quizbox__content p {
        font-size: 14px;
        font-family: "Reader Regular";
        text-align: center;
        line-height: 19px; }
        .perfect__quizbox__content p a {
          display: block;
          color: #2a82e3 !important;
          margin-top: 20px; }
  .perfect__working {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
    -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
            justify-content: space-around;
    -webkit-align-items: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    width: 82%;
    margin: 0 auto; }
    .perfect__working .center {
      max-width: 81px; }
    .perfect__working__name {
      display: block;
      margin: 17px 0 60px;
      font-size: 14px;
      font-family: "Reader Bold";
      color: #fff;
      text-transform: uppercase;
      letter-spacing: 0.075em; }
    .perfect__working .img__container {
      width: 75px;
      height: 75px;
      border-radius: 50%;
      background-color: #3d3d3d;
      display: -webkit-inline-flex;
      display: -ms-inline-flexbox;
      display: inline-flex;
      position: relative; }
      .perfect__working .img__container img {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: auto; }

@media only screen and (max-width: 340px) {
  .perfect__working {
    width: 96%; } }

@media only screen and (min-width: 760px) {
  .highlight:after {
    content: "";
    width: 30px;
    height: 5px;
    background-color: #f9c606;
    display: block;
    margin: 20px auto; }
  .equal--margin {
    margin-bottom: 90px !important; }
  .works .connector__horizontal {
    width: 70% !important; }
  .perfect {
    /*  &__heading {
            margin: 90px auto 60px;
            font-size: 56px;
        }*/ }
    .perfect__quizbox {
      margin: 45px auto 90px;
      width: 67%;
      padding: 60px 40px;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      background-color: #fff;
      -webkit-justify-content: space-between;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-flex-direction: row;
          -ms-flex-direction: row;
              flex-direction: row; }
      .perfect__quizbox__content {
        max-width: 44%;
        text-align: left;
        padding: 0; }
        .perfect__quizbox__content h4 {
          margin-bottom: 15px;
          margin-top: -9px;
          line-height: 38px;
          font-size: 28px; }
          .perfect__quizbox__content h4:after {
            margin: 13px 0 !important; }
        .perfect__quizbox__content p {
          font-size: 16px;
          text-align: left;
          line-height: 24px; }
          .perfect__quizbox__content p a {
            display: block;
            color: #2a82e3 !important;
            margin-top: 12px; }
    .perfect__working {
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-direction: row;
          -ms-flex-direction: row;
              flex-direction: row;
      -webkit-flex-wrap: nowrap;
          -ms-flex-wrap: nowrap;
              flex-wrap: nowrap;
      -webkit-justify-content: space-around;
          -ms-flex-pack: distribute;
              justify-content: space-around;
      -webkit-align-items: baseline;
          -ms-flex-align: baseline;
              align-items: baseline;
      width: 70%;
      max-width: 700px;
      margin: 0 auto; }
      .perfect__working .center {
        max-width: 100%; }
      .perfect__working__name {
        display: block;
        margin: 15px 0 60px;
        font-size: 14px; }
      .perfect__working .img__container {
        width: 122px;
        height: 122px; }
        .perfect__working .img__container img {
          width: auto !important; }
    .perfect .connector {
      width: 70%;
      height: 5px;
      border-top: 3px dashed #eeeeee;
      margin: 0 auto;
      top: 100px;
      position: absolute;
      z-index: 0;
      display: block;
      left: 0;
      right: 0; }
  .symbols {
    position: relative;
    top: -55px !important;
    left: auto !important;
    padding: 0 !important;
    font-size: 24px; } }

.perfect__working .works--center .img__container img {
  width: 126% !important;
  left: -13% !important; }

.perfect__working .works--center {
  margin: 0 2% !important; }

.round__img {
  border-radius: 50%;
  width: 100%; }

.highlight:after {
  content: "";
  width: 30px;
  height: 5px;
  background-color: #f9c606;
  display: block;
  margin: 15px auto; }

.perfect {
  background-color: #fff;
  border-radius: 5px; }
  .perfect__tagcontainer {
    text-align: center;
    margin: 20px 0 60px; }
    .perfect__tagcontainer .circle--l {
      border-radius: 5px;
      background-color: #f9c606;
      width: 5px;
      height: 5px;
      display: inline-block;
      position: relative;
      top: -4px;
      left: -10px; }
    .perfect__tagcontainer .circle--r {
      border-radius: 5px;
      background-color: #f9c606;
      width: 5px;
      height: 5px;
      display: inline-block;
      position: relative;
      top: -4px;
      right: -10px; }
    .perfect__tagcontainer .perfect__tagline {
      display: inline-block;
      font-size: 14px;
      font-family: "Reader Bold";
      text-transform: uppercase;
      letter-spacing: 0.075em; }
  .perfect .connector {
    display: none; }
  .perfect .connector__arrow {
    border-right: 3px solid;
    border-bottom: 3px solid;
    width: 15px;
    height: 15px;
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
    margin: 0 auto 10px;
    color: #eeeeee; }
  .perfect .connector__horizontal {
    width: 87%;
    height: 5px;
    border-top: 3px dashed #eeeeee;
    margin: 0 auto; }
  .perfect .vertical__connector {
    width: 2px;
    height: 40px;
    border-left: 3px dashed #eeeeee;
    margin: 7px auto 0; }
  .perfect__heading {
    text-align: center;
    font-size: 41px;
    font-family: "Reader Regular";
    margin: 60px auto 40px;
    max-width: 90%;
    line-height: 48px; }
  .perfect__personal {
    position: relative;
    width: 100%;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
    -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
            justify-content: space-around;
    -webkit-align-items: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin: 0 auto; }
    .perfect__personal__slide {
      width: 240px;
      text-align: center;
      list-style: none;
      margin: 0 auto 12px;
      z-index: 2; }
      .perfect__personal__slide img {
        padding: 0 30px; }
      .perfect__personal__slide .highlight {
        margin-top: 12px;
        font-family: "Reader Bold";
        line-height: 26px;
        font-size: 20px;
        letter-spacing: 0.025em; }
      .perfect__personal__slide p {
        text-align: center;
        line-height: 19px;
        margin-bottom: 20px;
        font-family: "Reader Regular";
        font-size: 14px; }
        .perfect__personal__slide p a {
          color: skyblue !important; }

@media only screen and (min-width: 760px) {
  .perfect__personal__slide .highlight:after {
    content: "";
    width: 30px;
    height: 5px;
    background-color: #f9c606;
    display: block;
    margin: 15px auto 17px; }
  .perfect__heading {
    margin: 90px auto 60px;
    font-size: 56px; }
  .perfect .connector {
    width: 70%;
    height: 5px;
    border-top: 3px dashed #eeeeee;
    margin: 0 auto;
    top: 100px;
    position: absolute;
    z-index: 0;
    display: block;
    left: 0;
    right: 0; }
  .perfect__tagcontainer {
    margin: 18px 0 85px; }
  .perfect__personal {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
    -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
            justify-content: space-around;
    -webkit-align-items: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    margin: 0 auto;
    padding-left: 0;
    width: auto; }
    .perfect__personal__slide {
      width: 240px;
      margin: 0 auto 0; }
      .perfect__personal__slide .highlight {
        margin-top: 30px;
        font-size: 28px;
        line-height: 28px; }
      .perfect__personal__slide .connector__arrow {
        display: none; }
      .perfect__personal__slide .vertical__connector {
        display: none; }
      .perfect__personal__slide p {
        margin-bottom: 60px;
        font-size: 16px;
        line-height: 24px; }
      .perfect__personal__slide img {
        padding: 0 20px; } }

.hidden--imp {
  display: none !important; }

@media only screen and (min-width: 760px) {
  #wrapper {
    padding-bottom: 70px; } }

#skkmFooterCont {
  padding-bottom: 70px; }

.row.mar--b--30 {
  margin-bottom: 30px !important; }

.m--block {
  display: block; }

.contact-social {
  width: 100%; }

.footer .footer.row {
  max-width: 100% !important; }

.landing-footer-content {
  max-width: 75rem;
  margin: 0 auto; }

button {
  font-family: "Reader Regular"; }

body,
#content {
  background-color: #f1f1f1;
  margin: 0; }

.content_wrapper {
  max-width: 1200px;
  margin: 0 auto; }

.center {
  text-align: center; }

.left {
  cursor: pointer; }

.right {
  cursor: pointer; }

.hero__quiz.get__started {
  position: fixed;
  width: 100%;
  bottom: -1px;
  z-index: 10008;
  left: 0;
  border: 0;
  right: 0;
  margin: 0 auto;
  height: 43px; }

.floating_footer {
  height: 43px;
  width: 100%;
  position: fixed;
  background-color: #f9c606;
  bottom: -1px;
  z-index: 10007;
  display: none; }

ol.carousel {
  list-style: none;
  padding: 0;
  width: 250px;
  text-align: center;
  margin: 30px auto;
  bottom: 0;
  position: absolute;
  left: 0;
  right: 0; }
  ol.carousel li {
    background: #eeeeee;
    border-radius: 50%;
    display: inline-block;
    width: 12px;
    height: 12px;
    cursor: pointer;
    margin-left: 5px;
    margin-right: 5px;
    font-size: 10px; }
    ol.carousel li.selected {
      background: #f9c606; }

.highlight:after {
  content: "";
  width: 30px;
  height: 5px;
  background-color: #f9c606;
  display: block;
  margin: 15px auto; }

.highlight--center:after {
  content: "";
  width: 35px;
  height: 5px;
  background-color: #f9c606;
  display: block;
  margin: 15px auto 0; }

.mask__container {
  position: relative;
  height: 0; }

.mask-left {
  height: 30px;
  width: 112px;
  top: -30px;
  position: relative;
  float: left;
  background-color: #f1f1f1; }

.hero__mask {
  height: 30px;
  position: relative;
  top: -30px;
  width: 100%;
  max-width: 75rem;
  margin: 0 auto; }

.mask-right {
  height: 30px;
  width: 112px;
  top: -60px;
  position: relative;
  float: right;
  background-color: #f1f1f1; }

.hero__mask:before,
.hero__mask:after {
  box-sizing: border-box;
  content: " ";
  position: absolute;
  top: 0;
  display: block;
  width: 50%;
  height: 100%;
  border: 30px solid #f9c606;
  border-bottom-color: white; }

.hero__mask:before {
  left: 0;
  border-right: 20px solid transparent;
  border-left: 0;
  border-top: 0; }

.hero__mask:after {
  right: 0;
  border-left: 20px solid transparent;
  border-right: 0;
  border-top: 0; }

#homepage_slider,
#page,
#wrapper,
header {
  min-width: 320px !important; }

.perfect {
  background-color: #fff;
  border-radius: 5px;
  /* &__heading {
        text-align: center;
        font-size: 41px;
        font-family: $font-reader-regular;
        margin: 60px auto 40px;
        max-width: 90%;
    }*/ }
  .perfect .connector {
    display: none; }
  .perfect .connector__arrow {
    border-right: 3px solid;
    border-bottom: 3px solid;
    width: 15px;
    height: 15px;
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
    margin: 0 auto 10px;
    color: #eeeeee; }
  .perfect .connector__horizontal {
    width: 87%;
    height: 5px;
    border-top: 3px dashed #eeeeee;
    margin: 0 auto; }
  .perfect .vertical__connector {
    width: 2px;
    height: 40px;
    border-left: 3px dashed #eeeeee;
    margin: 7px auto 0; }

header {
  display: none !important; }

.footer {
  display: none !important; }

.hintsOfCups .slick-next,
.hintsOfCups .slick-prev {
  background-image: url("../images/icons.png");
  background-repeat: no-repeat;
  bottom: 47px;
  z-index: 9; }

.hintsOfCups .slick-next {
  background-position: -17px -211px;
  right: 40%; }
  .hintsOfCups .slick-next.slick-disabled {
    background-position: -16px -331px; }
  .hintsOfCups .slick-next:before {
    content: ""; }

.hintsOfCups .slick-prev {
  background-position: -17px -253px;
  left: 40%; }
  .hintsOfCups .slick-prev.slick-disabled {
    background-position: -17px -292px; }
  .hintsOfCups .slick-prev:before {
    content: ""; }

@media only screen and (min-width: 460px) {
  .m--block {
    display: none; } }

@media only screen and (min-width: 760px) {
  .highlight:after {
    content: "";
    width: 30px;
    height: 5px;
    background-color: #f9c606;
    display: block;
    margin: 20px auto; }
  header {
    display: block !important; }
  .footer {
    display: block !important; }
  .perfect__heading {
    margin: 90px auto 60px;
    font-size: 56px; }
  .perfect .connector {
    width: 70%;
    height: 5px;
    border-top: 3px dashed #eeeeee;
    margin: 0 auto;
    top: 100px;
    position: absolute;
    z-index: 0;
    display: block;
    left: 0;
    right: 0; }
  .perfect__carousel .round__img {
    width: 100%; } }

@media only screen and (max-width: 760px) {
  .perfect__carousel .slick-slide img {
    margin: 0 auto; }
  .perfect__carousel__slide p {
    width: 50%;
    margin: 30px auto 0; }
  .perfect__carousel .slick-slide {
    padding: 0; } }

@media only screen and (min-width: 1024px) {
  #homepage_slider,
  #page,
  #wrapper,
  header {
    min-width: 1024px !important; } }

.legal__footer {
  font-size: 12px;
  font-family: "Reader Regular";
  max-width: 1200px;
  margin: 0 auto;
  color: #333;
  text-align: center;
  padding: 0 20px 30px; }
  .legal__footer sup {
    top: -3px; }

@media only screen and (min-width: 768px) {
  body header {
    width: 100%;
    z-index: 2;
    min-width: 1024px;
    background: #5B3427; }
    body header .nav {
      border-bottom: 2px solid #7A4C28 !important; }
      body header .nav .keurig-logo {
        margin: 28px 0 22px 21px; }
    body header .nav-search input[type="text"] {
      font-family: "MarkOT-Regular"; }
    body header .nav-search button {
      margin-left: -45px;
      border: 0; }
      body header .nav-search button:hover {
        background-color: transparent; }
    body header .sub-nav.right dd .gift-guide-icon {
      background: url(../images/top_navigation_icons.png) -4px -230px no-repeat;
      width: 39px;
      height: 42px;
      display: inline-block;
      float: left;
      position: relative;
      top: -8px;
      left: 4px; }
    body header .sub-nav.right dd,
    body header .sub-nav.right dd a {
      color: #FFF; }
    body header .sub-nav.right dd:not(:last-of-type) {
      padding-right: 10px;
      margin-right: 10px;
      max-height: 24px;
      font-family: MarkOT-Regular, Helvetica, Arial, sans-serif;
      font-size: 14px;
      font-weight: 400;
      font-style: normal;
      position: relative;
      border-right: 0; }
      body header .sub-nav.right dd:not(:last-of-type):after {
        content: '';
        position: absolute;
        width: 4px;
        height: 4px;
        background-color: #d2d2d2;
        border-radius: 4px;
        top: 11px;
        right: 0; }
      body header .sub-nav.right dd:not(:last-of-type):hover a {
        color: #fff;
        border-bottom: solid 2px #E4D5D3;
        background: none; }
    body header .sub-nav.right dd:not(:last-of-type) a {
      padding: 0 !important;
      margin: 0 10px;
      line-height: 18px;
      font-family: MarkOT-Regular;
      letter-spacing: 1px; }
    body header .sub-nav.right dd .gift-guide-icon + a {
      color: #fff;
      background-color: #770808;
      font-family: MarkOT-Bold; }
  body .exp-67.nav {
    border-bottom: 0 !important; }
  body .exp-67 .top-nav-items > li > a {
    color: #fff;
    padding-left: 0; }
    body .exp-67 .top-nav-items > li > a span {
      font-family: "MarkOT-Regular"; }
  body .exp-67 .top-nav-items > li.active, body .exp-67 .top-nav-items > li:hover {
    background-color: #E7CEB5 !important; }
    body .exp-67 .top-nav-items > li.active a, body .exp-67 .top-nav-items > li:hover a {
      color: #000; }
  body .exp-67 .fly-out {
    background-color: #E7CEB5;
    position: absolute;
    top: 65px;
    left: 0;
    width: 100%;
    padding: 15px 30px;
    z-index: 99999; }
    body .exp-67 .fly-out a {
      font-size: 14px;
      color: #000 !important;
      border-bottom: 2px solid transparent; }
    body .exp-67 .fly-out .category-link a {
      border-bottom: 2px solid #5B3427; }
    body .exp-67 .fly-out .section h6 {
      color: #000;
      font-size: 16px;
      line-height: 16px;
      font-weight: 700;
      margin-bottom: 15px; }
    body .exp-67 .fly-out .bottom-links a {
      border-bottom: 2px solid #5B3427; }
    body .exp-67 .fly-out .flyout-footer span {
      color: #000;
      -webkit-font-smoothing: antialiased;
      font-size: 14px; }
  body #miniCart a {
    background: url(../../../../_ui/desktop/common/images/top_navigation_icons.png) -34px -167px no-repeat;
    width: 33px;
    margin-left: 0;
    top: -8px;
    overflow: visible;
    text-decoration: none; } }

/* ----- minicart for mobile voew only ----- */
/*------------------------------------*\
    UTILITIES
\*------------------------------------*/
/*------------------------------------*\
    VARIABLES
\*------------------------------------*/
/* ----- Paths ----- */
/* ----- Colors ----- */
/* ----- Typography ----- */
/* ----- Responsive & Grid ----- */
/* ----- Layering ----- */
/* Animation delays */
/*3.2s;*/
/*------------------------------------*\
    MIXINS
\*------------------------------------*/
/* ----- Responsive ----- */
/*
 * Keyframe cycle
 */
/*
 * animation cycle
 */
/* ----- Fonts ----- */
/* ----- Misc ----- */
/*---------- Button -----------*/
/*------------------------------------*\
    TYPOGRAPHY
\*------------------------------------*/
.m-minicart-modal.hide .m-minicart {
  -webkit-transform: matrix(0.4, 0, 0, 0.4, 0, 0);
          transform: matrix(0.4, 0, 0, 0.4, 0, 0); }

.m-minicart {
  background-color: #fff;
  display: block;
  left: 50%;
  position: fixed;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 280px;
  z-index: 99; }
  .m-minicart__head {
    height: 22px;
    line-height: 22px;
    text-align: center;
    font-size: 12px;
    font-family: helvetica;
    font-weight: bold;
    background: #3cb14a;
    color: #fff;
    width: 100%;
    position: relative; }
  .m-minicart__close {
    background-image: url(../images/mobile-sprite.png);
    background-position: -28px -56px;
    background-repeat: no-repeat;
    background-size: 126px 97px;
    width: 15px;
    height: 15px;
    position: absolute;
    top: 3px;
    right: 3px; }
  .m-minicart__container {
    padding: 16px 23px 16px 23px; }
  .m-minicart__inner {
    display: table; }
    .m-minicart__inner--left {
      width: 86px;
      min-height: 50px;
      float: left;
      margin-top: 8px;
      padding-left: 10px;
      position: relative; }
      .m-minicart__inner--left img:last-child {
        width: 77px !important;
        left: 57% !important;
        top: 44px !important; }
    .m-minicart__inner--right {
      padding: 10px 0 32px 26px;
      width: 145px;
      float: left;
      min-height: 50px;
      color: #231F20;
      font-size: 14px;
      line-height: 16px; }
  .m-minicart__brand {
    font-family: "Reader Bold"; }
    .m-minicart__brand sup {
      top: -2px; }
  .m-minicart__title {
    font-family: "Reader Regular"; }
  .m-minicart__checkout {
    display: block;
    width: 100% !important;
    font-family: Helvetica;
    font-weight: bold; }
  .m-minicart__price {
    color: #231f20;
    font-family: "Reader Bold";
    font-size: 12px;
    font-weight: bold;
    padding-top: 11px; }
  .m-minicart__mrp {
    display: inline-block;
    text-decoration: line-through; }
  .m-minicart__sp {
    display: inline-block; }
  .m-minicart__bg {
    background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9; }
  .m-minicart__continue {
    padding-top: 10px;
    text-align: center; }
  .m-minicart__continue-icon {
    background-image: url(../images/mobile-sprite.png);
    background-repeat: no-repeat;
    background-size: 126px 97px !important;
    background-position: -78.5px -39.5px;
    width: 6.5px;
    height: 12px;
    top: 2.4px;
    display: inline-block;
    position: relative;
    margin-right: 5px; }
  .m-minicart__continue-text,
  .m-minicart__continue-text a {
    text-transform: uppercase;
    color: #7E7B6E;
    font-size: 12px;
    font-family: Helvetica;
    font-weight: bold;
    display: inline-block; }
  .m-minicart__error {
    opacity: 0;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
    position: fixed;
    display: block;
    background-color: #fff;
    z-index: 99;
    width: 230px;
    padding: 10px 0; }
    .m-minicart__error-msg {
      font-size: 12px;
      color: #d54b4f;
      text-align: center;
      border-bottom: 1px solid #dadad6;
      padding: 15px 0;
      text-transform: none;
      font-weight: bold; }
    .m-minicart__error-ok {
      font-size: 18px;
      color: #565656;
      text-align: center;
      padding: 10% 0;
      font-weight: bold; }

/* ----- Responsive image component styles ----- */
/*------------------------------------*\
    UTILITIES
\*------------------------------------*/
/*------------------------------------*\
    VARIABLES
\*------------------------------------*/
/* ----- Paths ----- */
/* ----- Colors ----- */
/* ----- Typography ----- */
/* ----- Responsive & Grid ----- */
/* ----- Layering ----- */
/* Animation delays */
/*3.2s;*/
/*------------------------------------*\
    MIXINS
\*------------------------------------*/
/* ----- Responsive ----- */
/*
 * Keyframe cycle
 */
/*
 * animation cycle
 */
/* ----- Fonts ----- */
/* ----- Misc ----- */
/*---------- Button -----------*/
/*------------------------------------*\
    TYPOGRAPHY
\*------------------------------------*/
/* ===== loading animation ==== */
@-webkit-keyframes colors {
  17% {
    opacity: 1; }
  23% {
    opacity: 0; }
  92% {
    opacity: 0; } }
@keyframes colors {
  17% {
    opacity: 1; }
  23% {
    opacity: 0; }
  92% {
    opacity: 0; } }

/* ===== loading animation ==== */
.result-hero {
  position: relative;
  width: 100%;
  height: 518px;
  /*close button*/ }
  @media (min-width: 768px) {
    .result-hero {
      height: 620px;
      max-height: 620px; } }
  .result-hero .responsive-image {
    background-color: #333;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: inherit;
    background-position: center center; }
  .result-hero__profile {
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    text-align: center;
    padding-top: 30px; }
    @media (min-width: 768px) {
      .result-hero__profile {
        padding-top: 55px; } }
  .result-hero__icon {
    background-color: #fff;
    border-radius: 25px;
    display: inline-block;
    height: 50px;
    padding: 10px;
    width: 50px;
    position: relative; }
    .result-hero__icon--main {
      transition: all 0.4s ease-in-out;
      margin-top: 0;
      opacity: 1; }
      .result-hero__icon--main.inprogress {
        margin-top: 135px; }
  .result-hero__loader {
    width: 30px;
    height: 30px;
    position: absolute;
    left: 10px;
    top: 10px;
    overflow: hidden; }
    .result-hero__loader li {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      opacity: 0; }
      .result-hero__loader li img {
        display: block;
        width: 100%;
        height: 100%; }
      .result-hero__loader li:nth-child(1) {
        -webkit-animation: colors 2.7s 0s linear infinite;
        animation: colors 2.7s 0s linear infinite; }
      .result-hero__loader li:nth-child(2) {
        -webkit-animation: colors 2.7s 0.3s linear infinite;
        animation: colors 2.7s 0.3s linear infinite; }
      .result-hero__loader li:nth-child(3) {
        -webkit-animation: colors 2.7s 0.6s linear infinite;
        animation: colors 2.7s 0.6s linear infinite; }
      .result-hero__loader li:nth-child(4) {
        -webkit-animation: colors 2.7s 0.9s linear infinite;
        animation: colors 2.7s 0.9s linear infinite; }
      .result-hero__loader li:nth-child(5) {
        -webkit-animation: colors 2.7s 1.2s linear infinite;
        animation: colors 2.7s 1.2s linear infinite; }
      .result-hero__loader li:nth-child(6) {
        -webkit-animation: colors 2.7s 1.5s linear infinite;
        animation: colors 2.7s 1.5s linear infinite; }
      .result-hero__loader li:nth-child(7) {
        -webkit-animation: colors 2.7s 1.8s linear infinite;
        animation: colors 2.7s 1.8s linear infinite; }
      .result-hero__loader li:nth-child(8) {
        -webkit-animation: colors 2.7s 2.1s linear infinite;
        animation: colors 2.7s 2.1s linear infinite; }
      .result-hero__loader li:nth-child(9) {
        -webkit-animation: colors 2.7s 2.4s linear infinite;
        animation: colors 2.7s 2.4s linear infinite; }
  .result-hero__title-block {
    transition: all 0.4s ease-in-out 1s;
    opacity: 1;
    margin-top: 0;
    padding-bottom: 2px;
    font-size: 2em;
    margin-bottom: .75em;
    color: #1e1e1e;
    line-height: 44px; }
    @media (min-width: 768px) {
      .result-hero__title-block {
        padding-bottom: 19px; } }
  .result-hero__subtitle {
    color: #f9c606;
    display: block;
    font-family: "Reader Bold";
    font-size: 14px;
    letter-spacing: 0.075em;
    padding-top: 11px;
    text-transform: uppercase;
    margin-bottom: 0px; }
    @media (min-width: 768px) {
      .result-hero__subtitle {
        padding-top: 23px;
        font-size: 16px;
        margin-bottom: 5px; } }
  .result-hero__title a {
    display: inline-block;
    text-transform: lowercase;
    border-bottom: 2px dashed #F9C606; }
    .result-hero__title a .profile-name {
      color: #fff;
      font-family: "PlayfairDisplayBlack";
      font-style: normal;
      font-weight: 800;
      letter-spacing: 0.025em;
      text-transform: lowercase; }
  .result-hero__title a:hover, .result-hero__title a:active {
    color: #fff; }
  .result-hero__title--bottom {
    display: block;
    margin-top: -9px; }
    @media (min-width: 768px) {
      .result-hero__title--bottom {
        display: inline-block;
        margin-top: 0px; } }
  @media (min-width: 768px) {
    .result-hero__title--top {
      display: block;
      margin-bottom: 25px; }
    .result-hero__title a {
      font-size: 56px;
      line-height: 62px; } }
  .result-hero__hint-text {
    color: #C4C4C4;
    font-family: "PlayfairDisplayBlack";
    font-style: italic;
    font-weight: 800;
    font-size: 35px;
    line-height: 53px;
    letter-spacing: 0.025em;
    border-bottom: #F9C606 dashed underline; }
    @media (min-width: 768px) {
      .result-hero__hint-text {
        font-size: 56px;
        line-height: 62px;
        padding-right: 10px; } }
  .result-hero__offer-title {
    color: #fff;
    font-size: 24px;
    letter-spacing: 0.025em;
    line-height: 24px;
    padding-top: 16px;
    padding-bottom: 5px;
    margin: 0 auto; }
    .result-hero__offer-title.strike {
      white-space: initial; }
      .result-hero__offer-title.strike span:before, .result-hero__offer-title.strike span:after {
        background: none; }
    .result-hero__offer-title span {
      font-family: "Reader Medium";
      line-height: 30px; }
    @media (min-width: 768px) {
      .result-hero__offer-title {
        font-size: 28px;
        padding-top: 43px;
        padding-bottom: 0;
        /* strike */
        width: 74%;
        overflow: hidden;
        text-align: center;
        display: block; }
        .result-hero__offer-title.strike span:before {
          margin-right: 15px;
          right: 100%; }
        .result-hero__offer-title.strike span:after {
          left: 100%;
          margin-left: 15px; }
        .result-hero__offer-title.strike span:before, .result-hero__offer-title.strike span:after {
          background: #89898b none repeat scroll 0 0;
          content: "";
          height: 3px;
          position: absolute;
          top: 40%;
          width: 9999px;
          display: block; } }
  @media (min-width: 768px) and (min-width: 768px) {
    .result-hero__offer-title.strike {
      max-width: 1200px;
      width: auto; }
      .result-hero__offer-title.strike .strike-wrapper1 {
        width: 90%;
        margin: 0 auto; }
      .result-hero__offer-title.strike .strike-wrapper2 {
        margin: 0 15px;
        overflow: hidden; }
        .result-hero__offer-title.strike .strike-wrapper2 span {
          position: relative;
          display: inline-block; } }
  .result-hero__discount {
    color: #fff;
    display: block;
    font-family: "Reader Bold";
    font-size: 14px;
    letter-spacing: 0.025em;
    padding-top: 8px;
    padding-bottom: 5px; }
    @media (min-width: 768px) {
      .result-hero__discount {
        font-family: "Reader Bold";
        font-size: 16px; } }
  .result-hero__code {
    font-size: 16px;
    font-family: Reader Regular;
    color: #fff;
    padding: 0 5%;
    display: inline-block; }
    @media only screen and (min-width: 375px) {
      .result-hero__code {
        padding: 0 10%; } }
    @media only screen and (min-width: 480px) {
      .result-hero__code {
        padding: 0 16%; } }
    .result-hero__code img {
      vertical-align: sub; }
  .result-hero .close {
    background-color: #FFF;
    height: 24px;
    top: 14px;
    right: 16px;
    width: 26px;
    text-decoration: none;
    border: 0; }
    .result-hero .close:after, .result-hero .close:before {
      background-color: #333333;
      height: 20px;
      left: 13px; }
      @media (min-width: 768px) {
        .result-hero .close:after, .result-hero .close:before {
          height: 27px;
          left: 10px;
          top: 0px;
          width: 3px; } }
  .result-hero__offers,
  .result-hero .seperator {
    transition: all 0.4s ease-in-out 2.2s;
    margin-top: 0;
    opacity: 1; }
  .result-hero__error__parent {
    position: relative;
    width: 100%;
    height: 100%; }
    .result-hero__error__parent__container {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
      width: 31%;
      text-align: center; }
      .result-hero__error__parent__container img {
        width: 50px; }
      .result-hero__error__parent__container .result-hero__subtitle {
        line-height: 26px;
        color: #ffffff;
        text-transform: initial;
        font-size: 19px; }
        @media only screen and (min-width: 760px) {
          .result-hero__error__parent__container .result-hero__subtitle {
            line-height: 32px;
            font-size: 23px; } }
      @media only screen and (max-width: 760px) {
        .result-hero__error__parent__container {
          width: 85%; } }
      .result-hero__error__parent__container a {
        font-family: reader bold;
        display: inline-block;
        color: #fff;
        border-bottom: 2px solid #f9c606;
        text-transform: uppercase;
        padding-top: 20px;
        line-height: 27px;
        letter-spacing: 0.075em; }

/*
    When inprogress class is on
 */
body.inprogress .result-hero__title-block, body.inprogress .result-hero__offers,
body.inprogress .result-hero .seperator {
  opacity: 0;
  margin-top: 0.5em; }

body.inprogress .result-hero .pcup-pcup {
  display: block; }

/*------------------------------------*\
    UTILITIES
\*------------------------------------*/
/*------------------------------------*\
    VARIABLES
\*------------------------------------*/
/* ----- Paths ----- */
/* ----- Colors ----- */
/* ----- Typography ----- */
/* ----- Responsive & Grid ----- */
/* ----- Layering ----- */
/* Animation delays */
/*3.2s;*/
/*------------------------------------*\
    MIXINS
\*------------------------------------*/
/* ----- Responsive ----- */
/*
 * Keyframe cycle
 */
/*
 * animation cycle
 */
/* ----- Fonts ----- */
/* ----- Misc ----- */
/*---------- Button -----------*/
/*------------------------------------*\
    TYPOGRAPHY
\*------------------------------------*/
#wrapper {
  position: static !important; }

.result-slider {
  /*  on load animation  */
  transition: all 0.4s ease-in-out 2.2s;
  margin-top: 0;
  opacity: 1;
  background-color: #fff;
  color: #fff;
  max-height: 694px;
  padding-bottom: 30px;
  margin: 0 auto;
  max-width: 1200px;
  z-index: 9; }
  @media (min-width: 768px) {
    .result-slider {
      padding-bottom: 0; } }
  .result-slider .slick-track {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-bottom: 20px; }
    @media (min-width: 768px) {
      .result-slider .slick-track {
        padding-bottom: 0; } }
  .result-slider__box {
    margin-top: -70px;
    max-width: 1200px;
    /*slck slider style start*/
    /*.slick-list{
            margin-top: -112px;
        }*/ }
    .result-slider__box sup {
      top: -4px; }
    @media only screen and (min-width: 760px) {
      .result-slider__box {
        max-width: 1200px;
        width: 90%;
        margin: 0 auto;
        margin-top: -119px; } }
    .result-slider__box__tasteTile {
      position: relative;
      margin-left: 15px;
      margin-right: 15px;
      margin-bottom: 50px;
      box-shadow: -3px 9px 27px -5px rgba(0, 0, 0, 0.1);
      padding: 25px 0 68px;
      background-color: #fff;
      -webkit-flex-grow: 1;
          -ms-flex-positive: 1;
              flex-grow: 1;
      width: 240px;
      float: left; }
      @media only screen and (min-width: 760px) {
        .result-slider__box__tasteTile {
          margin-bottom: 36px;
          max-width: inherit; } }
      .result-slider__box__tasteTile__count {
        text-align: right;
        color: #333333;
        font-size: 12px;
        margin-right: 2em;
        position: absolute;
        right: 0;
        top: 13px; }
        .result-slider__box__tasteTile__count--bold {
          font-family: "Reader Bold"; }
      .result-slider__box__tasteTile__imgContainer {
        /*background-repeat: no-repeat;
                background-position: center;
                width: 172px;
                height: 179px;*/
        position: relative;
        min-height: 150px; }
        @media only screen and (min-width: 760px) {
          .result-slider__box__tasteTile__imgContainer {
            margin: 0 auto; } }
        .result-slider__box__tasteTile__imgContainer--bg {
          left: 0;
          top: 0;
          margin: auto;
          position: relative;
          z-index: 0; }
          @media only screen and (min-width: 760px) {
            .result-slider__box__tasteTile__imgContainer--bg {
              /* width: auto;*/ } }
        .result-slider__box__tasteTile__imgContainer--img {
          width: 178px !important;
          margin: auto;
          position: absolute;
          z-index: 1;
          -webkit-transform: translate(-50%, -50%);
                  transform: translate(-50%, -50%);
          left: 50%;
          margin-top: -10px;
          top: 50%; }
          @media only screen and (min-width: 760px) {
            .result-slider__box__tasteTile__imgContainer--img {
              /* width: auto;
                        left: 13%;
                        top: -19px;*/ } }
    .result-slider__box .slick-prev {
      top: 476px;
      background-image: url(../images/icons.png);
      background-repeat: no-repeat;
      background-position: -11px -248px;
      left: 50%;
      margin-left: -40px;
      bottom: 0;
      z-index: 9;
      width: 30px;
      height: 30px; }
      .result-slider__box .slick-prev.slick-disabled {
        cursor: auto;
        opacity: 0.85;
        background-position: 0 0;
        background-position: -11px -287px; }
        @media only screen and (min-width: 760px) {
          .result-slider__box .slick-prev.slick-disabled {
            background-position: -14px -3px;
            opacity: 0.2; } }
      @media only screen and (min-width: 760px) {
        .result-slider__box .slick-prev {
          left: -4%;
          margin-left: 0;
          top: 182px !important;
          bottom: -6px;
          background-image: url(../images/icons.png);
          background-position: -14px -110px;
          width: 24px;
          height: 24px; } }
      .result-slider__box .slick-prev:before {
        font-size: 40px;
        color: #f9c606;
        content: ""; }
        @media only screen and (min-width: 760px) {
          .result-slider__box .slick-prev:before {
            background-position: -14px -6px;
            font-size: 26px;
            background-repeat: no-repeat;
            width: 43px;
            height: 25px;
            left: -3%;
            z-index: 100000;
            top: 5% !important;
            bottom: -10px;
            content: ""; } }
    .result-slider__box .slick-next {
      top: 476px;
      position: absolute;
      background-image: url(../images/icons.png);
      background-repeat: no-repeat;
      background-position: -12px -206px;
      bottom: 47px;
      z-index: 9;
      right: 50%;
      margin-right: -40px;
      background-color: #fff;
      width: 30px;
      height: 30px; }
      .result-slider__box .slick-next.slick-disabled {
        cursor: auto;
        opacity: 0.85;
        background-position: -11px -326px; }
        @media only screen and (min-width: 760px) {
          .result-slider__box .slick-next.slick-disabled {
            background-position: -14px -58px;
            opacity: 0.2; } }
      @media only screen and (min-width: 760px) {
        .result-slider__box .slick-next {
          background-image: url("../images/icons.png");
          background-position: -14px -160px;
          background-repeat: no-repeat;
          right: -4%;
          margin-right: 0;
          top: 182px !important;
          position: absolute;
          width: 24px;
          height: 24px; } }
      .result-slider__box .slick-next:before {
        font-size: 40px;
        color: #f9c606;
        content: ""; }
        @media only screen and (min-width: 760px) {
          .result-slider__box .slick-next:before {
            background-position: -14px -164px;
            z-index: 100000;
            top: 33px !important;
            width: 30px;
            content: ""; } }
      .result-slider__box .slick-next:focus, .result-slider__box .slick-next:hover {
        background-image: url("../images/icons.png");
        /*background-position: -14px -164px;*/ }
    .result-slider__box .slick-slide img {
      width: inherit; }
      .result-slider__box .slick-slide img:last-child {
        margin-top: -11px; }
    .result-slider__box .slick-track {
      margin: 0 auto;
      padding-bottom: 5px; }
      @media (min-width: 768px) {
        .result-slider__box .slick-track {
          padding-bottom: 0px; } }
  .result-slider__pod-shadow {
    position: absolute;
    top: 58%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    left: 50%;
    width: 65% !important;
    opacity: 0.45; }

.addcard-box {
  color: #333333;
  text-align: center;
  /*close button*/ }
  .addcard-box__name {
    text-transform: uppercase;
    font-size: 12px;
    font-family: "Reader Bold";
    margin: 16px auto 0;
    letter-spacing: 0.075em; }
    .addcard-box__name a {
      font-family: "Reader Bold"; }
    @media only screen and (min-width: 760px) {
      .addcard-box__name {
        margin: 15px auto 0; } }
  .addcard-box__name2 {
    font-size: 16px;
    text-decoration: none;
    font-family: "Reader Bold";
    letter-spacing: 0.025em;
    margin: 0 auto;
    font-weight: bolder;
    min-height: 55px;
    position: relative; }
    .addcard-box__name2--line {
      border-bottom: 0.16em dashed #f9c606;
      display: inline;
      font-family: "Reader Bold";
      font-weight: normal;
      margin-bottom: 10px;
      min-height: 20px; }
  .addcard-box__title {
    border: 0 none;
    display: inline-block;
    width: 100%;
    padding: 0 20px; }
  .addcard-box__desc {
    font-family: "Reader Regular";
    font-size: 12px;
    letter-spacing: 0.025em;
    margin-top: 10px;
    min-height: 20px; }
  .addcard-box__price {
    text-transform: uppercase;
    font-size: 12px;
    padding: 0 10px 17px;
    font-weight: bold;
    letter-spacing: 0.025em; }
    .addcard-box__price--old {
      font-family: "Reader Regular";
      padding-left: 10px;
      padding-right: 10px;
      text-decoration: line-through; }
    .addcard-box__price--new {
      padding-left: 10px;
      padding-right: 10px;
      font-family: "Reader Bold"; }
    .addcard-box__price--discount {
      font-family: "Reader Regular";
      color: #3d3d3d;
      padding-left: 10px;
      padding-right: 10px; }
  .addcard-box__details {
    background-color: #fff;
    box-shadow: 6px 1px 45px 1px rgba(0, 0, 0, 0.2);
    display: inline-block;
    left: 0;
    margin: 0 !important;
    position: absolute;
    z-index: 999; }
  .addcard-box__details-content {
    padding: 20px; }
  .addcard-box__details-description {
    color: #333;
    font-family: "Reader Regular";
    font-size: 14px;
    text-align: left;
    letter-spacing: 0.025em;
    font-weight: normal; }
  .addcard-box__details-title {
    margin: 0;
    padding: 7px 25px 18px;
    letter-spacing: 0.075em;
    color: #333;
    font-family: "Reader Bold";
    font-size: 14px;
    text-transform: uppercase;
    text-align: center; }
  .addcard-box .close {
    background-color: #FFF;
    height: 20px;
    top: 11px;
    width: 22px;
    text-decoration: none;
    border: 0; }
    .addcard-box .close:after, .addcard-box .close:before {
      background-color: #333333;
      height: 14px;
      left: 26px; }
      @media (min-width: 768px) {
        .addcard-box .close:after, .addcard-box .close:before {
          height: 22px;
          left: 10px;
          top: 0;
          width: 3px; } }

.result-page-space {
  top: 3px; }

/* Add to card button */
.addcard-box button {
  border-radius: 0 !important; }
  @media only screen and (min-width: 760px) {
    .addcard-box button {
      width: 100% !important; } }

@media only screen and (min-width: 760px) {
  .addtocard-btn-wrapper {
    padding: 0 25px !important; } }

.taste-button,
.addcard-box button {
  background-color: #f9c606;
  width: 180px;
  color: #333333;
  font-size: 14px;
  font-family: "Reader Bold";
  margin: 4px auto;
  text-align: center;
  padding: 10px 0;
  text-transform: uppercase;
  border-radius: initial; }
  .taste-button:hover, .taste-button:focus,
  .addcard-box button:hover,
  .addcard-box button:focus {
    background-color: #db9623;
    cursor: pointer; }
  @media only screen and (min-width: 760px) {
    .taste-button,
    .addcard-box button {
      width: 14em; } }

.btn-green button {
  border-color: #48b758 !important;
  background: #50c656 !important;
  color: #ffffff !important; }

/*
    on load animation
*/
body.inprogress .result-slider {
  opacity: 0;
  margin-top: 0.5em !important; }

@media only screen and (min-width: 1024px) {
  #miniCartFlyout header {
    min-width: 0 !important; } }

.addcard-box__details .js-tooltip__pointer {
  position: absolute;
  top: -20px;
  display: block !important; }

.addcard-box__details .close {
  right: 15px !important;
  top: 15px;
  height: 25px; }
  .addcard-box__details .close:before, .addcard-box__details .close:after {
    height: 26px !important;
    background: black !important; }

.addcard-box__details sup {
  top: -4px; }

@media only screen and (min-width: 760px) {
  .addcard-box__details .close {
    right: 0 !important; } }

.result-slider__box__tasteTile__imgContainer img {
  max-height: 185px !important; }

.result-slider__box__tasteTile__imgContainer img.result-slider__box__tasteTile__imgContainer--img {
  max-height: 200px !important; }

li.addtocard-btn-wrapper {
  position: absolute;
  bottom: 27px;
  left: 0;
  right: 0; }

.shop-similar {
  margin-bottom: 37px;
  color: #333333;
  letter-spacing: 0.075em;
  font-size: 14px;
  text-transform: uppercase;
  background-color: #fff;
  text-align: center; }
  .shop-similar a {
    font-family: "reader bold";
    color: #333333;
    border-bottom: 2px solid #f9c606;
    display: inline-block;
    margin: 0 auto; }
  .shop-similar .seperator--horizontal {
    width: 87%;
    height: 5px;
    border-top: 3px dashed #eeeeee;
    margin: 40px auto 0 auto; }

/* -----Social Media ----- */
/*------------------------------------*\
    UTILITIES
\*------------------------------------*/
/*------------------------------------*\
    VARIABLES
\*------------------------------------*/
/* ----- Paths ----- */
/* ----- Colors ----- */
/* ----- Typography ----- */
/* ----- Responsive & Grid ----- */
/* ----- Layering ----- */
/* Animation delays */
/*3.2s;*/
/*------------------------------------*\
    MIXINS
\*------------------------------------*/
/* ----- Responsive ----- */
/*
 * Keyframe cycle
 */
/*
 * animation cycle
 */
/* ----- Fonts ----- */
/* ----- Misc ----- */
/*---------- Button -----------*/
/*------------------------------------*\
    TYPOGRAPHY
\*------------------------------------*/
.social-media-container {
  position: static; }

.social-media {
  transition: all 0.4s ease-in-out 2.2s;
  margin-top: 0;
  opacity: 1;
  background-color: #fff;
  text-align: center;
  padding-bottom: 42px;
  width: 100%; }
  @media only screen and (min-width: 760px) {
    .social-media {
      padding-bottom: 62px; } }
  .social-media__share-modal {
    margin-left: 0; }
  .social-media__list {
    display: block;
    text-align: center;
    width: 100%; }
    .social-media__list li {
      display: inline-block;
      padding: 0 10px;
      position: static; }
  .social-media__icon {
    border: 2px solid #f9c606;
    border-radius: 30px;
    display: inline-block;
    height: 56px;
    width: 56px;
    background-image: url("../images/social-icon-sprite.png");
    background-repeat: no-repeat;
    background-color: transparent;
    background-size: 109px;
    text-indent: -9999px;
    overflow: hidden; }
    .social-media__icon--save {
      background-position: 16px 10px; }
    .social-media__icon--share {
      background-position: -29px 11px; }
    .social-media__icon--retake {
      background-position: -74px 11px; }
    .social-media__icon--facebook {
      background-position: 19px -36px; }
    .social-media__icon--twiter {
      background-position: -25px -36px; }
    .social-media__icon--email {
      background-position: -70px -37px; }
  .social-media__link {
    display: inline-block; }
  .social-media__title {
    display: block;
    font-family: "Reader Bold";
    font-size: 14px;
    text-transform: uppercase;
    width: 76px;
    letter-spacing: 0.075em;
    padding-top: 13px; }
  .social-media__share-tooltip {
    background: #fff none repeat scroll 0 0;
    -webkit-transform: translate(-50%);
            transform: translate(-50%);
    padding: 45px 20px 20px;
    position: absolute;
    width: 300px;
    box-shadow: 6px 1px 45px 1px rgba(0, 0, 0, 0.2);
    z-index: 9; }
    .social-media__share-tooltip .close:before, .social-media__share-tooltip .close:after {
      background-color: #333;
      height: 30px; }

/* 
    on load animation
*/
body.inprogress .social-media {
  opacity: 0;
  margin-top: 1em !important; }

.social-media__share-tooltip .social-media__title {
  width: auto;
  position: relative;
  top: -23px;
  padding-top: 3px; }

.social-media__share-tooltip .close {
  right: 25px;
  top: 20px; }
  @media only screen and (min-width: 760px) {
    .social-media__share-tooltip .close {
      right: 5px;
      top: 21px; } }

.social-media__list--share .js-tooltip {
  border-width: 0; }

.social-media__list--share .js-tooltip__pointer {
  top: -19px;
  display: block !important; }

.save-results {
  display: block; }

/* ----- Quiz component styles ----- */
/*------------------------------------*\
    UTILITIES
\*------------------------------------*/
/*------------------------------------*\
    VARIABLES
\*------------------------------------*/
/* ----- Paths ----- */
/* ----- Colors ----- */
/* ----- Typography ----- */
/* ----- Responsive & Grid ----- */
/* ----- Layering ----- */
/* Animation delays */
/*3.2s;*/
/*------------------------------------*\
    MIXINS
\*------------------------------------*/
/* ----- Responsive ----- */
/*
 * Keyframe cycle
 */
/*
 * animation cycle
 */
/* ----- Fonts ----- */
/* ----- Misc ----- */
/*---------- Button -----------*/
/*------------------------------------*\
    TYPOGRAPHY
\*------------------------------------*/
#page #content {
  min-height: 300px; }

.dialog-overlay {
  z-index: 10008;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

.dialog-overlay .hidden {
  display: none; }

@media only screen and (min-width: 1024px) {
  .questions__question.effect:hover, .questions__question.effect:focus {
    background-color: #FFF6D2;
    border-bottom: 2px solid #FDE58B;
    margin-top: -2px;
    border-top: 2px solid #FDE58B; }
    .questions__question.effect:hover label, .questions__question.effect:focus label {
      font-family: "Reader Bold" !important; }
      .questions__question.effect:hover label:before, .questions__question.effect:focus label:before {
        border-color: #FDE58B !important; }
  .iPad .questions__question.effect:hover {
    background-color: #FFFFFF;
    border-bottom: 2px solid #E2E2E2;
    margin-top: 0;
    border-top: 0; }
    .iPad .questions__question.effect:hover label {
      font-family: inherit !important; }
      .iPad .questions__question.effect:hover label:before {
        border-color: #E2E2E2 !important; } }

.questions {
  width: 100%;
  height: 272px;
  margin: auto;
  list-style-type: none;
  font-size: 0;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  padding: 0px 25px; }
  .questions__question {
    text-align: left;
    cursor: pointer;
    background: white;
    font-size: 14px;
    padding: 5px;
    border-bottom: 2px solid #e2e2e2;
    width: 100%;
    position: relative; }
    .questions__question input {
      position: absolute;
      width: 1px;
      height: 1px;
      display: block;
      top: -199999px; }
    .questions__question input:focus + label {
      font-family: "Reader Bold" !important; }
      .questions__question input:focus + label:before {
        border-color: #FDE58B !important; }
    .questions__question label:before {
      border-radius: 100%; }
    .questions__question.selected__ans {
      background-color: #FFF6D2;
      border-bottom: 2px solid #FDE58B;
      margin-top: -2px;
      border-top: 2px solid #FDE58B; }
      .questions__question.selected__ans label {
        font-family: "Reader Bold" !important; }
        .questions__question.selected__ans label:before {
          border-color: #FDE58B !important; }
    .questions__question.selected__ans {
      -webkit-animation-name: blinker;
      -webkit-animation-duration: 0.1s;
      -webkit-animation-timing-function: linear;
      -webkit-animation-iteration-count: 1;
      -moz-animation-name: blinker;
      -moz-animation-duration: 0.1s;
      -moz-animation-timing-function: linear;
      -moz-animation-iteration-count: 1;
      animation-name: blinker;
      animation-duration: 0.1s;
      animation-timing-function: linear;
      animation-iteration-count: 1; }

@-webkit-keyframes blinker {
  0% {
    opacity: 1.0; }
  50% {
    opacity: 0.9; }
  100% {
    opacity: 1.0; } }

@keyframes blinker {
  0% {
    opacity: 1.0; }
  50% {
    opacity: 0.9; }
  100% {
    opacity: 1.0; } }
    .questions__question:first-child {
      border-top: 0 !important;
      margin-top: 0 !important; }
    .questions__question:last-child {
      border-bottom: 0 !important; }
  .questions__suggestions {
    position: absolute;
    margin: auto;
    width: 100%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    left: 50%; }
    .questions__suggestions input[type=checkbox]:checked + label:after {
      left: 30px;
      background-color: #FDE58B;
      top: 50%;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
      border-radius: 100%;
      width: 12px;
      height: 12px; }
    .questions__suggestions label {
      display: table-cell !important;
      vertical-align: middle !important;
      padding-left: 60px !important;
      padding-right: 20px;
      font-family: "Reader Regular";
      font-size: 14px;
      line-height: 19px;
      color: #333333; }
      .questions__suggestions label:before {
        margin: auto 20px;
        bottom: 0;
        width: 20px !important;
        height: 20px !important;
        border: 3px; }

.quiz-slots {
  max-width: 528px;
  margin: 0 auto; }

.quiz-question {
  font-family: "Reader Regular";
  padding: 0 25px;
  font-size: 37px;
  line-height: 48px;
  color: white;
  margin-bottom: 20px;
  letter-spacing: 0.025em; }

.quiz {
  width: 700%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto; }
  .quiz .strike {
    width: 60% !important;
    position: relative;
    margin: 0 auto 18px; }
    .quiz .strike img {
      height: 100%;
      position: absolute; }
    .quiz .strike span {
      height: 57px;
      width: 30px; }
      .quiz .strike span:before, .quiz .strike span:after {
        opacity: 0.2; }
      .quiz .strike span:before {
        margin-right: 15px; }
      .quiz .strike span:after {
        margin-left: 15px; }
  .quiz h5 {
    font-family: "Reader Bold";
    font-size: 12px;
    color: #f9c606;
    text-transform: uppercase;
    margin-bottom: 15px;
    font-family: "Reader Bold";
    letter-spacing: 0.1em; }

input[type=checkbox] + label:before, input[type=radio] + label:before {
  /* border-color: #e2e2e2;*/
  border: 3px solid #e2e2e2; }

input[type=checkbox]:checked + label:before, input[type=radio]:checked + label:before {
  border: 3px solid #FDE58B;
  color: #FDE58B; }

.quiz-content {
  position: relative;
  float: left;
  width: 1366px; }

.dialog {
  display: none; }

.startover__container {
  margin-top: 20px;
  display: none; }
  .startover__container img {
    position: relative;
    top: 3px;
    padding-left: 20px; }
  .startover__container .startover {
    color: white;
    font-size: 12px;
    font-family: "Reader Bold";
    text-transform: uppercase;
    padding-left: 10px;
    letter-spacing: 0.1em; }

.disp--inlineblock {
  display: inline-block !important;
  -webkit-animation: fadein 0.7s;
  /* Safari, Chrome and Opera > 12.1 */
  /* Firefox < 16 */
  /* Internet Explorer */
  /* Opera < 12.1 */
  animation: fadein 0.7s; }

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

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

.question--sprite {
  background-image: url(../images/mobQuestionIcons.png);
  background-repeat: no-repeat;
  display: inline-block;
  position: absolute;
  left: 50%;
  right: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%); }

.q1 {
  width: 35px;
  height: 30px;
  background-position: -5px -5px; }
  .q1 + span {
    width: 35px !important; }

.q2 {
  width: 24px;
  height: 43px;
  background-position: -50px -5px; }
  .q2 + span {
    width: 24px !important; }

.q3 {
  width: 62px;
  height: 39px;
  background-position: -84px -5px; }
  .q3 + span {
    width: 62px !important; }

.q4 {
  width: 46px;
  height: 41px;
  background-position: -156px -5px; }
  .q4 + span {
    width: 46px !important; }

.q5 {
  width: 45px;
  height: 41px;
  background-position: -212px -5px; }
  .q5 + span {
    width: 45px !important; }

.q6 {
  width: 61px;
  height: 33px;
  background-position: -267px -5px; }
  .q6 + span {
    width: 61px !important; }

.q7 {
  width: 32px;
  height: 46px;
  background-position: -338px -5px; }
  .q7 + span {
    width: 32px !important; }

/*@media only screen and (max-width: 340px) {
 .quiz {
 max-height: 430px;
 }
}
@media only screen and (min-width: 550px) {
 .quiz {
 max-height: 270px;
 }
}
@media only screen and (min-width: 625px) {
 .quiz {
 max-height: 320px;
 }
}
@media only screen and (min-width: 685px) {
 .quiz {
 max-height: 350px;
 }
}*/
@media only screen and (min-width: 760px) {
  /* .quiz {
         max-height: 100%;
     }*/
  .startover__container {
    margin-top: 25px; }
    .startover__container .startover {
      font-size: 16px;
      letter-spacing: 0.075em; }
  .quiz .strike {
    margin: 0 auto 20px;
    width: 25% !important;
    height: 65px; }
    .quiz .strike span {
      height: 65px; }
  .quiz h5 {
    margin-bottom: 50px;
    font-size: 16px;
    letter-spacing: 0.075em; }
  .quiz-question {
    margin-bottom: 40px;
    font-size: 56px;
    line-height: 73px; }
  .questions__suggestions label {
    font-size: 16px;
    line-height: 24px; }
  .question--sprite {
    background-image: url(../images/questionIcons.png);
    background-repeat: no-repeat;
    display: inline-block;
    position: absolute;
    left: 50%;
    right: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%); }
    .question--sprite + span {
      width: 74px !important; }
  .q1 {
    width: 74px;
    height: 66px;
    background-position: -5px -5px; }
  .q2 {
    width: 74px;
    height: 66px;
    background-position: -89px -5px; }
  .q3 {
    width: 74px;
    height: 66px;
    background-position: -173px -5px; }
  .q4 {
    width: 74px;
    height: 66px;
    background-position: -257px -5px; }
  .q5 {
    width: 74px;
    height: 66px;
    background-position: -341px -5px; }
  .q6 {
    width: 74px;
    height: 66px;
    background-position: -425px -5px; }
  .q7 {
    width: 74px;
    height: 66px;
    background-position: -509px -5px; } }

.tab-hidden {
  visibility: hidden !important; }

.tab-complete-hidden {
  display: none !important; }

/*@media only screen and (min-height: 630px) and (min-width:1024px) {*/
/* .quiz {
 max-height: 530px !important;
 }*/
.dialog {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  height: auto !important; }

/*}*/
/*iPad specific css*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  .iPad .dialog-overlay .startover__container {
    -webkit-transform: scale(1.5);
            transform: scale(1.5);
    margin-left: 30px;
    margin-top: 30px; }
  .iPad .dialog-overlay .close {
    -webkit-transform: scale(1.5);
            transform: scale(1.5);
    right: 14px;
    top: 23px; }
  .iPad .dialog {
    -webkit-transform: scale(1.5) translate(-50%, -50%);
            transform: scale(1.5) translate(-50%, -50%);
    left: 75%;
    top: 58%; }
    .iPad .dialog .quiz-question {
      padding: 0 300px !important; } }

body.quizpage-hidden {
  padding-top: 0 !important; }