@charset "utf-8";
/* CSS Document */

.accessibilitycontainer{
	z-index: 100;
	background-color: #D9D9D9;
	
	/*
	position: absolute;
	top: 25%;
	*/
	position: fixed;
	top: 50%;
	transform: translateY(-50%);
	max-height: 90vh;
	overflow: auto;
	
}

.grayscale{
	filter: grayscale(100%);
}
.highcontrast{
	filter: contrast(180%) brightness(110%);
}
.negcontrast{
	filter: invert(100%) contrast(120%) brightness(110%);
}
.underlinelinks a,
.underlinelinks a:link,
.underlinelinks a:visited,
.underlinelinks a:hover,
.underlinelinks a.tellink,
.underlinelinks a.tellink:link,
.underlinelinks a.tellink:visited,
.underlinelinks a.tellink:hover{
	text-decoration: underline;
}
.readablefont,
.readablefont body,
.readablefont *{
	font-family: Arial, Helvetica, Verdana, Tahoma, Calibri;
}

.darkbg body{
	min-height: 100vh;
	background-color: #121212;
	color: #EAEAEA;
}
.darkbg body *{
	color: #EAEAEA;
}
.darkbg .yellowbg{
	background-color: #C69000;
}
.darkbg .graybg{
	background-color: #1E1E1E;
}
.darkbg a.langsel,
.darkbg a.langsel:link,
.darkbg a.langsel:visited,
.darkbg a.langsel:hover{
	border-color: #C69000;
	color: #EAEAEA;
}
.darkbg .dottedinput{
	background-color: #121212;
	border-color: #EAEAEA;
}
.darkbg .mcdbtn,
.darkbg .mcdbtn:hover{
	background-color: #C69000;
	color: #EAEAEA;
}
.darkbg .graybg input,
.darkbg .graybg select{
  background-color: #2C2C2C;  /* subtle contrast with #1E1E1E */
  color: #EAEAEA;             /* readable text color */
  border: 1px solid #444;     /* visible but not harsh border */
}
.darkbg .accessibilitycontainer{
	background-color: #2A2A2A;
}
.darkbg .accessibilitybtn img{
	filter: invert(80%);
}
.darkbg .question sup,
.darkbg .overlaylabel sup,
.darkbg .shiftedlabel sup,
.darkbg label.error{
	color: #FF5C5C;
}
.darkbg #waiting i{
	color: #C69000;
}



.ui-tooltip, .arrow:after {
	background: black;
	border: 2px solid white;
}
.ui-tooltip {
	padding: 10px 20px;
	color: white;
	border-radius: 20px;
	font: bold 14px "Helvetica Neue", Sans-Serif;
	text-transform: uppercase;
	box-shadow: 0 0 7px black;
}
.arrow {
	width: 22px;
	height: 16px;
	overflow: hidden;
	position: absolute;
	margin-right: -11px;
	bottom: -16px;
}
.arrow.right {
	right: 0;    /* position to the left of tooltip */
	top: 50%;
	bottom: auto;
	margin-top: -8px; /* center vertically */
	transform: rotate(180deg);
	margin-right: -21px;
}
.arrow.right:after {
	left: auto;
	top: 50%;
	margin-top: -8px;
	right: -8px;
	width: 16px;
	height: 16px;
	transform: rotate(45deg);
	background: black;
	border: 2px solid white;
}
.arrow.left {
	left: 0;    /* position to the left of tooltip */
	top: 50%;
	bottom: auto;
	margin-top: -8px; /* center vertically */
	margin-left: -21px;
	transform: rotate(180deg);
}
.arrow.left:after {
	right: auto;
	top: 50%;
	margin-top: -8px;
	left: -8px;
	width: 16px;
	height: 16px;
	transform: rotate(45deg);
	background: black;
	border: 2px solid white;
}
.arrow:after {
	content: "";
	position: absolute;
	left: 20px;
	top: -20px;
	width: 25px;
	height: 25px;
	box-shadow: 6px 5px 9px -9px black;
	transform: rotate(45deg);
}