#right-container {
  padding: 65px 20px 20px;
}

.row.right-row {
  width: 100%;
  padding-top: 15px;
  padding-bottom: 15px;
  position: absolute;
}

.pull-left {
  float: left !important;
}

.pull-right {
  float: right !important;
}

.table-responsive {
  overflow-x: auto;
}

.table-responsive .table {
  font-size: 0.875em;
}

#placeholder .tickLabel{
  font-size: 80%;
}

.clickable{
  cursor: pointer;
}

.btn-sm {
  padding: 3px 8px;
  border-radius: 5px;
  border: none rgba(0,0,0,0);
  background-color: #961911;
}

.btn-sm:hover {
  background-color: #91352f;
}

.btn-info:active {
  background-color: #91352f !important;
}

.btn-info:hover, .btn-info:focus, .btn-info.focus, .btn-info:active, .btn-info.active, .open > .dropdown-toggle.btn-info {
    background-color: #91352f !important;
}

.ui-slider {
  position: relative;
}

.ui-slider .ui-slider-handle {
  position: absolute;
  z-index: 2;
  width: 1.1em;
  height: 1.2em;
  cursor: default;
  -ms-touch-action: none;
  touch-action: none;
}

.ui-slider .ui-slider-range {
  position: absolute;
  z-index: 1;
  font-size: .7em;
  display: block;
  border: 0;
  background-position: 0 0;
}

/* support: IE8 - See #6727 */
.ui-slider.ui-state-disabled .ui-slider-handle,
.ui-slider.ui-state-disabled .ui-slider-range {
  filter: inherit;
}

.ui-slider-horizontal {
  height: .8em;
}

.ui-slider-horizontal .ui-slider-handle {
  top: -.3em;
  margin-left: -.6em;
}

.ui-slider-horizontal .ui-slider-range {
  top: 0;
  height: 100%;
}

.ui-slider-horizontal .ui-slider-range-min {
  left: 0;
}

.ui-slider-horizontal .ui-slider-range-max {
  right: 0;
}

.ui-slider-vertical {
  width: .8em;
  height: 100px;
}

.ui-slider-vertical .ui-slider-handle {
  left: -.3em;
  margin-left: 0;
  margin-bottom: -.6em;
}

.ui-slider-vertical .ui-slider-range {
  left: 0;
  width: 100%;
}

.ui-slider-vertical .ui-slider-range-min {
  bottom: 0;
}

.ui-slider-vertical .ui-slider-range-max {
  top: 0;
}

.ui-widget-header {
  border: 1px solid #dddddd;
  background: #e9e9e9;
  color: #333333;
  font-weight: bold;
}

.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {
  border-bottom-right-radius: 3px;
}

.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl {
  border-bottom-left-radius: 3px;
}

.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr {
  border-top-right-radius: 3px;
}

.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl {
  border-top-left-radius: 3px;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html 
.ui-button.ui-state-disabled:active {
  border: 1px solid #c5c5c5;
  background: #f6f6f6;
  font-weight: normal;
  color: #454545;
  border-radius: 10px 10px 0 0;
  box-shadow: 1px 1px 1px 0px #cbcbcb;
}

.ui-widget-content {
  border: 1px solid #dddddd;
  background: #ffffff;
  color: #333333;
}

.visible {
  height: 3em;
  width: 10em;
  background: yellow;
}

.divided {
  cursor: pointer;
  display: flex;
  align-items: center;
  color: darkgray;
}

.divider {
  flex-grow: 1;
  border-bottom: 2px dotted darkgray;
  margin: 10px;
  opacity: .5;
}

.tlue {
  font-family: "Open Sans", "Open Sans C", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 19px;
  font-weight: 300;
  color: #222222;
}

.live-data td:nth-child(2),
.live-data td:nth-child(3),
.live-data th:nth-child(2),
.live-data th:nth-child(3) {
  text-align: right;
}

.login {
  border: 1px solid #aaa9;
  border-radius: 1em;
  padding: 20px;
  box-shadow: 1px 1px 4px 1px rgba(2,2,2,0.2);
  min-width: 300px;
  max-width: fit-content;
  background-color: #fff;
  position: relative;
  z-index: 1;
}

.login-form {
  border: 0;
  box-shadow: 5px 5px 4px 1px rgba(2, 2, 2, 0.2);
  zoom: 1.1;
  transition: .5s;
  opacity: 0;
}

input[type=text]:disabled {
  background: #fff;
}

.logout {
  filter: opacity(.5);
  margin: 10px 0;
  margin-left: -10px !important;
  padding: 12px;
  transform: rotate(180deg);
  transition: .25s;
  width: 16px;
  height: 16px;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.5'%3E%3Cpath stroke-linecap='round' d='M8.002 7c.012-2.175.108-3.353.877-4.121C9.757 2 11.172 2 14 2h1c2.828 0 4.243 0 5.121.879C21 3.757 21 5.172 21 8v8c0 2.828 0 4.243-.879 5.121C19.243 22 17.828 22 15 22h-1c-2.828 0-4.243 0-5.121-.879c-.769-.768-.865-1.946-.877-4.121'/%3E%3Cpath d='M8 19.5c-2.357 0-3.536 0-4.268-.732C3 18.035 3 16.857 3 14.5v-5c0-2.357 0-3.536.732-4.268C4.464 4.5 5.643 4.5 8 4.5' opacity='.5'/%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M15 12H6m0 0l2 2m-2-2l2-2'/%3E%3C/g%3E%3C/svg%3E");
  background-color: currentColor;
}

.logout:hover {
  cursor: pointer;
  filter: opacity(.7);
  background-color: currentColor !important;
}

.leaflet-control-coordinates {
  background: white;
  border-radius: 4px;
  cursor: pointer !important;
  padding: 2px 5px;
  font-size: 12px;
}

.leaflet-control-coordinates.hidden {
  display: none;
}

.leaflet-control-coordinates-lng {
  padding-left: 5px;
}

#log {
  padding: 15px;
  border-radius: 10px;
  border: 1px dashed #a9a9a9;
}

