body {
            background-color: #000;
            background: url("assets/Pons_brooks.jpg") ;
            background-size: 80% auto;
            color: #ffff66;
            font-family: "Comic Sans", "Comic Sans MS", "Chalkboard", "ChalkboardSE-Regular", "Comic Neue",sans-serif;
            margin: 0;
            padding: 0;
        }

        a {
            color: #00bfff;
            text-decoration: none;
        }

        a:hover {
            text-decoration: underline;
        }

        table {
            border-collapse: collapse;
            width: 100%;
        }

        td {
            padding: 10px;
        }


        .content {
        
            height: 400px;
        }

        .footer {
            
            text-align: center;
            font-size: 12px;
            border: none;
            padding: 5px;
            
        }

.linkheader {
    margin: 5px;
    margin-top: 10px;
    padding: 1px;
    text-align: center;
    border: 1px solid #00bfff;
    border-left: none;
    border-right: none;

}

.linkheader li {
    display: inline-block;
    margin: 5px;
    font-size: 1.2em;
}

.linkheader a {
    text-shadow: 1px 1px 1px rgb(0, 68, 255);
}


  .cat-gallery {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
      gap: 15px;
      padding: 20px;
  }

  .cat-card {
      padding: 5px;
  }

  .cat-card img {
    width: 100%;
    height: auto;
    display: block;
    border: 3px dotted #ff00ff;
    padding: 5px;
  }

  .cat-card p {
      margin: 5px 0 0;
      font-size: 14px;
      color: #ffff66;
      font-weight: bold;
      
  }
.intro {
    background: #000000aa;
    border: 1px solid #00bfff;
    padding: 15px;
    margin: 20px auto;
    max-width: 700px;

    font-size: 14px;
    color: #ffff66;
    text-align: left;
}
  @media (max-width: 600px) {
      .cat-gallery {
          grid-template-columns: repeat(2, 1fr);
          /* always 2 images per row */
      }
      body {
        background-size: 100% auto;
      }
  }