p,li { font-family:Verdana,Geneva,sans-serif; font-size:1pc;}
h1 { font-family:Comfortaa,Verdana,Geneva,sans-serif;}
h2 {font-family:Comfortaa,Verdana,Geneva,sans-serif;}
h3 {font-family:Comfortaa,Verdana,Geneva,sans-serif;}
h4 {font-family:Comfortaa,Verdana,Geneva,sans-serif;}
label {font-family:Verdana,Geneva,sans-serif;font-size: 1pc;}
td { font-family:Verdana,Geneva,sans-serif;padding:6px;overflow-wrap:break-word; }
th { font-family:Verdana,Geneva,sans-serif;padding:8px; }
dl { font-family:Verdana,Geneva,sans-serif; }
dt { font-weight:bold;margin-bottom:8px;margin-top:24px; }
dd { margin-bottom:8px;margin-top:8px; }
a { font-family:Verdana,Geneva,sans-serif; }
div { font-family:Verdana,Geneva,sans-serif;overflow-wrap:break-word; }
table { border-collapse:collapse; }
label {
	font-family:Verdana,Geneva,sans-serif;
	font-size:1pc;
	font-weight:bold;
}
.value {
	font-family:Verdana,Geneva,sans-serif;
	font-size:1.2pc;
}
.error {
	font-family:Verdana,Geneva,sans-serif;
	font-size:1.5pc;
	font-weight:bold;
	color:#ff0000;
	text-align:center;
	padding: 10px 12px;
	border-radius: 8px;
}
.warning {
	font-family:Verdana,Geneva,sans-serif;
	font-size:1.5pc;
	font-weight:bold;
	color:#f7ef07;
	text-align:center;
	padding: 10px 12px;
	border-radius: 8px;
}
.message {
	font-family:Verdana,Geneva,sans-serif;
	font-size:1.5pc;
	font-weight:bold;
	color:#07631f;
	text-align:center;
	padding: 10px 12px;
	border-radius: 8px;
}

.footer {
	font-family:Verdana,Geneva,sans-serif;
	font-size:0.8pc;
	color:black;
}
.link {
	font-family:Verdana,Geneva,sans-serif;
	font-size:1pc;
}
.literal {
	font-family:"Lucida Console",Monaco,monospace;
	font-size:1pc;
}
.preformatted {
    font-family: monospace;
	font-size:1pc;
    white-space: pre;
}

#list {
	border:1px solid #a9a9a9;
	border-collapse:collapse
}
#list th {
	padding:8px;
	border:1px solid #a9a9a9;
	background-color:white;
}
#list td {
	padding:6px;
	border:1px solid #a9a9a9;
	font-size:1pc;
}
#list tr:nth-child(odd){background-color:#e6ffff; }

.f-entry {
	margin: 2%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1%;
}
.f-label {
	flex: 0 0 16%;
	min-width: 120px;
}
.f-input {
	flex: 1 1 60%;
	min-width: 200px;
}
.f-extra {
	flex: 0 0 auto;
	font-family:Verdana,Geneva,sans-serif;
	font-size:1pc;
}

