@media only print{
	th.pleftbox{display:none!important;}
	td.pleftbox{display:none!important;}
}
@media (max-width:600px){
	html, body{
		margin: 0px;
		padding: 0px;
	}
}

table.nobreaks tr{
	page-break-inside: avoid;
}

.h2 {
	font: normal 28px/normal Arial, Helvetica, sans-serif;
	text-transform: none;
	color: #FF0000;
	align: center;
	text-align: center;
}
.h3 {
	text-transform: none;
	color: #FF0000;
	align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-align: center;
}
.h3b {
	text-transform: none;
	color: #F00;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
}
.p {
	font: normal 14px/normal Arial, Helvetica, sans-serif;
	text-transform: none;
	color: #000;
	text-align: left;
	font-size: 14px;
}
.gray {
	font: normal 12px/normal Arial, Helvetica, sans-serif;
	text-transform: none;
	color: #CCCCCC;
}
.unordlst {
	list-style: square outside;
}
.box1 {
	margin: 0px;
	padding: 0px;
	float: none;
	height: 40px;
	width: 100%;
	background: #FFFFCC;
	font: normal 30px/normal Arial, Helvetica, sans-serif;
	text-transform: none;
	color: #FF0000;
}
.box2 {
	font: normal 14px/12px Arial, Helvetica, sans-serif;
	text-transform: none;
	color: #000000;
	padding: 4px;
}
.h3c {
	color: #FF0000;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
}
.bold14 {
	font: bold normal 14px/normal Arial, Helvetica, sans-serif;
	color: #000000;
}
.er1position {
	position: relative;
	left: 17%;
	top: 55px;
	width: 70%;
}
.er1template {
	left: 16%;
}
.p2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	/* line-height: normal; */
	line-height: 250%;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #000;
	text-decoration: none;
	text-align: left;
	/* height: auto; */
	padding-left: 4em;
}
.pleftbox {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #000;
	text-align: left;
	padding-left: 15px;
	position: relative;
	left: 1px;
}
.er1position {
	left: 146px;
	top: 430px;
	position: absolute;
}
.h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 24px;
	color: #F00;
	text-align: center;
}
.p-centre {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	text-align: center;
	font-weight: normal;
}

.pbold {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
}

.p-centre-red-bkrnd {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	text-align: center;
	background-color:#F00
}

a img {
	border: 0px solid;
}

.img1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #000;
	text-decoration: none;
	background-color: #FFF;
	letter-spacing: normal;
	text-align: left;
	word-spacing: normal;
	white-space: normal;
	padding-right: 22px;
	padding-left: 22px;
}
.p2red {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #F00;
	text-align: left;
	text-indent: 10px;
}
.p-right {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #000;
	text-align: right;
}

#table-indent{padding-left:3em}.p3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	padding-right: 6em;
	padding-left: 8em;
	font-style: normal;
	line-height: 120%;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	text-align: left;
}

#table-indent{padding-left:3em}.p3c {
	padding-right: 6em;
	padding-left: 8em;
	font-style: normal;
	line-height: 120%;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	text-align: center;
}

sup,sub {
        vertical-align: 0;
        position: relative;
        line-height: 0;
}
sup {
        bottom: 1ex;
}
sub {
        top: 0.8ex;
}

.textleft{
	text-align: left;
}
.textcenter{
	text-align: center;
}
.textright{
	text-align: right;
}

ul {
	list-style: none;
	border		: none;
	/* margin-left: 1em; */
}

li{
	margin-left: 1em;
}

ul.circles {
	list-style: circle; 
	margin-left: 4em;
}

ul.numbers {
	list-style: decimal; 
	margin-left: 4em;
}

ol.roman,ul.roman {
	list-style: lower-roman; 
	margin-left: 4em;
}

ul.alpha {
	list-style: lower-alpha; 
	margin-left: 4em;
}

ul.disc {
	list-style: disc; 
	margin-left: 4em;
}
ul.nodots {
	list-style: none; 
	margin-left: 4em;
}


.singlespaced {
	line-height: 150%;
}
.doublespaced {
	line-height: 200%;
}

li.doubledspaced {
	background-color: #FF00FF;
}

.spaced {
	margin-bottom: 1em;
}

ul.spaced li {
	margin-bottom: 1em;
/*  	background-color:red;  */
}	

