<commit_before>.container {

  // @TODO: move this to apply globally, but not until it can be checked properly.
  h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
  }

  > .wrapper {
    padding: 1rem;
    @include clearfix();

    @include media($tablet) {
      @include span-columns(12);
      @include shift(2);
      float: none;
      padding: 1rem 0;
    }

    @include media($desktop) {
      padding: 1.5rem 0;
    }
  }

  // @TODO: (Revisit) Not supported in IE8; maybe use a class instead...
  // but makes dictating extra padding on first item easy @_@
  &:first-of-type {
    > .wrapper {
      padding-top: 2rem;
    }

    // If this is the first .container but has a header that's a .banner, then don't add the extra padding.
    .container__title + .wrapper {
      padding-top: 1.5rem;
    }
  }

  > .gallery {
    padding: 1rem 0;

    @include media($desktop) {
      padding: 1.5rem 0;
    }
  }

  .-columned {
    @include media($tablet) {
      @include span-columns(6 of 12);
    }
  }

  .-columned + .-columned {
    margin-top: 1rem;

    @include media($tablet) {
      margin-top: 0;
    }
  }

  aside {
    img {
      @include fluid-image();
      width: 100%;
    }
  }

}


// Styles for Container Titles.
.container__title {
  line-height: 1.1;
  margin: 0 0 1rem;  // @TODO: remove margins. Should be done globally!

  &.banner {
    margin-bottom: 0;
    padding: .75rem .5rem;

    > span {
      display: inline-block;
      line-height: 1; // @TODO: Move to Neue.

      @include media($tablet) {
        @include shift(2 of 16);
      }
    }
  }

  @include media($tablet) {
    margin-bottom: 1.5rem;
  }
}


// Styles for Container Body content.
.container__body {
  @include clearfix();

  p {
    margin-bottom: 0;
  }

  // <p> tags following other items.
  p + p,
  ul + p {
    margin-top: 1.5rem;
  }

  ul {
    margin-bottom: 0;
  }

  // Items following a <p> tag.
  p + ul,
  p + aside {
    margin-top: 1.5rem;
  }

  // Items following a list, <ul> or <ol>
  ul + h3,
  ol + h3 {
    margin-top: 1.5rem;
  }

  // Form items inside Container Body.
  form {
    padding-top: 1rem;
  }

  .form-actions {
    clear: both;
    padding-top: 1rem;

    @include media($tablet) {
      text-align: left;
    }
  }

}

.container--facts-list {
  h3 {
    margin-bottom: 0.5rem;
  }
}



// IE BUG Fixes

.ie8 & {
  .-columned {
    @include media($tablet) {
      // Last-child not supported in IE8; using class as fallback.
      &.-col-last {
        margin-right: 0;
      }
    }
  }
}
<commit_msg>Added comments to css<commit_after>.container {

  // @TODO: move this to apply globally, but not until it can be checked properly.
  h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
  }

  > .wrapper {
    padding: 1rem;
    @include clearfix();

    @include media($tablet) {
      @include span-columns(12);
      @include shift(2);
      float: none;
      padding: 1rem 0;
    }

    @include media($desktop) {
      padding: 1.5rem 0;
    }
  }

  // @TODO: (Revisit) Not supported in IE8; maybe use a class instead...
  // but makes dictating extra padding on first item easy @_@
  &:first-of-type {
    > .wrapper {
      padding-top: 2rem;
    }

    // If this is the first .container but has a header that's a .banner, then don't add the extra padding.
    .container__title + .wrapper {
      padding-top: 1.5rem;
    }
  }

  > .gallery {
    padding: 1rem 0;

    @include media($desktop) {
      padding: 1.5rem 0;
    }
  }

  .-columned {
    @include media($tablet) {
      @include span-columns(6 of 12);
    }
  }

  .-columned + .-columned {
    margin-top: 1rem;

    @include media($tablet) {
      margin-top: 0;
    }
  }

  aside {
    img {
      @include fluid-image();
      width: 100%;
    }
  }

}


// Styles for Container Titles.
.container__title {
  line-height: 1.1;
  margin: 0 0 1rem;  // @TODO: remove margins. Should be done globally!

  &.banner {
    margin-bottom: 0;
    padding: .75rem .5rem;

    > span {
      display: inline-block;
      line-height: 1; // @TODO: Move to Neue.

      @include media($tablet) {
        @include shift(2 of 16);
      }
    }
  }

  @include media($tablet) {
    margin-bottom: 1.5rem;
  }
}


// Styles for Container Body content.
.container__body {
  @include clearfix();

  p {
    margin-bottom: 0;
  }

  // <p> tags following other items.
  p + p,
  ul + p {
    margin-top: 1.5rem;
  }

  ul {
    margin-bottom: 0;
  }

  // Items following a <p> tag.
  p + ul,
  p + aside {
    margin-top: 1.5rem;
  }

  // Items following a list, <ul> or <ol>
  ul + h3,
  ol + h3 {
    margin-top: 1.5rem;
  }

  // Form items inside Container Body.
  form {
    padding-top: 1rem;
  }

  .form-actions {
    clear: both;
    padding-top: 1rem;

    @include media($tablet) {
      text-align: left;
    }
  }

}

// Styles for Facts Listing page
.container--facts-list {
  h3 {
    margin-bottom: 0.5rem;
  }
}



// IE BUG Fixes

.ie8 & {
  .-columned {
    @include media($tablet) {
      // Last-child not supported in IE8; using class as fallback.
      &.-col-last {
        margin-right: 0;
      }
    }
  }
}

{'fraction_non_alphanumeric': 0.14043960319004084, 'fraction_numerical': 0.02567593853335927, 'mean_word_length': 1.8694196428571428, 'pattern_counts': {'":': 0, '<': 11, '<?xml version=': 0, '>': 19, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 2, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5397691', 'n_tokens_mistral': 2050, 'n_tokens_neox': 1886, 'n_words': 514}