/* BASE */
/* ============================= */
/* ========= reset css ========= */
/* ============================= */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
  list-style: none; }

a, a:active, a:hover, a:focus {
  outline: none; }

* {
  box-sizing: border-box; }

/* ============================= */
/* ========= HTML5 DISPLAY RULE ========= */
/* ============================= */
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, nav, menu, section, summary {
  display: block; }

/* VARIABLES */
/********************/
/*** VARIABLES ***/
/********************/
/********************/
/*** Z-INDEX ***/
/********************/
#header {
  z-index: 9999; }

/********************/
/*** BREAK QUERYS ***/
/********************/
/********************/
/*** COLORS ***/
/********************/
/********************/
/*** BUTTONS ***/
/********************/
.btn {
  font-weight: bold;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 0; }
  @media all and (min-width: 991px) {
    .btn {
      padding: 8px 30px; } }
  .btn:hover {
    opacity: 1; }
  .btn.btn-default {
    color: #e52a1b;
    border-color: #e52a1b;
    background: #ffffff; }
    .btn.btn-default:hover {
      background: #e52a1b;
      color: #ffffff; }
  .btn.btn-answer {
    color: #ffffff;
    border-color: #e52a1b;
    background: #e52a1b;
    border-radius: 5px;
    font-weight: normal;
    text-transform: none; }
    .btn.btn-answer:hover {
      background: #ffffff;
      color: #e52a1b; }

/* REGIONS */
/* ============================= */
/* ========= STRUCTURE ========= */
/* ============================= */
html, body {
  background: #ffffff;
  color: #6a6a6a;
  font-family: "adobe-garamond-pro";
  font-size: 16px;
  font-weight: normal; }
  html img, body img {
    width: auto;
    height: auto;
    max-width: 100%; }
  html p, body p {
    display: block;
    margin-bottom: 20px; }
    html p a, body p a {
      color: #6a6a6a;
      text-decoration: underline; }
      html p a:hover, body p a:hover {
        color: #6a6a6a;
        text-decoration: none; }

/* ============================= */
/* ========= SITE / HEADER / CONTAINERs ========= */
/* ============================= */
.site {
  overflow: hidden;
  position: relative;
  width: 100%;
  height: auto;
  margin: 0 auto;
  padding: 0 2% 2%;
  background: #ffffff; }
  .site #header {
    position: fixed;
    top: 0;
    left: 2%;
    right: 2%;
    width: auto;
    height: 45px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: 0 5px 5px -5px rgba(0, 0, 0, 0.1);
    display: block;
    background: #ffffff; }
    .site #header .siteLogo {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      width: 380px;
      height: 114px;
      margin: 0 auto;
      text-indent: -9000px;
      background: url("../images/logo_header.png") no-repeat center -1px; }
      .site #header .siteLogo a {
        display: block;
        width: 100%;
        height: 100%; }
  .site #site-container {
    overflow: hidden;
    display: block;
    width: 100%;
    height: auto;
    padding-top: 45px;
    padding-bottom: 45px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.1);
    background: url("../images/bg_site.jpg") no-repeat center bottom;
    background-size: cover; }
  .site #content {
    display: block;
    background: url("../images/logo_ferrero.png") no-repeat 30px bottom;
    background-size: auto;
    padding-bottom: 40px; }
  @media all and (min-width: 0px) and (max-width: 991px) {
    .site {
      margin: 0 auto;
      padding: 0; }
      .site #header {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        height: 45px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
        box-shadow: 0 3px 3px -3px rgba(0, 0, 0, 0.2); }
        .site #header .siteLogo {
          width: 61vw;
          height: 80px;
          background: url("../images/logo_header-mob.png") no-repeat center center;
          background-size: auto 100%; }
          .site #header .siteLogo a {
            display: block; }
      .site #site-container {
        border: 0;
        display: block; }
      .site #content {
        display: block;
        background-position: center bottom; } }

/*** NAV SITE RESET ***/
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
  background-color: initial; }

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .open > a {
  background-image: initial;
  box-shadow: none; }

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
  background-image: initial;
  box-shadow: none; }

.navbar-brand, .navbar-nav > li > a {
  text-shadow: none; }

