.left		{text-align:left;	}
.centre		{text-align:center;	}
.right		{text-align:right;	}
.floatRight	{float:right;		}
.floatLeft	{float:left;		}
.clear		{clear: both;		}
.bold		{font-weight:bold;	}
.italic		{font-style:italic; }
.highlight	{color:black; background-color:white; }
.hidden		{visibility:hidden; display:none; }
.noDisplay  {display:none;}
.nowrap		{white-space:nowrap;}
.wrap		{white-space:pre-wrap;}
.noBorder 	{border: none;}

body{
	background-color:#AAAAAA;
}
.en, a.en{ color:red; background-color:white;}
.es, a.es{ color:red; background-color:#fec400;}
.xx, a.xx{ color:blue;background-color:white;}

.nav .xx a, .nav .xx a:active, .nav .xx a:visited {
	background-color: white;
}
.nav .xx a:hover {
	color:white;
	background-color: #0063a4;
}
.nav .es a, .nav .es a:active, .nav .es a:visited {
	background-color: #fec400;
	color:red;
}
.nav .es a:hover{
	background-color: red;
	color:#fec400;
}
.nav .en a, .nav .en a:active, .nav .en a:visited {
	background-color: white;
	color:red;
}
.nav .en a:hover{
	background-color: red;
	color:white;
}
.nav-button {
	left: 1vw;
	font-size:2.0rem;
}
#nav-button{
	border-style:none;
}

header{
	display:block;
	clear:both;
	width:auto;
	text-align:center;
}
h1, header h1{
	font-size:2.0vh;		/* calc(30px + 10 * ((100vw - 300px) / 980)); */
	font-weight:inherit;	/* bold; */
	color:#ffffff;
	background-color:#0063a4;
	text-align:center;
	border-radius:1vh;
}

@media screen and (max-width: 600px){
	/* 	header h1{ font-size:5vw; } */
}

h1{ margin-bottom:0.43vh; }
h2{
	font-size:20px;
	font-weight:inherit;
	color:#ffffff;
	background-color:#0063a4;
	margin-top:0;
	margin-bottom:0.43vh;
	padding:0;
	text-align:center;
	clear:both;
	border-radius:0.99vh;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	line-height:4.4rem;
}
h2:before{
	clear:both;
}
h2 a{
	color:#ffffff;
}

header .icon-left{  line-height:2.2; margin-left:0.3vw;}
header .icon-right{ line-height:2.2; margin-right:0.3vw;}

@media screen and (max-width: 600px){
	.navPageName{ display:none;}
}
.icon-left, .icon-right, .icon-up, .icon-print{	font-size:20px; color:white;}
.icon-left:before{content: "\0025C0"; margin-right:0.47vw;}
.icon-right:after{content: "\0025B6"; margin-left: 0.47vw;}
.icon-up:before	 {content: "\01F51D"; padding-right:0.47vw; font-size:calc(20px + 10 * ((100vw - 300px) / 980));}
.icon-print:after{content: "\01F5A8"; padding-left: 0.47vw; font-size:calc(20px + 10 * ((100vw - 300px) / 980));}

main{
	margin-left:auto;
	margin-right:auto;
	display:inline;
	vertical-align:middle;
}

.errorMessage{
	color:white;
    background-color:#ff0000;
}
.infoMessage{
	color:black;
    background-color:#00ff00;
}
.errorMessage,
.infoMessage{
	clear:both;
	text-align:center;
	font-size:calc(16px + 8 * ((100vw - 600px) / 980));
	text-align:center;
}

.columns{		/* ???? */
	width:auto;
	background-color:#FFFFFF;
	border:solid 0.11vh #0063a4;
	border-radius:0.99vh;
	margin: 0 0 0.22vh 0;
	padding: 0.22vh 0.16vw;
	float:left;
}
@media screen and (max-width: 600px){
	.columns{padding:0.22vh 0;}
}

p, ol, ul{
	text-align:left;
	margin-top:0;
	margin-left:0.39vw;
}
hr{			clear: both;		}

img{ 		max-width:100%;		}
iframe{ 	max-width:100%;		}
@media screen and (max-width: 600px){
	img{ 		min-width:100%;		}
	iframe{ 	min-width:100%;		}
}

div{
	background:#ebf4fb;
	margin: 0px 0px 2px 2px;
	padding: 0;
}

a{
    border-style: solid;
	border-width : 2px 2px 2px 2px;
	border-color : #f7f7f7 #a8a8a8 #a8a8a8 #f7f7f7;
	background:#0063a4;
	color: white;
	padding: 0px 5px 0px 5px;
	text-align:center;
	text-decoration: none;
	font-weight:bold;
	min-height:25px;
}
a.button:link{
	display:block;
	padding: 0px 6px 0px 6px;
	margin: 0px 3px 0px 3px;
	height:27px;
	line-height:27px;
	float:left;
}
a:link.noStyle{
	background:transparent;
    border-style: none;
}