div.centered ul{
	margin: 0px;
	margin-block-start: 0px;
	margin-block-end: 0px;
	padding-inline-start: 0px;
/* 	background-color: red; */
}
div.centered ul, div.centered ul li {
/* background-color: #ff00ff; */
	height: auto;
	display: inline-table;
/* display: inline; */
}

/* div.centered ul li div { */
	/* display: table-cell; */
/* background-color: red; */
/* } */


.noPadding {
	padding-left:	0em;
	padding-right:	0em;
	padding-top:	0em;
	padding-bottom:	0em;
}

.noMargin {
	margin-left:	0em;
	margin-right:	0em;
	margin-top:	0em;
	margin-bottom:	0em;
}

/***********/
/*
 * test to overlay a "+" on zoomable pictures
 */
.picture > a {
	display: block;
	position: relative;
	width: auto;
	height: auto;
}
@media only screen{
	.picture > a::before{
		display: flex;
		position: absolute;
		content: '+';
		color: rgba(0, 0, 0, 0.7);
		background: rgba(255, 255, 255, 0.7);
		border: 1px solid rgba(0, 0, 0, 0.7);
		z-index: 99;
		top: 5px;
		right: 5px;
		border-radius: 50%;
		width: 1.4rem;
		height: 1.4rem;
		align-items: center;
		justify-content: center;
		padding: 0.1rem 0.1rem;
		margin: auto auto;
		font-family: Ariel, Helvetica, sans-serif;
		font-size: 1rem;
/* 		font-size: 14px; */
		font-style: normal;
		line-height: normal;
		font-variant: normal;
		font-weight:  bold;
		text-transform: none;
		text-decoration: none;
	}
}
/************/


a img, a:hover img, div.picture a:hover img {
	border: 1px solid #0000ff;
}
div.picture img {
	position: relative;
	border: 1px  solid rgba(255, 255, 255, 0);
}

.picture {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-left: auto;
	margin-right: auto;
	border: 0px;
	width: auto;
	height: auto;
	padding: 0.5em;
	text-align: center;
}


.caption {
/* 	width:	auto; */
/* 	width:	170px; */
	width: 100%;
	min-width: 170px;
/* 	max-width: 170px; */
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: normal;	
/* 	padding-left: 1em; */
/* 	padding-right: 1em; */
	padding-top: 0.5em;
	padding-bottom: 0.5em;
/* 	margin-left: auto; */
/* 	margin-right: auto; */
/* 	color: #A0A0A0; */
/* 	background-color: #505050; */
}


.table2{
	display:table;
	width:90%;
	table-layout:fixed;
}

table.table2 td{
	display:table-cell;
	width:100px;
	height:100px;
	vertical-align: bottom;
	border:solid black 1px;
/* 	background-color: #00CCCC; */
}

.align-top {
    vertical-align: top;
}

.centered {
	width: auto;
	margin-left: auto;
	margin-right: auto;
	padding-left: 0px;
	padding-right: 0px;
	text-align: center;
	/* 	padding: 0.5em; 
 	padding-left: 0.5em;
	border: 0.2em; 
	padding-right: 0.5em;*/
	position:relative;
	display: block;
	/* background-color: #CC00CC; */
}

.centered-multi{
	display: inline-table;
/* background-color: #007F00; */
}

.thirds {
	width: 30%;
	display: inline-table;
}

.test {
	background-color:#ff00ff;
	padding:0.2em;
/* 	display:table-cell; */
}

/* test */
.notes {
	background-color: #C0C0C0;
}

.zebra_table{
	display: table;
	color: black;
	overflow: auto;
}

table.zebra_table thead tr td {
	background: white;
}
.zebra_table th {
	background: #FFFFFF;
}
.zebra_table > tfoot{
	outline: 2px solid black;
	background-color: #aabbcc !important;
}
.zebra_table tr td{
	padding-left: 0.5rem;
	padding-right: 0.5rem;
}

table.zebra_table  tr:nth-child(even){
	background-color: #F0F0F0;
}
table.zebra_table  tr:nth-child(odd){
	background-color: #E0E0E0;
}

.row {
	display: table-row;
}

.fields {	/* not used? */
	display: table-cell;
	padding-right: 10px;
}

.cell {
	display: table-cell;
	padding-left: 10px;
	padding-right: 10px;
}

.cell-left {
	display: table-cell;
	padding-left: 10px;
	padding-right: 10px;
	text-align: left;
}
.cell-right {
	display: table-cell;
	padding-left: 10px;
	padding-right: 10px;
	text-align: right;
}

