<commit_before>@import "../breakpoints";
@import "../colors";
@import "../screen";

.chasm {
    @include full-screen-page();

    .chasm-screen {
        @include full-screen-container();
    }

    .chasm-blurb {
        @include full-screen-blurb();
    }
}

body.chasm-section {
    background-image: url('/img/backgrounds/paper.jpg');
    background-position: top center;

    .logo-link {
        background-image: url(/img/chasm-icon.png);
    }
}

$chasm-body-page-padding: 100px;

.chasm-body {
    color: $red;
    font-size: 20px;
    font-variant: small-caps;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;

    .chasm-body-page-top {
        background-image: url(/img/chasm/paper-top.png);
        background-repeat: no-repeat;
        background-size: 100%;
        height: 260px;
        margin-top: 50px;
        width: 100%;

        @include respond-to('tablet-down') {
            height: 150px;
        }

        @include respond-to('phone-down') {
            background-image: none;
            height: 50px;
        }
    }

    .chasm-body-page-bottom {
        background-image: url(/img/chasm/paper-bottom.png);
        background-position: bottom;
        background-repeat: no-repeat;
        background-size: 100%;
        height: 200px;
        width: 100%;

        @include respond-to('tablet-down') {
            height: 125px;
        }

        @include respond-to('phone-down') {
            background-image: none;
            height: 50px;
        }
    }

    .chasm-body-page {
        background-image: url(/img/chasm/paper-middle.png);
        background-repeat: repeat-y;
        background-size: 100%;
        padding: $chasm-body-page-padding;
        padding-top: 5px;
        width: 100%;

        p {
            position: relative;
        }

        @include respond-to('tablet-down') {
            padding: 50px;
            padding-top: 5px;
        }

        @include respond-to('phone-down') {
            background-image: none;
            padding: 10px;
        }
    }

    .chasm-body-key {
        color: $black;
        font-family: Linowrite;
        font-size: 28px;
        margin: 0 (-$chasm-body-page-padding);

        @include respond-to('tablet-down') {
            margin: 0 -50px;
        }

        @include respond-to('phone-down') {
            margin: 0;
        }
    }

    .chasm-body-key-image {
        float: left;
        width: 40%;

        @include respond-to('phone-down') {
            float: none;
            width: 100%;
        }
    }

    .chasm-body-key-text {
        float: right;
        width: 60%;

        @include respond-to('phone-down') {
            float: none;
            width: 100%;
        }
    }

    .chasm-body-key-text-attribution {
        font-size: 22px;
        font-variant: normal;
        font-weight: normal;
    }

    .chasm-body-key-separator {
        background-color: $black;
        height: 2px;
        margin: 10px auto;
        width: 80%;
    }

    .serial-displacement-crack,
    .serial-displacement-timeline {
        display: block;
        max-width: 100%;
        margin: 20px auto;
    }

    .policy-item {
        margin: 15px 0;

        @include respond-to('phone-down') {
            margin: 40px 0;
        }
    }

    .policy-item-header {
        display: inline-block;
        margin: 0;
        margin-left: -20px;

        &-text {
            background-image: url(/img/chasm-policy-header.png);
            background-repeat: no-repeat;
            background-size: cover;
            color: white;
            font-family: "affogato-regular";
            font-size: 20px;
            font-variant: small-caps;
            padding: 5px 20px;
        }

        &-figure {
            cursor: pointer;
            margin-left: 10px;
            vertical-align: bottom;
            width: 45px;
        }
    }

    .policy-item-image-container {
        background-image: url(/img/chasm-figure-background.png);
        background-repeat: no-repeat;
        background-size: cover;
        float: left;
        margin-left: 5%;
        padding: 10px;
        width: 30%;

        @include respond-to('phone-down') {
            float: none;
            margin-bottom: 15px;
            margin-left: 0;
            width: 100%;
        }

        img {
            cursor: pointer;
            max-width: 100%;
        }
    }

    .policy-item-body {
        float: right;
        margin-right: 5%;
        width: 50%;

        @include respond-to('phone-down') {
            float: none;
            margin-right: 0;
            width: 100%;
        }
    }
}
<commit_msg>Padding for quote<commit_after>@import "../breakpoints";
@import "../colors";
@import "../screen";

