@charset "utf-8";
@keyframes spaceboots {
  0% {
    transform: translate(2px, 1px) rotate(0deg);
  }
  10% {
    transform: translate(-1px, -2px) rotate(-1deg);
  }
  20% {
    transform: translate(-2px, 0px) rotate(1deg);
  }
  30% {
    transform: translate(0px, 2px) rotate(0deg);
  }
  40% {
    transform: translate(1px, -1px) rotate(1deg);
  }
  50% {
    transform: translate(-1px, 2px) rotate(-1deg);
  }
  60% {
    transform: translate(-2px, 1px) rotate(0deg);
  }
  70% {
    transform: translate(2px, 1px) rotate(-1deg);
  }
  80% {
    transform: translate(-1px, -1px) rotate(1deg);
  }
  90% {
    transform: translate(2px, 2px) rotate(0deg);
  }
  100% {
    transform: translate(1px, -2px) rotate(-1deg);
  }
}

@font-face {
  font-family: 'myriad-pro-semibold';
  src: url('../fonts/MYRIADPRO-SEMIBOLD.woff');
}

::-webkit-scrollbar {
  background: rgb(0, 0, 0);
  background: var(--main-bg-color-default);
  margin-left:0.3125rem;
  margin-right:0.3125rem;
  width:0.625rem;
  cursor:pointer;
  height:0.625rem;
}
::-webkit-scrollbar-track {
  -webkit-box-shadow: none;
  cursor:pointer;
}
::-webkit-scrollbar-thumb {
  background-color: #FFF;
  background-color: var(--heading-white-on-black);
  outline: none;
  border-radius:3.125rem;

  border-right:0.125rem solid #171818;
  border-left:0.125rem solid #171818;
  border-top:0.125rem solid #171818;
  border-bottom:0.125rem solid #171818;

  border-right:0.125rem solid var(--grid-item-bg-color);
  border-left:0.125rem solid var(--grid-item-bg-color);
  border-top:0.125rem solid var(--grid-item-bg-color);
  border-bottom:0.125rem solid var(--grid-item-bg-color);
  -webkit-box-shadow:none;
  cursor:pointer;
}

body,
html {
  -webkit-tap-highlight-color: transparent !important;
  scrollbar-color: var(--heading-white-on-black) var(--main-bg-color-default);
  scrollbar-width: thin;
}

.shake:focus,
.shake:hover {
  animation-name: spaceboots;
  animation-duration: 0.8s;
  transform-origin: 50% 50%;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

#live-view-header #toggle-buttons-grp {
  top: 0.4375rem;
}

body {
  background: rgb(0, 0, 0);
  background: var(--main-bg-color-default);
}

#main-page-grid .grid-stack-item-content {
  background: #171818;
  background: var(--grid-item-bg-color);
  /* border-radius: 9px; */
  border: 0.1875rem solid #080808;
  border: var(--border-width) solid var(--grid-item-border-color);
  border-bottom: var(--border-bottom-width) solid var(--grid-item-border-color) !important;
  display: block;
  left: 0.3125rem;
  right: 0.3125rem;
  padding-bottom: 0.3125rem;
}

.grid-stack-item-content.ui-draggable-handle {
  -ms-touch-action: auto;
  touch-action: auto;
}

#live-view-header {
  display: block;
  float: left;
  width: 100%;
  height: auto;
  margin-bottom: 0.625rem;
  z-index: 999;
  position: relative;
  margin-top: 0.625rem;
  border-bottom: var(--border-bottom-width) solid var(--grid-item-header-border-color) !important;
  
}

.headerLiveViewWrapper {
  float: left;
  height: auto;
}

.headerLiveViewWrapper.small {
  background: #000;
  background: var(--floating-menu-bg);
}

.headerLiveViewWrapper.small #live-view-header {
  margin-bottom: 0;
}

.headerLiveViewWrapper.small #live-view-menu {
  border: 0;
  background: #000;
  background: var(--floating-menu-bg);
}

.headerLiveViewWrapper.small #live-view-menu nav {
  padding: 0;
}

.headerLiveViewWrapper.small #live-view-header .heading {
  font-size: 1.625rem;
}

/*.headerLiveViewWrapper.small .add-section-button-wrapper {
  padding: 0;
}

.headerLiveViewWrapper.small .add-section-button-wrapper {
  min-width: 36px;
  height: 36px;
}*/

.headerLiveViewWrapper.small #add-section-button {
  min-width: 2.25rem;
}

#live-view-header .heading {
  color: var(--heading-white-on-black);
  font-size: 1.875rem;
  padding: 0.625rem 0;
  line-height: 1.875rem;
}

#live-view-menu {
  display: block;
  float: left;
  width: 100%;
  height: auto;
  background: #171818;
  background: var(--grid-item-bg-color);
  border: 0.1875rem solid #080808;
  border: 0.0625rem solid var(--grid-navbar-border-color);
  position: relative;
  /* border-radius: 9px; */
  overflow: hidden;
  min-height:2.875rem;
}

/*.add-section-button-wrapper {
  display: block;
  float: right;
  position: absolute;
  
  right: 45px;
  top: 0;
  width: auto;
  min-width: 46px;
  height: 46px;
  padding: 5px;
  z-index: 12;
  background: #171818;
  background: var(--grid-item-bg-color);
  border-radius: 9px;
}*/

#add-section-button {
  display: inline-block;
  width: auto;
  min-width: 2.5rem;
  height: 100%;
  background: #4BB3CA;
  /* background: linear-gradient(180deg, #4BB3CA 0%, #3279B5 100%);*/
  background: var(--grid-item-bg-color);
  /* background: linear-gradient(180deg, var(--button-blue-bg-top) 0%, var(--button-blue-bg-bottom) 100%);*/
  text-decoration: none;
  border: 0;
  color: #FFF;
  border-radius: 0.3125rem;
  padding: 0;
  transition: all .3s ease-in-out;
  display: flex;
  justify-content: center;
  align-items: center;
  float: left;
}
#global-grid-settings-button{
  display: inline-block;
  width: auto;
  width: 2.5rem;
  height: 2.25rem;
  background: #4BB3CA;
  /* background: linear-gradient(180deg, #4BB3CA 0%, #3279B5 100%); */
  background: var(--grid-item-bg-color);
  /* background: linear-gradient(180deg, var(--button-blue-bg-top) 0%, var(--button-blue-bg-bottom) 100%);*/
  text-decoration: none;
  border: 0;
  color: #FFF;
  border-radius: 0.3125rem;
  padding: 0 0.125rem;
  transition: background .3s ease-in-out;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: 0.3125rem;
  top: 0.3125rem;
  z-index: 5;
}
#add-section-button:hover,
#global-grid-settings-button:hover{
  background: var(--button-blue-bg-bottom)
}
#global-grid-settings-button svg{
  width: 80%;
  height: auto;
  fill: #FFF;
  fill: var(--svg-fill);  
}

#global-grid-refresh-button{
  display: inline-block;
  width: auto;
  width: 2.5rem;
  height: 2.25rem;
  background: #4BB3CA;
  /* background: linear-gradient(180deg, #4BB3CA 0%, #3279B5 100%); */
  background: var(--grid-item-bg-color);
  /* background: linear-gradient(180deg, var(--button-blue-bg-top) 0%, var(--button-blue-bg-bottom) 100%);*/
  text-decoration: none;
  border: 0;
  color: #FFF;
  border-radius: 0.3125rem;
  padding: 0 0.125rem;
  transition: background .3s ease-in-out;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: 5.8375rem;
  top: 0.3125rem;
  float:left;
  z-index: 5;
}
#global-grid-refresh-button:hover{
  background: var(--button-blue-bg-bottom)
}
#global-grid-refresh-button svg{
  width: 80%;
  height: auto;
  fill: #FFF;
  fill: var(--svg-fill);  
}

#global-grid-autorefresh-button{
  display: inline-block;
  width: auto;
  width: 2.5rem;
  height: 2.25rem;
  background: #4BB3CA;
  /* background: linear-gradient(180deg, #4BB3CA 0%, #3279B5 100%); */
  background: var(--grid-item-bg-color);
  /* background: linear-gradient(180deg, var(--button-blue-bg-top) 0%, var(--button-blue-bg-bottom) 100%);*/
  text-decoration: none;
  border: 0;
  color: #FFF;
  border-radius: 0.3125rem;
  padding: 0 0.125rem;
  transition: background .3s ease-in-out;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: 3.125rem;
  top: 0.3125rem;
  float:left;
  z-index: 5;
  -moz-transform: rotate(90deg) scaleX(-1);
  -webkit-transform: rotate(90deg) scaleX(-1);
  transform: rotate(90deg) scaleX(-1);
  margin-top: 0.0625rem;
}
#global-grid-autorefresh-button:hover{
  background: var(--button-blue-bg-bottom)
}
#global-grid-autorefresh-button svg{
  width: 80%;
  height: auto;
  fill: #FFF;
  fill: var(--svg-fill);  
}

@-moz-keyframes auto-refreshs-spin { 100% { -moz-transform: rotate(-360deg); } }
@-webkit-keyframes auto-refreshs-spin { 100% { -webkit-transform: rotate(-360deg); } }
@keyframes auto-refreshs-spin { 100% { -webkit-transform: rotate(-360deg); transform:rotate(-360deg); } }

#global-grid-autorefresh-button.enabled.refreshing svg path {
  animation: refreshing-animation 1s infinite normal;
  -webkit-animation: refreshing-animation 1s infinite normal;
}

@keyframes refreshing-animation {
  0% { fill: #3eba01; }
  50% { fill: #000; }
  100% { fill: #3eba01; }
}

@-webkit-keyframes refreshing-animation {
  0% { fill: #3eba01; }
  50% { fill: #000; }
  100% { fill: #3eba01; }
}

#global-grid-autorefresh-button.enabled svg {
  -webkit-animation: auto-refreshs-spin 4s linear infinite;
  -moz-animation: auto-refreshs-spin 4s linear infinite;
  animation: auto-refreshs-spin 4s linear infinite;
}

#add-section-button .label {
  font-size: 1rem;
  padding: 0;
  width: 0;
  overflow: hidden;
  transition: width 1s ease-in-ou;
}

#add-section-button span {
  margin: 0 !important;
  font-size: 1.3125rem;
  transition: all .3s ease-in-out;
}

#live-view-menu nav {
  display: block;
  float: left;
  width: 100%;
  height: 2.875rem;
  padding: 0.3125rem;
  /*padding-right: 46px;*/
  /*padding-right: 95px;*/
  padding-right: 8.9375rem;
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
}

#live-view-menu nav ul {
  display: inline-block;
  /* float: left; */
  width: 100%;
  height: auto;
  padding: 0;
  margin: 0;
  height: 2.25rem !important;
  position: relative;
  max-width: 100%;
  box-sizing: border-box;
  overflow-x: scroll;
}

.gridly::-webkit-scrollbar {
  display: none;
}

.gridly::-moz-scrollbar {
  display: none;
}

.gridly {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

#live-view-menu nav li {
  list-style: none;
  /*padding-right: 5px;*/
  height: 2.25rem;
  display: block;
  float: left;
  width: 9.375rem;
}

#live-view-menu nav li:last-child {
  padding: 0;
}

#live-view-menu nav li a {
  display: inline-block;
  color: var(--top-nav-unactive-color);
  height: 100%;
  width: auto;
  min-width: 145px;
  line-height: 2.25rem;
  vertical-align: middle;
  padding-left: 0.625rem;
  padding-right: 0.625rem;
  background: #252727;
  background: var(--button-black-background);
  border-radius: 0.3125rem;
  border: 0.0625rem solid var(--button-black-border);
  text-align: center;
  font-size: 0.9375rem;
  transition: all .3s ease-in-out;
  cursor: pointer;
  width:96%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#live-view-menu nav li a:hover {
  background: var(--button-blue-bg-bottom);
  /* background: linear-gradient(180deg, var(--button-blue-bg-top) 0%, var(--button-blue-bg-bottom) 100%); */
  border: 0.0625rem solid var(--button-blue-bg-bottom);
  text-decoration: none;
  transition: all .3s ease-in-out;
}

#live-view-menu nav li a.active {
  background: var(--button-blue-bg-bottom);
  border: 0.0625rem solid var(--button-blue-bg-bottom);
  /* background: linear-gradient(180deg, var(--button-blue-bg-top) 0%, var(--button-blue-bg-bottom) 100%); */
  text-decoration: none;
}

#main-page-grid {
  display: block;
  float: left;
  width: 100%;
  height: auto;
  width: calc(100% + 0.625rem);
  margin-left: -0.3125rem;
  /*margin-bottom: 100px;*/
  margin-top: 0.1875rem; 
}

