<commit_before>/*

Copied from the custom CSS macro template https://developer.mozilla.org/en-US/docs/Template:CustomCSS
This file was added to by the contributors as part of the redesign migration, it contains:
- legacy classes in use from old versions of the MDN
- new classes created to when contibutors needed something the devs did not provide
- fixes for bugs filed that the dev team did not get to

In a perfect world we go through the contents of this file and integrate it with the dev team's CSS files
eventually emptying this file.

 */
/* Used for footnotes in {{PricePointTable}} (footnotes styles should be unified) */
.footnote {
    vertical-align: super;
    font-size: 60%;
}
/* Make the 2nd breadcrumbs disappear, only if the page has been regenerated with a modern template */
.column-container #wikiArticle .themeUpdated {
    display: none;
}
/* Used to wrap columns that should all be the same height */
.equalColumnHeights {
    display: table;
    border-collapse: separate;
    border-spacing: 20px;
}
.equalColumnHeights div {
    display: table-cell;
    width: 50%;
    height: 100%;
}
/* Use for large table (.thirdColumn + .***Bg) */
table#fullwidth-table td.thirdColumn {
    width: 30%;
}
.greenBg {
    width: 30%;
    background-color: #80ff80;
}
.lightGreenBg {
    background-color: #dcffdc;
}
.yellowBg {
    background-color: #ffffdc;
}
.orangeBg {
    background-color: #ffa064;
}
.redBg {
    background-color: #f66;
}
/* highlighted (bottom) link in call-out boxes */
.callout-link-container {
    position: relative;
    height: 100%;
}
.callout-link-wrapper {
    padding-top: 32px;
}
.callout-link {
    font-style: italic;
    font-size: 14px;
    font-weight: normal;
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
}
/* remove left margin from Font Awesome icons inside wiki
     content; this is messing up document content */
#wikiArticle {$selector-icon} {
    margin-left: 0px;
}
/* Iframe for live sample centered (Test) */
.centered iframe {
    display: block;
    margin: 0 auto;
    border: none;
}
/* Simulate two columns for landing page, if enough space is available    */
@media (min-width:1050px) {
    .landing {
        display: table-row;
    }
    .section {
        display: table-cell;
        width: 50%;
    }
}
/* For Landing page boxes; these are boxes displayed within columns on landing
     pages, such as the Community and Related boxes. */
.landingPageBox {
    width: 100%;
    padding: 0px;
    border-bottom: 1px solid #bbb;
    margin-bottom: 3px;
}
.landingPageBox ul {
    padding-left: 44px;
}
/* Wide column box */
.wideColumnBox {
    vendorize(column-width, 375px);
}
.wideColumnBoxList li {
    line-height: 1.5;
    list-style-type: none;
    padding-left: 0;
    page-break-inside: avoid;
}
/* Multi-column boxes for lists of longer links; this will adapt based on screen width */
.multiColumnList {
    vendorize(column-width, 250px);
}
.multiColumnList li {
    line-height: 1.5;
    list-style-type: none;
    padding-left: 0;
    page-break-inside: avoid;
}
/* Multi-column boxes for smaller links, such as API terms */
.smallMultiColumnList {
    vendorize(column-width, 120px);
}
.smallMultiColumnList li {
    list-style-type: none;
    padding-left: 0;
    page-break-inside: avoid;
}
/* Multi-column box for smaller text */
.horizFlexboxContainer {
    display: flex;
    display: -webkit-flex;
    vendorize(flex-flow, column nowrap);
    vendorize(justify-content, center);
    vendorize(align-content, center);
    vendorize(align-items, center);
    vendorize(flex-direction, column);
}
div.smallTextMultiColumnBoxHeading {
    background-color: #aac;
    border-radius: 10px 10px 0 0;
    border: 2px solid #ccc;
    vendorize(order, 1);
    width: 75%;
    padding: 10px;
    vendorize(flex, 0 1 auto);
    font-weight: bold;
}
div.smallTextMultiColumnBoxList {
    border: 2px solid #ccc;
    background-color: #ddf;
    border-top: 0;
    border-radius: 0 0 10px 10px;
    width: 75%;
    padding: 10px;
    vendorize(order, 2);
    vendorize(flex, 0 1 auto);
}
div.smallTextMultiColumnBoxList ul {
    vendorize(column-width, 100px);
}
div.smallTextMultiColumnBoxList li {
    list-style-type: none;
    padding-left: 0;
    font-size: 80%;
}
/* For ending "text alongside images" blocks; add this class to the first block that shouldn't be next to the image */
.endImageWrapping {
    clear: both;
}<commit_msg>Bug 1100643: Integrate CustomCSS - smallTextMultiColumnBox<commit_after>/*

Copied from the custom CSS macro template https://developer.mozilla.org/en-US/docs/Template:CustomCSS
This file was added to by the contributors as part of the redesign migration, it contains:
- legacy classes in use from old versions of the MDN
- new classes created to when contibutors needed something the devs did not provide
- fixes for bugs filed that the dev team did not get to

In a perfect world we go through the contents of this file and integrate it with the dev team's CSS files
eventually emptying this file.

 */
