/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

body {
    opacity: 1;
    /*cursor: url("/cursor.png"), auto;    */
}

html {
    background-image: url(/star-sky.jpg);
    animation: 60s linear 0s infinite normal none running background;
}
@keyframes background {
    from {
        background-position: 0 0;
    }
    to {
        /* Move the background by its width/height or a set amount */
        background-position: 100px 100px; 
    }
}
h1 {
    margin:0;
    text-shadow: 
        2px 2px 0 #ffffff, 
       -2px -2px 0 #ffffff, 
        1px -1px 0 #ffffff, 
       -1px 1px 0 #ffffff;
    font-size: 120px; color: #a00620;
    text-align: center;

  }
  
aside ul
{
    padding: 0;
}

aside ul li 
{
    display: block;
    height: 1rem;
    margin: 0.5rem;
    padding: 0.5rem 1rem;
    line-height: 1rem;
    border-radius: 0.2rem;

}
a
{
  color: white;
  }
  
a:visited
{
  color: purple;
  }
    
aside ul li:hover
{
    background-color: purple;       
    transition: background-color 0.5s;
}
  
.radio{
  width: 225px;
  height: 243px;
  overflow: hidden;
  border: none;
}

.container {
  display: flex;
  font-family: Verdana;
  color: #ccc;
  padding: 0 250px;



}
.lsidebar {
  width: 250px;
  display: flex;          /* Makes this sidebar a flex container */
  flex-direction: column; /* Stacks children vertically instead of horizontally */
  gap: 15px;              /* Adds space between the stacked items */
  padding: 10px;

  order: 0;
}
.rsidebar {
  width: 250px;

  order: 2;
}
.content {
  display: flex; 
  flex-direction: column;
  flex: 1; /* Fills remaining space */
  order: 1;
  justify-content: space-around;

}
.lsidebar > *, .rsidebar > * {
  background-color: rgba(0, 0, 0, 0.6); /* Red=0, Green=0, Blue=0 (Black), Alpha=0.6 */
  padding: 20px;       /* Gives the text room inside the black box */
  border-radius: 4px;  /* Optional: rounds the corners slightly */
  margin-bottom: 0;    /* We are using 'gap' in the parent to handle spacing */
}