.wait_out {
  z-index: 100000;
  position: absolute;
}

.wait_in {
  position: fixed;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,.7);
  backdrop-filter: blur(2px);
}

#redhead {
  font-weight: bold;
  display: inline-block;
  color: #961911;
  text-shadow: none;
}

#theme-switch {
  width: 24px;
  height: 24px;
  --svg: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cpath fill="white" d="M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2S2 6.477 2 12s4.477 10 10 10m0-2V4a8 8 0 1 1 0 16"%2F%3E%3C%2Fsvg%3E');
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  cursor: pointer;
  color: #5d5d5d;
  opacity: .5;
  position: fixed;
  right: 10px;
  top: 10px;
  transition: .25s;
}

#theme-switch:hover{
  opacity:.7;
}

.chart-fill-toggle {
  width: 24px;
  height: 24px;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M7.755 13.38v6.83a1.54 1.54 0 0 1-1.54 1.54h-1.81a1.54 1.54 0 0 1-1.55-1.54v-6.83a1.54 1.54 0 0 1 1.55-1.55h1.81a1.54 1.54 0 0 1 1.54 1.55m6.7-9.58v16.41a1.54 1.54 0 0 1-1.55 1.54h-1.81a1.55 1.55 0 0 1-1.55-1.54V3.8a1.56 1.56 0 0 1 1.55-1.55h1.81a1.55 1.55 0 0 1 1.55 1.55m6.69 5.18v11.23a1.54 1.54 0 0 1-1.54 1.54h-1.81a1.54 1.54 0 0 1-1.55-1.54V8.98a1.55 1.55 0 0 1 1.55-1.55h1.85a1.55 1.55 0 0 1 1.5 1.55'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  cursor: pointer;
  color: #5d5d5d;
  opacity: .5;
  position: fixed;
  right: 10px;
  top: 10px;
  transition: .25s;
}

.chart-fill-toggle:hover{
  opacity:.8;
}

body::-webkit-scrollbar {
  display: none;
}

@font-face {
  font-family: 'FontAwesome';
  src: url('./awesome.woff2');
}

@font-face {
  font-family: 'Open Sans C';
  src: url('./opensans_c.woff2');
}

@font-face {
  font-family: 'Open Sans';
  src: url('./opensans.woff2');
}

@font-face {
  font-family: 'Lato C';
  src: url('./lato_c.woff2');
}

@font-face {
  font-family: 'Lato';
  src: url('./lato.woff2');
}

#top-btn {
  display: inline-block;
  background-color: #961911;
  width: 40px;
  height: 40px;
  text-align: center;
  border-radius: 20px;
  position: fixed;
  bottom: 30px;
  right: 30px;
  transition: background-color .3s,
  opacity .5s, visibility .5s;
  opacity: 0;
  visibility: hidden;
  z-index: 1000;
  text-decoration: none;
}

#top-btn::after {
  content: "\f077";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  font-size: 1em;
  line-height: 40px;
  color: #fff;
}

#top-btn:hover {
  cursor: pointer;
  background-color: #333;
}

#top-btn:active {
  background-color: #555;
}

#top-btn.show {
  opacity: .7;
  visibility: visible;
}

img {
  pointer-events: none;
}

#storage-usage {
  color: #5d5d5d;
  opacity: 0;
  position: fixed;
  right: 65px;
  top: 14px;
  margin: 0;
  transition: .25s;
}

