html,body {
	margin:5px;
	padding: 0px;
}
form {
	margin: 0px;
	padding: 0px;
}
div {
	margin-top: 10px;
	margin-right: 10px;
	padding: 5px;
}
a:link {
	text-decoration: none;
}
a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
.nopad {
	margin: 0px;
	padding: 0px;
}
.clear {
	clear: both;
}
.imgfloat {
	float: left;
	vertical-align: middle;
}
.floatleft {
	float: left;
	margin-right: 20px;
	margin-top: 20px;
}
body {
	font-family: Arial, Arial, Helvetica, sans-serif;
	font-size: 95%;
}
.content {
	margin-left: 220px;
}
.floatright {
	float: right;
	margin-left: 20px;
}
.imgright {
	float: right;
	margin-left: 20px;
	margin-top: 20px;
}
div#logo {
	margin-top: 0px;
	margin-bottom: 5px;
	margin-left: 10px;
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-style: italic;
}
div#logo img {
	vertical-align: middle;
}

 



#logo span {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
   
          /* optional: make it bolder */
}



/*

OLD


div#header {
	clear: both;
	height: 75px;
	background-color: #9C6;
	margin: 0px;
	padding: 0px;
	border-left: 10px solid #036;
	border-bottom: 5px solid #036;
}


*/

/* HEADER — modernized */
div#header {
  display: flex;
  align-items: center;
  justify-content: space-between;

  min-height: 80px;
 
  

  /* softer look than the thick borders */
  background: linear-gradient(135deg, #e0f2fe, #f0fdf4) !important;
  border: 0;
  box-shadow: 0 2px 10px rgba(0,0,0,.06);
  border-radius: 16px;
}

/* ensure the right-side image plays nicely with flex */
#header .floatright {
  float: none;              /* cancel old float in header context */
  margin-left: auto;
  max-height: 125px;         /* keep it from getting too tall */
}

/* title inside the header */
#header .vcenter {
  margin: 0;
  padding: 10;
  color:#1b3a6f;
  font-weight: 700;
  /* responsive sizing without huge jumps */
  font-size: clamp(18px, 2.2vw, 28px);
}




.vcenter {
	font-family: sans-serif;
	font-size: 180%; /*28px;*/
	margin: 0px;
	margin-left: 30px;
	padding-top: 25px;
	color: #fff;
}


/* 
OLD

#loginbox {
	float: right;
	background-color: #EEEEFF;
	margin-right: 0px;
	margin-left: 20px;
	margin-bottom: 10px;
	width: 230px;
	border: 1px solid #000000;
}
*/


/* UPDATED BEGIN*/

/* Centered, modern login box */
#loginbox {
  float: none;                 /* cancel any previous float */
  margin: 80px auto;           /* center horizontally */
  padding: 25px;
  width: 320px;

  background: #ffffff;
  border: 1px solid #e0e0e0;
  border-radius: 10px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);

  font-family: "Segoe UI", Tahoma, sans-serif;
}

#loginbox b {
  display: block;
  font-size: 1.2rem;
  font-weight: 600;
  margin-bottom: 15px;
  text-align: center;
}

#loginbox input[type="text"],
#loginbox input[type="password"] {
  width: 100%;
  padding: 10px;
  margin-bottom: 15px;
  border: 1px solid #ccc;
  border-radius: 5px;
  box-sizing: border-box;
}

#loginbox input[type="submit"] {
  width: 100%;
  padding: 10px;
  background-color: #1b449d;
  color: white !important;
  border: none;
  border-radius: 5px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.2s ease;
}
#loginbox input[type="submit"]:hover { background-color: #1e4fd6; }

#loginbox a {
  display: block;
  margin-top: 8px;
  font-size: 0.9rem;
  color: #2563eb;
  text-decoration: none;
  text-align: center;
}
#loginbox a:hover { text-decoration: underline; }


/* UPDATED END*/


/* OLD 
 

ul#navlist
{
clear: both;
padding: 0px;
margin: 0px;
margin-bottom: 3px;
list-style-type: none;
float: left;
width: 100%;
color: #fff;
background-color: #036;
}

ul#navlist li { 
display: inline;
font-family: sans-serif;
font-size: 105%;
}

ul#navlist li a
{
float: left;
width: 5em;
color: #fff;
background-color: #036;
padding: 0.2em 2em;
text-decoration: none;
border-right: 1px solid #fff;
}

ul#navlist li a:hover
{
background-color: #369;
color: #fff;
}

*/

/* NAV BAR — modernized */
ul#navlist {
  /* layout */
  display: flex;
  align-items: center;
  gap: .25rem;              /* space between items */
  flex-wrap: wrap;          /* wraps on small screens */

  /* reset */
  list-style: none;
  margin: 0;
  padding: 0 .75rem;

  /* look */
  min-height: 48px;
  width: 100%;
  color: #fff;
  background-color: #036;   /* keep your brand blue */
  box-shadow: 0 2px 6px rgba(0,0,0,.08);
}

ul#navlist li {
  display: block;
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: 15px;
  font-weight: 600;
}

ul#navlist li a {
  /* remove old floats/fixed width pills */
  display: block;
  padding: .6rem .9rem;
  color: #fff;
  text-decoration: none;
  border: 0;
  border-radius: 8px;       /* “pill” buttons */
  background: transparent;  /* show bar color by default */
  transition: background-color .15s ease, color .15s ease, transform .05s ease;
}

/* hover/focus/active states */
ul#navlist li a:hover,
ul#navlist li a:focus {
  background-color: #369;   /* your existing hover color */
  outline: none;
}

ul#navlist li a.active {
  background-color: #1b6fb8;  /* distinct active pill */
  color: #fff;
}

/* small-screen nicety: horizontal scroll if needed */
@media (max-width: 420px) {
  ul#navlist {
    overflow-x: auto;
    white-space: nowrap;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
  }
  ul#navlist li { flex: 0 0 auto; }
}




#shortlogin {
	width: 100%;
	padding: 8px 5px 0px 15px;
	background-color: #cf9;
	color: #036;
	border-left: 10px solid #036;
}

.textright {
	text-align: right;
}
.ind {
	margin-left: 20px;
}
.nomark {
	list-style-type: none;
}
.nomark li {
	margin-bottom: 15px;
}
.mainbody {
	margin: 0px;
	padding: 0px;
}
.bordered {
	border-collapse: collapse;
}
.bordered td,.bordered th {
	border: 1px solid #000;
	padding: 10px 20px;
}

.headerwrapper, .midwrapper {
	margin: 0;
	padding: 0;
}

