
.skip-link {
    position:absolute;
    top:-40px;
    left:10px;
    background:#000;
    color:#fff;
    padding:8px;
    z-index:10000;
}
.skip-link:focus {
    top:10px;
}

#accessibility-widget {
    position:fixed;
    right:20px;
    bottom:20px;
    z-index:9999;
}

#accessibility-toggle {
    width:60px;
    height:60px;
    border-radius:50%;
    border:none;
    font-size:26px;
    background:#003366;
    color:#fff;
    cursor:pointer;
}

#accessibility-panel {
    margin-top:10px;
    background:#ffffff;
    padding:15px;
    width:260px;
    border-radius:10px;
    box-shadow:0 0 15px rgba(0,0,0,0.3);
}

.acc-btn {
    display:block;
    width:100%;
    margin:6px 0;
    padding:8px;
    border:none;
    background:#003366;
    color:white;
    border-radius:5px;
    cursor:pointer;
}

.acc-btn.reset {
    background:#a00000;
}

body.high-contrast {
    background:black !important;
    color:yellow !important;
}

body.high-contrast a {
    color:#00ffff !important;
}

body.dark-mode,
body.dark-mode section,
body.dark-mode header,
body.dark-mode footer,
body.dark-mode .fullbg,
body.dark-mode .whitebox,
body.dark-mode .thumbnail,
body.dark-mode .navbar,
body.dark-mode .jumbotron,
body.dark-mode .carousel,
body.dark-mode .container {
    background-color: #121212 !important;
    color: #ffffff !important;
}

body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode p,
body.dark-mode li,
body.dark-mode span {
    color: #ffffff !important;
}

body.dark-mode a {
    color: #4da3ff !important;
}

body.dark-mode .navbar-default {
    background-color: #1e1e1e !important;
    border-color: #333 !important;
}

body.dark-mode .whitebox {
    background-color: #1a1a1a !important;
}

body.dark-mode .thumbnail {
    background-color: #1a1a1a !important;
}

body.highlight-links a {
    background:yellow !important;
    color:black !important;
    text-decoration:underline !important;
}

body.readable-font {
    font-family:Verdana, Arial, sans-serif !important;
}