.grid-stack-item-content-wrapper {
  margin: 0;
  position: absolute;
  top: 0;
  left: 0.3125rem;
  right: 0.3125rem;
  bottom: 0;
  width: auto;
  overflow-x: hidden;
  /*overflow-y: auto;*/
  left: 0 !important;
  right: 0 !important;
  overflow-y: hidden !important;
  /* border-radius: 9px !important; */
}
#liveViewBlock{
  z-index:6;
}
#liveViewBlock .grid-stack-item-content-wrapper {
  overflow-y: auto !important;
}
#projectDescriptionBlock .grid-stack-item-content-wrapper,
#mapBlock .grid-stack-item-content-wrapper{
  overflow-y: hidden !important;
}
.content-hider {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9;
  background: rgba(0, 0, 0, 0.5);
  display: none;
  cursor: pointer;
  background: var(--button-blue-bg-bottom);
  /* background: linear-gradient(180deg, rgb(84 145 164 / 70%) 0%, rgb(69 122 178 / 100%) 100%); */
  cursor:move;
  font-size:2.25rem;
  z-index: 100;
  opacity: 0.8;
}
/*.userHeight .content-hider{
  background-color: red;
}*/
.grid-stack-item-th .ui-resizable-handle.ui-resizable-se{
  /* z-index: 99 !important; */
  z-index: 6 !important;
}
.flex-wrapper{
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
}

.subcontent-hider {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9;
  background: rgba(0, 0, 0, 0.5);
  display: none;
  cursor: pointer;
}

/*.add-section-button-wrapper ul {
  padding: 10px;
  margin: 0;
  background: var(--main-gradient-top);
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

.add-section-button-wrapper ul li {
  list-style: none;
}

.add-section-button-wrapper ul li label {
  position: relative;
  top: -2px;
}

.add-section-button-wrapper ul li:last-child label {
  margin-bottom: 0;
}*/

/*.grid-controls {
  padding: 0;
  background: rgba(33, 35, 35, 1);
  background: var(--grid-controls-bg);
  display: none;
  float: left;
  border-radius: 5px;
  width: 50px;
  margin-top: 5px;
  margin-bottom: 5px;
  overflow: hidden;
  transition: all .3s ease-in-out;
  margin-left: 2px;
}*/

.grid-controls {
  padding: 0.3125rem;
  background: rgba(33, 35, 35, 1);
  background: var(--grid-controls-bg);
  border-radius: 0.3125rem;
  margin-top: 0.3125rem;
  margin-bottom: 0.3125rem;
  overflow: hidden;
  transition: all .3s ease-in-out;
}
.grid-controls .hiddenList{
  padding:0;
  display:block;
  float:left;
  width:100%;
  height:auto;
  margin-bottom:0;
}
.grid-controls .hiddenList .label{
  font-size: 100%;
  font-weight: normal;
  color: var(--text-white-on-black);
}
.grid-controls .hiddenList .label:hover{
  text-decoration: none !important;
  
}
.grid-controls .hiddenList li:hover .label{
  text-decoration: none !important;
  /* color: #FFF; */
}
/*.grid-controls li {
  list-style: none;
  float: left;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}*/
.grid-controls li {
  list-style: none;
  float: left;
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  cursor:pointer;
  border-radius:0.3125rem;
  padding:0.3125rem;
}

.grid-controls li:hover:not(#saveNewMessagePlaceholder):not(#tokenOptionsPlaceholder) {
  background: #3279B5;
  background: linear-gradient(180deg, #4BB3CA 0%, #3279B5 100%);
  background: var(--button-blue-bg-bottom);
  background: linear-gradient(180deg, var(--button-blue-bg-top) 0%, var(--button-blue-bg-bottom) 100%);
}

.grid-controls li a {
  display: flex;
  /*justify-content: center;*/
  align-items: center;
  width: 100%;
  color: #fff;
  color: var(--grid-controls-li-a-color);
  text-align: center;
  padding: 0.3125rem 0;
  text-decoration: none;
}
.grid-controls li a:hover{
  text-decoration: none;
}
.grid-controls li a svg {
  width: 2.375rem;
  height: auto;
  fill: #FFF;
  fill: var(--svg-fill-navigation);
}
.grid-controls li a .svg2 {
  width: 2.375rem;
  height: auto;
  stroke: #FFF;
  stroke: var(--svg-fill-navigation);
}
.grid-controls li:hover a .svg2 {
  stroke: #FFF;
  stroke: var(--svg-fill-navigation-on-hover);
}
.grid-controls li a img {
  width: 2.375rem;
  height: auto;
  fill: #FFF;
  fill: var(--svg-fill-navigation);
}
.grid-controls li:hover a svg{
  fill: var(--svg-fill-navigation-on-hover);
}
.grid-controls li:hover a img{
  fill: var(--svg-fill-navigation-on-hover);
}
#liveViewBlock .grid-stack-item-content-restyle {
  border: 0;
  background: none;
}

.grid-stack-item-content2 {
  float: left;
  background: #171818;
  background: var(--grid-item-bg-color);
  /* border-radius: 9px; */
  border: 0.1875rem solid #080808;
  border: var(--border-width) solid var(--grid-item-border-color);
  display: block;
  left: 0.3125rem;
  right: 0.3125rem;
  /*position: absolute;*/
  top: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
}
#projectDescriptionBlock .grid-stack-item-content2,
#mapBlock  .grid-stack-item-content2{
  border:0;
}

.grid-stack-item-content-wrapper2 {
  width: 100%;
  height: 100%;
  display: block;
  float: left;
  /* border-radius: 9px; */
  position: relative;
}

.live-gridstack {
  margin-left: -0.3125rem;
  margin-right: -0.3125rem;
}

.grid-stack>.grid-stack-item>.ui-resizable-se {
  right: 0.5rem;
  bottom: 0.3125rem;
  background-color: rgb(255, 255, 255);
  background-color: var(--resize-handler-bg);
  background-image: var(--resizer-image) !important;
  border-radius: 6.25rem;
}
.grid-stack-item .grid-stack-item-content-wrapper .ui-resizable-se {
  right: 0.5rem;
  bottom: 0.3125rem;
  background-color: rgb(255, 255, 255);
  background-color: var(--resize-handler-bg);
  background-image: var(--resizer-image) !important;
  border-radius: 6.25rem;
}
.grid-stack>.grid-stack-item>.ui-resizable-se:hover,
.grid-stack-item .grid-stack-item-content-wrapper .ui-resizable-se:hover {
  background-color: var(--resize-handler-hover-bg);
}
#live-view-menu .paddles-live {
  display: none;
}
#live-view-menu .paddles-live.showPaddlesConst {
  display: block !important;
}

#live-view-menu:hover .paddles-live {
  display: block;
}
/*
#live-view-menu[min-width~="885px"]:hover .paddles-live {
  display: none;
}*/

.paddle-live {
  position: absolute;
  top: 0;
  bottom: 0;
  height: 100%;
  border: 0;
  width: 2.25rem;
  font-family: 'myriad-pro-bold';
  z-index: 11;
  font-size:1rem;
}

.left-paddle-live {
  left: 0;
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&1+0,0+100 */
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 80%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 80%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 80%);


  background: -moz-linear-gradient(left, var(--paddles-bg-2) 0%,  var(--paddles-bg-1) 80%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(left,  var(--paddles-bg-2) 0%, var(--paddles-bg-1) 80%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right,  var(--paddles-bg-2) 0%, var(--paddles-bg-1) 80%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000', GradientType=1);
  /* IE6-9 */
  color:#FFF !important;
  color:var(--paddles-color) !important;
}

.left-paddle-live:hover {
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&1+0,0+100 */
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000', GradientType=1);
  /* IE6-9 */
}

.right-paddle-live {
  right: 8.9375rem; /*46px;*/
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+1,1+100 */
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 0) 1%, rgba(0, 0, 0, 1) 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(0, 0, 0, 20) 20%, rgba(0, 0, 0, 0) 1%, rgba(0, 0, 0, 1) 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 0) 1%, rgba(0, 0, 0, 1) 100%);


  background: -moz-linear-gradient(left, var(--paddles-bg-1) 20%, var(--paddles-bg-2) 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(left, var(--paddles-bg-1)  20%, var(--paddles-bg-2) 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, var(--paddles-bg-1)  20%, var(--paddles-bg-2) 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000', GradientType=1);
  /* IE6-9 */
  color:#FFF !important;
  color:var(--paddles-color) !important;
}
.right-paddle-live:hover {
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+1,1+100 */
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 1%, rgba(0, 0, 0, 0.6) 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(left, rgba(0, 0, 0, 20) 0%, rgba(0, 0, 0, 0) 1%, rgba(0, 0, 0, 0.6) 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 1%, rgba(0, 0, 0, 0.6) 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000', GradientType=1);
  /* IE6-9 */
}

.headerLiveViewWrapper.container-no-stations {
  padding-right: 2.25rem;
  padding-bottom:0;
}

/*.mCSB_scrollTools:hover,
.mCSB_scrollTools:focus {
  width: 6px !important;
}

.mCS-light.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  width: 100% !important;
}*/


/*.marker:hover .bottom .name{
    line-height: 21px !important;
    white-space: initial !important;
    text-overflow: clip !important;
}*/

.grid-nav-button svg {
  fill: #FFF;
  fill: var(--svg-fill-navigation);
  width: 2.375rem;
}

#map {
  min-height: 100% !important;
}

.status-list {
  z-index: 1040;
}

.side-bar {
  z-index: 1031;
  border-right: 0.0625rem solid #080808;
  background-color: #171818;
  border-right: 0.0625rem solid var(--grid-item-border-color);
  background-color: var(--grid-item-bg-color);
}

#unitSideBar {
  border-left: 0.0625rem solid #080808;
  background-color: #171818;
  border-left: 0.0625rem solid var(--grid-item-border-color);
  background-color: var(--grid-item-bg-color);
}

.main-menu-glyphicons {
  color: #FFF;
  color: var(--svg-fill-navigation);
  fill: #FFF;
  fill: var(--svg-fill-navigation);
}

.main-menu-glyphicons:hover {
  color: #FFF;
  color: var(--svg-fill-navigation-on-hover);
  fill: #FFF;
  fill: var(--svg-fill-navigation-on-hover);
}


/*.main-menu-glyphicons svg{
    fill:#FFF;
    fill:var(--svg-fill-navigation);
}*/

.main-menu-icons-list .main-menu-icons-description {
  color: #FFF;
  color: var(--svg-fill-navigation);
  fill: #FFF;
  fill: var(--svg-fill-navigation-on-hover);
}

.navbar-default .navbar-nav li a:hover .main-menu-glyphicons,
.navbar-default .navbar-nav li a.side-bar-icon-active .main-menu-glyphicons,
.navbar-default .navbar-nav li a:focus:not(.new-tab-link) .main-menu-glyphicons {
  color: #FFF !important;
  color: var(--svg-fill-on-hover) !important;
  fill: #FFF;
  fill: var(--svg-fill-navigation-on-hover);
}

.navbar-default .navbar-nav li a:hover .main-menu-glyphicons svg,
.navbar-default .navbar-nav li a.side-bar-icon-active .main-menu-glyphicons svg,
.navbar-default .navbar-nav li a:focus:not(.new-tab-link) .main-menu-glyphicons svg {
  color: #FFF !important;
  color: var(--svg-fill-on-hover) !important;
  fill: #FFF;
  fill: var(--svg-fill-navigation-on-hover);
}

.navbar-default .navbar-nav li a:hover .main-menu-glyphicons svg path,
.navbar-default .navbar-nav li a.side-bar-icon-active .main-menu-glyphicons svg path,
.navbar-default .navbar-nav li a:focus:not(.new-tab-link) .main-menu-glyphicons svg path {
  color: #FFF !important;
  color: var(--svg-fill-on-hover) !important;
  fill: #FFF;
  fill: var(--svg-fill-navigation-on-hover);
}

.navbar-default .navbar-nav li a:hover .main-menu-icons-description,
.navbar-default .navbar-nav li a.side-bar-icon-active .main-menu-icons-description,
.navbar-default .navbar-nav li a:focus:not(.new-tab-link) .main-menu-icons-description {
  color: #FFF !important;
  color: var(--svg-fill-on-hover) !important;
  fill: #FFF;
  fill: var(--svg-fill-navigation-on-hover);
}

.side-bar .svannet-logo-text {
  color: #DDD;
  color: var(--svannet-logo-panel);
}

#toggle-buttons-grp {
  color: var(--heading-white-on-black);
}

button.modal-content-box-btn {
  color: #FFF !important;
  color: var(--svg-fill-navigation) !important;
  border-color: #fff !important;
  border-color: var(--modalbox-btn-border) !important;
}

button.modal-content-box-btn.selected {
  color: #FFF !important;
  color: var(--heading-white-on-black) !important;
  border-color: #337ab7 !important;
  border-color: var(--modalbox-btn-border-selected) !important;
}

button.modal-content-box-btn:hover {
  color: #FFF !important;
  color: var(--heading-white-on-black) !important;
  background: var(--button-blue-bg-bottom) !important;  
}

.main-menu-glyphicons.glyphicons.glyphicons-log-out {
  color: #CCC !important;
  color: var(--svg-fill-text) !important;
}

#project-point-filters ul {
  padding: 0;
  margin: 0;
}

#project-point-filters ul li {
  list-style: none;
  margin-bottom: 0.3125rem;
}

#sideMenuWrapper .sideMenuContent {
  /*padding:20px;*/
}

#project-point-filters .glyphicon {
  padding-left: 0;
  padding-right: 0.3125rem;
}

#project-point-filters h4 {
  margin-top: 0;
}

.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: 0.0625rem solid transparent;
  background: #6198cf;
  /*background: var(--ui-state-default-bg);*/
  background: var(--svantek-accent-blue);
  font-weight: normal;
  color: #fff;
  color: var(--ui-state-default-color);
  height: 2.5rem;
  border-radius: 0;
  font-family: "myriad-pro-regular";
}
h3.ui-state-default,
.ui-widget-content h3.ui-state-default,
.ui-widget-header h3.ui-state-default{
  color: #fff;
  color: var(--ui-state-default-color-accordion);
}

