How to change materialize.min.css default styles?

Question

I want to change the style of a react materialize component. Its using the default react-materialize stylesheet. I'm trying to add a 'style' tag but its not doing anything. Is there a way to alter the default materialize styles? Here's the code:

      <Collapsible accordion={false} >
      <CollapsibleItem  header="Better safe than sorry. That's my motto." icon="filter_drama">
      CONTENT
      </CollapsibleItem>
      </Collapsible>

      <Collapsible accordion={false} >
      <CollapsibleItem header="Better safe than sorry. That's my motto." icon="filter_drama">
      CONTENT
      </CollapsibleItem>
      </Collapsible>

Heres an illustration of what it looks like and what the desired result is: https://i.sstatic.net/aQhdW.jpg (sorry about link, not enough rep to post pictures)

Tried adding style tag everywhere but doesn't show any change

      <Collapsible accordion={false} style={{padding:0}}>
      <CollapsibleItem style={{padding:0}}  header="Better safe than sorry. That's my motto." icon="filter_drama">
      CONTENT
      </CollapsibleItem>
      </Collapsible>

      <Collapsible accordion={false} style={{padding:0}} >
      <CollapsibleItem style={{padding:0}} header="Better safe than sorry. That's my motto." icon="filter_drama">
      CONTENT
      </CollapsibleItem>
      </Collapsible>

Answer 1

<Collapsible accordion={false} style={{padding: "0px !important"}}>

or in your .css file just add the exact name of the class. In your case:

.collapsible-body {
   padding: 0px !important;
}