/* Hide Nutritional Info Button */
.nutritional-button{
  display: none !important;
}

/* Age Gate Styles */
#modal_screen[role="img"] {
  background: linear-gradient(to right, #860000, #e50000) !important;
}

#modal_content {
  display: flex;
}

#modal_content_wrapper {
  margin: auto 0;
}

#modal_content_wrapper h5,
#modal_content_wrapper p,
#modal_content_wrapper .agree, 
#modal_content_wrapper a {
  color: #fff !important;
}
#modal_content_wrapper #agree:checked:after {
  color: #fff !important;
}

#modal_content_wrapper #agree {
  border-color: #fff !important;
}
#modal_content nav .av_go, #modal_content nav .av_no {
  border: 2px solid #fff !important;
  color: #fff !important;

  &::before, &::after {
    background: #fff !important;
    box-shadow: 0.05rem -0.05rem #fff !important;
  }
}

#modal_content .age_gate_header {
  margin-top: 60px;

  img {
    width: 100% !important;
    padding: 0 20px;
  }
}

#modal_content .footer {
  margin-top: 0 !important;
}

/* Newsletter popup */
#violator {
    border: 2px solid #000;
    margin-top: 75px;
    outline: none;
    padding: 30px 60px;
    position: relative;
    width: 85%;
    text-align: center;
    @media screen and (max-width: 1023px) {
      width: 95% !important;
      padding: 30px;
      min-height: initial !important;
      height: initial !important;
      margin-top: 0 !important;
    }

    .btn_container {
      height: 50px;
    }
}

/* Recipe under Detail Tab - Toggle on/off in editor */

.detail-recipe-section {
  text-align: center;
  max-width: 100%;
  margin: 20px auto;
  padding: 20px;
}
.detail-recipe-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}
.recipe-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 100%;
  max-width: 600px; 
  margin: 0 auto;
}
.recipe-item h6 {
    text-align: center;
    font-size: 20px;
}
.recipe-item h4 {
    text-align: center;
    margin: 10px 0;
    line-height: 18px;
    font-size: 26px;
}
.recipe-item p {
    text-align: center;
    font-size: 18px;
    margin: 0 !important;
    line-height: 35px;
    max-width: 100% !important;
}

.recipe-icon-container {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  flex-wrap: nowrap;
  padding-left: 20px;
  padding-right: 20px;
}

@media screen and (max-width: 639px) {
  .recipe-icon-container {
    flex-direction: column;
    margin-top: 30px;
    gap: 20px;
  }
}
@media screen and (min-width: 640px) {
  .recipe-icon-container {
    gap: 50px;
    margin-top: 0;
    height: 200px;
  }
}




.recipe_icon_1, .recipe_icon_2, .recipe_icon_3 {
  display: block !important;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 10px;
  flex-shrink: 0;
  object-fit: cover;
  position: relative !important; 
}

@media screen and (max-width: 639px) {
  .recipe_icon_1, .recipe_icon_2, .recipe_icon_3 {
    height: 146px;
    width: 146px;
  }
}
@media screen and (min-width: 640px) {
  .recipe_icon_1, .recipe_icon_2, .recipe_icon_3 {
    height: 146px;
    width: 146px;
  }
  .recipe_icon_1 {
  top: 10px;
  }
  .recipe_icon_2 {
    top: 15px;
  }
}


.steps-container {
  display: flex;
  flex-direction: column;
  align-items: left;
  text-align: left;
  margin-top: 30px;
  margin-bottom: 0;
  margin-left: auto;
  margin-right: auto;
}

.step_one span {
  font-weight: bold;
}
.step_two span {
  font-weight: bold;
}
.step_three span {
  font-weight: bold;
}
.step-one {
  margin-top: 15px;
}

.step_one,
.step_two,
.step_three {
    display: flex;
    justify-content: start;
    align-items: center;
    text-align: center;
    width: 100%;
}
.step_one h6,
.step_two h6,
.step_three h6 {
    text-align: center;
    margin: 0;
}

.newsletter-legal {
  p {
    position: relative;
    font-size: 12px;
    color: #030303;
    line-height: 1.8 !important;
    font-weight: 300;
    padding: 40px 20px;
    margin: 0 auto;
    max-width: 100% !important;
    @media screen and (min-width: 1024px) {
      padding: 0 20px;
      max-width: 1233px !important;
    }
  }
}


