body.accessible-mode {
  /* background: url('../media/background111.jpg') no-repeat center center fixed; */
  background-color: black;
  background-size: cover;
  color: #ffffff;
  font-size: 1.3rem;
  line-height: 1.8;
  font-family: Arial, sans-serif;
}

body.accessible-mode h1,
body.accessible-mode h2,
body.accessible-mode h3,
body.accessible-mode p,
body.accessible-mode li {
  color: #ffff00; 
}


body.accessible-mode a {
  color: #00ffff;
  font-weight: bold;
  text-decoration: underline;
}

body.accessible-mode a:hover,
body.accessible-mode a:focus {
  color: #ffffff;
  background-color: #000000;
}


body.accessible-mode nav,
body.accessible-mode .navbar,
body.accessible-mode button {
  background-color: rgba(0, 0, 0, 0.8);
  border: 2px solid #ffff00;
  color: #ffff00;
}


body.accessible-mode input,
body.accessible-mode textarea {
  background-color: #000000;
  color: #ffffff;
  border: 2px solid #00ffff;
  padding: 0.6rem;
  font-size: 1.2rem;
}


body.accessible-mode table,
body.accessible-mode th,
body.accessible-mode td {
  border: 2px solid #ffffff;
  color: #ffffff;
  background-color: #000;
}

body.accessible-mode footer {
  background-color: #000000;
  color: #00ffff;
  font-size: 1.2rem;
}

.accessibility-toggle {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 9999;
  padding: 6px 12px;
  border-radius: 5px;
  font-size: 0.9rem;
  background-color: rgba(0, 0, 0, 0.6);
  color: #fff;
  border: 1px solid #ccc;
  transition: background-color 0.3s;
}

.accessibility-toggle:hover {
  background-color: rgba(255, 255, 255, 0.2);
}

body.accessible-mode label {
  color: #ffff00;
  font-weight: bold;
}