<section class="register-upsell">
  <header class="register-upsell-header">
    <h3 class="register-upsell__title">Experience the New <i>Foreign Affairs</i></h3>
    <p class="register-upsell__deck">Registered readers can enjoy three free articles per month.</p>
  </header>
  <div class="register-upsell__features">
    <h4 class="register-upsell__features-title">Get Access to Powerful Features</h4>
    <p class="register-upsell__features-item"><span class="register-upsell-icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 18"><defs></defs><polygon points="0 0 0 18 6.03 13.96 12 18 12 0 0 0"/></svg></span>Save Articles to Read Later</p>
    <p class="register-upsell__features-item"><span class="register-upsell-icon"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 viewBox="19.8 322.2 963.5 963.5" enable-background="new 19.8 322.2 963.5 963.5" xml:space="preserve">
<path d="M978.2,570.7L734.8,327.3c-5.1-5.1-10.1-5.1-15.2-5.1c-5.1,0-10.1,0-10.1,5.1L90.8,946l0,0c0,0-5.1,5.1-5.1,10.1l0,0
	l-65.9,309.3l0,0c0,0,0,0,0,5.1s10.1,15.2,15.2,15.2c0,0,0,0,5.1,0l0,0l309.3-65.9l0,0c5.1,0,5.1,0,10.1-5.1L978.2,596
	c5.1-5.1,5.1-5.1,5.1-10.1C983.3,580.9,983.3,575.8,978.2,570.7z M329.1,1189.4l-268.8,55.8l55.8-268.8h106.5v86.2
	c0,10.1,10.1,15.2,15.2,15.2H324L329.1,1189.4z M364.6,1159v-96.3c0-10.1-10.1-15.2-15.2-15.2h-86.2v-86.2
	c0-10.1-10.1-15.2-15.2-15.2h-96.4l446.3-446.3L816,717.9L364.6,1159z M836.2,687.4L618.1,469.3l106.5-106.5l218.1,218.1
	L836.2,687.4z"/>
</svg>
</span>Notes & Highlights</p>
    <p class="register-upsell__features-item"><span class="register-upsell-icon"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 viewBox="19.8 322.2 963.5 963.5" enable-background="new 19.8 322.2 963.5 963.5" xml:space="preserve">
<path d="M978.2,570.7L734.8,327.3c-5.1-5.1-10.1-5.1-15.2-5.1c-5.1,0-10.1,0-10.1,5.1L90.8,946l0,0c0,0-5.1,5.1-5.1,10.1l0,0
	l-65.9,309.3l0,0c0,0,0,0,0,5.1s10.1,15.2,15.2,15.2c0,0,0,0,5.1,0l0,0l309.3-65.9l0,0c5.1,0,5.1,0,10.1-5.1L978.2,596
	c5.1-5.1,5.1-5.1,5.1-10.1C983.3,580.9,983.3,575.8,978.2,570.7z M329.1,1189.4l-268.8,55.8l55.8-268.8h106.5v86.2
	c0,10.1,10.1,15.2,15.2,15.2H324L329.1,1189.4z M364.6,1159v-96.3c0-10.1-10.1-15.2-15.2-15.2h-86.2v-86.2
	c0-10.1-10.1-15.2-15.2-15.2h-96.4l446.3-446.3L816,717.9L364.6,1159z M836.2,687.4L618.1,469.3l106.5-106.5l218.1,218.1
	L836.2,687.4z"/>
</svg>
</span>Reader Anthologies TK</p>
  </div>
  <form class="register-upsell-form">
    <div class="search-item">
      <input type="text"  placeholder="Your Email"/>
    </div>
    <div class="search-item">
      <input type="text"  placeholder="Your Password"/>
    </div>
    <div class="register-upsell-buttons">
      <!-- Inputs are on same line DELIBERATELY. If they are on separate lines,
       the browser puts a nbsp in between them to create spacing which is not
       reflected in Drupal. -->
      <input class="button__blue" type="button" value="Sign In" /><input class="button__red-reversed" type="button" value="register" />
    </div>
  </form>
  <p class="register-upsell-helper"><a href="#">Forgot your username or password?</a></p>
  <p class="register-upsell-helper"><a href="#">Already a subscriber but dont have a login?</a></p>
</section>