/*@import 'https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700';
body { font-family: 'Poppins', sans-serif; background: #fafafa; }
p { font-family: 'Poppins', sans-serif; font-size: 1.1em; font-weight: 300; line-height: 1.7em; color: #999; }*/

@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css');
body { font-family: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif; background: #fafafa; }
p { font-family: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif; font-size: 1.1em; font-weight: 300; line-height: 1.7em; color: #999; }

a, a:hover, a:focus { color: inherit; text-decoration: none; transition: all 0.3s; }

.form-control::placeholder { color: #ced4da; opacity: 1; }

.navbar { padding: 15px 10px; background: #fff; border: none; border-radius: 0; margin-bottom: 20px; box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1); }

#container { display: flex; width: 100%; align-items: stretch; }
#sidebar { min-width: 200px; max-width: 200px; background: #001241; color: #fff; transition: all 0.3s; }
#sidebar.active { margin-left: -200px; }
#sidebar .sidebar-header { min-height: 100px; max-height: 100px; padding: 20px; background: #001241; background-position: center; background-repeat: no-repeat; background-size: contain; border: 0px solid #ffffff; }
#sidebar ul.components { padding: 20px 0; border-bottom: 1px solid #001241; }
#sidebar ul p { color: #fff; padding: 10px; }
#sidebar ul li a { padding: 5px 10px 5px 10px; font-size: 1.1em; display: block; }

/*#sidebar ul li:first-child a { padding-top:10px; font-size: 1.1em; display: block; }
#sidebar ul li:last-child a { padding-bottom:10px; font-size: 1.1em; display: block; }*/
#sidebar ul.components > li > a { padding-top:10px; padding-bottom:10px; }
#sidebar ul > li > ul:not([flexible]) > li:first-of-type > a { padding-top:10px; }
#sidebar ul > li > ul:not([flexible]) > li:nth-last-of-type(1) > a { padding-bottom:10px; }
#sidebar ul > li > ul[flexible] > li:first-of-type > a { padding-top:10px; }
#sidebar ul > li > ul[flexible] > li:nth-last-of-type(2) > a { padding-bottom:10px; }

#sidebar ul > li > a:hover { color: #0090ff; background: #001241; }
#sidebar ul > li > ul { transition: all 0.3s; }
#sidebar ul > li > ul > li > a { color: #395382; background: black; }
#sidebar ul > li > ul > li > a:hover { color: #0090ff; background: black; }
#sidebar ul li.active>a { color: #0090ff; background: black; }
#sidebar a[aria-expanded='true'] { color: #fff; background: #001241; }
#sidebar a[data-toggle='collapse'] { position: relative; }
#sidebar .dropdown-toggle::after { display: block; position: absolute; top: 50%; right: 20px; transform: translateY(-50%); }
#sidebar ul ul a { font-size: 1.1em !important; padding-left: 30px !important; background: black; }
#sidebar ul.CTAs { padding: 20px; }
#sidebar ul.CTAs a { text-align: center; font-size: 1.1em !important; display: block; border-radius: 5px; margin-bottom: 5px; }
#sidebar a.download { background: #fff; color: #7386D5; }
#sidebar a.article,
#sidebar a.article:hover { background: #00a5e5 !important; color: #fff !important; }
#content { width: 100%; padding: 20px; min-height: 100vh; transition: all 0.3s; }
@media (max-width: 768px) {
  #sidebar { margin-left: -200px; }
  #sidebar.active { margin-left: 0; }
  #sidebarCollapse span { display: none; }
}

.hamburger { cursor: pointer; -webkit-tap-highlight-color: transparent; transition: transform 400ms; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; }
.hamburgerRotate.active { transform: rotate(45deg); }
.hamburgerRotate180.active { transform: rotate(180deg); }
.hamburger .line { fill: none; transition: stroke-dasharray 400ms, stroke-dashoffset 400ms; stroke: #001241; stroke-width: 5.5; stroke-linecap: round; }
.hamburger .top { stroke-dasharray: 40 82; }
.hamburger .bottom { stroke-dasharray: 40 82; }
.hamburger.active .top { stroke-dasharray: 14 82; stroke-dashoffset: -72px; }
.hamburger.active .bottom { stroke-dasharray: 14 82; stroke-dashoffset: -72px; }
.hamburger:hover .line { stroke: #0090ff; }

.bell { color: #001241; }
.bell:hover { color: #0090ff; }

.overlay_scroll { overflow: overlay; }
.overlay_scroll.scroll_hide::-webkit-scrollbar { width: 0px; }
.overlay_scroll.scroll_none::-webkit-scrollbar { display:none; }
.__overlay_scroll::-webkit-scrollbar { width: 1vw; }
.__overlay_scroll::-webkit-scrollbar-thumb { background-color: hsla(0, 0%, 42%, 0.49); border-radius: 100px; }
/*::-webkit-scrollbar { width: 1vw; }
::-webkit-scrollbar-thumb { background-color: hsla(0, 0%, 42%, 0.49); border-radius: 100px; }*/
::-webkit-scrollbar { width: 6px; height: 6px; }
/*:not(:hover)::-webkit-scrollbar { display:none; }*/
::-webkit-scrollbar-thumb { background-color: hsla(0, 0%, 42%, 0.49); border-radius: 8px; }
:not(:hover)::-webkit-scrollbar-thumb { background-color: hsla(0, 0%, 42%, 0.15); }

.line_dotted { width: 100%; height: 1px; border-bottom: 1px dashed #ddd; margin: 40px 0; }

.line { width: 100%; height: 1px; border-bottom: 1px solid #ddd; }
.line-395382 { width: 100%; height: 1px; border-bottom: 1px solid #395382; }

.tooltip-inner { background-color: #001241; border: 1px solid #001241; color: #f2f4f8; padding: 7px 15px; text-align: center; max-width: unset; }
.tooltip { font-size: 1em; }

.bg-login {
  background-image: url("../images/bg-login.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100%;
}










.btn .btn-sm { box-shadow: none!important; }

.btn-deepblue { background-color: #001241; border: 1px solid transparent; box-shadow: none !important; color: white; transition: all 0.3s; }
.btn-deepblue:not(:disabled):not(.disabled):hover,
.show>.btn-deepblue:not(:disabled):not(.disabled).dropdown-toggle { background-color: #0090ff; color: white; }
.btn-deepblue:not(:disabled):not(.disabled).active { background-color: #0090ff; color: white; }
.btn-deepblue:disabled,
.btn-deepblue.disabled { background-color: #f2f4f8; color: #cbd2e3; }

.btn-skyblue { background-color: #cbd2d3; border: 1px solid transparent; box-shadow: none !important; color: #001241; transition: all 0.3s; }
.btn-skyblue:not(:disabled):not(.disabled):hover,
.show>.btn-skyblue:not(:disabled):not(.disabled).dropdown-toggle { background-color: #0090ff; color: white; }
.btn-skyblue:not(:disabled):not(.disabled).active { background-color: #0090ff; color: white; }
.btn-skyblue:disabled,
.btn-skyblue.disabled { background-color: #f2f4f8; color: #cbd2e3; }
/* selected 별도 처리 (난방 현재온도) */
.btn-skyblue:disabled:not(.disabled).selected { background-color: #cbd2d3; color: #001241; }

.btn-outline-blue { background-color: transparent; border: 1px solid #001241; box-shadow: none !important; color: #001241; transition: all 0.3s; }
.btn-outline-blue:not(:disabled):not(.disabled):hover,
.show>.btn-outline-blue:not(:disabled):not(.disabled).dropdown-toggle { background-color: #0090ff; border-color: #0090ff; color: white; }
.btn-outline-blue:not(:disabled):not(.disabled).active { background-color: #001241; border-color: #001241; color: white; }
.btn-outline-blue:disabled,
.btn-outline-blue.disabled { background-color: #f2f4f8; border-color: #f2f4f8; color: #cbd2e3; }
/* selected 별도 처리 */
.btn-outline-blue:not(:disabled):not(.disabled).selected { background-color: #0090ff; border-color: #0090ff; color: white; }

.btn-outline-steelblue { background-color: transparent; border: 1px solid #395382; box-shadow: none !important; color: #395382; transition: all 0.3s; }
.btn-outline-steelblue:not(:disabled):not(.disabled):hover,
.show>.btn-outline-steelblue:not(:disabled):not(.disabled).dropdown-toggle { background-color: #0090ff; border-color: #0090ff; color: white; }
.btn-outline-steelblue:not(:disabled):not(.disabled).active { background-color: #395382; border-color: #395382; color: white; }
.btn-outline-steelblue:disabled,
.btn-outline-steelblue.disabled { background-color: #f2f4f8; border-color: #f2f4f8; color: #cbd2e3; }
/* selected 별도 처리 */
.btn-outline-steelblue:not(:disabled):not(.disabled).selected { background-color: #0090ff; border-color: #0090ff; color: white; }

.input-outline-deepblue { background-color: transparent; border: 1px solid #ced4da; box-shadow: none !important; color: #001241; transition: all 0.3s; }
.input-outline-deepblue:not(:disabled):not(.disabled):hover,
.input-outline-deepblue:not(:disabled):not(.disabled):focus,
.input-outline-deepblue:not(:disabled):not(.disabled).focus,
.show>.input-outline-deepblue:not(:disabled):not(.disabled).dropdown-toggle { background-color: white; border-color: #001241; color: #001241; }
.input-outline-deepblue:disabled,
.input-outline-deepblue.disabled { background-color: #f2f4f8; border-color: #f2f4f8; color: #cbd2e3; }

.label-outline-deepblue { background-color: transparent; border: 1px solid #ced4da; color: #001241; transition: all 0.3s; }
.label-outline-deepblue.focus { background-color: white; border-color: #001241; color: #001241; }
.label-outline-deepblue.disabled { background-color: #f2f4f8; border-color: #f2f4f8; color: #cbd2e3; }

.label-skyblue { background-color: #cbd2d3; border: 1px solid transparent; box-shadow: none !important; color: #001241; cursor: default !important; transition: all 0.3s; }

.btn-text { background-color: transparent; border: 1px solid transparent; box-shadow: none !important; color: #001241 !important; text-decoration: underline; transition: all 0.3s; }
.btn-text:hover { color: #0090ff !important; text-decoration: underline; }
.btn-text.selected { color: #0090ff !important; text-decoration: underline; }
.btn-text:focus { background-color: transparent; border: 1px solid transparent; }
.btn-text:disabled { color: #cbd2e3 !important; }

.btn-tab { background-color: transparent; border: 1px solid transparent; box-shadow: none !important; color: #cbd2e3 !important; text-decoration: none; transition: all 0.3s; }
.btn-tab:hover { color: #0090ff !important; }
.btn-tab.selected { color: #001241 !important; text-decoration: underline; font-weight: bold; }
.btn-tab.selected small { font-weight: bold; }

.btn-label { background-color: transparent; border: 1px solid transparent; box-shadow: none !important; color: #001241 !important; cursor: default !important; transition: all 0.3s; }

.btn-status-off { background-color: #8e8f92; border: 1px solid transparent; box-shadow: none !important; color: white; transition: all 0.3s; }
.btn-status-off:not(:disabled):not(.disabled):hover,
.show>.btn-status-off:not(:disabled):not(.disabled).dropdown-toggle { background-color: #0090ff; color: white; }
.btn-status-off:not(:disabled):not(.disabled).active { background-color: #0090ff; color: white; }
.btn-status-off:disabled,
.btn-status-off.disabled { background-color: #f2f4f8; color: #cbd2e3; }

.btn-status-on { background-color: #9ed244; border: 1px solid transparent; box-shadow: none !important; color: white; transition: all 0.3s; }
.btn-status-on:not(:disabled):not(.disabled):hover,
.show>.btn-status-on:not(:disabled):not(.disabled).dropdown-toggle { background-color: #0090ff; color: white; }
.btn-status-on:not(:disabled):not(.disabled).active { background-color: #0090ff; color: white; }
.btn-status-on:disabled,
.btn-status-on.disabled { background-color: #f2f4f8; color: #cbd2e3; }

.btn-status-error { background-color: #ff8800; border: 1px solid transparent; box-shadow: none !important; color: white; transition: all 0.3s; }
.btn-status-error:not(:disabled):not(.disabled):hover,
.show>.btn-status-error:not(:disabled):not(.disabled).dropdown-toggle { background-color: #0090ff; color: white; }
.btn-status-error:not(:disabled):not(.disabled).active { background-color: #0090ff; color: white; }
.btn-status-error:disabled,
.btn-status-error.disabled { background-color: #f2f4f8; color: #cbd2e3; }

.btn-status-abnormal { background-color: #ffc830; border: 1px solid transparent; box-shadow: none !important; color: white; transition: all 0.3s; }
.btn-status-abnormal:not(:disabled):not(.disabled):hover,
.show>.btn-status-abnormal:not(:disabled):not(.disabled).dropdown-toggle { background-color: #0090ff; color: white; }
.btn-status-abnormal:not(:disabled):not(.disabled).active { background-color: #0090ff; color: white; }
.btn-status-abnormal:disabled,
.btn-status-abnormal.disabled { background-color: #f2f4f8; color: #cbd2e3; }

.btn-status-on2 { background-color: #001241; border: 1px solid transparent; box-shadow: none !important; color: white; transition: all 0.3s; }
.btn-status-on2:not(:disabled):not(.disabled):hover,
.show>.btn-status-on2:not(:disabled):not(.disabled).dropdown-toggle { background-color: #0090ff; color: white; }
.btn-status-on2:not(:disabled):not(.disabled).active { background-color: #0090ff; color: white; }
.btn-status-on2:disabled,
.btn-status-on2.disabled { background-color: #f2f4f8; color: #cbd2e3; }

.btn-outline-status-on { background-color: transparent; border: 1px solid #9ed244; box-shadow: none !important; color: #9ed244; transition: all 0.3s; }
.btn-outline-status-on:not(:disabled):not(.disabled):hover,
.show>.btn-outline-status-on:not(:disabled):not(.disabled).dropdown-toggle { background-color: #0090ff; border-color: #0090ff; color: white; }
.btn-outline-status-on:not(:disabled):not(.disabled).active { background-color: #9ed244; border-color: #9ed244; color: white; }
.btn-outline-status-on:disabled,
.btn-outline-status-on.disabled { background-color: #f2f4f8; border-color: #f2f4f8; color: #cbd2e3; }

.btn-outline-status-error { background-color: transparent; border: 1px solid #ff8800; box-shadow: none !important; color: #ff8800; transition: all 0.3s; }
.btn-outline-status-error:not(:disabled):not(.disabled):hover,
.show>.btn-outline-status-error:not(:disabled):not(.disabled).dropdown-toggle { background-color: #0090ff; border-color: #0090ff; color: white; }
.btn-outline-status-error:not(:disabled):not(.disabled).active { background-color: #ff8800; border-color: #ff8800; color: white; }
.btn-outline-status-error:disabled,
.btn-outline-status-error.disabled { background-color: #f2f4f8; border-color: #f2f4f8; color: #cbd2e3; }

.btn-outline-status-abnormal { background-color: transparent; border: 1px solid #ffc830; box-shadow: none !important; color: #ffc830; transition: all 0.3s; }
.btn-outline-status-abnormal:not(:disabled):not(.disabled):hover,
.show>.btn-outline-status-abnormal:not(:disabled):not(.disabled).dropdown-toggle { background-color: #0090ff; border-color: #0090ff; color: white; }
.btn-outline-status-abnormal:not(:disabled):not(.disabled).active { background-color: #ffc830; border-color: #ffc830; color: white; }
.btn-outline-status-abnormal:disabled,
.btn-outline-status-abnormal.disabled { background-color: #f2f4f8; border-color: #f2f4f8; color: #cbd2e3; }

.btn-outline-status-on2 { background-color: transparent; border: 1px solid #001241; box-shadow: none !important; color: #001241; transition: all 0.3s; }
.btn-outline-status-on2:not(:disabled):not(.disabled):hover,
.show>.btn-outline-status-on2:not(:disabled):not(.disabled).dropdown-toggle { background-color: #0090ff; border-color: #0090ff; color: white; }
.btn-outline-status-on2:not(:disabled):not(.disabled).active { background-color: #001241; border-color: #001241; color: white; }
.btn-outline-status-on2:disabled,
.btn-outline-status-on2.disabled { background-color: #f2f4f8; border-color: #f2f4f8; color: #cbd2e3; }

.btn-rounded { border-radius: 15px 15px 15px 15px; }
.btn-hide { visibility: hidden; }
.btn-wide { min-width: 150px; width: 150px; }
.btn-dong { min-width: 100px; width: 100px; }
.btn-ho { min-width: 80px; width: 80px; }
.btn-check { min-width: 40px; width: 40px; }
.btn-lobby-phone { min-width: 180px; width: 80px; }
.btn-server { min-width: 220px; width: 220px; min-height: 100px; height: 100px; }
.control-label { min-width: 90px; width: 80px; }
.control-label-wide { min-width: 120px; width: 120px; }
.control-item { min-width: 80px; width: 80px; }
.control-item-2x { min-width: 160px; width: 160px; }
.control-item-area { min-width: 165px; width: 165px; }
.btn-yyyymmdd { min-width: 120px; width: 120px; }
.btn-hhmm { min-width: 80px; width: 80px; }
.btn-2word { min-width: 60px; width: 60px; }

.rounded-left-0 { border-top-left-radius: 0px; border-bottom-left-radius: 0px; }
.rounded-right-0 { border-top-right-radius: 0px; border-bottom-right-radius: 0px; }
.border-right-none { border-right: 0px !important; }

.dropdown-menu { border: 1px solid #001241; }

.dropdown-item { color: #001241; }
.dropdown-item:not(:disabled):not(.disabled):hover { background-color: #c3d7ee; color: #001241; }
.dropdown-item.selected { background-color: #c3d7ee; color: #001241; }
.dropdown-item:disabled,
.dropdown-item.disabled { background-color: #f2f4f8; border-color: #f2f4f8; color: #cbd2e3; }
.dropdown-item.small { font-size: 0.875rem; padding-left: 0px; padding-right: 0px; text-align: center; }

.bootstrap-select { max-width: 100%; }

.status-off { color: #8e8f92; }
.status-on { color: #9ed244; }
.status-error { color: #ff8800; }
.status-abnormal { color: #ffc830; }
.status-on2 { color: #001241; }

.deepblue { color: #001241; }
.skyblue { color: #0090ff; }

table.table thead { background-color: #f2f4f8; position:sticky; top:0px; z-index: 1; }
table.table thead tr th { border: none !important; border-left: 1px solid white !important; border-right: 1px solid white !important; vertical-align: middle; }
table.table tbody tr th,
table.table tbody tr td { border: none !important; border-left: 1px solid white !important; border-right: 1px solid white !important; border-bottom:1px solid #f2f4f8 !important; vertical-align: middle; }

.tooltip-info { color: #8e8f92; transition: all 0.3s; }
.tooltip-info:hover { color: #001241; cursor: pointer; }

/*.custom-control { padding-left: 1.3rem; }*/
.custom-control-label { border:none; padding-top: 0.16rem; }
.custom-control-label::after { left: -1.11rem/*-1.17rem*/; /*top: 0.30rem;*/ }
.custom-control-input-deepblue~.custom-control-label::before {
  border-color: #001241 !important;
  border-radius: 15%;
  box-shadow: 0 0 0 0rem rgba(255, 0, 0, 0.25) !important;
  left: -1.25rem/*-1.3rem*/; top: 0.2rem;
  width: 1rem; height: 1rem;
  transition: all 0.3s;
}
.custom-checkbox .custom-control-input:checked~.custom-control-label::after {
  background-image: none;
  color: white;
  content: "\f00c" !important;
  font-family: FontAwesome;
  font-size: 0.9em;
  text-align: left !important;
}
.custom-control-input-deepblue:focus~.custom-control-label::before { border-color: #001241 !important; box-shadow: 0 0 0 0rem rgba(255, 0, 0, 0.25) !important; }
.custom-control-input-deepblue:checked~.custom-control-label::before { background-color: #001241 !important; border-color: #001241 !important; }
.custom-control-input-deepblue:focus:not(:checked)~.custom-control-label::before { border-color: #001241 !important; }
.custom-control-input-deepblue:checked:active~.custom-control-label::before { background-color: #001241 !important; border-color: #001241 !important; }
.custom-control-input-deepblue:not(:checked):active~.custom-control-label::before { background-color: transparent !important; border-color: #001241 !important; }
.custom-control-input-deepblue:not(:disabled):checked:hover~.custom-control-label::before { background-color: #0090ff !important; border-color: #0090ff !important; }
.custom-control-input-deepblue:not(:disabled):not(:checked):hover~.custom-control-label::before { background-color: transparent !important; border-color: #0090ff !important; }
.custom-control-input-deepblue:not(:disabled):checked.hover~.custom-control-label::before { background-color: #0090ff !important; border-color: #0090ff !important; }
.custom-control-input-deepblue:not(:disabled):not(:checked).hover~.custom-control-label::before { background-color: transparent !important; border-color: #0090ff !important; }

.gj-picker-bootstrap { left: calc(50vw - 162px) !important; top: calc(50vh - 156px) !important; color: #001241; font-size: 1.1em; }
.gj-picker-bootstrap table thead { background-color: transparent !important; }
.gj-picker-bootstrap table thead tr th:first-of-type div { color: #ff8800; }
.gj-picker-bootstrap table thead tr th:nth-child(n+2) div { color: #8e8f92; }
.gj-picker-bootstrap table tbody tr th,
.gj-picker-bootstrap table tbody tr td { border: none !important; }
.gj-picker-bootstrap table tr td.focused div,
.gj-picker-bootstrap table tbody tr th div:hover,
.gj-picker-bootstrap table tbody tr td div:hover { background-color: #0090ff !important; color: white !important; border-radius: 5px !important; transition: all 0.3s; }
.gj-picker-bootstrap table tr td div,
.gj-picker-bootstrap table tr th div { width: 40px !important; height: 40px !important; line-height: 40px !important; }
.gj-picker-bootstrap table tr td.disabled div,
.gj-picker-bootstrap table tr th.disabled div { cursor: default !important; }
.gj-picker-bootstrap table tr td.disabled div:hover,
.gj-picker-bootstrap table tr th.disabled div:hover { background-color: transparent !important; color: #777 !important; cursor: default !important; }
.gj-picker-bootstrap [role="navigator"] div:first-child.disabled,
.gj-picker-bootstrap [role="navigator"] div:last-child.disabled { color: #777; cursor: default; }
[type="year"],[type="decade"],[type="century"].gj-picker-bootstrap { left: calc(50vw - 100px) !important; /*top: calc(50vh - 94px) !important;*/ top: calc(50vh - 156px) !important; }
[type="month"].gj-picker-bootstrap table tr td.selected.gj-cursor-pointer div { background-color: #001241 !important; }
[type="year"].gj-picker-bootstrap table tr td.selected div { background-color: #001241 !important; color: white !important; border-radius: 5px !important; }

.color-001241-force { color: #001241!important; }
.color-8e8f92 { color: #8e8f92; }
.color-ff8800 { color: #ff8800; }
.color-0090ff { color: #0090ff; }
.color-395382 { color: #395382; }
.color-c3d7ee { color: #c3d7ee; }
.color-cbd2e3 { color: #cbd2e3; }
.color-ffc830 { color: #ffc830; }
.color-white { color: white; }
.color-black { color: black; }
.bg-fafafa { background-color: #fafafa; }
.bg-395382 { background-color: #395382; }
.bg-c3d7ee { background-color: #c3d7ee; }
.bg-cbd2e3 { background-color: #cbd2e3; }
.bg-ffc830 { background-color: #ffc830; }
.bg-ff8800 { background-color: #ff8800; }
.bg-9ed244 { background-color: #9ed244; }
.bg-88bb55 { background-color: #88bb55; }
.bg-dd6600 { background-color: #dd6600; }
.gap-3 { row-gap: 3px; column-gap: 3px; }
.gap-5 { row-gap: 5px; column-gap: 5px; }
.gap-10 { row-gap: 10px; column-gap: 10px; }
.gap-15 { row-gap: 15px; column-gap: 15px; }
.gap-20 { row-gap: 20px; column-gap: 20px; }
.w-200 { width: 200px; }
.w-250 { width: 250px; }
.w-20 { width: 20%!important; }
.mw-80 { min-width: 80px; }
.mw-60 { min-width: 60px; }
.mw-250 { min-width: 250px; }
.mw-400 { min-width: 400px; }
.mh-200 { min-height: 200px; }
.mh-210 { min-height: 210px; }
.mh-240 { min-height: 240px; }
.mh-276 { min-height: 276px; }
.max-width-0 { max-width: 0px; }
.max-width-400 { max-width: 400px; }
.max-height-240 { max-height: 240px; }
.max-height-276 { max-height: 276px; }
.opacity-0 { opacity: 0.0; }
.opacity-60 { opacity: 0.6; }
.opacity-80 { opacity: 0.8; }
.z-index-1 { z-index: 1; }
.z-index-2 { z-index: 2; }
.z-index-3 { z-index: 3; }
.ml-dot5 { margin-left: 0.125rem!important; }
.mr-dot5 { margin-right: 0.125rem!important; }

[graph][indoor-temp] { height: 180px; }
[settings][energy-usage], [settings][indoor-temp], [legend][indoor-temp] { border: 1px solid #cbd2e3; padding: 5px 15px 5px 15px; }
[graph][energy-usage] { height: 180px; }

#waiting .progress { width: 150px; height: 15px; }
#waiting .progress-bar { background-color: #001241; }

.bootstrap-select.text-center .filter-option { text-align: center; }

.blur { filter:blur(1px); -webkit-filter:blur(1px); }
.leisurely { -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; }

div.ellipsis { position: relative; }
div.ellipsis > span.ellipsis { overflow: hidden; position: absolute; left: 0px; top: 0px; width: 100%; white-space: nowrap; text-overflow: ellipsis; }
table.table tbody tr td.ellipsis { vertical-align:unset; }

.ellipsis-lines-1 { text-overflow: ellipsis; overflow: hidden; -webkit-line-clamp: 1; display: -webkit-box; -webkit-box-orient: vertical; white-space: normal!important; }
.ellipsis-lines-2 { text-overflow: ellipsis; overflow: hidden; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; white-space: normal!important; }
.ellipsis-lines-3 { text-overflow: ellipsis; overflow: hidden; -webkit-line-clamp: 3; display: -webkit-box; -webkit-box-orient: vertical; white-space: normal!important; }
.ellipsis-lines-4 { text-overflow: ellipsis; overflow: hidden; -webkit-line-clamp: 4; display: -webkit-box; -webkit-box-orient: vertical; white-space: normal!important; }
.ellipsis-lines-5 { text-overflow: ellipsis; overflow: hidden; -webkit-line-clamp: 5; display: -webkit-box; -webkit-box-orient: vertical; white-space: normal!important; }