/********************/
/*** NAV SITE ***/
/********************/
#navSite {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  text-align: center; }
  #navSite .navbar-default {
    position: relative;
    box-shadow: none;
    border-radius: 0;
    border: 0;
    margin: 0;
    background-image: none;
    background: rgba(255, 255, 255, 0);
    border-bottom: 0px solid #fafafa; }
  #navSite .navbar-default .navbar-toggle {
    display: block;
    position: absolute;
    right: 2%;
    top: 0;
    border-radius: 0;
    border: 0; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #navSite .navbar-default .navbar-toggle {
        right: 0; } }
    #navSite .navbar-default .navbar-toggle .icon-bar {
      background: #797979; }
    #navSite .navbar-default .navbar-toggle .icon-bar:nth-child(2) {
      width: 25px;
      transition: width .5s linear; }
    #navSite .navbar-default .navbar-toggle .icon-bar:nth-child(3) {
      width: 30px;
      transition: width .5s linear; }
    #navSite .navbar-default .navbar-toggle .icon-bar:nth-child(4) {
      width: 22px;
      transition: width .5s linear; }
  #navSite .navbar-default .navbar-toggle:hover {
    background: none; }
    #navSite .navbar-default .navbar-toggle:hover .icon-bar:nth-child(2) {
      width: 30px; }
    #navSite .navbar-default .navbar-toggle:hover .icon-bar:nth-child(3) {
      width: 30px; }
    #navSite .navbar-default .navbar-toggle:hover .icon-bar:nth-child(4) {
      width: 30px; }
  #navSite .navbar-default .navbar-toggle:active,
  #navSite .navbar-default .navbar-toggle:focus {
    background: none; }
  #navSite .navbar-default .in .navbar-toggle:active {
    background: none; }
    #navSite .navbar-default .in .navbar-toggle:active .icon-bar:nth-child(2) {
      width: 30px; }
    #navSite .navbar-default .in .navbar-toggle:active .icon-bar:nth-child(3) {
      width: 30px; }
    #navSite .navbar-default .in .navbar-toggle:active .icon-bar:nth-child(4) {
      width: 30px; }
  #navSite .navbar-brand {
    display: table;
    float: none;
    margin: 0 auto;
    padding: 10px; }
  #navSite .navbar-brand img {
    width: 80px; }
  #navSite #bs-navsite-collapse {
    overflow: hidden;
    margin: 45px 0 0;
    padding-top: 10vh;
    height: calc(100vh - 46px);
    background: #ffffff;
    -webkit-transition: height .2s linear;
    -o-transition: height .2s linear;
    transition: height .2s linear; }
    @media all and (orientation: landscape) {
      #navSite #bs-navsite-collapse {
        padding-top: 5vw; } }
  #navSite .navbar-nav {
    float: none; }
  #navSite .navbar-nav > li {
    float: none; }
  #navSite .navbar-nav > li > a {
    font-size: 6vh;
    line-height: 6vh;
    color: #8f908e;
    font-weight: bold; }
    @media all and (orientation: landscape) {
      #navSite .navbar-nav > li > a {
        font-size: 3.5vw;
        line-height: 3.5vw;
        padding: 1vw 0; } }
    #navSite .navbar-nav > li > a:hover {
      color: #e52a1b;
      opacity: 1; }
  #navSite .navbar-nav > li.active > a {
    color: #e52a1b; }

/********************/
/*** HEADER ***/
/********************/
#header .siteLogo a {
  display: block;
  cursor: pointer; }

/* ============================= */
/* ========= CONTACT US ========= */
/* ============================= */
#footer {
  background-image: none;
  background-color: #ffffff; }
  @media all and (min-width: 991px) {
    #footer {
      padding: 20px 0 20px; } }
  @media all and (min-width: 0px) and (max-width: 991px) {
    #footer {
      padding: 5vw 0; } }
  #footer ul li {
    display: inline;
    font-size: 11px;
    line-height: 12px;
    text-transform: uppercase; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #footer ul li {
        font-size: 2.7vw; } }
    #footer ul li strong {
      font-size: 11px;
      line-height: 12px; }
    #footer ul li a {
      color: #6a6a6a; }
      @media all and (min-width: 0px) and (max-width: 767px) {
        #footer ul li a {
          font-size: 2.7vw; } }

