/**
* Essential sass includes 
*/
/*------------------------------------*    #TYPOGRAPHY
\*------------------------------------*/
/**
*utilities
*/
/* * Use this mixin for text style */
/*
* Use this mixin for tablet and desktop specific styling
*/
/** 
* Gillsans & tiempos Font 
*/
/**
* Colour Palette 
*/
/*** Variables as per SG ***/
/*-----------------------------------------------------------*  import partial styling for slot-home-main-02, .certona-recommendation-slot 
\*------------------------------------------------------------*/
.slot-home-main-02 h2, .certona-recommendation-slot h2 {
  text-transform: uppercase;
  text-align: center; }
  @media only screen and (min-width: 768px) {
    .slot-home-main-02 h2, .certona-recommendation-slot h2 {
      margin-top: 55px;
      margin-bottom: 26px;
      font-family: "Neue Helvetica for Speedo Bd", Helvetica, Arial, sans-serif;
      color: #323232;
      font-size: 2rem;
      line-height: 32px;
      letter-spacing: 2px; } }
  @media only screen and (max-width: 767px) {
    .slot-home-main-02 h2, .certona-recommendation-slot h2 {
      margin-top: 22px;
      margin-bottom: 20px;
      font-family: "Neue Helvetica for Speedo Bd", Helvetica, Arial, sans-serif;
      color: #323232;
      font-size: 1.125rem;
      line-height: 32px;
      letter-spacing: 1.35px; } }

.slot-home-main-02 .secondaryImg-container, .certona-recommendation-slot .secondaryImg-container {
  width: 100%;
  position: absolute; }
  @media (max-width: 767px) {
    .slot-home-main-02 .secondaryImg-container, .certona-recommendation-slot .secondaryImg-container {
      display: none !important; } }
  @media only screen and (min-width: 768px) {
    .slot-home-main-02 .secondaryImg-container, .certona-recommendation-slot .secondaryImg-container {
      min-height: 280px; } }

@media only screen and (max-width: 767px) {
  .slot-home-main-02 .recommendationsContainer, .slot-home-main-02 .hpCarouselBg, .certona-recommendation-slot .recommendationsContainer, .certona-recommendation-slot .hpCarouselBg {
    text-align: center; } }

.slot-home-main-02 .recommendationsContainer .firstImg-container, .slot-home-main-02 .hpCarouselBg .firstImg-container, .certona-recommendation-slot .recommendationsContainer .firstImg-container, .certona-recommendation-slot .hpCarouselBg .firstImg-container {
  margin: 0 auto;
  position: relative; }

.slot-home-main-02 .recommendationsContainer .carouselItem, .slot-home-main-02 .hpCarouselBg .carouselItem, .certona-recommendation-slot .recommendationsContainer .carouselItem, .certona-recommendation-slot .hpCarouselBg .carouselItem {
  position: relative;
  text-align: center; }

@media (min-width: 768px) {
  .slot-home-main-02 .recommendationsContainer li, .slot-home-main-02 .hpCarouselBg li, .certona-recommendation-slot .recommendationsContainer li, .certona-recommendation-slot .hpCarouselBg li {
    position: relative;
    min-height: 1px;
    padding-left: 10px;
    padding-right: 10px;
    float: left;
    width: 25%; } }

@media only screen and (min-width: 768px) {
  .slot-home-main-02 .recommendationsContainer li, .slot-home-main-02 .hpCarouselBg li, .certona-recommendation-slot .recommendationsContainer li, .certona-recommendation-slot .hpCarouselBg li {
    float: none;
    display: inline-table; } }

@media only screen and (max-width: 767px) {
  .slot-home-main-02 .recommendationsContainer li, .slot-home-main-02 .hpCarouselBg li, .certona-recommendation-slot .recommendationsContainer li, .certona-recommendation-slot .hpCarouselBg li {
    position: relative;
    float: left;
    width: 50%;
    min-height: 1px;
    padding-left: 10px;
    padding-right: 10px; } }

.slot-home-main-02 .recommendationsContainer .carouselItemTitle, .slot-home-main-02 .hpCarouselBg .carouselItemTitle, .certona-recommendation-slot .recommendationsContainer .carouselItemTitle, .certona-recommendation-slot .hpCarouselBg .carouselItemTitle {
  margin-top: 17px; }

