html:not(.loading) [data-layout="top-navigation-2"][data-navbar="dark"] {
  color: #212121;
  background: #f5f5f5;
  background-image: url(../../assets/images/dark-small.jpg);
  background-repeat: repeat-x;
  background-position: top;
  background-attachment: fixed;
}

html:not(.loading) [data-layout="top-navigation-2"][data-navbar="primary"] {
  color: #212121;
  background: #f5f5f5;
  background-image: url(../../assets/images/primary-small.jpg);
  background-repeat: repeat-x;
  background-position: top;
  background-attachment: fixed;
}

html:not(.loading) [data-layout="top-navigation-2"][data-navbar="secondary"] {
  color: #212121;
  background: #f5f5f5;
  background-image: url(../../assets/images/secondary-small.jpg);
  background-repeat: repeat-x;
  background-position: top;
  background-attachment: fixed;
}

html:not(.loading) [data-layout="top-navigation-2"][data-navbar="success"] {
  color: #212121;
  background: #f5f5f5;
  background-image: url(../../assets/images/success-small.jpg);
  background-repeat: repeat-x;
  background-position: top;
  background-attachment: fixed;
}

html:not(.loading) [data-layout="top-navigation-2"][data-navbar="info"] {
  color: #212121;
  background: #f5f5f5;
  background-image: url(../../assets/images/info-small.jpg);
  background-repeat: repeat-x;
  background-position: top;
  background-attachment: fixed;
}

html:not(.loading) [data-layout="top-navigation-2"][data-navbar="warning"] {
  color: #212121;
  background: #f5f5f5;
  background-image: url(../../assets/images/warning-small.jpg);
  background-repeat: repeat-x;
  background-position: top;
  background-attachment: fixed;
}

html:not(.loading) [data-layout="top-navigation-2"][data-navbar="danger"] {
  color: #212121;
  background: #f5f5f5;
  background-image: url(../../assets/images/danger.jpg);
  background-repeat: repeat-x;
  background-position: top;
  background-attachment: fixed;
}

html:not(.loading) [data-layout="top-navigation-2"][data-navbar="white"] {
  color: #212121;
  background: #fff;
}

html:not(.loading) [data-layout="top-navigation-2"][data-navbar="light"] {
  color: #212121;
  background: #f5f5f5;
  background-image: url(../../assets/images/light-small.jpg);
  background-repeat: repeat-x;
  background-position: top;
  background-attachment: fixed;
}

.loading [data-layout="top-navigation-2"] .navbar-3,
.loading [data-layout="top-navigation-2"] .top-navigation-1,
.loading [data-layout="top-navigation-2"] > .container-fluid {
  visibility: hidden;
}

[data-layout="top-navigation-2"] ::-webkit-scrollbar {
  display: none;
  width: 0 !important;
}

[data-layout="top-navigation-2"] .navbar-3 {
  z-index: 1031;
  padding-left: 60px;
  padding-right: 60px;
  width: 100%;
  -webkit-transition: width 0.35s ease;
  transition: width 0.35s ease;
}

[data-layout="top-navigation-2"] .navbar-3 .toggle-layout i {
  -webkit-transition: -webkit-transform 0.35s ease;
  transition: -webkit-transform 0.35s ease;
  transition: transform 0.35s ease;
  transition: transform 0.35s ease, -webkit-transform 0.35s ease;
  -webkit-transform: rotate(540deg);
          transform: rotate(540deg);
}

[data-layout="top-navigation-2"] .top-navigation-1 {
  z-index: 1030;
  padding-left: 60px;
  padding-right: 60px;
  width: 100%;
  -webkit-transition: width 0.35s ease;
  transition: width 0.35s ease;
}

[data-layout="top-navigation-2"] .top-navigation-1 .toggle-layout i {
  -webkit-transition: -webkit-transform 0.35s ease;
  transition: -webkit-transform 0.35s ease;
  transition: transform 0.35s ease;
  transition: transform 0.35s ease, -webkit-transform 0.35s ease;
  -webkit-transform: rotate(540deg);
          transform: rotate(540deg);
}

