.default-index-view .header {
  transition: width 0.5s ease;
  position: fixed;
  width: calc(100% - 56px);
  height: 40px;
  line-height: 40px;
  font-size: 1 rem;
  background-color: #2F4050;
  color: #A7B1C2;
  z-index: 2; }
  .default-index-view .header .btn {
    display: block;
    cursor: pointer;
    border: none;
    border-radius: 0;
    height: 40px;
    line-height: 40px;
    padding: 0 12px;
    margin: 0;
    background-color: inherit;
    color: inherit;
    vertical-align: top; }
    .default-index-view .header .btn:visited {
      color: inherit; }
    .default-index-view .header .btn:hover {
      color: white;
      background-color: #3AB2C4; }
  .default-index-view .header input {
    height: 40px;
    background-color: inherit;
    margin: 0;
    color: #A7B1C2;
    border: none;
    text-align: center; }
    .default-index-view .header input.index-search {
      border: 1px solid #86B1B4;
      border-radius: 50px;
      height: 28px;
      text-align: left;
      padding-left: 20px;
      padding-right: 20px;
      transition: all 0.5s; }
      .default-index-view .header input.index-search:focus {
        background-color: #F3F3F3;
        color: black; }

.default-index-view .body {
  transition: width 0.5s ease;
  position: absolute;
  width: calc(100% - 56px);
  margin-top: 40px;
  z-index: 1;
  height: calc(100% - 40px);
  overflow: auto; }
  .default-index-view .body .row {
    padding: 8px 15px;
    margin: -1px;
    border-top: 1px solid #B3B3B3;
    border-bottom: 1px solid #B3B3B3; }
    .default-index-view .body .row.item {
      cursor: pointer; }
      .default-index-view .body .row.item:hover {
        background-color: #E3E3E3; }
      .default-index-view .body .row.item.selected {
        background-color: #D3D3D3; }

.default-index-view .side-menu {
  position: fixed;
  height: 100%;
  top: 0;
  width: 355px;
  background-color: #2F4050;
  right: -355px;
  transition: right 0.5s ease;
  padding: 0 15px;
  color: #A7B1C2;
  z-index: 3;
  line-height: 40px; }
  .default-index-view .side-menu table {
    line-height: 1; }
    .default-index-view .side-menu table td {
      padding: 5px 10px; }
  .default-index-view .side-menu.expand {
    right: 0; }
    .default-index-view .side-menu.expand ~ .body, .default-index-view .side-menu.expand ~ .header {
      width: calc(100% - 411px); }
  .default-index-view .side-menu input,
  .default-index-view .side-menu select {
    background-color: #2F4050;
    border: none;
    border-bottom: 1px solid white;
    color: white;
    width: 100%; }
  .default-index-view .side-menu .side-menu-cancel-btn {
    background-color: #2F4050;
    color: #a7b1c2; }
    .default-index-view .side-menu .side-menu-cancel-btn:hover {
      color: white; }

@media (max-width: 575px) {
  .default-index-view .side-menu {
    width: calc(100% - 56px);
    right: calc(56px - 100%);
    transition: right 0.5s ease; }
    .default-index-view .side-menu.expand ~ .body, .default-index-view .side-menu.expand ~ .header {
      width: 100%; } }

.default-index-view i.btn, .default-index-view div.btn-group, .default-index-view ul.confirm {
  border-radius: 5px;
  border: 1px solid #A7B1C2; }

.default-index-view div.btn-group {
  position: relative; }
  .default-index-view div.btn-group i.btn {
    border: none; }
    .default-index-view div.btn-group i.btn:not(:first-child) {
      border-left: 1px solid #A7B1C2; }

.default-index-view i.btn ~ ul.confirm {
  position: absolute;
  top: 35px;
  white-space: nowrap;
  /*padding: 6px 12px;*/
  display: none; }

.default-index-view i.btn:hover {
  color: white !important;
  background-color: #3AB2C4; }

.default-index-view ul.confirm {
  line-height: 1;
  background-color: #2F4050;
  margin: 0;
  list-style-type: none;
  padding: 0;
  z-index: 4; }
  .default-index-view ul.confirm li {
    padding: 6px 12px; }
  .default-index-view ul.confirm li:first-of-type {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px; }
  .default-index-view ul.confirm li:last-of-type {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px; }
  .default-index-view ul.confirm li:hover {
    color: white !important;
    background-color: #3AB2C4;
    cursor: pointer; }

.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
  background-color: #3AB2C4; }

.show {
  display: block !important; }

/* The switch - the box around the slider */
.switch {
  position: relative;
  display: inline-block;
  width: 52px;
  height: 26px; }

/* Hide default HTML checkbox */
.switch input {
  opacity: 0;
  width: 0;
  height: 0; }

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #DC3545;
  -webkit-transition: .4s;
  transition: .4s; }

.slider:before {
  position: absolute;
  content: "";
  height: 18px;
  width: 18px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s; }

input:checked + .slider {
  background-color: #28a745; }

input:focus + .slider {
  box-shadow: 0 0 1px #28a745; }

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px); }

/* Rounded sliders */
.slider.round {
  border-radius: 26px; }

.slider.round:before {
  border-radius: 50%; }

html, body {
  background-color: #F3F3F3 !important;
  color: #676A6C !important;
  margin: 0 !important;
  padding: 0 !important;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  overflow: auto; }

.btn.btn-primary {
  background-color: #61C2D0;
  border-color: #61C2D0; }
  .btn.btn-primary:hover {
    background-color: #3ab2c4;
    border-color: #3ab2c4; }

.btn.btn-rounded {
  border-radius: 50% !important; }

#main-content {
  position: relative;
  min-height: 100%; }

/*#content{
	position:fixed;
	min-height: 100%;
	min-width: 100%;
	margin-left: 56px;
}*/
#content {
  padding-left: 56px; }

th:hover {
  cursor: pointer; }

.noselect {
  -webkit-touch-callout: none;
  /* iOS Safari */
  -webkit-user-select: none;
  /* Safari*/
  -khtml-user-select: none;
  /* Konqueror */
  -moz-user-select: none;
  /* Firefox */
  -ms-user-select: none;
  /* Internet Explorer/Edge */
  user-select: none; }

.table-body-item {
  cursor: pointer; }

th {
  white-space: nowrap; }

td {
  white-space: nowrap; }

.table.table-hover tbody {
  cursor: pointer; }

.table i {
  cursor: pointer;
  margin: 5px;
  float: right; }

.btn i {
  width: 16px;
  height: 16px; }

#login {
  width: 310px;
  text-align: center;
  background-color: #F3F3F3;
  border: none;
  margin-top: 1rem; }
  #login p {
    padding: 4px; }
  #login .form-group {
    margin-bottom: 10px; }
  #login .dropdown {
    width: 100%; }

#login-error {
  padding: 3px; }

#navigation {
  background-color: #2F4050;
  transition: width 0.5s;
  z-index: 1000001;
  margin-bottom: 1rem;
  overflow: hidden;
  overflow-y: auto;
  width: 56px;
  position: fixed;
  height: 100%;
  -ms-overflow-style: none;
  overflow: -moz-scrollbars-none; }
  #navigation.expand {
    width: 300px; }
  #navigation li {
    list-style-type: none;
    margin-left: 0;
    padding-left: 0;
    width: 300px; }
    #navigation li a {
      color: #A7B1C2; }
      #navigation li a:hover {
        color: white;
        background-color: #3AB2C4; }
    #navigation li span {
      color: #A7B1C2; }
      #navigation li span:hover {
        color: white; }
    #navigation li i {
      text-align: center;
      width: 25px;
      margin-right: 10px; }
    #navigation li ul {
      margin-left: 0;
      padding-left: 0; }
      #navigation li ul li {
        margin-left: 10px;
        display: none; }
        #navigation li ul li:first-child {
          display: block;
          margin-left: 0; }
      #navigation li ul:hover li {
        display: block; }
  #navigation #nav-promo-ds-icon {
    width: 25px;
    margin-right: 10px; }
  #navigation::-webkit-scrollbar {
    display: none; }

