@gate-kind-header: doreamonjs-design-gate-kind-header;

.@{gate-kind-header}.normal {
  display: flex;
  flex-direction: row;
  height: 100%;
  overflow: hidden;


  .scrollContainer {
    box-sizing: border-box; // only for query
    height: 100vh;
    overflow: auto;
  }

  // .content {
  //   flex: 1;
  //   display: flex;
  // }

  // .main {
  //   padding: 0 8px;
  //   flex: 1 0 auto;
  // }

  // .trigger {
  //   font-size: 20px;
  //   line-height: 64px;
  //   cursor: pointer;
  //   -webkit-transition: all .3s, padding 0s;
  //   transition: all .3s, padding 0s;
  //   padding: 0 24px;
  //   padding-right: 12px;
  // }

  // .siderBarMenu {
  //   padding: 16px 0px;
  // }

  // .backTop {
  //   right: 20px !important;
  //   bottom: 20px !important;
  // }

  // .drawerform {
  //   width: 500px;
  // }

  // .modalform {
  //   // width: 500px;
  // }

  // .contentSpin {
  //   position: absolute;
  //   top: 50%;
  //   left: 50%;
  //   transform: translate3d(-50%, -50%, 0);
  // }

  // .contentNav {
  //   padding: 16px;
  //   background: #fff;
  //   position: sticky;
  //   top: 64px;
  //   z-index: 999;
  //   box-shadow: 0 1px 4px rgba(0, 21, 41, .08);
  // }

  // .contentBody {
  //   margin: 24px 16px;
  //   // padding: 24px;
  //   // background: #fff;
  //   min-height: calc(~"100vh - 150px");
  //   position: relative;

  //   .iframeContent {
  //     margin: -24px -16px;
  //     min-height: calc(~"100vh - 104px");
  //     width: calc(~"100% + 48px");
  //   }
  // }
}