/* BLOCKS */
/********************/
/*** BANNER ***/
/********************/
#banner {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: auto;
  margin-bottom: 40px; }
  @media all and (min-width: 0px) and (max-width: 767px) {
    #banner {
      max-height: none;
      margin-bottom: 10vw; } }
  #banner > img {
    width: 100%; }
  #banner .banner-text {
    position: absolute;
    top: 100px;
    left: 5vw; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #banner .banner-text {
        position: static;
        text-align: center; } }
    #banner .banner-text h1 {
      font-family: 'Coronet W01';
      display: block;
      font-size: 6vw;
      line-height: 6vw;
      color: #e52a1b;
      font-weight: normal;
      margin-bottom: 3vw; }
      @media all and (min-width: 0px) and (max-width: 767px) {
        #banner .banner-text h1 {
          font-size: 11vw;
          line-height: 11vw;
          color: #e52a1b;
          margin-bottom: 7vw; } }
    #banner .banner-text h2 {
      display: block;
      font-size: 3vw;
      line-height: 3vw;
      color: #ffffff;
      font-weight: bold;
      margin-bottom: 3vw; }
      @media all and (min-width: 0px) and (max-width: 767px) {
        #banner .banner-text h2 {
          font-size: 8vw;
          line-height: 9vw;
          color: #e52a1b;
          margin-bottom: 6vw; } }
    #banner .banner-text small {
      display: block;
      font-size: 13px;
      line-height: 14px;
      color: #ffffff; }
      #banner .banner-text small a {
        color: #ffffff;
        text-decoration: underline; }
        #banner .banner-text small a :hover {
          text-decoration: none; }
      @media all and (min-width: 0px) and (max-width: 767px) {
        #banner .banner-text small {
          padding: 0 5vw;
          color: #6a6a6a;
          font-size: 3vw;
          line-height: 4vw; }
          #banner .banner-text small a {
            color: #6a6a6a; } }
    #banner .banner-text .btn {
      font-size: 2vw;
      line-height: 3vw; }
      @media all and (min-width: 0px) and (max-width: 767px) {
        #banner .banner-text .btn {
          font-size: 5vw;
          line-height: 6vw; } }

/********************/
/*** PARTICIPATE ***/
/********************/
#participate {
  overflow: hidden;
  width: 100%;
  height: auto;
  margin-bottom: 90px; }
  @media all and (min-width: 0px) and (max-width: 991px) {
    #participate {
      text-align: center; }
      #participate .btn-default {
        min-width: 30vw; } }
  @media all and (min-width: 0px) and (max-width: 767px) {
    #participate {
      margin-bottom: 10vw; }
      #participate .btn-default {
        min-width: 50vw; } }
  #participate img {
    display: table;
    margin: 0 auto;
    margin-bottom: 20px; }
  #participate h1 {
    margin-bottom: 20px;
    font-size: 40px;
    line-height: 44px;
    color: #e52a1b;
    font-weight: bold; }
  #participate ul {
    display: block; }
    #participate ul li {
      display: inline;
      margin: 0 5px 0 0; }
      @media all and (min-width: 0px) and (max-width: 991px) {
        #participate ul li {
          display: block;
          margin: 0 0 2vw 0; } }

