/* General */

#in, #stk {font-family: "Victor Mono", monospace; white-space: pre;}
pre {font-family: "Victor Mono", monospace;}
#top, h1, h2, h3 {font-family: "Jost", sans-serif;}
p, table, .table tr, .table th, .table td, ul, li, ol {font-family: "EB Garamond", serif;}

/* Screen */
@media screen {
body {padding: 10px;}
h1  {font-size: 18pt; margin-top:0px;}
h2 {font-size: 16pt; margin-top:0px;}
h3 {font-size: 12pt; margin-top:0px;}
p {font-size: 12pt; margin-top:0px;}
ul, li, ol {font-size: 12pt; margin-top:0px;}
table, .table tr, .table th, .table td {font-size: 11pt;}
#top {font-size: 11pt; overflow: auto;}
table {border-spacing: 10px 0px;}
#in {font-size: 9pt; padding: 10px; border: 1px solid dimgray; border-radius: 3px; resize: none; overflow: auto;}
#stk {font-size: 9pt; padding: 10px; border: 1px solid dimgray; border-radius: 3px; overflow: auto;}
#out {font-size: 9pt; padding: 10px; border: 1px solid dimgray; border-radius: 3px; overflow: auto;}
pre {font-size: 9pt; margin-left: 10px;}
body {background-color: #f2f2f2;}
#in {background-color: white; color: black;}
#stk {background-color: white; color: black;}
#out {background-color: white; color: black;}
}

/* Screen_Landscape */
@media screen and (orientation: landscape) {
#top {width: calc(50dvw - 75px); height: 25px;}
#in {width: calc(50dvw - 75px); height: calc(100dvh - 174px); margin: 10px 0px 15px 0px;}
#stk {width: calc(50dvw - 75px); height: 30pt; margin: 0px 0px 0px 0px;}
#out {position: fixed; top: 20px; right: 20px; width: calc(50dvw - 30px); height: calc(100dvh - 60px); }
}

/* Screen_Portrait */
@media screen and (orientation: portrait) {
#top {height: 25px;}
#in {width: calc(100dvw - 60px); height: calc(50dvh - 140px); margin: 10px 0px 0px 0px;}
#stk {width: calc(100dvw - 60px); height: 25pt; margin: 20px 0px 20px 0px;}
#out {width: calc(100dvw - 60px); height: calc(50dvh - 80px); margin-top: 20px;}
}

/* Print */
@media print {
#in, #stk, #top {display: none;}
h1  {font-size: 18pt; margin-top:0px;}
h2 {font-size: 16pt; margin-top:0px;}
h3 {font-size: 12pt; margin-top:0px;}
p, ul, li, ol {font-size: 12pt; margin-top:0px;}
table, .table tr, .table th, .table td {font-size: 11pt;}
table {border-spacing: 10pt 0px;}
pre {font-size: 9pt; margin-left: 10pt; margin-top:0px;}
}