@import "./../variable.scss";

.hx-content {
  position: relative;
  &.no-footer, &.no-header{
    @include hcalc(calc(100% - 50px));
  }
  &.no-footer.no-header{
    height: 100%;
  }
  &.bg{
    padding: $height-navbar;
  }
  background-color: $color-gray-light;
  @include hcalc(calc(100% - 100px)); // 92px是头部（42px）加上底部（50px）
  width: 100%;
  overflow-y: auto;
}
// 左板块
.hx-pad-left {
  float: left;
  width: 50%;
  padding-right: $pm-md;
}
// 右板块
.hx-pad-right {
  float: right;
  width: 50%;
}
// 居中板块
.hx-pad-center {
  margin: 0 auto;
  width: 60%;
}
.hx-pad-left,
.hx-pad-center,
.hx-pad-right {
  height: 100%;
  position: relative;
}

@media screen and (max-width: 640px) {
  .hx-content {
    overflow-x: auto;
    padding: 0;
  }
  .hx-pad-left,
  .hx-pad-center,
  .hx-pad-right {
    padding: 0;
    margin: 0;
  }
  .hx-pad-left, .hx-pad-right, .hx-pad-center {
    width: 100%!important;
    height: auto;
  }
}

@media screen and (min-width: 640px) {
  .hx-content {
    box-shadow: inset 0 0 $pm-md rgba(0,0,0,.05);
    padding: $pm-md;
  }
}