.cell-center {
	display: table-cell;
	padding-left: 10px;
	padding-right: 10px;
	text-align: center;
}

.cell p {
	margin: 1px 1px;
}

.highlight {
	background: #ffff00;
}

.footnotes {
	line-height: 2rem;
	/* background-color: #FF00FF; */
}

.footnotes li {
/* 	padding: 0.2em; */
	line-height: 150%;
	list-style: lower-roman;

}

.column { 
/*	border-right: 1px solid black;*/
}

.column:last-child {
/*	border-right: none;*/
}

/*
.column ul {
	margin-left: 20px;
	padding-left: 10px;
	border-left: 1px grey solid;
}
*/


.nojs{
	display: none !important;
	visibility: hidden !important;
}

.containerCentered{
	display: flex; 
	margin: auto; 
	padding: auto; 
	justify-content: center;
}

.videoListContainer{
	display: grid;
	grid-auto-rows: auto;
	row-gap: 0px;
	width: auto;
	align-items: center;
/* 	margin-left: 3.5em; */
	overflow: auto;
}
.videoSummary{
	display: grid;
	grid-template-columns: 80px 1fr 1fr;
	grid-auto-rows: auto;
	grid-template-areas:
		'videoDate videoSpeaker videoTopic';
	column-gap: 1em;
	width: 100%;
	max-width: 800px;
	font-weight: normal;
	background-color: #eee;
	text-align: left;
	align-items: center;
	justify-content: space-between;
	justify-items: start;
	border: 1px solid black;
	border-top: none;
	padding: 5px;
}
.videoSummary:nth-child(even){
	background-color: #ddd;
}
.videoSummary:first-child{
	font-size: 1.2rem;
	color: white;
	justify-items: center;
	background: #777;
	border: 1px solid black;
}
.videoSpeakers{
	min-width: 100px;
}
.videoTopic{
	font-size: 110%;
	font-weight: bold;
}
.videoDateTable{
}
.videoDate{
	font-size: 80%;
	background-color: lightgray;
	margin-top: auto;
	outline: 1px solid darkgray;
}
.videoPoster{
	background-color: darkgray;
/* 	height: 90px; */
	outline: 1px solid darkgray;
}
.videoPoster img{
	height: 100%;
	object-fit: fill;
}
.videoItem{
	text-decoration: none;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	width: 200px;
	outline: 1px solid gray;
	border-radius: 5px;
	box-shadow: 4px 4px 10px black;
	overflow: hidden;
	margin: 0.5rem;
	align-items: left;
	aspect-ratio: 1/1;
}
.videoItem:hover, .videoItem:focus{
	outline: 2px solid blue;
}
.videoListContainer2{
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	justify-content: space-evenly;
	padding-top: 10px;
	padding-bottom: 10px;
}
@media (min-width: 501px){
		.videoListContainer2 a:first-child .videoPoster{
		height: 180px;
	}
	.videoListContainer2 a:first-child{
	margin-bottom: 1.5rem;
			width: 100%;
			min-width: 300px;
			max-width: 300px;
			margin-left: 40%;
			margin-right: 40%;
			box-shadow: 8px 8px 20px black;	
	}
}
.videoListContainer2 a img{
	border: 0px;
}
#videosTable > thead {
	background-color: lightgray;
}
#videosTable > thead > tr > td {
	text-align: center;
	font-size: 1.1rem;
	font-weight: bold;
	border-bottom: 0.1rem solid black;
}

@media (max-width: 500px){
	.videoListContainer2{
		flex-direction: column;
		align-content: center;
		width: 90%;
		justify-items: center;
	}
	.videoItem{
		margin: 0.5rem;
		width: 100%;
/* 		outline: 1px dashed blue; */
	}
	.videoPoster{
/* 		width: 100%; */
/* outline: 2px dashed green; */
		overflow: hidden;
		height: auto;
		aspect-ratio:16/9;
	}
	.videoPoster img{
		width: 100%;
/* 		height: auto; */
	}
	.p2{
		padding-left: 0.2rem;
	}
}
iframe[id="player"]{
	max-width: 100%;
	aspect-ratio: 16/9;
}

