/* Add here all your CSS customizations */

input[type="number"].no-spin::-webkit-outer-spin-button,
input[type="number"].no-spin::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

.text-inherit,
.text-inherit:hover {
  color: inherit;
}

.sidebar-left-none .content-body {
  margin-left: 0 !important;
}
@media only screen and (min-width: 1200px) {
  .sidebar-right-opened.sidebar-left-none .content-body {
    margin-left: 400px !important;
  }
}

@media only screen and (max-width: 1199px) {
  .sidebar-right-opened.sidebar-left-none .content-body {
    margin-left: 300px !important;
  }

  .nav > li > a { 
    padding: 7px;
  }
}

.panel-heading {
  padding: 10px;
}

.page-header,
.page-header h2 {
  height: 40px;
  line-height: 40px;
}
.page-header div {
  line-height: initial;
}
.page-header .breadcrumbs {
  line-height: 40px;
  margin-right: 1.0rem;
}

.sidebar-right .sidebar-right-wrapper,
.tab-content,
.content-body {
  padding: 10px;
}

.ng-cloak,
[ng-cloak] {
  display: none;
}

.completed-1-4 {
  width: 25% !important;
}

.completed-2-4 {
  width: 50% !important;
}

.completed-3-4 {
  width: 75% !important;
}

.completed-4-4 {
  width: 100% !important;
}

.completed-1-3 {
  width: 33% !important;
}

.completed-2-3 {
  width: 66% !important;
}

.completed-3-3 {
  width: 100% !important;
}