h1, h2, h3 {
    color:#fff;
}
.d-none,
.hidden,
.mpart_hidden,
.tag_hidden,
.machine_hidden {
  display: none !important;
}

.w-200 {
    width: 200px;
    text-align: center;
}
.flashes {

    text-align: center;
}
.flashes span{
    color: orangered;
    list-style-type: none;
    text-align: center;
}

.dropdown-mparam-button {
    width:12rem !important;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;

}


.dropdown-item-mparam:hover {
    background-color: #df691a !important;
}

/*/------------------------------------------------------------------
[Inputs - Switcher]
*/
.switch-button {
 display: inline-block;
 border-radius: 50px;
 background-color: #b3b3b3;
 width: 60px;
 height: 27px;
 padding: 4px;
 position: relative;
 overflow: hidden;
 vertical-align: middle;
}
.switch-button input[type="checkbox"] {
 display: none;
}
.switch-button label {
 border-radius: 50%;
 -webkit-box-shadow: 0 0 1px 1px #fff inset;
 box-shadow: 0 0 1px 1px #FFF inset;
 background-color: #ffffff;
 margin: 0;
 height: 19px;
 width: 19px;
 z-index: 1;
 display: block;
 cursor: pointer;
 background-clip: padding-box;
}
.switch-button label:before {
 position: absolute;
 font-size: .8rem;
 font-weight: 600;
 z-index: 0;
 content: "OFF";
 right: 0;
 display: block;
 width: 100%;
 height: 100%;
 line-height: 27px;
 top: 0;
 text-align: right;
 padding-right: 10px;
 color: #ffffff;
}
.switch-button input[type="checkbox"]:checked + span {
 background-color: #fe669e;
 display: block;
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 padding: 4px;
}
.switch-button input[type="checkbox"]:checked + span label {
 float: right;
 border-color: #fe4d8e;
}
.switch-button input[type="checkbox"]:checked + span label:before {
 position: absolute;
 font-size: .8rem;
 font-weight: 600;
 z-index: 0;
 content: "ON";
 color: #ffffff;
 left: 0;
 text-align: left;
 padding-left: 10px;
}
.switch-button.switch-button-yesno label:before {
 content: "NO";
}
.switch-button.switch-button-yesno input[type="checkbox"]:checked + span label:before {
 content: "YES";
}
.switch-button.switch-button-xs {
 height: 20px;
 width: 53px;
 line-height: 16px;
 width: 50px;
}
.switch-button.switch-button-xs label {
 height: 12px;
 width: 12px;
}
.switch-button.switch-button-xs label:before {
 line-height: 21px;
}
.switch-button.switch-button-sm {
 height: 24px;
 width: 57px;
 line-height: 20px;
}
.switch-button.switch-button-sm label {
 height: 16px;
 width: 16px;
}
.switch-button.switch-button-sm label:before {
 line-height: 25px;
}
.switch-button.switch-button-lg {
 height: 30px;
 width: 63px;
 line-height: 26px;
 width: 65px;
}
.switch-button.switch-button-lg label {
 height: 22px;
 width: 22px;
}
.switch-button.switch-button-lg label:before {
 line-height: 30px;
}
.switch-button.switch-button-success {
 background-color: #b3b3b3;
}
.switch-button.switch-button-success label {
 border-color: #ababab;
}
.switch-button.switch-button-success input[type="checkbox"]:checked + span {
 background-color: #48a648;
}
.switch-button.switch-button-success input[type="checkbox"]:checked + span label {
border-color: #449d44;
}
.switch-button.switch-button-warning {
 background-color: #b3b3b3;
}
.switch-button.switch-button-warning label {
 border-color: #ababab;
}
.switch-button.switch-button-warning input[type="checkbox"]:checked + span {
 background-color: #fbbc05;
}
.switch-button.switch-button-warning input[type="checkbox"]:checked + span label {
 border-color: #e3aa04;
}
.switch-button.switch-button-danger {
 background-color: #b3b3b3;
}
.switch-button.switch-button-danger label {
 border-color: #ababab;
}
.switch-button.switch-button-danger input[type="checkbox"]:checked + span {
 background-color: #ea4335;
}
.switch-button.switch-button-danger input[type="checkbox"]:checked + span label {
 border-color: #e82e1e;
}