h3.ui-state-default.ui-state-active,
.ui-widget-content h3.ui-state-default.ui-state-active,
.ui-widget-header h3.ui-state-default.ui-state-active{
  color: #fff;
  color: var(--ui-state-default-color);
}

h3.ui-state-default:hover .ui-icon, h3.ui-state-default:focus .ui-icon,
h3.ui-state-default.ui-state-active .ui-icon,
.ui-widget-content h3.ui-state-default.ui-state-active .ui-icon,
.ui-widget-header h3.ui-state-default.ui-state-active .ui-icon{
  background-image: var(--ui-icon-background-url) !important;
}
h3.ui-state-default .ui-icon,
h3.ui-state-default .ui-widget-content .ui-icon,
h3.ui-state-default .ui-button .ui-icon {
  background-image: var(--ui-icon-background-url-accordion) !important;
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
  border-style: none;
  font-weight: normal;
  color: #fff;
  color: var(--ui-state-default-color);
  height: 3.75rem;
  border-radius: 0;
  font-family: "myriad-pro-regular";
  background: #4BB3CA;
  /* background: linear-gradient(180deg, #4BB3CA 0%, #3279B5 100%); */
  background: var(--button-blue-bg-top);
  /* background: linear-gradient(180deg, var(--button-blue-bg-top) 0%, var(--button-blue-bg-bottom) 100%); */
}

.ui-accordion-header-icon {
  float: right;
  border-radius: 0.3125rem;
}


/*.ui-state-active .ui-accordion-header-icon{
    background-color: #4BB3CA;
    background-color: linear-gradient(180deg, #4BB3CA 0%, #3279B5 100%);
    background-color: var(--button-blue-bg-top);
    background-color: linear-gradient(180deg, var(--button-blue-bg-top) 0%, var(--button-blue-bg-bottom) 100%);
    
}*/

.ui-widget-content {
  border-style: none;
  background: transparent;
  color: #FFF;
  color: var(--text-white-on-black);
  font-family: "myriad-pro-regular";
}

.ui-accordion .ui-accordion-content {
  padding: 1.25rem;
  background: #171818 !important;
  background: var(--grid-item-bg-color) !important;
}

.ui-accordion .ui-accordion-header {
  display: flex;
  align-items: center;
  font-size: 1rem;
  flex-direction: row-reverse;
  justify-content: space-between;
}

.ui-icon,
.ui-widget-content .ui-icon,
.ui-button .ui-icon {
  background-image: var(--ui-icon-background-url);
}
.ui-icon,
.ui-widget-content .ui-icon {
	background-image: var(--ui-icon-background-url) !important;
}
.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon,
.ui-button:hover .ui-icon,
.ui-button:focus .ui-icon {
  background-image: var(--ui-icon-background-url);
}

.ui-state-default:hover,
.ui-state-default:focus {
  background: #3279B5;
  background: linear-gradient(180deg, #3279B5 0%, #3279B5 100%);
  background: var(--button-blue-bg-bottom);
  background: linear-gradient(180deg, var(--button-blue-bg-bottom) 0%, var(--button-blue-bg-bottom) 100%);
  background: var(--panel-header-bg-color);
  color: var(--ui-state-default-color);
}

.flex-switch-display {
  display: flex;
  float: left;
  width: 100%;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 0.625rem;
}
.flex-switch-display p{
  line-height: 1.5rem;
}

.flex-switch-display label {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
  position: inherit;
  left: 0;
  top: 0;
  margin-top: 0;
}

#eventsMap {
  width: 100% !important;
  height: 50% !important;
  display: block;
  float: left;
}

#eventsBlock {
  height: 100% !important;
  width: 100% !important;
  display: block;
  float: left;
}

#eventsListBar {
  height: 100% !important;
  position: relative !important;
}

#eventsList {
  position: relative;
}

#eventsLeft {
  display: block;
  float: left;
  width: 18.75rem;
  height: 100%;
}

#eventsRight {
  display: block;
  float: left;
  width: calc(100% - 18.75rem);
  height: 100%;
}


/*
.marker .box{
    display:none !important;
}
.marker .underBoxTriangle{
    display:none !important;
}
.htmlMarker.wide{
    position: relative;
    z-index: 10000 !important;
}
.htmlMarker:hover{
    z-index: 10001 !important;
}
.htmlMarker{
    transform: translate(-50%,0);
}
.htmlMarker.wide .map-marker{
    width:auto;
    height:58px;
    
}
.htmlMarker .active-marker{
    display:none;
    width:auto;
    height:61px;
    flex-wrap: wrap;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    padding-left: 5px;
    padding-right: 5px;
}
.htmlMarker .station-icon{
    display: flex;
    float: left;
    width: 30px;
    height: 100%;
    justify-content: center;
    align-items: center;
    display:none;
    
}
.htmlMarker .station-icon svg{
    fill:#FFF;
    height:100%;
}
.marker-cross{
    width:20px;
    height:20px;
    position: absolute;
    top:5px;
    right:5px;
}
.marker-cross svg{
    fill:red;
    width:20px;
    height:20px;
}
.marker-cross:hover svg{
    fill:#FF007F;
}
.htmlMarker.wide .active-marker{
    display: flex;
}
.htmlMarker.wide .box{
    display:none;
}
.htmlMarker.wide .underBoxTriangle{
    display: none;
}
.htmlMarker.selected{
	z-index: 10010 !important;
}
.htmlMarker.selected:hover{
	z-index: 10011 !important;
}
.htmlMarker .active-marker .active-marker-label{
    display: flex;
    justify-content: center;
    align-items: center;
    width:auto;
    min-width: 50px;
    height:40px;
    line-height:40px;
    font-size:18px;
    font-weight:100;
    vertical-align: middle;
    background: #4BB3CA;
    background: linear-gradient(180deg, #4BB3CA 0%, #3279B5 100%);
    background: var(--button-blue-bg-top);
    background: linear-gradient(180deg, var(--button-blue-bg-top) 0%, var(--button-blue-bg-bottom) 100%);
    padding-left:10px;
    padding-right:15px;
    white-space: nowrap;
    border-radius: 5px;
    -webkit-box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 1);
    -moz-box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 1);
    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 1);
}
.htmlMarker .active-marker .active-marker-label.green{
    -webkit-box-shadow: 0px 0px 0px 3px #107e42;
    -moz-box-shadow: 0px 0px 0px 3px #107e42;
    box-shadow: 0px 0px 0px 3px #107e42;

    -webkit-box-shadow: 0px 0px 0px 3px var(--marker-green-bottom);
    -moz-box-shadow: 0px 0px 0px 3px var(--marker-green-bottom);
    box-shadow: 0px 0px 0px 3px var(--marker-green-bottom);
}
.htmlMarker .active-marker .active-marker-label.orange{
    -webkit-box-shadow: 0px 0px 0px 3px #f68026;
    -moz-box-shadow: 0px 0px 0px 3px #f68026;
    box-shadow: 0px 0px 0px 3px #f68026;

    -webkit-box-shadow: 0px 0px 0px 3px var(--marker-orange-bottom);
    -moz-box-shadow: 0px 0px 0px 3px var(--marker-orange-bottom);
    box-shadow: 0px 0px 0px 3px var(--marker-orange-bottom);
}
.htmlMarker .active-marker .active-marker-label.red{
    -webkit-box-shadow: 0px 0px 0px 3px #e42f4a;
    -moz-box-shadow: 0px 0px 0px 3px #e42f4a;
    box-shadow: 0px 0px 0px 3px #e42f4a;

    -webkit-box-shadow: 0px 0px 0px 3px var(--marker-red-bottom);
    -moz-box-shadow: 0px 0px 0px 3px var(--marker-red-bottom);
    box-shadow: 0px 0px 0px 3px var(--marker-red-bottom);
}
.htmlMarker .active-marker .active-marker-label .point-name{
    font-size: 14px;
    margin-right:5px;
    font-family: "myriad-pro-regular";
}
.htmlMarker .active-marker .active-marker-label .value{
    font-family: 'myriad-pro-bold';
    font-weight:400 !important;
    font-weight:bold !important;
    font-size: 25px;
}
.htmlMarker .active-marker .active-marker-label .value .units{
    font-family: 'myriad-pro-regular';
    font-weight:normal !important;
    font-size: 15px;
    margin-left:5px;
    margin-right:5px;
}
.htmlMarker .active-marker .triangle{
    background: linear-gradient(45deg,#3279B5 50%,rgba(225, 20, 20, 0) 51%,rgba(255, 0, 0, 0) 100%);
    box-shadow: -2px 2px 4px -2px rgba(0, 0, 0, 1);
    height: 15px;
    transform: translate(0,-50%) rotate(-45deg);
    width: 15px;
}
.htmlMarker .active-marker .triangle.green{
    -webkit-box-shadow: -2px 2px 0px 1px #107e42;
    -moz-box-shadow: -2px 2px 0px 1px #107e42;
    box-shadow: -2px 2px 0px 1px #107e42;

    -webkit-box-shadow: -2px 2px 0px 1px var(--marker-green-bottom);
    -moz-box-shadow: -2px 2px 0px 1px var(--marker-green-bottom);
    box-shadow: -2px 2px 0px 1px var(--marker-green-bottom);
}
.htmlMarker .active-marker .triangle.orange{
    -webkit-box-shadow: -2px 2px 0px 1px #f68026;
    -moz-box-shadow: -2px 2px 0px 1px #f68026;
    box-shadow: -2px 2px 0px 1px #f68026;

    -webkit-box-shadow: -2px 2px 0px 1px var(--marker-orange-bottom);
    -moz-box-shadow: -2px 2px 0px 1px var(--marker-orange-bottom);
    box-shadow: -2px 2px 0px 1px var(--marker-orange-bottom);
}
.htmlMarker .active-marker .triangle.red{
    -webkit-box-shadow: -2px 2px 0px 1px #e42f4a;
    -moz-box-shadow: -2px 2px 0px 1px #e42f4a;
    box-shadow: -2px 2px 0px 1px #e42f4a;

    -webkit-box-shadow: -2px 2px 0px 1px var(--marker-red-bottom);
    -moz-box-shadow: -2px 2px 0px 1px var(--marker-red-bottom);
    box-shadow: -2px 2px 0px 1px var(--marker-red-bottom);
}*/

#sideMenuWrapper {
  display: block;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, .3);
  z-index: 10100;
  /*transition: all .3s ease-in-out;*/
  overflow: hidden;
}

#sideMenu {
  display: block;
  float: right;
  width: 23.75rem;
  min-width:18.75rem;
  max-width: 50%;
  transition: all 0.5s ease-in-out;
  height: 100%;
  overflow: hidden;
  background: #171818;
  background: var(--grid-item-bg-color);
  position: absolute;
  right: -25rem;
  top: 0;
  bottom: 0;
  -webkit-box-shadow: -0.3125rem 0.125rem 0.375rem 0.3125rem rgba(0, 0, 0, 0.5);
  -moz-box-shadow: -0.3125rem 0.125rem 0.375rem 0.3125rem rgba(0, 0, 0, 0.5);
  box-shadow: -0.3125rem 0.125rem 0.375rem 0.3125rem rgba(0, 0, 0, 0.5);
  -webkit-box-shadow: -0.3125rem 0.125rem 0.375rem 0.3125rem var(--box-settings-shadow);
  -moz-box-shadow: -0.3125rem 0.125rem 0.375rem 0.3125rem var(--box-settings-shadow);
  box-shadow: -0.3125rem 0.125rem 0.375rem 0.3125rem var(--box-settings-shadow);
  z-index: 2;
  left: auto !important;
}

.sideMenuContent {
  display: block;
  float: left;
  width: 100%;
  height: 100%;
  background: #171818;
  background: var(--grid-item-bg-color);
}
/*
.navbar.navbar-default.side-bar {
  width: 60px;
  border-right: 0;
  -webkit-box-shadow: 4px 0px 5px 0px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: 4px 0px 5px 0px rgba(0, 0, 0, 0.75);
  box-shadow: 4px 0px 5px 0px rgba(0, 0, 0, 0.75);
  -webkit-box-shadow: 4px 0px 5px 0px var(--box-shadow);
  -moz-box-shadow: 4px 0px 5px 0px var(--box-shadow);
  box-shadow: 4px 0px 5px 0px var(--box-shadow);
}
*/
.navbar.navbar-default.side-bar .container-fluid {
  padding: 0;
  background: var(--grid-item-bg-color);
}

#top-menu-icon {
  /*background: #111111;
  background: var(--top-menu-icon-bg);*/
  display: flex;
  justify-content: flex-end;
  flex-direction: column;
  align-items: center;
  float: left;
  width: 100%;
  /*height: 3.75rem;*/
  /* padding-left: 5px;*/
  padding-bottom: 0.25rem;
}
#top-menu-icon .icon-wrapper{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}
#top-menu-icon img {
  display: block;
  float: left;
  width: 1.75rem;
  height: auto;
  margin-left: 0.6875rem;
}

.nav.main-menu-icons-list li a {
  cursor: pointer;
  /* display: flex; */
  width: 100%;
  justify-content: center;
  align-items: center;
}