/********************/
/*** QUIZ ***/
/********************/
#quiz {
  width: 100%;
  height: auto;
  margin-bottom: 140px;
  text-align: center;
  /* FORM */ }
  @media all and (min-width: 0px) and (max-width: 767px) {
    #quiz {
      margin-bottom: 15vw; } }
  #quiz .quiz-box {
    position: relative;
    padding: 80px 70px 35px;
    box-shadow: 0 0 20px #ccc;
    background: #ffffff; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #quiz .quiz-box {
        padding: 0 4vw 0;
        box-shadow: 0 0 0 #ccc;
        background: #ffffff; } }
    #quiz .quiz-box .quiz-corner {
      position: absolute;
      width: auto;
      height: auto; }
      #quiz .quiz-box .quiz-corner#quiz_corner-01 {
        left: -11px;
        top: -7px; }
      #quiz .quiz-box .quiz-corner#quiz_corner-03 {
        left: -40px;
        bottom: -96px; }
      #quiz .quiz-box .quiz-corner#quiz_corner-04 {
        right: -45px;
        bottom: -26px; }
      @media all and (min-width: 0px) and (max-width: 767px) {
        #quiz .quiz-box .quiz-corner#quiz_corner-01 {
          display: none; }
        #quiz .quiz-box .quiz-corner#quiz_corner-03 {
          left: 0;
          bottom: -12.5vw; }
          #quiz .quiz-box .quiz-corner#quiz_corner-03 img {
            width: 25vw; }
        #quiz .quiz-box .quiz-corner#quiz_corner-04 {
          display: none; } }
  #quiz header {
    padding: 25px 15% 10px;
    margin-bottom: 40px;
    border-radius: 7px; }
    #quiz header.box {
      background: #ededed; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #quiz header {
        padding: 10vw 5vw 5vw;
        margin-bottom: 10vw; } }
  #quiz h1 {
    font-size: 40px;
    line-height: 44px;
    color: #e52a1b;
    margin-bottom: 20px; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #quiz h1 {
        font-size: 8vw;
        line-height: 9vw;
        margin-bottom: 5vw; } }
  #quiz h2 {
    font-size: 36px;
    line-height: 40px;
    color: #e52a1b; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #quiz h2 {
        font-size: 7vw;
        line-height: 8vw; } }
  #quiz p {
    font-size: 24px;
    line-height: 28px;
    color: #e52a1b; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #quiz p {
        font-size: 5vw;
        line-height: 6vw; } }
    #quiz p a {
      color: #e52a1b; }
  #quiz .required {
    font-size: 14px;
    line-height: 16px;
    color: #e52a1b; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #quiz .required {
        font-size: 3vw;
        line-height: 4vw; } }
  #quiz .accept {
    display: block;
    font-size: 14px;
    line-height: 16px;
    color: #6a6a6a; }
    #quiz .accept a {
      color: #6a6a6a;
      text-decoration: underline; }
      #quiz .accept a :hover {
        text-decoration: none; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #quiz .accept {
        font-size: 3.2vw;
        line-height: 4.2vw; } }
  #quiz .readmore {
    display: block;
    width: 80%;
    margin: 0 auto 10px;
    font-size: 11px;
    line-height: 12px;
    color: #6a6a6a;
    text-align: left; }
    #quiz .readmore a {
      color: #6a6a6a;
      text-decoration: underline; }
      #quiz .readmore a :hover {
        text-decoration: none; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #quiz .readmore {
        width: 100%;
        font-size: 2.8vw;
        line-height: 3.8vw; } }
  #quiz .answer {
    margin-bottom: 40px; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #quiz .answer {
        margin-bottom: 5vw; } }
    #quiz .answer ul {
      display: block; }
      #quiz .answer ul li {
        display: inline;
        margin: 0 20px 0; }
        @media all and (min-width: 0px) and (max-width: 767px) {
          #quiz .answer ul li {
            display: inline-block;
            width: 45%;
            margin: 0; } }
        @media all and (min-width: 0px) and (max-width: 767px) {
          #quiz .answer ul li:first-child {
            margin-right: 8%; } }
      #quiz .answer ul .btn {
        min-width: 250px;
        font-size: 18px; }
        @media all and (min-width: 0px) and (max-width: 767px) {
          #quiz .answer ul .btn {
            font-size: 6vw;
            min-width: initial;
            width: 100%;
            white-space: normal; } }
    #quiz .answer textarea {
      display: block;
      width: 75%;
      margin: 0 auto;
      padding: 10px;
      font-size: 20px;
      line-height: 24px;
      color: #ffffff;
      border: 0;
      border-radius: 5px;
      resize: none;
      background: #e52a1b; }
      @media all and (min-width: 0px) and (max-width: 767px) {
        #quiz .answer textarea {
          width: 100%; } }
  #quiz footer {
    padding-top: 20px;
    color: #e52a1b; }
    #quiz footer a {
      color: #e52a1b;
      text-decoration: underline; }
      #quiz footer a:hover {
        text-decoration: none; }
  #quiz .form-group {
    margin-bottom: 20px; }
    #quiz .form-group label {
      display: block;
      width: 100%;
      border: 0;
      font-size: 12px;
      line-height: 24px;
      color: #91a19d;
      text-transform: uppercase;
      font-weight: 700; }
    #quiz .form-group.has-error input {
      border: 1px solid red; }
    #quiz .form-group .form-control {
      height: 40px;
      padding: 8px 10px;
      border: 0;
      border-radius: 5px;
      box-shadow: none;
      border: 1px solid transparent;
      background: #ededed;
      font-size: 20px;
      line-height: 24px;
      color: #575757;
      resize: none; }