/* Sign-up */
.signup {
  width: 100%;
  padding: 0 60px;

  @media screen and (max-width: 1023px) {
    padding: 0 10px;
  }

  .newsletter-popup {
    p {
      margin-top: 60px !important;
    }
  }

  .hero, .newsletter-popup {
    position: relative;
    max-width: 1263px;
    margin: 0 auto;


    .content {
      padding: 40px 0;
      text-align: center;

      @media screen and (min-width: 724px) {
        padding: 60px 30px;
      }

      h1,
      h2,
      p {
        color: #000000 !important;
      }

      h1 {
        line-height: 1;
        font-size: revert;

        @media screen and (min-width: 430px) {
          font-size: 9vw;
        }
        @media screen and (min-width: 724px) {
          font-size: 57px;
        }
        @media screen and (min-width: 1221px) {
          br {
            display: none;
          }
        }

        sup {
          position: relative;
          top: -12px;
        }
      }

      h2 {
        margin: 0 0 10px;
        font-size: 18px;
        font-family: itc-avant-garde-gothic-pro, sans-serif !important;
        font-weight: 500 !important;
        font-style: normal;
        letter-spacing: 0 !important;
        line-height: 1.2;
        @media screen and (min-width: 430px) {
          font-size: 4.9vw;
        }
        @media screen and (min-width: 724px) {
          font-size: 30px;
        }
      }
    }


    .form-content {
      max-width: 800px;
      position: relative;
      margin: 0 auto;
      display: block;
      padding: 40px 0 60px;

      form {
        width: 100%;
        padding: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 60px;
        @media screen and (max-width: 1023px) {
          flex-direction: column;
          gap: 20px;
        }

        &#mc-embedded-subscribe-form #mce-responses.responses,
        &#mc-embedded-subscribe-form-popup #mce-responses.responses {
          background: none !important;
          padding: 0 !important;
          margin: 5px 0 50px !important;
          width: 100%;
          text-align: center;

          .response {
            color: #000;
            font-size: 16px !important;
            font-weight: 300 !important;
            text-transform: none;
            font-family: avant-garde-gothic-pro, sans-serif !important;
          }
        }

        .email-input {
          flex: 1;
          @media screen and (max-width: 1023px) {
            flex: none;
            width: 100%;
            padding: 0 10px;
          }
        }

        input[type="email"] {
          font-size: 22px !important;
          font-family: itc-avant-garde-gothic-pro, sans-serif !important;
          font-weight: 600 !important;
          line-height: 30px;
          padding-bottom: 10px;
        }
        
        .submit-btn {
          position: relative;
          top: -30px;
          @media screen and (max-width: 1023px) {
            left: 25px;
          }

          input[type="text"] {
            border-bottom: none !important;
          }
        }

        &#mc-embedded-subscribe-form, &#mc-embedded-subscribe-form-popup {
          margin-bottom: 0 !important;
        }
      }
    }
  }

  .exclusive-offerings {
    max-width: 1345px;
    margin: 0 auto !important;
    padding: 80px 0;
    text-align: center;

    @media screen and (max-width: 1023px) {
      padding: 30px 0;
    }

    .grid-x {
      width: 100%;
      justify-content: space-between;
      margin: 0 !important;

      @media screen and (min-width: 1221px) {
        align-items: center;
      }
    }


    h3 {
      width: 100%;
      text-align: center;
      font-size: 23px !important;

      @media screen and (min-width: 724px) {
        font-size: 5vw !important;
      }

      @media screen and (min-width: 1023px) {
        font-size: 30px !important;
      }
    }

    h4 {
      font-size: 20px;
      font-weight: 500;
      line-height: 1.2;
      margin-top: 10px;
    }

    .exclusive-items {
      width: 100%;
      display: flex;
      justify-content: space-between;
    }

    .exclusive-item {
      max-width: 100%;
      display: flex;
      flex-direction: column;
      margin: 60px 0 0;

      @media screen and (min-width: 430px) {
        max-width: calc(50% - 10px);
        margin: 30px 0 0;
      }

      @media screen and (min-width: 1024px) {
        max-width: calc(25% - 20px);
      }

      @media screen and (min-width: 1221px) {
        max-width: 264px;
      }
    }
  }

  .featured-wines {
    max-width: 1680px;
    margin: 0 auto !important;
    padding: 80px 0 60px;
    text-align: center;
    @media screen and (max-width: 1023px) {
      padding: 80px 0;
    }

    h1 {
        line-height: 1;
        font-size: 30px;

        @media screen and (min-width: 430px) {
          font-size: 9vw;
        }
        @media screen and (min-width: 724px) {
          font-size: 5vw;
        }
        @media screen and (min-width: 1024px) {
          font-size: 45px;
        }
        @media screen and (min-width: 1243px) {
          font-size: 60px;
        }

        sup {
          position: relative;
          top: -12px;
        }
    }

    .wine-items {
      width: 100%;
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      margin: 60px auto 80px auto !important;
      @media screen and (max-width: 1023px) {
        margin: 0 auto 60px auto;
        justify-content: center;
        padding: 0 20px;
      }

      .wines {
        width: 100%;
        display: grid;
        grid-template-columns: 338px;
        justify-content: center;
        gap: 120px;
        margin-bottom: 120px;
        @media screen and (min-width: 724px) {
          gap: 80px;
          grid-template-columns: repeat(2, 300px);
          margin-bottom: 120px;
        }
        @media screen and (min-width: 1024px) {
          margin-bottom: 100px;
        }
        @media screen and (min-width: 1243px) {
          grid-template-columns: repeat(4, 1fr);
          margin-bottom: 140px;
        }

        li.wine {
          height: 338px;
          width: 100% !important;
          @media screen and (min-width: 724px) and (max-width: 1023px) {
            row-gap: 0;
          }
          @media only screen and (max-width: 1024px) and (orientation: portrait){
            margin: 0 !important;
          }

          img {
            width: 90%;
            max-width: fit-content
          }

          a {
            display: inline-block;
          }
        }
      }
    }
  }

  .what-makes-franzia {
    position: relative;
    max-width: 1233px;
    padding: 60px 0;
    @media screen and (min-width: 724px) {
      margin: 0 auto !important;
    }

    p {
      line-height: 1;
      margin-top: 20px;
    }

    .intro-title {
        h1 {
          line-height: 1;
          font-size: 30px;

          @media screen and (min-width: 430px) {
            font-size: 9vw;
          }
          @media screen and (min-width: 724px) {
            font-size: 5vw;
          }
          @media screen and (min-width: 1024px) {
            font-size: 45px;
          }
          @media screen and (min-width: 1243px) {
            font-size: 60px;
          }
      }
      p {
        @media screen and (max-width: 639px) {
          font-size: 20px !important;
        }
      }
    }

    .what-makes-items {
      padding-top: 40px;
      max-width: 900px;

      .what-makes-container {
        justify-content: space-between;
      }

      .what-makes-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;

        p {
          font-size: 10px;
          margin-top: 10px;
          @media screen and (min-width: 724px) {
            font-size: 20px;
          }
        }

        img {
          width: 100%;
          max-width: 242px;
          padding: 20px 20px 0;
        }
      }
    }
  }
}

