title: Custom styles on inputs with angular material 2
body: <p>I am trying to style an input so that it is a certain width. I am using Angular Material 2 but for some reason the styles in the css isn't being applied to the input tag. <a href="http://plnkr.co/edit/qHbyig0gHtxdquRL63vI?p=preview">Here is a working plunker of my issue</a> along with the affected code:</p>
  
  <pre><code>@Component({
    selector: 'my-app',
    template: `
    &lt;div&gt;
      &lt;form&gt;
        &lt;md-input [(ngModel)]="cycleTime" type="number" name="email"&gt;
          &lt;span md-prefix&gt;Cycle Time:&lt;/span&gt;
          &lt;span md-suffix&gt;&amp;nbsp;minutes&lt;/span&gt;
        &lt;/md-input&gt;
      &lt;/form&gt;
    &lt;/div&gt;
    `,
    styles:[`
        input {
          width: 50px;
          text-align: right;
        }
      `],
    directives: [MdButton, MdInput]
  })
  export class AppComponent { 
    cycleTime = 1
  
    constructor() {}
  }
  </code></pre>
  
  <p>How can I style the input that is being created by Angular Material 2?</p>