.u-list {  border-collapse: collapse; }
.u-entry { border: solid lightgray 1px; }
.u-id { width:15%; float:left; padding:1%;}
.u-name {width:25%; float:left; padding:1%;}
.u-e-mail {width:30%; float:left; padding:1%;}
.u-primary {width:10%; float:left; padding:1%; }
.u-entry:after { content: ""; display: table; clear: both; }
.u-entry:nth-child(odd) {background-color:#e6ffff;}

.t-list { border-collapse: collapse; }
.t-entry { border: solid lightgray 1px; }
.t-sel { width:5%; float:left; padding:1%;}
.t-lbl { width:12%; float:left; padding:1%;}
.t-img { width:12%; float:left; padding:1%;}
.t-desc { width:15%; float:left; padding:1%;}
.t-dim { width:8%; float:left; padding:1%; }
.t-wt { width:8%; float:left; padding:1%; }
.t-loc { width:10%; float:left; padding:1%;}
.t-updated { width:8%; float:left; padding:1%; }
.t-entry:after { content: ""; display: table; clear: both; }
.t-entry:nth-child(odd) {background-color:#e6ffff;}

.m-list { border-collapse: collapse; }
.m-entry { border: solid lightgray 1px; }
.m-name { width:16%; float:left; padding:1%; }
.m-desc { width:16%; float:left; padding:1%; }
.m-dest { width:16%; float:left; padding:1%; }
.m-due { width:10%; float:left; padding:1%; }
.m-assign { width:8%; float:left; padding:1%; }
.m-status { width:8%; float:left; padding:1%; }
.m-updated {width:9%; float:left; padding:1%; }
.m-entry:after { content: ""; display: table; clear: both; }
.m-entry:nth-child(odd) {background-color:#e6ffff; }

.mi-list { border-collapse: collapse; }
.mi-entry { border: solid lightgray 1px; }
.mi-sel { width:5%; float:left; padding:1%; }
.mi-lbl { width:20%; float:left; padding:1%; }
.mi-desc { width:25%; float:left; padding:1%; }
.mi-dim { width:10%; float:left; padding:1%; }
.mi-wt { width:10%; float:left; padding:1%; }
.mi-entry:after { content: ""; display: table; clear: both; }
.mi-entry:nth-child(odd) {background-color:#e6ffff; }

.st-list { border: solid lightgray 1px; padding:2%; margin:2%; }
.st-entry { margin: 1%; }
.st-label { width: 25%; font-weight: bold; float: left; }
.st-value { width: 75%; float: left; }
.st-entry:after { content: ""; display: table; clear: both; }

.th-gallery {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin-top: 8px;
}
.th-gallery-item {
	flex: 0 1 calc(33.333% - 16px);
	min-width: 200px;
	text-align: center;
}
.th-gallery-item img {
	width: 100%;
	height: auto;
	border: 1px solid #ccc;
	border-radius: 4px;
	cursor: pointer;
	transition: transform 0.2s;
}
.th-gallery-item img:hover {
	transform: scale(1.05);
	box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}
.th-gallery-caption {
	font-family: Verdana,Geneva,sans-serif;
	font-size: 0.8pc;
	color: #666;
	margin-top: 4px;
}

.th-thumb-gallery {
	display: flex;
	flex-wrap: nowrap;
	overflow-x: auto;
	gap: 8px;
	margin-bottom: 12px;
	padding: 8px;
	background-color: #f5f5f5;
	border: 1px solid #ddd;
	border-radius: 4px;
}
.th-thumb-item {
	flex: 0 0 auto;
}
.th-thumb-item a {
	display: block;
	border: 2px solid #ccc;
	border-radius: 4px;
	overflow: hidden;
	transition: border-color 0.2s;
}
.th-thumb-item a:hover {
	border-color: #666;
}
.th-thumb-item img {
	display: block;
	width: 96px;
	height: 96px;
	object-fit: cover;
}

.form-note {
	font-family: Verdana,Geneva,sans-serif;
	font-size: 0.9pc;
	color: #666;
	margin: 8px 0;
	padding: 8px;
	background-color: #f9f9f9;
	border-left: 3px solid #4CAF50;
}

input[type="text"],
input[type="email"],
input[type="password"],
textarea,
select {
	border: 1px solid #c8c8c8;
	border-radius: 6px;
	padding: 8px 10px;
	font-size: 1rem;
	box-sizing: border-box;
	width: 100%;
	max-width: 600px;
}

input:focus,
textarea:focus,
select:focus {
	outline: none;
	border-color: #2563eb;
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.18);
}

input[type="submit"],
button {
	border-radius: 8px;
	min-height: 40px;
	padding: 8px 14px;
	cursor: pointer;
	font-size: 1.3pc;
	font-weight: 500;
}

.cf-turnstile {
	margin-top: 6px;
}

@media (max-width: 480px) {

	.f-label {
		flex: 0 0 100%;
		margin-bottom: 4px;
	}

	.f-input {
		flex: 0 0 100%;
	}

	input[type="submit"],
	button {
		width: 100%;
		min-height: 44px;
	}
}