.signup-gradient {
  background: #79242f;
  background: linear-gradient(to bottom, #901518, #DA2128);

  h1,
  p {
    color: #fff !important;
  }
}

.signup-section {
  background-image: url("../assets/images/button-sign-up.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.signup-section:hover {
  background-image: url("../assets/images/button-sign-up-hover.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.find-button {
  background-image: url("../assets/images/button-find.jpeg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.find-button:hover {
  background-image: url("../assets/images/button-find-hover.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.sign-up-content {
  img {
    width: 100px !important;
    max-width: 100px !important;
  }
}

/*//////////////  New Wine Styles with Food Pairing Icons ///////////*/

/* Strawberry Margarita */

.wines-strawberry-margarita .type-wines,
.wines .strawberry-margarita {
  background: linear-gradient(to bottom, #d63832, #dc6679);
}

.wines-strawberry-margarita h1,
.wines-strawberry-margarita h2,
.wines-strawberry-margarita h4,
.wines-strawberry-margarita h5,
.wines-strawberry-margarita h6,
.wines-strawberry-margarita p {
  color: #fff !important;
}

.wines-strawberry-margarita .entry_content .btn,
.wines-strawberry-margarita #wine_serving .btn,
.wines-strawberry-margarita .btn.view_more {
  background: none !important;
  border: 2px solid #fff !important;
  color: #fff !important;
}

.wines-strawberry-margarita .entry_content .btn:before,
.wines-strawberry-margarita .entry_content .btn:after,
.wines-strawberry-margarita #wine_serving .btn:before,
.wines-strawberry-margarita #wine_serving .btn:after,
.wines-strawberry-margarita .btn.view_more:before,
.wines-strawberry-margarita .btn.view_more:after {
  background: #fff !important;
  box-shadow: 0.05rem -0.05rem #fff !important;
}

.wines-strawberry-margarita .arrow {
  background: url(https://www.franzia.com/wp-content/themes/franzia-theme/assets/images/icon-arrow-stem-white.svg) no-repeat !important;
}

.wines-strawberry-margarita a[aria-selected=true] .arrow {
  background: url(https://www.franzia.com/wp-content/themes/franzia-theme/assets/images/icon-arrow-white.svg) no-repeat !important;
}

.wines-strawberry-margarita .share {
  border: 2px solid #fff !important;
}

.wines-strawberry-margarita .share h4 {
  color: #fff !important;
}

.wines-strawberry-margarita .share img,
.wines-strawberry-margarita .share svg {
  fill: #fff;
}

.wines-strawberry-margarita .share div {
  border-left: 2px solid #fff !important;
}

.wines-strawberry-margarita .tabs .tabs-title img,
.wines-strawberry-margarita .tabs .tabs-title svg,
.wines-strawberry-margarita .tabs .tabs-title svg path,
.wines-strawberry-margarita #wine_details ul.tech li svg {
  fill: #fff !important;
}

.wines-strawberry-margarita .image_border img {
  border: 2px solid #fff;
  -webkit-box-shadow: 32px 32px 0 0 #fff;
  box-shadow: 32px 32px 0 0 #fff;
}

.wines-strawberry-margarita .image_border:before {
  border-color: transparent #fff transparent transparent;
}

.wines-strawberry-margarita .image_border:after {
  border-color: transparent transparent transparent #fff;
}

.wines-strawberry-margarita #wine_details .tabs .tabs-title {
  border-bottom: 2px solid rgba(255, 255, 255, 0.5) !important;
}

.wines-strawberry-margarita #wine_details .tabs .tabs-title.is-active {
  border-bottom: 2px solid #fff !important;
}

.wines-strawberry-margarita #wine_awards ul {
  display: none;
}

.wines-strawberry-margarita #wine_awards ul li .accordion-content {
  display: none;
}

.wines-strawberry-margarita .accordion-title {
  color: #fff;
}

.wines-strawberry-margarita .accordion-title:hover {
  color: #fff;
}

.wines-strawberry-margarita #what_makes_us_special .tabs .tabs-title a[aria-selected=true],
.wines-strawberry-margarita #what_makes_us_special .tabs .tabs-title.is-active a,
.wines-strawberry-margarita .tabs .tabs-title a[aria-selected=true],
.wines-strawberry-margarita .tabs .tabs-title:hover {
  border-bottom: 2px solid #fff !important;
}

.wines-strawberry-margarita .tabs-title>a,
.wines-strawberry-margarita .tabs-title>a:focus,
.wines-strawberry-margarita .tabs-title>a[aria-selected=true],
.wines-strawberry-margarita #wine_details .tabs-content .tabs-panel p a {
  color: #fff !important;
}

.wines-strawberry-margarita #detail1 .scale-label {
  display: none;
}

.wines-strawberry-margarita #food_pairing .pair_icon {
  display: none;
}