.nav.main-menu-icons-list li a svg {
  fill: #FFF;
  fill: var(--svg-fill-navigation);
  width: 2rem;
  min-width: 2rem;
}

.nav.main-menu-icons-list li a .label {
  color: #FFF;
  color: var(--svg-fill-navigation);
}

.nav.main-menu-icons-list li a.side-bar-icon-active .label,
.nav.main-menu-icons-list li a:hover .label,
.nav.main-menu-icons-list li a:focus .label {
  color: #FFF;
  color: var(--svg-fill-navigation-on-hover);
}

.nav.main-menu-icons-list li:hover a svg {
  fill: #FFF;
  fill: var(--svg-fill-navigation-on-hover);
}

.navbar-default .navbar-nav li a.side-bar-icon-active svg {
  fill: #FFF;
  fill: var(--svg-fill-navigation-on-hover);
}

.navbar-default .navbar-nav li a:focus svg {
  fill: #FFF;
  fill: var(--svg-fill-navigation-on-hover);
}

.nav.main-menu-icons-list .grid-controls li a svg {
  fill: #FFF;
  fill: var(--svg-fill-grid-controls);
  width: 1.875rem;
}

.navbar-default .navbar-nav li a.side-bar-icon-active,
.navbar-default .navbar-nav li a:hover,
.navbar-default .navbar-nav li a:focus {
  background: #3279B5;
  background: var(--button-blue-bg-bottom);
  border: 0;
  border-radius: 0;
  /* display: flex; */
  align-items: center;
  text-decoration: none !important;
}
.navbar-default .navbar-nav li #theme-toggle-button:focus {
  background: none;
}

.nav.main-menu-icons-list li #theme-toggle-button:focus .label {
  fill: #FFF;
  fill: var(--svg-fill-navigation);
  color: #FFF;
  color: var(--svg-fill-navigation);
}
.navbar-default .navbar-nav li #theme-toggle-button:focus svg {
  fill: #FFF;
  fill: var(--svg-fill-navigation);
}

.navbar-default .navbar-nav .grid-controls li a:hover svg {
  fill: #FFF;
  stroke: #FFF !important;
}

.profile-icons-allert-nav.on {
  background: #E6344B;
  background: linear-gradient(180deg, #EF5952 0%, #E6344B 100%);
  background: var(--red-grid-gradient-bottom);
  background: linear-gradient(180deg, var(--red-grid-gradient-top) 0%, var(--red-grid-gradient-bottom) 100%);
}

.profile-icons-allert-nav.on .label {
  color: #FFF !important;
}

.profile-icons-allert-nav.on svg {
  fill: #FFF !important;
  stroke: #FFF !important;
}

.navbar-default .navbar-nav li {
  border: 0;
  border-radius: 0;
  width: 100%; /* 190px; *//*100%;*/
  display: flex; 
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 0.3125rem;
  overflow: hidden;
}

.navbar-default .navbar-nav li a {
  border: 0;
  border-radius: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-bottom: 0;
  min-height: 2.5rem;
  text-align: center;
}

.navbar-default .navbar-nav li .label {
  display: none;
  font-weight: normal;
}

.main-menu-icons-list .mCSB_inside>.mCSB_container {
  margin-right: 0;
}

.container-list {
  padding-left: 5rem;
  transition: all .3s ease-in-out;
}

.container-no-stations {
  padding-right: 2.5rem !important;
}
.project-page.container-no-stations{
  padding-right: 2.5rem !important;
}

#user-menu {
  /*left: 54px !important;
  z-index: 9999;*/
  height:100%;
}

#expandNavigation {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  /*bottom:35px;*/
  bottom: 2.75rem;
  left: 0;
  right: 0;
  width: 100%;
  height: auto;
  z-index: 9;
}

#expandNavigation svg {
  fill: #FFF;
  fill: var(--svg-fill);
  width: 1.875rem;
}

.copyright {
  position: absolute;
  font-size: 0.625rem;
  text-transform: uppercase;
  bottom: -0.3125rem;
  left: 0;
  text-align: center;
  color: #FFF;
  color: var(--text-white-on-black);
  width: 100%;
  /* padding-right: 14px; */
}

.navbar-default.expanded .navbar-nav li a {
  padding-left: 0.75rem;
  justify-content: flex-start;
}

#top-menu-icon.expanded {
  justify-content: flex-start;
}

.navbar-default.expanded .navbar-nav li .label {
  padding: 0;
  padding-left: 0.625rem;
}

.navbar-default.expanded .grid-controls {
  width: 10.75rem;
  transition: all 0.5s ease-in-out;
}
.navbar-default .grid-controls {
  transition: all 0.5s ease-in-out;
}
.navbar-default.expanded2 .main-nav-list{
  /*-webkit-box-shadow: 2px 5px 5px 0px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: 2px 5px 5px 0px rgba(0, 0, 0, 0.75);
  box-shadow: 2px 5px 5px 0px rgba(0, 0, 0, 0.75);
  -webkit-box-shadow: 2px 5px 5px 0px var(--box-shadow);
  -moz-box-shadow: 2px 5px 5px 0px var(--box-shadow);
  box-shadow: 2px 5px 5px 0px var(--box-shadow);*/
  border-right: 0.0625rem solid #080808;
  border-right: 0.0625rem solid var(--grid-item-border-color);
  z-index: 999;
  transition: all 0.5s ease-in-out;
  width:3.3125rem;
}
.navbar-default.expanded2 .navbar-nav li a {
  /* padding-left: 12px; */
  /*justify-content: flex-start;*/
}

#top-menu-icon.expanded2 {
  justify-content: flex-start;
}

.navbar-default.expanded2 .navbar-nav li .label {
  padding: 0;
  padding-left: 0.625rem;
}

.navbar-default.expanded2 .grid-controls {
  width: 10.75rem;
  transition: all 0.5s ease-in-out;
}
.navbar-default .main-nav-list{
  transition: all 0.5s ease-in-out;
  z-index: 999;
  position: relative;
  background-color: #171818;
  background-color: var(--grid-item-bg-color);
  overflow:hidden;
  height:100%;
  padding-left: 0rem;
}
.user-nav-list #user-menu{
  font-size:1rem;
  height:100%;
  overflow-y: auto;
  padding-right: 0.3125rem;
}
.user-nav-list #alert-menu-container{
  font-size:1rem;
  height:100%;
}
.navbar-default .grid-controls .label {
  display: none;
}
#alert-menu{
  padding-right:0.5rem;
  overflow-y: hidden;
}
.navbar-default.expanded .grid-controls .label {
  display: block;
  font-size: 0.875rem;
  padding-left: 0.5625rem !important;
  text-decoration: none !important;
}
.navbar-default.expanded2 .grid-controls .label {
  display: block;
  font-size: 0.875rem;
  padding-left: 0.5625rem !important;
  text-decoration: none !important;
}

.navbar-default .grid-controls .label {
  display: block;
  font-size: 0.875rem;
  padding-left: 0.5625rem !important;
  text-decoration: none !important;
}

.navbar-default.expanded .grid-controls .label:hover {
  text-decoration: none !important;
}
.navbar-default.expanded2 .grid-controls .label:hover {
  text-decoration: none !important;
}

/*.active-marker::after {
    background: linear-gradient(45deg,rgba(255,255,255,1) 50%,rgba(255,255,255,0) 51%,rgba(255,255,255,0) 100%);
    box-shadow: -2px 2px 0px 0 rgba(0, 0, 0, 1);
    content: "";
    height: 15px;
    left: 0;
    position: absolute;
    top: 0;
    transform: translate(-50%,-50%) rotate(-45deg);
    width: 15px;
}*/

b,
strong {
  /*font-family: 'myriad-pro-bold';*/
}

#top-menu-icon .right {
  display: block;
}

#top-menu-icon .left {
  display: none;
}

#top-menu-icon .menu {
  display: none;
}

#top-menu-icon .close-menu {
  display: none;
}

#top-menu-icon {
  cursor: pointer;
}

#top-menu-icon svg {
  fill: #FFF;
  fill: var(--svg-fill);
  width: 2.25rem;
}


/*.navbar.navbar-default{
    width: 100%;
    height: calc(100vh - 168px);
    overflow-y: scroll;
}*/

.main-menu-icons-list {
  width: 100%;
  height: calc(100vh - 8rem);/*- 115px*/
  /*overflow-y: auto;*/
  overflow: hidden;
  margin: 0;
  /*display:flex;*/
  position:relative;
}

.paddle {
  top: 0.8125rem;
}

.left-paddle {
  left: 3.75rem;
}

.side-bar {
  min-height: 0;
}

.grid-controls li:last-child {
  margin-bottom: 0;
}

.navbar-default .navbar-nav .grid-controls li a {
  height: 2.8125rem;
}

#unitSideBar {
  transition: all .3s ease-in-out;
  border-top-width: 0;
  border-right-width: 0;
  border-bottom-width: 0;
  overflow: auto;
  padding-bottom:0.625rem;
}

#unitSideBar .wrapper {
  display: block;
  float: left;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  padding-left: 0;
  overflow-y: auto;
  overflow-x: hidden;
}

.unitSideBarToggler {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 0.875rem;
  background-color: var(--unitSideBarToggler-bg);
  cursor: pointer;
  overflow: hidden;
}

#unitSideBar .unitSideBarToggler {
  background: linear-gradient(180deg, var(--button-blue-bg-top) 0%, var(--button-blue-bg-bottom) 100%);
}

.unitSideBarToggler.right {
  right: 0;
  left: auto;
}

#toggle-stations-btn {
  position: relative;
  font-size: 0.75rem;
}

.unitSideBarHidden {
  display: block !important;
  width: 1rem;
}

#toggle-buttons-grp {
  float: left;
  position: relative;
  width: 100%; /*250px;*/
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 0.625rem;
  min-width: 13.75rem;
}

.station-details-div {
  float: left;
  width: 100%;
}

#project-buttons br {
  display: none;
}

.navbar.navbar-default {
  transition: all .3s ease-in-out;
}

.navbar.navbar-default.side-bar {
  width: 3.4375rem;
  /* padding-right: 14px; */
}

.navbar.navbar-default.expanded {
  width: 11.875rem;
}

.navbar.navbar-default.expanded .navbar-nav li .label {
  display: block;
}

.navbar.navbar-default.expanded2 {
  width: 11.875rem;
}

.navbar.navbar-default.expanded2 .navbar-nav li .label {
  display: block;
}

p.copyright img,
p.copyright br {
  display: none;
}

#top-menu-icon .logo {
  display: none;
}

#top-menu-icon .logos {
  display: block;
  min-width: 2.75rem;
  margin-left: 0;
}

#top-menu-icon .right {
  display: none;
}

#top-menu-icon .left {
  display: none;
}

#main-nav-bar svg {
  fill: #FFF;
  fill: var(--svg-fill-navigation);
  width: 2.25rem;
}

#toggle-stations-btn svg {
  fill: #FFF;
  fill: var(--svg-fill-navigation);
  width: 2.25rem;
  height: 0.875rem;
}

#mobile-nav {
  background-color: #1c1d1d;
  background-color: var(--mobile-nav-bg);
}

.export-buttons {
  float: left;
  cursor: pointer;
}

.export-buttons svg {
  fill: #FFF;
  fill: var(--export-buttons-svg-fill);
  stroke: #FFF;
  stroke: var(--export-buttons-svg-fill);
}

.export-buttons svg text{
  fill: #FFF;
  fill: var(--export-buttons-svg-text-fill);
  stroke: #FFF;
  stroke: var(--export-buttons-svg-text-fill);
}

