.slider-horizontal-content-container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;

  .content-container {
    flex: 0 0 35%;
    padding-right: 8rem;
    .title {
      font-size: 48px;
      font-family: "Marcellus", Sans-serif;
      margin-bottom: 1rem;
      border-bottom: 2px solid var(--e-global-color-primary);
      padding-bottom: 1rem;
    }
    .description {
      font-family: "Source Sans 3";
      font-size: 20px;
      color: var(--e-global-color-primary);
    }

    .box-controls-slide {
      .control-slider-next {
        margin-left: 1rem;
      }
    }
  }

  .slider-container {
    flex: 0 0 65%;
    max-width: 65%;
    padding: 2rem;
    .splide__arrows,
    .splide__pagination {
      display: none;
    }

    .splide__track {
      padding: 2rem 2rem 2rem 0;
      padding-left: 1rem !important;
      padding-right: 2rem !important;

      .splide__slide {
        padding: 4rem;
        border-radius: 26px;
        background-color: #fff;
        box-shadow: 0 3px 20px 4px rgba(0, 0, 0, 0.15);
        opacity: 0.3;
        transition: 0.2s ease-in-out;

        &.is-active {
          opacity: 1;
        }
        .title {
          font-size: 48px;
          font-family: "Marcellus", Sans-serif;
          color: var(--e-global-color-primary);
          border-bottom: 1px solid var(--e-global-color-primary);
          padding-bottom: 0.25rem;
        }
        .content {
          margin-top: 1rem;
          max-width: 450px;;
          p {
            font-family: "Source Sans 3";
            font-size: 16px;
            margin: 0;
            color: var(--e-global-color-primary);
          }
        }
      }
    }
  }
}

@media only screen and (max-width: 1024px) {
  .slider-horizontal-content-container {
    .content-container {
      flex: 0 0 100%;
      padding-right: 0px;

      .title {
        font-size: 32px;
   
      }
    }

    .slider-container {
      flex: 0 0 100%;
      max-width: 100%;
      padding: 0px;
      margin-top: 1rem;

      .splide__track {
        padding: 2rem 0;
        padding-left: 0rem !important;
        padding-right: 0rem !important;

        .splide__slide {
          padding: 2rem;
          box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.15);
          .title {
            font-size: 32px;
          }
          .content {
            max-width: 75vw;
            p {
              font-size: 16px;
            }
          }
        }
      }
    }
  }
}