.storage-usage-img {
  width: 24px;
  height: 24px;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 3C7.58 3 4 4.79 4 7s3.58 4 8 4s8-1.79 8-4s-3.58-4-8-4M4 9v3c0 2.21 3.58 4 8 4s8-1.79 8-4V9c0 2.21-3.58 4-8 4s-8-1.79-8-4m0 5v3c0 2.21 3.58 4 8 4s8-1.79 8-4v-3c0 2.21-3.58 4-8 4s-8-1.79-8-4'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  color: #5d5d5d;
  opacity: .5;
  position: fixed;
  right: 40px;
  top: 10px;
  transition: .25s;
}

.storage-usage-img:hover, .storage-usage-img:hover ~ #storage-usage {
  opacity: .7;
}

.storage-usage-img:hover ~ .share-img,
.storage-usage-img:hover ~ .chart-fill-toggle,
.storage-usage-img:hover ~ .live,
.storage-usage-img:hover ~ .favorite,
.storage-usage-img:hover ~ .favorite-en,
.storage-usage-img:hover ~ .remote-img {
  opacity: 0;
}

.share-img {
  width: 24px;
  height: 24px;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M17 22q-1.25 0-2.125-.875T14 19q0-.15.075-.7L7.05 14.2q-.4.375-.925.588T5 15q-1.25 0-2.125-.875T2 12t.875-2.125T5 9q.6 0 1.125.213t.925.587l7.025-4.1q-.05-.175-.062-.337T14 5q0-1.25.875-2.125T17 2t2.125.875T20 5t-.875 2.125T17 8q-.6 0-1.125-.213T14.95 7.2l-7.025 4.1q.05.175.063.338T8 12t-.012.363t-.063.337l7.025 4.1q.4-.375.925-.587T17 16q1.25 0 2.125.875T20 19t-.875 2.125T17 22m0-2q.425 0 .713-.287T18 19t-.288-.712T17 18t-.712.288T16 19t.288.713T17 20M5 13q.425 0 .713-.288T6 12t-.288-.712T5 11t-.712.288T4 12t.288.713T5 13m12-7q.425 0 .713-.288T18 5t-.288-.712T17 4t-.712.288T16 5t.288.713T17 6m0-1'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  color: #5d5d5d;
  opacity: .5;
  position: fixed;
  right: 70px;
  top: 10px;
  transition: .25s;
  z-index: 1;
  cursor: pointer;
}

.share-img:hover {
  opacity: .7;
}

.remote-img {
  width: 24px;
  height: 24px;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M7.5 16q.625 0 1.063-.437T9 14.5t-.437-1.062T7.5 13t-1.062.438T6 14.5t.438 1.063T7.5 16m9 0q.625 0 1.063-.437T18 14.5t-.437-1.062T16.5 13t-1.062.438T15 14.5t.438 1.063T16.5 16M4 21q-.425 0-.712-.288T3 20v-7.675q0-.175.025-.337t.075-.313L5.075 6q.15-.45.538-.725T6.5 5h4.6q.425 0 .713.288T12.1 6t-.287.713T11.1 7H6.85L5.8 10h7.75q.875.95 2.025 1.475T18 12q.475 0 .925-.075t.875-.2t.813.113t.387.662V20q0 .425-.288.713T20 21h-1q-.425 0-.712-.288T18 20v-1H6v1q0 .425-.288.713T5 21zM18 7.5q.625 0 1.063-.437T19.5 6t-.437-1.062T18 4.5t-1.062.438T16.5 6t.438 1.063T18 7.5m-.15 2.5q-.225 0-.4-.137t-.225-.363l-.175-.675q-.275-.1-.537-.25t-.488-.35l-.675.225q-.2.075-.412-.012T14.6 8.15l-.15-.275q-.125-.2-.087-.425t.212-.375l.5-.475q-.05-.3-.05-.6t.05-.6l-.5-.45q-.175-.15-.212-.375t.087-.425l.175-.275q.125-.2.325-.275t.4-.025l.65.2q.225-.2.488-.35t.562-.25l.175-.675q.05-.225.225-.362t.4-.138h.3q.225 0 .4.138t.225.362l.175.65q.3.125.563.275t.487.35l.65-.175q.2-.05.4.025t.325.275l.175.25q.125.2.088.425t-.213.375l-.475.45q.05.3.063.613t-.063.612l.475.45q.175.15.213.375t-.088.425l-.15.25q-.125.2-.337.275t-.413.025l-.65-.2q-.225.2-.5.35t-.55.25l-.175.675q-.05.225-.225.363t-.4.137z'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  color: #5d5d5d;
  opacity: .5;
  position: fixed;
  right: 160px;
  top: 10px;
  transition: .25s;
  z-index: 1;
  cursor: pointer;
}

.remote-img:hover {
  opacity: .7;
}

