
body{margin:0;background:#000;color:#0f0;font:16px/1.5 Arial,Verdana,sans-serif;}
#top{background:#000a00;border-bottom:3px solid #002200;padding:6px;font-family:monospace;}
#wrap{display:grid;grid-template-columns:130px 1fr}
#nav{background:#000a00;min-height:100vh;padding:6px;border:3px solid #002200;margin: 3px;}
#nav a{display:block;color:#00ff00;background:#001100;text-decoration:none;padding:4px 0;margin-bottom:6px;font-family:monospace;border:1px solid #002200;text-align: center;text-shadow: 0px 0px 5px #00ff00;}
#nav img{width:100px;height:100px;border:3px solid #002200;}
#content{padding:18px;max-width:1100px;}
.window{border:3px solid #002200;background:#000a00;margin:12px 0}
.title{background:#000;padding:4px 8px;font-weight:bold}
.body{padding:10px}
#content a{color:#000;background:#008800;margin-left:-2px;padding-left:2px;padding-right:2px;text-decoration:none;border-radius: 0px 5px 0px 5px;}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px}
pre{font-family:monospace;color:#008800;line-height: 0.9;letter-spacing:-1px;}

hr{
    border: 4px solid #002200;
    margin-top: 10px;
}

.main{padding:10px; margin-bottom: 0px; height: 100%; text-align:justify;}

.main img{  float: right; margin-left: 20px; margin-bottom: 15px; max-width: 40%; height: auto;}

.scroll-container {
  width: 100%;
  overflow: hidden; /* Hides text outside the bar */
  white-space: nowrap; /* Keeps text on a single line */
}

.scroll-text {
  display: inline-block;
  padding-left: 100%; /* Starts the text off-screen to the right */
  animation: scroll-left 222s linear infinite;
}

/* The Animation Loop */
@keyframes scroll-left {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%); /* Moves text fully off-screen to the left */
  }
}
