/* Accessibility Options */
.access-btn {
	position: fixed;
	z-index: 8050;
	transition: var(--transition-def);
	-webkit-transition: var(--transition-def);
	-moz-transition: var(--transition-def);
	-ms-transition: var(--transition-def);
	-o-transition: var(--transition-def);
}
.access-btn.hide {
	opacity: 0;
	pointer-events: none;
}
.accessibility-btn button.icon {
	bottom: 1rem;
	right: 1rem;
	background-color: var(--primary-color);
	color: var(--page-bg);
	height: 7rem;
	width: 7rem;
	border: 0;
	border-radius: 100%;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	-ms-border-radius: 100%;
	-o-border-radius: 100%;
	/* opacity: 10%; */
}
.accessibility-btn button.text {
	display: flex;
	align-items: center;
	bottom: 1rem;
	right: 2rem;
	height: 7rem;
	width: 0rem;
	border-radius: 0 100% 100% 0;
	-webkit-border-radius: 0 100% 100% 0;
	-moz-border-radius: 0 100% 100% 0;
	-ms-border-radius: 0 100% 100% 0;
	-o-border-radius: 0 100% 100% 0;
	overflow: hidden;
	background-color: transparent;
	border: 0;
	pointer-events: none;
}
.accessibility-btn:hover button.text {
	width: 26rem;
}
.accessibility-btn button.text p {
	background-color: var(--primary-color);
	text-align: left;
	color: var(--page-bg);
	padding: 0.5rem 1rem;
	font-size: 2rem;
	width: 100%;
	text-wrap: nowrap;
	font-weight: 800;
	margin: 0;
	border-radius: var(--br-def);
	-webkit-border-radius: var(--br-def);
	-moz-border-radius: var(--br-def);
	-ms-border-radius: var(--br-def);
	-o-border-radius: var(--br-def);
	pointer-events: all;
}
.overlay {
	background-color: #00000000;
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 5000;
	opacity: 0%;
	pointer-events: none;
	transition: var(--transition-def);
	-webkit-transition: var(--transition-def);
	-moz-transition: var(--transition-def);
	-ms-transition: var(--transition-def);
	-o-transition: var(--transition-def);
	transition-delay: var(--transition-def);
}
.overlay.active {
	background-color: #00000065;
	opacity: 100%;
	pointer-events: all;
	transition-delay: 0s;
}
.overlay.active .overlay {
	transition-delay: var(--transition-def);
}
.accessibility-box {
	position: fixed;
	top: 0;
	bottom: 0;
	right: -30rem;
	z-index: 5050;
	pointer-events: none;
	background-color: var(--page-bg);
	width: 30rem;
	max-width: 100%;
	pointer-events: none;
	overflow: hidden;
	transition: var(--transition-def);
	-webkit-transition: var(--transition-def);
	-moz-transition: var(--transition-def);
	-ms-transition: var(--transition-def);
	-o-transition: var(--transition-def);
	transition-delay: 0s;
	padding: 1rem;
	overflow-y: scroll;
}

.accessibility-box #resetBtn {
	border: 0;
	background-color: transparent;
	color: var(--primary-color);
	transition: var(--transition-def);
	-webkit-transition: var(--transition-def);
	-moz-transition: var(--transition-def);
	-ms-transition: var(--transition-def);
	-o-transition: var(--transition-def);
	position: absolute;
	top: 0.25rem;
	right: 0.25rem;
}
.accessibility-box #resetBtn:hover {
	color: var(--primary-hover-color);
}
.accessibility-box::-webkit-scrollbar {
  width: 0;;
  height: 0px;
}
.accessibility-box.active {
	background-color: var(--page-bg);
	transition-delay: var(--transition-def);
	pointer-events: all;
	right: 0;
}
.accessibility-content {
	pointer-events: all;
	width: 100%;
	display: block;
}

/* Contrast Mode */
body.contrast-mode {
    --contrast-link-color: #ff00c8;
    --contrast-link-hover-color: #2bff00;

	--primary-color-rgb: 0, 0, 0;
	--primary-hover-color-rgb: 0, 0, 0;
	--secondary-color-rgb: 0, 0, 0;
	--secondary-hover-color-rgb: 0, 0, 0;
	--info-color-rgb: 0, 0, 0;
	--info-hover-color-rgb: 0, 0, 0;
	--nav-bg-color-rgb: 0, 0, 0;
	--page-bg-rgb: 255, 255, 255;
	--nav-text-color-rgb: 255, 255, 255;
	--nav-text-hover-color-rgb: 0, 0, 0;
	--carousel-text-rgb: 255, 255, 255;
	--footer-bg-rgb: 0, 0, 0;
	--footer-text-rgb: 0, 0, 0;
	--footer-link-color-rgb: 0, 0, 0;
	--footer-link-color-hover-rgb: 0, 0, 0;
	--primary-color: black;
	--primary-hover-color: black;
	--secondary-color: black;
	--secondary-hover-color: black;
	--info-color: black;
	--info-hover-color: black;
	--nav-bg-color: black;
	--page-bg: white;
	--carousel-text: white;
	--nav-text-color: var(--contrast-link-color);
	--nav-text-hover-color: var(--contrast-link-hover-color);
	--footer-bg: black;
	--footer-text: white;
	--footer-link-color: var(--contrast-link-color);
	--footer-link-color-hover: var(--contrast-link-hover-color);
}
body.contrast-mode .wave1 > use {
	fill: rgb(121, 121, 121);
}
body.contrast-mode .wave2 > use {
	fill: rgb(58, 58, 58);
}
body.contrast-mode .carousel-buttons button {
	color: var(--contrast-link-color);
}
body.contrast-mode .carousel-buttons button:hover {
	color: var(--contrast-link-hover-color);
}
body.contrast-mode .carousel-text {
	color: var(--carousel-text);
}
body.contrast-mode .carousel-text .content {
	background-color: rgba(var(--secondary-color-rgb), 1);
	border: 1px solid rgba(var(--secondary-color-rgb), 1);
}
body.contrast-mode .carousel-text button {
	color: var(--contrast-link-color);
}
body.contrast-mode .carousel-text button span {
	background-color: var(--contrast-link-color);
}
body.contrast-mode #navTop {
	background-color: rgba(var(--nav-bg-color-rgb), 1);
	border: 1px solid rgba(var(--nav-bg-color-rgb), 1);
}
body.contrast-mode #navTop button {
	border: 1px solid var(--contrast-link-color);
	background-color: var(--contrast-link-color);
	color: var(--nav-bg-color);
}
body.contrast-mode #navTop button:hover {
	border: 1px solid var(--contrast-link-hover-color);
	background-color: var(--contrast-link-hover-color);
}
body.contrast-mode #navTop li a {
	color: var(--contrast-link-color);
}
body.contrast-mode #navTop li a:hover {
	color: var(--contrast-link-hover-color);
}
body.contrast-mode .news-block button {
    color: var(--contrast-link-color);
}
body.contrast-mode .news-block button span {
    background-color: var(--contrast-link-color);
}
body.contrast-mode .nav-logo {
    content: url('/images/logo-light.png') !important;
}
body.contrast-mode ::selection {
	background: #ffa600;
	color: black;
}
body.contrast-mode ::-moz-selection {
	background: #ffa600;
	color: black;
}

