title: React-responsive-modal: Change background-color when modal is open
body: <p>I use <a href="https://react-responsive-modal.leopradel.com/" rel="nofollow noreferrer">react-responsive-modal</a>
  to open some modals within my react app. When i open the modal, there is an overlay effect that darkens the background behind the modal. Is there any way to darken the background for 100% or set any color for the background so i cant see the stuff which was there before the modal was opened until i close the modal again?</p>
  
  <p>I created a new component for the modal <code>ModalComponent</code> within my <code>MainComponent</code>, which gets rendered when i click a button:</p>
  
  <p><code>ModalComponent</code>:</p>
  
  <pre><code>render() {
   return (
    &lt;div className="childDiv"&gt;
      &lt;Modal
        open={open}
        onClose={this.onCloseModal}
        center
        classNames={{
          transitionEnter: styles.transitionEnter,
          transitionEnterActive: styles.transitionEnterActive,
          transitionExit: styles.transitionExitActive,
          transitionExitActive: styles.transitionExitActive
        }}
        animationDuration={1000}
      &gt;
     ...
  </code></pre>
  
  <p>MainComponent:</p>
  
  <pre><code>&lt;div&gt;
      &lt;div className="outter" onClick={this.openModal.bind(this)}&gt;
  //Open Modal when clicking on this div
        &lt;p className="arrival"&gt;Ankunft am Ziel: ~ {this.props.arrival} Uhr&lt;/p&gt;
        &lt;p className="price"&gt;max. {this.props.price} €&lt;/p&gt;
        {this.state.open &amp;&amp; (
          &lt;BookingModalNew
            open={this.state.open}
            triggerCloseModal={this.closeModal.bind(this)}
            destination={this.props.destination}
            arrival={this.props.arrival}
            price={this.props.price}
          /&gt;
        )}
  //Whole Stuff should not be visible while Modal is opened
  </code></pre>