.article input, textarea {
  font-family: "Roboto", sans-serif;
  font-size: 100%;
  margin: 1ex 1em 1ex 1em;
  border-style: dotted;
  border-width: 0.5px;
  border-color: #000000a0;
  width: calc(100% - 2em);
  resize: vertical;
}

.article h1 input {
  color: #a00000;
  font-variant: small-caps;
  font-weight: bold;
  margin: 2ex 1em 1ex 1em;
}
.article h2 input {
  color: #a00000;
  font-variant: small-caps;
  font-weight: bold;
  margin: 1ex 1em 0.5ex 1em;
}
.article h3 input {
  color: #a00000;
  font-variant: small-caps;
  font-weight: bold;
  margin: 1ex 1em 0.5ex 1em;
}
.article h4 input {
  color: #500000;
  font-weight: bold;
  margin: 0.8ex 1em 0.4ex 1em;
}
.reference input[type="text"], input[type="url"], input[type="date"] {
  background: #ffffffa0;
  color: #a00000;
  border-style: groove;
  border-color: #ffe5c0;
  border-width: 1px;
  width: calc(100% - 2em);
}

.reference {
  top: 0;
  left: 0;
  width: 100%;
  background: #ffe5c0a0;
  padding: 3px 1em 3px 1em;
  margin: 0;
  text-align: right;
  color: #a00000;
  z-index: 1;
}
.reference a {
  color: #a00000;
}

.article {
  margin-bottom: 2ex;
}

.article > article {
  columns: 360px 3;
  column-gap: 2em;
  padding: 1ex 1em 1ex 1em;  
}

.article > article h1, h2, h3 {
  column-span: all;
}

.article > article h3 {
  color: #803030;
}

.article figure {
  margin: 1ex 0 1ex 0;
  width: 100%;
  break-inside: avoid;
}

.noshadow {
  box-shadow: none;
}

.article > article.obituary {
  column-count: 1;
  margin-left: auto;
  margin-right: auto;
  max-width: 850px;
  border-style: solid;
  border-width: 5px;
  border-color: #000000;
  padding: 15px;
  text-align: justify;
}

.article > article.newspaper * {
  font-family: "Lora";
  font-weight: 500;
}

.article > article.newspaper .city {
  font-variant: small-caps;
  font-weight: bold;
  font-size: 110%;
}

.article > article.newspaper h2 {
  text-align: left;
  font-size: 150%;
  font-weight: 700;
  margin-top: 0;
  margin-bottom: 0.5ex;
  padding-top: 0;
  padding-bottom: 0;
}

.article > article.newspaper h3 {
  padding-top: 0;
  margin-top: 0;
  padding-bottom: 0;
  margin-bottom: 0.5ex;
  color: #803030;
  text-align: left;
  font-size: 100%;
  font-variant: normal;
  font-weight: 700;
}

.article .edit {
	width: 0;
	height: 0;
	overflow: hidden;
	position: fixed;
	top: 0;
	left: 0;
}

.article .edit:target {
  position: fixed;
  top: 100px;
  left: 100px;
	width: 800px;
	height: 800px;
  overflow: scroll;
	padding: 1ex 1em;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0;
	text-align: left;
	background-color: #f0f0f0;
	z-index: 1;
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
  border: 2px solid #c0c0c0;
}

div.pendingChangesDialog {
  position: fixed;
  bottom: 25px;
  left: 0;
  background: #ffe5c0dd;
  width: 100%;
  padding: 2ex 2em 2ex 2em;
  color: #a00000;
  z-index: 30;
}
div.pendingChangesDialog input[type="submit"] {
  float:right;
  padding:1ex 1em 1ex 1em;
  background:#c0c0c050;
  margin-left:1em;
  cursor: pointer;
  transform: background 0.2s;
}
div.pendingChangesDialog input[type="submit"]:hover {
  background: #c0c0c0a0;
}