
  .modalImage
  { border-radius: 1vw;
    cursor: pointer;
    transition: 0.3s;
    visibility: hidden; }

  .modal
  { display: none;
    position: fixed;
    z-index: 2;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.9); }

  .modalContent
  { margin: auto auto;
    border-radius: 1vw;
    display: block;
    width: 100vw;
    max-height: 100vh;
    object-fit: contain; }

  .modalContentP
  { margin: auto auto;
    border-radius: 1vh;
    display: block;
    height: 100%;
    max-width: 100vw;
    object-fit: contain; }

  /* Animation */
  .modalContent, .modalContentP
  { -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s; }

  @-webkit-keyframes zoom
  { from
    { -webkit-transform: scale( 0) }
    to
    { -webkit-transform: scale( 1) } }

  @keyframes zoom
  { from
    { transform: scale( 0) }
    to
    { transform: scale( 1) } }

  .thumb
  { display: inline-block;
    border-radius: 1vw;
    width: 10vw;
    height: 10vh;
    object-fit: cover;
    position: absolute;
    left: 0;
    bottom: 5vh; }