.led-red-medium {
  cursor: pointer;
  width: 12px;
  height: 12px;
  background-color: #F00;
  border-radius: 50%;
  box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 3px 1px, inset #441313 0 -1px 4px, rgba(255, 0, 0, 0.5) 0 1px 6px;
  -webkit-animation: blinkRedMedium 0.5s infinite;
  -moz-animation: blinkRedMedium 0.5s infinite;
  -ms-animation: blinkRedMedium 0.5s infinite;
  -o-animation: blinkRedMedium 0.5s infinite;
  animation: blinkRedMedium 0.5s infinite;
}
  
  @-webkit-keyframes blinkRedMedium {
      from { background-color: #F00; }
      50% { background-color: #A00; box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 3px 1px, inset #441313 0 -1px 5px, rgba(255, 0, 0, 0.5) 0 2px 0;}
      to { background-color: #F00; }
  }
  @-moz-keyframes blinkRedMedium {
      from { background-color: #F00; }
      50% { background-color: #A00; box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 3px 1px, inset #441313 0 -1px 5px, rgba(255, 0, 0, 0.5) 0 2px 0;}
      to { background-color: #F00; }
  }
  @-ms-keyframes blinkRedMedium {
      from { background-color: #F00; }
      50% { background-color: #A00; box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 3px 1px, inset #441313 0 -1px 5px, rgba(255, 0, 0, 0.5) 0 2px 0;}
      to { background-color: #F00; }
  }
  @-o-keyframes blinkRedMedium {
      from { background-color: #F00; }
      50% { background-color: #A00; box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 3px 1px, inset #441313 0 -1px 5px, rgba(255, 0, 0, 0.5) 0 2px 0;}
      to { background-color: #F00; }
  }
  @keyframes blinkRedMedium {
      from { background-color: #F00; }
      50% { background-color: #A00; box-shadow: rgba(0, 0, 0, 0.2) 0 -1px px 1px, inset #441313 0 -1px 5px, rgba(255, 0, 0, 0.5) 0 2px 0;}
      to { background-color: #F00; }
  }
  
  .led-green-medium {
    cursor: pointer;
    width: 12px;
    height: 12px;
    background-color: rgb(0, 255, 0);
    border-radius: 50%;
    box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #304701 0 -1 9px, rgb(0, 255, 0) 0 2px 12px;
  }
  
  .led-grey-medium {
    width: 12px;
    height: 12px;
    background-color: #abb6c2;
    border-radius: 50%;
    box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #3f3f3f 0 -1px 9px;
    animation: none;
  }
  
  
  .led-blue-medium {
    cursor: pointer;
    width: 12px;
    height: 12px;
    background-color: #24E0FF;
    border-radius: 50%;
    box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #006 0 -1px 9px, #3F8CFF 0 2px 14px;
  }
  
  
  .led-yellow-medium {
      width: 12px;
      height: 12px;
      background-color: rgb(255, 255, 0);
      border-radius: 50%;
      box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #FF0 0 -1px 9px, #FF0 0 2px 12px;
  }
  
  
  
  @font-face {
    font-family: "D7MI";
    src: url("./../fonts/DSEG7Modern-Italic.woff") format('woff');
  }
  
  @font-face {
    font-family: "D14MI";
    src: url("./../fonts/DSEG14Modern-Italic.woff") format('woff');
  }
  
  @font-face {
    font-family: "D7MBI";
    src: url("./../fonts/DSEG7Modern-BoldItalic.woff") format('woff');
  }
  
  
  
  .D7MI {
  font-family: "D7MI";
  }
  
  .D7MBI, 
  .axisInformer {
  font-family: "D7MBI";
  }
  
  .D14MI {
  font-family: "D14MI";
  }
  
  .Clock-Bar-Back {
    font-size: 30px;
    color: rgba(0,0,0,0.15);
    position: absolute;
    left: 180px;
    top: 52px;
  }
  
  
  .Clock-Bar-Front {
    font-size: 30px;
    position: absolute;
    left: 180px;
    top: 52px;
  }
  
  .Clock-Wrapper{
      position:relative;
      border:6px solid #000;
      border-radius:9px;
      height:120px;
      width:270px;
      background-color:#fb7c00;
      box-shadow: 4px 4px 1px 0px rgba(0,0,0,0.1) inset; 
  }
  
  
  .Clock-Time-Background{
      z-index:50;
    position: absolute;
      color:rgba(0,0,0,0.15);
    font-size:70px;
    left: 6px;
  }
  
  .Clock-Time-Front{
      z-index:100;
    position: absolute;
    font-size:70px;
    left: 6px;
   
  }
  
  .dmWrapper {
    justify-content: space-around;
  }
  
  .dmWrapperItem {
    height: 100%;
    border-radius: 5px;
    font-size: 13px;
  }
  
  .adcWrapper {
  position:relative;
  border:2px solid white;
  /* background-color:#fb7c00;
   */box-shadow: 4px 4px 1px 0px rgba(0,0,0,0.1) inset; 
   border-radius: 6px;
   width:80%;
  }
  
  .diag input[type=range]  {
    width: 100px;
    height: 100px;
    outline: none;
    transform: rotate(90deg);
    background: transparent;
  }
  
  .axisInformerWrapper {
    position:relative;
    border:1px solid white;
    box-shadow: 4px 4px 1px 0px rgba(0,0,0,0.1) inset; 
    border-radius: 1.5px;
    width:60px;
    box-shadow: 1px 1px 0px 0px rgba(0,0,0,0.1) inset; 
    text-align: end;
  
  }

  .table > tbody > tr > td {
    vertical-align: middle !important;
  }

  .table > tbody > tr > td:not(*:root) {
    padding-top:0 !important;
    vertical-align: baseline !important;
  }
    
  .pointer, .ace_pointer {
    cursor: pointer !important ;
  }

  .dot-spin {
    position: relative;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: transparent;
    color: transparent;
    box-shadow: 0 -18px 0 0 #fff, 12.72984px -12.72984px 0 0 #fff, 18px 0 0 0 #fff, 12.72984px 12.72984px 0 0 rgba(136, 136, 136, 0), 0 18px 0 0 rgba(136, 136, 136, 0), -12.72984px 12.72984px 0 0 rgba(136, 136, 136, 0), -18px 0 0 0 rgba(136, 136, 136, 0), -12.72984px -12.72984px 0 0 rgba(136, 136, 136, 0);
    animation: dotSpin 1.5s infinite linear;
  }
  
  @keyframes dotSpin {
    0%,
    100% {
      box-shadow: 0 -18px 0 0 #fff, 12.72984px -12.72984px 0 0 #fff, 18px 0 0 0 #fff, 12.72984px 12.72984px 0 -5px rgba(136, 136, 136, 0), 0 18px 0 -5px rgba(136, 136, 136, 0), -12.72984px 12.72984px 0 -5px rgba(136, 136, 136, 0), -18px 0 0 -5px rgba(136, 136, 136, 0), -12.72984px -12.72984px 0 -5px rgba(136, 136, 136, 0);
    }
    12.5% {
      box-shadow: 0 -18px 0 -5px rgba(136, 136, 136, 0), 12.72984px -12.72984px 0 0 #fff, 18px 0 0 0 #fff, 12.72984px 12.72984px 0 0 #fff, 0 18px 0 -5px rgba(136, 136, 136, 0), -12.72984px 12.72984px 0 -5px rgba(136, 136, 136, 0), -18px 0 0 -5px rgba(136, 136, 136, 0), -12.72984px -12.72984px 0 -5px rgba(136, 136, 136, 0);
    }
    25% {
      box-shadow: 0 -18px 0 -5px rgba(136, 136, 136, 0), 12.72984px -12.72984px 0 -5px rgba(136, 136, 136, 0), 18px 0 0 0 #fff, 12.72984px 12.72984px 0 0 #fff, 0 18px 0 0 #fff, -12.72984px 12.72984px 0 -5px rgba(136, 136, 136, 0), -18px 0 0 -5px rgba(136, 136, 136, 0), -12.72984px -12.72984px 0 -5px rgba(136, 136, 136, 0);
    }
    37.5% {
      box-shadow: 0 -18px 0 -5px rgba(136, 136, 136, 0), 12.72984px -12.72984px 0 -5px rgba(136, 136, 136, 0), 18px 0 0 -5px rgba(136, 136, 136, 0), 12.72984px 12.72984px 0 0 #fff, 0 18px 0 0 #fff, -12.72984px 12.72984px 0 0 #fff, -18px 0 0 -5px rgba(136, 136, 136, 0), -12.72984px -12.72984px 0 -5px rgba(136, 136, 136, 0);
    }
    50% {
      box-shadow: 0 -18px 0 -5px rgba(136, 136, 136, 0), 12.72984px -12.72984px 0 -5px rgba(136, 136, 136, 0), 18px 0 0 -5px rgba(136, 136, 136, 0), 12.72984px 12.72984px 0 -5px rgba(136, 136, 136, 0), 0 18px 0 0 #fff, -12.72984px 12.72984px 0 0 #fff, -18px 0 0 0 #fff, -12.72984px -12.72984px 0 -5px rgba(136, 136, 136, 0);
    }
    62.5% {
      box-shadow: 0 -18px 0 -5px rgba(136, 136, 136, 0), 12.72984px -12.72984px 0 -5px rgba(136, 136, 136, 0), 18px 0 0 -5px rgba(136, 136, 136, 0), 12.72984px 12.72984px 0 -5px rgba(136, 136, 136, 0), 0 18px 0 -5px rgba(136, 136, 136, 0), -12.72984px 12.72984px 0 0 #fff, -18px 0 0 0 #fff, -12.72984px -12.72984px 0 0 #fff;
    }
    75% {
      box-shadow: 0 -18px 0 0 #fff, 12.72984px -12.72984px 0 -5px rgba(136, 136, 136, 0), 18px 0 0 -5px rgba(136, 136, 136, 0), 12.72984px 12.72984px 0 -5px rgba(136, 136, 136, 0), 0 18px 0 -5px rgba(136, 136, 136, 0), -12.72984px 12.72984px 0 -5px rgba(136, 136, 136, 0), -18px 0 0 0 #fff, -12.72984px -12.72984px 0 0 #fff;
    }
    87.5% {
      box-shadow: 0 -18px 0 0 rgba(136, 136, 136, 0) 12.72984px -12.72984px 0 0 #fff, 18px 0 0 -5px rgba(136, 136, 136, 0), 12.72984px 12.72984px 0 -5px rgba(136, 136, 136, 0), 0 18px 0 -5px rgba(136, 136, 136, 0), -12.72984px 12.72984px 0 -5px rgba(136, 136, 136, 0), -18px 0 0 -5px rgba(136, 136, 136, 0), -12.72984px -12.72984px 0 0 #fff;
    }
  }
 #diagnostic_mode {
  position: fixed; 
  left:0; 
  top:0; 
  width:100%; 
  height:100%; 
  z-index:2; 
  background: #343434cc;
 }

button:disabled,
input:disabled +span > label:hover {
  cursor:not-allowed !important;
}

.ace_progress {
  display: flex;
  height: 4rem;
  margin-bottom: 2rem;
  overflow: hidden;
  font-size: 1rem;
  background-color: #4e5d6c;
  border-radius: 4px;
  width: 50rem;
}

.ace_card-body {
  padding: 0px !important;
}



.link_cont{
  height: 12rem;
  width: 8rem;

}

.linkwrapper {
  height: 5rem;
  width: 5rem;
}

.linktextwrapper {
  text-align: center;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  font-size:0.8rem; 
  background-color: orangered;
  width: 7rem;
  height: 3rem;

}
.cover {
  object-fit: cover;
}

.imgborder {
  border: solid white 1px;
}

.imgdownload {
  height: 10rem !important;
  width: 10rem !important; 
}

.textdownload {
  height: 30rem !important;
  width: 30rem !important; 

}


@media screen and (max-width: 1199px) {
  .desktop {
    display:none !important;
    height:0;
  }

  .wr1{
  justify-content:flex-start;
  flex-direction:column;
  }

  .diagnostic_close {
    position: fixed; 
    right: 0;
  }
  
  #diagnostic_mode {
    zoom:0.5 !important;
    overflow: auto;
  }

  .wr-step{
    flex-direction: column;
  }
  .modal{
    width: auto !important;
  }
  .modal-backdrop {
    width: 100%;
  }

  h3 {
    font-size: 1.2rem;
    }
  
  h1 {
  font-size: 2rem;
  }

  .direct-chat-msg.w-50 {
    width: 100% ! important;
  }

  .direct-chat-msg.rright.mleft {
    margin: 0 !important;
    width: 100%;
  }

  #serv {
    width:100% !important;
  }

  .direct-notes-messages, .direct-chat-text {
    word-break: break-all;
  }

  .box {
    padding: 0;
  } 

  .jconfirm.jconfirm-supervan .jconfirm-box div.jconfirm-title-c {
    font-size: 15px;
  }

}

@media screen and (min-width: 1200px) {
  .mobile {
    display:none !important;
    height:0;
  }

  .wr1{
    justify-content:flex-start;
    flex-direction:row;
    /* overflow: hidden; */
  }
   
}

#menuToggle
{
  display: block;
  position: relative;
  top: 1rem;
  left: 0;
  
  z-index: 1;
  
  -webkit-user-select: none;
  user-select: none;
}

#menuToggle a
{
  text-decoration: none;
  color: #232323;
  width: 13rem;
  transition: color 0.3s ease;
}

#menuToggle a:hover
{
  color: tomato;
}


#menuToggle input
{
  display: block;
  width: 40px;
  height: 32px;
  position: absolute;
  top: -7px;
  left: -5px;
  
  cursor: pointer;
  
  opacity: 0; /* hide this */
  z-index: 2; /* and place it over the hamburger */
  
  -webkit-touch-callout: none;
}

/*
* Just a quick hamburger
*/
#menuToggle span
{
  display: block;
  width: 33px;
  height: 4px;
  margin-bottom: 5px;
  position: relative;
  
  background: #cdcdcd;
  border-radius: 3px;
  
  z-index: 1;
  
  transform-origin: 4px 0px;
  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
}

#menuToggle span:first-child
{
  transform-origin: 0% 0%;
}

#menuToggle span:nth-last-child(2)
{
  transform-origin: 0% 100%;
}

/* 
* Transform all the slices of hamburger
* into a crossmark.
*/
#menuToggle input:checked ~ span
{
  opacity: 1;
  transform: rotate(45deg) translate(-2px, -1px);
  background: #232323;
}

/*
* But let's hide the middle one.
*/
#menuToggle input:checked ~ span:nth-last-child(3)
{
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

/*
* Ohyeah and the last one should go the other direction
*/
#menuToggle input:checked ~ span:nth-last-child(2)
{
  transform: rotate(-45deg) translate(0, -1px);
}

/*
* Make this absolute positioned
* at the top left of the screen
*/
#menu
{
  position: absolute;
  width: 19rem;
  margin: -100px 0 0 -100px;
  padding: 5rem;
  padding-top: 125px;
  background: #ededed;
  list-style-type: none;
  -webkit-font-smoothing: antialiased;
  transform-origin: 0% 0%;
  transform: translate(-100%, 0);
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
}

#menu li
{
  padding: 10px 0;
  font-size: 22px;
}

/*
* And let's slide it in from the left
*/
#menuToggle input:checked ~ ul
{
  transform: none;
}


.password {
	width: 11rem;
  position: relative;
  
}
.password-input {
	width: 100%;
	padding: 5px 0;
	height: 30px;
	line-height: 40px;
	text-indent: 10px;
	border: none;
  font-size: 16px;
  color: white;
  background-color: black;
}
.password-control {
	position: absolute;
	top: 6px;
	right: 6px;
	display: inline-block;
	width: 20px;
	height: 20px;
	background: url(./../img/view.svg) 0 0 no-repeat;
}
.password-control.view {
	background: url(./../img/no-view.svg) 0 0 no-repeat;
}

.diag-0 {
	transform: rotate(-90deg);
}


.diag-1 {
	transform: rotate(0deg);	
}


.diag-2 {
	transform: rotate(0deg);
}

.btn-orangered {
  background-color:  rgb(255, 69, 0);
}

.btn-orangered:focus, .btn-orangered.focus {
  box-shadow: 0 0 0 0.2rem rgba(255, 69, 0,  0.5);
}

.btn-orangered.disabled, .btn-orangered:disabled {
  color: #fff;
  background-color:  rgb(255, 69, 0);
  border-color: rgba(255, 69, 0)
}

.btn-orangered:not(:disabled):not(.disabled):active, .btn-orangered:not(:disabled):not(.disabled).active,
.show > .btn-orangered.dropdown-toggle {
  color: #fff;
  background-color:  rgb(250, 60, 0);;
  border-color:  rgb(250, 60, 0);;
}

.btn-orangered:not(:disabled):not(.disabled):active:focus, .btn-orangered:not(:disabled):not(.disabled).active:focus,
.show > .btn-orangered.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(255, 69, 0,  0.5);
}


.password-control-freg{
  position: absolute;
  top: 14px;
  right: 150px;
  width: 30px;
  height: 30px;
  background: url(./../img/view_black.svg) 0 0 no-repeat; 
  z-index: 4;
}

.password-control-freg.view{
  background: url(./../img/no-view_black.svg) 0 0 no-repeat; 
  z-index: 4;
}

.password-control_ssh {
  top: 74px;
  right: 156px;
}

/* dropdown */
/* Dropdown Button */
.dropbtn {
 /* background-color: #04AA6D;*/
  color: white;
  padding: 16px;
  font-size: 16px;
  border: none;
  cursor: pointer;
}

/* Dropdown button on hover & focus */
.dropbtn:hover, .dropbtn:focus {
  background-color: #3e8e41;
}

/* The search field */
#myInput,
#myInput_opt
{
  box-sizing: border-box;
  background-image: url('./../img/searchicon.png');
  background-position: 14px 12px;
  background-repeat: no-repeat;
  font-size: 16px;
  padding: 14px 20px 12px 45px;
  border: none;
  border-bottom: 1px solid #ddd;
  position: sticky; 
  top: 0;
}

/* The search field when it gets focus/clicked on */
#myInput:focus, #myInput_opt:focus {outline: 3px solid #ddd;}

/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: relative;
  display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none ! important;
  position: absolute;
  background-color: #f6f6f6;
  width: 25rem;
  height: 35rem;
  overflow: scroll;
  border: 1px solid #ddd;
  z-index: 1;
  opacity: 0;
}

/* Links inside the dropdown */
.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #f1f1f1}

/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
.show {
  display:block !important;
  opacity: 1;
}

.bw-back {
    background: url(./../img/bw.jpg);
}


[type=button]:hover {
  filter: brightness(0.9);
}

.item_option {
  border-bottom: solid 1px #5bc0de;
  height:2rem;
  border-left: solid 1px #5bc0de;
  width: 3rem;
  margin-left: 1rem;
  padding:1rem;
}


.item_option_text{
  border: solid 1px #5bc0de;
  padding: 0.25rem;
  margin-top: 1rem;
  margin:1rem 0 0 4rem;
}

.btn-del-item {
  width: 1.7rem;
  height: 1.7rem;
  line-height: 0;
  padding: 0 0 0.175rem 0;
  display: none; 
  align-self: flex-end;
 }

.item_option_container{
  width:12rem
}

.item_option_container:hover button {
  display: inline-block;
}

.dropdown-menu {
  overflow-y: auto;
  max-height: 50rem;
}

/* chatBox Start */



.box {
  position: relative;
  border-radius: 3px;
  border-top: 3px solid #fefefe33;
  width: 100%;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  padding: 0.5rem 1.5rem 1.5rem 1.5rem;
  
}
.box.box-primary {
  border-top-color: #3c8dbc;
}
.box.box-info {
  border-top-color: #00c0ef;
}
.box.box-danger {
  border-top-color: #dd4b39;
}
.box.box-warning {
  border-top-color: #f39c12;
}
.box.box-success {
  border-top-color: #00a65a;
  border-top-color: transparent;
}

.box.box-default {
  border-top-color: #d2d6de;
}
.box.collapsed-box .box-body, .box.collapsed-box .box-footer {
  display: none;
}
.box .nav-stacked>li {
  border-bottom: 1px solid #f4f4f4;
  margin: 0;
}
.box .nav-stacked>li:last-of-type {
  border-bottom: none;
}
.box.height-control .box-body {
  max-height: 300px;
  overflow: auto;
}
.box .border-right {
  border-right: 1px solid #f4f4f4;
}
.box .border-left {
  border-left: 1px solid #f4f4f4;
}
.box.box-solid {
  border-top: 0;
}
.box.box-solid>.box-header .btn.btn-default {
  background: transparent;
}
.box.box-solid>.box-header .btn:hover, .box.box-solid>.box-header a:hover {
  background: rgba(0, 0, 0, 0.1);
}
.box.box-solid.box-default {
  border: 1px solid #d2d6de;
}
.box.box-solid.box-default>.box-header {
  color: #444;
  background: #d2d6de;
  background-color: #d2d6de;
}
.box.box-solid.box-default>.box-header a, .box.box-solid.box-default>.box-header .btn {
  color: #444;
}
.box.box-solid.box-primary {
  border: 1px solid #3c8dbc;
}
.box.box-solid.box-primary>.box-header {
  color: #fff;
  background: #3c8dbc;
  background-color: #3c8dbc;
}
.box.box-solid.box-primary>.box-header a, .box.box-solid.box-primary>.box-header .btn {
  color: #fff;
}
.box.box-solid.box-info {
  border: 1px solid #00c0ef;
}
.box.box-solid.box-info>.box-header {
  color: #fff;
  background: #00c0ef;
  background-color: #00c0ef;
}
.box.box-solid.box-info>.box-header a, .box.box-solid.box-info>.box-header .btn {
  color: #fff;
}
.box.box-solid.box-danger {
  border: 1px solid #dd4b39;
}
.box.box-solid.box-danger>.box-header {
  color: #fff;
  background: #dd4b39;
  background-color: #dd4b39;
}
.box.box-solid.box-danger>.box-header a, .box.box-solid.box-danger>.box-header .btn {
  color: #fff;
}
.box.box-solid.box-warning {
  border: 1px solid #f39c12;
}
.box.box-solid.box-warning>.box-header {
  color: #fff;
  background: #f39c12;
  background-color: #f39c12;
}
.box.box-solid.box-warning>.box-header a, .box.box-solid.box-warning>.box-header .btn {
  color: #fff;
}
.box.box-solid.box-success {
  border: 1px solid #00a65a;
}
.box.box-solid.box-success>.box-header {
  color: #fff;
  background: #00a65a;
  background-color: #00a65a;
}
.box.box-solid.box-success>.box-header a, .box.box-solid.box-success>.box-header .btn {
  color: #fff;
}
.box.box-solid>.box-header>.box-tools .btn {
  border: 0;
  box-shadow: none;
}
.box.box-solid[class*='bg']>.box-header {
  color: #fff;
}
.box .box-group>.box {
  margin-bottom: 5px;
}
.box .knob-label {
  text-align: center;
  color: #333;
  font-weight: 100;
  font-size: 12px;
  margin-bottom: 0.3em;
}
.box>.overlay, .overlay-wrapper>.overlay, .box>.loading-img, .overlay-wrapper>.loading-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%}
.box .overlay, .overlay-wrapper .overlay {
  z-index: 50;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 3px;
}
.box .overlay>.fa, .overlay-wrapper .overlay>.fa {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -15px;
  margin-top: -15px;
  color: #000;
  font-size: 30px;
}
.box .overlay.dark, .overlay-wrapper .overlay.dark {
  background: rgba(0, 0, 0, 0.5);
}
.box-header:before, .box-body:before, .box-footer:before, .box-header:after, .box-body:after, .box-footer:after {
  content: " ";
  display: table;
}
.box-header:after, .box-body:after, .box-footer:after {
  clear: both;
}
.box-header {
  color: #444;
  display: block;
  padding: 10px;
  position: relative;
}
.box-header.with-border {
  border-bottom: 1px solid #ffffff33;

}
.collapsed-box .box-header.with-border {
  border-bottom: none;
  width:10rem;
}
.box-header>.fa, .box-header>.glyphicon, .box-header>.ion, .box-header .box-title {
  display: inline-block;
  font-size: 18px;
  margin: 0;
  line-height: 1;
}
.box-header>.fa, .box-header>.glyphicon, .box-header>.ion {
  margin-right: 5px;
}
.box-header>.box-tools {
  position: absolute;
  right: 10px;
  top: 5px;
}
.box-header>.box-tools [data-toggle="tooltip"] {
  position: relative;
}
.box-header>.box-tools.pull-right .dropdown-menu {
  right: 0;
  left: auto;
}
.btn-box-tool {
  padding: 5px;
  font-size: 12px;
  background: transparent;
  color: #97a0b3;
  height:1.5rem;
}
.open .btn-box-tool, .btn-box-tool:hover {
  color: #606c84;
}
.btn-box-tool.btn:active {
  box-shadow: none;
}
.box-body {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
  padding: 10px;
}
.no-header .box-body {
  border-top-right-radius: 3px;
  border-top-left-radius: 3px;
}
.box-body>.table {
  margin-bottom: 0;
}
.box-body .fc {
  margin-top: 5px;
}
.box-body .full-width-chart {
  margin: -19px;
}
.box-body.no-padding .full-width-chart {
  margin: -9px;
}
.box-body .box-pane {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 3px;
}
.box-body .box-pane-right {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 0;
}
.box-footer {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
  border-top: 1px solid #f40.5rem 1.5rem 1.5rem 1.5remf4f4;
  background-color: #fff;
  color: black;
  border-top-width: 0px;
}

.box-footer.service {
  display: flex;
  background-color: transparent;
  align-items: center;
}
.direct-chat .box-body {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
  position: relative;
  overflow-x: hidden;
  padding: 0;
}
.direct-chat.chat-pane-open .direct-chat-contacts {
  -webkit-transform: translate(0,  0);
  -ms-transform: translate(0,  0);
  -o-transform: translate(0,  0);
  transform: translate(0,  0);
}
.direct-chat-messages,
.direct-notes-messages {
  -webkit-transform: translate(0,  0);
  -ms-transform: translate(0,  0);
  -o-transform: translate(0,  0);
  transform: translate(0,  0);
  padding: 10px;
  height: 46rem;
  overflow: auto;
}
.direct-chat-msg, .direct-chat-text {
  display: block;
}
.direct-chat-msg {
  margin-bottom: 10px;
  word-break: break-word;
}
.direct-chat-msg:before, .direct-chat-msg:after {
  content: " ";
  display: table;
}
.direct-chat-msg:after {
  clear: both;
}
.direct-chat-messages, 
.direct-chat-contacts, 
.direct-notes-messages {
  -webkit-transition: -webkit-transform .5s ease-in-out;
  -moz-transition: -moz-transform .5s ease-in-out;
  -o-transition: -o-transform .5s ease-in-out;
  transition: transform .5s ease-in-out;
}
.direct-chat-text {
  border-radius: 5px;
  position: relative;
  padding: 5px 10px;
  background: #d2d6de;
  border: 1px solid #d2d6de;
  margin: 5px 0 0 50px;
  color: #444;
}
.direct-chat-text:after, .direct-chat-text:before {
  position: absolute;
  right: 100%;
  top: 15px;
  border: solid transparent;
  border-right-color: #d2d6de;
  content: ' ';
  height: 0;
  width: 0;
  pointer-events: none;
}
.direct-chat-text:after {
  border-width: 5px;
  margin-top: -5px;
}
.direct-chat-text:before {
  border-width: 6px;
  margin-top: -6px;
}
.rright .direct-chat-text {
  margin-right: 50px;
  margin-left: 0;
}
.rright .direct-chat-text:after, .rright .direct-chat-text:before {
  right: auto;
  left: 100%;
  border-right-color: transparent;
  border-left-color: #d2d6de;
  text-align: end;

}
.direct-chat-img {
  border-radius: 50%;
  float: left;
  width: 40px;
  height: 40px;
}
.rright .direct-chat-img {
  float: right;
}
.direct-chat-info {
  display: block;
  margin-bottom: 2px;
  font-size: 12px;
}
.direct-chat-name {
  font-weight: 600;
}
.direct-chat-timestamp {
  color: #999;
}
.direct-chat-contacts-open .direct-chat-contacts {
  -webkit-transform: translate(0,  0);
  -ms-transform: translate(0,  0);
  -o-transform: translate(0,  0);
  transform: translate(0,  0);
}
.direct-chat-contacts {
  -webkit-transform: translate(101%,  0);
  -ms-transform: translate(101%,  0);
  -o-transform: translate(101%,  0);
  transform: translate(101%,  0);
  position: absolute;
  top: 0;
  bottom: 0;
  height: 250px;
  width: 46rem;
  background: #222d32;
  color: #fff;
  overflow: auto;
}
.contacts-list>li {
  border-bottom: 1px solid #ffffff33;
  padding: 10px;
  margin: 0;
}
.contacts-list>li:before, .contacts-list>li:after {
  content: " ";
  display: table;
}
.contacts-list>li:after {
  clear: both;
}
.contacts-list>li:last-of-type {
  border-bottom: none;
}
.contacts-list-img {
  border-radius: 50%;
  width: 40px;
  float: left;
}
.contacts-list-info {
  margin-left: 45px;
  color: #fff;
}
.contacts-list-name, .contacts-list-status {
  display: block;
}
.contacts-list-name {
  font-weight: 400;
  font-size: 0.8rem;
}
.contacts-list-status {
  font-size: 12px;
}
.contacts-list-date {
  color: #aaa;
  font-weight: normal;
}
.contacts-list-msg {
  color: #999;
}
.direct-chat-danger .rright>.direct-chat-text {
  background: #dd4b39;
  border-color: #dd4b39;
  color: #fff;
}
.direct-chat-danger .rright>.direct-chat-text:after, .direct-chat-danger .rright>.direct-chat-text:before {
  border-left-color: #dd4b39;
}
.direct-chat-primary .rright>.direct-chat-text {
  background: #3c8dbc;
  border-color: #3c8dbc;
  color: #fff;
}
.direct-chat-primary .rright>.direct-chat-text:after, .direct-chat-primary .rright>.direct-chat-text:before {
  border-left-color: #3c8dbc;
}
.direct-chat-warning .rright>.direct-chat-text {
  background: #f39c12;
  border-color: #f39c12;
  color: #fff;
}
.direct-chat-warning .rright>.direct-chat-text:after, .direct-chat-warning .rright>.direct-chat-text:before {
  border-left-color: #f39c12;
}
.direct-chat-info .rright>.direct-chat-text {
  background: #00c0ef;
  border-color: #00c0ef;
  color: #fff;
}
.direct-chat-info .rright>.direct-chat-text:after, .direct-chat-info .rright>.direct-chat-text:before {
  border-left-color: #00c0ef;
}
.direct-chat-success .rright>.direct-chat-text {
  background: #00a65a;
  border-color: #00a65a;
  color: #fff;
}
.direct-chat-success .rright>.direct-chat-text:after, .direct-chat-success .rright>.direct-chat-text:before {
  border-left-color: #00a65a;
}



#chatBox.collapsed-box{
  top:54rem;
  width:25%;
}

span.direct-chat-name.pull-right {
  color:green;
}

span.direct-chat-name.pull-left {
  color:orangered;
}

.rright {
  text-align: end;
}

.mleft{
  margin-left: 50% !important;
}

.contacts-list >li {
  list-style-type: none;
  /* Убираем маркеры */
}

.contacts-list {
  margin-left: 0;
  padding-left: 0;
  height: 46rem;
  overflow-y: auto;
}

.contact_item.active{
  border: solid 1px olivedrab !important;
}
/* chatBox Finish */

.counter_inc{
    font-size: 0.8rem;
    width: 1.5rem;
    height: 1.5rem;
    background-color: rgb(255, 69, 0);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    justify-self: end;
    box-shadow: inset 0 2px 3px rgb(114 116 119 / 60%), 0 8px 20px rgb(0 0 0 / 90%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgb(255 69 0)), color-stop(100%, rgb(154 32 0)));
}

.box-header > .switch-button.switch-button-yesno label:before {
  content: "OFFLINE";
 }
 .box-header > .switch-button.switch-button-yesno input[type="checkbox"]:checked + span label:before {
  content: "ONLINE";
 }
 
 .box-header > .switch-button.switch-button-lg {
     width: 6rem;
 }

 .gallery {
   border-radius: 0.5rem;
   border: 2px solid white;
 }


 /* TERMINAL */

#termbody {
  background-color: black;
  background-image: radial-gradient(rgb(118 118 118), black 200%);
  /*height: 100vh;*/
  height: 900px;
  margin: 1rem;
  overflow: hidden;
  padding: 2rem;
  color: white;
  font: 1rem Inconsolata, monospace;
  text-shadow: 0 0 5px #85858575;
  overflow-y: auto;
  overflow-x: hidden;
  word-break: break-word;
}
#termbody::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
 /* width: 100vw;*/

  background: repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.15) 1px, transparent 1px, transparent 2px);
  pointer-events: none;
}

::selection {
  background: #0080ff;
  text-shadow: none;
}

pre {
  margin: 0;
}

#termbody.fullview{
position: absolute;
z-index: 3;
top: 0;
height: 100%;
width: 100%;
margin:0;
}

/* TERMINAL END */
.direct-notes-messages .direct-chat-text {
  color: white;
  background-color: black;
}

/* btn down start */
a.button31 {
  position: relative;
  z-index: 1;
  display: inline-block;
  width: 3em;
  height: 3em;
  border-radius: 100%;
  outline: none;
  background: #ddd;
  box-shadow: 0 1px rgba(0,0,0,.1) inset, 0 1px #fff;
}
a.button31:after, a.button31:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 7.5%;
  left: -15%;
  right: 0;
  bottom: 0;
  width: 30%;
  height: 10%;
  margin: auto;
  background: #999;
  box-shadow: 0 1px rgba(0,0,0,.1) inset, 0 1px #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
a.button31:before {
  left: 15%;
  -webkit-transform: rotate(315deg);
  transform: rotate(315deg);
}
a.button31:hover, a.button31:focus {
  background: #5cb85c;
  box-shadow: none;
}
a.button31:hover:after, a.button31:hover:before {
  background: #fff;
  box-shadow: none;
}
a.button31:focus {
  background-image:
  linear-gradient(120deg, transparent 45%, #5cb85c 45%, #5cb85c 55%, transparent 55%),
  radial-gradient(transparent 20%, #fff 20%, #fff 30%, transparent 30%);
  -webkit-animation: rotate31 1s linear infinite forwards;
  animation: rotate31 1s linear infinite forwards;
}
a.button31:focus:after, a.button31:focus:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: calc(-30% - 4px/2);
  left: 4px;
  width: 0;
  height: 0;
  border-top: 4px solid transparent;
  border-left: 8px solid #fff;
  border-bottom: 4px solid transparent;
  background: transparent;
  box-shadow: none;
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}
a.button31:focus:before {
  top: calc(30% + 4px/2);
  left: -4px;
  border-left: none;
  border-right: 8px solid #fff;
}
@-webkit-keyframes rotate31 {
  100% {-webkit-transform: rotate(360deg);}
}
@keyframes rotate31 {
  100% {transform: rotate(360deg);}
}
/* bnt down finish */

input[type=radio]
{
  /* Double-sized Checkboxes */
  -ms-transform: scale(1.5); /* IE */
  -moz-transform: scale(1.5); /* FF */
  -webkit-transform: scale(1.5); /* Safari and Chrome */
  -o-transform: scale(1.5); /* Opera */
  padding: 10px;
  margin-top: 2px;

}

.contacts-list, .direct-chat-messages, .direct-notes-messages {
-ms-overflow-style: none;    
scrollbar-width: none;   
}

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

::-webkit-scrollbar {
display: inline;
width: 12px;
}

::-webkit-scrollbar {
width: 12px;
display: inline;

}

::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
border-radius: 12px;
}

::-webkit-scrollbar-thumb {
border-radius: 12px;
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}

::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

::-webkit-scrollbar-track {
  background-color: #e4e4e4;
  border-radius: 100px;
}

::-webkit-scrollbar-thumb {
  background-color: #abb6c2;
  border-radius: 100px;
}

.contacts-list::-webkit-scrollbar {
  display: none;
}

.btn-send_file,
.btn-edit_file,
.btn-delete-note,
.btn-delete_file {
  display: none;
}

.direct-note-msg:hover .btn-send_file,
.direct-note-msg:hover .btn-edit_file,
.direct-note-msg:hover .btn-delete-note,
.direct-note-msg:hover .btn-delete_file  {
  display: block;
}

 #fakeInput,  
 #fakeInput1 {
  box-sizing: border-box;
  background-image: url(./../img/searchicon.png);
  background-position: 14px 12px;
  background-color: white;
  background-repeat: no-repeat;
  font-size: 16px;
  padding: 14px 20px 12px 45px;
  border: none;
  border-bottom: 1px solid #ddd;
  position: sticky;
  top: 0;
  width: 13rem;
  color: gray;
}

.btn_get {
  color: white;
  border: .25rem solid white;
  border-radius: 1rem;
  padding: 0 0 1rem 1rem;
  background: black;
  cursor: pointer;
}

.close {
  cursor: pointer;
}

.tag {
  position: relative;
  margin: 2px 6px 2px 0;
  padding: 1px 20px 1px 8px;
  font-size: inherit;
  font-weight: 400;
  text-align: center;
  color: #fff;
  background-color: #317CAF;
  border-radius: 3px;
  transition: background-color 0.3s ease;
  cursor: default;
}

.tag.red, 
.tag.active {
  background-color: #d9534f;
}

.tag.green {
  background-color: #5cb85c;
}

.tag_input {
  background-color: white;
  width: 100%;
  height: fit-content;
}

.mpart_delete,
.tag_remove, 
.tag_delete {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 20px;
  height: 100%;
  padding: 0 5px;
  font-size: 16px;
  font-weight: 400;
  transition: opacity 0.3s ease;
  opacity: 0.5;
  cursor: pointer;
  border: 0;
  background-color: transparent;
  color: #fff;
  line-height: 1;
  height: fit-content;
  margin-bottom: 4px;
}

.tag_input .tag_remove  {
  display: block;
}

.tag_input .tag  {
  display: block;
  height: fit-content;
}

.tag_tank2 .tag_remove  {
  display: none;
}

.tag_tank .tag  {
  padding: 1px 8px 1px 8px;
}

.tag_name,
.mpart_name {
  margin-right: 3px;
}

#form_add_task {
  height: 0%;
  padding: 0;
  overflow: hidden;
  border: 0px solid white;
  -webkit-transition: height .5s, padding .5s, border .5s;
  transition: height .5s;
}

#form_add_task.active{
  height:300px;
  padding: 1.5rem;
  border: 1px solid white;
}

