/* Starting Over */

@font-face {
	font-family: 'Desiderata';
	src: url('fonts/Desiderata-Regular.eot');
	src: url('fonts/Desiderata-Regular.eot?#iefix') format('embedded-opentype'),
	     url('fonts/Desiderata-Regular.woff') format('woff'),
	     url('fonts/Desiderata-Regular.woff2') format('woff2');
}

:root {
    --so-background-color: var(--tufte-background-color);
    --so-color: var(--tufte-color);
    --so-underline-color: #555;
    --so-title-family: "Desiderata", sans-serif;
    --tufte-width: 1600px;
}

/* ====================================================================== */
/* Cribbed from https://www.gwern.net/Sidenotes */

a {
    text-decoration: none;
    background-image: linear-gradient(var(--so-underline-color),
                                      var(--so-underline-color));
    background-size: 1px 1px;
    background-repeat: repeat-x;
    background-position: 0% calc(100% - 0.1em);
    font-variant-numeric: lining-nums;
}

a[data-link-icon-type*='text']::after {
    --link-icon-size: 0.75em;
    --link-icon-offset-x: 0.125em;
    --link-icon-offset-y: 0.30em;

    content: "\2060" attr(data-link-icon);
    font-size: var(--link-icon-size);
    font-weight: 300;
    font-style: normal;
    margin: 0 0 0 var(--link-icon-offset-x);
    vertical-align: baseline;
    position: relative;
    bottom: var(--link-icon-offset-y);
    opacity: 0.83;
    padding: 0;
    background-image: none;
    background-size: unset;
    line-height: 1;
    overflow-wrap: normal;
    text-decoration: none;
}

/* ====================================================================== */

html,
body {
    height:100%;
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
}

h1, h2, h3, h4, h5 {
    font-family: var(--so-title-family);
}

.homepage h1 {
    font-size: 6rem;
    margin-top: 0;
}

.h3 {
    font-family: var(--so-title-family);
    font-size: 120%;
}

h4 { font-weight: 400;
     font-size: 1.5rem;
     margin-top: 2rem;
     margin-bottom: 0;
     line-height: 1;
}

.weblog-title {
    height: 75px;
    display: table;
    text-align: center;
    font-family: var(--so-title-family);
    font-size: 3rem;
}

.weblog-title span {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}

.navicons {
    text-align: right;
    width: 55%;
    height: 0;
}

.navicon {
    display: inline-block;
    text-align: center;
    valign: baseline;
    width: 1.25rem;
    color: #abc3c4;
    padding-top: 4px;
}

.navicon a,
.navicon a:visited,
.navicon a:link {
   text-decoration: none;
   background: inherit;
   color: inherit;
}

ul.nav {
    padding-left: 0;
    font-size: 1rem;
}

ul.nav li {
    display: inline-block;
}

ul.nav li:after {
    content: " / ";
    display: inline-block;
}

ul.nav li:last-child:after {
    content: "";
    display: inline-block;
}

/* ============================================================ */

ul.essay-sidebar li {
    padding-top: 0;
    padding-bottom: 0;
}

ul.essay-sidebar li a {
    text-decoration: underline;
}

ul.essay-replaces {
    list-style-type: "☞ ";
}

ul.essay-refersto {
    list-style-type: "☞ ";
}

ul.essay-thread {
    list-style-type: "☞ ";
}

ul.essay-thread li.intro {
    /* spool of thread */
    list-style-type: "\1f9f5";
}

ul.essay-thread li.tprev {
    list-style-type: "←";
}

ul.essay-thread li.tnext {
    list-style-type: "→";
}

/* ============================================================ */

#_page {
    min-height:100%;
    position:relative;
}

#_header {
}

#_header header {
    width: 55%;
    border-bottom-width: 6px;
    border-bottom-style: solid;
    border-color: #076d6d;
    padding-top: 0.25rem;
}

.byline {
    display: none;
}

#_body {
    padding-bottom: 8rem;
}

#_footer {
    bottom:0;
    height:8rem;
    left:0;
    position:absolute;
    width:100%;
    padding-bottom: 1em;
}

#_footer footer {
    margin-top: 2rem;
}

#_footer .pagefooter {
    margin-top: 0.25rem;
    border-top-width: 3px;
    border-top-style: solid;
    border-color: black;
}

article > * {
    width: 55%;
}

article div p {
    width: 100%;
}

article blockquote p {
    width: 84%;
}

article header {
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-color: black;
}

article header p {
    width: 100%;
}

.abstract {
    font-style: italic;
}

.abstract em {
    font-style: normal;
}

video {
    border: 2px solid #AAAAAA;
    border-radius: 20px;
    display: block;
    margin: 0 auto;
}