.favorite {
  display: inline-block;
  width: 24px;
  height: 24px;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M22 9.67a1 1 0 0 0-.86-.67l-5.69-.83L12.9 3a1 1 0 0 0-1.8 0L8.55 8.16L2.86 9a1 1 0 0 0-.81.68a1 1 0 0 0 .25 1l4.13 4l-1 5.68a1 1 0 0 0 1.47 1.08l5.1-2.67l5.1 2.67a.93.93 0 0 0 .46.12a1 1 0 0 0 .59-.19a1 1 0 0 0 .4-1l-1-5.68l4.13-4A1 1 0 0 0 22 9.67m-6.15 4a1 1 0 0 0-.29.88l.72 4.2l-3.76-2a1.06 1.06 0 0 0-.94 0l-3.76 2l.72-4.2a1 1 0 0 0-.29-.88l-3-3l4.21-.61a1 1 0 0 0 .76-.55L12 5.7l1.88 3.82a1 1 0 0 0 .76.55l4.21.61Z'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  color: #5d5d5d;
  opacity: .5;
  position: fixed;
  right: 120px;
  top: 10px;
  transition: .25s;
  z-index: 1;
  cursor: pointer;
}

.favorite-en {
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M17.562 21.56a1 1 0 0 1-.465-.116L12 18.764l-5.097 2.68a1 1 0 0 1-1.45-1.053l.973-5.676l-4.124-4.02a1 1 0 0 1 .554-1.705l5.699-.828l2.549-5.164a1.04 1.04 0 0 1 1.793 0l2.548 5.164l5.699.828a1 1 0 0 1 .554 1.705l-4.124 4.02l.974 5.676a1 1 0 0 1-.985 1.169Z'/%3E%3C/svg%3E");
}

.favorite:hover, .favorite-en:hover {
  opacity: .7;
}

.copyright {
  font-size:11.2px;
  opacity:.3;
  font-family:sans-serif;
}

.toggle {
  font-family: monospace;
}

.btn-default {
  text-overflow: ellipsis;
  overflow: hidden;
}

.btn {
  padding: 4px 12px;
}

.table-del-merge-pid {
  width: 90%;
  margin: 0 auto;
}

.table-del-merge-pid tr:hover {
    background: #eee;
}

#stream {
  td:first-child {
    font-weight: bold;
  }
}

#redDialogWrap {
  word-wrap: break-word;
}

#func, #exp {
  width: 410px;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}

.func-btn {
  border-radius: 5px;
  margin: 5px 0 0;
}

#log-list {
  display: none;
  width: fit-content;
  font-size: 12px;
  margin: 10px auto 0;
  text-align: left;
  padding-inline-start: 15px;
}

.upload-log-btn {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 24 24'%3E%3Cg stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath fill='none' stroke-dasharray='14' stroke-dashoffset='14' d='M6 19h12'%3E%3Canimate fill='freeze' attributeName='stroke-dashoffset' dur='0.4s' values='14;0'/%3E%3C/path%3E%3Cpath fill='%23000' d='M12 15 h2 v-6 h2.5 L12 4.5M12 15 h-2 v-6 h-2.5 L12 4.5'%3E%3Canimate attributeName='d' calcMode='linear' dur='1.5s' keyTimes='0;0.7;1' repeatCount='indefinite' values='M12 15 h2 v-6 h2.5 L12 4.5M12 15 h-2 v-6 h-2.5 L12 4.5;M12 15 h2 v-3 h2.5 L12 7.5M12 15 h-2 v-3 h-2.5 L12 7.5;M12 15 h2 v-6 h2.5 L12 4.5M12 15 h-2 v-6 h-2.5 L12 4.5'/%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  -webkit-mask-size: cover;
  background-color: #777;
  margin-left: 15px;
  display: none;
}

.upload-log-btn:hover {
  background-color: #555;
}

.pages a {
  width: 20px;
  display: inline-block;
}

.pages a:hover {
  text-decoration: underline;
}

.pages {
  text-align: center;
  font-family: monospace;
  padding: 5px 20px 5px;
}

.current-page {
  font-weight: 900;
  font-size: 18px;
  font-family: monospace;
  padding: 5px 20px 5px;
}

.pure-g {
  display: -webkit-flex;
  -webkit-flex-flow: row wrap;
  display: -ms-flexbox;
  -ms-flex-flow: row wrap;
  -ms-align-content: flex-start;
  -webkit-align-content: flex-start;
  align-content: flex-start;
  transition: filter .1s;
}

.map-container {
  height: 310px;
  z-index: 1;
  border-radius: 5px;
}

@media screen and (min-width: 55em) {
  .pure-u-md-1-2 {
    display: inline-block;
    vertical-align: top;
  }

  .pure-u-md-1-2 {
    width: 50%;
  }

  .wide-h {
    text-align: center;
  }

  .settings-unit {
    width: 30%;
  }

  .map-container {
    height: 450px !important;
  }

  .demo-placeholder {
    height: 450px !important;
  }
}

