<commit_before>@import "../shared/utils";
@import "../shared/grid";
@import "../shared/document_view";
@import "../shared/typography";

#wrapper {
  @include grid_styles;
  @include type_styles;

  min-height: 37em;
  background: #f5f5f5;
  max-width: 100%;
  @include vertical_gradient(#fff, #f5f5f5);

  section {
    margin: 0;
    width: auto;
  }

  article {
    background: transparent;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    float: none;
    margin-right: 0;
    min-height: inherit;
    position: inherit;
    width: auto;
    z-index: inherit;
  }

  img {
    width: 100%;
  }

  #content {
    margin: 0 auto;
    width: 92%;

    padding-top: 1.5em;
    padding-bottom: 3em;


    @media only screen and (min-width: 600px) {
      width: 81%;
    }

    h1.page_title {
      @include type-36;
      text-shadow: #fff 0px 1px 0;
      border-bottom: 2px solid #ddd;
      color: #999;
    }

    .secondary {
      > section, div > section {
        border: 1px solid #ddd;
        padding: 2% 1em;
        background: #f9f9f9;
        margin-bottom: 1em;
        h1 {
          @include type-16;
          color: #555;
          border-bottom: 1px solid #ccc;
          margin-bottom: 0.4444em;
        }

        ul {
          margin-bottom: 0.5em;

          li {
            @include type-12;
            margin-bottom: 0.75em;

            p {
              font-size: inherit;
              line-height: inherit;
              margin-bottom: 0;
            }

            h3 {
              margin-bottom: 0;
            }
          }
        }

        p {
          @include type-12;
        }
      }
      section#inapplicable_nations {
        p {
          @include type-12;
          margin-bottom: 0;
        }
      }
    }
  }

  .document_view {
    @include document_view;
  }
}

#wrapper {
  padding-top: 8em;

  @media only screen and (min-width: 761px) {
    padding-top: 6em;
  }
}

.lte-ie8 {
  #wrapper {
    padding-top: 6em;
    max-width: 100%;
    min-width: 761px;
    width: auto;
  }
}

#grid-helper {
  @extend #content;
  height: 3000px;
  z-index: 99999;
  width: 100%;

  @media only screen and (min-width: 600px) {
    width: 81%;
  }

  .g3 {
    background: green url('/images/24px_grid_bg.png');
    height: 100%;
    opacity: 0.5;
    @media only screen and (min-width: 1800px) {
      background-image: url('/images/28px_grid_bg.png');
    }
  }

  .g1 {
    background: red;
    height: 100%;
    opacity: 0.5;
  }
}<commit_msg>Improved consistency of page top-padding over different viewport sizes.<commit_after>@import "../shared/utils";
@import "../shared/grid";
@import "../shared/document_view";
@import "../shared/typography";

#wrapper {
  @include grid_styles;
  @include type_styles;

  min-height: 37em;
  background: #f5f5f5;
  max-width: 100%;
  @include vertical_gradient(#fff, #f5f5f5);

  @media only screen and (min-width:670px) {
    padding-top: 7.9em;
  }

  @media only screen and (min-width: 863px) {
    padding-top: 6.4em;
  }

  section {
    margin: 0;
    width: auto;
  }

  article {
    background: transparent;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    float: none;
    margin-right: 0;
    min-height: inherit;
    position: inherit;
    width: auto;
    z-index: inherit;
  }

  img {
    width: 100%;
  }

  #content {
    margin: 0 auto;

    padding-top: 0;
    padding-bottom: 3em;

    @media only screen and (min-width: 600px) {
      width: 81%;
    }

    h1.page_title {
      @include type-36;
      text-shadow: #fff 0px 1px 0;
      border-bottom: 2px solid #ddd;
      color: #999;
    }

    .secondary {
      > section, div > section {
        border: 1px solid #ddd;
        padding: 2% 1em;
        background: #f9f9f9;
        margin-bottom: 1em;
        h1 {
          @include type-16;
          color: #555;
          border-bottom: 1px solid #ccc;
          margin-bottom: 0.4444em;
        }

        ul {
          margin-bottom: 0.5em;

          li {
            @include type-12;
            margin-bottom: 0.75em;

            p {
              font-size: inherit;
              line-height: inherit;
              margin-bottom: 0;
            }

            h3 {
              margin-bottom: 0;
            }
          }
        }

        p {
          @include type-12;
        }
      }
      section#inapplicable_nations {
        p {
          @include type-12;
          margin-bottom: 0;
        }
      }
    }
  }

  .document_view {
    @include document_view;
  }
}

.lte-ie8 {
  #wrapper {
    padding-top: 6em;
    max-width: 100%;
    min-width: 761px;
    width: auto;
  }
}

#grid-helper {
  @extend #content;
  height: 3000px;
  width: 100%;

  @media only screen and (min-width: 600px) {
    width: 81%;
  }

  .g3 {
    z-index: 99999;
    background: green url('/images/24px_grid_bg.png');
    height: 100%;
    opacity: 0.5;
    @media only screen and (min-width: 1800px) {
      background-image: url('/images/28px_grid_bg.png');
    }
  }

  .g1 {
    background: red;
    height: 100%;
    opacity: 0.5;
  }
}
{'fraction_non_alphanumeric': 0.1323729803387191, 'fraction_numerical': 0.04749854000389332, 'mean_word_length': 1.6649377593360997, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 7, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '812337', 'n_tokens_mistral': 2013, 'n_tokens_neox': 1788, 'n_words': 410}