/* Large Text Mode */
body.large-text-mode p {
	font-size: 2rem !important;
}
body.large-text-mode h1 {
	font-size: 3.5rem !important;
}
body.large-text-mode h2 {
	font-size: 3.25rem !important;	
}
body.large-text-mode h3 {
	font-size: 3rem !important;
}
body.large-text-mode h4 {
	font-size: 2.75rem !important;
}
body.large-text-mode h5 {
	font-size: 2.5rem !important;
}
body.large-text-mode h6 {
	font-size: 2rem !important;	
}

/* Reduced Motion Mode */
body.reduced-motion-mode {
	--transition-def: 0s;
}
body.reduced-motion-mode * {
	transition: var(--transition-def) !important;
	-webkit-transition: var(--transition-def) !important;
	-moz-transition: var(--transition-def) !important;
	-ms-transition: var(--transition-def) !important;
	-o-transition: var(--transition-def) !important;
	animation-play-state: paused;
}
body.reduced-motion-mode #navTop .content {
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    border: 1px solid var(--nav-bg-color);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    background-color: var(--nav-bg-color);
}
body.reduced-motion-mode #navTop .content ul li a {
    color: var(--nav-text-color);
}
body.reduced-motion-mode #navTop .content ul li a:hover {
    color: var(--nav-text-hover-color);
}
body.reduced-motion-mode #navTop .content button {
	border: 1px solid var(--nav-text-color);
	background-color: var(--nav-text-color);
}
body.reduced-motion-mode #navTop .content button:hover {
	border: 1px solid var(--nav-text-hover-color);
	background-color: var(--nav-text-hover-color);
}
body.reduced-motion-mode .nav-scroll {
	top: 0 !important;
}
body.reduced-motion-mode .nav-hide {
	top: 0 !important;
}

/* Invert Mode */
.invert-layer {
	height: 0%;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 8500;
	pointer-events: none;
	backdrop-filter: invert(100%);
	-webkit-backdrop-filter: invert(100%);
	transition: var(--transition-def);
	-webkit-transition: var(--transition-def);
	-moz-transition: var(--transition-def);
	-ms-transition: var(--transition-def);
	-o-transition: var(--transition-def);
}
body.invert-mode .invert-layer {
	height: 100%;
}

/* Dyslexia Mode */
.dyslexia-layer {
	opacity: 0;
	display: flex;
	flex-direction: column;
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 8000;
	pointer-events: none;
	transition: var(--transition-def);
	-webkit-transition: var(--transition-def);
	-moz-transition: var(--transition-def);
	-ms-transition: var(--transition-def);
	-o-transition: var(--transition-def);
}
body.dyslexia-mode .dyslexia-layer {
	opacity: 1;
}
.dyslexia-layer #viewingPanel {
	display: flex;
	align-items: center;
	justify-content: end;
	position: fixed;
	left: 0;
	right: 0;
	height: 0px;
	outline-offset: 15px;
	outline: 100vh solid rgba(var(--info-color-rgb), 0.5);
	padding: 0 2rem;
}
.dyslexia-layer #viewingPanel button {
	pointer-events: none;
	width: 2.75rem;
	height: 2.75rem;
	border-radius: 100%;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	-ms-border-radius: 100%;
	-o-border-radius: 100%;
	margin-left: 0.2rem;
	outline: 0.3rem solid var(--page-bg);
	background-color: var(--secondary-color);
	color: var(--page-bg);
	border: 0;
	position: relative;
	z-index: 8500;
	transform: scale(0.8);
	-webkit-transform: scale(0.8);
	-moz-transform: scale(0.8);
	-ms-transform: scale(0.8);
	-o-transform: scale(0.8);
	transition: var(--transition-def);
	-webkit-transition: var(--transition-def);
	-moz-transition: var(--transition-def);
	-ms-transition: var(--transition-def);
	-o-transition: var(--transition-def);
}
.dyslexia-layer #viewingPanel button:hover {
	background-color: var(--secondary-hover-color);
}
.dyslexia-layer #viewingPanel button:last-of-type {
	transform: scale(1);
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	margin-left: 0.5rem;
}
body.dyslexia-mode .dyslexia-layer #viewingPanel button {
	pointer-events: all;
}