.wines-strawberry-margarita .sweetness_scale {
  display: none;
}

.wines-strawberry-margarita .body_scale {
  display: none;
}

.wines-strawberry-margarita #wine_serving .serving_box img,
.wines-strawberry-margarita #wine_serving .serving_box svg {
  fill: #fff !important;
}

.wines-strawberry-margarita .serving2,
.wines-strawberry-margarita .serving3 {
  display: none !important;
}



/* Pinot Noir */

.wines-pinot-noir .type-wines,
.wines .pinot-noir {
  background: linear-gradient(to bottom, #580107, #8d005f);
}

.wines-pinot-noir h1,
.wines-pinot-noir h2,
.wines-pinot-noir h4,
.wines-pinot-noir h5,
.wines-pinot-noir h6,
.wines-pinot-noir p {
  color: #fff !important;
}

.wines-pinot-noir .entry_content .btn,
.wines-pinot-noir #wine_serving .btn,
.wines-pinot-noir .btn.view_more {
  background: none !important;
  border: 2px solid #fff !important;
  color: #fff !important;
}

.wines-pinot-noir .entry_content .btn:before,
.wines-pinot-noir .entry_content .btn:after,
.wines-pinot-noir #wine_serving .btn:before,
.wines-pinot-noir #wine_serving .btn:after,
.wines-pinot-noir .btn.view_more:before,
.wines-pinot-noir .btn.view_more:after {
  background: #fff !important;
  box-shadow: 0.05rem -0.05rem #fff !important;
}

.wines-pinot-noir .arrow {
  background: url(https://www.franzia.com/wp-content/themes/franzia-theme/assets/images/icon-arrow-stem-white.svg) no-repeat !important;
}

.wines-pinot-noir a[aria-selected=true] .arrow {
  background: url(https://www.franzia.com/wp-content/themes/franzia-theme/assets/images/icon-arrow-white.svg) no-repeat !important;
}

.wines-pinot-noir .share {
  border: 2px solid #fff !important;
}

.wines-pinot-noir .share h4 {
  color: #fff !important;
}

.wines-pinot-noir .share img,
.wines-pinot-noir .share svg {
  fill: #fff;
}

.wines-pinot-noir .share div {
  border-left: 2px solid #fff !important;
}

.wines-pinot-noir .tabs .tabs-title img,
.wines-pinot-noir .tabs .tabs-title svg,
.wines-pinot-noir .tabs .tabs-title svg path,
.wines-pinot-noir #wine_details ul.tech li svg {
  fill: #fff !important;
}

.wines-pinot-noir .image_border img {
  border: 2px solid #fff;
  -webkit-box-shadow: 32px 32px 0 0 #fff;
  box-shadow: 32px 32px 0 0 #fff;
}

.wines-pinot-noir .image_border:before {
  border-color: transparent #fff transparent transparent;
}

.wines-pinot-noir .image_border:after {
  border-color: transparent transparent transparent #fff;
}

.wines-pinot-noir #wine_details .tabs .tabs-title {
  border-bottom: 2px solid rgba(255, 255, 255, 0.5) !important;
}

.wines-pinot-noir #wine_details .tabs .tabs-title.is-active {
  border-bottom: 2px solid #fff !important;
}