.slot-home-main-02 .recommendationsContainer .carouselItemTitle, .slot-home-main-02 .recommendationsContainer .carouselItemPrice, .slot-home-main-02 .recommendationsContainer .pro-name, .slot-home-main-02 .hpCarouselBg .carouselItemTitle, .slot-home-main-02 .hpCarouselBg .carouselItemPrice, .slot-home-main-02 .hpCarouselBg .pro-name, .certona-recommendation-slot .recommendationsContainer .carouselItemTitle, .certona-recommendation-slot .recommendationsContainer .carouselItemPrice, .certona-recommendation-slot .recommendationsContainer .pro-name, .certona-recommendation-slot .hpCarouselBg .carouselItemTitle, .certona-recommendation-slot .hpCarouselBg .carouselItemPrice, .certona-recommendation-slot .hpCarouselBg .pro-name {
  margin-bottom: 0; }
  @media only screen and (max-width: 767px) {
    .slot-home-main-02 .recommendationsContainer .carouselItemTitle, .slot-home-main-02 .recommendationsContainer .carouselItemPrice, .slot-home-main-02 .recommendationsContainer .pro-name, .slot-home-main-02 .hpCarouselBg .carouselItemTitle, .slot-home-main-02 .hpCarouselBg .carouselItemPrice, .slot-home-main-02 .hpCarouselBg .pro-name, .certona-recommendation-slot .recommendationsContainer .carouselItemTitle, .certona-recommendation-slot .recommendationsContainer .carouselItemPrice, .certona-recommendation-slot .recommendationsContainer .pro-name, .certona-recommendation-slot .hpCarouselBg .carouselItemTitle, .certona-recommendation-slot .hpCarouselBg .carouselItemPrice, .certona-recommendation-slot .hpCarouselBg .pro-name {
      font-family: "Neue Helvetica for Speedo Bd", Helvetica, Arial, sans-serif;
      color: #323232;
      font-size: 0.625rem;
      line-height: 12px;
      letter-spacing: 0px; } }
  @media only screen and (min-width: 768px) {
    .slot-home-main-02 .recommendationsContainer .carouselItemTitle, .slot-home-main-02 .recommendationsContainer .carouselItemPrice, .slot-home-main-02 .recommendationsContainer .pro-name, .slot-home-main-02 .hpCarouselBg .carouselItemTitle, .slot-home-main-02 .hpCarouselBg .carouselItemPrice, .slot-home-main-02 .hpCarouselBg .pro-name, .certona-recommendation-slot .recommendationsContainer .carouselItemTitle, .certona-recommendation-slot .recommendationsContainer .carouselItemPrice, .certona-recommendation-slot .recommendationsContainer .pro-name, .certona-recommendation-slot .hpCarouselBg .carouselItemTitle, .certona-recommendation-slot .hpCarouselBg .carouselItemPrice, .certona-recommendation-slot .hpCarouselBg .pro-name {
      font-family: "Neue Helvetica for Speedo Bd", Helvetica, Arial, sans-serif;
      color: #323232;
      font-size: 0.9375rem;
      line-height: 20px;
      letter-spacing: 0px; } }