/********************/
/*** PRODUCTS ***/
/********************/
#products {
  overflow: hidden;
  width: 100%;
  height: auto;
  text-align: center; }
  @media all and (min-width: 0px) and (max-width: 767px) {
    #products .btn-default {
      min-width: 65vw; } }
  #products header {
    display: block;
    padding: 25px 15% 10px;
    margin-bottom: 40px; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #products header {
        padding: 10vw 5vw 5vw;
        margin-bottom: 2vw; } }
  #products h1 {
    font-size: 70px;
    line-height: 74px;
    color: #e52a1b;
    margin-bottom: 15px;
    font-weight: bold; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #products h1 {
        font-size: 10vw;
        line-height: 10vw;
        margin-bottom: 1vw; } }
  #products p strong {
    color: #e52a1b; }
  #products img {
    width: 100%;
    max-width: 100%;
    margin-top: -70px; }

/********************/
/*** GAMA ***/
/********************/
#gama_slick {
  overflow: hidden;
  position: relative;
  width: 100%;
  height: auto;
  padding: 80px 0 20px;
  /*** SLICK ***/ }
  @media all and (min-width: 0px) and (max-width: 991px) {
    #gama_slick {
      text-align: center; } }
  #gama_slick .row > div:first-child {
    text-align: right; }
    @media all and (min-width: 0px) and (max-width: 991px) {
      #gama_slick .row > div:first-child {
        text-align: center; } }
  #gama_slick header {
    display: block;
    padding: 0 0 0;
    margin-bottom: 40px; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #gama_slick header {
        padding: 10vw 5vw 5vw;
        margin-bottom: 2vw; } }
  #gama_slick h1 {
    font-size: 60px;
    line-height: 64px;
    color: #e52a1b;
    margin-bottom: 15px;
    font-weight: bold; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #gama_slick h1 {
        font-size: 10vw;
        line-height: 10vw;
        margin-bottom: 1vw; } }
  #gama_slick p {
    font-size: 16px;
    line-height: 20px; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #gama_slick p {
        font-size: 4vw;
        line-height: 5vw; } }
    #gama_slick p strong {
      color: #e52a1b; }
    #gama_slick p a {
      color: #e52a1b;
      font-weight: bold;
      text-transform: uppercase;
      text-decoration: none; }
      #gama_slick p a:hover {
        text-decoration: underline; }
  #gama_slick img {
    display: inline; }
  #gama_slick .slick-dots {
    position: static; }
  #gama_slick .slick-dotted.slick-slider {
    margin-bottom: 0; }
  @media all and (min-width: 768px) {
    #gama_slick .slick-dots li {
      display: inline-block;
      width: 146px;
      height: auto;
      margin: 0; }
      #gama_slick .slick-dots li.slick-active {
        border-bottom: 3px solid #e52a1b; }
      #gama_slick .slick-dots li img {
        display: inline-block;
        margin-bottom: 10px; } }
  @media all and (min-width: 0px) and (max-width: 767px) {
    #gama_slick .slick-dots li {
      font-size: 60px;
      line-height: 60px;
      color: #000000; }
      #gama_slick .slick-dots li.slick-active {
        font-size: 60px;
        line-height: 60px;
        color: #e52a1b; } }

/********************/
/*** VIDEO ***/
/********************/
#video_page {
  overflow: hidden;
  position: relative;
  width: 100%;
  height: auto;
  padding: 80px 0 20px;
  /* ========= youtube ========= */ }
  @media all and (min-width: 0px) and (max-width: 991px) {
    #video_page {
      text-align: center; } }
  #video_page header {
    display: block;
    padding: 0 0 0;
    margin-bottom: 40px;
    text-align: center; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #video_page header {
        padding: 10vw 5vw 5vw;
        margin-bottom: 2vw; } }
  #video_page h1 {
    font-size: 60px;
    line-height: 64px;
    color: #e52a1b;
    margin-bottom: 15px;
    font-weight: bold; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #video_page h1 {
        font-size: 10vw;
        line-height: 10vw;
        margin-bottom: 1vw; } }
  #video_page .hww_youtube {
    position: relative; }
    #video_page .hww_youtube iframe {
      width: 100%;
      height: 540px; }
    @media all and (max-width: 991px) {
      #video_page .hww_youtube iframe {
        width: 100%;
        height: 50vw; } }
    #video_page .hww_youtube .video-corner {
      position: absolute;
      width: auto;
      height: auto; }
      #video_page .hww_youtube .video-corner#video_corner-02 {
        right: -119px;
        top: -23px; }
      #video_page .hww_youtube .video-corner#video_corner-03 {
        left: -107px;
        bottom: -23px; }
      @media all and (min-width: 0px) and (max-width: 767px) {
        #video_page .hww_youtube .video-corner#video_corner-02 {
          display: none;
          right: 0vw;
          top: -5vw; }
          #video_page .hww_youtube .video-corner#video_corner-02 img {
            width: 40vw; }
        #video_page .hww_youtube .video-corner#video_corner-03 {
          display: none;
          left: 0vw;
          bottom: -3.5vw; }
          #video_page .hww_youtube .video-corner#video_corner-03 img {
            width: 40vw; } }