.wines-pinot-noir #wine_awards ul {
  display: none;
}

.wines-pinot-noir #wine_awards ul li .accordion-content {
  display: none;
}

.wines-pinot-noir .accordion-title {
  color: #fff;
}

.wines-pinot-noir .accordion-title:hover {
  color: #fff;
}

.wines-pinot-noir #what_makes_us_special .tabs .tabs-title a[aria-selected=true],
.wines-pinot-noir #what_makes_us_special .tabs .tabs-title.is-active a,
.wines-pinot-noir .tabs .tabs-title a[aria-selected=true],
.wines-pinot-noir .tabs .tabs-title:hover {
  border-bottom: 2px solid #fff !important;
}

.wines-pinot-noir .tabs-title>a,
.wines-pinot-noir .tabs-title>a:focus,
.wines-pinot-noir .tabs-title>a[aria-selected=true],
.wines-pinot-noir #wine_details .tabs-content .tabs-panel p a {
  color: #fff !important;
}

.wines-pinot-noir #food_pairing .pair_icon {
  background-color: #fff !important;
}

.wines-pinot-noir #wine_serving .serving_box img,
.wines-pinot-noir #wine_serving .serving_box svg {
  fill: #fff !important;
}

.wines-pinot-noir .serving2,
.wines-pinot-noir .serving3 {
  display: none !important;
}


#food_pairing .icon_potlucks {
  mask: url(../images/icon-potlucks.svg);
  -webkit-mask: url(../images/icon-potlucks.svg);
  mask-position: center;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
}

#food_pairing .icon_puzzles {
  mask: url(../images/icon-puzzles.svg);
  -webkit-mask: url(../images/icon-puzzles.svg);
  mask-position: center;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
}

#food_pairing .icon_turkeyburgers {
  mask: url(../images/icon-turkeyburgers.svg);
  -webkit-mask: url(../images/icon-turkeyburgers.svg);
  mask-position: center;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
}

/* Pinot Grigio Colomnbard */

#post-7 .random-wines .wines-list .pinot-grigio-colomnbard {
  white-space: normal !important;
}