How to change the color of <ion-card> using ionic2
<p>I am trying to change the color of  to lightgray I used the html code as below:</p>

<pre><code>  &lt;ion-card *ngFor="let details of checkOutAddr" round inset class="ion-card"&gt;
    &lt;ion-item&gt;
      &lt;ion-row&gt;
        &lt;ion-col&gt;&lt;ion-icon ios="ios-create" md="md-create" item-right class="color1"&gt;&lt;/ion-icon&gt;
          &lt;b&gt;{{details.name}}&lt;/b&gt;
        &lt;/ion-col&gt;
      &lt;/ion-row&gt;

      &lt;ion-row&gt;
        {{details.stage}}
      &lt;/ion-row&gt;

      &lt;ion-row&gt;
        {{details.main}}
      &lt;/ion-row&gt;

      &lt;ion-row&gt;
        {{details.state}}
      &lt;/ion-row&gt;

      &lt;ion-row&gt;
        &lt;ion-col&gt;
          &lt;ion-icon ios="ios-call" md="md-call" item-left&gt;&lt;/ion-icon&gt;
            {{details.phone}} 
        &lt;/ion-col&gt;
      &lt;/ion-row&gt;

      &lt;ion-row&gt;
        &lt;ion-col&gt;
          &lt;ion-icon ios="ios-mail" md="md-mail" item-left&gt;&lt;/ion-icon&gt; 
            {{details.mail}}
        &lt;/ion-col&gt;
      &lt;/ion-row&gt;
    &lt;/ion-item&gt;
  &lt;/ion-card
</code></pre>

<p>I used the scss code as below:</p>

<pre><code>.ion-card {
        background-color: slategray !important;
    }
</code></pre>

<p>How do i get the look and feel as below img:</p>

<p><a href="https://i.stack.imgur.com/1TP9h.png" rel="noreferrer"><img src="https://i.stack.imgur.com/1TP9h.png" alt="enter image description here"></a></p>