html { font-family: sans-serif; background: #eee; padding: 1rem; }
body { max-width: 960px; margin: 0 auto; background: white; }
h1 { font-family: serif; color: #377ba8; margin: 1rem 0; }
h2 { font-family: serif; color: #377ba8; margin: 1rem 0; }
h3 { font-family: serif; color: #377ba8; margin: 1rem 0; }
a { color: #377ba8; }
hr { border: none; border-top: 1px solid lightgray; }
nav { background: lightgray; display: flex; align-items: center; padding: 0 0.5rem; }
nav h1 { flex: auto; margin: 0; }
nav h1 a { text-decoration: none; padding: 0.25rem 0.5rem; }
nav ul  { display: flex; list-style: none; margin: 0; padding: 0; }
nav ul li a, nav ul li span, header .action { display: block; padding: 0.5rem; }
.content { padding: 0 1rem 1rem; }
.content > header { border-bottom: 1px solid lightgray; display: flex; align-items: flex-end; }
.content > header h1 { flex: auto; margin: 1rem 0 0.25rem 0; }
.flash { margin: 1em 0; padding: 1em; background: #cae6f6; border: 1px solid #377ba8; }
.post > header { display: flex; align-items: flex-end; font-size: 0.85em; }
.post > header > div:first-of-type { flex: auto; }
.post > header h1 { font-size: 1.5em; margin-bottom: 0; }
.post .about { color: slategray; font-style: italic; }
.post .body { white-space: pre-line; }
.content:last-child { margin-bottom: 0; }
.content form { margin: 1em 0; display: flex; flex-direction: column; }
.content label { font-weight: bold; }
.content textarea { min-height: 12em; resize: vertical; }
nav.menu {background-color: #cae6f6;}
nav.menu ul li a {border: 1px solid #555; text-decoration: none;}
nav.menu ul li a:hover {
  background-color: #cf9577;
  color: white;
}
input {
  align-self: start;
  padding: 1px 6px;
}
select {
  align-self: start;
  width: max-content;
}
input.danger { color: #cc2f2e; }
input[type=submit] { align-self: start; min-width: 10em; }
a.title-link
{
font-family: serif;
color: #377ba8;
margin: 1rem 0;
text-decoration: none;
padding: 0;
}
input[type=checkbox][disabled]{
  outline:2px solid gray;
  outline-offset: -2px;
}
.form-style {
	max-width: 400px;
	padding: 20px 12px 10px 20px;
	font: 13px "Lucida Sans Unicode", "Lucida Grande", sans-serif;
}
.form-style li {
	padding: 0;
	display: block;
	list-style: none;
	margin: 10px 0 0 0;
}
.form-style label{
	margin:0 0 3px 0;
	padding:0px;
	display:block;
	font-weight: bold;
}
.form-style input[type=text], 
.form-style input[type=date],
.form-style input[type=datetime],
.form-style input[type=number],
.form-style input[type=search],
.form-style input[type=time],
.form-style input[type=url],
.form-style input[type=email],
textarea, 
select{
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	border:1px solid #BEBEBE;
	padding: 7px;
	margin:0px;
	-webkit-transition: all 0.30s ease-in-out;
	-moz-transition: all 0.30s ease-in-out;
	-ms-transition: all 0.30s ease-in-out;
	-o-transition: all 0.30s ease-in-out;
	outline: none;	
}
.form-style input[type=text]:focus,
.form-style input[type=date]:focus,
.form-style input[type=datetime]:focus,
.form-style input[type=number]:focus,
.form-style input[type=search]:focus,
.form-style input[type=time]:focus,
.form-style input[type=url]:focus,
.form-style input[type=email]:focus,
.form-style textarea:focus,
.form-style select:focus{
	-moz-box-shadow: 0 0 8px #88D5E9;
	-webkit-box-shadow: 0 0 8px #88D5E9;
	box-shadow: 0 0 8px #88D5E9;
	border: 1px solid #88D5E9;
}
.form-style .field-divided{
	width: 49%;
}

.form-style .field-long{
	width: 100%;
}
.form-style .field-select{
	width: 100%;
}
.form-style .field-textarea{
	height: 100px;
}
.form-style input[type=submit], .form-style input[type=button]{
	background: #4B99AD;
	padding: 8px 15px 8px 15px;
	border: none;
	color: #fff;
}
.form-style input[type=submit]:hover, .form-style input[type=button]:hover{
	background: #4691A4;
	box-shadow:none;
	-moz-box-shadow:none;
	-webkit-box-shadow:none;
}
.form-style .required{
	color:red;
}
table {
    width: fit-content;
    white-space: nowrap;
}

td {
    padding-right: 20px;
}

* { 
  -webkit-tap-highlight-color: transparent; 
} 

a, article, div, h1, h2, h3, h4, h5, h6, img, section, span { 
  -moz-user-select: none; 
  -webkit-user-select: none; 
} 

input:not([type="checkbox"]), 
textarea { 
  -webkit-appearance: none; 
  -webkit-border-radius:0; 
   border-radius: 0; 
}