@media screen and (max-width: 55em) {
  .card {
    width: auto !important;
    margin: 0 !important;
  }

  .pure-g {
    display: block !important;
  }

  #Chart-Container {
    height: auto !important;
  }

  .settings-unit {
    width: 90%;
  }

  #Chart-Container {
    padding-bottom: 10px;
  }
}

.nogps {
  font-size: 14px;
  font-family: "Open Sans", "Open Sans C", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.table-sum td:nth-child(n+2):nth-child(-n+4) {
  font-family: monospace;
}

hr {
  border: 0;
  border-top: 1px dashed #dddddd;
  border-width: medium;
  margin: 10px auto;
}

.settings-unit {
  margin: 20px auto;
}

.settings-container {
  padding: 50px 0 5px;
}

.cntr {
  display: flex;
  justify-content: center;
}

.no-data-url-list {
  width: fit-content;
  margin: 0 auto 10px;
  text-align: left;
}

a {
  color: #961911;
}

.leaflet-tooltip.stream-marker {
  box-shadow: none;
  font-weight: bold;
  font-size: 10px;
}

.leaflet-control-layers {
  font-size: 10px;
}

.leaflet-touch .leaflet-control-layers-toggle {
  width: 30px !important;
  height: 30px !important;
  background-size: 20px 20px;
}

#redDialogOverLay {
  z-index: 99999 !important;
  backdrop-filter: blur(2px);
}

.login-background {
  height: 100%;
  width: 100%;
  background: url(../img/bkg.avif) no-repeat center center;
  background-size: cover;
  position: fixed;
  top: 0;
  opacity: .6;
}

.users-list th,
.table-del-merge-pid th {
  position: sticky;
  top: 44px;
  background: #fff;
  background: linear-gradient(180deg, rgba(255,255,255,1) 85%, rgba(255,255,255,0) 100%);
  z-index: 2;
}

#slider-range11 {
 height: 12px;
}

.login-lang {
  display: flex;
  justify-content: end;
  cursor: pointer;
  transition: opacity .25s;
  font-size: 13px;
}

.selected-lang {
  display: inline-block;
  width: 20px;
  height: 20px;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2m6.93 6h-2.95a15.7 15.7 0 0 0-1.38-3.56A8.03 8.03 0 0 1 18.92 8M12 4.04c.83 1.2 1.48 2.53 1.91 3.96h-3.82c.43-1.43 1.08-2.76 1.91-3.96M4.26 14C4.1 13.36 4 12.69 4 12s.1-1.36.26-2h3.38c-.08.66-.14 1.32-.14 2s.06 1.34.14 2zm.82 2h2.95c.32 1.25.78 2.45 1.38 3.56A8 8 0 0 1 5.08 16m2.95-8H5.08a8 8 0 0 1 4.33-3.56A15.7 15.7 0 0 0 8.03 8M12 19.96c-.83-1.2-1.48-2.53-1.91-3.96h3.82c-.43 1.43-1.08 2.76-1.91 3.96M14.34 14H9.66c-.09-.66-.16-1.32-.16-2s.07-1.35.16-2h4.68c.09.65.16 1.32.16 2s-.07 1.34-.16 2m.25 5.56c.6-1.11 1.06-2.31 1.38-3.56h2.95a8.03 8.03 0 0 1-4.33 3.56M16.36 14c.08-.66.14-1.32.14-2s-.06-1.34-.14-2h3.38c.16.64.26 1.31.26 2s-.1 1.36-.26 2z'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  opacity: .5;
  transition: opacity .25s;
}

.selected-lang:hover {
  opacity: .8;
}

.lang-options {
  display: none;
  position: absolute;
  right: 50px;
  padding: 0;
  list-style: none;
  border: 1px solid #ccc;
  border-radius: 5px;
  background-color: #ffffffc2;
  z-index: 1000;
  backdrop-filter: blur(2px);
}

.lang-options li {
  padding: 10px;
  cursor: pointer;
}

.lang-options li:hover {
  background-color: #f0f0f0;
  border-radius: 5px;
}

.lang-options.show {
  display: block;
}

input[type="checkbox"] {
  appearance: none;
  width: 14px;
  height: 14px;
  border: 1.5px solid #777;
  outline: none;
  cursor: pointer;
  border-radius: 3px;
  transition: all 0.2s ease;
  margin: 0;
  vertical-align: middle;
  position: relative;
  z-index: 1;
}

input[type="checkbox"]:checked {
  border-color: #961911;
  background-color: #fff;
}

input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  width: 4px;
  height: 8px;
  border-right: 2px solid #961911;
  border-bottom: 2px solid #961911;
  top: 35%;
  left: 50%;
  transform: translate(-50%, -40%) rotate(45deg);
  animation: appear .5s cubic-bezier(0.19, 1, 0.22, 1);
}