/********************/
/*** INGREDIENTS ***/
/********************/
#ingredients-intro {
  overflow: hidden;
  position: relative;
  width: 100%;
  height: auto;
  padding: 0 0 20px; }
  @media all and (min-width: 0px) and (max-width: 991px) {
    #ingredients-intro {
      text-align: center;
      padding: 0; } }
  #ingredients-intro .row:first-child > div:first-child {
    text-align: right; }
    @media all and (min-width: 0px) and (max-width: 991px) {
      #ingredients-intro .row:first-child > div:first-child {
        text-align: center; } }
  #ingredients-intro .row:last-child > div:first-child {
    text-align: right; }
    @media all and (min-width: 0px) and (max-width: 991px) {
      #ingredients-intro .row:last-child > div:first-child {
        text-align: center; } }
  #ingredients-intro header {
    display: block;
    padding: 0 0 0;
    margin-bottom: 40px; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #ingredients-intro header {
        padding: 10vw 5vw 5vw;
        margin-bottom: 2vw; } }
  #ingredients-intro h1 {
    font-size: 56px;
    line-height: 60px;
    color: #e52a1b;
    margin-bottom: 15px;
    font-weight: bold; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #ingredients-intro h1 {
        font-size: 10vw;
        line-height: 10vw;
        margin-bottom: 1vw; } }
  #ingredients-intro p {
    font-size: 16px;
    line-height: 20px; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #ingredients-intro p {
        font-size: 4vw;
        line-height: 5vw; } }
    #ingredients-intro p a {
      color: #e52a1b;
      font-weight: bold;
      text-transform: uppercase;
      text-decoration: none; }
      #ingredients-intro p a:hover {
        text-decoration: underline; }
  #ingredients-intro img {
    display: inline; }