.slot-home-main-02 .recommendationsContainer .price, .slot-home-main-02 .hpCarouselBg .price, .certona-recommendation-slot .recommendationsContainer .price, .certona-recommendation-slot .hpCarouselBg .price {
  color: #323232; }

.slot-home-main-02 .revooRecommend, .certona-recommendation-slot .revooRecommend {
  margin: 0 auto; }

/**
* Essential sass includes 
*/
/*------------------------------------*    #TYPOGRAPHY
\*------------------------------------*/
/**
*utilities
*/
/* * Use this mixin for text style */
/*
* Use this mixin for tablet and desktop specific styling
*/
/** 
* Gillsans & tiempos Font 
*/
/**
* Colour Palette 
*/
/*** Variables as per SG ***/
.recommendationsContainer, .hpCarouselBg {
  padding: 0;
  max-width: inherit; }
  @media only screen and (min-width: 768px) {
    .recommendationsContainer .mobile, .hpCarouselBg .mobile {
      text-align: center;
      font-size: 0; } }
  @media only screen and (max-width: 767px) {
    .recommendationsContainer .mobile, .hpCarouselBg .mobile {
      padding-left: 0;
      padding-right: 0; } }
  @media only screen and (min-width: 768px) {
    .recommendationsContainer .slides, .hpCarouselBg .slides {
      text-align: center;
      font-size: 0; } }
  @media only screen and (max-width: 767px) {
    .recommendationsContainer .slides, .hpCarouselBg .slides {
      padding-left: 10px;
      padding-right: 10px; } }
  .recommendationsContainer .slide, .hpCarouselBg .slide {
    text-align: center; }
    @media (min-width: 768px) {
      .recommendationsContainer .slide, .hpCarouselBg .slide {
        position: relative;
        min-height: 1px;
        padding-left: 10px;
        padding-right: 10px;
        float: left;
        width: 25%; } }
    @media only screen and (min-width: 768px) {
      .recommendationsContainer .slide, .hpCarouselBg .slide {
        float: none;
        display: inline-block; } }
    @media only screen and (max-width: 767px) {
      .recommendationsContainer .slide, .hpCarouselBg .slide {
        position: relative;
        float: left;
        width: 50%;
        min-height: 1px;
        padding-left: 10px;
        padding-right: 10px; } }
    .recommendationsContainer .slide .reevooRecommendationBadgeDesktop, .hpCarouselBg .slide .reevooRecommendationBadgeDesktop {
      margin: 0 auto;
      padding: 0;
      min-height: 36px; }
    .recommendationsContainer .slide .reevoomark_badge, .hpCarouselBg .slide .reevoomark_badge {
      margin: 0 auto; }
    .recommendationsContainer .slide .reevooRecommendationBadgeMobile, .hpCarouselBg .slide .reevooRecommendationBadgeMobile {
      padding: 0;
      min-height: 46px; }
    .recommendationsContainer .slide .carouselItem, .hpCarouselBg .slide .carouselItem {
      width: 100%;
      margin: 5px auto;
      margin-top: 5px;
      padding: 0;
      min-height: inherit; }
      .recommendationsContainer .slide .carouselItem:hover, .hpCarouselBg .slide .carouselItem:hover {
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none; }
      .recommendationsContainer .slide .carouselItem a, .hpCarouselBg .slide .carouselItem a {
        display: block; }
        @media only screen and (min-width: 768px) {
          .recommendationsContainer .slide .carouselItem a, .hpCarouselBg .slide .carouselItem a {
            padding-bottom: 5px; } }
        @media only screen and (max-width: 767px) {
          .recommendationsContainer .slide .carouselItem a, .hpCarouselBg .slide .carouselItem a {
            padding-bottom: 3px; } }
      @media only screen and (min-width: 768px) {
        .recommendationsContainer .slide .carouselItem .firstImg-container, .hpCarouselBg .slide .carouselItem .firstImg-container {
          max-height: 280px;
          max-width: 280px;
          margin: 0 auto; } }
      @media only screen and (max-width: 767px) {
        .recommendationsContainer .slide .carouselItem .firstImg-container, .hpCarouselBg .slide .carouselItem .firstImg-container {
          max-height: 140px;
          max-width: 140px;
          margin: 0 auto; } }
      .recommendationsContainer .slide .carouselItem .secondaryImg-container, .hpCarouselBg .slide .carouselItem .secondaryImg-container {
        width: 100%; }
        @media only screen and (min-width: 768px) {
          .recommendationsContainer .slide .carouselItem .secondaryImg-container, .hpCarouselBg .slide .carouselItem .secondaryImg-container {
            max-height: 280px; } }
        @media only screen and (max-width: 767px) {
          .recommendationsContainer .slide .carouselItem .secondaryImg-container, .hpCarouselBg .slide .carouselItem .secondaryImg-container {
            max-height: 140px; } }
      @media only screen and (min-width: 768px) {
        .recommendationsContainer .slide .carouselItem img, .hpCarouselBg .slide .carouselItem img {
          max-height: 280px; } }
      @media only screen and (max-width: 767px) {
        .recommendationsContainer .slide .carouselItem img, .hpCarouselBg .slide .carouselItem img {
          max-height: 140px; } }
      .recommendationsContainer .slide .carouselItem .carouselItemTitle, .hpCarouselBg .slide .carouselItem .carouselItemTitle {
        height: auto;
        padding: 0;
        color: #152935;
        font-size: 16px; }
        @media only screen and (min-width: 768px) {
          .recommendationsContainer .slide .carouselItem .carouselItemTitle, .hpCarouselBg .slide .carouselItem .carouselItemTitle {
            font-family: "Neue Helvetica for Speedo Bd", Helvetica, Arial, sans-serif;
            color: #152935;
            font-size: 1rem;
            line-height: 20px;
            letter-spacing: 0px;
            margin: 17px 0 14px 0;
            padding-left: 5px;
            padding-right: 5px;
            overflow: hidden; } }
        @media only screen and (max-width: 767px) {
          .recommendationsContainer .slide .carouselItem .carouselItemTitle, .hpCarouselBg .slide .carouselItem .carouselItemTitle {
            font-family: "Neue Helvetica for Speedo Bd", Helvetica, Arial, sans-serif;
            color: #152935;
            font-size: 0.625rem;
            line-height: 12px;
            letter-spacing: 0px;
            margin: 8px 0 8px 0;
            overflow: hidden; } }
      .recommendationsContainer .slide .carouselItem .carouselItemPrice, .hpCarouselBg .slide .carouselItem .carouselItemPrice {
        margin: 0; }
        @media only screen and (min-width: 768px) {
          .recommendationsContainer .slide .carouselItem .carouselItemPrice .price-sales, .hpCarouselBg .slide .carouselItem .carouselItemPrice .price-sales {
            font-family: "Neue Helvetica for Speedo Rg", Helvetica, Arial, sans-serif;
            color: #152935;
            font-size: 1rem;
            line-height: 20px;
            letter-spacing: 0px; } }
        @media only screen and (max-width: 767px) {
          .recommendationsContainer .slide .carouselItem .carouselItemPrice .price-sales, .hpCarouselBg .slide .carouselItem .carouselItemPrice .price-sales {
            font-family: "Neue Helvetica for Speedo Rg", Helvetica, Arial, sans-serif;
            color: #152935;
            font-size: 0.625rem;
            line-height: 12px;
            letter-spacing: 0px; } }
        @media only screen and (min-width: 768px) {
          .recommendationsContainer .slide .carouselItem .carouselItemPrice .price-standard, .hpCarouselBg .slide .carouselItem .carouselItemPrice .price-standard {
            font-family: "Neue Helvetica for Speedo Bd", Helvetica, Arial, sans-serif;
            color: #EE3224;
            font-size: 0.75rem;
            line-height: 20px;
            letter-spacing: 0px; } }
        @media only screen and (max-width: 767px) {
          .recommendationsContainer .slide .carouselItem .carouselItemPrice .price-standard, .hpCarouselBg .slide .carouselItem .carouselItemPrice .price-standard {
            font-family: "Neue Helvetica for Speedo Bd", Helvetica, Arial, sans-serif;
            color: #EE3224;
            font-size: 0.625rem;
            line-height: 12px;
            letter-spacing: 0px; } }

.cartRecommendations .recommendationsContainer {
  padding: 0; }
  @media only screen and (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
    .cartRecommendations .recommendationsContainer {
      padding: 0 20px; } }
  .cartRecommendations .recommendationsContainer .slide {
    padding: 0; }
    .cartRecommendations .recommendationsContainer .slide .carouselItem {
      position: relative;
      width: 180px;
      margin: 0 auto; }
    .cartRecommendations .recommendationsContainer .slide:hover {
      background: #fff; }

.speedoBasket section#productRecommendationsCarousel {
  max-width: 1024px; }
  @media screen and (min-device-width: 200px) and (max-device-width: 767px) {
    .speedoBasket section#productRecommendationsCarousel {
      padding-bottom: 0px; } }

