@font-face {
  font-family: 'inter';
  src: url("../../../fonts/inter/Inter_18pt-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'inter';
  src: url("../../../fonts/inter/Inter_24pt-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal; }

@font-face {
  font-family: 'inter';
  src: url("../../../fonts/inter/Inter_18pt-Thin.ttf") format("truetype");
  font-weight: 300;
  font-style: normal; }

@font-face {
  font-family: 'baskervville';
  src: url("../../../fonts/Baskervville/Baskervville-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'baskervville';
  src: url("../../../fonts/Baskervville/Baskervville-Italic.ttf") format("truetype");
  font-weight: normal;
  font-style: italic; }

@font-face {
  font-family: 'arimo';
  src: url("../../../fonts/arimo/Arimo-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal; }

@font-face {
  font-family: 'arimo';
  src: url("../../../fonts/arimo/Arimo-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal; }

.fevertree-recipe {
  width: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  height: 600px;
  overflow: hidden; }
  .fevertree-recipe__content {
    width: 40%; }
    .fevertree-recipe__content .content {
      height: 100%;
      width: 300px;
      margin: 0 auto 0 100px;
      text-align: right;
      padding-block: 36px; }
      .fevertree-recipe__content .content .title {
        color: #fff;
        font-family: "arimo";
        font-weight: 700;
        font-size: 80px;
        line-height: 80px;
        margin-bottom: 0; }
      .fevertree-recipe__content .content .subtitle {
        color: #fff;
        font-family: "baskervville";
        font-weight: 400;
        font-size: 70px;
        line-height: 70px;
        text-align: right;
        font-style: italic;
        margin-bottom: 22px; }
      .fevertree-recipe__content .content .text {
        color: white;
        width: 275px; }
        .fevertree-recipe__content .content .text h1, .fevertree-recipe__content .content .text h2, .fevertree-recipe__content .content .text h3, .fevertree-recipe__content .content .text h4 {
          font-weight: 700;
          font-size: 25px;
          line-height: 25px;
          text-align: right;
          font-family: "arimo"; }
        .fevertree-recipe__content .content .text p {
          font-weight: 700;
          font-size: 17px;
          line-height: 21px;
          border-bottom: 1.5px solid #fff;
          padding-block: 11px;
          margin: 0;
          font-family: "arimo"; }
          .fevertree-recipe__content .content .text p:last-child {
            border-bottom: unset; }
      .fevertree-recipe__content .content .icon {
        width: 171px;
        height: 62px;
        object-fit: contain;
        display: block;
        margin: 20px 0 auto auto; }
  .fevertree-recipe__images {
    -ms-flex: 1;
        flex: 1;
    position: relative;
    z-index: 1; }
    .fevertree-recipe__images img {
      position: absolute; }
    .fevertree-recipe__images .fevertree-bottle-image {
      top: 0;
      right: -200px;
      object-fit: contain;
      width: 400px;
      height: 600px;
      z-index: 4; }
    .fevertree-recipe__images .text-image {
      top: 96px;
      left: 45%;
      width: 426px;
      height: 100px;
      object-fit: contain;
      z-index: 4; }
    .fevertree-recipe__images .glass-image {
      bottom: 0;
      right: 350px;
      width: 520px;
      height: 600px;
      object-fit: contain;
      z-index: 4; }
    .fevertree-recipe__images .mobile-image {
      display: none; }
  @media screen and (max-width: 1700px) {
    .fevertree-recipe__images .text-image {
      left: 30%;
      width: 400px;
      height: 100px; } }
  @media screen and (max-width: 768px) {
    .fevertree-recipe {
      -ms-flex-direction: column-reverse;
          flex-direction: column-reverse;
      height: fit-content; }
      .fevertree-recipe__content {
        width: 100%; }
        .fevertree-recipe__content .content {
          margin: unset;
          text-align: center;
          padding-inline: 0;
          padding-block: 0;
          padding: 30px 0 56px 0;
          width: 100%; }
          .fevertree-recipe__content .content .subtitle {
            text-align: center;
            width: 100%; }
          .fevertree-recipe__content .content .text {
            width: 292px;
            margin: auto; }
            .fevertree-recipe__content .content .text h1, .fevertree-recipe__content .content .text h2, .fevertree-recipe__content .content .text h3, .fevertree-recipe__content .content .text h4 {
              text-align: center; }
          .fevertree-recipe__content .content .icon {
            margin: 31px auto 0 auto; }
      .fevertree-recipe__images {
        height: 450px;
        width: 100%;
        -ms-flex: unset;
            flex: unset; }
        .fevertree-recipe__images .fevertree-bottle-image {
          display: none; }
        .fevertree-recipe__images .text-image {
          top: 40px;
          right: 50%;
          transform: translateX(50%);
          min-width: 202px;
          height: 75px;
          z-index: 4;
          left: unset; }
        .fevertree-recipe__images .glass-image {
          display: none; }
        .fevertree-recipe__images .mobile-image {
          bottom: 0;
          left: 50%;
          transform: translateX(-50%);
          width: 390px;
          height: 340px;
          display: block; } }