.image img {
    border: 2px solid #AAAAAA;
    border-radius: 20px;
    display: block;
    margin: 0 auto;
}

.image .caption {
    text-align: center;
    font-size: 1.2rem;
    font-style: italic;
}

img.sologotext {
    width: 400px;
}

img.sologo {
    width: 64px;
}

img.homesmall {
    display: none;
}

.mphoto {
    /* border: 4px solid #569c9c; */
    border: 1px solid white;
    border-radius: 20px;
}

.photo-credit {
    color: #AAAAAA;
    text-align: right;
    padding-left: 1.25rem;
}

header a,
header a:visited,
header a:link {
   text-decoration: none;
   background: inherit;
   color: inherit;
}

header .repl a,
header .repl a:visited,
header .repl a:link {
    text-decoration: underline;
}

header .repl::before {
    content: "👉 ";
}

/* https://css-tricks.com/snippets/css/prevent-superscripts-and-subscripts-from-affecting-line-height/ */
sup, sub {
  vertical-align: baseline;
  position: relative;
  top: -0.4em;
}
sub {
  top: 0.4em;
}

.strike {
    text-decoration: line-through;
}

.footnotes ul {
    font-size: 1rem;
    list-style-type: none;
    padding-left: 0;
}

.footnotes hr {
    text-align: left;
    margin-left: 0;
    width: 1.5in;
}

.footnote {
    font-size: 80%;
}

.footnote a,
.footnote a:visited,
.footnote a:link {
   text-decoration: none;
   background: none;
   color: black;
}

.essay-list {
    font-size: 1.4rem;
}

.essay-list .subject a,
.essay-list .subject a:visited,
.essay-list .subject a:link {
   text-decoration: none;
   background: none;
   color: black;
}

.essay-list .essay-list {
    margin: 0;
}

.essay-list .psubjects {
    font-size: 1rem;
    padding-top: 0.25rem;
    margin-left: 2rem;
}

.essay-list p {
    width: 100%;
    margin-left: 2rem;
}

.essay-list .pubdate {
    font-size: 1rem;
}

.essay-list .moddate {
    font-size: 1rem;
}

.essay-list dd {
    margin-left: 1em;
}

.days .day::before {
    content: " ❦ "
}

.days .day:first-child::before {
    content: ""
}

.essay-list .essay-list {
    padding-left: 1em;
}

.year-list {
    padding-top: 1rem;
    font-size: 1.4rem;
}

.recent-posts {
    padding-top: 1rem;
    padding-left: 2rem;
}

.recent-posts p {
    margin-top: 0.5rem;
    font-style: italic;
}

.recent-posts p + p {
    margin-top: 0;
}

.recent-posts em {
    font-style: normal;
}

.recent-posts .title {
    font-size: 120%;
}

a.title,
a.title:visited,
a.title:link {
    color: #076d6d;
}

.coverage-list .coverage-list {
    margin: 0;
}

.coverage-list dd {
    margin-left: 1em;
}

.coverage-list .coverage-list {
    padding-left: 1em;
}

.cc-by-sa
.cc-by-sa:visited,
.cc-by-sa:link {
   text-decoration: none;
   background: inherit;
   color: inherit;
}

.cc-by-sa img {
    height: 16px;
    width: 44px;
    vertical-align: text-top;
    text-align: right;
}

.itinerary {
    padding-bottom: 1rem;
}

.itinerary-list li.cancelled {
    text-decoration: line-through;
}

.itinerary-list li.canceled {
    text-decoration: line-through;
}

div.seealso ul.seealso {
   margin-top: 0;
   font-size: medium;
}

div.seealso ul.seealso li {
   padding: 0;
}

ul li p {
    width: 100%;
}

form p {
    width: 100%;
}

.flightmap {
   width: 640px;
   height: 480px;
   background-color: #aaaaaa;
   margin-top: 1em;
}

.plotmap {
   display: none;
}

abbr.tz {
  font-variant: small-caps;
  font-size: 9pt;
}

table.itinerary td.dtstart {
   text-align: right;
}

table.itinerary td.dtend {
   text-align: left;
}

table.itinerary td.duration {
   text-align: right;
}

td.ontheroad {
    /* background-color: #AAA; restore after fixing the col width bug */
    font-weight: bold;
    text-decoration: underline;
}

.notgoing {
    text-decoration: line-through;
}

.footnotes p {
    font-size: 0.8rem;
}

.epigraph:before,
blockquote:before {
    color: #076d6d;
    opacity: 0.5;
    content: "“";
    display: block;
    height: 0;
    margin-left: -0.6em;
    font: italic 600%/1 Cochin,Georgia,"Times New Roman", serif;
}

