<!DOCTYPE html>
<html lang="en-US">

<head>
    <meta charset="UTF-8">
    <title>Draft Sample</title>
    <style>
        :root {
            --typo-color: tomato;
            --wording-color: rgb(0, 177, 236);
            --overlay-color: rgba(187, 184, 184, 0.5);
        }

        @page {
            @top-left-corner {
                content: "draft";
                /* Put the overlay in the foreground. */
                z-index: 1; 
                /* Center overlay on the page and rotate it. */
                transform: translateY(50-ro-ph) translateY(-50%) translateX(50-ro-pw) translateX(-50%) rotate(-54.7deg);
                transform-origin: center center;

                font-size: 11.5rem;
                text-transform: uppercase;
                letter-spacing: 7.5pt;
                /* Collapse white-space and suppress line breaks. */
                white-space: nowrap; 
                color: var(--overlay-color);

                border: 0.075em solid currentColor;
                padding: 0 37pt;
                border-radius: 15pt;

                position: absolute;
                top: 0;
                left: 0;

            }

            @top-right {
                /* Position running element in the page margin box. */
                content: element(legend); 
            }

            margin: 42pt;
        }

        html,
        body {
            font-family: sans-serif;
            padding: 0;
            margin: 0;
            font-size: 10pt;
            line-height: 1.3;
            /* Margins of blocks at the beginning of pages or columns are always truncated to zero. */
            -ro-truncate-margin-after-break: always;
        }

        h1 {
            font-size: 1.8em;
        }

        h2 {
            font-size: 1.3em;
            margin: 0;
        }

        p,
        li {
            font-size: 1rem;
            hyphens: auto;
            hyphenate-before: 3;
            hyphenate-after: 3;
        }

        li {
            margin-bottom: 10pt;
        }

        p {
            text-align: justify;
        }

        .multicolumn {
            columns: 2;
            column-rule: 1pt gray solid;
            column-gap: 1.8em;
            margin: 11pt;
            /* Create a new baseline grid using its own font and line layout settings. */
            -ro-line-grid: create;
        }

        .multicolumn > p {
            /* Make the lines in the two columns of the document to snap to the same baselines. */
            -ro-line-snap: baseline;
        }

        .imgFigure {
            margin-top: 7.5pt;
            margin-bottom: 7.5pt;
            margin-left: 0;
            margin-right: 0;

            width: 100%;

            text-align: center;
            font-size: 0.8rem;
            font-style: italic;
        }

        img {
            width: 100%;
        }

        .sources {
            page-break-before: avoid;
            border: black 0.75pt solid;
            border-radius: 7.5pt;
            background-color: #f0eeee;
            padding: 7.5pt;
            font-size: 0.8rem;
            /* Float the element to the bottom of the page. */
            float: -ro-bottom;
        }
        a {
            color: black;
        }

        .sourceHeading {
            text-align: center;
        }


        /* Change Bars */

        .typo {
            /* Shorthand for -ro-change-bar-color, -ro-change-bar-position and -ro-change-bar-offset. */
            -ro-change-bar: var(--typo-color) right 30%;
            color: var(--typo-color);
        }

        .wording {
            /* Shorthand for -ro-change-bar-color and -ro-change-bar-position. */
            -ro-change-bar: var(--wording-color) left;
            color: var(--wording-color);
        }

        .multicolumn .typo,
        .multicolumn .wording {
            /* Position the change bars on the outside of their column in a multi-column layout. */
            -ro-change-bar-align: outside distribute-column;
        }

        .multicolumn .typo {
            /* Change the offset of a change bar. */
            -ro-change-bar-offset: 35%;
        }


        /* Running Element */

        .legend {
            position: running(legend);
            break-inside: avoid;
            align-self: right;
            justify-self: right;
            width: max-content;

            border: 1pt solid black;
            padding: 0.5em;
        }

        #typoLegend {
            border-left: 2pt solid var(--typo-color);
            padding-left: 2pt;
            display: inline;
        }

        #wordingLegend {
            border-left: 2pt solid var(--wording-color);
            padding-left: 2pt;
            display: inline;
        }
    </style>
</head>

