  /* Simple popup styling */
  #popup {
    display: none;
    position: fixed;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    background: #000000;
    border: 4px solid salmon;
    color: white;
    box-shadow: 0 0 10px rgba(0,0,0,0.3);
    padding: 20px;
    width: 70%;
    height: 60%;
    overflow: auto;
    z-index: 1000;
    border-radius: 10px;
  }
  #popup pre {
    white-space: pre-wrap;
    word-wrap: break-word;
  }
  #overlay {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.5);
    z-index: 999;
    border-radius: 10px;
  }
  
  .download-box {
  background: #ffffff;
  border: 2px solid #ddd;
  border-radius: 10px;
  padding: 2px;
  text-align: center;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  /* max-width: 300px; */
}

.download-box h2 {
  font-size: 1.5rem;
  color: #333;
  margin-bottom: 10px;
}

.download-box p {
  font-size: 0.9rem;
  color: #666;
  margin-bottom: 20px;
}

.download-btn {
  display: inline-block;
  padding: 5px 10px;
  font-size: 1rem;
  color: #fff;
  background-color: #007bff;
  border: none;
  border-radius: 5px;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.3s ease;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* X-offset, Y-offset, blur-radius, color */
  margin: 5px 0 5px 0;
}

.download-btn:hover {
  background-color: #396981;
  color: #fff;
  text-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* X-offset, Y-offset, blur-radius, color */
}

table {
  table-layout: fixed;
  width: 99.8%;
  border-collapse: separate;
  border-style: solid;
  border-width: 1px;
  border-color: rgb(105, 103, 103);
  border-radius: 4px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  border-spacing: 0;
  overflow: hidden;
}

table thead>tr>th{
  border-style: solid;
  border-width: 0 0 1px 0;
  border-color: rgb(105, 103, 103);
  padding-left: 5px;
  background-color: salmon;
  font-weight: bold;
  /* color: white; */
  border-bottom: 1px solid rgb(105, 103, 103);
}

table thead>tr>th:not(:last-child) {
 border-right: 1px solid rgb(105, 103, 103);
}

table tbody>tr>td{
  padding-left: 5px;
}

table tbody>tr:last-child {
  border: 0;
}

table tbody>tr:nth-child(odd):not(:last-child)>td {
  background-color: #eeeeee;
}

table tbody>tr:nth-child(odd):last-child>td:not(:first-child)
/* table tbody>tr:nth-child(odd):last-child>td:not(:last-child) */
 {
  background-color: #eeeeee;
}

table tbody>tr:nth-child(odd):last-child>td:last-child {
  background-color: #eeeeee;
  border-radius: 0 0 4px 0;
}

table tbody>tr:nth-child(odd):last-child>td:first-child {
  background-color: #eeeeee;
  border-radius: 0 0 0 4px;
}

table tbody>tr>td:not(:last-child) {
 border-right: 1px solid rgb(105, 103, 103);
}

/* table thead>tr>td:last-child {
  border-width: 0 0 1px 0;
} */

/* Apply a border to the right of all but the last column */
/* table th:not(:last-child),
table td:not(:last-child) {
 border-right: 1px solid salmon;
} */

/* tr:nth-child(1)>td {
  border-radius: 4px 0 0 0;
} */

/* Apply a border to the top of all but the first row */
/* table tbody>tr:not(:nth-child(1))>td {
  border-top: 1px solid salmon;
} */

/* Basic styling for the <code> tag */
code {
  font-family: 'Courier New', Courier, monospace; /* Use a fixed-width font */
  background-color: #f4f4f4; /* Light gray background */
  color: #d63384; /* Highlighted text color */
  padding: 2px 4px; /* Add some padding */
  border-radius: 4px; /* Rounded corners */
  border: 1px solid #ddd; /* Subtle border */
  font-size: 0.95em; /* Slightly smaller font size */
}

/* Optional: Style <pre><code> blocks for multi-line code */
pre code {
  display: block; /* Ensure it spans full width */
  padding: 10px; /* Add more padding for blocks */
  background-color: #272822; /* Dark background for contrast */
  color: #f8f8f2; /* Light text color */
  overflow-x: auto; /* Enable horizontal scrolling for long lines */
  border: 1px solid #444; /* Darker border */
  border-radius: 6px; /* Rounded corners */
}

.container-header {
    background-color: rgb(7, 60, 110);
    background-image: none;
}

.container-footer {
    background-color: rgb(7, 60, 110);
    background-image: none;
}
/* Menu */

.container-header .mod-menu > li {
    position: relative;
  }
  
.container-header .mod-menu li:hover > ul {
    background-color: #fff;
    border: 1px solid #dfe3e7;  
    border-radius: 5px;
    display: block;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 250px;
    padding: 5px;
  }
.container-header .mod-menu a:hover {
/*    background-color: #f30976;*/
/*    font-size: larger;*/
    font-style: italic;
 }
.container-header .mod-menu li:hover > ul li {
    display: block;
  }
/* We add padding and radius so that on hover there is a nice background
.container-header .mod-menu a {
    -webkit-border-radius: 0 0 6px 6px;
    -moz-border-radius: 0 0 6px 6px;
    border-radius: 0 0 6px 6px; 
    padding: 3px 15px;
    color: #0088cc;
    background-color: #214752;
}
*/
/* On hover there should be a gray background
.container-header .mod-menu a:hover {
   background-color: #17404b;
}
*/
/* RSS Feed */
.feed{
    font-size: 12px;
}
.feed h2{
    font-size: 12px;
}
.container-sidebar-left h3{
    font-size: 12px;
    font-style: italic;
}
.feed h6{
    font-size: 12px;
}
.feed li{
    font-size: 12px;
}