.problem_input:focus {
  background-color:rgb(50 50 50 ) !important;
}


[data-problem] {
  cursor: pointer;
}


.solution .box-header > .switch-button.switch-button-yesno label:before {
  content: "ALL";
}

.solution .box-header > .switch-button.switch-button-yesno input[type="checkbox"]:checked + span label:before {
  content: "USED";
} 

.solution .box-header > .switch-button.switch-button-lg,
.task_filter  .switch-button.switch-button-lg {
  width: 5rem;
}

.task_filter  .switch-button.switch-button-yesno label:before {
  content: "ALL";
}

.task_filter  .switch-button.switch-button-yesno input[type="checkbox"]:checked + span label:before {
  content: "OPEN";
} 

.sol_comment {
  color:#00BCD4;
}

#sollist .form-check-inline {
  max-width: 20%;
  align-items: baseline;
  margin: 0 0 0.5rem 0;
}

#sollist {
  overflow: auto;
  height: 900px;

}

.back_white { background-color:white;
}    

.old_sol_edit {
  font-size: 1.2 rem;
  padding: 0.5rem;
}

[data-solution] {
  color:white;
}

#rateModalmodalBody [data-solution] {
  cursor:move;
}

.mpart {
  position: relative;
  margin: 2px 6px 2px 0;
  padding: 1px 20px 1px 8px;
  font-size: inherit;
  font-weight: 400;
  text-align: center;
  color: #fff;
  background-color: orangered;
  border-radius: 3px;
  transition: background-color 0.3s ease;
  cursor: default;
}