[data-layout="top-navigation-2"] .main {
  padding-left: 20px;
  padding-right: 20px;
  -ms-overflow-style: none;
}

[data-layout="top-navigation-2"] .main .page-on-top {
  margin-left: 20px;
  margin-right: 20px;
  background: #fff;
  box-shadow: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12);
  padding: 20px;
}

[data-layout="top-navigation-2"] .left-sidebar-1 {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  height: 100%;
  max-height: 100%;
  width: 250px;
  overflow: hidden;
  z-index: 1033;
  -webkit-transition: -webkit-transform 0.25s ease;
  transition: -webkit-transform 0.25s ease;
  transition: transform 0.25s ease;
  transition: transform 0.25s ease, -webkit-transform 0.25s ease;
  -webkit-transform: translate3d(-250px, 0, 0);
          transform: translate3d(-250px, 0, 0);
}

[data-layout="top-navigation-2"] .left-sidebar-1 .wrapper {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  height: 100%;
  max-height: 100%;
  overflow: auto;
  width: 270px;
}

[data-layout="top-navigation-2"] .left-sidebar-1 .wrapper .content {
  width: 250px;
}

[data-layout="top-navigation-2"] .left-sidebar-1 .wrapper .content .logo span {
  opacity: 1;
}

[data-layout="top-navigation-2"].layout-collapsed .left-sidebar-1 {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}

[data-layout="top-navigation-2"] .right-sidebar-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
  z-index: 1032;
  opacity: 0;
  background: #000;
  -webkit-transition: opacity 0.15s ease;
  transition: opacity 0.15s ease;
}

[data-layout="top-navigation-2"] .right-sidebar-backdrop.fade {
  display: block;
}

[data-layout="top-navigation-2"] .right-sidebar-backdrop.in {
  opacity: 0.25;
}

[data-layout="top-navigation-2"] .left-sidebar-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
  z-index: 1032;
  opacity: 0;
  background: #000;
  -webkit-transition: opacity 0.15s ease;
  transition: opacity 0.15s ease;
}

[data-layout="top-navigation-2"] .left-sidebar-backdrop.fade {
  display: block;
}

[data-layout="top-navigation-2"] .left-sidebar-backdrop.in {
  opacity: 0.25;
}

@media (max-width: 543px) {
  [data-layout="top-navigation-2"] .navbar-3 {
    margin-left: 0;
    padding-left: 10px;
    padding-right: 10px;
  }
  [data-layout="top-navigation-2"] .main {
    padding-left: 0;
    padding-right: 0;
  }
  [data-layout="top-navigation-2"] .main .page-on-top {
    margin-left: 0;
    margin-right: 0;
    padding: 20px;
  }
}

@media (min-width: 544px) and (max-width: 767px) {
  [data-layout="top-navigation-2"] .navbar-3 {
    margin-left: 0;
    padding-left: 20px;
    padding-right: 20px;
  }
  [data-layout="top-navigation-2"] .main {
    padding-left: 0;
    padding-right: 0;
  }
  [data-layout="top-navigation-2"] .main .page-on-top {
    margin-left: 0;
    margin-right: 0;
    padding: 20px;
  }
}
.connectedSortable {
      /*overflow: auto;
  position: relative;*/
        color: black !important;
     border: none!important;
    /*min-height: 20px;
    list-style-type: none!important;
    margin: 0;
    padding: 5px 0 0 0!important;
    float: left;
    margin-right: 10px;
    width: 300px;*/
}
      .connectedSortable {
          width: 100% !important;
          background-color: #F5F5F5;
      }
.connectedSortable li {
    color: #696969 !important;
    margin: 0 5px 5px 5px;
    padding: 5px;
    font-size: 15px;

  }
#sortable1,#sortable2 {
  overflow: auto;
}
.ui-state-highlight {
      background-color: rgba(255,255,255,0.1)!important;
    border: none!important;
    cursor: move;
  }
.header-drag {
          background-color: #DA0813;
      color: white;
}
.note {
 margin-bottom: 0 !important;
    font-weight: 500;
}