how to remove the border of a collapsible div/li in materialize.css

I am trying to create a collapsible within a collection list item. But I don't want the greyish border of the collapsible divs to be visible in this collapsible.

the markup:

<li class="collection-item">
    <ul class="collapsible" data-collapsible="accordion">
        <li>
           <div class="collapsible-header">First</div>
           <div class="collapsible-body">Lorem ipsum dolor sit amet.</div>
        </li>  
     </ul>
</li>

the css:

.collapsible-header, .collapsible-body, .collapsible, ul.collapsible>li 
{
  margin-left: 0px;
  margin-right: 0px;
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 0rem !important;
  border-top: 0px!important;
  border-right: 0px!important;
  border-left: 0px!important;
  border-bottom: 0px!important;
  box-shadow: 0px;
  background: #fff;
}

Solution

use this css box-shadow: none!important;

.collapsible-header, .collapsible-body, .collapsible, ul.collapsible>li 
{
  margin: 0!important;;
  padding: 0!important;
  border: 0!important;
  box-shadow: none!important;
  background: #fff;
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.1/css/materialize.min.css" rel="stylesheet"/>
<li class="collection-item">
    <ul class="collapsible" data-collapsible="accordion">
        <li>
           <div class="collapsible-header">First</div>
           <div class="collapsible-body">Lorem ipsum dolor sit amet.</div>
        </li>  
     </ul>
</li>