/*
 * a dropdown element for year selection
*/
.centerIt{
	display: block;
	margin: auto;
	padding-block: 1rem;
	left: 0px;
	right: 0px;
	position: relative;
	width: 200px;
}
.dropSelect{
	display: flex;
	flex-wrap: nowrap;
	flex-direction: column;
	width: fit-content;
	left: 0px; right: 0px;
	margin: auto;
	position: absolute;
	background-color: #FFC;
	padding: 10px;
	border-radius: 10px;
	border: 1px solid black;
	text-align: center;
	overflow: hidden;
	justify-self: center;
	align-items: center;
	font-size: 1rem;
	text-decoration: none;
}
.dropSelect a{
		text-decoration: none;
}
.dropSelect > div{
	max-height: 200px;
	overflow-y: auto;
	width: 100%
}

.dropSelect:target > div> a, .dropSelect:focus > div> a,  .dropSelect:focus-within > div> a, .dropSelect:hover > div> a{
	display: flex;
	justify-content: center;
}
.dropSelect > div> a{
	display: none;
	text-decoration: none;
	padding: 15px;
	background-color: gold;
	position: relative;
	text-align: center;
	height: auto;
	width: auto;
	border-top: 1px solid black;
	border-left: 1px solid black;
}
/*
.dropSelect > div> a:first-child{
	border-radius: 10px 0px 0px 0px;
}
.dropSelect > div> a:last-child{
	border-radius: 0px 0px 0px 10px;
	border-bottom: 1px solid black;
}
*/

.dropSelect > div> a:focus, .dropSelect > div> a:target, .dropSelect > div> a:hover{
	display: flex;
	background-color: white;
}


.hasVideoFilm, .hasVideoCamera, .hasVideoTv{
/* 	float: right; */
	font-size: 150%;
}
.hasVideoFilm::before{
	content: '\01f4fd';
}
.hasVideoCamera::before{
/* camera */
	content: '\01F4F9'; 
}
.hasVideoTv::before{
/* tv */
	content: '\01F4FA';
}

#filterVideo {
	margin-left: 1rem;
}
@media screen and (max-width: 640px){
	#filterVideo {
		margin-top: 0.5rem;
		margin-left: 0rem;
	}

	#pastMeetingsTable tr{
		display: flex;
		flex-direction: column;
		margin-top: 1rem;
		align-items: center;
	}
	#pastMeetingsTable tr td{
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
	}
	#pastMeetingsTable tbody > tr{
		border: 1px solid black;
		border-radius: 0.5rem;
	}
}

table.dataTable tbody tr:hover{
  color: black;
  background-color: #ffc !important;
  }
  
/*
 * test to overlay a "+" on zoomable pictures
 */
/*
.picture > a {
	position: relative;
	width: auto;
	height: auto;
}
.picture > a::before{
	content: '+';
// 	content: '\1F50D'; 
	text-decoration: none;
	color: black;
	background: rgba(255, 255, 255, 0.7);
	z-index: 99;
	top: 5px;
	right: 5px;
	border-radius: 50%;
	width: 1.2rem;
	height: 1.2rem;
	position: absolute;
	font-size: 1rem;
	align-items: center;
	justify-content: center;
	display: flex;
}
*/


.visually-hidden {
      position: absolute;
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0,0,0,0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.avatar{
	width: 300px;
	height: 300px;
}

.responsive{
	max-width: 100%;
	height: auto;
}

.scrollToTop {
	background-color: #ccc;
	color: black;
	padding: 0.5rem;
	text-decoration: none;
	border-radius: 0.5rem;
	position: fixed;
	right: 2rem;
	bottom: 2rem;
	float: right;
	border: 1px solid #aaa;
	box-shadow: 0px 0px 8px #888;
	opacity: 1;
	transition: opacity 1s;
}
.scrollToTop:hover{
	background-color: #ddd;
}
/*.scrollToTop::after{
	content: '\2191';
	font-size: 150%;
	line-height: 100%;
	padding-top: 0px;
}*/


/* test */
.resp{
	display: flex;
	overflow-x: auto;
	/* 	max-width: 100%; */
	/* 	max-width: 99%;*/
/* 	width: 100%; */
justify-content: center;
}
.resp table {
/* 	overflow-x: auto */
	border: 0.2rem;
	margin: 0.2rem;
	padding: 0.2rem;
/* 	width: 100%; */
}
.resp table td, .resp table tr {
	/* 	background-color: pink; */
	/* min-width: 10rem; */
	margin: 0.2rem;
	padding: 0.2rem;
}