.mpart_name {
  margin-right: 3px;
}

.mpart.active{
  background-color: teal;
}

.direct-chat-text.deleted {
  text-decoration: line-through;
  text-decoration-color:black;
  text-decoration-thickness: 3px;
  background-color: gray !important;
}

.h-fit-content {
  height: fit-content !important;
}
/*-----------        ----------------     POPOVER STYLING             ------------              --*/
#sh .popover,
#diagnostic_mode .popover {
  border-radius: 3px;
  background: #343434cc;
  border-top: 3px solid #d2d6de;
  width: 100%;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  padding: 0.5rem 1.5rem 1.5rem 1.5rem;
  border-top-color: orangered;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

#sh .popover-body
#diagnostic_mode .popover-body {
color: white !important;
}

#sh .popover-body,
#diagnostic_mode .popover-header {
  padding: .5rem .75rem;
  margin-bottom: 0;
  font-size: 1rem;
  border-bottom: 1px solid rgba(242,242,242,.075);
  border-top-left-radius: calc(0 - 1px);
  border-top-right-radius: calc(0 - 1px);
  background: #343434cc;
  
}

#sh .bs-popover-auto[x-placement^=left]>.arrow::after, .bs-popover-left>.arrow::after,
#diagnostic_mode .bs-popover-auto[x-placement^=left]>.arrow::after, .bs-popover-left>.arrow::after {
  right: 1px;
  border-width: .5rem 0 .5rem .5rem;
  border-left-color: orangered;
}

