.site-footer {
    background-color: var(--black);
    /* background-color: var(--midnight-blue); */
    /* color: #fff; */
    color: var(--gray);
    font-size: 1rem;
    padding: 3rem 1rem 1rem;
    border-top: 1px solid var(--midnight-blue);
}
.site-info {
    margin-top: 2rem;
    color: var(--gray);
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap:1rem;
    align-items: center;
}
.site-footer h3{
    font-size: 1.25rem;
}
.site-footer a {
    color: var(--gray-semilight);
}
ul.footer-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}
.site-footer a.color-gray {
    color: var(--gray-light);
}
.site-footer a.color-gray:hover {
    text-decoration: none;
}
.site-footer a:hover {
    color: var(--gray-light);
}

#scroll-container {
    background: var(--white);
    position: absolute;
    top: 0;
    z-index: 999999;
    color: var(--gray);
    width: 100%;
    overflow: hidden;
  }
  
  #scroll-text {
    /* animation properties */
    -moz-transform: translateX(100%);
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    
    -moz-animation: my-animation 25s linear infinite;
    -webkit-animation: my-animation 25s linear infinite;
    animation: my-animation 25s linear infinite;
  }
  
  /* for Firefox */
  @-moz-keyframes my-animation {
    from { -moz-transform: translateX(100%); }
    to { -moz-transform: translateX(-10%); }
  }
  
  /* for Chrome */
  @-webkit-keyframes my-animation {
    from { -webkit-transform: translateX(100%); }
    to { -webkit-transform: translateX(-10%); }
  }
  
  @keyframes my-animation {
    from {
      -moz-transform: translateX(100%);
      -webkit-transform: translateX(100%);
      transform: translateX(100%);
    }
    to {
      -moz-transform: translateX(-10%);
      -webkit-transform: translateX(-10%);
      transform: translateX(-10%);
    }
}