title: Expand material expnsion panel on mouseover
body: <p>I have a material expansion panel in my application. I would like to expand the panel when you hover with your mouse over the panel and also to auto collapse if you leave again. Is this possible to implement in my.css file? Or do i have to do it in my typescript otherwise and how?</p>
  
  <p>This is my <code>html</code>:</p>
  
  <pre><code>    &lt;mat-expansion-panel class="expansion-panel-class"&gt;
  &lt;mat-expansion-panel-header&gt;
  ....
  &lt;/mat-expansion-panel-header&gt;
  &lt;mat-list&gt;
  &lt;!-- my elements --&gt;
  &lt;/mat-list&gt;
  &lt;/mat-expansion-panel&gt;
  </code></pre>
  
  <p>and my <code>css</code>: </p>
  
  <pre><code>.expansion-panel-class{
      /*Expansion panel is collapsed*/
  }
  
  .expansion-panel-class :hover{
      /*Expansion panel is expanded*/
  }
  </code></pre>
  
  <p>Thanks in advance!</p>