.grid-container {
  padding-left: 2.8rem;
  padding-right: 2.8rem;

  @include breakpoint($tablet) {
    padding-left: 6.8rem;
    padding-right: 6.8rem;
  }

  @include breakpoint($tablet-lg) {
    max-width: units($tablet-lg);
  }

  @include breakpoint($desktop) {
    max-width: none;
    padding-left: 8.8rem;
    padding-right: 8.8rem;
  }

  @include breakpoint($widescreen) {
    max-width: units($widescreen);
  }
}

@include at-media-max('desktop') {
  .primary-layout-columns {
    flex-direction: column;
  }

  .usa-layout-docs__sidenav.layout-sidebar-first {
    order: 1 !important;
    margin-bottom: 4rem;
    padding-top: 0;

    + .usa-layout-docs__main {
      order: 2 !important;
    }
  }
}

@include at-media('desktop') {
  .usa-layout-docs__sidenav.layout-sidebar-first {
    padding-top: 0;
    //margin-right: 4rem;
    //width: calc(25% - 4rem);
    order: 1 !important;
  }

  .usa-layout-docs__sidenav.layout-sidebar-second {
    padding-top: 0;
    //margin-left: 4rem;
    //width: calc(25% - 4rem);
  }
}

.usa-layout-docs__sidenav.layout-sidebar-second {
  font-size: 1.5rem;

  > div ~ div {
    margin-top: $row-spacing;

    &.block-views-blockpublic-comments-block-2 {
      margin-top: 1rem;
    }
  }
}


// holy grail footer
.dialog-off-canvas-main-canvas {
  display: flex;
  flex-direction: column;
  min-height: 100vh;

  .main-content {
    flex-grow: 1;
  }

  .usa-footer--big {
    justify-self: flex-end;
  }
}


.grid-row.grid-gap-lg {
  margin-left: -3rem;
  margin-right: -3rem;

  > div {
    padding-left: 3rem;
    padding-right: 3rem;
  }
}

//webform progress tracker override the external library
.progress-tracker {
  margin-top: 0px;
}

.webform-progress-tracker .progress-step .progress-text {
  margin-bottom: 3rem; }