input[type="checkbox"]:hover {
  border-color: #555;
}

input[type="checkbox"]:checked:hover {
  border-color: #7a1410;
}

input[type="checkbox"]:checked:hover::after {
  border-color: #7a1410;
}

input[type="checkbox"]:disabled {
  border-color: #ccc;
  background-color: #f5f5f5;
  cursor: not-allowed;
}

input[type="checkbox"]:disabled:checked {
  border-color: #ccc;
}

input[type="checkbox"]:disabled:checked::after {
  border-color: #aaa;
}

@keyframes appear {
  from {
    opacity: 0;
    transform: translate(-50%, -40%) rotate(45deg) scale(0);
  }
  to {
    opacity: 1;
    transform: translate(-50%, -40%) rotate(45deg) scale(1);
  }
}

.label {
  white-space: normal;
}

.heat-data {
  background: #f9f9f9;
  padding: 4px;
  border-radius: 4px;
}

#heat-dataSourceSelect {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  font-size: 12px;
  border: 0;
  outline: 0;
  background: inherit;
  cursor: pointer;
  color: #222;
}

.heat-data-tooltip {
  font-size: 10px;
}

.demo-placeholder {
  height: 350px;
  touch-action: pan-y;
}

.map-stream-button {
  width: 30px;
  height: 30px;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.map-stream-button:hover {
  background-color: #f4f4f4;
}

.leaflet-control-zoom-stream {
  display: flex !important;
  align-items: center;
  justify-content: center;
}

.leaflet-control-zoom-stream:hover {
  background-color: #f4f4f4;
}

.leaflet-touch .leaflet-control-zoom-stream {
  height: 30px;
  width: 30px;
}

.leaflet-control-zoom-stream svg {
  vertical-align: middle;
  display: inline-block;
}

.leaflet-control-coordinates, .heat-data, .hotline-legend-canvas {
  background-clip: padding-box;
  border: 2px solid rgba(0, 0, 0, 0.2);
}

.travel-line-stroke, .circle-marker-stroke {
  filter: drop-shadow(0 0 1px white);
}

.travel-tooltip {
  font-size: 10px;
}

.split-container {
  display: flex;
  height: 100%;
  width: 100%;
  overflow: hidden;
  flex-direction: row;
  gap: 4px;
  box-sizing: border-box;
}

.pane {
  overflow: hidden;
}

.left {
  width: 50%;
}

.right {
  flex: 1;
}

.resizer {
  width: 10px;
  height: 150px;
  background: #e6e6e6;
  border-radius: 5px;
  cursor: col-resize;
  position: relative;
  align-self: center;
  margin-left: -4px;
  transition: height .25s ease, background .25s ease;
  transform: translateY(-20px);
}

.resizer::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 4px;
  height: 4px;
  background-color: #999; /* mid */
  border-radius: 50%;
  box-shadow:
    0 -10px 0 0 #999, /* Top */
    0 10px 0 0 #999;  /* Bottom */
}

.resizer:hover,
.resizer:active {
  height: 180px;
  background: #d5d5d5;
}

@media screen and (max-width: 55em) {
  .split-container {
    flex-direction: column;
  }

  .resizer {
    display: none;
  }

  .left, .right {
    width: 100% !important;
    height: auto;
  }
}

.fetch-data {
  width: 32px;
  height: 32px;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-width='2' d='M12 6.99998C9.1747 6.99987 6.99997 9.24998 7 12C7.00003 14.55 9.02119 17 12 17C14.7712 17 17 14.75 17 12'%3E%3CanimateTransform attributeName='transform' attributeType='XML' dur='560ms' from='0,12,12' repeatCount='indefinite' to='360,12,12' type='rotate'/%3E%3C/path%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  color: #5d5d5d;
  opacity: .5;
  position: absolute;
  left: 0;
  right: 0;
  margin: 6px auto;
  display: none;
}