.speedoBasket .mainWrapper {
  max-width: 1024px; }
  @media screen and (min-device-width: 200px) and (max-device-width: 767px) {
    .speedoBasket .mainWrapper .carouselTitle {
      display: none; } }
  .speedoBasket .mainWrapper .recommendations {
    min-height: auto; }
    @media screen and (min-device-width: 200px) and (max-device-width: 767px) {
      .speedoBasket .mainWrapper .recommendations {
        padding-top: 10px; } }
    .speedoBasket .mainWrapper .recommendations .carouselTitle.recommendationsTitle {
      margin-top: 5px;
      margin-bottom: 17px;
      font-size: 20px;
      color: #42515B; }
    .speedoBasket .mainWrapper .recommendations .cartRecommendationLists .recommendationsContainer {
      padding-left: 0;
      padding-right: 0;
      /*Tablet*/
      /*Mobile*/
      padding-left: 0px;
      padding-right: 0px; }
      @media screen and (max-width: 1023px) {
        .speedoBasket .mainWrapper .recommendations .cartRecommendationLists .recommendationsContainer {
          max-width: 100%; } }
      @media screen and (max-width: 767px) {
        .speedoBasket .mainWrapper .recommendations .cartRecommendationLists .recommendationsContainer {
          max-width: 100%; } }
      @media screen and (min-device-width: 768px) and (max-device-width: 1023px) {
        .speedoBasket .mainWrapper .recommendations .cartRecommendationLists .recommendationsContainer .mobile {
          width: 100% !important;
          background: #ebebeb; } }
      @media screen and (min-device-width: 200px) and (max-device-width: 767px) {
        .speedoBasket .mainWrapper .recommendations .cartRecommendationLists .recommendationsContainer .mobile {
          width: 100% !important;
          background-color: #fff;
          border-right: 0;
          border-left: 0; } }
      .speedoBasket .mainWrapper .recommendations .cartRecommendationLists .recommendationsContainer .mobile li {
        list-style: none; }
      @media screen and (min-device-width: 768px) and (max-device-width: 1023px) {
        .speedoBasket .mainWrapper .recommendations .cartRecommendationLists .recommendationsContainer .slides {
          width: 100% !important;
          background: #ebebeb; } }
      @media screen and (min-device-width: 200px) and (max-device-width: 767px) {
        .speedoBasket .mainWrapper .recommendations .cartRecommendationLists .recommendationsContainer .slides {
          width: 100% !important;
          background-color: #fff;
          border-right: 10px solid #eee;
          border-left: 10px solid #eee; } }
      .speedoBasket .mainWrapper .recommendations .cartRecommendationLists .recommendationsContainer .carouselItem {
        width: 236px; }
        @media screen and (max-width: 1023px) {
          .speedoBasket .mainWrapper .recommendations .cartRecommendationLists .recommendationsContainer .carouselItem {
            width: 100%; } }
        @media screen and (max-width: 767px) {
          .speedoBasket .mainWrapper .recommendations .cartRecommendationLists .recommendationsContainer .carouselItem .firstImg-container {
            max-height: 100%;
            max-width: 100%; } }
        .speedoBasket .mainWrapper .recommendations .cartRecommendationLists .recommendationsContainer .carouselItem img {
          height: 234px;
          width: 236px; }
          @media screen and (max-width: 1023px) {
            .speedoBasket .mainWrapper .recommendations .cartRecommendationLists .recommendationsContainer .carouselItem img {
              width: 172px;
              height: 172px; } }
          @media screen and (max-width: 767px) {
            .speedoBasket .mainWrapper .recommendations .cartRecommendationLists .recommendationsContainer .carouselItem img {
              height: 157px;
              min-width: 157px;
              max-width: 100%; } }
          @media screen and (min-device-width: 200px) and (max-device-width: 374px) {
            .speedoBasket .mainWrapper .recommendations .cartRecommendationLists .recommendationsContainer .carouselItem img {
              min-width: 150px; } }
      .speedoBasket .mainWrapper .recommendations .cartRecommendationLists .recommendationsContainer .slide {
        margin-left: 10px;
        margin-right: 10px;
        background-color: #fff;
        width: 236px !important;
        height: 363px;
        /*Tablet*/
        /*Mobile*/ }
        @media screen and (max-width: 1023px) {
          .speedoBasket .mainWrapper .recommendations .cartRecommendationLists .recommendationsContainer .slide {
            width: 170px !important;
            height: 325px;
            margin-left: 10px;
            margin-right: 12px; } }
        @media screen and (max-width: 767px) {
          .speedoBasket .mainWrapper .recommendations .cartRecommendationLists .recommendationsContainer .slide {
            width: 44% !important;
            margin-right: 10px;
            margin-left: 10px;
            height: auto; } }
        @media screen and (min-device-width: 200px) and (max-device-width: 374px) {
          .speedoBasket .mainWrapper .recommendations .cartRecommendationLists .recommendationsContainer .slide {
            width: 150px !important; } }

.formWrapper .wrapper {
  padding-left: 0px;
  padding-right: 0px; }

.recommendations .recommendationsContainer {
  padding: 0 20px;
  margin: 0 auto; }