.gridControlSection{
  display: block;
  float: left;
  width: 100%;
  height: auto;
}
.slick-column-name{
  white-space: initial !important;
}
.slick-group-header-column.ui-state-default{
  text-overflow: initial;
}
.project-page.container{
  padding-bottom: 0 !important;
}
.side-bar-toggler.navbar-toggler.unitSideBarHidden {
  right: 0.0625rem !important;
}
.navbar.navbar-default .navbar-toggler .glyphicons {
  font-size: 0.875rem;  
  /*top: -7px;
  left: -6px;*/
}
#main-page-grid .grid-stack-item-main .grid-stack-item-content+.ui-resizable-handle{
  bottom:1.25rem;
  right:0.9375rem;
}
.autoResizeWrapper{
  position:absolute;
  bottom:0.4375rem;
  right:2.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #FFF;
  padding: 0 0.3125rem 0.3125rem;
  border-radius: 0.3125rem;
}
.autoResizeWrapper label{
  font-size: 1rem;
  font-weight: normal;
  margin-right: 0.625rem;
  margin-bottom: 0;
  height: 1.125rem;
  color:#555;
  /* color:var(--text-on-white); */
}
.grid-stack .grid-stack-item.ui-resizable-autohide .autoResizeWrapper{
  display: none;
}
/*.userHeight .static-container{
  height: 100%;
  float: left;
  width: 100%;
  overflow: auto;
}*/
#main-page-grid .userHeight .grid-stack-item-content-wrapper {
  overflow-y: auto !important;
  height: 100%;
}
#main-page-grid #mapBlock.userHeight .grid-stack-item-content-wrapper {
  overflow-y: hidden !important;
}
@media(max-width:63.9375rem) {
  p.copyright img {
    display: inline;
  }
  p.copyright br {
    display: inherit;
  }
  #top-menu-icon .logos {
    /*display: none;*/
  }
  .navbar.navbar-default.side-bar {
    padding-right: 0;
  }
  .navbar .unitSideBarToggler {
    display: none;
  }
  #live-view-header {
    margin-top: 0;
    padding-top: 0.625rem;
    padding-left: 3.625rem;
    padding-right: 3.625rem;
  }
  .side-bar-toggler.navbar-toggler.unitSideBarHidden {
    right: 0.9375rem;
  }
  #mobile-nav .nav.navbar-nav {
    display: none;
  }
  .navbar.navbar-inverse.top-bar.navbar-fix {
    display: none;
  }
  .navbar.navbar-default.side-bar {
    height: 3.75rem;
    width: 3.75rem;
    /*overflow: hidden;*/
    min-height: 0;
    border-bottom: 0.0625rem solid var(--grid-item-border-color);
  }
  /*.navbar.navbar-default.side-bar.extended{
    overflow: initial;
  }*/
  #expandNavigation {
    display: none;
  }
  p.copyright {
    display: none;
  }
  .navbar.navbar-default.extended p.copyright {
    display: block;
  }
  p.copyright img {
    display: none;
  }
  #top-menu-icon .logos {
    margin-top: -1.125rem;
  }
  .navbar.navbar-default.side-bar {
    /*-webkit-box-shadow: 10px 0px 5px 0px rgba(0,0,0,0.75);
        -moz-box-shadow: 10px 0px 5px 0px rgba(0,0,0,0.75);
        box-shadow: 10px 0px 5px 0px rgba(0,0,0,0.75);*/
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
  }
  .navbar.navbar-default.side-bar.shadowed {
    -webkit-box-shadow: 0.3125rem 0rem 0.3125rem 0rem rgba(0, 0, 0, 0.45);
    -moz-box-shadow: 0.3125rem 0rem 0.3125rem 0rem rgba(0, 0, 0, 0.45);
    box-shadow: 0.3125rem 0rem 0.3125rem 0rem rgba(0, 0, 0, 0.45);
    height: 100%;
    height: 100vh;
    width: 11.875rem;
  }
  .navbar.navbar-default.side-bar.shadowed.expanded{
    width: 16.8125rem;
  }
  .navbar.navbar-default.side-bar.shadowed.expanded2{
    width: 16.8125rem;
  }
  .navbar.navbar-default.side-bar.shadowed li .label {
    display: block;
  }
  #top-menu-icon .right {
    display: none !important;
  }
  #top-menu-icon .left {
    display: none !important;
  }
  #top-menu-icon .menu {
    display: block;
  }
  .navbar.navbar-default.side-bar.shadowed #expandNavigation {
    display: flex;
  }
  .navbar.navbar-default.side-bar.shadowed p.copyright {
    display: block;
  }
  .navbar.navbar-default.side-bar.shadowed #top-menu-icon .menu {
    display: none;
  }
  .navbar.navbar-default.side-bar.shadowed #top-menu-icon .close-menu {
    display: block;
  }
  #mobile-nav {
    height: 3.8125rem;
  }
  #mobile-nav .menu-wrapper {
    height: 3rem;
    padding-top: 0.8125rem;
  }
  #mobile-nav .menu-wrapper {
    padding-left: 3.75rem;
    padding-right: 0.625rem;
  }
  #mobile-nav .menu-wrapper ul {
    padding-left: 0;
  }
  #bottom-logo {
    display: none;
  }
  #top-menu-icon {
    background: var(--top-menu-icon-bg-mobile);
  }
  #main-page-grid{
    margin-bottom:0;
  }
  #top-menu-icon{
    padding-bottom:0;
  }
  .navbar.navbar-default .navbar-toggler .glyphicons {
    font-size: 1.25rem;
    top: -0.125rem;
    left: -0.25rem;
  }
  .navbar.navbar-default .navbar-toggler {
    margin: 1.1875rem 0rem 0.625rem 4.625rem;
    height: 1.875rem;
    width: 1.875rem;
  }
  .navbar.navbar-default .navbar-toggler.list {
    margin: 0.75rem 0rem 0.625rem 4.625rem;    
  }
  .navbar.navbar-default.extended .navbar-toggler {
    margin: 1.1875rem 0rem 0.625rem 6.5rem;
  }
  .navbar.navbar-default.extended .navbar-toggler.list {
    margin: 0.75rem 0rem 0.625rem 6.5rem;
  }

  .navbar.navbar-default .navbar-toggler.non-project {
    margin: 0rem 0rem 0rem 3.875rem;
    padding: 0.75rem;
    box-sizing: content-box;
    background: var(--main-bg-color-default);
  }
  .navbar.navbar-default.expanded2 .navbar-toggler.non-project {
    margin: 0rem 0rem 0rem 14.125rem;
    background-color: var(--grid-item-bg-color);
}
  .navbar.navbar-default.extended .navbar-toggler.non-project {
    margin: 0rem 0rem 0rem 5.75rem;
    background: transparent;
  }

  .navbar.navbar-default .navbar-toggler .glyphicons {
    font-size: 1.25rem;
    top: 0;
    left: 0;
    width: 1.75rem;
    height: 1.75rem;
  }
  .navbar.navbar-default.side-bar{
    border-right-width: 0; 
    height:3.6875rem;
    border-bottom-width: 0; 
    background: transparent;
    left: -3.75rem;
  }
  .navbar.navbar-default.expanded2{
    left:0;
  }
  .navbar.navbar-default.side-bar.extended{
    border-right-width: 0.0625rem;
    height: 100%;
    background-color: var(--grid-item-bg-color);
    left:0;
  }
  .side-bar-toggler.navbar-toggler.unitSideBarHidden {
    right: 0.9375rem !important;
  }
  .autoResizeWrapper{
    display: none !important;
  }
  #main-page-grid .grid-stack-item-main .grid-stack-item-content+.ui-resizable-handle {
    display:none !important;
  }
}
.timehistory-plot-icons .fullscreen-icon,
.timehistory-plot-icons .fullscreen-off-icon{
  margin-right: 0;
}

.marker.selected .box {
  padding: 0;
}

.marker.vibration-marker .bottom {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.marker.vibration-marker .box {
  padding: 0;
}

.map-marker.marker.gray.selected .bottom {
  border-radius: 0.3125rem;
}

.navbar-default .navbar-nav li a {
  /*justify-content: flex-start;*/
  /*padding-left: 12px;*/
}

.navbar-default .navbar-nav li .label {
  display: block;
}

.navbar-default .navbar-nav .grid-controls li a {
  justify-content: flex-start;
  padding-left: 0.5625rem;
}

/*.navbar.navbar-default:hover {
  width: 190px;
}*/
.navbar.navbar-default.extended {
  width: 7.5rem;
}

.navbar.navbar-default.expanded {
  width: 16.8125rem; /*190px;*/
}
.navbar.navbar-default.expanded .navbar-nav li {
  border: 0;
  border-radius: 0;
  overflow: hidden;
  width:100%;
}
.navbar.navbar-default.expanded #main-nav-bar .left {
  display: block !important;
}

.navbar.navbar-default.expanded #main-nav-bar .right {
  display: none;
}

.navbar.navbar-default.expanded2 {
  width: 17.5rem; /*190px;*/
}
.navbar.navbar-default.expanded2 .navbar-nav li {
  border: 0;
  border-radius: 0;
  overflow: hidden;
  width:100%;
}
.navbar.navbar-default.expanded2 #main-nav-bar .left {
  display: block !important;
}

.navbar.navbar-default.expanded2 #main-nav-bar .right {
  display: none;
}

.navbar.navbar-default:hover .grid-controls {
  width: 10.75rem;
}

.navbar.navbar-default:hover .navbar-nav li .label {
  display: block;
}

.navbar.navbar-default:hover #main-nav-bar .left {
  display: block !important;
}

.navbar.navbar-default:hover #main-nav-bar .right {
  display: none;
}

.navbar.navbar-default:hover .navbar-nav li a {
  /* padding-left: 12px; */
  /*justify-content: flex-start;*/
}

/*.navbar.navbar-default:hover #top-menu-icon {
  justify-content: flex-start;
}*/

.alert-counter {
  display: none !important;
}
.grid-stack-item-content-wrapper h3{
  margin:0;
  padding:0.625rem;
  font-size:1.5rem;
}
.inhereControls,
.inhere{
  float:left;
  width:100%;
}
@media(max-width:63.9375rem) {
  .navbar.navbar-default:hover {
    /*width: 60px;*/
  }
  .navbar.navbar-default.extended {
    height: 100%;
  }
  #unitSideBar.unitSideBarHidden {
    width:0;
  }
}
.tablerWrapper{
  padding-top:0.625rem;
  text-align: center;
}
.tablerWrapper .slick-cell{
  color:#333;
  color: var(--typical-table-th-color);
  /*border-color:#000;*/
  border-right-color: #000 !important;
  border-right-color: var(--typical-table-border-color) !important;
}
.tablerWrapper .ui-state-default,
.tablerWrapper .ui-state-default:hover,
.tablerWrapper .ui-state-default:focus{
  height: auto;
  background-color: #457ab2;
  background-color: var(--panel-header-bg-color);
}
/*.tablerWrapper .ui-state-default.slick-header-column{
  height: 50px !important;
}*/
.slick-header-columns{
  display: flex;
  align-items: center;
}
.tablerWrapper .slick-header-columns .ui-state-default{
  border: 0.0625rem solid var(--typical-table-border-color);
  background: #457ab2;
  background-color: var(--panel-header-bg-color);
  font-family: 'myriad-pro-semibold';
  font-size: 0.875rem;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 2rem;
}
.tablerWrapper .slick-column-name {
  color: #fff;
  color: var(--typical-table-th-color);
  display: flex;
  align-items: center;
  justify-content: center;
}
.insideTabler{
  width:100%;
  display:block;
  float:left;
  height:auto;
  border: 0.0625rem solid var(--typical-table-border-color);
}
.insideTablerOuterWrapper{
  margin-top: 0.3125rem;
  scrollbar-width: thin;
}
.insideTablerWrapper{
  overflow-x:auto; /*auto*/
}
.insideTabler .slick-pane-header {
  border-bottom: var(--typical-table-header-border-bottom-width) solid var(--typical-table-header-border-bottom-color);
}

.insideTabler .slick-viewport{
  background: #fff;
  background: var(--typical-table-scrollbar-bg);
  scrollbar-color: #666 #FFF;
  scrollbar-color: var(--typical-table-scrollbar-thumb) var(--typical-table-scrollbar-bg);
  scrollbar-width: thin;
  scroll-margin-right: 0.3125rem;
}
.insideTabler .slick-viewport::-webkit-scrollbar,
.th-plot-table::-webkit-scrollbar {
  width: 0.5rem;
  background: #FFF;
  background: var(--typical-table-scrollbar-bg);
}
.insideTabler .slick-viewport::-webkit-scrollbar-track,
.th-plot-table::-webkit-scrollbar-track {
  -webkit-box-shadow: none;
}
.insideTabler .slick-viewport::-webkit-scrollbar-thumb,
.th-plot-table::-webkit-scrollbar-thumb {
  background-color: var(--typical-table-scrollbar-thumb);
  outline: none;
  border-radius:3.125rem;
  border-right:0.125rem solid #FFF;
  border-right:0.125rem solid var(--typical-table-scrollbar-bg);
  border-top:0.125rem solid #FFF;
  border-top:0.125rem solid var(--typical-table-scrollbar-bg);
  border-bottom:0.125rem solid #FFF;
  border-bottom:0.125rem solid var(--typical-table-scrollbar-bg);
  border-left:0;
  -webkit-box-shadow:none;
}
.insideTabler .slick-viewport::-webkit-scrollbar-thumb:window-inactive {
  background-color: #333;
}
.insideTabler .glyphicons-info-sign {
  /*top: 0.1875rem;*/
  font-size: 1rem;
}

.project-page .mCSB_inside>.mCSB_container {
  margin-right: 0.9375rem !important;
}
.tablerControls{
  display:block;
  float:left;
  width:100%;
  height:auto;
  padding:0;
}
.tablerControls label{
  margin-right:0.625rem;
}
.tablerControls label input{
  margin-right:0.3125rem;
}

.tablerControls .btn.glyphicons {
  background: #1c1d1d;
  border: 0.0625rem solid #a4a4a4;
  color: #fff;
  background: var(--background-fix-bg);
  border: 0.0625rem solid var(--background-fix-border-color);
  color: var(--background-fix-border-color);
}
.tablerControls .btn.glyphicons span {
  display: inline-block;
  font-family: "myriad-pro-regular";
  top: -0.125rem;
  position: relative;
}

.tablerControls .btn.glyphicons:before {
  padding-left: 0;
}
.tablerControls .btn.glyphicons:hover,
.tablerControls .btn.glyphicons:focus,
.tablerControls .btn.glyphicons.focus,
.tablerControls .btn.glyphicons.active {
  border: 0.0625rem solid #337ab7;
  background: #337ab7;
  color: #fff;
}
#sideMenu.ui-resizable-resizing .ui-resizable-w{
  /*background: blue;*/
  border-left: 0.4375rem solid #ccc;
}
#sideMenu .ui-resizable-w{
  width:0.875rem;
}
#sideMenu .ui-resizable-w:hover{
  /*background: blue;*/
  border-left: 0.4375rem solid #ccc;
}
#sideMenu .switch-big input.cmn-toggle-round+label{
  width:3.125rem;
  height:1.4375rem;
}
#sideMenu .switch-big input.cmn-toggle-round:checked+label:after {
  margin-left: 1.5625rem;
}
#sideMenu .switch-big input.cmn-toggle-round+label:after {
  width: 1.4375rem;
}
@media screen and (max-width: 48rem) {
  #sideMenu {
    max-width: 70%;
  }
}