.live {
  width: 24px;
  height: 24px;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M15.41 6.788c.15.18.37.28.59.28h.01a.743.743 0 0 0 .59-1.21c-1.16-1.45-2.83-2.28-4.59-2.28s-3.44.83-4.59 2.28a.748.748 0 0 0 1.17.93c.86-1.09 2.11-1.72 3.41-1.72s2.54.63 3.41 1.72M7 22.068h10c2 0 3 0 3.88-.5c.59-.34 1.05-.81 1.37-1.37c.5-.87.5-1.88.5-3.87s0-3-.5-3.87q-.495-.855-1.38-1.38c-.87-.5-1.87-.5-3.87-.5H7c-2 0-3 0-3.88.5c-.59.34-1.05.81-1.37 1.37c-.5.87-.5 1.88-.5 3.87s0 3 .5 3.87q.495.855 1.38 1.38c.87.5 1.87.5 3.87.5m-3.13-9.7c.53-.3 1.4-.3 3.13-.3h10c1.74 0 2.61 0 3.12.3c.36.21.64.49.83.83c.3.53.3 1.4.3 3.13s0 2.6-.3 3.13c-.19.34-.47.61-.82.82c-.53.3-1.4.3-3.13.3H7c-1.74 0-2.61 0-3.12-.3c-.36-.21-.64-.49-.83-.83c-.3-.53-.3-1.4-.3-3.13s0-2.6.3-3.13c.19-.34.47-.61.82-.82m10.129-3.3c-.22 0-.44-.1-.59-.28c-.73-.91-2.1-.91-2.83 0c-.26.32-.73.37-1.05.12a.75.75 0 0 1-.12-1.05c.65-.81 1.59-1.28 2.59-1.28s1.93.47 2.59 1.28c.26.32.21.8-.12 1.05c-.14.11-.3.16-.47.16m3.001 10h2c.41 0 .75-.34.75-.75s-.34-.75-.75-.75h-1.25v-.5h.75c.41 0 .75-.34.75-.75s-.34-.75-.75-.75h-.75v-.5H19c.41 0 .75-.34.75-.75s-.34-.75-.75-.75h-2c-.41 0-.75.34-.75.75v4c0 .41.34.75.75.75m-4.7-.49c.11.3.39.49.7.49h.02c.31 0 .59-.2.7-.49l1.5-4a.76.76 0 0 0-.44-.97a.75.75 0 0 0-.97.44l-.8 2.13l-.8-2.13a.75.75 0 0 0-.97-.44a.75.75 0 0 0-.44.97zm-4.05-.26c0 .41.34.75.75.75s.75-.34.75-.75v-4c0-.41-.34-.75-.75-.75s-.75.34-.75.75zm-4 0c0 .41.34.75.75.75h1.5c.41 0 .75-.34.75-.75s-.34-.75-.75-.75h-.75v-3.25c0-.41-.34-.75-.75-.75s-.75.34-.75.75z' color='%23000'/%3E%3C/svg%3E");
  background-color: currentColor;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  color: #5d5d5d;
  opacity: .5;
  position: absolute;
  right: 130px;
  top: 10px;
  display: none;
  animation: livePulse 2s infinite;
}

@keyframes livePulse {
  0% {
    color: #5d5d5d;
  }
  50% {
    color: red;
  }
  100% {
    color: #5d5d5d;
  }
}

.choices.is-open {
  z-index: 3;
}

.choices {
  margin-bottom: 0;
}

.choices[data-type*=select-one] .choices__inner {
  text-align: center;
}

.is-open .choices__inner{
  border-radius: 5px 5px 0 0;
}

.choices__inner {
  border-radius: 5px;
}

.choices__list--dropdown,.choices__list[aria-expanded] {
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}

.choices__list--multiple .choices__item {
  vertical-align: inherit;
  color: inherit;
  background-color: #e6e6e6;
  border: 1px dashed #a7a7a7;
  border-radius: 2.5px;
}

.choices[data-type*=select-multiple] .choices__button, .choices[data-type*=text] .choices__button {
  border-left: 0;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==);
  filter: invert(1);
}

.choices__list--multiple .choices__item.is-highlighted {
  background-color: #e6e6e6;
  border: 1px dashed #a7a7a7;
}

.choices__inner {
  min-height: 30px;
  padding: 2px 8px !important;
}

.choices__inner__plot {
  min-height: 44px;
  padding: 7.5px 7.5px 3.75px !important;
}

.choices__settings__text {
  text-align: left !important;
}

.slider-container {
  position: relative;
  width: 100%;
  padding-top: 30px;
}

#slider-time {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -54%);
  width: fit-content;
  min-width: 200px;
  text-align: center;
  border: 1px solid #ddd;
  border-bottom: none;
  border-radius: 5px 5px 0 0;
  height: 22px;
  z-index: 1;
}

.ui-widget-header {
  background: #fff;
  background: linear-gradient(180deg,rgba(255, 255, 255, 1) 0%, rgba(170, 170, 170, 0.15) 100%);
}

.form-control {
  background-color: #f9f9f9;
  border-color: #ddd;
  color: #222;
  box-shadow: none;
}

.form-control:focus {
  border-color: #b7b7b7;
  box-shadow: none;
}

.form-control[readonly] {
  color: #6f6666;
  background: #e7e7e7;
}

.settings--cell {
  padding-bottom: 10px;
}

.delete-icon {
  cursor: pointer;
  color: red;
  margin-right: 10px;
  display: inline-block;
  transition: transform .2s ease;
}


.delete-icon:hover {
  transform: scale(1.7);
}

.stream-lock-container {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
  width: 24px;
  text-align: center;
}