#ingredients_slick {
  overflow: hidden;
  position: relative;
  width: 100%;
  height: auto;
  padding: 0 0 20px;
  /*** SLICK ***/ }
  @media all and (min-width: 0px) and (max-width: 991px) {
    #ingredients_slick {
      text-align: center; } }
  #ingredients_slick header {
    display: block;
    padding: 0 0 0;
    margin-bottom: 40px; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #ingredients_slick header {
        padding: 10vw 5vw 5vw;
        margin-bottom: 2vw; } }
  #ingredients_slick h1 {
    font-size: 56px;
    line-height: 60px;
    color: #e52a1b;
    margin-bottom: 0;
    font-weight: bold; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #ingredients_slick h1 {
        font-size: 10vw;
        line-height: 10vw;
        margin-bottom: 1vw; } }
  #ingredients_slick p {
    font-size: 16px;
    line-height: 20px; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #ingredients_slick p {
        font-size: 4vw;
        line-height: 5vw; } }
    #ingredients_slick p a {
      color: #e52a1b;
      font-weight: bold;
      text-transform: uppercase;
      text-decoration: none; }
      #ingredients_slick p a:hover {
        text-decoration: underline; }
  #ingredients_slick .ingredients_box-outer {
    display: block;
    width: 550px;
    height: 550px;
    padding: 35px;
    margin: 0 auto;
    border-radius: 50%;
    border: 1px solid #e52a1b;
    text-align: center; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #ingredients_slick .ingredients_box-outer {
        width: 115vw;
        height: 115vw;
        margin: 3vw 0;
        margin-left: -7vw;
        padding: 7vw;
        border-color: #efefef;
        box-shadow: 0 0 3vw 1vw #efefef;
        background: #ffffff; } }
    #ingredients_slick .ingredients_box-outer .ingredients_box-inner {
      width: 480px;
      height: 480px;
      padding: 50px;
      margin: 0 auto;
      border-radius: 50%;
      border: 1px solid #efefef;
      box-shadow: 0 0 25px 10px #efefef;
      background: #ffffff;
      background-repeat: no-repeat;
      background-position: center bottom;
      background-size: 100% auto; }
      @media all and (min-width: 0px) and (max-width: 767px) {
        #ingredients_slick .ingredients_box-outer .ingredients_box-inner {
          width: 100vw;
          height: 100vw;
          padding: 10vw;
          box-shadow: 0 0 3vw 1vw #efefef; } }
  #ingredients_slick .slick-dots {
    position: static; }
  #ingredients_slick .slick-dotted.slick-slider {
    margin-bottom: 0; }
  #ingredients_slick .slick-prev, #ingredients_slick .slick-next {
    width: 82px;
    height: 82px;
    z-index: 8888; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #ingredients_slick .slick-prev, #ingredients_slick .slick-next {
        width: 12vw;
        height: 30vw; } }
  #ingredients_slick .slick-prev:before, #ingredients_slick .slick-next:before {
    font-size: 0px; }
  #ingredients_slick .slick-prev {
    left: 40px;
    background: url("../images/arrow-circle-red-left.png") no-repeat center center; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #ingredients_slick .slick-prev {
        left: 2vw;
        background: url("../images/arrow-semicircle-red-left.png") no-repeat center center;
        background-size: 100% auto; } }
  #ingredients_slick .slick-next {
    right: 40px;
    background: url("../images/arrow-circle-red-right.png") no-repeat center center; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #ingredients_slick .slick-next {
        right: 4vw;
        background: url("../images/arrow-semicircle-red-right.png") no-repeat center center;
        background-size: 100% auto; } }
  #ingredients_slick .slick-dots li button:before {
    font-size: 12px;
    line-height: 16px;
    color: #000000;
    opacity: 1; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #ingredients_slick .slick-dots li button:before {
        font-size: 16px;
        line-height: 20px; } }
  #ingredients_slick .slick-dots li.slick-active button:before {
    font-size: 16px;
    line-height: 16px;
    color: #e52a1b; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #ingredients_slick .slick-dots li.slick-active button:before {
        font-size: 18px;
        line-height: 20px; } }

#ingredients-ingredient {
  overflow: hidden;
  position: relative;
  width: 100%;
  height: auto;
  text-align: right; }
  @media all and (min-width: 0px) and (max-width: 991px) {
    #ingredients-ingredient {
      text-align: center;
      padding: 0;
      margin-bottom: 15vw; } }
  #ingredients-ingredient p {
    font-size: 20px;
    line-height: 24px; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #ingredients-ingredient p {
        font-size: 4vw;
        line-height: 5vw; } }
  #ingredients-ingredient img {
    display: inline; }

