title: Change animation of bootstrap modal on close button to slide left
body: <p>I have a bootstrap modal which slides from left to right when a button is clicked. I want to make it slide back from right to left, when the modal close button is clicked. Just want to reverse the animation on close button, At the moment is has the default bootstrap modal behaviour for the close button. Below is the code.</p>
  
  <p>Live link : <a href="http://www.babaraliseehar.com/onepage/index.php" rel="nofollow noreferrer">http://www.babaraliseehar.com/onepage/index.php</a>
  click on compare button to display the modal.</p>
  
  <pre><code>    .modal.fade:not(.in).right .modal-dialog {
      -webkit-transform: translate3d(125%, 0, 0);
      transform: translate3d(125%, 0, 0);
  }
  
  #modal h2 {
      margin:0;
  }
  #modal .copy,#modal .header, #modal .footer {
      padding: 5px;
  }
  .modal-content {
      background: #f7f7f7;
      position: relative;
      z-index: 20;
  
  }
  #modal .copy {
      background: #fff;
  }
  
  #modal .overlay {
      background-color: #000;
      background: rgba(0,0,0,.5);
      height: 100%;
      left: 0;
      position: fixed;
      top: 0;
      width: 100%;
      z-index: 10;
  }
  </code></pre>