.left-bottom-options {
  position  : fixed;
  left      : 20px;
  bottom    : 60px;
  background: rgba(0, 0, 0, 0.4);
  color     : #fff;
  font-size : 35px;
  padding   : 3px 5px;
}


.main-container {
  margin-top: 10px;
}

.layui-table img {
  max-width : 60px;
  max-height: 60px;
}

.table-card-box {
  margin-top      : 15px;
  background-color: #eee;
  padding         : 15px 5px;
}

.table-card-item {

  margin-top     : 5px;
  display        : flex;
  justify-content: flex-start;
  align-items    : flex-start;
}

.table-card-item img {
  max-width : 60px;
  max-height: 60px;
}

.table-card-item .item-title {
  padding  : 5px;
  font-size: 16px;
  width    : 20%;
}

.table-card-item .item-value {
  padding         : 5px;
  margin          : 5px;
  background-color: #fff;
  min-width       : 80%;
  white-space     : normal;
  word-break      : break-all;
}

.layui-form-radio {
  white-space: nowrap;
}


.quick-input-item {
  width : 120px;
  margin: 3px 0;
}

.quick-input-item.sm-quick-input-item .layui-btn {
  line-height: 24px;
  height     : 24px;
  font-size  : 12px;
  padding    : 0 12px;

}

.quick-input-item.sm-quick-input-item .layui-input {
  line-height: 24px;
  height     : 24px;
}

.ul-flex {
  display: flex;
}

.ql-snow .ql-editor pre.ql-syntax {
  line-height: 1.4;
}

@media screen and (max-width: 768px) {
  .layui-body {
    left: 0;
  }

  .layui-layout-admin .layui-footer {
    left: 0;
  }

  .layui-layout-admin .layui-logo {
    width: 115px;
  }

  .layui-layout-admin .layui-side {
    width     : 100%;
    overflow-x: hidden;
    height    : 100%;
    position  : unset;
  }

  .layui-layer-content .layui-hide-xs {
    display: unset !important;
  }

  .layui-nav-tree {
    width : 100%;
    height: 100%;
  }
}

.demo-js-src {
  display: none;
}