<div class="article-newsletter-signup--container container-bs">
  <div class="row align-items-center pt-3 pb-3 no-gutters sign-up-container" id="newsletter-sign-up-message">
    <div class="col-12 col-md-9">
      <h3 class="title">Get <em>Foreign Affairs'</em> best articles in your in-box.</h3>
      <div class="subtitle" for="edit-name">Sign up for our newsletters.</div>
    </div>
    <div class="col-12 col-md-3">
      <form>
        <input type="submit" class="w-100 button__blue-reversed--white form-submit sign-up-button ajax-processed" value="SIGN UP" />
      </form>
    </div>
  </div>
  <div class="row sign-up-form">
      <div class="col-12 pt-2 pb-2">
        <form class="form-newsletter row" method="post" action="">
          <div class="form-item form-type-textfield form-item-name col-9">
            
            <label class="element-invisible" for="edit-email">Get the latest news delivered via email.</label>
            <input type="text" name="name" id="edit-name" value="" size="60" maxlength="128" placeholder="Enter your Name">
            <input type="email" class="form-text required article-newsletter-email f-sans" maxlength="60" size="25" value="" name="name" id="edit-email" placeholder="Enter Your Email">
          </div>
          <div class="form-item form-type-textfield form-item-name col-3">
            <input class="button__blue-reversed--white f-sans form-submit ajax-processed h-100 w-100" type="submit" href="#" value="Sign Up" />
          </div>
        </form>
        <div class="signup-success">
          <h4 class="f-serif font-weight-normal signup-success-message ls-0">Thank you for signing up.<br />Stay tuned for the latest from <em>Foreign Affairs</em>.</h4>
        </div>
      </div>
    </div>
</div>