Form Annotations

form_annotation.html

<script>
  $(function() {
    $("input[type=submit]").click(function() {
      API.closeCta({ disablePlay: true });
    });
  });
</script><style type="text/css">.newsletter-signup {
    position: relative;
    max-width: 600px;
    margin: 0 auto;
  }
  
  .newsletter-signup form {
    text-align: center;
  }
  
  .newsletter-signup form h3 {
    color: #fff;
  }
  
  .newsletter-signup form label {
    padding-right: 20px;
    color: #fff;
  }
  
  .newsletter-signup form * {
    margin: 20px 0 0 0;
  }
  
  .newsletter-signup form input[type=text] {
    width: 180px;
    padding: 6px 10px;
    box-shadow: inset 0 1.5px rgba(0,0,0,0.1);
    border: 1px solid #ccc;
    border-radius: 2px;
  }
  
  .newsletter-signup form input[type=submit] {
    padding: 10px 20px;
    text-align: center;
    background-color: #61c661;
    border: 1.5px solid #4ebf4e;
    border-radius: 2px;
    color: #fff;
    box-shadow: 0 1.5px rgba(0,0,0,0.15);
  }
  .newsletter-signup form input[type=submit]:hover {
    background-color: #3da93d;
    border-color: #369636;
  }</style><div class="newsletter-signup"><form><h3>Sign up to learn more about Vidyard!</h3><label for="email">Email address</label> <input type="text" name="email" /><br /><input type="submit" value="Sign me up!" /> </form></div>