@media screen and (max-width: 35rem) {
  #live-view-menu .paddles-live.showPaddlesConst{
    display:none !important;
  }
  #live-view-menu nav{
    display:none !important;
  }
  #live-view-menu nav.show-in-mobile{
    display:block !important;
    padding-right: 0.3125rem;
    margin-top:0.9375rem;
  }
  #live-view-menu .paddles-live.show-in-mobile{
    display: block !important;
    height: 2.875rem;
    position: absolute;
    bottom: 0;
    width: 100%;
  }
  #live-view-menu .paddles-live.show-in-mobile .right-paddle-live{
    right:0;
  }
  #live-view-menu{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
  }
  #live-view-menu .mobile-menu-icon{
    width: 2.5rem;
    height: 2.25rem;
    /*background: #4BB3CA;
    background: var(--grid-item-bg-color);*/
    text-decoration: none;
    border: 0;
    color: #FFF;
    border-radius: 0.3125rem;
    padding: 0 0.125rem;
    transition: background .3s ease-in-out;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    border:0;
    float:left;
    
  }
  #live-view-menu .mobile-menu-icon.active{
    background: var(--button-blue-bg-bottom);
  }
  #global-grid-refresh-button,
  #global-grid-settings-button{
    position: initial;
    margin-left:0.3125rem;
  }
  #live-view-menu .mobile-menu-icon:hover {
    background: var(--button-blue-bg-bottom);
  }
  #live-view-menu .mobile-menu-icon svg{
    display:block;
    width:1.6875rem;
  }
  #live-view-menu .mobile-menu-icon svg rect{
    fill: #FFF;
    fill: var(--svg-fill-navigation-on-hover);
  }
  .headerLiveViewWrapper.container-no-stations {
    padding: 0 !important;
  }
  /*.side-bar-toggler.navbar-toggler.unitSideBarHidden {
    right: 5px;
  }*/
  #live-view-header.show-in-mobile{
    padding-left:0;
    padding-right:0;
  }
  #live-view-header.show-in-mobile .mobile-menu-icon,
  #live-view-header.show-in-mobile #global-grid-refresh-button,
  #live-view-header.show-in-mobile #global-grid-settings-button{
    margin-top:0.25rem;
  }
  /*#live-view-header.show-in-mobile #live-view-menu .mobile-menu-icon{
    margin-left:26px;
  }*/
  .headerLiveViewWrapper.container-list.container-no-stations{
    transition: none 0s !important;
  }
  
  
}
@media (max-width: 34.375rem) {
  #sideMenu {
    max-width: 90%;
  }
  
}
.form-control{
  border-radius: 0.25rem !important;
}
.addNewBanner {
  display: block;
  float:left;
  position: relative;
  float: left;
  width: calc(100% + 1.25rem);
  margin-left: -0.625rem;
  height: 13.875rem;
  padding: 0 0.625rem;
  -webkit-backface-visibility: hidden;
  z-index: 1;
}
.addNewBanner2 {
  display: flex;
  position: relative;
  float: left;
  width: 100%;
  height: 100%;
  border-radius: 0; /*0.625rem;*/
  /*background-color: var(--button-blue-bg-top);*/
  background-image: linear-gradient(180deg, transparent 0%, var(--button-blue-bg-bottom) 100%);
  -webkit-backface-visibility: hidden;
  z-index: 1;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
.addNewBanner2.configurable {
  cursor: pointer;
}
.contentTypeBgImageHeatmap{
  position: absolute;
  top:0;
  left:0;
  right:0;
  width:100%;
  height:12.5rem;
  background-image: url(heatmaps4.png);
  margin-top:3.75rem;
  transition: all 0.4s ease-out;
  opacity: 0.5;
  background-repeat: no-repeat;
  background-position: top right;
}
.contentTypeBgImageCharts{
  position: absolute;
  top:0;
  left:0;
  right:0;
  width:100%;
  height:12.5rem;
  background-image: url(lines.png);
  background-size: contain;
  margin-top:3.75rem;
  transition: all 0.4s ease-out;
  opacity: 0.5;
}
.contentTypeBgImageStatic{
  position: absolute;
  top:0;
  left:0;
  right:0;
  width:100%;
  height:15rem;
  background-image: url(static.png);
  margin-top: 2.1875rem;
  margin-left: 5.625rem;
  transition: all 0.4s ease-out;
  opacity: 0.5;
  background-repeat: no-repeat;
  background-position: top right;
}
.contentTypeBgImageTables{
  position: absolute;
  top:0;
  left:0;
  right:0;
  width:100%;
  height:15.625rem;
  background-image: url(tables2.png);
  transition: all 0.4s ease-out;
  opacity: 0.5;
  background-repeat: no-repeat;
  background-position: top right;
}
.contentTypeBgImageConfigure{
  position: absolute;
  top:0;
  left:0;
  right:0;
  width:100%;
  height:15rem;
  background-image: url(report.png);
  margin-top: 2.1875rem;
  margin-left: 5.625rem;
  transition: all 0.4s ease-out;
  opacity: 0.5;
  background-repeat: no-repeat;
  background-position: top right;
}
.addNewBanner:hover .contentTypeBgImageConfigure{
  margin-top: 0;
  margin-left: 4.375rem;
  transition: all 0.4s ease-out;
  opacity: 1;
}
.addNewBanner:hover .contentTypeBgImageHeatmap,
.addNewBanner:hover .contentTypeBgImageCharts{
  margin-top:1.375rem;
  transition: all 0.4s ease-out;
  opacity: 1;
}
.addNewBanner:hover .contentTypeBgImageStatic{
  margin-top: 0;
  margin-left: 4.375rem;
  transition: all 0.4s ease-out;
  opacity: 1;
}
.addNewBanner:hover .contentTypeBgImageTables{
  margin-top:-1.125rem;
  transition: all 0.4s ease-out;
  opacity: 1;
}
/*.addNewBanner:after {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 10px;
  background-image: linear-gradient(180deg, var(--button-blue-bg-bottom) 0%, var(--button-blue-bg-top) 100%);
  transition: opacity 0.5s ease-out;
  z-index: 2;
  opacity: 0;
}*/
.addNewBanner:hover:after {
  /*opacity: 1;*/
}
.addNewBanner .label-wrapper{
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0.625rem 0.9375rem;
  border-radius: 3.125rem;
  background: var(--button-blue-bg-top);
  background: linear-gradient(180deg, var(--button-blue-bg-top) 0%, var(--button-blue-bg-bottom) 100%);
  text-decoration: none;
  position: relative;
  z-index: 3;
}
.addNewBanner .plus{
  font-size: 1.5rem;
  position: relative;
  z-index: 3;
  top: -0.0625rem;
  margin-right: 0.625rem;
}
.addNewBanner .l-label{
  font-size:1.75rem;
  position: relative;
  z-index: 3;
}
#liveToggler{
  position: absolute;
  top: 0.0625rem;
  left: 0.375rem;
  border-top-right-radius: 0.5625rem;
  border-bottom-left-radius: 0.5625rem;
  background: var(--corner-menu-bg);
  padding: 0.625rem;
  
  height: 2.625rem;
  z-index: 5;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer; display: none;
}
#liveToggler .icon{
  width: auto;
  height: 1.375rem;
  float: left;
  display: block;
  margin-right:0.3125rem;
  opacity: 1;
}
#liveToggler .icon svg {
  height: 1.375rem;
  display: block;
  float: left;
  width: auto;
  fill: #FFF;
  fill: var(--svg-fill);
  transition: all .3s ease-in-out;
}
@keyframes pulse {
  0% {
    opacity: 1;
    fill: var(--button-blue-bg-top);
  }
  50% {
    opacity: 1;
    fill: var(--svg-fill);
  }
  100% {
    opacity: 1;
    fill: var(--button-blue-bg-top);
  }
}
#liveToggler.live .icon svg{
  animation: pulse 3s infinite;
}
#liveToggler .live-label{
  color: #FFF;
}
.timehistory-plot-icons a,
.chart-plot-icons a,
.panel-icons a,
.timehistory-plot-icons button,
.chart-plot-icons button,
.panel-icons button {
  margin-right: 0.5rem;
  margin-left:0;
  width: auto;
  height: 1.375rem;
  float: left;
  display: block;
  cursor: pointer;
  color: #FFF;
  color: var(--svg-fill);
  text-decoration: none;
}
.timehistory-plot-icons a:last-child,
.chart-plot-icons a:last-child,
.panel-icons a:last-child{
  margin-right:0;
}
.timehistory-plot-icons a svg, .chart-plot-icons a svg, .panel-icons a svg,
.timehistory-plot-icons button svg, .chart-plot-icons button svg, .panel-icons button svg {
  height: 1.25rem;
  display: block;
  float: left;
  width: auto;
  fill: #FFF;
  fill: var(--svg-fill-light);
  transition: all .3s ease-in-out;
}
.timehistory-plot-icons button, .chart-plot-icons button, .panel-icons button {
  padding: 0;
  background: none;
  border: none;
  height: fit-content;
}
.timehistory-plot-icons {
  position: absolute;
  top: 0.4375rem !important;
  right: 0.625rem !important;
}
.chart-plot-icons {
  margin-top: 0.4375rem;
  margin-bottom: 0.4375rem;
  margin-right: 0.625rem;
}
.chart-marker-icons {
  position: absolute;
  width: 2em;
  cursor: pointer;
}
.chart-marker-icons svg {
  scale: 1 0.75;
  fill: var(--svg-fill-light);
  transition: all .3s ease-in-out;
}
.timehistory-plot-icons a svg:hover, .chart-plot-icons a svg:hover, .panel-icons a svg:hover,
.timehistory-plot-icons button:enabled svg:hover, .chart-plot-icons button:enabled svg:hover, .panel-icons button:enabled svg:hover,
.chart-marker-icons svg:hover {
  fill: #3279B5;
  fill: var(--panel-corner-menu-icon-color-hover);
  color: #3279B5;
  color: var(--panel-corner-menu-icon-color-hover);
}
.timehistory-plot-icons a.timehistory-plot-resize, .chart-plot-icons a.timehistory-plot-resize, .panel-icons a.timehistory-plot-resize {
  font-size:1.375rem;
}
.timehistory-plot-icons a.timehistory-plot-resize::before, .chart-plot-icons a.timehistory-plot-resize::before, .panel-icons a.timehistory-plot-resize::before {
  position: relative;
  top:-0.4375rem;
}
.status-online {
  color: #2196f3;
}
.grid-stack-item-th-heading{
  background: var(--panel-header-bg-color);
  border-bottom: var(--panel-header-bottom-border-width) solid var(--panel-header-bottom-border-bg);
}
.grid-stack-item-th-heading.active{
  background-color: #457ab2;
}

#thTablesPlaceholder{
  position: relative;
}
#thTablesPlaceholder .tablerWrapper{
  padding:0.625rem;
  overflow: hidden;
}

#heatMapWrapper{
  position: relative;
}
#heatMapWrapper .resultTable{
  padding:0.625rem;
  overflow: hidden;
  /*background: #171818;
  background: var(--grid-item-bg-color);*/
}
.grid-stack-th{
  position: relative;
}
.grid-stack-th .tablerWrapper{
  padding:0.625rem;
  overflow: hidden;
}
.grid-stack-th .resultTable{
  padding:0.625rem;
  overflow: hidden;
}
.resultTable.showValues .cellValue{
  display:inline !important;
  color:#000;
}
.resultTable .thEndingHour{
  display:none;
}
.resultTable.showEndingHour .thEndingHour{
  display:inline;
}

.insideTablerOuterWrapper::-webkit-scrollbar {
  height: 0.625rem;
  background: #171818;
  background: var(--grid-item-bg-color);
  margin-left:0.3125rem;
  margin-right:0.3125rem;
}
.insideTablerOuterWrapper::-webkit-scrollbar-track {
  -webkit-box-shadow: none;
}
.insideTablerOuterWrapper::-webkit-scrollbar-thumb {
  background-color: #FFF;
  outline: none;
  border-radius:3.125rem;

  border-right:0.125rem solid #171818;
  border-left:0.125rem solid #171818;
  border-top:0.125rem solid #171818;
  border-bottom:0.125rem solid #171818;

  border-right:0.125rem solid var(--grid-item-bg-color);
  border-left:0.125rem solid var(--grid-item-bg-color);
  border-top:0.125rem solid var(--grid-item-bg-color);
  border-bottom:0.125rem solid var(--grid-item-bg-color);
  -webkit-box-shadow:none;
}