<body>
    <div class="legend">
        <p id="typoLegend">Typos</p>
        <p id="wordingLegend">Wording</p>
    </div>
    <h1>Study suggests Mars hosted life-sustaining habitat for millions of years</h1>
    <div class="introduction">
        <p>In a new study announced on Monday and available in the current volume of Earth and Planetary Science
            Letters, an international team led by scientists from Brown University in the United States said the planet
            Mars once had the right water and <span class="typo">temperatuers</span> to host simple life forms — just
            not on its surface. Mars's
            rocky, subterranean layer once, for some hundreds of millions of years, had enough water and <span class="wording">reductants</span> to
            support some of the same kinds of microbial communities seen on Earth.</p>
    </div>
    <div class="multicolumn">
        <p>
            "We showed, based on basic physics and chemistry calculations, that the ancient Martian subsurface likely
            had enough dissolved hydrogen to power a global subsurface biosphere," reported lead author and current
            Brown graduate student Jesse Tarnas. The paper does not claim life on Mars did exist but rather that
            conditions suitable for life are very likely to have lasted for an extended time. This habitable zone,
            located beneath Mars's then-frozen surface, would have reached several kilometers into Mars's surface,
            potentially protected by ice above.
        </p>
        <figure class="imgFigure">
            <img src="img/Perspective_view_of_Korolev_crater.jpg">
            <figcaption>Korolev Crater is estimated to contain 2,200 cubic kilometres (530 cu mi) of water ice.
            </figcaption>
        </figure>
        <p>
            The study showed that, during Mars's Noachian period (4.1–3.7 billion years ago), radiolysis, the process by
            which radiation splits water molecules apart, produced enough hydrogen gas (H2) for microbial organisms to
            live on so long as they remained within the area just beneath the <span class="typo">cryoshere</span>, the SHZ (subcryospheric
            highly-fractured zone). The concentration of hydrogen in the groundwater could have ranged from about 35 to
            about 55 <span class="wording">millimoles</span> per liter depending on whether ancient Mars was warm or <span class="typo">colt</span>,
            respectively, and higher if the subsurface medium also contained enough salt. The researchers determined this by establishing three
            factors. First, they examined data from the gamma ray spectrometer aboard NASA's Odyssey spacecraft, from
            which they inferred how much of various radioactive elements would have been present in Mars's crust during
            the Noachian, and therefore how much radiation would have been available to split water and so produce
            hydrogen. They then built on existing <span class="wording">models of water flow</span> on Mars to <span class="typo">determin</span> how much groundwater would
            have been present. Third, they used climate and geothermal modeling to determine how much of that water
            would have been in liquid form and at a suitable temperature for living things.
        </p>
        <p>
            In subterranean environments on Earth called subsurface lithotrophic microbial ecosystems, or SLiMEs,
            ecosystems sustain themselves not on plants that harness sunlight through <span class="wording">photosynthesis but on microbes
            that harvest electrons</span> from nearby molecules. Molecular hydrogen is an especially good electron donor.
        </p>
        <p>
            One of the study authors, Brown Professor John Mustard, is on the team designing the next Mars Rover
            mission, scheduled for 2020. He and Tarnas recommended the Rover examine the sites of meteorite crashes,
            which may have excavated rocks from this possibly habitable depth that may hold traces of ancient life.
        </p>
    </div>
    <div class="sources">
        <h2 class="sourceHeading">Sources</h2>
        <ul>
            <li><a href="https://en.wikinews.org/wiki/Study_suggests_Mars_hosted_life-sustaining_habitat_for_millions_of_years">
                https://en.wikinews.org/wiki/Study_suggests_Mars_hosted_life-sustaining_habitat_for_millions_of_years
            </a></li>
            <li><a href="https://en.wikipedia.org/wiki/Water_on_Mars#/media/File:Perspective_view_of_Korolev_crater.jpg">
                https://en.wikipedia.org/wiki/Water_on_Mars#/media/File:Perspective_view_of_Korolev_crater.jpg
            </a></li>
        </ul>
        <h2 class="sourceHeading">License</h2>
        <ul>
        <li><a href="https://creativecommons.org/licenses/by/2.5/#">https://creativecommons.org/licenses/by/2.5/#</a></li>
        </ul>
        <p>The original document has been modified to look like an editor's draft.</p>
    </div>
</body>

</html>