table{
	border-collapse: collapse;
	margin:0.33vh;
	overflow:hidden;
	border-radius:0.99vh;
	padding:0.33vh;
	background-color:#ddd;
}
table.tablesorter { width: auto; }
table#group_data_edit{
	font-size: 1.6rem;
	line-height: 2.2rem;
}
caption, table.tablesorter > caption{
	font-weight:bold;
	color:#ffffff;
	background-color:#0063a4;
	border-radius:0.99vh;
}
table.tablesorter > caption{
	font-weight:bold;
	text-align:center;
}
tr{
	padding:0.33vh;
	border:none;
}
th, td{
	padding:0.33vh;
	border:0.11vh solid black;
}
th{	text-align:center; 	}
td{	text-align:left;	}
tr th{text-align:left; }
tfoot td{font-weight:bold;}

footer{
	margin-top: 0.22vh;
	clear:both;
	color:#ffffff;
	border:solid 0.33vh #0063a4;
	border-radius:0.99vh;
}
@media screen and (max-width: 600px){
	footer h1 .arrowLabel{ display:none;}
}
footer h1{
	background-color:#0063a4;
	padding:0.88vh 0 0.44vh 0;
	margin:0;
	text-align:center;
}
.lastUpdated{	/* ??????? */
	font-size:calc(12px + 12 * ((100vw - 600px) / 980));
}

form, fieldset, .formRow {
	border: 0.11vh #0063a4 solid;
	border-radius:0.99vh;
	padding:0.33vh;
}
form {		margin: 0.3vh 0.3vw; }
fieldset {	margin: 0.3vh 0.3vw; }
.formRow{ 	margin: 0.3vh 0.3vw; max-width: 93vW;}
form p{
	text-align:center;
	padding-top:0;
}
fieldset.fieldset-main {
	width:50%;
}
@media screen and (max-width: 600px){
	fieldset.fieldset-main {
		width:100%;
	}
}
legend{
	font-size:calc(14px + 8 * ((100vw - 600px) / 980));
	font-weight:bold;
	color:#0063a4;
	margin-left:0.66vh;
	line-height:1;
}