#timeHistoryContainer h3{
  padding: 0 0 0.625rem 0;
}
#configurationInfoTable{
  margin:0;
}
#configurationInfoTableWrapper{
  display: block;
  float: left;
  width: 100%;
  height: auto;
  padding: 0.625rem;
}
#configurationInfoTableWrapper2{
  display: block;
  float: left;
  width: 100%;
  height: auto;
  overflow-x: auto;
}
.legend-legend {
  display: flex;
  float: left;
  width: auto;
  margin-top: 0.6975rem;
  flex-wrap: wrap;
}
.legend-correction-info {
  display: flex;
  float: left;
  width: auto;
  margin-top: 0.4375rem;
  margin-left: 0.4375rem;
  color: var(--svantek-accent-blue-text);
  flex-wrap: wrap;
}
.legend-legend-wrapper{
  display:flex;
  height:0.8125rem;
  justify-content: center;
  align-items: center;
}
.legend-legend-wrapper:not(:last-child){
  margin-right:0.625rem;
}
.legend-legend-wrapper{
  margin-bottom:0.625rem;
}
.legendLabel{
  margin-left:0.3125rem;
}
#templateListPlaceholder,
#templateListPlaceholderLoad,
#defaultTemplateListPlaceholder,
#templateAssignPlaceholder,
#tokenOptionsPlaceholder{
  transition: max-height 0.5s ease-in-out;
  max-height: 0;
  overflow: hidden;
  padding: 0;
  height: auto;
  display:block;
  cursor:initial;
}
#templateListPlaceholder .wrapper,
#templateListPlaceholderLoad .wrapper,
#defaultTemplateListPlaceholder .wrapper,
#templateAssignPlaceholder .wrapper,
#tokenOptionsPlaceholder .wrapper{
  display:block;
  float:left;
  width:100%;
  height:auto;
  padding:0.625rem;
  margin:0;
  background: #1c1d1d;
  background: var(--background-fix-bg);
}
#tokenOptionsPlaceholder p{
  margin-bottom:0 !important;
}
#templateListPlaceholder:hover,
#templateListPlaceholderLoad:hover,
#defaultTemplateListPlaceholder:hover,
#templateAssignPlaceholder:hover,
#tokenOptionsPlaceholder:hover{
  background: transparent;
}
#templateListPlaceholder.active,
#templateListPlaceholderLoad.active,
#defaultTemplateListPlaceholder.active,
#templateAssignPlaceholder.active,
#tokenOptionsPlaceholder.active{
  max-height: 31.25rem;
}
.addNewTemplate,
.gridTemplatesList,
.buttonsPlaceholder{
  display:block;
  float:left;
  width:100%;
  height: auto;
  margin-bottom:0.625rem;
}
.gridTemplatesList{
  background: rgba(33, 35, 35, 1);
  background: var(--grid-controls-bg);
  border-radius: 0.3125rem;
  padding:0.3125rem;
}
.addNewTemplate{
  display: flex;
}
#newTemplateName{
  margin-right:0.625rem;
}
.buttonsPlaceholder{
  display:flex;
  align-items: center;
  justify-content: center;
}
.gridTemplatesList label{
  width:100%;
  cursor:pointer;
  padding:0.3125rem;
  border-radius: 0.3125rem;
  font-weight: normal;
  background: #000;
  background: var(--list-item-bg-color);
}
.gridTemplatesList label .t{
  width: calc(100% - 4.475rem);
  display: inline-block;
}
.gridTemplatesList input[type="radio"]:checked+label {
  background: #3279B5;
  background: var(--button-blue-bg-bottom);
}
.gridTemplatesList label:hover {
  background: #3279B5;
  background: linear-gradient(180deg, #4BB3CA 0%, #3279B5 100%);
  background: var(--button-blue-bg-bottom);
  background: linear-gradient(180deg, var(--button-blue-bg-top) 0%, var(--button-blue-bg-bottom) 100%);
}
.gridTemplatesList input[type="radio"]{
  display:none;
}
.measuringPeriod,
.dayHours {
  background: rgb(0, 0, 0);
  background: var(--main-bg-color-default);
  float: left;
  padding: 0.625rem;
  border-radius: 0.5625rem;
  margin-bottom:0.625rem;
  width:100%;
}
#accordion .thresholdBlockLive{
  background: rgb(0, 0, 0);
  background: var(--main-bg-color-default);
  float: left;
  padding: 0.625rem;
  border-radius: 0.5625rem;
  margin-bottom:0.625rem;
  width:100%;
}
#accordion .thresholdBlockLive h4{
  margin-top:0;
}
.iconAccentBg{
  fill:#91D1E0;
  fill: var(--icon-accent-bg);
}
#station-list-block .item:hover .iconAccentBg{
  fill:#91D1E0;
  fill: var(--icon-accent-hover-bg);
}
#accordion .thresholdBlockLive table,
#accordion .thresholdBlock table {
  width: 100%;
  border-spacing: 0 0.625rem;
  border-collapse: separate;
}

#accordion .thresholdBlockLive table td,
#accordion .thresholdBlock table td {
  width: 50%;
  vertical-align: middle;
}

#accordion .thresholdBlockLive .span-color,
#accordion .thresholdBlock .span-color {
  width: 1rem; 
  height: 1rem; 
  display: inline-block; 
  top: 0.1875rem; 
  position: relative; 
  margin-right: 0.3125rem;
}

.span-color-warning {  
  background: orange;
  background: var(--live-view-value-warning) !important;
}

.span-color-alarm {  
  background: red;
  background: var(--live-view-value-alarm) !important;
}

#accordion .thresholdBlockLive input,
#accordion .thresholdBlock input {
  width: 100%; 
}
.templateAssignListRow{
  display:flex;
  float:left;
  width:100%;
  margin-bottom:0.3125rem;
  align-items: center;
}
.templateAssignListRow span{
  width:100%;
  max-width:10rem;
  display:block;
  float:left;
}
.templateAssignListRow select,
.templateAssignListRow select:hover,
.templateAssignListRow select:focus,
.templateAssignListRow select:active{
  max-width:50% !important;
  width:auto !important;
  padding-left:0.3125rem !important;
  margin-top:0 !important;
  padding-right:0 !important;
  background-color: #FFF !important;
  color:#000 !important;
}
#generalMeasuringPeriod{
  background: transparent;
}
.staticMeasurementPeriodUl{
  padding-left:0 !important;
  padding-right:0 !important;
}
#sideMenu .list-inline{
  margin-left:0;
}
.periodBlock li:first-child{
  padding-left:0;
}
.addNewPanelBlock{
  display:block;
  float:left;
  width:100%;
  height:auto;
  background: rgb(0, 0, 0);
  background: var(--sidebarCurtainBg3);
  margin-bottom:0.625rem;
  padding: 0.625rem;
  border-radius: 0.5625rem;
}
.addNewPanelBlock h4{
  margin-top: 0;
  font-size: 1.25rem;
  font-weight: bold;
  color: #b5b5b5;
  color: var(--block-header-text-color);
}
.addNewPanelBlock .addRow{
  display:none;
  float:left;
  width:100%;
  height:auto;
  justify-content: space-between;
  align-items: center;
  cursor:pointer;
}
.addNewPanelBlock .cancelRow{
  cursor: pointer;
  margin-bottom:0.625rem;
}
.addNewPanelBlock .cancelRow,
.addNewPanelBlock .addNewPanelContentBlock{
  display:none;
  float:left;
  width:100%;
  height:auto;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}
.display-flex{
  display:flex !important;
}
.grid-settings-button {
  display: inline-block;
  width: auto;
  width: 2.5rem;
  height: 2.25rem;
  background: #4BB3CA;
  /* background: linear-gradient(180deg, #4BB3CA 0%, #3279B5 100%);*/ 
  background: var(--button-blue-bg-top);
  /* background: linear-gradient(180deg, var(--button-blue-bg-top) 0%, var(--button-blue-bg-bottom) 100%);*/
  text-decoration: none;
  border: 0;
  color: #FFF;
  color: var(--ui-state-default-color);
  border-radius: 0.5625rem;
  padding: 0;
  transition: all .3s ease-in-out;
  display: flex;
  justify-content: center;
  align-items: center;
  float: right;
}
.addNewPanelBlock input[type="text"],
.addNewPanelBlock input[type="number"]{
  display:block;
  float:left;
  width:100%;
  height:auto;
  margin-bottom:0.625rem;
}
.addNewPanelBlock label{
  display:block;
  float:left;
  width:100%;
  height:auto;
  margin-bottom:0.625rem;
}
.addNewPanelBlock select,
.addNewPanelBlock select:hover,
.addNewPanelBlock select:focus,
.addNewPanelBlock select:active {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0.3125rem !important;
  margin-top: 0 !important;
  padding-right: 0 !important;
  background-color: #FFF !important;
  color: #000 !important;
  margin-top:0.3125rem !important;
}
.add-section-button-wrapper .ui-state-default{
  border: 0;
  background: transparent;
  font-weight: normal;
  height: auto;
  border-radius: 0;
  display: flex;
  align-items: center;
  padding-bottom:0;
  margin-bottom:0.625rem;
}
.add-section-button-wrapper .label-separation{
  cursor: pointer;
}
.add-section-button-wrapper .ui-state-default p{
  margin:0;
}
.add-section-button-wrapper .ui-state-default.ui-sortable-handle.ui-sortable-helper{
  background: #396371;
  border-radius: 0.5625rem;
  padding:0.625rem !important;
  height: 2.75rem !important;
}
.add-section-button-wrapper .ui-icon.ui-icon-arrowthick-2-n-s{
  background-color: #337ab7;
  background-color: var(--svantek-accent-blue);
  border-radius: 3.125rem;
  margin-right: 0.3125rem;
  cursor:pointer;
  color: #fff;
  background-image: url('https://code.jquery.com/ui/1.12.1/themes/base/images/ui-icons_ffffff_256x240.png') !important;
}
.add-section-button-wrapper .ui-state-default.ui-sortable-handle.ui-sortable-helper .ui-icon.ui-icon-arrowthick-2-n-s{
  background-color: #396371;
}

#active-points-filter .ui-state-default{
  border: 0;
  background: transparent;
  font-weight: normal;
  height: auto;
  border-radius: 0;
  display: flex;
  align-items: center;
  padding-bottom:0;
  margin-bottom:0.625rem;
}
#active-points-filter .label-separation{
  cursor: pointer;
}
#active-points-filter .ui-state-default p{
  margin:0;
}
#active-points-filter .ui-state-default.ui-sortable-handle.ui-sortable-helper{
  background: #396371;
  border-radius: 0.5625rem;
  padding:0.625rem !important;
  height: 2.75rem !important;
}
#active-points-filter .ui-icon.ui-icon-arrowthick-2-n-s, 
#projectParametersEditWrapper .points-descriptors .ui-icon.ui-icon-arrowthick-2-n-s {
  background-color: #337ab7;
  border-radius: 3.125rem;
  margin-right: 0.3125rem;
  cursor:pointer;
  background-image: url('https://code.jquery.com/ui/1.12.1/themes/base/images/ui-icons_ffffff_256x240.png') !important;
}
#active-points-filter .ui-state-default.ui-sortable-handle.ui-sortable-helper .ui-icon.ui-icon-arrowthick-2-n-s,
#projectParametersEditWrapper .points-descriptors .ui-state-default.ui-sortable-handle.ui-sortable-helper .ui-icon.ui-icon-arrowthick-2-n-s {
  background-color: #396371;
}
body {
  overflow: auto;
}
.project-map-meteo-block-data {
  color: #ddd;
  color: var(--panel-result-bigger-color);
  font-size: 1rem;
}
.heatmapClass[max-width~="1300px"] table thead th span {
  transform: rotate(-180deg);
  /*display: flex;*/
  justify-content: center;
  align-items: center;
  margin-left: 0.3125rem;
  margin-right: 0.3125rem;
  text-align: center;
  /*min-width: 4rem;*/
  padding-top: 0.8rem;
  padding-bottom: 0.8rem;
  writing-mode: vertical-rl;
  max-height: 10rem;
  overflow: hidden;
}

.heatmapClass table thead th {
  text-align: center;
}
.heatmapClass table thead th span {
  text-align: center;
  /*white-space: nowrap;*/
}
.heatmapClass table thead .correctionColumnClass span {
  white-space: initial;
}
.heatmapClass[max-width~="1300px"] table thead th {
  /*height: 2.8125rem;*/
  height:auto;
  text-align: center;
}

.panel-active {
  /* border-color: #457ab2;
  box-shadow: 0 0 10px #457ab2; */
}