.epigraph,
blockquote {
    margin-left: 6rem;
}

.epigraph p,
blockquote p {
    margin-bottom: 0;
    padding-bottom: 0;
}

.hidden {
    display: none;
}

.editlink {
    padding-left: 3rem;
}

.nowrap {
    white-space: nowrap;
}

pre, .codeblock {
    margin-left: 2rem;
    background-color: #DDDDDD;
    padding: 0.5rem;
    border-radius: 4px;
    width: calc(100% - 2rem);
}

.search-results dd p {
    font-size: 80%;
    line-height: 1.6rem;
}

.micropost {
    margin-top: 1rem;
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.3rem;
    font-size: 1.4rem;
    border: 1px solid #076d6d;
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 8px 8px 4px #aaaaaa;
}

.ignore {
    background: repeating-linear-gradient(
        -45deg,
        #fffff8,
        #fffff8 15px,
        #ffcccc 10px,
        #ffcccc 20px
    );
}

.microdate {
    font-size: 1rem;
    color:  #AAAAAA;
    padding-left: 1rem;
    float: right;
}

.microdate a,
.microdate a:visited,
.microdate a:link {
   text-decoration: none;
   background: inherit;
   color: inherit;
}

.micropost img {
    max-width: 100px;
    border-radius: 10px;
    margin-left: 0.5rem;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

.micropost .image {
    float: right;
    clear: right;
}

.micropost p {
}

.micromore {
    margin-top: 0.5rem;
    font-size: 1.4rem;
}

aside {
    border: solid 2px #ebe4e0;
    padding: 1;
    border-radius: 1em;
    background-clip: padding-box;
    background-image: linear-gradient(#ebe4e0 0px, #fffff8 36px);
}

aside header {
    padding-left: 0.5em;
    font-size: 16pt;
    border-bottom-width 0;
    border-bottom-style: none;
}

aside div {
    padding-left: 1em;
    padding-right: 1em;
}

/* ====================================================================== */
/* Comments */

#_commentform {
    display: none;
}

.comment-form p {
    margin-top: 0.25rem;
    margin-bottom: 0.25rem;
}

.comment-form {
    border: 4px solid #AAAAAA;
    border-radius: 5px;
    width: 55%;
    padding: 5px;
    margin-top: 1rem;
}

.comment-form textarea {
    width: 100%;
}

.comment-form .label {
    display: inline-block;
    width: 6em;
}

form.moderate {
    margin-bottom: 0;
}

.comments {
   border-top-width: 1px;
   border-top-style: dashed;
   border-color: black;
   border-left-width: 1px;
   border-left-style: dashed;
   border-color: black;
   padding-left: 0.5rem;
   width: calc(55% - 2rem);
}

.comments h2 {
   font-size: 1.5rem;
   margin-top: 0.5rem;
}

.comment {
   border-bottom-width: 1px;
   border-bottom-style: dotted;
   border-color: black;
   padding-bottom: 1rem;
}

.comments .staging {
    background: linear-gradient(0deg, #FFFFFF, #FFAAAA);
}

.comment p {
   margin-bottom: 0.5rem;
   width: 100%;
   line-height: 1.4rem;
}

.comment footer {
   width: 100%;
   text-align: right;
}

#_addcomment div {
    text-align: right;
}

.badmath {
    color: red;
    font-style: italic;
}

.spacewarn {
    color: red;
    font-style: italic;
}

.temporally .curtitle {
    color: #9f9f9f;
}

.login-banner {
    padding-top: 1em;
    padding-right: 1em;
    margin-left: 60%;
}

/* ====================================================================== */
/* Table hacks */

table td,
table th {
   vertical-align: top;
}

table.calendar {
   margin-right: 1rem;
}

table {
   width: inherit;
}

form table {
    width: 55%;
}

.imginfopopup img {
    border: 1px solid #7a7a7a;
    border-radius: 6px;
    margin-bottom: 0.5rem;
}

.imginfopopup .title {
    font-weight: bold;
}

.imginfopopup a,
.imginfopopup a:visited,
.imginfopopup a:link {
   text-decoration: none;
   background: inherit;
   color: inherit;
}

a.plain,
a.plain:visited,
a.plain:link {
   text-decoration: none;
   background: inherit;
   color: inherit;
}

.webmentions {
    width: 55%;
}

.webmentions h2 {
    font-size: 1.5rem;
    text-decoration: underline;
    padding-bottom: 1rem;
}

.webmentions ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

.webmentions li.unmoderated {
    background: repeating-linear-gradient(
        135deg,
        transparent,
        transparent 10px,
        #ffaaaa 10px,
        #ffaaaa 20px
    )
}

.webmentions li.comment {
  padding: 0;
  margin: 0;
  margin-left: 54px;
  margin-bottom: 16px;
  line-height: 1.1em;
  word-wrap: break-word; /* allow long URLs to wrap */
  border-bottom: none;
}

.webmentions li.comment .author {
  margin-bottom: 6px;
  font-size: 90%;
  /* chrome doesn't render emoji when the font is bold :( */
  /* font-weight: bold; */
}

.webmentions li.comment .author img {
  margin-left: -54px;
  float: left;
  border-radius: 4px;
}

.webmentions li.comment a {
  background-size: 0;
  background-repeat: no-repeat;
}
.webmentions li.comment a:hover {
    background-size: 0.05em 1px, 0.05em 1px, 1px 1px;
    background-repeat: no-repeat, no-repeat, repeat-x;
}
.webmentions li.comment a.author_url {
  color: #888;
  font-weight: normal;
}

.webmentions li.comment .e-content .p-name {
    font-weight: bold;
}

.webmentions li.comment .e-content .comment-content {
    font-style: italic;
}

.webmentions li.comment .comment-content img {
  max-width: 100%;
}

.webmentions li.comment .metaline {
  padding-top: 2px;
  font-size: 90%;
}

.webmentions .metaline a {
  color: #777;
  text-decoration: none;
}

table.fullarchive {
    width: 100%;
    table-layout: fixed;
    font-size: 120%;
}

table.fullarchive td,
table.fullarchive th {
    border: 1px solid #abc3c4;
}

table.fullarchive thead td {
    padding-bottom: 0.5rem;
}

table.fullarchive thead tr td,
table.fullarchive tbody tr td:first-child {
    font-family: var(--so-title-family);
}

table.fullarchive tbody tr td:first-child {
    font-size: 120%;
}

table.fullarchive td {
    text-align: center;
}

.hashtags {
    text-align: center;
    font-family: var(--so-title-family);
    font-weight: 400;
    font-size: 110%;
}

.hashtag {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

/* ====================================================================== */
/* multi-links */

multi-link::part(dropdown) {
    font-size: 90%;
}

multi-link::part(header) {
    background-color: rgb(47, 107, 108);
    color: white;
}

multi-link::part(link) {
    padding-left: 0.5em;
    padding-right: 0.5em;
    padding-top: 0.25em;
    padding-bottom: 0.25em;
    font: sans-serif;
}

multi-link::part(link):hover {
    background-color: rgba(47, 107, 108, 0.25);
}

/* ====================================================================== */
/* Media for narrow screens */


table.legs tr td {
    white-space: nowrap;
}

table tr.weather {
    font-size: 80%;
    color: #737373;
}

#login {
    display: none;
    position: absolute;
    top: 1rem;
    right: 4rem;
}

@media (max-width: 1025px) {
    table tr td span.distance {
        display: none;
    }

    table tr td.duration {
        display: none;
    }

    table tr.weather {
        display: none;
    }

    span.wulabel {
        display: none;
    }

    .essay-list dd .day {
        display: block;
        padding-bottom: 0.5em;
    }

    .days .day::before {
        content: ""
    }
}

@media (max-width: 760px) {
    .webmentions {
        width: 100%;
    }
    .comments {
        width: 100%;
    }
    .comment-form {
        width: 100%;
    }
    .footnotes {
        width: 100%;
    }
    #_header header {
        width: 100%;
    }
    .navicons {
        width: 100%;
    }
    article > * {
        width: 100%;
    }
    label.homelogo {
        display: none !important;
    }
    img.homesmall {
        display: inline;
    }

    table tr td.dtsep,
    table tr td.dtend {
        display: none;
    }

    .flightmap {
        width: 100%;
        height: 480px;
    }

    .essay-list dd .day {
        display: block;
        padding-bottom: 0.5em;
    }

    .days .day::before {
        content: ""
    }
}

@media screen and (max-width: 601px) {
    h1 {
        font-size: 2.4rem;
    }

    table.calendars {
        display: none;
    }

    .flightmap {
        width: 100%px;
        height: 400px;
    }

    .essay-list dd .day {
        display: block;
        padding-bottom: 0.5em;
    }

    .days .day::before {
        content: ""
    }
}

@media screen and (max-width: 410px) {
    .itinerarymap-wrapper {
        display: none;
    }

    .essay-list dd .day {
        display: block;
        padding-bottom: 0.5em;
    }

    .days .day::before {
        content: ""
    }
}

@media screen and (max-width: 321px) {
    h1 {
        font-size: 1.8rem;
    }

    .flightmap {
        width: 100%px;
        height: 200px;
    }


    .essay-list dd .day {
        display: block;
        padding-bottom: 0.5em;
    }

    .days .day::before {
        content: ""
    }
}