@charset "utf-8";

body{
font-family: Calibri, Helvetica, sans-serif;
background-color: #fff;
margin: 0;
color: #111;
}
@media screen {
@media not all and (min-width: 700px) {
#content{
margin-left: 0;
}
#nav{
width: 40rem;
max-width: 100%;
}
}
}
@media screen and (min-width: 700px) {
#content{
margin-left: 230px;
}
#nav{
position: fixed;
overflow: auto;
top: 0;
bottom: 0;
left: 0;
width: 210px;
}
}
#content {
padding: 10px;
}
#nav{
background-color: #fff;
padding: 10px;
}
#nav ul{
list-style-type: none;
padding: 0;
margin-left: 0px;
}


/* ----- LINKS ----- */

a{
color: #f00;
text-decoration: none;
}
a:hover{
text-decoration: underline;
}
a:active{
color: #f66;
text-decoration: underline;
}

/* ----- CONTENT ----- */

h1{
font-size: 1.5rem;
font-weight: normal;
margin: 0 auto;
padding: 0 0 10px 0;
max-width: 40rem;
}
h1 a{
color: #900;
}
h1 a:active{
color: #f00;
}

.text:first-child > *:first-child {
margin-top: 0;
}
.text{
line-height: 1.5;
text-align: left;
}
.text > * {
padding: 0;
margin: 8px auto;
width: 40rem;
max-width: 100%;
}
.text h2{
margin-top: 20px;
}
.text > ul {
padding-left: 0;
}
.journal > .text{
border: solid 1px #ddd;
padding: 3px 10px;
max-width: 40rem;
margin: 16px auto;
}
.journal > .text > *{
width: auto;
}
.journal > .text.intro{
border: 0;
padding: 0;
width: auto;
margin-top: 0;
}
.journal > .text.intro > *{
max-width: 40rem;
}
.journal > .text.intro:first-child > *:first-child {
margin-top: 0;
}
.journal > .text.intro button{
font: inherit;
background: none;
border: solid 1px #aaa;
border-radius: 0.25em;
box-shadow: #ccc 2px 2px;
margin: 0 0.25em 0.5em 0;
padding: 0.25em 0.75em;
}
.journal > .text.intro button:hover,
.journal > .text.intro button:focus{
background-color: #eee;
}
.journal > .text.intro button:active{
background-color: #ddd;
}
.journal > img{
display: none;
width: auto;
border: 0;
margin: 16px auto;
}
.sketch{
color: #888;
}
.note{
color: #888;
}
.journal *[title]{
border: solid #ddd;
border-width: 0 0 1px 0;
}
.journal .heading{
font-weight: bold;
}
.large{
font-size: x-large;
text-align: center;
}
#gpop-wrapper{
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
display: none;
grid-template-areas: 'single';
align-items: center;
justify-items: center;
z-index: 4;
}
#gpop{
grid-area: single;
border: solid #000;
border-width: 8px;
display: block;
overflow: auto;
/*padding: 0;
margin: 0;
display: none;*/
}
#gtext{
position: fixed;
top: 0;
right: 0;
padding: 4px;
z-index: 6;
display: none;
margin: 0;
background: #000;
color: #fff;
font-weight: bold;
border: solid #f00;
border-width: 0 0 0px 0px;
}
#gtext a{
color: #fff;
}
#gtext a:active{
color: #eee;
}
#recep{
position: fixed;
right: 0;
bottom: 0;
padding: 4px;
background: #000;
z-index: 5;
overflow: auto;
opacity: .7;
color: #fff;
text-align: right;
font-weight: bold;
}

p.notice{
color: #888;
}
p.notice a{
color: #f33;
}

.picture{
line-height: 1.5;
}
.picture img{
display: block;
margin: 0 auto 4px auto;
border: solid 1px #eee;
}
.picture > p{
text-align: center;
max-width: 40rem;
padding: 0;
margin: 4px auto 0 auto;
}
.report .picture {
margin-top: 1rem;
}
.report .picture > p{
margin-bottom: 1rem;
}
.pic-num {
color: #fff;
}

#reporttitle{
border: solid #ddd;
border-width: 1px 0;
padding: 7px 0;
margin: 7px auto;
}
#reporttitle h2, #reporttitle p{
padding: 0;
margin: 0;
}
#reporttitle h3{
font-size: small;
padding: 0 0 8px 0;
margin: 0;
}
#content h2{
font-size: large;
}

/* ----- NAV ----- */

#nav ul, #nav li, h2, h3, #nav p, #nav form, #nav input{
margin: 0;
}
#nav ul{
list-style-type: none;
padding: 0;
margin-left: 0px;
}
a.primary{
font-size: medium;
}
#nav ul ul{
border: solid #ccc;
border-width: 0 0 0 1px;
}
#nav ul ul li{
padding: 0 0 0 4px;
}
#nav a{
text-decoration: none;
color: inherit;
}
#nav a:hover{
text-decoration: underline;
}
#nav a:active, #nav a.here{
color: #f00;
}
#nav a.here:active{
color: #f66;
}
h2, h3{
padding: 0;
font-size: medium;
}
h3{
font-weight: normal;
}
#nav p#notice{
padding: 0 0 5px 0;
font-size: small;
}
#nav p{
padding: 0;
}
#nav p a{
font-weight: bold;
}
#nav form{
display: block;
padding: 10px 0;
}
#nav input{
border: solid 1px #bbb;
font: inherit;
padding: 2px;
background: none;
}
#nav input[type="submit"]{
margin-left: 5px;
height: 19px;
width: 19px;
border: 0;
font-weight: bold;
}
#nav input[type="submit"]:active{
color: #f66;
}
.section{
font-weight: bold;
}

/* ----- TABLE FOR GALLERY & INDEX ----- */

table{
border: solid 1px #ddd;
margin: 8px;
padding: 4px;
}
td:first-child{
text-align: right;
}
caption{
text-align: left;
font-size: medium;
font-weight: bold;
padding-top: 5px;
margin: 0 auto;
}
table:first-child caption{
padding-top: 0;
}
td a{
font-weight: bold;
}

table#index{
margin: 0 auto;
padding: 0;
border-collapse: collapse;
border: 0;
}
table#index td:first-child{
text-align: left;
width: 192px;
font-size: large;
font-weight: bold;
}
table#index td{
padding: 8px 0;
vertical-align: top;
}

/* ----- MISC ----- */

img{
border: 0;
}