.grid-stack-item:not(#liveViewBlock) .panel-active.grid-stack-item-content,
.panel-active .grid-stack-item-content2 {
  /* background-color: var(--group-highlight-bg) !important; */
}

.tabler-sortable-list .ui-state-default{
  border: 0;
  background: transparent;
  font-weight: normal;
  height: auto;
  border-radius: 0;
  display: flex;
  align-items: center;
  padding-bottom:0;
  margin-bottom:0.625rem;
}
.tabler-sortable-list .label-separation{
  cursor: pointer;
}
.tabler-sortable-list .ui-state-default p{
  margin:0;
}
.tabler-sortable-list .ui-state-default.ui-sortable-handle.ui-sortable-helper{
  background: #396371;
  border-radius: 0.5625rem;
  padding:0.625rem !important;
  height: 2.75rem !important;
}
.tabler-sortable-list .ui-icon.ui-icon-arrowthick-2-n-s{
  background-color: #337ab7;
  background-color: var(--svantek-accent-blue);
  border-radius: 3.125rem;
  margin-right: 0.3125rem;
  cursor:pointer;
  background-image: url('https://code.jquery.com/ui/1.12.1/themes/base/images/ui-icons_ffffff_256x240.png') !important;
}
.tabler-sortable-list .ui-state-default.ui-sortable-handle.ui-sortable-helper .ui-icon.ui-icon-arrowthick-2-n-s{
  background-color: #396371;
}

.static-content,
.static-editor {
  width: 100%;
  height: 100%;
  overflow-y: auto;
  color: #000;
  color: var(--grid-stack-tsth-panel-text);
}
.static-content img,
.static-editor img{
  max-width:100%;
}
.static-editor textarea {
  width: 100%;
  height:  100%;
  color: #000;
  color: var(--grid-stack-tsth-panel-text);
}

.grid-stack-th .grid-stack-tsth-panel > .flex-col-container {
  background: #ddd;
  background: var(--grid-stack-tsth-panel-container-bg);
  padding: 0.625rem 0.3125rem 0.625rem 0.3125rem;
  min-height: 2.3125rem;
}

.grid-stack-th .panel-icons {
  position: absolute;
  top: 0;
  right: 0.625rem;
  border-bottom-left-radius: 0.3125rem;
  background: var(--panel-header-bg-color);
  padding: 0.3125rem;
  z-index: 99;
}

.grid-stack-tsth-panel .trumbowyg-box {
  min-height: 100%;
  z-index: 1;
}
.grid-stack-tsth-panel .trumbowyg-box .trumbowyg-editor {
  min-height: 3.125rem;
}

.trumbowyg-input-html {
  color: #000;
}

.panel-export-csv text {
  fill: #000;
  fill: var(--panel-export-csv-color);
}

.main-menu-icons-list .label {
  display: none !important;
  font-size: 0.875rem; /*65%;*/
  line-height:1.2;
  padding: 0 !important;
  /*position: relative;
  top: -10px;*/
}

.navbar-default.extended .navbar-nav li a {
  min-height: 3.75rem; /*height: 54px;*/
}

.navbar.navbar-default.extended .main-menu-icons-list .label {
  display: block !important;
  margin-bottom: 0.25rem;
}

.main-menu-icons-list .user-profile-premium-star-side {
  top: 0rem;
  left: calc(50% + 0.75rem);
}

.navbar.navbar-default .container-fluid {
  text-align: center;
}

.navbar.navbar-default .copyright {
  transition: all .3s ease-in-out;
}

.navbar.navbar-default .copyright .company-name {
  display: none;
}

.navbar.navbar-default.extended .copyright .company-name {
  display: inline;
}

.main-menu-icons-list .main-nav-list {
  height: 50%;
}

.main-menu-icons-list {
  margin-bottom: 0.625rem;
  background: var(--grid-item-bg-color);
}
.expanded2 .main-menu-icons-list{
  background: var(--main-menu-icons-list);
}
ul.align-bottom {
  display: flex;
  flex-direction: column;
}

ul.align-bottom li:first-child {
  margin-top: auto;
}

.navbar.navbar-default.expanded2 .main-menu-icons-list {
  /*-webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: 0px 0px 10px 0px var(--box-shadow);
  box-shadow: 0px 0px 10px 0px var(--box-shadow)*/
  border-top: 0.0625rem solid #080808;
  border-bottom: 0.0625rem solid #080808;
  border-top: 0.0625rem solid var(--grid-item-border-color);
  border-bottom: 0.0625rem solid var(--grid-item-border-color);
}

.main-menu-icons-list li a:hover .user-profile-premium-star-side {
  color: #fff;
  color: var(--main-nav-glyphicon-hover);
}
.navbar-toggler {
  transition: all .3s ease-in-out;
  
  display: inline-block;
  
  
  cursor: pointer;
}
.navbar-toggler .navbar-toggler-wrapper{
  background: #fff;
  border: 0.0625rem solid #000;
  border-radius: 50%;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.navbar-toggler .desktop-menu-icon{
  display: flex;
  align-items: center;
  justify-content: center;
  height:1.125rem;
}
.navbar-toggler .desktop-menu-icon:before{
  padding: 0;
}

.navbar-toggler .glyphicons {
  color: #000;
  color: var(--main-nav-glyphicon-color);
  position: relative;
}

.navbar-toggler:hover {
  
}
.navbar-toggler .navbar-toggler-wrapper:hover{
  background: #3279B5;
  background: var(--button-blue-bg-bottom);
}
.navbar-toggler .navbar-toggler-wrapper:hover .glyphicons{
  color: #fff;
  color: var(--main-nav-glyphicon-hover);
}

.navbar.navbar-default .navbar-toggler {
  /*margin: 21px 0px 21px 0px;
  height: 20px;
  width: 20px; */ 
}



.side-bar-toggler.navbar-toggler {
  position: fixed;
  right: 15.75rem;
  top: 0.75rem;
  margin: 0;
  height: 1.875rem;
  width: 1.875rem;
  z-index: 1032;
}

.side-bar-toggler.navbar-toggler.project-side-bar {
  /*right: 14rem;*/
  right: 15rem;
}

.side-bar-toggler.navbar-toggler.web-interface-side-bar {
  /*right: 2.875rem;*/
  right: 20.875rem;
}

.side-bar-toggler.navbar-toggler .glyphicons {
  /*font-size: 1.25rem;
  top: -0.125rem;
  left: -0.3125rem;*/
}

.side-bar-toggler.navbar-toggler.wide {
  right: 0.125rem;
}


body {
  overflow-x: hidden !important;
}

.assign-template-icon-dark {
  display: var(--assign-template-icon-dark-display);
}

.assign-template-icon-light {
  display: var(--assign-template-icon-light-display);

}
.alignBlock{
  display:block;
  float:left;
  width:auto;
  margin-left:0.625rem;
  margin-bottom:0.625rem;
  border-radius: 0.3125rem;
  overflow: hidden;
}
.alignBlock button{
  display:flex;
  align-items: center;
  justify-content: center;
  float:left;
  width:2.25rem;
  height:2.25rem;
  background: #ddd;
  border:0;
  margin:0;
  transition: background 0.3s ease-in-out;
}
.alignBlock button.active{
  background: var(--svantek-accent-blue);
}
.alignBlock button:hover{
  background: var(--svantek-accent-blue);
  transition: background 0.3s ease-in-out;
}
.alignBlock button svg{
  fill:#333;
  fill:var(--alignBlock-svg);
}
.alignBlock button.active svg{
  fill:#FFF;
  fill:var(--alignBlock-active-svg);
}
.alignBlock button:hover svg{
  fill:#FFF;
  fill:var(--alignBlock-active-svg);
}

.sortBlock{
  display:block;
  float:left;
  width:auto;
  margin-left:0;
  margin-bottom:0.625rem;
  border-radius: 0.3125rem;
  overflow: hidden;
}
.sortBlock button{
  display:flex;
  align-items: center;
  justify-content: center;
  float:left;
  width:2.25rem;
  height:2.25rem;
  background: #ddd;
  border:0;
  margin:0;
  transition: background 0.3s ease-in-out;
}
.sortBlock button.active{
  background: var(--svantek-accent-blue);
}
.sortBlock button:hover{
  background: var(--svantek-accent-blue);
  transition: background 0.3s ease-in-out;
}
.sortBlock button svg{
  fill:#333;
  fill:var(--alignBlock-svg);
}
.sortBlock button.active svg{
  fill:#FFF;
  fill:var(--alignBlock-active-svg);
}
.sortBlock button:hover svg{
  fill:#FFF;
  fill:var(--alignBlock-active-svg);
}

.accordion-toolbar{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  padding:0.625rem;
  padding-bottom: 0;
  flex-wrap: wrap;
}

.accordion-toolbar .red-remove-button{
  margin-left: 0.625rem;
  margin-bottom: 0.625rem;
}
.grid-stack-tsth-panel img {
  vertical-align: baseline;
}

.grid-text-panel .grid-stack-tsth-panel {
  padding-top: 0.625rem !important;
}

.grid-text-panel .panel-icons {
  margin-top: 0.625rem;
}
#templateAssignPlaceholder .newTemplateMessagePlaceholder{
  padding-top: 0.625rem;
  float: left;
}

.timehistory-plot-save svg {
  fill: none;
  color: #333;
  color: var(--panel-header-bg-color)
}

.timehistory-plot-save svg path {
  fill: #FFF;
  fill: var(--svg-fill-light);
  transition: all .3s ease-in-out;
}

.timehistory-plot-save svg polyline {
  fill: none;
}

.timehistory-plot-save svg:hover {
  fill: none !important;
  color: #333 !important;
  color: var(--panel-header-bg-color) !important;
}
.timehistory-plot-save svg:hover path {
  fill: #3279B5;
  fill: var(--panel-corner-menu-icon-color-hover);
}
.fullScreened{
  position: fixed !important;
  z-index: 9999999 !important;
  top: 0 !important;
  right: 0 !important;
  left: 0 !important;
  bottom: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  background: rgb(0, 0, 0) !important;
  background: var(--main-bg-color-default) !important;
}
.displayNoneImportant{
  display: none !important;
}
#main-page-grid .fullScreened .grid-stack-item-content{
  left: 0;
  right: 0;
  height: 100vh;
}
#main-page-grid .fullScreened .grid-stack-item-content-wrapper {
  overflow: auto !important;
}
#main-page-grid .fullScreened .grid-stack-item-content-wrapper {
  overflow: auto !important;
}
#main-page-grid .fullScreened .grid-stack-item-content-wrapper {
  overflow: auto !important;
}
#main-page-grid .fullScreened .grid-stack-item-content-wrapper {
  overflow: auto !important;
}

@media( max-height: 42.5rem ){
  .navbar.navbar-default.extended ul.align-bottom:nth-child(2) li:first-child {
    margin-top: 0;
  }
  .navbar.navbar-default.extended .main-menu-icons-list .main-nav-list:first-child{
    height:auto;
  }
  .navbar.navbar-default.extended .user-nav-list {
    width: 13.5rem !important;
  }
}
@media( max-height: 40.625rem ){
  .navbar.navbar-default.extended .main-menu-icons-list .main-nav-list{
    height:auto;
  }
  .navbar.navbar-default.extended .main-menu-icons-list{
    overflow-y: auto;
  }
}

@media( max-height: 27.5rem ){
  ul.align-bottom:nth-child(2) li:first-child {
    margin-top: 0;
  }
  .main-menu-icons-list .main-nav-list:first-child{
    height:auto;
  }
  .user-nav-list {
    width: 13.5rem !important;
  }

  .main-menu-icons-list .main-nav-list{
    height:auto;
  }
  .main-menu-icons-list{
    overflow-y: auto;
  }
}
.norm-info-block {
  background-color: var(--resultstree-bg);
  padding: 0.625rem;
  color: var(--text-white-on-black);
  text-align: justify;
}

.norm-info-block .glyphicons-info-sign {
  font-size: 1.125rem;
  top: 0.25rem;
  color: #FF9800;
}

.allProjectsTemplateSearchWrapper {
  position: relative;
  float: left;
  width: 100%;
}
.allProjectsTemplateSearchWrapper input {
  width: 100%;
}

.formatting-section-row select {
  margin-top: 0 !important;
  margin-bottom: 0.75rem !important;
}

#currentTemplateInfo {
  margin: 0.5rem;
  width: calc(100% - 1rem) !important;
}

#currentTemplateInfo > div {
  text-overflow: ellipsis;
  max-width: 100%;
  overflow: hidden;
  display: inline-block;
  text-decoration: underline;
  position: relative;
  top: 0.3125rem;
}

.ldenCorrsBlock > div {
  float: left;
  width: 100%;
}

.ldenCorrsBlock > div:first-child {
  margin-bottom: 0.5rem;
}

.ldenCorrsBlock > div > h4 {
  display: inline-block;
}

.ldenCorrsBlock > div > input {
  float: right;
  width: 5.2rem;
  position: relative;
  top: -0.2rem;
  height: 2rem;
}
.nightHours{
  display:none !important;
}
.heatmapDimmer{
  display: none;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,0.7);
  z-index: 7;
}
.heatmapApplyCells{
  display: none;
  position: absolute;
  left: 0;
  padding: 0.625rem;
  padding-top:0;
  right: 0;
  bottom: 0;
  z-index: 7;
  justify-content: center;
  align-items: center;
}
.heatmapApplyCellsInner{
  display: flex;
  left: 0;
  padding: 0.8rem;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,0.7);
  z-index: 7;
  justify-content: center;
  align-items: center;
}
.heatmapTableWrapper.additionalPadding{
  padding-bottom: 2.5rem;
}
.heatmapTableWrapper.cellPointers td{
  cursor: pointer;
}
.heatmapTableWrapper.cellPointers td:first-child,
.heatmapTableWrapper.cellPointers td:last-child{
  cursor: inherit;
}
.start-time-info{
  background:transparent !important;
  float:left;
  width:100%;
  padding-left:0;
  padding-right:0;
  padding-top:0;
}
.rsOptionRow {
  width: 100%;
  margin-bottom: 1rem;
}
.rsOptionRow.flex-between {
  display: flex;
  justify-content: space-between;
}
.flex-between .flex-switch-display {
  width: auto;
}
.rsOptionRow select, .rsOptionRow select:hover {
  margin: 0 !important;
}
.rsOptionRow label {
  margin-bottom: 0.1rem;
}