#tab_list .tab {
  margin-bottom: 20px;
}
#tab_list .tab .tab-content {
  border-radius: 6px;
}
#tab_list .tab .tab-content .tab-header {
  height: 50px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 20px;
  cursor: pointer;
  border: 1px solid #DDd;
  background-color: #FFF;
  border-radius: 5px;
}
#tab_list .tab .tab-content .tab-header .tab-title {
  font-size: 16px;
  margin: 0;
}
#tab_list .tab .tab-content .tab-header .tab-control {
  display: flex;
  align-items: center;
}
#tab_list .tab .tab-content .tab-header .tab-icon.flip-icon i {
  transform: rotate(180deg);
}
#tab_list .tab .tab-body {
  padding: 30px 20px;
  display: none;
}
#tab_list .tab.open-tab .tab-content .tab-body {
  display: block;
}

.empty-containers {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 20px;
  padding: 100px 0;
  border-radius: 5px;
  background-color: #FFF;
}
.empty-containers .add {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: pointer;
  display: inline-block;
  transition: color 0.2s ease-in-out;
  color: #666;
}
.empty-containers .add i {
  color: inherit;
}
.empty-containers .add:hover {
  color: #000;
}

.no-sections {
  padding: 50px;
  background-color: #FFF;
  border-radius: 3px;
  color: #666;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
}

.wrapper_section_list {
  min-height: 100px;
}

.section-sortable-placeholder {
  background-color: #CCC;
  min-height: 100px;
  margin: 15px 0;
  border-radius: 5px;
}

.section-component {
  border: 1px solid #BBB;
  background-color: #EEE;
  margin-bottom: 30px;
  border-radius: 5px;
  transition: background-color 1s ease-in-out, transform 0.2s cubic-bezier(0.89, 1.41, 0.1, 1.09);
}
.section-component .section-component-header {
  height: 50px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px;
  background-color: #d1d1d1;
  border-radius: 3px;
  cursor: move;
  transition: background-color 1s ease-in-out;
}
.section-component .section-component-header .section-component-title .title {
  cursor: pointer;
  margin: 0;
  display: inline-block;
  margin-right: 10px;
}
.section-component .section-component-header .section-component-control-view {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 7px;
  border-radius: 3px;
  min-width: 100px;
}
.section-component .section-component-header .section-component-control-view .btn-menu, .section-component .section-component-header .section-component-control-view .btn-moving, .section-component .section-component-header .section-component-control-view .section-component-toggle {
  cursor: pointer;
}
.section-component .section-component-header .section-component-control-view .btn-menu i, .section-component .section-component-header .section-component-control-view .btn-moving i, .section-component .section-component-header .section-component-control-view .section-component-toggle i {
  transition: all 0.2s ease-in-out;
}
.section-component .section-component-header .section-component-control-view .btn-menu:hover i, .section-component .section-component-header .section-component-control-view .btn-moving:hover i, .section-component .section-component-header .section-component-control-view .section-component-toggle:hover i {
  color: #222;
}
.section-component .section-component-header .section-component-control-view .btns-moving {
  display: flex;
  align-items: center;
}
.section-component .section-component-header .section-component-control-view .btns-moving .btn {
  border: 1px solid #BBB !important;
  padding: 4px 8px !important;
  font-size: 12px !important;
}
.section-component .section-component-wrapper-forms {
  display: none;
}
.section-component.container_section .wrapper-sections .container-section-title {
  padding-bottom: 8px;
  margin-bottom: 20px;
  position: relative;
  display: inline-block;
}
.section-component.container_section .wrapper-sections .container-section-title:after {
  content: "";
  height: 2px;
  width: 70%;
  background-color: #3498db;
  position: absolute;
  bottom: 0;
  left: 0;
}
.section-component.container_section .wrapper-sections .container-inner {
  border: 1px solid #BBB;
  padding: 20px;
  border-radius: 6px;
}
.section-component.container_section .wrapper-sections .container-inner:not(:last-of-type) {
  margin-bottom: 25px;
}
.section-component.moving {
  transform: scale(0.85);
}
.section-component.new {
  background-color: #c6e8f7;
}
.section-component.new .section-component-header {
  background-color: #deeef5;
}
.section-component.deleting {
  transition: transform 0.3s ease-in-out;
  transform: scale(0);
}

.section-component-form {
  padding: 15px;
}

.add_new_widget .btn {
  display: block;
  width: 100%;
}