/* Used for footnotes in {{PricePointTable}} (footnotes styles should be unified) */
.footnote {
    vertical-align: super;
    font-size: 60%;
}
/* Make the 2nd breadcrumbs disappear, only if the page has been regenerated with a modern template */
.column-container #wikiArticle .themeUpdated {
    display: none;
}
/* Used to wrap columns that should all be the same height */
.equalColumnHeights {
    display: table;
    border-collapse: separate;
    border-spacing: 20px;
}
.equalColumnHeights div {
    display: table-cell;
    width: 50%;
    height: 100%;
}
/* Use for large table (.thirdColumn + .***Bg) */
table#fullwidth-table td.thirdColumn {
    width: 30%;
}
.greenBg {
    width: 30%;
    background-color: #80ff80;
}
.lightGreenBg {
    background-color: #dcffdc;
}
.yellowBg {
    background-color: #ffffdc;
}
.orangeBg {
    background-color: #ffa064;
}
.redBg {
    background-color: #f66;
}
/* highlighted (bottom) link in call-out boxes */
.callout-link-container {
    position: relative;
    height: 100%;
}
.callout-link-wrapper {
    padding-top: 32px;
}
.callout-link {
    font-style: italic;
    font-size: 14px;
    font-weight: normal;
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
}
/* remove left margin from Font Awesome icons inside wiki
     content; this is messing up document content */
#wikiArticle {$selector-icon} {
    margin-left: 0px;
}
/* Iframe for live sample centered (Test) */
.centered iframe {
    display: block;
    margin: 0 auto;
    border: none;
}
/* Simulate two columns for landing page, if enough space is available    */
@media (min-width:1050px) {
    .landing {
        display: table-row;
    }
    .section {
        display: table-cell;
        width: 50%;
    }
}
/* For Landing page boxes; these are boxes displayed within columns on landing
     pages, such as the Community and Related boxes. */
.landingPageBox {
    width: 100%;
    padding: 0px;
    border-bottom: 1px solid #bbb;
    margin-bottom: 3px;
}
.landingPageBox ul {
    padding-left: 44px;
}
/* Wide column box */
.wideColumnBox {
    vendorize(column-width, 375px);
}
.wideColumnBoxList li {
    line-height: 1.5;
    list-style-type: none;
    padding-left: 0;
    page-break-inside: avoid;
}
/* Multi-column boxes for lists of longer links; this will adapt based on screen width */
.multiColumnList {
    vendorize(column-width, 250px);
}
.multiColumnList li {
    line-height: 1.5;
    list-style-type: none;
    padding-left: 0;
    page-break-inside: avoid;
}
/* Multi-column boxes for smaller links, such as API terms */
.smallMultiColumnList {
    vendorize(column-width, 120px);
}
.smallMultiColumnList li {
    list-style-type: none;
    padding-left: 0;
    page-break-inside: avoid;
}
/* Multi-column box for smaller text */
.horizFlexboxContainer {
    display: -webkit-flex;
    display: flex;
    vendorize(flex-flow, column nowrap);
    vendorize(justify-content, center);
    vendorize(align-content, center);
    vendorize(align-items, center);
    vendorize(flex-direction, column);
}
.smallTextMultiColumnBoxHeading {
    width: 75%;
    padding: 10px;
    vendorize(flex, 0 1 auto);
    font-weight: bold;
    background-color: #e0e2e4;
}
.smallTextMultiColumnBoxList {
    width: 75%;
    padding: 10px;
    vendorize(order, 2);
    vendorize(flex, 0 1 auto);
    background-color: $light-background-color;
}
.smallTextMultiColumnBoxList ul {
    vendorize(column-width, 100px);
    margin-bottom: 0;
    padding-left: 0;
}
.smallTextMultiColumnBoxList li {
    list-style-type: none;
    padding-left: 0;
    font-size: 80%;
}

@media $media-query-mobile {
    .smallTextMultiColumnBoxHeading,
    .smallTextMultiColumnBoxList {
        width: 90%;
    }
}

/* For ending "text alongside images" blocks; add this class to the first block that shouldn't be next to the image */
.endImageWrapping {
    clear: both;
}
{'fraction_non_alphanumeric': 0.111160764160429, 'fraction_numerical': 0.021896994749190036, 'mean_word_length': 3.159851301115242, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 2, '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': '4887356', 'n_tokens_mistral': 3049, 'n_tokens_neox': 2810, 'n_words': 914}