.ds-index-view {
  padding: 1rem; }

#ds-desk {
  margin-left: 56px;
  z-index: 0; }

#menu-btn {
  position: fixed;
  bottom: 5px;
  margin-left: 4px;
  background-color: #2F4050;
  z-index: 1001; }

.img-circle {
  border-radius: 50%;
  margin-top: 5px;
  margin-left: 8px;
  width: 40px;
  border: 3px solid #F3F3F3; }

.tt-menu {
  width: auto;
  margin: 12px 0;
  background-color: #fff;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); }

.tt-suggestion {
  padding: 3px 20px;
  line-height: 24px;
  text-align: left; }

.tag-text[contenteditable=true]:before {
  content: "\feff "; }

.tag-text[contentEditable=true]:empty:before {
  content: attr(data-tag);
  color: grey;
  font-style: italic; }

.tag-text[contenteditable]:focus {
  outline: 0px solid transparent; }

.badge-input {
  text-align: left;
  display: inline-block;
  min-width: 27px;
  transition: min-width ease 0.5s; }
  .badge-input[contenteditable=true]:before {
    content: "\feff "; }
  .badge-input[contentEditable=true]:not(.tt-hint):empty:not(:focus):before {
    content: attr(data-ph);
    color: grey;
    font-style: italic; }
  .badge-input[contenteditable]:focus {
    outline: 0px solid transparent;
    min-width: 50px;
    transition: min-width ease 0.5s; }

input.duration-input::placeholder {
  color: black; }