* { margin: 0; padding: 0; border: none; text-decoration: inherit; color: inherit; font: inherit; box-sizing: inherit; line-height: inherit; } html { box-sizing: border-box; font-family: sans-serif; font-size: 18px; text-decoration: none; line-height: 1.4; } img { max-width:100%; max-height:100%; height: auto; } .path-list > li { margin-left: 1.2em; font-family: monospace; } .root { display: flex; flex-direction: column; margin: 0.5rem auto; width: 100%; max-width: 50rem; background-color: #efefef; border: 1px solid #666; border-radius: 4px; } .header { flex: 0 0; display: flex; flex-wrap: wrap; align-items: center; border-bottom: 1px solid #666; } .main { padding: 1rem; } .main-logo { flex: 0 0 10rem; margin: 1rem; } .stats { flex: 0 0 20rem; margin: 1rem; } .stat { display: block; } .stat-name { display: inline; font-weight: bold; } .main-section:not(:last-of-type) { margin-bottom: 1rem; } .section-title { font-size: 1.8rem; } .button-list { flex: 0 0; display: flex; flex-wrap: wrap; justify-content: space-around; margin: -1rem; } .button { display: inline-block; border: 1px solid #666; padding: 0.3em 1em; margin: 1rem; } .instance { border: 1px solid #666; border-right-style: none; border-bottom-style: none; background-color: #fff; margin-bottom: 0.5rem; } .instance-title { font-size: 1.2rem; padding: 0.5rem; } .instance-metadata { padding: 0.5rem; } .instance-properties { padding: 0.5rem; } .instance-children { padding: 0.5rem 0 0.5rem 1rem; } .expandable-input { display: none; } .expandable-label > label { cursor: pointer; } .expandable-input ~ .expandable-label .expandable-visualizer { font-family: monospace; display: inline-flex; justify-content: center; align-items: center; align-content: center; width: 1rem; height: 1rem; border: 1px solid #666; margin: 0 0.5rem; } .expandable-visualizer::before { content: ""; } .expandable-input:checked ~ .expandable-label .expandable-visualizer::before { content: "-"; } .expandable-input:not(:checked) ~ .expandable-label .expandable-visualizer::before { content: "+"; } .expandable-input:not(:checked) ~ .expandable-items { display: none; } .imfs-entry { } .imfs-entry-name { position: relative; font-family: monospace; } .imfs-entry-children .imfs-entry-name::before { content: ""; width: 0.6em; height: 1px; background-color: #999; position: absolute; top: 50%; left: -0.8em; } .imfs-entry-note { font-style: italic; } .imfs-entry-children { padding-left: 0.8em; margin-left: 0.2em; border-left: 1px solid #999; }