.formLabel{ float:left; width:20%; margin-top:0.66vh; padding-right: 0.2vW; text-align:right; word-wrap:break-word;}
.formLabel.checkbox{ margin-top:0;}
.formInput{ float:left; width:79%; margin-top:0.66vh; }
@media screen and (max-width: 600px) {
	.formLabel{ width:auto; padding-right: 0; text-align:left;}
	.formInput{ width:100%; }
}
.formInfo{
	width:95%;
	max-width: 95%;
	color:#222;
	background-color:#fff5a1;
	font-weight:normal;
	padding:0.77vh;
	border:solid 0.11vh #aacfe4;
	border-radius:3.74vh;
	box-sizing:border-box;
	resize:vertical;
	position:relative;
}
.formRow:after {
  content: "";
  display: table;
  clear: both;
}
input:optional, .input, input[readonly], select[readonly], textarea[readonly]{
	background-color: #F7F7F7;
	color: #000000;
}
input:focus, select:focus, textarea:focus{
	background-color: #000000;
	color: #F7F7F7;
}
.sectionSearch{ width:auto; max-width: 33vw;}
input{ width:calc(var(--characters) * 1.0em) ; min-width:4em; max-width: 95%;}
select{ width:calc(calc(var(--characters) * 1em ) + 1.5em) ; max-width: 95%;}
textarea{ width:95%; max-width: 95%;}
textarea.ta_wide{ width:30em;}
input, select, textarea{
	color:#222;
	background-color:#fff5a1;
	font-weight:normal;
	padding:0.77vh;
	border:solid 0.11vh #aacfe4;
	border-radius:3.74vh;
	box-sizing:border-box;
	resize:vertical;
	position:relative;
}
input[type="color"], input.validateColor{width:6em;		height:3.2vh; padding:0.5vmin;}
input[type="date"]{				width:10em;					}
input[type="datetime-local"]{	width:14em;		}
input[type="email"]{ 			width:95%;					}
input[type="file"]{ 			width:calc(var(--characters) * 1.0em);	}
input[type="month"]{			width:6em;					}
input[type="number"]{ 			width:calc(calc(var(--digits) * 0.647em ) + 2.47em); text-align:right;}
input.year{ 					width:6em; 				text-align:right;}
input[type="password"]{			width:calc(var(--characters) * 1.0em);		}
input[type="tel"]{ 				width:14em;					}
input[type="time"]{ 			width:7em;					}
input[type="url"]{ 				width:95%;		}
input[type="week"]{ 			width:6em;		}
@media screen and (max-width: 600px){
	input[type="checkbox"], input[type="radio"]{ margin-top:0;}
}
input[type="checkbox"], input[type="radio"]{				/* Hide default HTML checkbox */
	opacity:0;
	width:0;
	height:0;
	margin:1.1vh 0 1.1vh 0;
}
input[type="checkbox"]:checked + .slider, input[type="radio"]:checked + .slider{
	background-color: #1142D7;
}
input[type="checkbox"]:focus + .slider, input[type="radio"]:focus + .slider{
		box-shadow:0 0 0.11vh #1142D7;
}
input[type="checkbox"]:checked + .slider:before, input[type="radio"]:checked + .slider:before{
	-webkit-transform: translateX(22px);
	-ms-transform: translateX(22px);
	transform: translateX(22px);
}
.switch{					 /* The switch - the box around the slider */
	position:relative;
	display:inline-block;
	width:55px;
	height:31px;
	top:0.5px;
}
div.formLabel.switch{
	margin:0;
}
.slider{					/* The slider */
	position:absolute;
	cursor:pointer;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color:#2fb6df;
	-webkit-transition:.4s;
	transition:.4s;
}
.slider:before{
	position:absolute;
	content:"";
	height:24px;
	width:24px;
	left:3px;
	bottom:2px;
	background-color:white;
	-webkit-transition:.4s;
	transition:.4s;
	border:1px solid #1142D7;
}
div.formLabel.slider:before{
	left:5px;
	bottom:4px;
}
.slider.round{				border-radius:32px;			}
.slider.round:before{		border-radius:50%;			}
/*input:required:valid, .validateRequired{
	background-color:#B2AC71;
}
input:invalid, .validateMissing, .validateIncorrect{
	color:#ff0000;
}
input:required:valid:focus, .validateRequired:focus{ color:#B2AC71; background-color:#000000; }
.validateWarning { color:#FF7F00; }
.validatePreferred{ background-color:#fff5a1; }
.validatePreferred:focus{ color:#000000; background-color:#fff5a1; }
*/
.formButtons {
	border: none;
	text-align:center;
	padding:0;
	margin:0;
}
button{
	margin:0.55vh 0 0.55vh 0.78vw;
	color:white;
	background-color:#0063a4;
	font-weight:bold;
	width:auto;
	text-align:center;
	border-radius:3.74vh;
	border:none;
	cursor:pointer;
	line-height:1;
	padding: 1.32vh 1.57vw;
}
/* tfoot button{padding: 1.32vh 1.57vw;} */
button[disabled ]{	color: GrayText;					 font-weight:normal; }
button.Navigate {	color:#FFFFFF;	background:#0000ff; }
button.Danger 	{	color:#FFFFFF;	background:#ff0000; }
button.Go 		{	color:#000000;	background:#00ff00; }
button.Warning 	{	color:#000000;	background:#ffff00; }
button.Print 	{	color:#000000;	background:#ffffff; word-wrap: break-word;}

.action{	background-color:green;	}
.caution{	background-color:orange;}
.navigate{								margin:0.55vh 0 0 0.78vw;	}
span.navigate{background-color:#0063a4; margin:0.55vh 0 0 0;	}

.context-menu {
    position: relative;
	top:5px;
	left:5px;
    text-align: center;
    border: 1px solid black;
	width:15rem;
}
.context-menu ul {
    padding: 0px;
    margin: 0px;
    min-width: 150px;
    list-style: none;
}
.context-menu ul li {
    padding-bottom: 7px;
    padding-top: 7px;
    border: 1px solid black;
}
.context-menu ul li a {
    text-decoration: none;
   color: red;
}
.context-menu ul li:hover {
    font-weight: bold;
}

.search-menu {
    position: relative;
    text-align: center;
    border: 1px solid black;
	top: 5px;
	left:5px;
	float:left;
}

#flashCard{
	position: absolute;
	text-align:center;
    border: 1px solid black;
	top:0;
	left:0;
	width:98.5vw;
	height:100vh;
	z-index:1000;
}
#flashCard-close{
/*	width: 2.4rem; */
	height: 4.4rem;
	overflow: hidden;
	cursor: pointer;
	float:right;
	margin-right: 5px
}

.autoWidth{
	width:auto;
}
.formLabel.autoWidth.checkbox{
	margin-top:10px;
}
/******************PRINTING ***************************/
.pageBreak{
	page-break-before:always;
}

.nb{ }

#language-button{
	position: fixed;
	top: 0;
	right:5px;
/*	width: 2.4rem; */
	height: 4.4rem;
	overflow: hidden;
	z-index: 902;
	cursor: pointer;
	text-decoration: none;
	line-height: 4.4rem;
	text-align:center;
}

.dictionary{
	column-count: 3;
	column-gap: 20px;
	column-rule-style: solid;
	column-rule-width: 1px;
	column-rule-color: #808080;
	background-color: white;
	margin:0;
	font-size: 0.5rem;
}
.dictSection{
	font-size:1rem;
}