.AnimControl{--font-family-narrow: Antonio, Antonio-fallback, sans-serif;--image-cbar: url(https://ifis.iowafloodcenter.org/hlm-plus/img/scale.png);--grid-size: 2.2em;--grid-gap: 3.5px;--grid-border: 2px;--day-inactive: #EEE;--day-active: #C8DCF0;--day-selected: #76AE00}.AnimControl{font-size:13px;font-family:Roboto,Arial,Helvetica,sans-serif;z-index:30;position:absolute;display:inline-block;bottom:1.2em;margin:0;right:1px;width:min-content;height:fit-content;padding:.5em;outline:1px solid #c0c0c0;background:#fff}.AnimControl .hidden{display:none!important}.AnimControl .grid-group{display:grid;justify-content:space-around;grid-template-columns:min-content min-content;width:100%}.AnimControl .ctrl-butt-cnt{display:inline-flex;font-size:.9em;align-items:center;opacity:.7;grid-area:2 / 2 / 2 / 2;margin-top:.35em}.AnimControl .ctrl-butt-cnt:hover svg{opacity:1}.AnimControl .ctrl-butt-cnt div{width:7.5ch;height:1.25em;padding:.35em .2em;color:#fff;background:#960000;border-right:1px solid white;display:flex;justify-content:center;align-items:center;cursor:pointer}.AnimControl .ctrl-butt-cnt svg{width:2em;aspect-ratio:1;fill:#fff}.AnimControl .time-view{display:inline-flex;width:min-content;margin:auto}.AnimControl .label-name{font-family:var(--font-family-narrow);font-size:12px;width:min-content;transform:rotate(180deg);writing-mode:vertical-lr;text-orientation:mixed;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;grid-row:1 / span 2;max-height:30ch}.AnimControl .cbar-toggler{background-image:var(--image-cbar);background-position:center;background-repeat:no-repeat;background-size:100%;height:1.5em;width:1.5em;outline:1px solid #000;cursor:pointer;padding:0;margin-right:1em}.AnimControl .timedisplay{width:-moz-available;width:-webkit-fill-available;width:stretch;border:0 solid #000;margin-left:5px;float:none;display:grid;justify-content:center;justify-items:center;grid-template-columns:1fr}.AnimControl .timedisplay.clock{grid-template-columns:1fr 1fr}.AnimControl .timedisplay.digital{grid-template-columns:1fr}.AnimControl canvas{float:left;width:90px;height:auto;background:#fff;margin:.3em 0 0}.AnimControl .time-labels{float:left;border:none}.AnimControl .timedisplay.clock .time-labels{display:flex;flex-direction:column;justify-content:center;align-items:center}.AnimControl .timedisplay .lbl-time{text-align:center;font-family:var(--font-family-narrow);font-size:4em;line-height:1;margin-top:.25em}.AnimControl .timedisplay.clock .lbl-time{font-size:2.5em;display:flex;flex-direction:row;align-items:flex-end}.AnimControl .timedisplay .am-pm{float:right;display:inline;font-size:.4em;height:.8em;line-height:.4em;text-transform:lowercase}.AnimControl .timedisplay .lbl-wday{font-size:2em;text-align:center;border:0 solid #000}.AnimControl .timedisplay.clock .lbl-wday{font-size:1.1em;text-align:center;border:0 solid #000;margin-top:.2em}.AnimControl .timedisplay.clock>.lbl-date{grid-column:span 2}.AnimControl .ns{-webkit-touch-callout:none!important;-webkit-user-select:none!important;-khtml-user-select:none!important;-moz-user-select:none!important;-ms-user-select:none!important;user-select:none!important}.AnimControl .top-bar{display:grid;align-items:center;justify-content:space-between;grid-template-columns:auto auto;grid-gap:.25em;position:relative;margin-bottom:-1.25em;top:-.5em;right:-.5em}.AnimControl .top-bar .close{position:unset}.AnimControl .top-bar .progress{--progress: 1px;float:left;width:250px;height:.5em;background:#bbd3ff;padding:0;cursor:pointer}.AnimControl .progress:after{content:"";position:absolute;width:var(--progress);height:inherit;background:#337bcb;border-right:1px solid white;padding:0}.AnimControl .calendar{border:none;display:grid;grid-template-columns:repeat(7,1fr);column-gap:var(--grid-gap);row-gap:calc(1.5 * var(--grid-gap));padding:calc(2 * var(--grid-gap)) .3em;z-index:0}.AnimControl .calendar .cell{float:left;width:var(--grid-size);height:var(--grid-size);line-height:var(--grid-size);border-radius:calc(.25 * var(--grid-size));font-size:1em;text-align:center;background-color:var(--day-active);position:relative;outline:none;border:none;cursor:pointer;z-index:2}.AnimControl .calendar .cell span{position:relative;z-index:3;display:block;width:100%;height:100%;background-color:inherit;color:inherit;border-radius:inherit;outline:none}.AnimControl .calendar .cell span:hover{outline:3px solid #ffffff61;outline-offset:-2.5px}.AnimControl .calendar .inactive{pointer-events:none;cursor:default;color:#b1afaf;border-color:transparent;background-color:var(--day-inactive);outline:2px solid #b1afaf;outline-offset:-2px}.AnimControl .calendar .cell.active:after{content:"";pointer-events:none;display:block;position:absolute;width:calc(var(--grid-gap) + var(--grid-size));height:100%;top:0;left:calc(var(--grid-size)/2);z-index:1;cursor:auto;border:none;background:inherit;outline:inherit}.AnimControl .calendar .cell.last:after{display:none}.AnimControl .calendar .cell.active.brd-lft:after,.AnimControl .calendar .cell.active.brd-rgt:after{background-color:var(--day-active)}.AnimControl .calendar .cell:nth-child(7n):after{width:50%;left:50%}.AnimControl .calendar .cell.active:not(.first):nth-child(7n+1):before{content:"";position:absolute;width:50%;height:100%;top:0;left:0;background-color:var(--day-active)}.AnimControl .calendar .cell.selected{z-index:2!important;background:var(--day-selected);color:#fff;cursor:auto}.AnimControl .calendar .cell:not(.selected) span:hover{background:#9cbfa8}.AnimControl .calendar .day-name{font-family:Antonio,Antonio-fallback,sans-serif;height:1.3em;line-height:1.8em;font-size:1.1em;background-color:transparent;outline:none;border:none}