#section_class_list {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 6666;
  background-color: rgba(0, 0, 0, 0.3);
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 0.15s ease-in-out;
  transform: scale(0);
  opacity: 0;
}
#section_class_list.open {
  transform: scale(1);
  opacity: 1;
}
#section_class_list .sections-view {
  width: 600px;
}
#section_class_list .sections-view .sections-content {
  background-color: #FFf;
  border-radius: 6px;
  border: 1px solid #EEE;
}
#section_class_list .sections-view .sections-content .sections-search {
  padding: 15px;
  border-bottom: 1px solid #EEE;
}
#section_class_list .sections-view .sections-content .section-list {
  display: flex;
  flex-wrap: wrap;
  padding: 10px;
  max-height: 500px;
  overflow: auto;
}
#section_class_list .sections-view .sections-content .section-list .section-box {
  width: 115px;
  min-height: 115px;
  margin: 10px;
  padding: 10px;
  border: 1px solid #DDD;
  border-radius: 5px;
  cursor: pointer;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  transition: all 0.2s ease-in-out;
}
#section_class_list .sections-view .sections-content .section-list .section-box:hover {
  border-color: #555;
}
#section_class_list .sections-view .sections-content .section-list .section-box .section-image {
  width: 100px;
  height: 100px;
}
#section_class_list .sections-view .sections-content .section-list .section-box .section-image .image {
  width: 100%;
  height: 100%;
}
#section_class_list .sections-view .sections-content .section-list .section-box .section-title {
  color: #222;
  font-weight: 600;
}
#section_class_list .sections-view .sections-content .section-list .section-box .section-title.has-image {
  max-width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 12px;
  margin-top: 10px;
}
#section_class_list .sections-view .sections-content .section-list .section-box .section-title.no-image {
  font-size: 13px;
  word-break: break-word;
}

#widget_class_list, #widget_class_list_widgets {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 6666;
  background-color: rgba(0, 0, 0, 0.3);
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 0.15s ease-in-out;
  transform: scale(0);
  opacity: 0;
}
#widget_class_list.open, #widget_class_list_widgets.open {
  transform: scale(1);
  opacity: 1;
}
#widget_class_list .widgets-view, #widget_class_list_widgets .widgets-view {
  width: 400px;
  min-height: 400px;
  margin-top: 12%;
}
#widget_class_list .widgets-view .widgets-content, #widget_class_list_widgets .widgets-view .widgets-content {
  background-color: #FFf;
  border-radius: 6px;
  border: 1px solid #EEE;
}
#widget_class_list .widgets-view .widgets-content .widgets-search, #widget_class_list_widgets .widgets-view .widgets-content .widgets-search {
  padding: 15px;
  border-bottom: 1px solid #EEE;
}
#widget_class_list .widgets-view .widgets-content .widget-groups, #widget_class_list_widgets .widgets-view .widgets-content .widget-groups {
  padding: 15px;
}
#widget_class_list .widgets-view .widgets-content .widget-groups .widget-list, #widget_class_list_widgets .widgets-view .widgets-content .widget-groups .widget-list {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 15px;
}
#widget_class_list .widgets-view .widgets-content .widget-groups .widget-list .widget-box, #widget_class_list_widgets .widgets-view .widgets-content .widget-groups .widget-list .widget-box {
  width: 102px;
  min-height: 102px;
  margin: 10px;
  padding: 10px;
  border: 1px solid #DDD;
  border-radius: 5px;
  cursor: pointer;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  transition: all 0.2s ease-in-out;
}
#widget_class_list .widgets-view .widgets-content .widget-groups .widget-list .widget-box:hover, #widget_class_list_widgets .widgets-view .widgets-content .widget-groups .widget-list .widget-box:hover {
  border-color: #555;
}
#widget_class_list .widgets-view .widgets-content .widget-groups .widget-list .widget-box:hover .widget-icon i, #widget_class_list_widgets .widgets-view .widgets-content .widget-groups .widget-list .widget-box:hover .widget-icon i {
  color: #222;
}
#widget_class_list .widgets-view .widgets-content .widget-groups .widget-list .widget-box .widget-icon, #widget_class_list_widgets .widgets-view .widgets-content .widget-groups .widget-list .widget-box .widget-icon {
  margin-bottom: 5px;
}
#widget_class_list .widgets-view .widgets-content .widget-groups .widget-list .widget-box .widget-icon i, #widget_class_list_widgets .widgets-view .widgets-content .widget-groups .widget-list .widget-box .widget-icon i {
  transition: all 0.2s ease-in-out;
  font-size: 20px;
}
#widget_class_list .widgets-view .widgets-content .widget-groups .widget-list .widget-box .widget-title, #widget_class_list_widgets .widgets-view .widgets-content .widget-groups .widget-list .widget-box .widget-title {
  color: #222;
  font-weight: 600;
  font-size: 14px;
  word-break: break-word;
}

.hide-box {
  transform: scale(0);
  position: absolute;
  z-index: -1;
}

.form-separator {
  display: block;
  width: 100%;
  height: 2px;
  margin-top: 30px;
  margin-bottom: 30px;
  background-color: #DDD;
}
.form-separator.inner {
  margin-left: auto;
  margin-right: auto;
  width: 95%;
}
.form-separator.half {
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}

.setting-box .setting-box-label {
  padding-bottom: 8px;
  margin-bottom: 20px;
  position: relative;
  display: inline-block;
}
.setting-box .setting-box-label:after {
  content: "";
  height: 2px;
  width: 70%;
  background-color: #3498db;
  position: absolute;
  bottom: 0;
  left: 0;
}
.setting-box .setting-boxs {
  padding-left: 10px;
  padding-right: 10px;
}
.setting-box .setting-boxs:not(.last) {
  border-bottom: 1px solid #BBB;
  padding-bottom: 10px;
  margin-bottom: 30px;
}

/*# sourceMappingURL=setting.css.map*/