@media (max-width: 768px) {

  table {
    width: 100% !important;
    border-collapse: collapse; /* optional */
  }

  /* For the table cells containing images */
  td {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    text-align: left !important;
    padding: 0px !important;
    margin: 0 !important;
  }

  tr {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    margin-bottom: 0; /* space between rows */
  }

  tr:nth-of-type(2) {
    margin-top: 100px;
  }

  .text {
    font-size: 11pt !important;
    text-align: left !important;
    margin: 0 auto !important;
  }

  .text, td img {
    max-width: 362px;
    margin: 0 auto !important;
    padding: 0 !important;
    display: block;
    height: auto;
  }

  .text p {
    margin: 0 0 0 0 !important;
  }

  p {
    margin: 0 !important;
    padding: 0 !important;
  }

  .cross-icon {
    position: fixed !important;
    top: 20px;
    left: 160px;
    z-index: 1000;
  }

  td[style*="position:fixed"]:not(.cross-icon) {
    background-color: white;
    padding-top: 25px !important;
    padding-bottom: 10px !important;
    z-index: 1000;
  }

  html, body {
    padding-bottom: 160px !important;
    margin-bottom: 0 !important;
  }
}