body {font-family: Verdana, sans-serif; font-size: medium; font-weight:normal; background-color:#CCCCFF;}
h1 {border: black thin solid; border-radius: 5px; background-color:#333399; color:white; border-collapse: collapse; width:100%; padding:5px;}
h2 {border: black thin solid;border-radius: 5px; background-color:#333399; color:white; border-collapse: collapse; width:100%; padding:5px;}
table {border: none;}
th {border: black thin solid; border-collapse: collapse; background-color:#333399; color:white;}
.C {vertical-align:top; padding:0px; width:24px;}
.M, .F {border: black 2px solid; border-radius: 8px; background-color:rgba(19, 19, 95, 0.2); padding:4px; color:black; margin: 4px;}
.level {background-color:#333399; padding:4px; color:#aaaaaa;margin-right:4px;}
.border {border: black thin solid; border-collapse: collapse;}
.notes {font-size: small;}
.nameID {font-size: medium;font-weight:bold; font-stretch:expanded;}
a { text-decoration:none; white-space:nowrap;}
a.personLink:visited {color:#000033; border-bottom:2px dotted #000033;}
a.personLink:link {color:#330000; border-bottom:2px dotted #330000;}
a.big { color:#000088; border: #000088 2px solid; border-radius: 8px; padding: 4px; text-decoration:none; display:inline-block}
a:hover.big  { border-color:green; }
img.thumb { border: #000088 2px solid; border-radius: 8px; padding: 2px; margin:2px;}
.info {font-size: 10px; font-style:italic;border: #6666FF 1px solid; border-radius: 5px; background-color:transparent;  vertical-align:top; padding:10px; color:black;margin-top: 10px;margin-bottom: 10px;}
li.big {margin:15px;}
.personBox {margin-left: 4px;}
.scrollBox {max-height: 300px;max-width: 500px;min-width: 200px;overflow-y: auto;}
.ie .scrollBox{/* the class ie is only applied to the body if browser is IE */
	padding-right:25px; /* IE insists on putting the scrollbar INSIDE the element which triggers the overflow-x, so give it room to show the scrollbar */
}
.rowFlex{
	display : flex;
	flex-direction: row; 
	align-items: flex-start;
	justify-content: left;
	display : -ms-flexbox;
	-ms-flex-direction: row;
	-ms-flex-align : start;
	-ms-flex-pack : left;
}
.colFlex{
	display : flex;
	flex-direction: column; 
	align-items: flex-start;
	justify-content: left;
	display : -ms-flexbox;
	-ms-flex-direction: column;
	-ms-flex-align : start;
	-ms-flex-pack : left;
}
@media only screen and (max-width : 800px) {
	.rowFlex { 
		display : block;
	}
}

@media print{
	body{
		background-color:#FFFFFF;
	}
	.noPrint {display:none;}
}