#ingredients-conserve {
  position: relative;
  text-align: center; }
  #ingredients-conserve .conserve-type {
    padding: 190px 15px 50px;
    margin: 0 0 40px;
    background: #f0f0f0; }
    @media all and (min-width: 0px) and (max-width: 991px) {
      #ingredients-conserve .conserve-type {
        padding: 50px 10% 50px;
        margin: 0 0 40px; } }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #ingredients-conserve .conserve-type {
        padding: 10vw 10vw 10vw;
        margin: 0 0 10vw; } }
  #ingredients-conserve h1 {
    z-index: 999;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 60px;
    display: block;
    font-size: 76px;
    line-height: 80px;
    color: #8f908e;
    margin-bottom: 0;
    font-weight: bold; }
    @media all and (min-width: 0px) and (max-width: 991px) {
      #ingredients-conserve h1 {
        position: static;
        font-size: 6vw;
        line-height: 7vw;
        color: #e52a1b;
        margin-bottom: 1vw; } }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #ingredients-conserve h1 {
        position: static;
        font-size: 9vw;
        line-height: 10vw;
        color: #e52a1b;
        margin-bottom: 8vw; } }
  #ingredients-conserve h2 {
    font-size: 1.8vw;
    line-height: 1.8vw;
    color: #e52a1b;
    margin-bottom: 15px;
    font-weight: normal; }
    @media all and (min-width: 992px) and (max-width: 1200px) {
      #ingredients-conserve h2 {
        font-size: 18px;
        line-height: 20px;
        margin-bottom: 15px; } }
    @media all and (min-width: 768px) and (max-width: 991px) {
      #ingredients-conserve h2 {
        font-size: 6vw;
        line-height: 6vw;
        margin-bottom: 1vw; } }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #ingredients-conserve h2 {
        font-size: 7vw;
        line-height: 7vw;
        margin-bottom: 3vw; } }
  #ingredients-conserve p {
    font-size: 14px;
    line-height: 20px; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #ingredients-conserve p {
        font-size: 4vw;
        line-height: 5vw; } }
    #ingredients-conserve p a {
      color: #e52a1b;
      font-weight: bold;
      text-transform: uppercase;
      text-decoration: none; }
      #ingredients-conserve p a:hover {
        text-decoration: underline; }

/********************/
/*** VIDEO ***/
/********************/
#winners #site-container {
  background: url("../images/winner_page-list.png") no-repeat right bottom; }
  @media all and (min-width: 0px) and (max-width: 767px) {
    #winners #site-container {
      background: none; } }

#winner_page {
  overflow: hidden;
  position: relative;
  width: 100%;
  height: auto;
  padding: 80px 0 120px;
  text-align: center; }
  @media all and (min-width: 0px) and (max-width: 767px) {
    #winner_page {
      padding: 40px 0 20px; } }
  #winner_page header {
    display: block;
    padding: 0 0 0;
    margin-bottom: 40px;
    text-align: center; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #winner_page header {
        padding: 10vw 5vw 5vw;
        margin-bottom: 2vw; } }
  #winner_page h1 {
    font-size: 60px;
    line-height: 64px;
    color: #e52a1b;
    margin-bottom: 15px;
    font-weight: bold; }
    @media all and (min-width: 0px) and (max-width: 767px) {
      #winner_page h1 {
        font-size: 10vw;
        line-height: 10vw;
        margin-bottom: 1vw; } }
  #winner_page dl.winner_page-list {
    display: block;
    color: #a6a6a6;
    margin-bottom: 30px; }
    #winner_page dl.winner_page-list dt {
      display: block;
      font-size: 24px;
      line-height: 30px; }
    #winner_page dl.winner_page-list dd {
      display: block;
      font-size: 16px;
      line-height: 20px; }

/* ============================= */
/* ========= GENERIC ========= */
/* ============================= */
/* ========= JS slick arrows ========= */
.slick-prev, .slick-next {
  width: 40px;
  height: 40px;
  z-index: 8888; }

.slick-prev:before, .slick-next:before {
  font-size: 40px; }

.slick-prev {
  left: 40px; }

.slick-next {
  right: 40px; }

/* ========= JS transition ========= */
.lucho {
  -webkit-transition: 1s linear;
  -moz-transition: 1s linear;
  -o-transition: 1s linear;
  -ms-transition: 1s linear;
  transition: 1s linear; }