title: Overlay over modal due transform-style: preserve-3d;
body: <p>I am testing this code, that works fine generally. However when i have a small screen if you open the modal, then we have the grey overlay over the modal. This problem is related to  <code>transform-style: preserve-3d;</code> I need to use this property, because my problem is much more complex. This demo is minimal but exemplify the problem.</p>
  
  <p>So, basically I am trying to solve this bug but I can't find any way.</p>
  
  <p>Issue:</p>
  
  <pre><code>/* Slide side body*/
      .side-body {
          ...
          -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
      }
      .body-slide-in {
          ...
          -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
      }
  </code></pre>
  
  <p><a href="https://jsfiddle.net/c33mu5L2/" rel="nofollow">https://jsfiddle.net/c33mu5L2/</a></p>