body {
	font-family:"Times New Roman", Times, serif;
	font-size:13pt;
	background-color:#f2f2f2;
}

table {border-collapse: collapse; font-size:15px; font-family:arial;}
th, td {border: 1px solid lightgrey;}
th {background-color:#e6ffe6;}
input {font-size:15px; background-color: #ffffe6; border:1px solid lightgray; margin:0; padding:2px;}
select {font-size:15px; font-family:arial;}
textarea {font-size:15px; font-family:arial; background-color: #ffffe6; margin:0; padding:2px;}
label {display:inline-block; white-space: nowrap;}

.noulindent {padding-left: 1.2em; margin:0px;} /* UL with dots below title & no break before after ul list */

highlight {color:red;}	// special use of my made up html item for highlighting archived text.

/*  Order: a:link, a:visited, a:hover, a:active */
a {color:blue; text-decoration:none;}
a:link {color:blue; text-decoration:none;}
a:hover {background-color:yellow; text-decoration:none;}
a:visited {color:blue; text-decoration:none;}
a:active {color:blue; text-decoration:none;}

.main {
	max-width:800px;
	margin-left:auto;
	margin-right:auto;
	background-color:white;
	border:1px solid gray;
	padding:10px;
}
.subtitle {text-align:center; font-size:1.2em;color:green;}
.new {background-color:yellow; display:inline; font-style:italic; font-size:0.8em; white-space: nowrap;}
.indent-tight ul,ol {border:0; padding-left:30px; margin:0;}
.tblcol1 {background-color:#e6ffe6;}


@media print {
	.noprint {display: none;}
}

button {border-radius:10px;}
button:hover {background-color:yellow; text-decoration:none;}

.updbutton {background-color:lightblue; cursor: pointer; font-size:15px; }
.addbutton {background-color:lightgreen; cursor: pointer; font-size:15px; }
.delbutton {background-color:pink; cursor: pointer; font-size:15px; }
.canbutton {background-color:#ffff99; cursor: pointer; font-size:15px; }

/* --- PAGE FOOTER --- */
.footer {background-color:#e6f7ff;
	border:1px solid gray;
	font-size:0.9em;
	font-style:italic;
	white-space: nowrap;
	box-shadow: 5px 5px 5px #cccccc;
	}

.footimage {max-width:800px;
	height:320px;
	margin:0 auto;
	text-align:center;
	font-size:.8em;
}

.footimage img {object-fit: contain;
	max-height:300px;
	width:100%;
	cursor:pointer;
}

/* ---- end page footer ---- */


/* --- TOP MENU --- */
.topnav {background-color: #e6f7ff;
/*	overflow: hidden; */
/*	overflow: visible;
	display:block; */
	border:1px solid gray;
	box-shadow: 5px 5px 5px #cccccc;
	height:auto;
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	}
.topnav a {
	display: inline-block;
	color: blue;
	text-align: center;
	padding: 2px 7px;
	text-decoration: none;
	white-space:nowrap;
}
.topnav div {
	display: inline-block;
	font-style:italic;
}

.topnav a:hover {background-color:yellow;color:black;}
.topnav a.active {background-color:#98e698;color:black;}
.topnav .menuicon {display: none;}
/* .topnav .menucontact {float:right;} */
.topnav .subtitle {color:green;}
.topnav a.dbaonly {color:red;}
.donatebtn {border-radius: 10px; background:#ffcc80; padding:2px 5px;}

@media screen and (max-width: 900px) {
	.topnav {display:block;}
}


/*
@media screen and (max-width: 700px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav div:not(:first-child) {display: none;}
  .topnav a.menuicon {
    float: right;
    display: block;
  }
}
@media screen and (max-width: 700px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive .menuicon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
}
*/
/* ---- end top menu ---- */


/*  ----  standard icons ---- */
.icon-up:before {
	content: "\27A4" ; /*  "\27A4" (fancy arrow) \25B8 (small right triangle) '\2795' (+);   Unicode character for "plus" sign (+) */
	margin-right: 5px;
}

.icon-down:before {
	content: "\2796"; /*   \25BE (small down triangle)  "\2796" Unicode character for "minus" sign (-) */
	margin-right:5px;
	background-color:orange;
}

.icon-edit:before {
	content: "Ξ"  ; /* "\039E"  "\01F738" "\2B0B"   https://www.htmlsymbols.xyz/unicode/U+2B0B */
	margin: 0 4px;
}
@media print {
	.icon-edit {display:none;}
}

a.viewlink {
	background: transparent url("images/icon-search.gif") right no-repeat;
	text-decoration:none;
	padding:0 8px;
	margin: 0 0.2em 0 0;
}

@media print {
	.viewlink {display:none;}
}

a.extlink {
	background: transparent url("images/icon-ext.gif") right no-repeat;
	text-decoration:none;
	padding-right: 10px;
	margin: 0 0.2em 0 0;
}

a.extlink:hover {
	background-color:yellow;
}

a.pdflink {
	background: transparent url("images/icon-pdf.gif") right no-repeat;
	text-decoration:none;
	padding-right: 18px;
	margin: 0 0.2em 0 0;
}

/* ---- end standard icons ---- */


/* ---- orig expandable sections ---- */
.sec_title {color:#0000b3; text-decoration: none;}		/* -- open/close a full section */
.sec_item {padding-left:15px;}		/* -- open/close individual items within section */
.sec_lead {padding-left:10px;}		/* -- teaser text displayed under sec_item */
.sec_body {border:1px solid gray; padding:10px; display:none; margin-bottom:20px;}	/* full body of text with border */
.cat_div {display:none; padding: 10px 5px 20px 10px;}


/* ---  12/22/20 VERSION --- */
.rec_new {background-color:yellow; display:inline; font-style:italic; font-size:0.8em; white-space: nowrap;}
.rec_outline {padding-top:10px;}
.rec_cat {display:none; padding: 0px 0px 20px 10px;}
.sec_item {padding-left:15px;}		/* -- open/close individual records within primary section */
.rec_date {font-size:0.9em;}	/* item date */
.rec_title {color:#0000b3; text-decoration: none;}		/* -- title text used to open/close a record */
.rec_sub {display:block; padding-left:20px;}		/* -- subtitle text displayed under title */
.rec_body {display:none; border:1px solid gray; padding:10px; margin-bottom:20px; margin-top:10px;
	border-radius: 10px; margin-right: 10px; 	box-shadow:10px 10px 10px lightgray;
	}	/* full body of text with border */
.rec_more {display:none;}
.rec_more_opt{color:green;}
.rec_pin:before {
	content: url("images/icon-pin3.png");
	margin-right:5px;
}

/* ---- end expandable sections ---- */

.errmsg {color:red; font-weight:bold;}
.msg {color:green; font-weight:bold;}
#flashmsg {color:green; font-weight:bold;
	transition: background 1.5s;
	transition-timing-function: ease-in-out;
	background-color: yellow;
	padding:5px;
	border:1px dotted lightgrey;
	box-shadow: 5px 5px 5px grey;
	}

.help_link {cursor:help;}
.help_text {background-color:#f2f2f2; display:none; border:1px solid gray; padding:10px; margin-bottom:20px; margin-top:10px; border-radius: 10px; margin-right: 10px; box-shadow:10px 10px 10px lightgray; text-align:left;
	}