anchor.diff:  
     <section class="tool-try-it bg-connect-yellow bg-image-connect-pattern-bullseye">
       <h2 class='q-h1'>Try It Out for Yourself</h2>
  -    <a href='http://connect.quill.org/#/play/lesson/-KnBeexyhssSWcrSEfpr' target="_blank" class="q-button cta-button bg-white text-connect-yellow">Preview Quill Connect</a>
  +    <a href='https://connect.quill.org/#/play/lesson/-KnoWhUWhtxvet4_bi4r' target="_blank" class="q-button cta-button bg-white text-connect-yellow">Preview Quill Connect</a>
     </section>
   
     <section>
       <div class="boy-playing-quill">
  -      <img src="/images/tools/connect/laura_marshall_student.png" alt="boy playing quill">
  +      <img src=<%= "#{ENV['CDN_URL']}/images/tools/connect/laura_marshall_student.png" %> alt="boy playing quill">
       </div>
     </section>
   
  
positive.code:       </div>
          <div class="walk-thru-step">
              <div class="content-wrapper">
                <img src="/images/tools/connect/attempt_1.png" alt="connect image">
                <div class="blurb">
                  <h2><span>1st Attempt:</span> Show Relationships</h2>
                  <p>Using <span>and</span> is a very common pattern for emerging writers. Quill challenges the student to revise the sentence to express a causal relationship, which is an important step towards conveying complex ideas.</p>
                </div>
              </div>
          </div>
          <div class="walk-thru-step">
              <div class="content-wrapper">
                <img src="/images/tools/connect/attempt_2.png" alt="connect image">
                  <div class="blurb">
                    <h2><span>2nd Attempt:</span> Use Pronouns</h2>
                    <p>
                      The student showed the correct relationship but unnecessarily repeated a noun. Quill guides the student towards using a pronoun to make the sentence more fluid.
                    </p>
                  </div>
              </div>
          </div>
          <div class="walk-thru-step">
            <div class="content-wrapper">
              <img class="img-attempt-3" src="/images/tools/connect/attempt_3.png" alt="connect image">
                <div class="blurb">
                  <h2><span>3rd Attempt:</span> Use Punctuation</h2>
                  <p>
                    The student used a pronoun effectively but left out the comma. Quill provides feedback and shows a model sentence to help guide the student.
                   </p>
                </div>
            </div>
          </div>
          <div class="walk-thru-step">
            <div class="content-wrapper">
              <img class="img-attempt-4" src="/images/tools/connect/attempt_4.png" alt="connect image">
                <div class="blurb">
                    <h2><span>4th Attempt:</span> Strong Sentence!</h2>
                    <p>
  
negative.code:                 <p class="prompt-header">
                    PROMPT
                  </p>
                  <p class="prompt-text">Patrick Henry opposed new British taxes.</p>
                  <p class="prompt-text">He gave a speech.</p>
                  <p class="prompt-text">The speech was powerful.</p>
                  <p class="prompt-text">The speech was to inspire the colonists.</p>
                </div>
                <div class="blurb introduction">
                    <h2>How Quill Connect Gives Feedback</h2>
                    <p>
                      In the prompt, students have to join together four ideas. There are many different ways of joining these ideas together, and Quill serves feedback on hundreds of potential answers. Here is a student’s progression from the first attempt to a strong sentence.
                    </p>
                </div>
            </div>
        </div>
          <div class="walk-thru-step flex-row vertically-centered">
              <div class="content-wrapper flex-row space-between vertically-centered">
                  <img class="arrow arrow-1" src=<%= "#{ENV['CDN_URL']}/images/tools/connect/arrow_1.png" %>>
                  <img class="negative-left-margin" src=<%= "#{ENV['CDN_URL']}/images/tools/connect/attempt_1.png" %> alt="connect image">
                  <div class="blurb blurb-attempt-1">
                      <h2><span>1st Attempt:</span> Write Concisely</h2>
                      <p>
                          The student used <span>and</span> to join the sentences together. This is a very common pattern for emerging writers. Quill breaks this pattern by challenging students to revise their work.
                      </p>
                  </div>
              </div>
          </div>
          <div class="walk-thru-step flex-row vertically-centered">
              <div class="content-wrapper flex-row space-between vertically-centered">
                <img class="negative-left-margin" src=<%= "#{ENV['CDN_URL']}/images/tools/connect/attempt_2.png"%> alt="connect image">
                  <div class="blurb blurb-attempt-2">
                      <h2><span>2nd Attempt:</span> Show Relationships</h2>
                      <p>
                        While using <span>and</span> is grammatically correct, it is not the strongest way of conveying the relationship between the ideas. Students must express the causal relationship here, an important step towards conveying complex ideas.
                      </p>
                  </div>
                  <img class="arrow arrow-2" src=<%= "#{ENV['CDN_URL']}/images/tools/connect/arrow_2.png" %>>
              </div>
          </div>
          <div class="walk-thru-step flex-row vertically-centered">
              <div class="content-wrapper flex-row space-between vertically-centered">
                <img class="arrow arrow-3" src=<%= "#{ENV['CDN_URL']}/images/tools/connect/arrow_3.png" %>>
                <img class="negative-left-margin img-attempt-3" src=<%= "#{ENV['CDN_URL']}/images/tools/connect/attempt_3.png" %> alt="connect image">
                  <div class="blurb blurb-attempt-3">
                      <h2><span>3rd Attempt:</span> Use Punctuation</h2>
                      <p>
                        The student showed the correct relationship but left out the comma. Quill provides feedback and shows a model sentence to help guide the student.
                      </p>
                  </div>
              </div>
          </div>
          <div class="walk-thru-step flex-row vertically-centered">
              <div class="content-wrapper flex-row space-between vertically-centered">
                <img class="negative-left-margin img-attempt-4" src=<%= "#{ENV['CDN_URL']}/images/tools/connect/attempt_4.png" %> alt="connect image">
                  <div class="blurb blurb-attempt-4">
                      <h2><span>4th Attempt:</span> Strong Sentence!</h2>
                      <p>
  