title: placeholder color won't change
body: <p>My placeholder color is not applying, I know how to change placeholder color of input but in this code it's not letting me change color </p>
  
  <p>can anyone help? </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>form {
    background-color: #4CAF50;
    padding: 30px;
    color: #fff;
  }
  
   ::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: #4CAF50;
  }
  
   :-moz-placeholder {
    /* Firefox 18- */
    color: #4CAF50;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /&gt;
  
  
  &lt;form&gt;
    &lt;div class="form-group"&gt;
      &lt;label for="email"&gt;Email address:&lt;/label&gt;
      &lt;input type="email" placeholder="Email address" class="form-control" id="email"&gt;
    &lt;/div&gt;
    &lt;div class="form-group"&gt;
      &lt;label for="pwd"&gt;Password:&lt;/label&gt;
      &lt;input type="password" class="form-control" placeholder="Password" id="pwd"&gt;
    &lt;/div&gt;
    &lt;button type="submit" class="btn btn-default"&gt;Submit&lt;/button&gt;
  &lt;/form&gt;</code></pre>
  </div>
  </div>
  </p>