:root {
  /* --primary-color: #047aed; */
  /* --primary-color: #fbd1a2; */
  --dark-2: #ccc;
  --bg-darkest: #000;
  --bg1: #fafafa;
  --bg2: #f2f2f2;
  --bg3: #e5e5e5;
  --bg4: #d4d4d4;
  --bg5: #2b2b2b;
  --bg-brightest: #fff;
  --fg0: #000;
  --fg1: #333;
  --fg2: #001833;
  --fg3: #1d1d1f;
  --fg-brightest: #fff;
  --fg-light: #737373;
  --secondary-color: #1c3fa8;
  --dark-color: #002240;
  --light-color: #f4f4f4;
  --success-color: #5cb85c;
  --error-color: #d9534f;
}


html {
    scroll-behavior: smooth;
    scroll-padding-top: 4rem; /* When we scroll to an anchor it does not scroll up extra space*/
  }



.logo  {
  color: #333; 
}

.logo:hover {
  color: #000;
}

.footer .column li a {
  color: var(--fg-light);
  font-size: 0.9rem;
}

.footer .column li a:hover {
  color: var(--fg1);
}

.footer .copyright {
  text-align: center;
  font-size: 0.75rem;
  color: var(--fg-light);
  /* border-top: 1px solid #e7edf1; */
  /* padding-top: 0.5rem; */
}

.sidebar p {
  margin-bottom: 5px;
  padding-bottom: 5px;
  border-bottom: 1px solid #ccc;
}

.sidebar a {
  color: #333;
}

.sidebar p:hover {
  color: #000;
  font-weight: bold;
}

.arralways {
  position: fixed;
  bottom: 10px;
  right: 20px;
}

p.volume {
  margin-top: 50px;
}

p.volume .icon {
  margin-left: 20px;
  margin-right: 20px;

}

.wall {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}

@media (max-width: 576px) {
  .wall {
    flex-direction: column;
  }
}