#sh .bs-popover-auto[x-placement^=right]>.arrow::after, .bs-popover-right>.arrow::after,
#diagnostic_mode .bs-popover-auto[x-placement^=right]>.arrow::after, .bs-popover-right>.arrow::after {
  left: 1px;
  border-width: .5rem .5rem .5rem 0;
  border-right-color: orangered;
}

#sh .bs-popover-auto[x-placement^=bottom]>.arrow::after, .bs-popover-bottom>.arrow::after,
#diagnostic_mode .bs-popover-auto[x-placement^=bottom]>.arrow::after, .bs-popover-bottom>.arrow::after {
  top: -3px;
  border-width: 0 .5rem .5rem .5rem;
  border-bottom-color: orangered;
}

#sh .bs-popover-auto[x-placement^=top]>.arrow::after, .bs-popover-top>.arrow::after,
#diagnostic_mode .bs-popover-auto[x-placement^=top]>.arrow::after, .bs-popover-top>.arrow::after {
  bottom: 1px;
  border-width: .5rem .5rem 0;
  border-top-color: orangered;
}

#sh .bs-popover-auto[x-placement^=bottom]>.arrow, .bs-popover-bottom>.arrow ,
#diagnostic_mode .bs-popover-auto[x-placement^=bottom]>.arrow, .bs-popover-bottom>.arrow {
  top: calc(.5rem - .9rem);
}

