body {background-color: black; color: #FFF; font-family: Arial, Helvetica, sans-serif; padding:0; margin:0;}
.head    {font-size:32pt; margin: 4px; color:#FFF; display: inline-block; text-shadow: 1px 1px #888;}
.subhead {font-size:11pt; font-weight:bold; margin: 4px; color:#8AF; display: inline-block;}
.popup {position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: #000000A0; display: none; z-index: 5; opacity: 1; transition: opacity 5s ease-out;}
.popup_inner {border: 2px solid #FFF; background-color: #003; border-radius: 10px; margin: 0; padding: 7px;
             display: inline-block; margin: 0; position: relative; top: 50%; left: 50%; max-width:50vw;
             -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
.main {padding:5px; position: relative;}
.main_panel {position: absolute;}
.row {display: flex;}
.col {flex: 50%;}
.col25 {flex: 25%;}
.col33 {flex: 33%;}
.col67 {flex: 67%;}
.about {padding:4px; color: #DDD;}
.hidden {display: none;}
.percent::after {content: '%';}
.main_frame {border: 1px solid #777; margin: 5px; padding:0px;}
.main_frame legend {color: #8AF; font-weight:bold; font-size:12pt; margin-left: 7px;}
.sub_frame {border: 1px solid #80A0F0AA; border-left: 0; border-right: 0; border-bottom: 0;
            border-radius: 0px; margin: 5px; padding: 5px 0px;}
.sub_frame legend {color: #FFF; font-weight:bold; font-size:10pt; margin-left: 7px;}
.drop_parent  {position: relative; display: inline-block; height: fit-content; height:100%;}
.drop_parent button {margin: 5px 5px 5px 5px; padding: 7px; box-sizing: content-box; display:inline-block;align-content:center;
                     text-align: center; height: 32px;}
.drop_div {display: none; position: absolute; top: 80%; right: 0%; z-index: 100;
           background-color: #444; border: 0; padding: 10px; min-width: 180px;
           border: 1px solid #000;}
select, input, button, textarea {background-color: #444; color: #FFF; border-radius: 0px; border: 1px solid #888; max-width: 48vw;}
a {color: #CCF; text-decoration: none;}
a:hover {color: #99F;}
a.page {color: #FFF; font-size:14pt; background-color: #555; border: 1px solid #888; border-radius: 5px; margin: 20px 5px; padding: 5px;}
a.page:hover {opacity: 0.5;}
.help {display: inline-block; align-content:center;
       text-align: center; color: #8AF;
       border: 1px solid #777; background-color: #333;
       border-radius: 0px; margin: 5px 5px 5px 5px; padding: 7px;}
.help:hover {background-color: #500; color: #FFF;}
.action {font-size:10pt; text-align: center; display: inline-block; color: #FFF; border: 1px solid #777; background-color: #333; border-radius: 0px; margin: 1px 2px; padding: 1px 4px;}
.action:hover {background-color: #500; color: #FFF;}
.js-plotly-plot .plotly .modebar{left: 10%}
fieldset {font-size:11pt; padding-top:0px;}
.grey {color:#888; margin: 5px 0px;}
.blue {color:#8AF;}
.error {color:#FF0; margin: 5px 0px;}
.logo {height: 50px; vertical-align: middle;}
.attrib_col {font-weight: bold;}
.tabulator .tabulator-footer {border-top: 3px solid #52669A;}
.tabulator .tabulator-header {border-bottom: 3px solid #52669A;}
.tabulator-row.tabulator-selectable:hover {background-color: #273149; }
.tabulator-row.tabulator-selected {background-color: #52669A;}
.tabulator-row.tabulator-selected:hover {background-color: #41527A; }
.tabulator-row.tabulator-group {border-right-color: #393838; border-top: 1px solid #000;border-bottom: 2px solid #52669A;  background: #222; color: #fff; }
.tabulator-row.tabulator-group:hover {background-color: #273149;}
.tabulator-row.tabulator-group span {color: #3FB449;}
.tabulator-row.tabulator-range-highlight .tabulator-cell.tabulator-range-row-header {background-color: #52669A;color: #fff; }
.tabulator-row.tabulator-range-highlight .tabulator-cell.tabulator-range-row-header.tabulator-range-selected {background-color: #41527A; color: #fff; }
.tabulator-row.tabulator-range-highlight.tabulator-range-selected .tabulator-cell.tabulator-range-row-header {background-color: #52669A; color: #fff; }


#div_plot{width: fit-content; height: fit-content;}