#app-container {
  &.left-sidebar-collapsed {
    main {
      margin-left: $sidebar-collapsed-width + $main-margin;
      @include media-breakpoint-down(xl) {
        margin-left: $sidebar-collapsed-width + $main-margin-lg;
      }
      @include media-breakpoint-down(lg) {
        margin-left: $sidebar-collapsed-width + $main-margin-md;
      }
      @include media-breakpoint-down(sm) {
        margin-left: $sidebar-collapsed-width-xs + $main-margin-xs;
      }
    }
  }
  main {
    margin-left: $sidebar-width + $main-margin;
    @include media-breakpoint-down(xl) {
      margin-left: $sidebar-width + $main-margin-lg;
    }
    @include media-breakpoint-down(lg) {
     margin-left: $sidebar-width + $main-margin-md;
    }
    @include media-breakpoint-down(sm) {
      margin-left: $sidebar-collapsed-width-xs + $main-margin-xs;
    }
  }
}

main {
  position: relative;
  //margin-left: $sub-menu-width + $main-menu-width + $main-margin;
  margin-top: $navbar-height + $main-margin - 15;
  margin-right: $main-margin;
  margin-bottom: $main-margin - 20;
  transition: margin-left $animation-time-long;

  .container-fluid {
    padding-left: 0;
    padding-right: 0;
  }

  @include media-breakpoint-down(xl) {
    //margin-left: $sub-menu-width-lg + $main-menu-width-lg + $main-margin-lg;
    margin-right: $main-margin-lg;
    margin-top: $main-margin-lg + $navbar-height-lg -10;
    margin-bottom: 30px;
  }

  @include media-breakpoint-down(lg) {
    //margin-left: $sub-menu-width-md + $main-menu-width-md + $main-margin-md;
    margin-right: $main-margin-md;
    margin-top: $main-margin-md + $navbar-height-md -10;
    margin-bottom: 20px;
  }

  @include media-breakpoint-down(sm) {
    //margin-left: $main-margin-xs !important;
    margin-right: $main-margin-xs !important;
    margin-top: $main-margin-xs + $navbar-height-xs !important;
    margin-bottom: 0;
  }

  @include media-breakpoint-down(xs) {
    margin-bottom: 0;
  }
}