div.popover-body > div > div.form-check{
  padding-left: 0 !important;
  padding-top: 1.25rem; 
}

/*-----------        ----------------                  ------------              --*/

  .counter_input {
    width: 45px;
    border: white solid 1px;
    border-radius: 3px;
    outline: none;
    padding: 0;
    margin: 0;
    background-color: transparent;
    font-size: 1rem;
    text-align: center;
    font-weight: 400;
    vertical-align: middle;
    color: white;
    margin: 7px;
  }

  .counter_button {
    color:white;
    font-size: 1rem;
    font-weight:800;
    width: 2.2rem;
    height:2.2rem;
    border-radius: 50%;
    border: none;
    margin: 2px;
    box-shadow: inset 0 2px 3px rgb(114 116 119 / 60%), 0 8px 20px rgb(0 0 0 / 90%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgb(157 157 157)), color-stop(100%, rgb(51 51 51)));
}

  .counter_button:focus {
    color:white;
  }

  #addressBook__userList .tag.edited{
    background-color: orangered;
  }

  .edit-row {
    background-color: red;
  }

  .counter_input.selected {
    background-color: green;
  } 

  .h-fit-content {
    height: fit-content !important;
  }

  .parts [data-toggle="collapse"]::before  {
    content:'–';
  }

  .parts .collapsed::before  {
      content:'+';
  }

  .collapse {
    margin-left: 2rem;
  }

.machineDataList {
  width: min-content;
}

input[type=radio][value=open] {
  accent-color: rgb(255, 0, 0);
}

input[type=radio][value=sendsol] {
  accent-color: rgb(255, 255, 0);
}

input[type=radio][value=locked] {
  accent-color: rgb(0, 255, 0);
}


.info_inc {
  font-size: 0.8rem;
  width: 1.5rem;
  height: 1.5rem;
  background-color: #2196F3;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  justify-self: end;
  box-shadow: inset 0 2px 3px rgb(114 116 119 / 60%), 0 8px 20px rgb(0 0 0 / 51%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgb(75 171 240)), color-stop(100%, rgb(0 32 154 / 49%)));
}

td[contenteditable="true"] {
  background: rgb(34, 34, 34);
}

.text-orangered {
  color:orangered;
}