html { background-color: #e9ecef; }

body { background-color: white; max-width: 860px; margin: auto; padding: 1em; }

body > div, body > p { margin-left: 1em; margin-right: 1em; }

body.data { background-color: inherit; max-width: inherit; padding: 0px; }

input, button { font-size: 1rem; }

blockquote { margin-left: 1em; margin-right: 1em; padding-left: 1em; border-left: solid 3px cyan; }

dd { padding-left: 2em; }

table td, table th { min-width: 8em; }

table.data { border-collapse: collapse; margin-top: 0px; background-color: white; width: 120em; }

table.data caption { background-color: white; text-align: left; padding-left: 2em; }

table.data td, table.data th { border: solid gray 1px; font-size: 62.5%; max-width: 14em; min-width: 3em; text-align: center; }

.container h2 { padding-top: 1rem; border-top: solid 1px yellow; }

hr { border-color: yellow; }

#topAnnounce { display: none; }

#advanced-settings { display: none; }

header#top { position: relative; }

#settings-open-button { position: absolute; right: 8px; top: 8px; }

#myCanvas { border: solid lightgray 1px; }

/* #canvas-container { // default aspect ratio: 4:3 width: 720px; height: 540px; } */
#date { width: 8em; }

#time { width: 6em; }

#rangeHours, #rangeDays { width: 3em; }

#datetime2 { display: inline-block; min-width: 8em; }

#files { display: none; }

#draw-button-container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; }

#save-copy-window-container { min-width: 20em; }
