<!DOCTYPE html>
<html>
    <head>
        <style>
            .container1 {
                margin: 4px;
                color: blue;
            }
            .container1 > span {
                border: 1px solid blue;
            }
            .container2 {
                margin: 4px;
                color: red;
            }
            .container2 > span {
                border: 1px solid red;
            }
        </style>
    </head>
    <body>
        <p>This test verifies that the value of currentColor is updated correctly when the style is updated. If the text is successful, each of the line should be styled as described by its text.</p>

        <div class="container1">
            <span>This text and border should be blue.</span>
        </div>
        <div class="container2">
            <span>This text and border should be red.</span>
        </div>
        <div class="container2">
            <span>This text and border should be red.</span>
        </div>
        <div class="container1">
            <span>This text and border should be blue.</span>
        </div>
        <div class="container2">
            <span>This text and border should be red.</span>
        </div>
        <div class="container1">
            <span>This text and border should be blue.</span>
        </div>
        <div class="container2">
            <span>This text and border should be red.</span>
        </div>
        <div class="container1">
            <span>This text and border should be blue.</span>
        </div>
    </body>
</html>