body {
      font-family: Arial, sans-serif;
      background-color: #f4f4f4;
      margin: 0;
      padding: 0;
   }

   section {
      display: flex;
      justify-content: center;
      align-items: center;
      padding: 20px;
      background-color: #e9ecef;
   }

   div.content {
      /* width: 60%; */
      margin: 0 auto;
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
      padding: 20px;
      background: #fff;
      border-radius: 10px;
   }

   @media (max-width: 768px) {
      div.content {
         width: 100%;
      }
   }

   table {
      width: 100%;
      border-collapse: collapse;
      margin-bottom: 20px;
      background-color: #fff;
      border-radius: 5px;
      overflow: hidden;
   }

   table,
   th,
   td {
      border: 1px solid #ddd;
   }

   th,
   td {
      padding: 12px;
      text-align: left;
   }

   th {
      background-color: #007bff;
      color: white;
   }

   tr:nth-child(even) {
      background-color: #f2f2f2;
   }

   tr:hover {
      background-color: #ddd;
   }

   h2,
   h3,
   h4 {
      color: #343a40;
   }

   p,
   h3,
   h4,
   ul {
      line-height: 1.6;
   }

   ul {
      padding-left: 20px;
   }

   ul li {
      margin-bottom: 10px;
   }

   br {
      margin-bottom: 20px;
   }