title: Change the style of a modal using react-modal
body: <p>I have this object, with the styles I want for the modal:</p>
  
  <pre><code>const customStyles = {
    content: {
      top: '35%',
      left: '50%',
      right: 'auto',
      bottom: 'auto',
      marginRight: '-50%',
      width: '60%',
      transform: 'translate(-40%, -10%)',
    },
  };
  </code></pre>
  
  <p>Then I pass that styles to the modal like this:</p>
  
  <pre><code>            &lt;Modal
                isOpen={this.state.modalIsOpen}
                onRequestClose={this.closeModal}
                style={customStyles}
              &gt;
  </code></pre>
  
  <p>And it works fine but I want to pass a class, not create a customStyle object inside the component. </p>
  
  <p>I try something like this, first creating the modal class:</p>
  
  <pre><code>.modal {
    top: '35%';
    left: '50%';
    right: 'auto';
    bottom: 'auto';
    marginRight: '-50%';
    width: '60%';
    transform: 'translate(-40%, -10%)';
  }
  </code></pre>
  
  <p>and then:</p>
  
  <pre><code>            &lt;Modal
                isOpen={this.state.modalIsOpen}
                onRequestClose={this.closeModal}
                className="modal"
              &gt;
  </code></pre>
  
  <p>But it didn't work. What am I doing wrong?</p>