html {
    scrollbar-gutter: stable both-edges;
}

@supports not (scrollbar-gutter: stable both-edges) {
    html {
        overflow-y: scroll;
    }
}

body {
background-color: #121212;
color: #e0e0e0;
font-family: "Helvetica Neue", Helvetica, sans-serif;
font-size: 16pt;
max-width: min(80ch, 95vw);
margin: auto;
}

h1, h2, h3, h4, h5, h6 {
    text-align: center;
}

h1 { font-size: 2rem; }
h2 { font-size: 1.75rem; }
h3 { font-size: 1.5rem; }
h4 { font-size: 1.25rem; }
h5 { font-size: 1.125rem; }
h6 { font-size: 1rem; }

p.last-updated {
    font-size: .95rem;
    line-height: 1.5;
}

div.box {
    border: 1px solid #a9a9b3;
    border-radius: 5px;
    padding: 1rem;
    margin-bottom: 1rem;
}
.caption {
    font-size: 80%;
}
li {
  margin: 1.2rem;
  font-size: 1em;
  text-align: center;
}
a {
    overflow-wrap: break-word;
}
a:link {
	color: #90caf9;
    text-decoration: none;
}
a:visited {
	color: #ce93d8;
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}
a.novisit:visited {
	color: #90caf9;
}
div.widthlimit {
    word-wrap: break-word;
    max-width: 95%;
    padding: 0;
}
div.widthcenter {
    word-wrap: break-word;
    max-width: 95%;
    text-align: center;
    padding: 0;
}
p {
    font-size: 1em;
    text-align: center;
    padding: 0;
}
p.right {
    text-align: right;
    font-size: 1em;
    padding: 0;
}
ul {
    list-style-position: inside;
    text-align: center;
    padding: 0;
}

.art{
	display: none ;
}

input {
    display: block;
    margin: auto;
}
img {
	max-width: 90% ;
	max-height: 400px ;
	margin: auto ;
	display: block ;
}
figcaption {
    padding: 4px;
}

ul.nopoint {
    list-style-type: none;
}
sup {
    font-size: 0.9rem;
}

.site-masthead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem 1.5rem;
    padding: 1.25rem 0 1rem;
    margin-bottom: 2rem;
    border-bottom: 1px solid #373737;
    line-height: 1.2;
}

.site-masthead .site-home {
    color: inherit;
    font-size: 1.25rem;
    font-weight: bold;
    text-decoration: none;
    white-space: nowrap;
}

.site-masthead .site-home:hover {
    text-decoration: underline;
}

.site-motto {
    margin-top: 1.25rem;
    color: #c4c4c4;
    font-size: 0.9rem;
    font-style: italic;
    line-height: 1.5;
    text-align: right;
}

.site-masthead .site-motto {
    margin: 0;
}

@media (max-width: 36rem) {
    .site-masthead {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .site-masthead .site-motto {
        text-align: left;
    }
}

@media (pointer: coarse) {
    .site-masthead .site-home {
        display: inline-flex;
        align-items: center;
        min-height: 2.75rem;
    }

    .site-motto {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        min-height: 2.75rem;
    }
}

.site-parent {
    margin-top: -0.5rem;
    margin-bottom: 1.5rem;
    font-size: 1rem;
    line-height: 1.5;
    text-align: left;
}

:root {
    color-scheme: light;
    --page-bg: #ffffff;
    --surface: #ffffff;
    --text: #121212;
    --muted: #666666;
    --heading: #121212;
    --link: #a33214;
    --link-hover: #74220d;
    --visited: #783c2a;
    --border: #d9d9d9;
    --control-border: #8a8a8a;
    --focus: #a33214;
    --selection: #e4e4e4;
    --highlight: #ebebeb;
    --button-bg: #f3f3f3;
    --button-hover-bg: #e9e9e9;
}

html,
body {
    background-color: var(--page-bg);
    color: var(--text);
}

h1, h2, h3, h4, h5, h6 {
    color: var(--heading);
}

a:link,
a.novisit:visited {
    color: var(--link);
}

a:visited {
    color: var(--visited);
}

a:hover,
a.novisit:hover {
    color: var(--link-hover);
}

h1 a:link,
h1 a:visited {
    color: inherit;
}

a.external-link:link,
a.external-link:visited {
    color: #245b78;
}

a.external-link:hover {
    color: #163d52;
}

a:focus-visible {
    outline: 2px solid var(--focus);
    outline-offset: 3px;
    border-radius: 2px;
}

div.box {
    background-color: #f7f7f7;
    border: 2px solid #8a8a8a;
}

.site-masthead {
    border-bottom-color: var(--border);
}

.site-motto,
.caption,
p.last-updated {
    color: var(--muted);
}

hr {
    border: 0;
    border-top: 1px solid var(--border);
}

::selection {
    background-color: var(--selection);
    color: var(--text);
}

li.work-entry {
    list-style: none;
    margin: 0;
    padding: 1rem .75rem;
    line-height: 1.5;
}

li.work-entry + li.work-entry {
    border-top: 1px solid #b3b3b3;
}