/* General table styles */
html, body {
   background-color: #000000; /* fallback color behind everything */
   color: #ffffff;            /* default text color */
   margin: 0;
   padding: 0;
}

/* Let the background image show through */
.background-table,
.background-table td,
.background-table th {
   background-color: transparent;
}

/* Your existing background image for the table */
.fixed.background-table {
   background-image: url('https://stringthing.neocities.org/sfno1.jpeg');
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
   background-attachment: fixed;
}

/* Optional: tweak text color for readability */
td, th {
   color: #ffffff;
}

table {
   border-collapse: collapse;
}

table.fixed {
   table-layout: fixed;
   border: 2px solid #000000;
}

table.fixed td {
   overflow: hidden;
}
tbody {
   background-color: #000000;
   color: #ffffff;
}

thead {
   background-color: #000000;
   color: #ffffff;
}

th {
   border: 1px solid black;    
   background-color: #000000;    
   color: #ffffff;
}

td {
   background-color: #ffffff;
   color: #000000;
}

/* Hyperlink styles */
a.bar, a.bar:link, a.bar:visited, a.bar:focus, a.bar:active, a.bar:visited {
   font-size: 20pt;
   text-decoration: none;
   color: #ffffff;
}

a.bar:hover {
   font-size: 20pt;
   text-decoration: none;
   color: #00DCFF;
}

/* Gallery container styles */
.gallery-container {
   width: 1024px;
   margin: 20px auto;
   text-align: center;
}

/* Image gallery using CSS Grid */
.gallery {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 10px;
   margin: 0;
   color: black;
   text-align: center;
   max-width: 1024px;
}

/* Each image in the gallery */
.gallery figure {
   display: flex;
   flex-direction: column;
   align-items: center;
   width: 100%;
   margin: 0;
}

.gallery img {
   width: 100%;
   height: auto;
   margin: 0;
}
.gallery iframe {
   width: 100%;
   height: auto;
   margin: 0;
   max-width: 1024px;
}   
   

/* Optional caption style */
figcaption {
   font-size: 14px;
   margin-top: 10px;
   text-align: center;
   color: #fff;
}