.chasm {
    @include full-screen-page();

    .chasm-screen {
        @include full-screen-container();
    }

    .chasm-blurb {
        @include full-screen-blurb();
    }
}

body.chasm-section {
    background-image: url('/img/backgrounds/paper.jpg');
    background-position: top center;

    .logo-link {
        background-image: url(/img/chasm-icon.png);
    }
}

$chasm-body-page-padding: 100px;

.chasm-body {
    color: $red;
    font-size: 20px;
    font-variant: small-caps;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;

    .chasm-body-page-top {
        background-image: url(/img/chasm/paper-top.png);
        background-repeat: no-repeat;
        background-size: 100%;
        height: 260px;
        margin-top: 50px;
        width: 100%;

        @include respond-to('tablet-down') {
            height: 150px;
        }

        @include respond-to('phone-down') {
            background-image: none;
            height: 50px;
        }
    }

    .chasm-body-page-bottom {
        background-image: url(/img/chasm/paper-bottom.png);
        background-position: bottom;
        background-repeat: no-repeat;
        background-size: 100%;
        height: 200px;
        width: 100%;

        @include respond-to('tablet-down') {
            height: 125px;
        }

        @include respond-to('phone-down') {
            background-image: none;
            height: 50px;
        }
    }

    .chasm-body-page {
        background-image: url(/img/chasm/paper-middle.png);
        background-repeat: repeat-y;
        background-size: 100%;
        padding: $chasm-body-page-padding;
        padding-top: 5px;
        width: 100%;

        p {
            position: relative;
        }

        @include respond-to('tablet-down') {
            padding: 50px;
            padding-top: 5px;
        }

        @include respond-to('phone-down') {
            background-image: none;
            padding: 10px;
        }
    }

    .chasm-body-key {
        color: $black;
        font-family: Linowrite;
        font-size: 28px;
        margin: 0 (-$chasm-body-page-padding);

        @include respond-to('tablet-down') {
            margin: 0 -50px;
        }

        @include respond-to('phone-down') {
            margin: 0;
        }
    }

    .chasm-body-key-image {
        float: left;
        width: 40%;

        @include respond-to('phone-down') {
            float: none;
            width: 100%;
        }
    }

    .chasm-body-key-text {
        float: right;
        padding-right: 5%;
        width: 55%;

        @include respond-to('phone-down') {
            float: none;
            padding-right: 0;
            width: 100%;
        }
    }

    .chasm-body-key-text-attribution {
        font-size: 22px;
        font-variant: normal;
        font-weight: normal;
    }

    .chasm-body-key-separator {
        background-color: $black;
        height: 2px;
        margin: 10px auto;
        width: 80%;
    }

    .serial-displacement-crack,
    .serial-displacement-timeline {
        display: block;
        max-width: 100%;
        margin: 20px auto;
    }

    .policy-item {
        margin: 15px 0;

        @include respond-to('phone-down') {
            margin: 40px 0;
        }
    }

    .policy-item-header {
        display: inline-block;
        margin: 0;
        margin-left: -20px;

        &-text {
            background-image: url(/img/chasm-policy-header.png);
            background-repeat: no-repeat;
            background-size: cover;
            color: white;
            font-family: "affogato-regular";
            font-size: 20px;
            font-variant: small-caps;
            padding: 5px 20px;
        }

        &-figure {
            cursor: pointer;
            margin-left: 10px;
            vertical-align: bottom;
            width: 45px;
        }
    }

    .policy-item-image-container {
        background-image: url(/img/chasm-figure-background.png);
        background-repeat: no-repeat;
        background-size: cover;
        float: left;
        margin-left: 5%;
        padding: 10px;
        width: 30%;

        @include respond-to('phone-down') {
            float: none;
            margin-bottom: 15px;
            margin-left: 0;
            width: 100%;
        }

        img {
            cursor: pointer;
            max-width: 100%;
        }
    }

    .policy-item-body {
        float: right;
        margin-right: 5%;
        width: 50%;

        @include respond-to('phone-down') {
            float: none;
            margin-right: 0;
            width: 100%;
        }
    }
}

{'fraction_non_alphanumeric': 0.13227287285149994, 'fraction_numerical': 0.025621863990605318, 'mean_word_length': 1.4275719098211972, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, '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': '4124491', 'n_tokens_mistral': 3147, 'n_tokens_neox': 2838, 'n_words': 542}