Modfying width in a Bootstrap modal

gistfile1.txt

<style>
@media (min-width: 768px) {
  .modal-xl {
    width: 90%;
   max-width:1200px;
  }
}

<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-xl" role="document"><!-- cf http://output.jsbin.com/yefas/1 -->
    <div class="modal-content">
    ...
    </div>
  </div>
</div>