.stream-lock {
  display: inline-block;
  width: 16px;
  height: 16px;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M17 9V7c0-2.8-2.2-5-5-5S7 4.2 7 7v2c-1.7 0-3 1.3-3 3v7c0 1.7 1.3 3 3 3h10c1.7 0 3-1.3 3-3v-7c0-1.7-1.3-3-3-3M9 7c0-1.7 1.3-3 3-3s3 1.3 3 3v2H9z'/%3E%3C/svg%3E");
  background-color: #acabac;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.new-session {
  color: #5d5d5d;
  width: fit-content;
  position: absolute;
  right: 5px;
  margin: 50px auto;
  background: #e6e6e6e3;
  padding: 5px;
  border-radius: 5px;
  display: none;
  font-size: 14px;
  box-shadow: 1px 1px 4px 1px rgb(2, 2, 2, 0.3);
  animation: newsessPulse 2s infinite ease-in-out;
}

@keyframes newsessPulse {
  0% {
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  80% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

#rollback {
  cursor: pointer;
}

#redDialog_title {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsPSIjNzc3IiBkPSJNMTguMyA1LjcxYS45OTYuOTk2IDAgMCAwLTEuNDEgMEwxMiAxMC41OUw3LjExIDUuN0EuOTk2Ljk5NiAwIDEgMCA1LjcgNy4xMUwxMC41OSAxMkw1LjcgMTYuODlhLjk5Ni45OTYgMCAxIDAgMS40MSAxLjQxTDEyIDEzLjQxbDQuODkgNC44OWEuOTk2Ljk5NiAwIDEgMCAxLjQxLTEuNDFMMTMuNDEgMTJsNC44OS00Ljg5Yy4zOC0uMzguMzgtMS4wMiAwLTEuNCIvPjwvc3ZnPg==");
  background-repeat: no-repeat;
  background-position-x: right;
}

.no-data-url-list li:hover {
  color: #961911;
}

.password-toggle {
  position: relative;
  display: inline-block;
  width: 100%;
}

.password-toggle__btn {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  cursor: pointer;
  padding: 2px;
  width: 24px;
  height: 24px;
  opacity: 0.5;
  transition: opacity 0.2s ease;
}

.password-toggle__btn:hover {
  opacity: .8;
}

.password-toggle__icon {
  display: block;
  width: 100%;
  height: 100%;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z'/%3E%3C/svg%3E") center/contain no-repeat;
}

.password-toggle__btn[aria-pressed='true'] .password-toggle__icon {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 7c2.76 0 5 2.24 5 5 0 .65-.13 1.26-.36 1.83l2.92 2.92c1.51-1.26 2.7-2.89 3.43-4.75-1.73-4.39-6-7.5-11-7.5-1.4 0-2.74.25-3.98.7l2.16 2.16C10.74 7.13 11.35 7 12 7zM2 4.27l2.28 2.28.46.46C3.08 8.3 1.78 10.02 1 12c1.73 4.39 6 7.5 11 7.5 1.55 0 3.03-.3 4.38-.84l.42.42L19.73 22 21 20.73 3.27 3 2 4.27zM7.53 9.8l1.55 1.55c-.05.21-.08.43-.08.65 0 1.66 1.34 3 3 3 .22 0 .44-.03.65-.08l1.55 1.55c-.67.33-1.41.53-2.2.53-2.76 0-5-2.24-5-5 0-.79.2-1.53.53-2.2zm4.31-.78l3.15 3.15.02-.16c0-1.66-1.34-3-3-3l-.17.01z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 7c2.76 0 5 2.24 5 5 0 .65-.13 1.26-.36 1.83l2.92 2.92c1.51-1.26 2.7-2.89 3.43-4.75-1.73-4.39-6-7.5-11-7.5-1.4 0-2.74.25-3.98.7l2.16 2.16C10.74 7.13 11.35 7 12 7zM2 4.27l2.28 2.28.46.46C3.08 8.3 1.78 10.02 1 12c1.73 4.39 6 7.5 11 7.5 1.55 0 3.03-.3 4.38-.84l.42.42L19.73 22 21 20.73 3.27 3 2 4.27zM7.53 9.8l1.55 1.55c-.05.21-.08.43-.08.65 0 1.66 1.34 3 3 3 .22 0 .44-.03.65-.08l1.55 1.55c-.67.33-1.41.53-2.2.53-2.76 0-5-2.24-5-5 0-.79.2-1.53.53-2.2zm4.31-.78l3.15 3.15.02-.16c0-1.66-1.34-3-3-3l-.17.01z'/%3E%3C/svg%3E") center/contain no-repeat;
}

.password-input {
  padding-right: 45px;
}

@media screen and (max-width: 720px) {
    .login-form {
        min-width: 90%;
    }
    .login-background {
        background: url(../img/bkg.avif) no-repeat;
        background-size: cover;
    }
}