* 						{ box-sizing: border-box; font-size: inherit; line-height: inherit; }

						 /* html height and body min-height values fix white bar at bottom of short-content pages. background: white fixes mix-blend-mode bug in Chrome */
html          { height: 100%; background: white; }
body          { min-height: 100%; margin: 0; padding: 1em; font: 21px/30px 'Computer Modern Typewriter', 'Prestige Elite Std', Courier, 'Courier New', Monaco, monospace; background: #fff; color: #333; }
body, html    { -ms-text-size-adjust: none; -moz-text-size-adjust: none; -o-text-size-adjust: none; -webkit-text-size-adjust: none; }

img           { width:100%; max-width: 100%; }
h1            { font-weight: normal; font-style: italic; }
h2            { font-weight: normal; font-style: normal; }
h3            { font-weight: normal; font-style: italic; }

blockquote    { border-left:0.1em solid #333; margin-left: 0; padding-left:1em; }
blockquote p  { margin: 0 }

a             { text-decoration: none; color: #333; }
a:focus       { outline: 1px dotted; }
a:hover       { color: #00f; }
a:visited     { color: #333; }
a:visited:hover { color: #00f; }

header 				{ margin: 0; }
header h1			{ margin: 0; padding:20px; width:69%; display: inline-block; vertical-align: top; }
header h1 a 	{ text-decoration: underline;}
.only-small		{ display: none; }
.portrait		  { display: none; }

nav 					{ margin:0; padding:20px; width:29%; display: inline-block; vertical-align: top; text-align: right; }
nav ul 				{ list-style: none; margin: 0; padding: 0; }
nav ul li 		{ font-style: italic; list-style-type:none; display: inline-block; margin-left: 0;  }
nav ul li a.current 	{ text-decoration: underline;}

h1.pagetitle	{ margin-bottom: 60px; }

.alert				{ display: block; padding: 1em; background-color: #ffe021; }

.about				{ background-color: #ffe021; }
.notes				{ background-color: #f2acce; }
.goods				{ background-color: #f4f1ef; }
.now				  { background-color: #6ed5ca; }
.resources    { background-color: #f4f1ef; }

						/* cyan: #42c1b6 */
						/* grey: #dad1ca  -- 30%: #f4f1ef */
						/* blue: #6ed5ca */

.about section a,
.now section a,
.colophon section a 		{ text-decoration: underline; }
dt 						{ font-style: normal; }
dd 						{ margin-left: 0}
.more					{ text-decoration: none !important; }

.footnote			{ text-decoration: none !important; }
.michael,
.michael a,
.michael:visited	{ color: blue; }
.leigh,
.leigh a,
.leigh:visited		{ color: red; }
.jon,
.jon a,
.jon:visited		  { color: green; }
.back					{ font-style: italic; text-decoration: none; }

.footnotes 				{ list-style: none; margin-left: 0; padding-left: 0; }
.footnotes li 		{ list-style-type: none; margin-left: 0;  }
.footnotes a			{  }

.notes article			{ margin-bottom: 60px; }
.notes article h1		{ text-transform: uppercase; font-weight: bold; font-style: normal; }
.notes article h1::before		{ content: "* "; }
.notes article h2		{ font-weight: bold; font-style: normal; }
.notes article a.u-url	{ text-decoration: none; }
.notes article img		{ opacity: 0.75; filter: alpha(opacity=75); mix-blend-mode: multiply; }
.dateline				{ margin-top: -21px; }
.perma .dateline		{ margin-top: 0; }
time					  { font-style: italic; }

.pager					{ list-style: none; margin-left:0; padding-left: 0; }
.pager li				{ font-style: italic; list-style-type:none; display: inline-block; margin-left: 0; }
.newer 					{ margin-right: 2em; }

.resources main h1 { color: #f00; }
.resources main h2 { color: #00f; }
.resources main a { text-decoration: underline; }

/*
.shop img 				{ -webkit-filter: grayscale(100%); filter: grayscale(100%); opacity: 0.8; filter: alpha(opacity=80); mix-blend-mode: multiply; border: 2px solid #ccc; }
.shop img:hover 		{ -webkit-filter: none; filter: none; opacity: 1; filter: alpha(opacity=100); mix-blend-mode: normal; border: 2px solid #333; }
*/

article a				{ text-decoration: underline; }
article ul			{ list-style-position: outside; margin-left: 1em; padding-left: 0; }
article dl			{ list-style-position: outside; margin-left: 0; padding-left: 0; }

.embed-container 		{ position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; }
.embed-container iframe,
.embed-container object,
.embed-container embed 	{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

footer 					{ clear: both; margin:20px; }
footer a				{ text-decoration: underline; }
footer ul 			{ list-style: none; margin-left: 0px; padding-left: 0; }
footer ul li 		{ list-style-type:none; margin-left: 0px;  }

/* ---- grid ---- */
.grid 					{ margin: 20px; }

/* clearfix */
.grid:after 		{ content: ''; display: block; clear: both; }

/* ---- grid-item ---- */
.grid-sizer,
.grid-item 				{ width: 30%; }
.gutter-sizer 		{ width: 4%; }
.grid-item 				{ float: left; margin-bottom: 20px; }
.grid-item--width2 		{ width: 64%; }
.grid-item--width3 		{ width: 98%; }

@media only screen and ( min-width: 1212px ) { /* For laptops, desktops, and HDTVs at 1280 px and beyond. */
    .grid-sizer,
    .grid-item 			{ width: 22%; }
    .grid-item 			{ margin-bottom: 60px; }
    .grid-item--width2 	{ width: 48%; }
    .grid-item--width3 	{ width: 74%; }
}

@media only screen and ( max-width: 767px ) and ( min-width: 480px ) { /* For 480 px mobiles, narrow browsers, and landscape iPhones. */

    header h1			{ width: 59%;  }
    nav 				{ width: 39%; text-align: right; }
    .only-small			{ display: block; }
    .long				{ display: none; }
    .grid-sizer,
    .grid-item 			{ width: 48%; margin-bottom: 20px; }
    .grid-item--width2 	{ width: 100%; }
    .grid-item--width3 	{ width: 100%; }
}

@media only screen and ( max-width: 479px ) { /* For iPhones, iPod Touches, and other 320 px mobiles. */
    header h1			{ width: 98%; }
    nav 				{ width: 98%; text-align: left; }
    ul {padding-left:0}
    .only-small			{ display: block; }
    .long				{ display: none; }
    .grid-sizer,
    .grid-item 			{ width: 100%; margin-bottom: 20px;  }
    .grid-item--width2 	{ width: 100%; }
    .grid-item--width3 	{ width: 100%; }
}

/* dark mode
@media (prefers-color-scheme: dark) {
  body          { color: #eee; background-color: #222; }
  a             { color: #eee; }
  a:visited     { color: #eee; }

  .about				{ color: #ffe021; background-color: #221e04; }
  .about a      { color: #ffe021; }
  .notes				{ color: #f2acce; background-color: #20171b; }
  .notes a      { color: #f2acce; }
  .notes main section {  background: #f2acce; mix-blend-mode: normal; }
  .notes main section .paper { background: #222; color:#fff; padding: 20px 0; mix-blend-mode: multiply; }
  .notes main section a { color:#fff; }
  .notes article img		{ mix-blend-mode: screen; opacity:1; filter: invert()}
  .notes blockquote    { border-left:0.1em solid #fff; margin-left: 0; padding-left:1em; }
  .goods				{ color: #f4f1ef; background-color: #212020; }
  .goods a      { color: #f4f1ef; }
  .now				  { color: #6ed5ca; background-color: #0f1c1b; }
  .now a        { color: #6ed5ca; }
}
*/

@media print {
    *,
    *:before,
    *:after,
    *:first-letter,
    *:first-line 		{ background: transparent !important; color: #000 !important; box-shadow: none !important; text-shadow: none !important; }
    body 				{ font-size: 12pt !important; line-height: 18pt; color: #000; }
    pre, blockquote 	{ border: 1px solid #999; page-break-inside: avoid; }
	  h1 					{ margin-top: 0 !important; }
    thead 				{ display: table-header-group; }	/* Printing Tables: http://css-discuss.incutio.com/wiki/Printing_Tables */
    tr, img 			{ page-break-inside: avoid; }
    img 				{ max-width: 100% !important; }
    p, h2, h3 			{ orphans: 3; widows: 3; }
    h2, h3, dt 			{ page-break-after: avoid; }
    header nav			{ display: none; }
    .notes article img	{ opacity: 1; filter: alpha(opacity=100); }
}