.module {
  background-color: var(--module-background-color, #fff);
  padding-bottom: var(--module-bottom-spacing);
  scroll-margin-top: calc(var(--nav-height-mobile, 6rem) + var(--nav-anchor-height, 4rem));

  @include min(laptop){
    scroll-margin-top: calc(var(--nav-height-desktop, 8rem) + var(--nav-anchor-height, 4rem));
  }

  position: relative;
  
  &.contentModule:has([class*="templateFour"]) {
    --max-width-content: 96rem;

    padding: var(--padding-template-four-mobile, 4.8rem 1.6rem);
    background-color: var(--content-template-four-bg-color, #fff);

    @include min(desktop) {
      padding: var(--padding-template-four-desktop, 4.8rem 0);
    }
  }
}

.widgetModule {
  display: flex;
  flex-direction: column;
}

.contentModule {
  display: flex;
  flex-direction: column;
  margin: 0 auto;

  > h2 {
    width: 100%;
  }
}

.module_introduction {
  font-weight: 400;
}

.cards_v2Module.template_two,
.cardsModule.template_two,
.cards_v2Module.template_three,
.cardsModule.template_three {
  gap: 8rem;
  position: relative;
  padding: 0;

  @include min(tablet) {
    display: grid;
    grid-template-columns: 1fr 2fr;
    justify-content: center;
    align-items: flex-start;
    padding: 0 2rem;
  }

  @include min(desktop) {
    padding: 4rem 0 4rem 4rem;
  }

  > div:first-child {
    padding: 1.6rem;
    padding-bottom: 4rem;
    padding-top: 3.2rem;

    @include min(tablet) {
      width: 100%;
    }

    > div {
      margin: 0 !important;
      padding: 0 !important;

      @include min(desktop) {
        max-width: 130rem !important;
      }
    }
  }

  > div:last-of-type {
    max-width: 100%;
    flex-basis: 60%;

    @include flex-direction(row);

    overflow-x: auto;

    &::-webkit-scrollbar {
      height: 0.6rem;
      width: 0.6rem;

      @include min(tablet) {
        display: none;
      }
    }

    &::-webkit-scrollbar-track {
      background: #d8d6d9;
      margin: 0 1.6rem;
      height: 0.6rem;
      border-radius: 100px;
    }

    &::-webkit-scrollbar-thumb {
      background-color: #535153;;
      border-radius: 100px;
    }

    @include min(tablet) {
      padding: 2rem 0;
    }

    > div {
      min-width: 29.6rem;
      margin-right: 0.8rem;

      @include min(tablet) {
        min-width: 34.3rem;
      }
    }
  }

  &.noModuleIntro {
    @include flex-direction(column);

    gap: 1.6rem;
    padding: 4rem 0;

    > div {
      max-width: 130rem;
      width: 100%;
      padding-top: 0;
      margin: 0 auto;

      h2 {
        margin-bottom: 0 !important;
        width: auto;
      }
    }

    > div:last-of-type {
      padding: 0 0 8rem 1.6rem;

      &::-webkit-scrollbar {
        display: none;
      }
    }
  }
}

.cards_v2Module.template_three,
.cardsModule.template_three {
  gap: 0;
  max-width: 144rem;
  margin: 0 auto;
  padding: 4rem 0;
  background: #F4F4F4;

  @include min-max(tablet, tablet) {
    padding: 4.8rem 4rem;
  }

  @include min(laptop) {
    padding: 4.8rem 8rem;
  }

  h2 {
    margin-top: 0;
    margin-bottom: 2.4rem;
  }

  p {
    margin-bottom: 0 !important;
  }

  @include min(tablet) {
    grid-template-columns: 1fr;
  }

  > div:first-child {
    margin: 0;
    max-width: 112.8rem;
    padding: 0 1.6rem 2.4rem;

    @include min-max(tablet, tablet) {
      padding: 0;
    }

    @include min(tablet) {
        padding: 1.6rem 0;
    }
  }

  > div:last-of-type {
    padding: 1.6rem;
  }
}

.viewMore {
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2.7rem; 
  text-transform: capitalize;

  @include flex-align(center, flex-start);

  color: #165AF8;
  gap: .4rem;

  svg{
    margin-top: .2rem;
  }
}


.lotto, .daily_lotto, .powerball {
  min-height: 103.5rem;
}

.sportstake {
  min-height: 42rem;
}

.archiveModule_suspense {
  min-height: 100rem;
}

.google_preferred_sourceModule {
  padding-bottom: 0;

  &.noModuleIntro {
    padding: 0;
  }
}