/*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */
*,::after,::before{box-sizing:border-box}html{-moz-tab-size:4;tab-size:4}html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}hr{height:0;color:inherit}abbr[title]{text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Consolas,'Liberation Mono',Menlo,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}::-moz-focus-inner{border-style:none;padding:0}:-moz-focusring{outline:1px dotted ButtonText}:-moz-ui-invalid{box-shadow:none}legend{padding:0}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}

:root {
 /* https://modernfontstacks.com: Antique but just Georgia */
 --serif: 'Georgia Pro', Georgia, serif;
 /* https://modernfontstacks.com: Neo-Grotesque */
 --sans-serif: Inter, Roboto, 'Helvetica Neue', 'Arial Nova', 'Nimbus Sans', Arial, sans-serif;
}

body {
 min-height: 100vh;
 font-family: var(--serif);
 font-size: 16px;
 line-height: 1.6;

 color: #333;
 margin: 0px;
 margin-bottom: 20px;
 background-image: url(monkey.png);
 background-position: bottom left;
 background-repeat: no-repeat;
 background-attachment: fixed;
 background-color: #eee;
}

h1 {
 font-family: var(--sans-serif);
 font-weight: normal;
 text-align: right;
}

h2 {
 font-family: var(--sans-serif);
 clear: both;
}

h3 {
 font-family: var(--sans-serif);
 margin-top: 0px;
 margin-bottom: 5px;
}

p, blockquote {
 margin: 4px 0px;
 text-indent: 1em;
 line-height: 150%;
}

div {
 clear: both;
}

a img {
 border: none;
}

cite {
 font-style: normal;
}

ins {
 color: #600;
 text-decoration: none;
}
del {
 color: #666;
 text-decoration: line-through;
}

a:link {
 color: #66c;
 background-color: inherit;
}
a:visited {
 color: #c6c;
 background-color: inherit;
}
a:hover {
 text-decoration: underline;
 color: #6c6;
}

a.tag:link, a.tag:visited {
 text-decoration: none;
}
a.tag:hover {
 text-decoration: underline;
}

/* underline items with titles, and display the help cursor */
span[title] {
 border-bottom: 1px dotted #bca;
 border-bottom: 1px dotted rgba(255,255,255,0.4);
 cursor: help;
}

input[type="submit"] {
 cursor: pointer;
}

form {
 margin: 0px;
 padding: 0px;
}

.hide {
 display: none;
}

.error {
 color: #c66;
 background-color: inherit;
}

.left-sidebar-grid {
  display: grid;
  grid-template-areas:
    'header'
    'main-content'
    'left-sidebar'
    'footer';
}

/* general column padding */
.left-sidebar-grid > * {
  padding: 1rem;
}

/* assign columns to grid areas */
.left-sidebar-grid > .header {
  grid-area:header;
}
.left-sidebar-grid > .main-content {
  grid-area:main-content;
}
.left-sidebar-grid > .left-sidebar {
  grid-area:left-sidebar;
}
.left-sidebar-grid > .right-sidebar {
  grid-area:right-sidebar;
}
.left-sidebar-grid > .footer {
  grid-area:footer;
}

/* tablet breakpoint */
@media (min-width:768px) {
  .left-sidebar-grid {
    grid-template-columns: max-content 1fr;
    grid-template-areas:
      'header header'
      'left-sidebar main-content'
      'footer footer';
  }
}

.left-sidebar-grid {
}

.left-sidebar {
 max-height: 100vh;
 text-align: right;
 position: sticky;
 top: 0;
}

.left-sidebar div, .left-sidebar form {
 margin-bottom: 20px;
}

.left-sidebar ul {
 list-style: none;
 margin: 0px;
 padding: 0px;

 margin-bottom: 20px;
}

.left-sidebar a {
 display: block;
 margin-bottom: 0.1em;
 padding-right: 0.5ch;
 text-decoration: none;
 border-bottom: 1px solid #66c;
 font-family: var(--sans-serif);
}

.left-sidebar a:visited {
 border-bottom: 1px solid #c6c;
}

.left-sidebar a:hover {
 color: #6c6;
 border-bottom: 1px solid #6c6;
}

#search {
 padding: 4px;
}

#search fieldset {
 border: none;
 margin: 0px;
 padding: 0px;
}

#search legend {
 display: none;
 font-weight: bold;
}

#search input[type="text"] {
  width: 100%;
}

/* suppress bottom border triggered by title="" attribute */
#blogs a {
 border-bottom: none;
}

.main-content {
 padding-right: 1ch;
 max-width: 80ch;
}

.main-content > div {
 padding: 1em;
 margin-top: 1em;
 border-bottom: 2px solid #bbb;
 margin-bottom: 1em;
}

.main-content > p {
 margin-top: 1em;
}

.main-content > div img {
 float: left;
 padding-right: 1em;
}

.main-content .details {
 text-align: right;
 margin-top: 0.5em;
 margin-right: 1em;
 font-size: smaller;
 font-family: var(--sans-serif);
}

.main-content .details a {
 text-decoration: none;
}

.main-content .details a {
 white-space: nowrap;
}

.main-content blockquote {
 font-family: var(--sans-serif);
 border-left: 2px solid rgba(0,0,0,0.2);
 padding-left: 1em;
}

#links {
 list-style: none;
 text-align: right;
 padding-right: 10px;
 max-width: 80ch;
}
#links li {
 display: inline;
 margin-bottom: 2px;
}

@media print {
  .hide, #sidebar, #comment, #links, .prevnext, .admin {
   display: none;
  }

  .main-content > div img {
   float: left;
   padding-right: 1em;
  }
}