首页>框架>响应式栅格系统

2.2 响应式栅格系统

文章转载，请注明出处 H-ui前端框架，网址http://www.h-ui.net/

为何要栅格？

做网页就像盖楼，地皮有了，这一块干啥，那一块干啥，提前规划很重要，只有精确到像素才能让网页看上去更规范，更便于统一维护，扩展。同时保持网站的整体风格。

栅格系统由行（row）和列（col）共同组成，通过不同的行列组合我们可以实现各种布局，内容就放在一个个的格子中，就像收纳盒一样。

超小屏幕 手机 (<768px) 小屏幕 平板 (≥768px) 中等屏幕 桌面显示器 (≥992px) 大屏幕 大桌面显示器 (≥1200px)
栅格系统行为 总是水平排列 开始是堆叠在一起的，当大于这些阈值时将变为水平排列C
.hui-layout-content 最大宽度 None （自动） 750px 970px 1170px
类前缀 .hui-col-xs- .hui-col-sm- .hui-col-md- .hui-col-lg-
列（column）数 12
最大列（column）宽 自动 ~62px ~81px ~97px
槽（gutter）宽 30px （每列左右均有 15px）
可嵌套 是
偏移（Offsets） 是
列排序 是
1/12
1/12
1/12
1/12
1/12
1/12
1/12
1/12
1/12
1/12
1/12
1/12
2/12(1/6)
4/12(1/3)
6/12(1/2)
3/12(1/4)
9/12(3/4)
6/12(1/2)
6/12(1/2)
12/12(1)

通过追加 hui-col-md-offset- 我们可以实现偏移

偏移3/12(1/4)
偏移4/12(1/3)
偏移6/12(1/2)
scss css 
  /*2.2 栅格系统
  name:        hui-grid
  example:
    
  explain:    布局 栅格系统
*/
.hui-row {
  box-sizing: border-box;
  margin-left: -15px;
  margin-right: -15px;
  .hui-col-1,.hui-col-2,.hui-col-3,.hui-col-4,.hui-col-5,.hui-col-6,.hui-col-7,.hui-col-8,.hui-col-9,.hui-col-10,.hui-col-11,.hui-col-12,
  .hui-col-xs-1, .hui-col-sm-1, .hui-col-md-1, .hui-col-lg-1, 
  .hui-col-xs-2, .hui-col-sm-2, .hui-col-md-2, .hui-col-lg-2, 
  .hui-col-xs-3, .hui-col-sm-3, .hui-col-md-3, .hui-col-lg-3, 
  .hui-col-xs-4, .hui-col-sm-4, .hui-col-md-4, .hui-col-lg-4, 
  .hui-col-xs-5, .hui-col-sm-5, .hui-col-md-5, .hui-col-lg-5, 
  .hui-col-xs-6, .hui-col-sm-6, .hui-col-md-6, .hui-col-lg-6, 
  .hui-col-xs-7, .hui-col-sm-7, .hui-col-md-7, .hui-col-lg-7, 
  .hui-col-xs-8, .hui-col-sm-8, .hui-col-md-8, .hui-col-lg-8, 
  .hui-col-xs-9, .hui-col-sm-9, .hui-col-md-9, .hui-col-lg-9, 
  .hui-col-xs-10, .hui-col-sm-10, .hui-col-md-10, .hui-col-lg-10, 
  .hui-col-xs-11, .hui-col-sm-11, .hui-col-md-11, .hui-col-lg-11, 
  .hui-col-xs-12, .hui-col-sm-12, .hui-col-md-12, .hui-col-lg-12 {
    min-height: 1px;
    position: relative;
    padding-left:15px;
    padding-right:15px;
    box-sizing:border-box;
    @include transition(all 0.3s ease-in);
  }
  .hui-col-1{width:8.33333%}
  .hui-col-2{width:16.66667%}
  .hui-col-3{width:25%}
  .hui-col-4{width:33.33333%}
  .hui-col-5{width:41.66667%}
  .hui-col-6{width:50%}
  .hui-col-7{width:58.33333%}
  .hui-col-8{width:66.66667%}
  .hui-col-9{width:75%}
  .hui-col-10{width:83.33333%}
  .hui-col-11{width:91.66667%}
  .hui-col-12{width:100%}

  .hui-col-offset-0{margin-left:0}
  .hui-col-offset-1{margin-left:8.33333%}
  .hui-col-offset-2{margin-left:16.66667%}
  .hui-col-offset-3{margin-left:25%}
  .hui-col-offset-4{margin-left:33.33333%}
  .hui-col-offset-5{margin-left:41.66667%}
  .hui-col-offset-6{margin-left:50%}
  .hui-col-offset-7{margin-left:58.33333%}
  .hui-col-offset-8{margin-left:66.66667%}
  .hui-col-offset-9{margin-left:75%}
  .hui-col-offset-10{margin-left:83.33333%}
  .hui-col-offset-11{margin-left:91.66667%}

  .hui-col-push-0{position:relative;left:0;right:auto}
  .hui-col-pull-0{right:0;left:auto}
  .hui-col-push-1{left:8.33333%;right:auto}
  .hui-col-pull-1{right:8.33333%;left:auto}
  .hui-col-push-2{left:16.66667%;right:auto}
  .hui-col-pull-2{right:16.66667%;left:auto}
  .hui-col-push-3{left:25%;right:auto}
  .hui-col-pull-3{right:25%;left:auto}
  .hui-col-push-4{left:33.33333%;right:auto}
  .hui-col-pull-4{right:33.33333%;left:auto}
  .hui-col-push-5{left:41.66667%;right:auto}
  .hui-col-pull-5{right:41.66667%;left:auto}
  .hui-col-push-6{left:50%;right:auto}
  .hui-col-pull-6{right:50%;left:auto}
  .hui-col-push-7{left:58.33333%;right:auto}
  .hui-col-pull-7{right:58.33333%;left:auto}
  .hui-col-push-8{left:66.66667%;right:auto}
  .hui-col-pull-8{right:66.66667%;left:auto}
  .hui-col-push-9{left:75%;right:auto}
  .hui-col-pull-9{right:75%;left:auto}
  .hui-col-push-10{left:83.33333%;right:auto}
  .hui-col-pull-10{right:83.33333%;left:auto}
  .hui-col-push-11{left:91.66667%;right:auto}
  .hui-col-pull-11{right:91.66667%;left:auto}
  /*局部模块平分*/
  .hui-col-1-1{ width:100%}
  .hui-col-2-1{ width:50%}
  .hui-col-3-1{ width:33.333333%}
  .hui-col-3-2{ width:66.666667%}
  .hui-col-4-1{ width:25%}
  .hui-col-4-3{ width:75%}
  .hui-col-5-1{ width:20%}
  .hui-col-5-2{ width:40%}
  .hui-col-5-3{ width:60%}
  .hui-col-5-4{ width:80%}
  .hui-col-6-1{ width:16.666667%}
  .hui-col-6-5{ width:83.333333%}

  .hui-col-xs-1, .hui-col-xs-2, .hui-col-xs-3, .hui-col-xs-4, .hui-col-xs-5, .hui-col-xs-6, .hui-col-xs-7, .hui-col-xs-8, .hui-col-xs-9, .hui-col-xs-10, .hui-col-xs-11, .hui-col-xs-12 {
    float: left;
  }
  .hui-col-xs-12 {width: 100%}
  .hui-col-xs-11 {width: 91.66666667%}
  .hui-col-xs-10 {width: 83.33333333%}
  .hui-col-xs-9 {width: 75%}
  .hui-col-xs-8 {width: 66.66666667%}
  .hui-col-xs-7 {width: 58.33333333%}
  .hui-col-xs-6 {width: 50%}
  .hui-col-xs-5 {width: 41.66666667%}
  .hui-col-xs-4 {width: 33.33333333%}
  .hui-col-xs-3 {width: 25%}
  .hui-col-xs-2 {width: 16.66666667%}
  .hui-col-xs-1 {width: 8.33333333%}
  .hui-col-xs-pull-12 {right: 100%}
  .hui-col-xs-pull-11 {right: 91.66666667%}
  .hui-col-xs-pull-10 {right: 83.33333333%}
  .hui-col-xs-pull-9 {right: 75%}
  .hui-col-xs-pull-8 {right: 66.66666667%}
  .hui-col-xs-pull-7 {right: 58.33333333%}
  .hui-col-xs-pull-6 {right: 50%}
  .hui-col-xs-pull-5 {right: 41.66666667%}
  .hui-col-xs-pull-4 {right: 33.33333333%}
  .hui-col-xs-pull-3 {right: 25%}
  .hui-col-xs-pull-2 {right: 16.66666667%}
  .hui-col-xs-pull-1 {right: 8.33333333%}
  .hui-col-xs-pull-0 {right: auto}
  .hui-col-xs-push-12 {left: 100%}
  .hui-col-xs-push-11 {left: 91.66666667%}
  .hui-col-xs-push-10 {left: 83.33333333%}
  .hui-col-xs-push-9 {left: 75%}
  .hui-col-xs-push-8 {left: 66.66666667%}
  .hui-col-xs-push-7 {left: 58.33333333%}
  .hui-col-xs-push-6 {left: 50%}
  .hui-col-xs-push-5 {left: 41.66666667%}
  .hui-col-xs-push-4 {left: 33.33333333%}
  .hui-col-xs-push-3 {left: 25%}
  .hui-col-xs-push-2 {left: 16.66666667%}
  .hui-col-xs-push-1 {left: 8.33333333%}
  .hui-col-xs-push-0 {left: auto}
  .hui-col-xs-offset-12 {margin-left: 100%}
  .hui-col-xs-offset-11 {margin-left: 91.66666667%}
  .hui-col-xs-offset-10 {margin-left: 83.33333333%}
  .hui-col-xs-offset-9 {margin-left: 75%}
  .hui-col-xs-offset-8 {margin-left: 66.66666667%}
  .hui-col-xs-offset-7 {margin-left: 58.33333333%}
  .hui-col-xs-offset-6 {margin-left: 50%}
  .hui-col-xs-offset-5 {margin-left: 41.66666667%}
  .hui-col-xs-offset-4 {margin-left: 33.33333333%}
  .hui-col-xs-offset-3 {margin-left: 25%}
  .hui-col-xs-offset-2 {margin-left: 16.66666667%}
  .hui-col-xs-offset-1 {margin-left: 8.33333333%}
  .hui-col-xs-offset-0 {margin-left: 0}
}

@media (max-width:767px){
  .hui-row {
    &.responsive {
      [class^="hui-col-"],
      [class*=" hui-col-"] {
        float: none!important;
        width: auto!important;
      }
      [class^="hui-col-offset-"],
      [class*=" hui-col-offset-"] {
        margin-left: 0!important;
      }
    } 
  }
}
@media(min-width:768px) {
  .hui-row {
    .hui-col-sm-1,
    .hui-col-sm-10,
    .hui-col-sm-11,
    .hui-col-sm-12,
    .hui-col-sm-2,
    .hui-col-sm-3,
    .hui-col-sm-4,
    .hui-col-sm-5,
    .hui-col-sm-6,
    .hui-col-sm-7,
    .hui-col-sm-8,
    .hui-col-sm-9 {float:left;}
    .hui-col-sm-12 {width:100%}
    .hui-col-sm-11 {width:91.66666666666666%}
    .hui-col-sm-10 {width:83.33333333333334%}
    .hui-col-sm-9 {width:75%}
    .hui-col-sm-8 {width:66.66666666666666%}
    .hui-col-sm-7 {width:58.333333333333336%}
    .hui-col-sm-6 {width:50%}
    .hui-col-sm-5 {width:41.66666666666667%}
    .hui-col-sm-4 {width:33.33333333333333%}
    .hui-col-sm-3 {width:25%}
    .hui-col-sm-2 {width:16.666666666666664%}
    .hui-col-sm-1 {width:8.333333333333332%}
    .hui-col-sm-pull-12{right:100%}
    .hui-col-sm-pull-11{right:91.66666666666666%}
    .hui-col-sm-pull-10{right:83.33333333333334%}
    .hui-col-sm-pull-9{right:75%}
    .hui-col-sm-pull-8{right:66.66666666666666%}
    .hui-col-sm-pull-7{right:58.333333333333336%}
    .hui-col-sm-pull-6{right:50%}
    .hui-col-sm-pull-5{right:41.66666666666667%}
    .hui-col-sm-pull-4{right:33.33333333333333%}
    .hui-col-sm-pull-3{right:25%}
    .hui-col-sm-pull-2{right:16.666666666666664%}
    .hui-col-sm-pull-1{right:8.333333333333332%}
    .hui-col-sm-pull-0{right:0}
    .hui-col-sm-push-12{left:100%}
    .hui-col-sm-push-11{left:91.66666666666666%}
    .hui-col-sm-push-10{left:83.33333333333334%}
    .hui-col-sm-push-9{left:75%}
    .hui-col-sm-push-8{left:66.66666666666666%}
    .hui-col-sm-push-7{left:58.333333333333336%}
    .hui-col-sm-push-6{left:50%}
    .hui-col-sm-push-5{left:41.66666666666667%}
    .hui-col-sm-push-4{left:33.33333333333333%}
    .hui-col-sm-push-3{left:25%}
    .hui-col-sm-push-2{left:16.666666666666664%}
    .hui-col-sm-push-1{left:8.333333333333332%}
    .hui-col-sm-push-0{left:0}
    .hui-col-sm-offset-12{margin-left:100%}
    .hui-col-sm-offset-11{margin-left:91.66666666666666%}
    .hui-col-sm-offset-10{margin-left:83.33333333333334%}
    .hui-col-sm-offset-9{margin-left:75%}
    .hui-col-sm-offset-8{margin-left:66.66666666666666%}
    .hui-col-sm-offset-7{margin-left:58.333333333333336%}
    .hui-col-sm-offset-6{margin-left:50%}
    .hui-col-sm-offset-5{margin-left:41.66666666666667%}
    .hui-col-sm-offset-4{margin-left:33.33333333333333%}
    .hui-col-sm-offset-3{margin-left:25%}
    .hui-col-sm-offset-2{margin-left:16.666666666666664%}
    .hui-col-sm-offset-1{margin-left:8.333333333333332%}
    .hui-col-sm-offset-0{margin-left:0}
  }
}
@media(min-width:992px){
  .hui-row {
    .hui-col-md-1,.hui-col-md-10,.hui-col-md-11,.hui-col-md-12,.hui-col-md-2,.hui-col-md-3,.hui-col-md-4,.hui-col-md-5,.hui-col-md-6,.hui-col-md-7,.hui-col-md-8,.hui-col-md-9{float:left}
    .hui-col-md-12{width:100%}
    .hui-col-md-11{width:91.66666666666666%}
    .hui-col-md-10{width:83.33333333333334%}
    .hui-col-md-9{width:75%}
    .hui-col-md-8{width:66.66666666666666%}
    .hui-col-md-7{width:58.333333333333336%}
    .hui-col-md-6{width:50%}
    .hui-col-md-5{width:41.66666666666667%}
    .hui-col-md-4{width:33.33333333333333%}
    .hui-col-md-3{width:25%}
    .hui-col-md-2{width:16.666666666666664%}
    .hui-col-md-1{width:8.333333333333332%}
    .hui-col-md-pull-12{right:100%}
    .hui-col-md-pull-11{right:91.66666666666666%}
    .hui-col-md-pull-10{right:83.33333333333334%}
    .hui-col-md-pull-9{right:75%}
    .hui-col-md-pull-8{right:66.66666666666666%}
    .hui-col-md-pull-7{right:58.333333333333336%}
    .hui-col-md-pull-6{right:50%}
    .hui-col-md-pull-5{right:41.66666666666667%}
    .hui-col-md-pull-4{right:33.33333333333333%}
    .hui-col-md-pull-3{right:25%}
    .hui-col-md-pull-2{right:16.666666666666664%}
    .hui-col-md-pull-1{right:8.333333333333332%}
    .hui-col-md-pull-0{right:0}
    .hui-col-md-push-12{left:100%}
    .hui-col-md-push-11{left:91.66666666666666%}
    .hui-col-md-push-10{left:83.33333333333334%}
    .hui-col-md-push-9{left:75%}
    .hui-col-md-push-8{left:66.66666666666666%}
    .hui-col-md-push-7{left:58.333333333333336%}
    .hui-col-md-push-6{left:50%}
    .hui-col-md-push-5{left:41.66666666666667%}
    .hui-col-md-push-4{left:33.33333333333333%}
    .hui-col-md-push-3{left:25%}
    .hui-col-md-push-2{left:16.666666666666664%}
    .hui-col-md-push-1{left:8.333333333333332%}
    .hui-col-md-push-0{left:0}
    .hui-col-md-offset-12{margin-left:100%}
    .hui-col-md-offset-11{margin-left:91.66666666666666%}
    .hui-col-md-offset-10{margin-left:83.33333333333334%}
    .hui-col-md-offset-9{margin-left:75%}
    .hui-col-md-offset-8{margin-left:66.66666666666666%}
    .hui-col-md-offset-7{margin-left:58.333333333333336%}
    .hui-col-md-offset-6{margin-left:50%}
    .hui-col-md-offset-5{margin-left:41.66666666666667%}
    .hui-col-md-offset-4{margin-left:33.33333333333333%}
    .hui-col-md-offset-3{margin-left:25%}
    .hui-col-md-offset-2{margin-left:16.666666666666664%}
    .hui-col-md-offset-1{margin-left:8.333333333333332%}
    .hui-col-md-offset-0{margin-left:0}
  }
}
@media(min-width:1200px){
  .hui-row {
    .hui-col-lg-1,.hui-col-lg-10,.hui-col-lg-11,.hui-col-lg-12,.hui-col-lg-2,.hui-col-lg-3,.hui-col-lg-4,.hui-col-lg-5,.hui-col-lg-6,.hui-col-lg-7,.hui-col-lg-8,.hui-col-lg-9{float:left}
    .hui-col-lg-12{width:100%}
    .hui-col-lg-11{width:91.66666666666666%}
    .hui-col-lg-10{width:83.33333333333334%}
    .hui-col-lg-9{width:75%}
    .hui-col-lg-8{width:66.66666666666666%}
    .hui-col-lg-7{width:58.333333333333336%}
    .hui-col-lg-6{width:50%}
    .hui-col-lg-5{width:41.66666666666667%}
    .hui-col-lg-4{width:33.33333333333333%}
    .hui-col-lg-3{width:25%}
    .hui-col-lg-2{width:16.666666666666664%}
    .hui-col-lg-1{width:8.333333333333332%}
    .hui-col-lg-pull-12{right:100%}
    .hui-col-lg-pull-11{right:91.66666666666666%}
    .hui-col-lg-pull-10{right:83.33333333333334%}
    .hui-col-lg-pull-9{right:75%}
    .hui-col-lg-pull-8{right:66.66666666666666%}
    .hui-col-lg-pull-7{right:58.333333333333336%}
    .hui-col-lg-pull-6{right:50%}
    .hui-col-lg-pull-5{right:41.66666666666667%}
    .hui-col-lg-pull-4{right:33.33333333333333%}
    .hui-col-lg-pull-3{right:25%}
    .hui-col-lg-pull-2{right:16.666666666666664%}
    .hui-col-lg-pull-1{right:8.333333333333332%}
    .hui-col-lg-pull-0{right:0}
    .hui-col-lg-push-12{left:100%}
    .hui-col-lg-push-11{left:91.66666666666666%}
    .hui-col-lg-push-10{left:83.33333333333334%}
    .hui-col-lg-push-9{left:75%}
    .hui-col-lg-push-8{left:66.66666666666666%}
    .hui-col-lg-push-7{left:58.333333333333336%}
    .hui-col-lg-push-6{left:50%}
    .hui-col-lg-push-5{left:41.66666666666667%}
    .hui-col-lg-push-4{left:33.33333333333333%}
    .hui-col-lg-push-3{left:25%}
    .hui-col-lg-push-2{left:16.666666666666664%}
    .hui-col-lg-push-1{left:8.333333333333332%}
    .hui-col-lg-push-0{left:0}
    .hui-col-lg-offset-12{margin-left:100%}
    .hui-col-lg-offset-11{margin-left:91.66666666666666%}
    .hui-col-lg-offset-10{margin-left:83.33333333333334%}
    .hui-col-lg-offset-9{margin-left:75%}
    .hui-col-lg-offset-8{margin-left:66.66666666666666%}
    .hui-col-lg-offset-7{margin-left:58.333333333333336%}
    .hui-col-lg-offset-6{margin-left:50%}
    .hui-col-lg-offset-5{margin-left:41.66666666666667%}
    .hui-col-lg-offset-4{margin-left:33.33333333333333%}
    .hui-col-lg-offset-3{margin-left:25%}
    .hui-col-lg-offset-2{margin-left:16.666666666666664%}
    .hui-col-lg-offset-1{margin-left:8.333333333333332%}
    .hui-col-lg-offset-0{margin-left:0}
  }
}

/* 24栅格 */
.hui-row-24 {
  position: relative;
  margin-left: 0;
  margin-right: 0;
  height: auto;
  zoom: 1;
  display: block;
  box-sizing: border-box;
  &:before,
  &:after {
    content: " ";
    display: table;
  }
  &:after {
    clear: both;
    visibility: hidden;
    font-size: 0;
    height: 0;
  }
  .hui-col-24-1, .hui-col-24-xs-1, .hui-col-24-sm-1, .hui-col-24-md-1, .hui-col-24-lg-1, .hui-col-24-xl-1, .hui-col-24-xxl-1,
  .hui-col-24-2, .hui-col-24-xs-2, .hui-col-24-sm-2, .hui-col-24-md-2, .hui-col-24-lg-2, .hui-col-24-xl-2, .hui-col-24-xxl-2,
  .hui-col-24-3, .hui-col-24-xs-3, .hui-col-24-sm-3, .hui-col-24-md-3, .hui-col-24-lg-3, .hui-col-24-xl-3, .hui-col-24-xxl-3,
  .hui-col-24-4, .hui-col-24-xs-4, .hui-col-24-sm-4, .hui-col-24-md-4, .hui-col-24-lg-4, .hui-col-24-xl-4, .hui-col-24-xxl-4,
  .hui-col-24-5, .hui-col-24-xs-5, .hui-col-24-sm-5, .hui-col-24-md-5, .hui-col-24-lg-5, .hui-col-24-xl-5, .hui-col-24-xxl-5,
  .hui-col-24-6, .hui-col-24-xs-6, .hui-col-24-sm-6, .hui-col-24-md-6, .hui-col-24-lg-6, .hui-col-24-xl-6, .hui-col-24-xxl-6,
  .hui-col-24-7, .hui-col-24-xs-7, .hui-col-24-sm-7, .hui-col-24-md-7, .hui-col-24-lg-7, .hui-col-24-xl-7, .hui-col-24-xxl-7,
  .hui-col-24-8, .hui-col-24-xs-8, .hui-col-24-sm-8, .hui-col-24-md-8, .hui-col-24-lg-8, .hui-col-24-xl-8, .hui-col-24-xxl-8,
  .hui-col-24-9, .hui-col-24-xs-9, .hui-col-24-sm-9, .hui-col-24-md-9, .hui-col-24-lg-9, .hui-col-24-xl-9, .hui-col-24-xxl-9,
  .hui-col-24-10, .hui-col-24-xs-10, .hui-col-24-sm-10, .hui-col-24-md-10, .hui-col-24-lg-10, .hui-col-24-xl-10, .hui-col-24-xxl-10,
  .hui-col-24-11, .hui-col-24-xs-11, .hui-col-24-sm-11, .hui-col-24-md-11, .hui-col-24-lg-11, .hui-col-24-xl-11, .hui-col-24-xxl-11,
  .hui-col-24-12, .hui-col-24-xs-12, .hui-col-24-sm-12, .hui-col-24-md-12, .hui-col-24-lg-12, .hui-col-24-xl-12, .hui-col-24-xxl-12,
  .hui-col-24-13, .hui-col-24-xs-13, .hui-col-24-sm-13, .hui-col-24-md-13, .hui-col-24-lg-13, .hui-col-24-xl-13, .hui-col-24-xxl-13,
  .hui-col-24-14, .hui-col-24-xs-14, .hui-col-24-sm-14, .hui-col-24-md-14, .hui-col-24-lg-14, .hui-col-24-xl-14, .hui-col-24-xxl-14,
  .hui-col-24-15, .hui-col-24-xs-15, .hui-col-24-sm-15, .hui-col-24-md-15, .hui-col-24-lg-15, .hui-col-24-xl-15, .hui-col-24-xxl-15,
  .hui-col-24-16, .hui-col-24-xs-16, .hui-col-24-sm-16, .hui-col-24-md-16, .hui-col-24-lg-16, .hui-col-24-xl-16, .hui-col-24-xxl-16,
  .hui-col-24-17, .hui-col-24-xs-17, .hui-col-24-sm-17, .hui-col-24-md-17, .hui-col-24-lg-17, .hui-col-24-xl-17, .hui-col-24-xxl-17,
  .hui-col-24-18, .hui-col-24-xs-18, .hui-col-24-sm-18, .hui-col-24-md-18, .hui-col-24-lg-18, .hui-col-24-xl-18, .hui-col-24-xxl-18,
  .hui-col-24-19, .hui-col-24-xs-19, .hui-col-24-sm-19, .hui-col-24-md-19, .hui-col-24-lg-19, .hui-col-24-xl-19, .hui-col-24-xxl-19,
  .hui-col-24-20, .hui-col-24-xs-20, .hui-col-24-sm-20, .hui-col-24-md-20, .hui-col-24-lg-20, .hui-col-24-xl-20, .hui-col-24-xxl-20,
  .hui-col-24-21, .hui-col-24-xs-21, .hui-col-24-sm-21, .hui-col-24-md-21, .hui-col-24-lg-21, .hui-col-24-xl-21, .hui-col-24-xxl-21,
  .hui-col-24-22, .hui-col-24-xs-22, .hui-col-24-sm-22, .hui-col-24-md-22, .hui-col-24-lg-22, .hui-col-24-xl-22, .hui-col-24-xxl-22,
  .hui-col-24-23, .hui-col-24-xs-23, .hui-col-24-sm-23, .hui-col-24-md-23, .hui-col-24-lg-23, .hui-col-24-xl-23, .hui-col-24-xxl-23,
  .hui-col-24-24, .hui-col-24-xs-24, .hui-col-24-sm-24, .hui-col-24-md-24, .hui-col-24-lg-24, .hui-col-24-xl-24, .hui-col-24-xxl-24 {
    position: relative;
    min-height: 1px;
    padding-left: 0;
    padding-right: 0;
    box-sizing:border-box;
    @include transition(all 0.3s ease-in);
  }
  .hui-col-24-xs-1, .hui-col-24-xs-2, .hui-col-24-xs-3, .hui-col-24-xs-4, .hui-col-24-xs-5, .hui-col-24-xs-6,
  .hui-col-24-xs-7, .hui-col-24-xs-8, .hui-col-24-xs-9, .hui-col-24-xs-10, .hui-col-24-xs-11, .hui-col-24-xs-12,
  .hui-col-24-xs-13, .hui-col-24-xs-14, .hui-col-24-xs-15, .hui-col-24-xs-16, .hui-col-24-xs-17, .hui-col-24-xs-18,
  .hui-col-24-xs-19, .hui-col-24-xs-20, .hui-col-24-xs-21, .hui-col-24-xs-22, .hui-col-24-xs-23, .hui-col-24-xs-24 {
    float: left;
  }
  .hui-col-24-xs-24 {width: 100%}
  .hui-col-24-xs-23 {width: 95.83333333%}
  .hui-col-24-xs-22 {width: 91.66666667%}

  .hui-col-24-xs-21 {width: 87.5%}
  .hui-col-24-xs-20 {width: 83.33333333%}
  .hui-col-24-xs-19 {width: 79.16666667%}

  .hui-col-24-xs-18 {width: 75%}
  .hui-col-24-xs-17 {width: 70.83333333%}
  .hui-col-24-xs-16 {width: 66.66666667%}

  .hui-col-24-xs-15 {width: 62.5%}
  .hui-col-24-xs-14 {width: 58.33333333%}
  .hui-col-24-xs-13 {width: 54.16666667%}

  .hui-col-24-xs-12 {width: 50%}
  .hui-col-24-xs-11 {width: 45.83333333%}
  .hui-col-24-xs-10 {width: 41.66666667%}

  .hui-col-24-xs-9  {width: 37.5%}
  .hui-col-24-xs-8  {width: 33.33333333%}
  .hui-col-24-xs-7  {width: 29.16666667%}

  .hui-col-24-xs-6  {width: 25%}
  .hui-col-24-xs-5  {width: 20.83333333%}
  .hui-col-24-xs-4  {width: 16.66666667%}

  .hui-col-24-xs-3  {width: 12.5%}
  .hui-col-24-xs-2  {width: 8.33333333%}
  .hui-col-24-xs-1  {width: 4.16666667%}

  .hui-col-24-xs-pull-24 {right: 100%}
  .hui-col-24-xs-pull-23 {right: 95.83333333%}
  .hui-col-24-xs-pull-22 {right: 91.66666667%}
  .hui-col-24-xs-pull-21 {right: 87.5%}
  .hui-col-24-xs-pull-20 {right: 83.33333333%}
  .hui-col-24-xs-pull-19 {right: 79.16666667%}
  .hui-col-24-xs-pull-18 {right: 75%}
  .hui-col-24-xs-pull-17 {right: 70.83333333%}
  .hui-col-24-xs-pull-16 {right: 66.66666667%}
  .hui-col-24-xs-pull-15 {right: 62.5%}
  .hui-col-24-xs-pull-14 {right: 58.33333333%}
  .hui-col-24-xs-pull-13 {right: 54.16666667%}
  .hui-col-24-xs-pull-12 {right: 50%}
  .hui-col-24-xs-pull-11 {right: 45.83333333%}
  .hui-col-24-xs-pull-10 {right: 41.66666667%}
  .hui-col-24-xs-pull-9 {right: 37.5%}
  .hui-col-24-xs-pull-8 {right: 33.33333333%}
  .hui-col-24-xs-pull-7 {right: 29.16666667%}
  .hui-col-24-xs-pull-6 {right: 25%}
  .hui-col-24-xs-pull-5 {right: 20.83333333%}
  .hui-col-24-xs-pull-4 {right: 16.66666667%}
  .hui-col-24-xs-pull-3 {right: 12.5%}
  .hui-col-24-xs-pull-2 {right: 8.33333333%}
  .hui-col-24-xs-pull-1 {right: 4.16666667%}
  .hui-col-24-xs-pull-0 {right: auto}

  .hui-col-24-xs-push-24 {left: 100%}
  .hui-col-24-xs-push-23 {left: 95.83333333%}
  .hui-col-24-xs-push-22 {left: 91.66666667%}
  .hui-col-24-xs-push-21 {left: 87.5%}
  .hui-col-24-xs-push-20 {left: 83.33333333%}
  .hui-col-24-xs-push-19 {left: 79.16666667%}
  .hui-col-24-xs-push-18 {left: 75%}
  .hui-col-24-xs-push-17 {left: 70.83333333%}
  .hui-col-24-xs-push-16 {left: 66.66666667%}
  .hui-col-24-xs-push-15 {left: 62.5%}
  .hui-col-24-xs-push-14 {left: 58.33333333%}
  .hui-col-24-xs-push-13 {left: 54.16666667%}
  .hui-col-24-xs-push-12 {left: 50%}
  .hui-col-24-xs-push-11 {left: 45.83333333%}
  .hui-col-24-xs-push-10 {left: 41.66666667%}
  .hui-col-24-xs-push-9 {left: 37.5%}
  .hui-col-24-xs-push-8 {left: 33.33333333%}
  .hui-col-24-xs-push-7 {left: 29.16666667%}
  .hui-col-24-xs-push-6 {left: 25%}
  .hui-col-24-xs-push-5 {left: 20.83333333%}
  .hui-col-24-xs-push-4 {left: 16.66666667%}
  .hui-col-24-xs-push-3 {left: 12.5%}
  .hui-col-24-xs-push-2 {left: 8.33333333%}
  .hui-col-24-xs-push-1 {left: 4.16666667%}
  .hui-col-24-xs-push-0 {left: auto}

  .hui-col-24-xs-offset-24 {margin-left: 100%}
  .hui-col-24-xs-offset-23 {margin-left: 95.83333333%}
  .hui-col-24-xs-offset-22 {margin-left: 91.66666667%}
  .hui-col-24-xs-offset-21 {margin-left: 87.5%}
  .hui-col-24-xs-offset-20 {margin-left: 83.33333333%}
  .hui-col-24-xs-offset-19 {margin-left: 79.16666667%}
  .hui-col-24-xs-offset-18 {margin-left: 75%}
  .hui-col-24-xs-offset-17 {margin-left: 70.83333333%}
  .hui-col-24-xs-offset-16 {margin-left: 66.66666667%}
  .hui-col-24-xs-offset-15 {margin-left: 62.5%}
  .hui-col-24-xs-offset-14 {margin-left: 58.33333333%}
  .hui-col-24-xs-offset-13 {margin-left: 54.16666667%}
  .hui-col-24-xs-offset-12 {margin-left: 50%}
  .hui-col-24-xs-offset-11 {margin-left: 45.83333333%}
  .hui-col-24-xs-offset-10 {margin-left: 41.66666667%}
  .hui-col-24-xs-offset-9 {margin-left: 37.5%}
  .hui-col-24-xs-offset-8 {margin-left: 33.33333333%}
  .hui-col-24-xs-offset-7 {margin-left: 29.16666667%}
  .hui-col-24-xs-offset-6 {margin-left: 25%}
  .hui-col-24-xs-offset-5 {margin-left: 20.83333333%}
  .hui-col-24-xs-offset-4 {margin-left: 16.66666667%}
  .hui-col-24-xs-offset-3 {margin-left: 12.5%}
  .hui-col-24-xs-offset-2 {margin-left: 8.33333333%}
  .hui-col-24-xs-offset-1 {margin-left: 4.16666667%}
  .hui-col-24-xs-offset-0 {margin-left: 0}
}

@media(min-width: 676px) {
  .hui-row-24 {
    .hui-col-24-sm-1, .hui-col-24-sm-2, .hui-col-24-sm-3, .hui-col-24-sm-4, .hui-col-24-sm-5, .hui-col-24-sm-6,
    .hui-col-24-sm-7, .hui-col-24-sm-8, .hui-col-24-sm-9, .hui-col-24-sm-10, .hui-col-24-sm-11, .hui-col-24-sm-12,
    .hui-col-24-sm-13, .hui-col-24-sm-14, .hui-col-24-sm-15, .hui-col-24-sm-16, .hui-col-24-sm-17, .hui-col-24-sm-18,
    .hui-col-24-sm-19, .hui-col-24-sm-20, .hui-col-24-sm-21, .hui-col-24-sm-22, .hui-col-24-sm-23, .hui-col-24-sm-24 {
      float: left;
    }
    .hui-col-24-sm-24 {width: 100%}
    .hui-col-24-sm-23 {width: 95.83333333%}
    .hui-col-24-sm-22 {width: 91.66666667%}

    .hui-col-24-sm-21 {width: 87.5%}
    .hui-col-24-sm-20 {width: 83.33333333%}
    .hui-col-24-sm-19 {width: 79.16666667%}

    .hui-col-24-sm-18 {width: 75%}
    .hui-col-24-sm-17 {width: 70.83333333%}
    .hui-col-24-sm-16 {width: 66.66666667%}

    .hui-col-24-sm-15 {width: 62.5%}
    .hui-col-24-sm-14 {width: 58.33333333%}
    .hui-col-24-sm-13 {width: 54.16666667%}

    .hui-col-24-sm-12 {width: 50%}
    .hui-col-24-sm-11 {width: 45.83333333%}
    .hui-col-24-sm-10 {width: 41.66666667%}

    .hui-col-24-sm-9  {width: 37.5%}
    .hui-col-24-sm-8  {width: 33.33333333%}
    .hui-col-24-sm-7  {width: 29.16666667%}

    .hui-col-24-sm-6  {width: 25%}
    .hui-col-24-sm-5  {width: 20.83333333%}
    .hui-col-24-sm-4  {width: 16.66666667%}

    .hui-col-24-sm-3  {width: 12.5%}
    .hui-col-24-sm-2  {width: 8.33333333%}
    .hui-col-24-sm-1  {width: 4.16666667%}

    .hui-col-24-sm-pull-24 {right: 100%}
    .hui-col-24-sm-pull-23 {right: 95.83333333%}
    .hui-col-24-sm-pull-22 {right: 91.66666667%}
    .hui-col-24-sm-pull-21 {right: 87.5%}
    .hui-col-24-sm-pull-20 {right: 83.33333333%}
    .hui-col-24-sm-pull-19 {right: 79.16666667%}
    .hui-col-24-sm-pull-18 {right: 75%}
    .hui-col-24-sm-pull-17 {right: 70.83333333%}
    .hui-col-24-sm-pull-16 {right: 66.66666667%}
    .hui-col-24-sm-pull-15 {right: 62.5%}
    .hui-col-24-sm-pull-14 {right: 58.33333333%}
    .hui-col-24-sm-pull-13 {right: 54.16666667%}
    .hui-col-24-sm-pull-12 {right: 50%}
    .hui-col-24-sm-pull-11 {right: 45.83333333%}
    .hui-col-24-sm-pull-10 {right: 41.66666667%}
    .hui-col-24-sm-pull-9 {right: 37.5%}
    .hui-col-24-sm-pull-8 {right: 33.33333333%}
    .hui-col-24-sm-pull-7 {right: 29.16666667%}
    .hui-col-24-sm-pull-6 {right: 25%}
    .hui-col-24-sm-pull-5 {right: 20.83333333%}
    .hui-col-24-sm-pull-4 {right: 16.66666667%}
    .hui-col-24-sm-pull-3 {right: 12.5%}
    .hui-col-24-sm-pull-2 {right: 8.33333333%}
    .hui-col-24-sm-pull-1 {right: 4.16666667%}
    .hui-col-24-sm-pull-0 {right: auto}

    .hui-col-24-sm-push-24 {left: 100%}
    .hui-col-24-sm-push-23 {left: 95.83333333%}
    .hui-col-24-sm-push-22 {left: 91.66666667%}
    .hui-col-24-sm-push-21 {left: 87.5%}
    .hui-col-24-sm-push-20 {left: 83.33333333%}
    .hui-col-24-sm-push-19 {left: 79.16666667%}
    .hui-col-24-sm-push-18 {left: 75%}
    .hui-col-24-sm-push-17 {left: 70.83333333%}
    .hui-col-24-sm-push-16 {left: 66.66666667%}
    .hui-col-24-sm-push-15 {left: 62.5%}
    .hui-col-24-sm-push-14 {left: 58.33333333%}
    .hui-col-24-sm-push-13 {left: 54.16666667%}
    .hui-col-24-sm-push-12 {left: 50%}
    .hui-col-24-sm-push-11 {left: 45.83333333%}
    .hui-col-24-sm-push-10 {left: 41.66666667%}
    .hui-col-24-sm-push-9 {left: 37.5%}
    .hui-col-24-sm-push-8 {left: 33.33333333%}
    .hui-col-24-sm-push-7 {left: 29.16666667%}
    .hui-col-24-sm-push-6 {left: 25%}
    .hui-col-24-sm-push-5 {left: 20.83333333%}
    .hui-col-24-sm-push-4 {left: 16.66666667%}
    .hui-col-24-sm-push-3 {left: 12.5%}
    .hui-col-24-sm-push-2 {left: 8.33333333%}
    .hui-col-24-sm-push-1 {left: 4.16666667%}
    .hui-col-24-sm-push-0 {left: auto}

    .hui-col-24-sm-offset-24 {margin-left: 100%}
    .hui-col-24-sm-offset-23 {margin-left: 95.83333333%}
    .hui-col-24-sm-offset-22 {margin-left: 91.66666667%}
    .hui-col-24-sm-offset-21 {margin-left: 87.5%}
    .hui-col-24-sm-offset-20 {margin-left: 83.33333333%}
    .hui-col-24-sm-offset-19 {margin-left: 79.16666667%}
    .hui-col-24-sm-offset-18 {margin-left: 75%}
    .hui-col-24-sm-offset-17 {margin-left: 70.83333333%}
    .hui-col-24-sm-offset-16 {margin-left: 66.66666667%}
    .hui-col-24-sm-offset-15 {margin-left: 62.5%}
    .hui-col-24-sm-offset-14 {margin-left: 58.33333333%}
    .hui-col-24-sm-offset-13 {margin-left: 54.16666667%}
    .hui-col-24-sm-offset-12 {margin-left: 50%}
    .hui-col-24-sm-offset-11 {margin-left: 45.83333333%}
    .hui-col-24-sm-offset-10 {margin-left: 41.66666667%}
    .hui-col-24-sm-offset-9 {margin-left: 37.5%}
    .hui-col-24-sm-offset-8 {margin-left: 33.33333333%}
    .hui-col-24-sm-offset-7 {margin-left: 29.16666667%}
    .hui-col-24-sm-offset-6 {margin-left: 25%}
    .hui-col-24-sm-offset-5 {margin-left: 20.83333333%}
    .hui-col-24-sm-offset-4 {margin-left: 16.66666667%}
    .hui-col-24-sm-offset-3 {margin-left: 12.5%}
    .hui-col-24-sm-offset-2 {margin-left: 8.33333333%}
    .hui-col-24-sm-offset-1 {margin-left: 4.16666667%}
    .hui-col-24-sm-offset-0 {margin-left: 0}
  }
}
@media(min-width: 768px) {
  .hui-row-24 {
    .hui-col-24-md-1, .hui-col-24-md-2, .hui-col-24-md-3, .hui-col-24-md-4, .hui-col-24-md-5, .hui-col-24-md-6,
    .hui-col-24-md-7, .hui-col-24-md-8, .hui-col-24-md-9, .hui-col-24-md-10, .hui-col-24-md-11, .hui-col-24-md-12,
    .hui-col-24-md-13, .hui-col-24-md-14, .hui-col-24-md-15, .hui-col-24-md-16, .hui-col-24-md-17, .hui-col-24-md-18,
    .hui-col-24-md-19, .hui-col-24-md-20, .hui-col-24-md-21, .hui-col-24-md-22, .hui-col-24-md-23, .hui-col-24-md-24 {
      float: left;
    }
    .hui-col-24-md-24 {width: 100%}
    .hui-col-24-md-23 {width: 95.83333333%}
    .hui-col-24-md-22 {width: 91.66666667%}

    .hui-col-24-md-21 {width: 87.5%}
    .hui-col-24-md-20 {width: 83.33333333%}
    .hui-col-24-md-19 {width: 79.16666667%}

    .hui-col-24-md-18 {width: 75%}
    .hui-col-24-md-17 {width: 70.83333333%}
    .hui-col-24-md-16 {width: 66.66666667%}

    .hui-col-24-md-15 {width: 62.5%}
    .hui-col-24-md-14 {width: 58.33333333%}
    .hui-col-24-md-13 {width: 54.16666667%}

    .hui-col-24-md-12 {width: 50%}
    .hui-col-24-md-11 {width: 45.83333333%}
    .hui-col-24-md-10 {width: 41.66666667%}

    .hui-col-24-md-9  {width: 37.5%}
    .hui-col-24-md-8  {width: 33.33333333%}
    .hui-col-24-md-7  {width: 29.16666667%}

    .hui-col-24-md-6  {width: 25%}
    .hui-col-24-md-5  {width: 20.83333333%}
    .hui-col-24-md-4  {width: 16.66666667%}

    .hui-col-24-md-3  {width: 12.5%}
    .hui-col-24-md-2  {width: 8.33333333%}
    .hui-col-24-md-1  {width: 4.16666667%}

    .hui-col-24-md-pull-24 {right: 100%}
    .hui-col-24-md-pull-23 {right: 95.83333333%}
    .hui-col-24-md-pull-22 {right: 91.66666667%}
    .hui-col-24-md-pull-21 {right: 87.5%}
    .hui-col-24-md-pull-20 {right: 83.33333333%}
    .hui-col-24-md-pull-19 {right: 79.16666667%}
    .hui-col-24-md-pull-18 {right: 75%}
    .hui-col-24-md-pull-17 {right: 70.83333333%}
    .hui-col-24-md-pull-16 {right: 66.66666667%}
    .hui-col-24-md-pull-15 {right: 62.5%}
    .hui-col-24-md-pull-14 {right: 58.33333333%}
    .hui-col-24-md-pull-13 {right: 54.16666667%}
    .hui-col-24-md-pull-12 {right: 50%}
    .hui-col-24-md-pull-11 {right: 45.83333333%}
    .hui-col-24-md-pull-10 {right: 41.66666667%}
    .hui-col-24-md-pull-9 {right: 37.5%}
    .hui-col-24-md-pull-8 {right: 33.33333333%}
    .hui-col-24-md-pull-7 {right: 29.16666667%}
    .hui-col-24-md-pull-6 {right: 25%}
    .hui-col-24-md-pull-5 {right: 20.83333333%}
    .hui-col-24-md-pull-4 {right: 16.66666667%}
    .hui-col-24-md-pull-3 {right: 12.5%}
    .hui-col-24-md-pull-2 {right: 8.33333333%}
    .hui-col-24-md-pull-1 {right: 4.16666667%}
    .hui-col-24-md-pull-0 {right: auto}

    .hui-col-24-md-push-24 {left: 100%}
    .hui-col-24-md-push-23 {left: 95.83333333%}
    .hui-col-24-md-push-22 {left: 91.66666667%}
    .hui-col-24-md-push-21 {left: 87.5%}
    .hui-col-24-md-push-20 {left: 83.33333333%}
    .hui-col-24-md-push-19 {left: 79.16666667%}
    .hui-col-24-md-push-18 {left: 75%}
    .hui-col-24-md-push-17 {left: 70.83333333%}
    .hui-col-24-md-push-16 {left: 66.66666667%}
    .hui-col-24-md-push-15 {left: 62.5%}
    .hui-col-24-md-push-14 {left: 58.33333333%}
    .hui-col-24-md-push-13 {left: 54.16666667%}
    .hui-col-24-md-push-12 {left: 50%}
    .hui-col-24-md-push-11 {left: 45.83333333%}
    .hui-col-24-md-push-10 {left: 41.66666667%}
    .hui-col-24-md-push-9 {left: 37.5%}
    .hui-col-24-md-push-8 {left: 33.33333333%}
    .hui-col-24-md-push-7 {left: 29.16666667%}
    .hui-col-24-md-push-6 {left: 25%}
    .hui-col-24-md-push-5 {left: 20.83333333%}
    .hui-col-24-md-push-4 {left: 16.66666667%}
    .hui-col-24-md-push-3 {left: 12.5%}
    .hui-col-24-md-push-2 {left: 8.33333333%}
    .hui-col-24-md-push-1 {left: 4.16666667%}
    .hui-col-24-md-push-0 {left: auto}

    .hui-col-24-md-offset-24 {margin-left: 100%}
    .hui-col-24-md-offset-23 {margin-left: 95.83333333%}
    .hui-col-24-md-offset-22 {margin-left: 91.66666667%}
    .hui-col-24-md-offset-21 {margin-left: 87.5%}
    .hui-col-24-md-offset-20 {margin-left: 83.33333333%}
    .hui-col-24-md-offset-19 {margin-left: 79.16666667%}
    .hui-col-24-md-offset-18 {margin-left: 75%}
    .hui-col-24-md-offset-17 {margin-left: 70.83333333%}
    .hui-col-24-md-offset-16 {margin-left: 66.66666667%}
    .hui-col-24-md-offset-15 {margin-left: 62.5%}
    .hui-col-24-md-offset-14 {margin-left: 58.33333333%}
    .hui-col-24-md-offset-13 {margin-left: 54.16666667%}
    .hui-col-24-md-offset-12 {margin-left: 50%}
    .hui-col-24-md-offset-11 {margin-left: 45.83333333%}
    .hui-col-24-md-offset-10 {margin-left: 41.66666667%}
    .hui-col-24-md-offset-9 {margin-left: 37.5%}
    .hui-col-24-md-offset-8 {margin-left: 33.33333333%}
    .hui-col-24-md-offset-7 {margin-left: 29.16666667%}
    .hui-col-24-md-offset-6 {margin-left: 25%}
    .hui-col-24-md-offset-5 {margin-left: 20.83333333%}
    .hui-col-24-md-offset-4 {margin-left: 16.66666667%}
    .hui-col-24-md-offset-3 {margin-left: 12.5%}
    .hui-col-24-md-offset-2 {margin-left: 8.33333333%}
    .hui-col-24-md-offset-1 {margin-left: 4.16666667%}
    .hui-col-24-md-offset-0 {margin-left: 0}
  }
}
@media(min-width: 992px) {
  .hui-row-24 {
    .hui-col-24-lg-1, .hui-col-24-lg-2, .hui-col-24-lg-3, .hui-col-24-lg-4, .hui-col-24-lg-5, .hui-col-24-lg-6,
    .hui-col-24-lg-7, .hui-col-24-lg-8, .hui-col-24-lg-9, .hui-col-24-lg-10, .hui-col-24-lg-11, .hui-col-24-lg-12,
    .hui-col-24-lg-13, .hui-col-24-lg-14, .hui-col-24-lg-15, .hui-col-24-lg-16, .hui-col-24-lg-17, .hui-col-24-lg-18,
    .hui-col-24-lg-19, .hui-col-24-lg-20, .hui-col-24-lg-21, .hui-col-24-lg-22, .hui-col-24-lg-23, .hui-col-24-lg-24 {
      float: left;
    }
    .hui-col-24-lg-24 {width: 100%}
    .hui-col-24-lg-23 {width: 95.83333333%}
    .hui-col-24-lg-22 {width: 91.66666667%}

    .hui-col-24-lg-21 {width: 87.5%}
    .hui-col-24-lg-20 {width: 83.33333333%}
    .hui-col-24-lg-19 {width: 79.16666667%}

    .hui-col-24-lg-18 {width: 75%}
    .hui-col-24-lg-17 {width: 70.83333333%}
    .hui-col-24-lg-16 {width: 66.66666667%}

    .hui-col-24-lg-15 {width: 62.5%}
    .hui-col-24-lg-14 {width: 58.33333333%}
    .hui-col-24-lg-13 {width: 54.16666667%}

    .hui-col-24-lg-12 {width: 50%}
    .hui-col-24-lg-11 {width: 45.83333333%}
    .hui-col-24-lg-10 {width: 41.66666667%}

    .hui-col-24-lg-9  {width: 37.5%}
    .hui-col-24-lg-8  {width: 33.33333333%}
    .hui-col-24-lg-7  {width: 29.16666667%}

    .hui-col-24-lg-6  {width: 25%}
    .hui-col-24-lg-5  {width: 20.83333333%}
    .hui-col-24-lg-4  {width: 16.66666667%}

    .hui-col-24-lg-3  {width: 12.5%}
    .hui-col-24-lg-2  {width: 8.33333333%}
    .hui-col-24-lg-1  {width: 4.16666667%}

    .hui-col-24-lg-pull-24 {right: 100%}
    .hui-col-24-lg-pull-23 {right: 95.83333333%}
    .hui-col-24-lg-pull-22 {right: 91.66666667%}
    .hui-col-24-lg-pull-21 {right: 87.5%}
    .hui-col-24-lg-pull-20 {right: 83.33333333%}
    .hui-col-24-lg-pull-19 {right: 79.16666667%}
    .hui-col-24-lg-pull-18 {right: 75%}
    .hui-col-24-lg-pull-17 {right: 70.83333333%}
    .hui-col-24-lg-pull-16 {right: 66.66666667%}
    .hui-col-24-lg-pull-15 {right: 62.5%}
    .hui-col-24-lg-pull-14 {right: 58.33333333%}
    .hui-col-24-lg-pull-13 {right: 54.16666667%}
    .hui-col-24-lg-pull-12 {right: 50%}
    .hui-col-24-lg-pull-11 {right: 45.83333333%}
    .hui-col-24-lg-pull-10 {right: 41.66666667%}
    .hui-col-24-lg-pull-9 {right: 37.5%}
    .hui-col-24-lg-pull-8 {right: 33.33333333%}
    .hui-col-24-lg-pull-7 {right: 29.16666667%}
    .hui-col-24-lg-pull-6 {right: 25%}
    .hui-col-24-lg-pull-5 {right: 20.83333333%}
    .hui-col-24-lg-pull-4 {right: 16.66666667%}
    .hui-col-24-lg-pull-3 {right: 12.5%}
    .hui-col-24-lg-pull-2 {right: 8.33333333%}
    .hui-col-24-lg-pull-1 {right: 4.16666667%}
    .hui-col-24-lg-pull-0 {right: auto}

    .hui-col-24-lg-push-24 {left: 100%}
    .hui-col-24-lg-push-23 {left: 95.83333333%}
    .hui-col-24-lg-push-22 {left: 91.66666667%}
    .hui-col-24-lg-push-21 {left: 87.5%}
    .hui-col-24-lg-push-20 {left: 83.33333333%}
    .hui-col-24-lg-push-19 {left: 79.16666667%}
    .hui-col-24-lg-push-18 {left: 75%}
    .hui-col-24-lg-push-17 {left: 70.83333333%}
    .hui-col-24-lg-push-16 {left: 66.66666667%}
    .hui-col-24-lg-push-15 {left: 62.5%}
    .hui-col-24-lg-push-14 {left: 58.33333333%}
    .hui-col-24-lg-push-13 {left: 54.16666667%}
    .hui-col-24-lg-push-12 {left: 50%}
    .hui-col-24-lg-push-11 {left: 45.83333333%}
    .hui-col-24-lg-push-10 {left: 41.66666667%}
    .hui-col-24-lg-push-9 {left: 37.5%}
    .hui-col-24-lg-push-8 {left: 33.33333333%}
    .hui-col-24-lg-push-7 {left: 29.16666667%}
    .hui-col-24-lg-push-6 {left: 25%}
    .hui-col-24-lg-push-5 {left: 20.83333333%}
    .hui-col-24-lg-push-4 {left: 16.66666667%}
    .hui-col-24-lg-push-3 {left: 12.5%}
    .hui-col-24-lg-push-2 {left: 8.33333333%}
    .hui-col-24-lg-push-1 {left: 4.16666667%}
    .hui-col-24-lg-push-0 {left: auto}

    .hui-col-24-lg-offset-24 {margin-left: 100%}
    .hui-col-24-lg-offset-23 {margin-left: 95.83333333%}
    .hui-col-24-lg-offset-22 {margin-left: 91.66666667%}
    .hui-col-24-lg-offset-21 {margin-left: 87.5%}
    .hui-col-24-lg-offset-20 {margin-left: 83.33333333%}
    .hui-col-24-lg-offset-19 {margin-left: 79.16666667%}
    .hui-col-24-lg-offset-18 {margin-left: 75%}
    .hui-col-24-lg-offset-17 {margin-left: 70.83333333%}
    .hui-col-24-lg-offset-16 {margin-left: 66.66666667%}
    .hui-col-24-lg-offset-15 {margin-left: 62.5%}
    .hui-col-24-lg-offset-14 {margin-left: 58.33333333%}
    .hui-col-24-lg-offset-13 {margin-left: 54.16666667%}
    .hui-col-24-lg-offset-12 {margin-left: 50%}
    .hui-col-24-lg-offset-11 {margin-left: 45.83333333%}
    .hui-col-24-lg-offset-10 {margin-left: 41.66666667%}
    .hui-col-24-lg-offset-9 {margin-left: 37.5%}
    .hui-col-24-lg-offset-8 {margin-left: 33.33333333%}
    .hui-col-24-lg-offset-7 {margin-left: 29.16666667%}
    .hui-col-24-lg-offset-6 {margin-left: 25%}
    .hui-col-24-lg-offset-5 {margin-left: 20.83333333%}
    .hui-col-24-lg-offset-4 {margin-left: 16.66666667%}
    .hui-col-24-lg-offset-3 {margin-left: 12.5%}
    .hui-col-24-lg-offset-2 {margin-left: 8.33333333%}
    .hui-col-24-lg-offset-1 {margin-left: 4.16666667%}
    .hui-col-24-lg-offset-0 {margin-left: 0}
  }
}
@media(min-width: 1200px) {
  .hui-row-24 {
    .hui-col-24-xl-1, .hui-col-24-xl-2, .hui-col-24-xl-3, .hui-col-24-xl-4, .hui-col-24-xl-5, .hui-col-24-xl-6,
    .hui-col-24-xl-7, .hui-col-24-xl-8, .hui-col-24-xl-9, .hui-col-24-xl-10, .hui-col-24-xl-11, .hui-col-24-xl-12,
    .hui-col-24-xl-13, .hui-col-24-xl-14, .hui-col-24-xl-15, .hui-col-24-xl-16, .hui-col-24-xl-17, .hui-col-24-xl-18,
    .hui-col-24-xl-19, .hui-col-24-xl-20, .hui-col-24-xl-21, .hui-col-24-xl-22, .hui-col-24-xl-23, .hui-col-24-xl-24 {
      float: left;
    }
    .hui-col-24-xl-24 {width: 100%}
    .hui-col-24-xl-23 {width: 95.83333333%}
    .hui-col-24-xl-22 {width: 91.66666667%}

    .hui-col-24-xl-21 {width: 87.5%}
    .hui-col-24-xl-20 {width: 83.33333333%}
    .hui-col-24-xl-19 {width: 79.16666667%}

    .hui-col-24-xl-18 {width: 75%}
    .hui-col-24-xl-17 {width: 70.83333333%}
    .hui-col-24-xl-16 {width: 66.66666667%}

    .hui-col-24-xl-15 {width: 62.5%}
    .hui-col-24-xl-14 {width: 58.33333333%}
    .hui-col-24-xl-13 {width: 54.16666667%}

    .hui-col-24-xl-12 {width: 50%}
    .hui-col-24-xl-11 {width: 45.83333333%}
    .hui-col-24-xl-10 {width: 41.66666667%}

    .hui-col-24-xl-9  {width: 37.5%}
    .hui-col-24-xl-8  {width: 33.33333333%}
    .hui-col-24-xl-7  {width: 29.16666667%}

    .hui-col-24-xl-6  {width: 25%}
    .hui-col-24-xl-5  {width: 20.83333333%}
    .hui-col-24-xl-4  {width: 16.66666667%}

    .hui-col-24-xl-3  {width: 12.5%}
    .hui-col-24-xl-2  {width: 8.33333333%}
    .hui-col-24-xl-1  {width: 4.16666667%}

    .hui-col-24-xl-pull-24 {right: 100%}
    .hui-col-24-xl-pull-23 {right: 95.83333333%}
    .hui-col-24-xl-pull-22 {right: 91.66666667%}
    .hui-col-24-xl-pull-21 {right: 87.5%}
    .hui-col-24-xl-pull-20 {right: 83.33333333%}
    .hui-col-24-xl-pull-19 {right: 79.16666667%}
    .hui-col-24-xl-pull-18 {right: 75%}
    .hui-col-24-xl-pull-17 {right: 70.83333333%}
    .hui-col-24-xl-pull-16 {right: 66.66666667%}
    .hui-col-24-xl-pull-15 {right: 62.5%}
    .hui-col-24-xl-pull-14 {right: 58.33333333%}
    .hui-col-24-xl-pull-13 {right: 54.16666667%}
    .hui-col-24-xl-pull-12 {right: 50%}
    .hui-col-24-xl-pull-11 {right: 45.83333333%}
    .hui-col-24-xl-pull-10 {right: 41.66666667%}
    .hui-col-24-xl-pull-9 {right: 37.5%}
    .hui-col-24-xl-pull-8 {right: 33.33333333%}
    .hui-col-24-xl-pull-7 {right: 29.16666667%}
    .hui-col-24-xl-pull-6 {right: 25%}
    .hui-col-24-xl-pull-5 {right: 20.83333333%}
    .hui-col-24-xl-pull-4 {right: 16.66666667%}
    .hui-col-24-xl-pull-3 {right: 12.5%}
    .hui-col-24-xl-pull-2 {right: 8.33333333%}
    .hui-col-24-xl-pull-1 {right: 4.16666667%}
    .hui-col-24-xl-pull-0 {right: auto}

    .hui-col-24-xl-push-24 {left: 100%}
    .hui-col-24-xl-push-23 {left: 95.83333333%}
    .hui-col-24-xl-push-22 {left: 91.66666667%}
    .hui-col-24-xl-push-21 {left: 87.5%}
    .hui-col-24-xl-push-20 {left: 83.33333333%}
    .hui-col-24-xl-push-19 {left: 79.16666667%}
    .hui-col-24-xl-push-18 {left: 75%}
    .hui-col-24-xl-push-17 {left: 70.83333333%}
    .hui-col-24-xl-push-16 {left: 66.66666667%}
    .hui-col-24-xl-push-15 {left: 62.5%}
    .hui-col-24-xl-push-14 {left: 58.33333333%}
    .hui-col-24-xl-push-13 {left: 54.16666667%}
    .hui-col-24-xl-push-12 {left: 50%}
    .hui-col-24-xl-push-11 {left: 45.83333333%}
    .hui-col-24-xl-push-10 {left: 41.66666667%}
    .hui-col-24-xl-push-9 {left: 37.5%}
    .hui-col-24-xl-push-8 {left: 33.33333333%}
    .hui-col-24-xl-push-7 {left: 29.16666667%}
    .hui-col-24-xl-push-6 {left: 25%}
    .hui-col-24-xl-push-5 {left: 20.83333333%}
    .hui-col-24-xl-push-4 {left: 16.66666667%}
    .hui-col-24-xl-push-3 {left: 12.5%}
    .hui-col-24-xl-push-2 {left: 8.33333333%}
    .hui-col-24-xl-push-1 {left: 4.16666667%}
    .hui-col-24-xl-push-0 {left: auto}

    .hui-col-24-xl-offset-24 {margin-left: 100%}
    .hui-col-24-xl-offset-23 {margin-left: 95.83333333%}
    .hui-col-24-xl-offset-22 {margin-left: 91.66666667%}
    .hui-col-24-xl-offset-21 {margin-left: 87.5%}
    .hui-col-24-xl-offset-20 {margin-left: 83.33333333%}
    .hui-col-24-xl-offset-19 {margin-left: 79.16666667%}
    .hui-col-24-xl-offset-18 {margin-left: 75%}
    .hui-col-24-xl-offset-17 {margin-left: 70.83333333%}
    .hui-col-24-xl-offset-16 {margin-left: 66.66666667%}
    .hui-col-24-xl-offset-15 {margin-left: 62.5%}
    .hui-col-24-xl-offset-14 {margin-left: 58.33333333%}
    .hui-col-24-xl-offset-13 {margin-left: 54.16666667%}
    .hui-col-24-xl-offset-12 {margin-left: 50%}
    .hui-col-24-xl-offset-11 {margin-left: 45.83333333%}
    .hui-col-24-xl-offset-10 {margin-left: 41.66666667%}
    .hui-col-24-xl-offset-9 {margin-left: 37.5%}
    .hui-col-24-xl-offset-8 {margin-left: 33.33333333%}
    .hui-col-24-xl-offset-7 {margin-left: 29.16666667%}
    .hui-col-24-xl-offset-6 {margin-left: 25%}
    .hui-col-24-xl-offset-5 {margin-left: 20.83333333%}
    .hui-col-24-xl-offset-4 {margin-left: 16.66666667%}
    .hui-col-24-xl-offset-3 {margin-left: 12.5%}
    .hui-col-24-xl-offset-2 {margin-left: 8.33333333%}
    .hui-col-24-xl-offset-1 {margin-left: 4.16666667%}
    .hui-col-24-xl-offset-0 {margin-left: 0}
  }
}
@media(min-width: 1600px) {
  .hui-row-24 {
    .hui-col-24-xxl-1, .hui-col-24-xxl-2, .hui-col-24-xxl-3, .hui-col-24-xxl-4, .hui-col-24-xxl-5, .hui-col-24-xxl-6,
    .hui-col-24-xxl-7, .hui-col-24-xxl-8, .hui-col-24-xxl-9, .hui-col-24-xxl-10, .hui-col-24-xxl-11, .hui-col-24-xxl-12,
    .hui-col-24-xxl-13, .hui-col-24-xxl-14, .hui-col-24-xxl-15, .hui-col-24-xxl-16, .hui-col-24-xxl-17, .hui-col-24-xxl-18,
    .hui-col-24-xxl-19, .hui-col-24-xxl-20, .hui-col-24-xxl-21, .hui-col-24-xxl-22, .hui-col-24-xxl-23, .hui-col-24-xxl-24 {
      float: left;
    }
    .hui-col-24-xxl-24 {width: 100%}
    .hui-col-24-xxl-23 {width: 95.83333333%}
    .hui-col-24-xxl-22 {width: 91.66666667%}

    .hui-col-24-xxl-21 {width: 87.5%}
    .hui-col-24-xxl-20 {width: 83.33333333%}
    .hui-col-24-xxl-19 {width: 79.16666667%}

    .hui-col-24-xxl-18 {width: 75%}
    .hui-col-24-xxl-17 {width: 70.83333333%}
    .hui-col-24-xxl-16 {width: 66.66666667%}

    .hui-col-24-xxl-15 {width: 62.5%}
    .hui-col-24-xxl-14 {width: 58.33333333%}
    .hui-col-24-xxl-13 {width: 54.16666667%}

    .hui-col-24-xxl-12 {width: 50%}
    .hui-col-24-xxl-11 {width: 45.83333333%}
    .hui-col-24-xxl-10 {width: 41.66666667%}

    .hui-col-24-xxl-9  {width: 37.5%}
    .hui-col-24-xxl-8  {width: 33.33333333%}
    .hui-col-24-xxl-7  {width: 29.16666667%}

    .hui-col-24-xxl-6  {width: 25%}
    .hui-col-24-xxl-5  {width: 20.83333333%}
    .hui-col-24-xxl-4  {width: 16.66666667%}

    .hui-col-24-xxl-3  {width: 12.5%}
    .hui-col-24-xxl-2  {width: 8.33333333%}
    .hui-col-24-xxl-1  {width: 4.16666667%}

    .hui-col-24-xxl-pull-24 {right: 100%}
    .hui-col-24-xxl-pull-23 {right: 95.83333333%}
    .hui-col-24-xxl-pull-22 {right: 91.66666667%}
    .hui-col-24-xxl-pull-21 {right: 87.5%}
    .hui-col-24-xxl-pull-20 {right: 83.33333333%}
    .hui-col-24-xxl-pull-19 {right: 79.16666667%}
    .hui-col-24-xxl-pull-18 {right: 75%}
    .hui-col-24-xxl-pull-17 {right: 70.83333333%}
    .hui-col-24-xxl-pull-16 {right: 66.66666667%}
    .hui-col-24-xxl-pull-15 {right: 62.5%}
    .hui-col-24-xxl-pull-14 {right: 58.33333333%}
    .hui-col-24-xxl-pull-13 {right: 54.16666667%}
    .hui-col-24-xxl-pull-12 {right: 50%}
    .hui-col-24-xxl-pull-11 {right: 45.83333333%}
    .hui-col-24-xxl-pull-10 {right: 41.66666667%}
    .hui-col-24-xxl-pull-9 {right: 37.5%}
    .hui-col-24-xxl-pull-8 {right: 33.33333333%}
    .hui-col-24-xxl-pull-7 {right: 29.16666667%}
    .hui-col-24-xxl-pull-6 {right: 25%}
    .hui-col-24-xxl-pull-5 {right: 20.83333333%}
    .hui-col-24-xxl-pull-4 {right: 16.66666667%}
    .hui-col-24-xxl-pull-3 {right: 12.5%}
    .hui-col-24-xxl-pull-2 {right: 8.33333333%}
    .hui-col-24-xxl-pull-1 {right: 4.16666667%}
    .hui-col-24-xxl-pull-0 {right: auto}

    .hui-col-24-xxl-push-24 {left: 100%}
    .hui-col-24-xxl-push-23 {left: 95.83333333%}
    .hui-col-24-xxl-push-22 {left: 91.66666667%}
    .hui-col-24-xxl-push-21 {left: 87.5%}
    .hui-col-24-xxl-push-20 {left: 83.33333333%}
    .hui-col-24-xxl-push-19 {left: 79.16666667%}
    .hui-col-24-xxl-push-18 {left: 75%}
    .hui-col-24-xxl-push-17 {left: 70.83333333%}
    .hui-col-24-xxl-push-16 {left: 66.66666667%}
    .hui-col-24-xxl-push-15 {left: 62.5%}
    .hui-col-24-xxl-push-14 {left: 58.33333333%}
    .hui-col-24-xxl-push-13 {left: 54.16666667%}
    .hui-col-24-xxl-push-12 {left: 50%}
    .hui-col-24-xxl-push-11 {left: 45.83333333%}
    .hui-col-24-xxl-push-10 {left: 41.66666667%}
    .hui-col-24-xxl-push-9 {left: 37.5%}
    .hui-col-24-xxl-push-8 {left: 33.33333333%}
    .hui-col-24-xxl-push-7 {left: 29.16666667%}
    .hui-col-24-xxl-push-6 {left: 25%}
    .hui-col-24-xxl-push-5 {left: 20.83333333%}
    .hui-col-24-xxl-push-4 {left: 16.66666667%}
    .hui-col-24-xxl-push-3 {left: 12.5%}
    .hui-col-24-xxl-push-2 {left: 8.33333333%}
    .hui-col-24-xxl-push-1 {left: 4.16666667%}
    .hui-col-24-xxl-push-0 {left: auto}

    .hui-col-24-xxl-offset-24 {margin-left: 100%}
    .hui-col-24-xxl-offset-23 {margin-left: 95.83333333%}
    .hui-col-24-xxl-offset-22 {margin-left: 91.66666667%}
    .hui-col-24-xxl-offset-21 {margin-left: 87.5%}
    .hui-col-24-xxl-offset-20 {margin-left: 83.33333333%}
    .hui-col-24-xxl-offset-19 {margin-left: 79.16666667%}
    .hui-col-24-xxl-offset-18 {margin-left: 75%}
    .hui-col-24-xxl-offset-17 {margin-left: 70.83333333%}
    .hui-col-24-xxl-offset-16 {margin-left: 66.66666667%}
    .hui-col-24-xxl-offset-15 {margin-left: 62.5%}
    .hui-col-24-xxl-offset-14 {margin-left: 58.33333333%}
    .hui-col-24-xxl-offset-13 {margin-left: 54.16666667%}
    .hui-col-24-xxl-offset-12 {margin-left: 50%}
    .hui-col-24-xxl-offset-11 {margin-left: 45.83333333%}
    .hui-col-24-xxl-offset-10 {margin-left: 41.66666667%}
    .hui-col-24-xxl-offset-9 {margin-left: 37.5%}
    .hui-col-24-xxl-offset-8 {margin-left: 33.33333333%}
    .hui-col-24-xxl-offset-7 {margin-left: 29.16666667%}
    .hui-col-24-xxl-offset-6 {margin-left: 25%}
    .hui-col-24-xxl-offset-5 {margin-left: 20.83333333%}
    .hui-col-24-xxl-offset-4 {margin-left: 16.66666667%}
    .hui-col-24-xxl-offset-3 {margin-left: 12.5%}
    .hui-col-24-xxl-offset-2 {margin-left: 8.33333333%}
    .hui-col-24-xxl-offset-1 {margin-left: 4.16666667%}
    .hui-col-24-xxl-offset-0 {margin-left: 0}
  }
}

  /*2.2 栅格系统
  name:        hui-grid
  example:

  explain:    布局 栅格系统
*/
.hui-row {
  box-sizing: border-box;
  margin-left: -15px;
  margin-right: -15px;
  /*局部模块平分*/
}
.hui-row .hui-col-1, .hui-row .hui-col-2, .hui-row .hui-col-3, .hui-row .hui-col-4, .hui-row .hui-col-5, .hui-row .hui-col-6, .hui-row .hui-col-7, .hui-row .hui-col-8, .hui-row .hui-col-9, .hui-row .hui-col-10, .hui-row .hui-col-11, .hui-row .hui-col-12,
.hui-row .hui-col-xs-1, .hui-row .hui-col-sm-1, .hui-row .hui-col-md-1, .hui-row .hui-col-lg-1,
.hui-row .hui-col-xs-2, .hui-row .hui-col-sm-2, .hui-row .hui-col-md-2, .hui-row .hui-col-lg-2,
.hui-row .hui-col-xs-3, .hui-row .hui-col-sm-3, .hui-row .hui-col-md-3, .hui-row .hui-col-lg-3,
.hui-row .hui-col-xs-4, .hui-row .hui-col-sm-4, .hui-row .hui-col-md-4, .hui-row .hui-col-lg-4,
.hui-row .hui-col-xs-5, .hui-row .hui-col-sm-5, .hui-row .hui-col-md-5, .hui-row .hui-col-lg-5,
.hui-row .hui-col-xs-6, .hui-row .hui-col-sm-6, .hui-row .hui-col-md-6, .hui-row .hui-col-lg-6,
.hui-row .hui-col-xs-7, .hui-row .hui-col-sm-7, .hui-row .hui-col-md-7, .hui-row .hui-col-lg-7,
.hui-row .hui-col-xs-8, .hui-row .hui-col-sm-8, .hui-row .hui-col-md-8, .hui-row .hui-col-lg-8,
.hui-row .hui-col-xs-9, .hui-row .hui-col-sm-9, .hui-row .hui-col-md-9, .hui-row .hui-col-lg-9,
.hui-row .hui-col-xs-10, .hui-row .hui-col-sm-10, .hui-row .hui-col-md-10, .hui-row .hui-col-lg-10,
.hui-row .hui-col-xs-11, .hui-row .hui-col-sm-11, .hui-row .hui-col-md-11, .hui-row .hui-col-lg-11,
.hui-row .hui-col-xs-12, .hui-row .hui-col-sm-12, .hui-row .hui-col-md-12, .hui-row .hui-col-lg-12 {
  min-height: 1px;
  position: relative;
  padding-left: 15px;
  padding-right: 15px;
  box-sizing: border-box;
  transition: all 0.3s ease-in;
}
.hui-row .hui-col-1 {
  width: 8.33333%;
}
.hui-row .hui-col-2 {
  width: 16.66667%;
}
.hui-row .hui-col-3 {
  width: 25%;
}
.hui-row .hui-col-4 {
  width: 33.33333%;
}
.hui-row .hui-col-5 {
  width: 41.66667%;
}
.hui-row .hui-col-6 {
  width: 50%;
}
.hui-row .hui-col-7 {
  width: 58.33333%;
}
.hui-row .hui-col-8 {
  width: 66.66667%;
}
.hui-row .hui-col-9 {
  width: 75%;
}
.hui-row .hui-col-10 {
  width: 83.33333%;
}
.hui-row .hui-col-11 {
  width: 91.66667%;
}
.hui-row .hui-col-12 {
  width: 100%;
}
.hui-row .hui-col-offset-0 {
  margin-left: 0;
}
.hui-row .hui-col-offset-1 {
  margin-left: 8.33333%;
}
.hui-row .hui-col-offset-2 {
  margin-left: 16.66667%;
}
.hui-row .hui-col-offset-3 {
  margin-left: 25%;
}
.hui-row .hui-col-offset-4 {
  margin-left: 33.33333%;
}
.hui-row .hui-col-offset-5 {
  margin-left: 41.66667%;
}
.hui-row .hui-col-offset-6 {
  margin-left: 50%;
}
.hui-row .hui-col-offset-7 {
  margin-left: 58.33333%;
}
.hui-row .hui-col-offset-8 {
  margin-left: 66.66667%;
}
.hui-row .hui-col-offset-9 {
  margin-left: 75%;
}
.hui-row .hui-col-offset-10 {
  margin-left: 83.33333%;
}
.hui-row .hui-col-offset-11 {
  margin-left: 91.66667%;
}
.hui-row .hui-col-push-0 {
  position: relative;
  left: 0;
  right: auto;
}
.hui-row .hui-col-pull-0 {
  right: 0;
  left: auto;
}
.hui-row .hui-col-push-1 {
  left: 8.33333%;
  right: auto;
}
.hui-row .hui-col-pull-1 {
  right: 8.33333%;
  left: auto;
}
.hui-row .hui-col-push-2 {
  left: 16.66667%;
  right: auto;
}
.hui-row .hui-col-pull-2 {
  right: 16.66667%;
  left: auto;
}
.hui-row .hui-col-push-3 {
  left: 25%;
  right: auto;
}
.hui-row .hui-col-pull-3 {
  right: 25%;
  left: auto;
}
.hui-row .hui-col-push-4 {
  left: 33.33333%;
  right: auto;
}
.hui-row .hui-col-pull-4 {
  right: 33.33333%;
  left: auto;
}
.hui-row .hui-col-push-5 {
  left: 41.66667%;
  right: auto;
}
.hui-row .hui-col-pull-5 {
  right: 41.66667%;
  left: auto;
}
.hui-row .hui-col-push-6 {
  left: 50%;
  right: auto;
}
.hui-row .hui-col-pull-6 {
  right: 50%;
  left: auto;
}
.hui-row .hui-col-push-7 {
  left: 58.33333%;
  right: auto;
}
.hui-row .hui-col-pull-7 {
  right: 58.33333%;
  left: auto;
}
.hui-row .hui-col-push-8 {
  left: 66.66667%;
  right: auto;
}
.hui-row .hui-col-pull-8 {
  right: 66.66667%;
  left: auto;
}
.hui-row .hui-col-push-9 {
  left: 75%;
  right: auto;
}
.hui-row .hui-col-pull-9 {
  right: 75%;
  left: auto;
}
.hui-row .hui-col-push-10 {
  left: 83.33333%;
  right: auto;
}
.hui-row .hui-col-pull-10 {
  right: 83.33333%;
  left: auto;
}
.hui-row .hui-col-push-11 {
  left: 91.66667%;
  right: auto;
}
.hui-row .hui-col-pull-11 {
  right: 91.66667%;
  left: auto;
}
.hui-row .hui-col-1-1 {
  width: 100%;
}
.hui-row .hui-col-2-1 {
  width: 50%;
}
.hui-row .hui-col-3-1 {
  width: 33.333333%;
}
.hui-row .hui-col-3-2 {
  width: 66.666667%;
}
.hui-row .hui-col-4-1 {
  width: 25%;
}
.hui-row .hui-col-4-3 {
  width: 75%;
}
.hui-row .hui-col-5-1 {
  width: 20%;
}
.hui-row .hui-col-5-2 {
  width: 40%;
}
.hui-row .hui-col-5-3 {
  width: 60%;
}
.hui-row .hui-col-5-4 {
  width: 80%;
}
.hui-row .hui-col-6-1 {
  width: 16.666667%;
}
.hui-row .hui-col-6-5 {
  width: 83.333333%;
}
.hui-row .hui-col-xs-1, .hui-row .hui-col-xs-2, .hui-row .hui-col-xs-3, .hui-row .hui-col-xs-4, .hui-row .hui-col-xs-5, .hui-row .hui-col-xs-6, .hui-row .hui-col-xs-7, .hui-row .hui-col-xs-8, .hui-row .hui-col-xs-9, .hui-row .hui-col-xs-10, .hui-row .hui-col-xs-11, .hui-row .hui-col-xs-12 {
  float: left;
}
.hui-row .hui-col-xs-12 {
  width: 100%;
}
.hui-row .hui-col-xs-11 {
  width: 91.66666667%;
}
.hui-row .hui-col-xs-10 {
  width: 83.33333333%;
}
.hui-row .hui-col-xs-9 {
  width: 75%;
}
.hui-row .hui-col-xs-8 {
  width: 66.66666667%;
}
.hui-row .hui-col-xs-7 {
  width: 58.33333333%;
}
.hui-row .hui-col-xs-6 {
  width: 50%;
}
.hui-row .hui-col-xs-5 {
  width: 41.66666667%;
}
.hui-row .hui-col-xs-4 {
  width: 33.33333333%;
}
.hui-row .hui-col-xs-3 {
  width: 25%;
}
.hui-row .hui-col-xs-2 {
  width: 16.66666667%;
}
.hui-row .hui-col-xs-1 {
  width: 8.33333333%;
}
.hui-row .hui-col-xs-pull-12 {
  right: 100%;
}
.hui-row .hui-col-xs-pull-11 {
  right: 91.66666667%;
}
.hui-row .hui-col-xs-pull-10 {
  right: 83.33333333%;
}
.hui-row .hui-col-xs-pull-9 {
  right: 75%;
}
.hui-row .hui-col-xs-pull-8 {
  right: 66.66666667%;
}
.hui-row .hui-col-xs-pull-7 {
  right: 58.33333333%;
}
.hui-row .hui-col-xs-pull-6 {
  right: 50%;
}
.hui-row .hui-col-xs-pull-5 {
  right: 41.66666667%;
}
.hui-row .hui-col-xs-pull-4 {
  right: 33.33333333%;
}
.hui-row .hui-col-xs-pull-3 {
  right: 25%;
}
.hui-row .hui-col-xs-pull-2 {
  right: 16.66666667%;
}
.hui-row .hui-col-xs-pull-1 {
  right: 8.33333333%;
}
.hui-row .hui-col-xs-pull-0 {
  right: auto;
}
.hui-row .hui-col-xs-push-12 {
  left: 100%;
}
.hui-row .hui-col-xs-push-11 {
  left: 91.66666667%;
}
.hui-row .hui-col-xs-push-10 {
  left: 83.33333333%;
}
.hui-row .hui-col-xs-push-9 {
  left: 75%;
}
.hui-row .hui-col-xs-push-8 {
  left: 66.66666667%;
}
.hui-row .hui-col-xs-push-7 {
  left: 58.33333333%;
}
.hui-row .hui-col-xs-push-6 {
  left: 50%;
}
.hui-row .hui-col-xs-push-5 {
  left: 41.66666667%;
}
.hui-row .hui-col-xs-push-4 {
  left: 33.33333333%;
}
.hui-row .hui-col-xs-push-3 {
  left: 25%;
}
.hui-row .hui-col-xs-push-2 {
  left: 16.66666667%;
}
.hui-row .hui-col-xs-push-1 {
  left: 8.33333333%;
}
.hui-row .hui-col-xs-push-0 {
  left: auto;
}
.hui-row .hui-col-xs-offset-12 {
  margin-left: 100%;
}
.hui-row .hui-col-xs-offset-11 {
  margin-left: 91.66666667%;
}
.hui-row .hui-col-xs-offset-10 {
  margin-left: 83.33333333%;
}
.hui-row .hui-col-xs-offset-9 {
  margin-left: 75%;
}
.hui-row .hui-col-xs-offset-8 {
  margin-left: 66.66666667%;
}
.hui-row .hui-col-xs-offset-7 {
  margin-left: 58.33333333%;
}
.hui-row .hui-col-xs-offset-6 {
  margin-left: 50%;
}
.hui-row .hui-col-xs-offset-5 {
  margin-left: 41.66666667%;
}
.hui-row .hui-col-xs-offset-4 {
  margin-left: 33.33333333%;
}
.hui-row .hui-col-xs-offset-3 {
  margin-left: 25%;
}
.hui-row .hui-col-xs-offset-2 {
  margin-left: 16.66666667%;
}
.hui-row .hui-col-xs-offset-1 {
  margin-left: 8.33333333%;
}
.hui-row .hui-col-xs-offset-0 {
  margin-left: 0;
}

@media (max-width: 767px) {
  .hui-row.responsive [class^=hui-col-],
.hui-row.responsive [class*=" hui-col-"] {
    float: none !important;
    width: auto !important;
  }
  .hui-row.responsive [class^=hui-col-offset-],
.hui-row.responsive [class*=" hui-col-offset-"] {
    margin-left: 0 !important;
  }
}
@media (min-width: 768px) {
  .hui-row .hui-col-sm-1,
.hui-row .hui-col-sm-10,
.hui-row .hui-col-sm-11,
.hui-row .hui-col-sm-12,
.hui-row .hui-col-sm-2,
.hui-row .hui-col-sm-3,
.hui-row .hui-col-sm-4,
.hui-row .hui-col-sm-5,
.hui-row .hui-col-sm-6,
.hui-row .hui-col-sm-7,
.hui-row .hui-col-sm-8,
.hui-row .hui-col-sm-9 {
    float: left;
  }
  .hui-row .hui-col-sm-12 {
    width: 100%;
  }
  .hui-row .hui-col-sm-11 {
    width: 91.6666666667%;
  }
  .hui-row .hui-col-sm-10 {
    width: 83.3333333333%;
  }
  .hui-row .hui-col-sm-9 {
    width: 75%;
  }
  .hui-row .hui-col-sm-8 {
    width: 66.6666666667%;
  }
  .hui-row .hui-col-sm-7 {
    width: 58.3333333333%;
  }
  .hui-row .hui-col-sm-6 {
    width: 50%;
  }
  .hui-row .hui-col-sm-5 {
    width: 41.6666666667%;
  }
  .hui-row .hui-col-sm-4 {
    width: 33.3333333333%;
  }
  .hui-row .hui-col-sm-3 {
    width: 25%;
  }
  .hui-row .hui-col-sm-2 {
    width: 16.6666666667%;
  }
  .hui-row .hui-col-sm-1 {
    width: 8.3333333333%;
  }
  .hui-row .hui-col-sm-pull-12 {
    right: 100%;
  }
  .hui-row .hui-col-sm-pull-11 {
    right: 91.6666666667%;
  }
  .hui-row .hui-col-sm-pull-10 {
    right: 83.3333333333%;
  }
  .hui-row .hui-col-sm-pull-9 {
    right: 75%;
  }
  .hui-row .hui-col-sm-pull-8 {
    right: 66.6666666667%;
  }
  .hui-row .hui-col-sm-pull-7 {
    right: 58.3333333333%;
  }
  .hui-row .hui-col-sm-pull-6 {
    right: 50%;
  }
  .hui-row .hui-col-sm-pull-5 {
    right: 41.6666666667%;
  }
  .hui-row .hui-col-sm-pull-4 {
    right: 33.3333333333%;
  }
  .hui-row .hui-col-sm-pull-3 {
    right: 25%;
  }
  .hui-row .hui-col-sm-pull-2 {
    right: 16.6666666667%;
  }
  .hui-row .hui-col-sm-pull-1 {
    right: 8.3333333333%;
  }
  .hui-row .hui-col-sm-pull-0 {
    right: 0;
  }
  .hui-row .hui-col-sm-push-12 {
    left: 100%;
  }
  .hui-row .hui-col-sm-push-11 {
    left: 91.6666666667%;
  }
  .hui-row .hui-col-sm-push-10 {
    left: 83.3333333333%;
  }
  .hui-row .hui-col-sm-push-9 {
    left: 75%;
  }
  .hui-row .hui-col-sm-push-8 {
    left: 66.6666666667%;
  }
  .hui-row .hui-col-sm-push-7 {
    left: 58.3333333333%;
  }
  .hui-row .hui-col-sm-push-6 {
    left: 50%;
  }
  .hui-row .hui-col-sm-push-5 {
    left: 41.6666666667%;
  }
  .hui-row .hui-col-sm-push-4 {
    left: 33.3333333333%;
  }
  .hui-row .hui-col-sm-push-3 {
    left: 25%;
  }
  .hui-row .hui-col-sm-push-2 {
    left: 16.6666666667%;
  }
  .hui-row .hui-col-sm-push-1 {
    left: 8.3333333333%;
  }
  .hui-row .hui-col-sm-push-0 {
    left: 0;
  }
  .hui-row .hui-col-sm-offset-12 {
    margin-left: 100%;
  }
  .hui-row .hui-col-sm-offset-11 {
    margin-left: 91.6666666667%;
  }
  .hui-row .hui-col-sm-offset-10 {
    margin-left: 83.3333333333%;
  }
  .hui-row .hui-col-sm-offset-9 {
    margin-left: 75%;
  }
  .hui-row .hui-col-sm-offset-8 {
    margin-left: 66.6666666667%;
  }
  .hui-row .hui-col-sm-offset-7 {
    margin-left: 58.3333333333%;
  }
  .hui-row .hui-col-sm-offset-6 {
    margin-left: 50%;
  }
  .hui-row .hui-col-sm-offset-5 {
    margin-left: 41.6666666667%;
  }
  .hui-row .hui-col-sm-offset-4 {
    margin-left: 33.3333333333%;
  }
  .hui-row .hui-col-sm-offset-3 {
    margin-left: 25%;
  }
  .hui-row .hui-col-sm-offset-2 {
    margin-left: 16.6666666667%;
  }
  .hui-row .hui-col-sm-offset-1 {
    margin-left: 8.3333333333%;
  }
  .hui-row .hui-col-sm-offset-0 {
    margin-left: 0;
  }
}
@media (min-width: 992px) {
  .hui-row .hui-col-md-1, .hui-row .hui-col-md-10, .hui-row .hui-col-md-11, .hui-row .hui-col-md-12, .hui-row .hui-col-md-2, .hui-row .hui-col-md-3, .hui-row .hui-col-md-4, .hui-row .hui-col-md-5, .hui-row .hui-col-md-6, .hui-row .hui-col-md-7, .hui-row .hui-col-md-8, .hui-row .hui-col-md-9 {
    float: left;
  }
  .hui-row .hui-col-md-12 {
    width: 100%;
  }
  .hui-row .hui-col-md-11 {
    width: 91.6666666667%;
  }
  .hui-row .hui-col-md-10 {
    width: 83.3333333333%;
  }
  .hui-row .hui-col-md-9 {
    width: 75%;
  }
  .hui-row .hui-col-md-8 {
    width: 66.6666666667%;
  }
  .hui-row .hui-col-md-7 {
    width: 58.3333333333%;
  }
  .hui-row .hui-col-md-6 {
    width: 50%;
  }
  .hui-row .hui-col-md-5 {
    width: 41.6666666667%;
  }
  .hui-row .hui-col-md-4 {
    width: 33.3333333333%;
  }
  .hui-row .hui-col-md-3 {
    width: 25%;
  }
  .hui-row .hui-col-md-2 {
    width: 16.6666666667%;
  }
  .hui-row .hui-col-md-1 {
    width: 8.3333333333%;
  }
  .hui-row .hui-col-md-pull-12 {
    right: 100%;
  }
  .hui-row .hui-col-md-pull-11 {
    right: 91.6666666667%;
  }
  .hui-row .hui-col-md-pull-10 {
    right: 83.3333333333%;
  }
  .hui-row .hui-col-md-pull-9 {
    right: 75%;
  }
  .hui-row .hui-col-md-pull-8 {
    right: 66.6666666667%;
  }
  .hui-row .hui-col-md-pull-7 {
    right: 58.3333333333%;
  }
  .hui-row .hui-col-md-pull-6 {
    right: 50%;
  }
  .hui-row .hui-col-md-pull-5 {
    right: 41.6666666667%;
  }
  .hui-row .hui-col-md-pull-4 {
    right: 33.3333333333%;
  }
  .hui-row .hui-col-md-pull-3 {
    right: 25%;
  }
  .hui-row .hui-col-md-pull-2 {
    right: 16.6666666667%;
  }
  .hui-row .hui-col-md-pull-1 {
    right: 8.3333333333%;
  }
  .hui-row .hui-col-md-pull-0 {
    right: 0;
  }
  .hui-row .hui-col-md-push-12 {
    left: 100%;
  }
  .hui-row .hui-col-md-push-11 {
    left: 91.6666666667%;
  }
  .hui-row .hui-col-md-push-10 {
    left: 83.3333333333%;
  }
  .hui-row .hui-col-md-push-9 {
    left: 75%;
  }
  .hui-row .hui-col-md-push-8 {
    left: 66.6666666667%;
  }
  .hui-row .hui-col-md-push-7 {
    left: 58.3333333333%;
  }
  .hui-row .hui-col-md-push-6 {
    left: 50%;
  }
  .hui-row .hui-col-md-push-5 {
    left: 41.6666666667%;
  }
  .hui-row .hui-col-md-push-4 {
    left: 33.3333333333%;
  }
  .hui-row .hui-col-md-push-3 {
    left: 25%;
  }
  .hui-row .hui-col-md-push-2 {
    left: 16.6666666667%;
  }
  .hui-row .hui-col-md-push-1 {
    left: 8.3333333333%;
  }
  .hui-row .hui-col-md-push-0 {
    left: 0;
  }
  .hui-row .hui-col-md-offset-12 {
    margin-left: 100%;
  }
  .hui-row .hui-col-md-offset-11 {
    margin-left: 91.6666666667%;
  }
  .hui-row .hui-col-md-offset-10 {
    margin-left: 83.3333333333%;
  }
  .hui-row .hui-col-md-offset-9 {
    margin-left: 75%;
  }
  .hui-row .hui-col-md-offset-8 {
    margin-left: 66.6666666667%;
  }
  .hui-row .hui-col-md-offset-7 {
    margin-left: 58.3333333333%;
  }
  .hui-row .hui-col-md-offset-6 {
    margin-left: 50%;
  }
  .hui-row .hui-col-md-offset-5 {
    margin-left: 41.6666666667%;
  }
  .hui-row .hui-col-md-offset-4 {
    margin-left: 33.3333333333%;
  }
  .hui-row .hui-col-md-offset-3 {
    margin-left: 25%;
  }
  .hui-row .hui-col-md-offset-2 {
    margin-left: 16.6666666667%;
  }
  .hui-row .hui-col-md-offset-1 {
    margin-left: 8.3333333333%;
  }
  .hui-row .hui-col-md-offset-0 {
    margin-left: 0;
  }
}
@media (min-width: 1200px) {
  .hui-row .hui-col-lg-1, .hui-row .hui-col-lg-10, .hui-row .hui-col-lg-11, .hui-row .hui-col-lg-12, .hui-row .hui-col-lg-2, .hui-row .hui-col-lg-3, .hui-row .hui-col-lg-4, .hui-row .hui-col-lg-5, .hui-row .hui-col-lg-6, .hui-row .hui-col-lg-7, .hui-row .hui-col-lg-8, .hui-row .hui-col-lg-9 {
    float: left;
  }
  .hui-row .hui-col-lg-12 {
    width: 100%;
  }
  .hui-row .hui-col-lg-11 {
    width: 91.6666666667%;
  }
  .hui-row .hui-col-lg-10 {
    width: 83.3333333333%;
  }
  .hui-row .hui-col-lg-9 {
    width: 75%;
  }
  .hui-row .hui-col-lg-8 {
    width: 66.6666666667%;
  }
  .hui-row .hui-col-lg-7 {
    width: 58.3333333333%;
  }
  .hui-row .hui-col-lg-6 {
    width: 50%;
  }
  .hui-row .hui-col-lg-5 {
    width: 41.6666666667%;
  }
  .hui-row .hui-col-lg-4 {
    width: 33.3333333333%;
  }
  .hui-row .hui-col-lg-3 {
    width: 25%;
  }
  .hui-row .hui-col-lg-2 {
    width: 16.6666666667%;
  }
  .hui-row .hui-col-lg-1 {
    width: 8.3333333333%;
  }
  .hui-row .hui-col-lg-pull-12 {
    right: 100%;
  }
  .hui-row .hui-col-lg-pull-11 {
    right: 91.6666666667%;
  }
  .hui-row .hui-col-lg-pull-10 {
    right: 83.3333333333%;
  }
  .hui-row .hui-col-lg-pull-9 {
    right: 75%;
  }
  .hui-row .hui-col-lg-pull-8 {
    right: 66.6666666667%;
  }
  .hui-row .hui-col-lg-pull-7 {
    right: 58.3333333333%;
  }
  .hui-row .hui-col-lg-pull-6 {
    right: 50%;
  }
  .hui-row .hui-col-lg-pull-5 {
    right: 41.6666666667%;
  }
  .hui-row .hui-col-lg-pull-4 {
    right: 33.3333333333%;
  }
  .hui-row .hui-col-lg-pull-3 {
    right: 25%;
  }
  .hui-row .hui-col-lg-pull-2 {
    right: 16.6666666667%;
  }
  .hui-row .hui-col-lg-pull-1 {
    right: 8.3333333333%;
  }
  .hui-row .hui-col-lg-pull-0 {
    right: 0;
  }
  .hui-row .hui-col-lg-push-12 {
    left: 100%;
  }
  .hui-row .hui-col-lg-push-11 {
    left: 91.6666666667%;
  }
  .hui-row .hui-col-lg-push-10 {
    left: 83.3333333333%;
  }
  .hui-row .hui-col-lg-push-9 {
    left: 75%;
  }
  .hui-row .hui-col-lg-push-8 {
    left: 66.6666666667%;
  }
  .hui-row .hui-col-lg-push-7 {
    left: 58.3333333333%;
  }
  .hui-row .hui-col-lg-push-6 {
    left: 50%;
  }
  .hui-row .hui-col-lg-push-5 {
    left: 41.6666666667%;
  }
  .hui-row .hui-col-lg-push-4 {
    left: 33.3333333333%;
  }
  .hui-row .hui-col-lg-push-3 {
    left: 25%;
  }
  .hui-row .hui-col-lg-push-2 {
    left: 16.6666666667%;
  }
  .hui-row .hui-col-lg-push-1 {
    left: 8.3333333333%;
  }
  .hui-row .hui-col-lg-push-0 {
    left: 0;
  }
  .hui-row .hui-col-lg-offset-12 {
    margin-left: 100%;
  }
  .hui-row .hui-col-lg-offset-11 {
    margin-left: 91.6666666667%;
  }
  .hui-row .hui-col-lg-offset-10 {
    margin-left: 83.3333333333%;
  }
  .hui-row .hui-col-lg-offset-9 {
    margin-left: 75%;
  }
  .hui-row .hui-col-lg-offset-8 {
    margin-left: 66.6666666667%;
  }
  .hui-row .hui-col-lg-offset-7 {
    margin-left: 58.3333333333%;
  }
  .hui-row .hui-col-lg-offset-6 {
    margin-left: 50%;
  }
  .hui-row .hui-col-lg-offset-5 {
    margin-left: 41.6666666667%;
  }
  .hui-row .hui-col-lg-offset-4 {
    margin-left: 33.3333333333%;
  }
  .hui-row .hui-col-lg-offset-3 {
    margin-left: 25%;
  }
  .hui-row .hui-col-lg-offset-2 {
    margin-left: 16.6666666667%;
  }
  .hui-row .hui-col-lg-offset-1 {
    margin-left: 8.3333333333%;
  }
  .hui-row .hui-col-lg-offset-0 {
    margin-left: 0;
  }
}
/* 24栅格 */
.hui-row-24 {
  position: relative;
  margin-left: 0;
  margin-right: 0;
  height: auto;
  zoom: 1;
  display: block;
  box-sizing: border-box;
}
.hui-row-24:before, .hui-row-24:after {
  content: " ";
  display: table;
}
.hui-row-24:after {
  clear: both;
  visibility: hidden;
  font-size: 0;
  height: 0;
}
.hui-row-24 .hui-col-24-1, .hui-row-24 .hui-col-24-xs-1, .hui-row-24 .hui-col-24-sm-1, .hui-row-24 .hui-col-24-md-1, .hui-row-24 .hui-col-24-lg-1, .hui-row-24 .hui-col-24-xl-1, .hui-row-24 .hui-col-24-xxl-1,
.hui-row-24 .hui-col-24-2, .hui-row-24 .hui-col-24-xs-2, .hui-row-24 .hui-col-24-sm-2, .hui-row-24 .hui-col-24-md-2, .hui-row-24 .hui-col-24-lg-2, .hui-row-24 .hui-col-24-xl-2, .hui-row-24 .hui-col-24-xxl-2,
.hui-row-24 .hui-col-24-3, .hui-row-24 .hui-col-24-xs-3, .hui-row-24 .hui-col-24-sm-3, .hui-row-24 .hui-col-24-md-3, .hui-row-24 .hui-col-24-lg-3, .hui-row-24 .hui-col-24-xl-3, .hui-row-24 .hui-col-24-xxl-3,
.hui-row-24 .hui-col-24-4, .hui-row-24 .hui-col-24-xs-4, .hui-row-24 .hui-col-24-sm-4, .hui-row-24 .hui-col-24-md-4, .hui-row-24 .hui-col-24-lg-4, .hui-row-24 .hui-col-24-xl-4, .hui-row-24 .hui-col-24-xxl-4,
.hui-row-24 .hui-col-24-5, .hui-row-24 .hui-col-24-xs-5, .hui-row-24 .hui-col-24-sm-5, .hui-row-24 .hui-col-24-md-5, .hui-row-24 .hui-col-24-lg-5, .hui-row-24 .hui-col-24-xl-5, .hui-row-24 .hui-col-24-xxl-5,
.hui-row-24 .hui-col-24-6, .hui-row-24 .hui-col-24-xs-6, .hui-row-24 .hui-col-24-sm-6, .hui-row-24 .hui-col-24-md-6, .hui-row-24 .hui-col-24-lg-6, .hui-row-24 .hui-col-24-xl-6, .hui-row-24 .hui-col-24-xxl-6,
.hui-row-24 .hui-col-24-7, .hui-row-24 .hui-col-24-xs-7, .hui-row-24 .hui-col-24-sm-7, .hui-row-24 .hui-col-24-md-7, .hui-row-24 .hui-col-24-lg-7, .hui-row-24 .hui-col-24-xl-7, .hui-row-24 .hui-col-24-xxl-7,
.hui-row-24 .hui-col-24-8, .hui-row-24 .hui-col-24-xs-8, .hui-row-24 .hui-col-24-sm-8, .hui-row-24 .hui-col-24-md-8, .hui-row-24 .hui-col-24-lg-8, .hui-row-24 .hui-col-24-xl-8, .hui-row-24 .hui-col-24-xxl-8,
.hui-row-24 .hui-col-24-9, .hui-row-24 .hui-col-24-xs-9, .hui-row-24 .hui-col-24-sm-9, .hui-row-24 .hui-col-24-md-9, .hui-row-24 .hui-col-24-lg-9, .hui-row-24 .hui-col-24-xl-9, .hui-row-24 .hui-col-24-xxl-9,
.hui-row-24 .hui-col-24-10, .hui-row-24 .hui-col-24-xs-10, .hui-row-24 .hui-col-24-sm-10, .hui-row-24 .hui-col-24-md-10, .hui-row-24 .hui-col-24-lg-10, .hui-row-24 .hui-col-24-xl-10, .hui-row-24 .hui-col-24-xxl-10,
.hui-row-24 .hui-col-24-11, .hui-row-24 .hui-col-24-xs-11, .hui-row-24 .hui-col-24-sm-11, .hui-row-24 .hui-col-24-md-11, .hui-row-24 .hui-col-24-lg-11, .hui-row-24 .hui-col-24-xl-11, .hui-row-24 .hui-col-24-xxl-11,
.hui-row-24 .hui-col-24-12, .hui-row-24 .hui-col-24-xs-12, .hui-row-24 .hui-col-24-sm-12, .hui-row-24 .hui-col-24-md-12, .hui-row-24 .hui-col-24-lg-12, .hui-row-24 .hui-col-24-xl-12, .hui-row-24 .hui-col-24-xxl-12,
.hui-row-24 .hui-col-24-13, .hui-row-24 .hui-col-24-xs-13, .hui-row-24 .hui-col-24-sm-13, .hui-row-24 .hui-col-24-md-13, .hui-row-24 .hui-col-24-lg-13, .hui-row-24 .hui-col-24-xl-13, .hui-row-24 .hui-col-24-xxl-13,
.hui-row-24 .hui-col-24-14, .hui-row-24 .hui-col-24-xs-14, .hui-row-24 .hui-col-24-sm-14, .hui-row-24 .hui-col-24-md-14, .hui-row-24 .hui-col-24-lg-14, .hui-row-24 .hui-col-24-xl-14, .hui-row-24 .hui-col-24-xxl-14,
.hui-row-24 .hui-col-24-15, .hui-row-24 .hui-col-24-xs-15, .hui-row-24 .hui-col-24-sm-15, .hui-row-24 .hui-col-24-md-15, .hui-row-24 .hui-col-24-lg-15, .hui-row-24 .hui-col-24-xl-15, .hui-row-24 .hui-col-24-xxl-15,
.hui-row-24 .hui-col-24-16, .hui-row-24 .hui-col-24-xs-16, .hui-row-24 .hui-col-24-sm-16, .hui-row-24 .hui-col-24-md-16, .hui-row-24 .hui-col-24-lg-16, .hui-row-24 .hui-col-24-xl-16, .hui-row-24 .hui-col-24-xxl-16,
.hui-row-24 .hui-col-24-17, .hui-row-24 .hui-col-24-xs-17, .hui-row-24 .hui-col-24-sm-17, .hui-row-24 .hui-col-24-md-17, .hui-row-24 .hui-col-24-lg-17, .hui-row-24 .hui-col-24-xl-17, .hui-row-24 .hui-col-24-xxl-17,
.hui-row-24 .hui-col-24-18, .hui-row-24 .hui-col-24-xs-18, .hui-row-24 .hui-col-24-sm-18, .hui-row-24 .hui-col-24-md-18, .hui-row-24 .hui-col-24-lg-18, .hui-row-24 .hui-col-24-xl-18, .hui-row-24 .hui-col-24-xxl-18,
.hui-row-24 .hui-col-24-19, .hui-row-24 .hui-col-24-xs-19, .hui-row-24 .hui-col-24-sm-19, .hui-row-24 .hui-col-24-md-19, .hui-row-24 .hui-col-24-lg-19, .hui-row-24 .hui-col-24-xl-19, .hui-row-24 .hui-col-24-xxl-19,
.hui-row-24 .hui-col-24-20, .hui-row-24 .hui-col-24-xs-20, .hui-row-24 .hui-col-24-sm-20, .hui-row-24 .hui-col-24-md-20, .hui-row-24 .hui-col-24-lg-20, .hui-row-24 .hui-col-24-xl-20, .hui-row-24 .hui-col-24-xxl-20,
.hui-row-24 .hui-col-24-21, .hui-row-24 .hui-col-24-xs-21, .hui-row-24 .hui-col-24-sm-21, .hui-row-24 .hui-col-24-md-21, .hui-row-24 .hui-col-24-lg-21, .hui-row-24 .hui-col-24-xl-21, .hui-row-24 .hui-col-24-xxl-21,
.hui-row-24 .hui-col-24-22, .hui-row-24 .hui-col-24-xs-22, .hui-row-24 .hui-col-24-sm-22, .hui-row-24 .hui-col-24-md-22, .hui-row-24 .hui-col-24-lg-22, .hui-row-24 .hui-col-24-xl-22, .hui-row-24 .hui-col-24-xxl-22,
.hui-row-24 .hui-col-24-23, .hui-row-24 .hui-col-24-xs-23, .hui-row-24 .hui-col-24-sm-23, .hui-row-24 .hui-col-24-md-23, .hui-row-24 .hui-col-24-lg-23, .hui-row-24 .hui-col-24-xl-23, .hui-row-24 .hui-col-24-xxl-23,
.hui-row-24 .hui-col-24-24, .hui-row-24 .hui-col-24-xs-24, .hui-row-24 .hui-col-24-sm-24, .hui-row-24 .hui-col-24-md-24, .hui-row-24 .hui-col-24-lg-24, .hui-row-24 .hui-col-24-xl-24, .hui-row-24 .hui-col-24-xxl-24 {
  position: relative;
  min-height: 1px;
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
  transition: all 0.3s ease-in;
}
.hui-row-24 .hui-col-24-xs-1, .hui-row-24 .hui-col-24-xs-2, .hui-row-24 .hui-col-24-xs-3, .hui-row-24 .hui-col-24-xs-4, .hui-row-24 .hui-col-24-xs-5, .hui-row-24 .hui-col-24-xs-6,
.hui-row-24 .hui-col-24-xs-7, .hui-row-24 .hui-col-24-xs-8, .hui-row-24 .hui-col-24-xs-9, .hui-row-24 .hui-col-24-xs-10, .hui-row-24 .hui-col-24-xs-11, .hui-row-24 .hui-col-24-xs-12,
.hui-row-24 .hui-col-24-xs-13, .hui-row-24 .hui-col-24-xs-14, .hui-row-24 .hui-col-24-xs-15, .hui-row-24 .hui-col-24-xs-16, .hui-row-24 .hui-col-24-xs-17, .hui-row-24 .hui-col-24-xs-18,
.hui-row-24 .hui-col-24-xs-19, .hui-row-24 .hui-col-24-xs-20, .hui-row-24 .hui-col-24-xs-21, .hui-row-24 .hui-col-24-xs-22, .hui-row-24 .hui-col-24-xs-23, .hui-row-24 .hui-col-24-xs-24 {
  float: left;
}
.hui-row-24 .hui-col-24-xs-24 {
  width: 100%;
}
.hui-row-24 .hui-col-24-xs-23 {
  width: 95.83333333%;
}
.hui-row-24 .hui-col-24-xs-22 {
  width: 91.66666667%;
}
.hui-row-24 .hui-col-24-xs-21 {
  width: 87.5%;
}
.hui-row-24 .hui-col-24-xs-20 {
  width: 83.33333333%;
}
.hui-row-24 .hui-col-24-xs-19 {
  width: 79.16666667%;
}
.hui-row-24 .hui-col-24-xs-18 {
  width: 75%;
}
.hui-row-24 .hui-col-24-xs-17 {
  width: 70.83333333%;
}
.hui-row-24 .hui-col-24-xs-16 {
  width: 66.66666667%;
}
.hui-row-24 .hui-col-24-xs-15 {
  width: 62.5%;
}
.hui-row-24 .hui-col-24-xs-14 {
  width: 58.33333333%;
}
.hui-row-24 .hui-col-24-xs-13 {
  width: 54.16666667%;
}
.hui-row-24 .hui-col-24-xs-12 {
  width: 50%;
}
.hui-row-24 .hui-col-24-xs-11 {
  width: 45.83333333%;
}
.hui-row-24 .hui-col-24-xs-10 {
  width: 41.66666667%;
}
.hui-row-24 .hui-col-24-xs-9 {
  width: 37.5%;
}
.hui-row-24 .hui-col-24-xs-8 {
  width: 33.33333333%;
}
.hui-row-24 .hui-col-24-xs-7 {
  width: 29.16666667%;
}
.hui-row-24 .hui-col-24-xs-6 {
  width: 25%;
}
.hui-row-24 .hui-col-24-xs-5 {
  width: 20.83333333%;
}
.hui-row-24 .hui-col-24-xs-4 {
  width: 16.66666667%;
}
.hui-row-24 .hui-col-24-xs-3 {
  width: 12.5%;
}
.hui-row-24 .hui-col-24-xs-2 {
  width: 8.33333333%;
}
.hui-row-24 .hui-col-24-xs-1 {
  width: 4.16666667%;
}
.hui-row-24 .hui-col-24-xs-pull-24 {
  right: 100%;
}
.hui-row-24 .hui-col-24-xs-pull-23 {
  right: 95.83333333%;
}
.hui-row-24 .hui-col-24-xs-pull-22 {
  right: 91.66666667%;
}
.hui-row-24 .hui-col-24-xs-pull-21 {
  right: 87.5%;
}
.hui-row-24 .hui-col-24-xs-pull-20 {
  right: 83.33333333%;
}
.hui-row-24 .hui-col-24-xs-pull-19 {
  right: 79.16666667%;
}
.hui-row-24 .hui-col-24-xs-pull-18 {
  right: 75%;
}
.hui-row-24 .hui-col-24-xs-pull-17 {
  right: 70.83333333%;
}
.hui-row-24 .hui-col-24-xs-pull-16 {
  right: 66.66666667%;
}
.hui-row-24 .hui-col-24-xs-pull-15 {
  right: 62.5%;
}
.hui-row-24 .hui-col-24-xs-pull-14 {
  right: 58.33333333%;
}
.hui-row-24 .hui-col-24-xs-pull-13 {
  right: 54.16666667%;
}
.hui-row-24 .hui-col-24-xs-pull-12 {
  right: 50%;
}
.hui-row-24 .hui-col-24-xs-pull-11 {
  right: 45.83333333%;
}
.hui-row-24 .hui-col-24-xs-pull-10 {
  right: 41.66666667%;
}
.hui-row-24 .hui-col-24-xs-pull-9 {
  right: 37.5%;
}
.hui-row-24 .hui-col-24-xs-pull-8 {
  right: 33.33333333%;
}
.hui-row-24 .hui-col-24-xs-pull-7 {
  right: 29.16666667%;
}
.hui-row-24 .hui-col-24-xs-pull-6 {
  right: 25%;
}
.hui-row-24 .hui-col-24-xs-pull-5 {
  right: 20.83333333%;
}
.hui-row-24 .hui-col-24-xs-pull-4 {
  right: 16.66666667%;
}
.hui-row-24 .hui-col-24-xs-pull-3 {
  right: 12.5%;
}
.hui-row-24 .hui-col-24-xs-pull-2 {
  right: 8.33333333%;
}
.hui-row-24 .hui-col-24-xs-pull-1 {
  right: 4.16666667%;
}
.hui-row-24 .hui-col-24-xs-pull-0 {
  right: auto;
}
.hui-row-24 .hui-col-24-xs-push-24 {
  left: 100%;
}
.hui-row-24 .hui-col-24-xs-push-23 {
  left: 95.83333333%;
}
.hui-row-24 .hui-col-24-xs-push-22 {
  left: 91.66666667%;
}
.hui-row-24 .hui-col-24-xs-push-21 {
  left: 87.5%;
}
.hui-row-24 .hui-col-24-xs-push-20 {
  left: 83.33333333%;
}
.hui-row-24 .hui-col-24-xs-push-19 {
  left: 79.16666667%;
}
.hui-row-24 .hui-col-24-xs-push-18 {
  left: 75%;
}
.hui-row-24 .hui-col-24-xs-push-17 {
  left: 70.83333333%;
}
.hui-row-24 .hui-col-24-xs-push-16 {
  left: 66.66666667%;
}
.hui-row-24 .hui-col-24-xs-push-15 {
  left: 62.5%;
}
.hui-row-24 .hui-col-24-xs-push-14 {
  left: 58.33333333%;
}
.hui-row-24 .hui-col-24-xs-push-13 {
  left: 54.16666667%;
}
.hui-row-24 .hui-col-24-xs-push-12 {
  left: 50%;
}
.hui-row-24 .hui-col-24-xs-push-11 {
  left: 45.83333333%;
}
.hui-row-24 .hui-col-24-xs-push-10 {
  left: 41.66666667%;
}
.hui-row-24 .hui-col-24-xs-push-9 {
  left: 37.5%;
}
.hui-row-24 .hui-col-24-xs-push-8 {
  left: 33.33333333%;
}
.hui-row-24 .hui-col-24-xs-push-7 {
  left: 29.16666667%;
}
.hui-row-24 .hui-col-24-xs-push-6 {
  left: 25%;
}
.hui-row-24 .hui-col-24-xs-push-5 {
  left: 20.83333333%;
}
.hui-row-24 .hui-col-24-xs-push-4 {
  left: 16.66666667%;
}
.hui-row-24 .hui-col-24-xs-push-3 {
  left: 12.5%;
}
.hui-row-24 .hui-col-24-xs-push-2 {
  left: 8.33333333%;
}
.hui-row-24 .hui-col-24-xs-push-1 {
  left: 4.16666667%;
}
.hui-row-24 .hui-col-24-xs-push-0 {
  left: auto;
}
.hui-row-24 .hui-col-24-xs-offset-24 {
  margin-left: 100%;
}
.hui-row-24 .hui-col-24-xs-offset-23 {
  margin-left: 95.83333333%;
}
.hui-row-24 .hui-col-24-xs-offset-22 {
  margin-left: 91.66666667%;
}
.hui-row-24 .hui-col-24-xs-offset-21 {
  margin-left: 87.5%;
}
.hui-row-24 .hui-col-24-xs-offset-20 {
  margin-left: 83.33333333%;
}
.hui-row-24 .hui-col-24-xs-offset-19 {
  margin-left: 79.16666667%;
}
.hui-row-24 .hui-col-24-xs-offset-18 {
  margin-left: 75%;
}
.hui-row-24 .hui-col-24-xs-offset-17 {
  margin-left: 70.83333333%;
}
.hui-row-24 .hui-col-24-xs-offset-16 {
  margin-left: 66.66666667%;
}
.hui-row-24 .hui-col-24-xs-offset-15 {
  margin-left: 62.5%;
}
.hui-row-24 .hui-col-24-xs-offset-14 {
  margin-left: 58.33333333%;
}
.hui-row-24 .hui-col-24-xs-offset-13 {
  margin-left: 54.16666667%;
}
.hui-row-24 .hui-col-24-xs-offset-12 {
  margin-left: 50%;
}
.hui-row-24 .hui-col-24-xs-offset-11 {
  margin-left: 45.83333333%;
}
.hui-row-24 .hui-col-24-xs-offset-10 {
  margin-left: 41.66666667%;
}
.hui-row-24 .hui-col-24-xs-offset-9 {
  margin-left: 37.5%;
}
.hui-row-24 .hui-col-24-xs-offset-8 {
  margin-left: 33.33333333%;
}
.hui-row-24 .hui-col-24-xs-offset-7 {
  margin-left: 29.16666667%;
}
.hui-row-24 .hui-col-24-xs-offset-6 {
  margin-left: 25%;
}
.hui-row-24 .hui-col-24-xs-offset-5 {
  margin-left: 20.83333333%;
}
.hui-row-24 .hui-col-24-xs-offset-4 {
  margin-left: 16.66666667%;
}
.hui-row-24 .hui-col-24-xs-offset-3 {
  margin-left: 12.5%;
}
.hui-row-24 .hui-col-24-xs-offset-2 {
  margin-left: 8.33333333%;
}
.hui-row-24 .hui-col-24-xs-offset-1 {
  margin-left: 4.16666667%;
}
.hui-row-24 .hui-col-24-xs-offset-0 {
  margin-left: 0;
}

@media (min-width: 676px) {
  .hui-row-24 .hui-col-24-sm-1, .hui-row-24 .hui-col-24-sm-2, .hui-row-24 .hui-col-24-sm-3, .hui-row-24 .hui-col-24-sm-4, .hui-row-24 .hui-col-24-sm-5, .hui-row-24 .hui-col-24-sm-6,
.hui-row-24 .hui-col-24-sm-7, .hui-row-24 .hui-col-24-sm-8, .hui-row-24 .hui-col-24-sm-9, .hui-row-24 .hui-col-24-sm-10, .hui-row-24 .hui-col-24-sm-11, .hui-row-24 .hui-col-24-sm-12,
.hui-row-24 .hui-col-24-sm-13, .hui-row-24 .hui-col-24-sm-14, .hui-row-24 .hui-col-24-sm-15, .hui-row-24 .hui-col-24-sm-16, .hui-row-24 .hui-col-24-sm-17, .hui-row-24 .hui-col-24-sm-18,
.hui-row-24 .hui-col-24-sm-19, .hui-row-24 .hui-col-24-sm-20, .hui-row-24 .hui-col-24-sm-21, .hui-row-24 .hui-col-24-sm-22, .hui-row-24 .hui-col-24-sm-23, .hui-row-24 .hui-col-24-sm-24 {
    float: left;
  }
  .hui-row-24 .hui-col-24-sm-24 {
    width: 100%;
  }
  .hui-row-24 .hui-col-24-sm-23 {
    width: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-sm-22 {
    width: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-sm-21 {
    width: 87.5%;
  }
  .hui-row-24 .hui-col-24-sm-20 {
    width: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-sm-19 {
    width: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-sm-18 {
    width: 75%;
  }
  .hui-row-24 .hui-col-24-sm-17 {
    width: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-sm-16 {
    width: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-sm-15 {
    width: 62.5%;
  }
  .hui-row-24 .hui-col-24-sm-14 {
    width: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-sm-13 {
    width: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-sm-12 {
    width: 50%;
  }
  .hui-row-24 .hui-col-24-sm-11 {
    width: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-sm-10 {
    width: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-sm-9 {
    width: 37.5%;
  }
  .hui-row-24 .hui-col-24-sm-8 {
    width: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-sm-7 {
    width: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-sm-6 {
    width: 25%;
  }
  .hui-row-24 .hui-col-24-sm-5 {
    width: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-sm-4 {
    width: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-sm-3 {
    width: 12.5%;
  }
  .hui-row-24 .hui-col-24-sm-2 {
    width: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-sm-1 {
    width: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-sm-pull-24 {
    right: 100%;
  }
  .hui-row-24 .hui-col-24-sm-pull-23 {
    right: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-sm-pull-22 {
    right: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-sm-pull-21 {
    right: 87.5%;
  }
  .hui-row-24 .hui-col-24-sm-pull-20 {
    right: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-sm-pull-19 {
    right: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-sm-pull-18 {
    right: 75%;
  }
  .hui-row-24 .hui-col-24-sm-pull-17 {
    right: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-sm-pull-16 {
    right: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-sm-pull-15 {
    right: 62.5%;
  }
  .hui-row-24 .hui-col-24-sm-pull-14 {
    right: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-sm-pull-13 {
    right: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-sm-pull-12 {
    right: 50%;
  }
  .hui-row-24 .hui-col-24-sm-pull-11 {
    right: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-sm-pull-10 {
    right: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-sm-pull-9 {
    right: 37.5%;
  }
  .hui-row-24 .hui-col-24-sm-pull-8 {
    right: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-sm-pull-7 {
    right: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-sm-pull-6 {
    right: 25%;
  }
  .hui-row-24 .hui-col-24-sm-pull-5 {
    right: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-sm-pull-4 {
    right: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-sm-pull-3 {
    right: 12.5%;
  }
  .hui-row-24 .hui-col-24-sm-pull-2 {
    right: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-sm-pull-1 {
    right: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-sm-pull-0 {
    right: auto;
  }
  .hui-row-24 .hui-col-24-sm-push-24 {
    left: 100%;
  }
  .hui-row-24 .hui-col-24-sm-push-23 {
    left: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-sm-push-22 {
    left: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-sm-push-21 {
    left: 87.5%;
  }
  .hui-row-24 .hui-col-24-sm-push-20 {
    left: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-sm-push-19 {
    left: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-sm-push-18 {
    left: 75%;
  }
  .hui-row-24 .hui-col-24-sm-push-17 {
    left: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-sm-push-16 {
    left: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-sm-push-15 {
    left: 62.5%;
  }
  .hui-row-24 .hui-col-24-sm-push-14 {
    left: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-sm-push-13 {
    left: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-sm-push-12 {
    left: 50%;
  }
  .hui-row-24 .hui-col-24-sm-push-11 {
    left: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-sm-push-10 {
    left: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-sm-push-9 {
    left: 37.5%;
  }
  .hui-row-24 .hui-col-24-sm-push-8 {
    left: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-sm-push-7 {
    left: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-sm-push-6 {
    left: 25%;
  }
  .hui-row-24 .hui-col-24-sm-push-5 {
    left: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-sm-push-4 {
    left: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-sm-push-3 {
    left: 12.5%;
  }
  .hui-row-24 .hui-col-24-sm-push-2 {
    left: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-sm-push-1 {
    left: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-sm-push-0 {
    left: auto;
  }
  .hui-row-24 .hui-col-24-sm-offset-24 {
    margin-left: 100%;
  }
  .hui-row-24 .hui-col-24-sm-offset-23 {
    margin-left: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-sm-offset-22 {
    margin-left: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-sm-offset-21 {
    margin-left: 87.5%;
  }
  .hui-row-24 .hui-col-24-sm-offset-20 {
    margin-left: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-sm-offset-19 {
    margin-left: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-sm-offset-18 {
    margin-left: 75%;
  }
  .hui-row-24 .hui-col-24-sm-offset-17 {
    margin-left: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-sm-offset-16 {
    margin-left: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-sm-offset-15 {
    margin-left: 62.5%;
  }
  .hui-row-24 .hui-col-24-sm-offset-14 {
    margin-left: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-sm-offset-13 {
    margin-left: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-sm-offset-12 {
    margin-left: 50%;
  }
  .hui-row-24 .hui-col-24-sm-offset-11 {
    margin-left: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-sm-offset-10 {
    margin-left: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-sm-offset-9 {
    margin-left: 37.5%;
  }
  .hui-row-24 .hui-col-24-sm-offset-8 {
    margin-left: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-sm-offset-7 {
    margin-left: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-sm-offset-6 {
    margin-left: 25%;
  }
  .hui-row-24 .hui-col-24-sm-offset-5 {
    margin-left: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-sm-offset-4 {
    margin-left: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-sm-offset-3 {
    margin-left: 12.5%;
  }
  .hui-row-24 .hui-col-24-sm-offset-2 {
    margin-left: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-sm-offset-1 {
    margin-left: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-sm-offset-0 {
    margin-left: 0;
  }
}
@media (min-width: 768px) {
  .hui-row-24 .hui-col-24-md-1, .hui-row-24 .hui-col-24-md-2, .hui-row-24 .hui-col-24-md-3, .hui-row-24 .hui-col-24-md-4, .hui-row-24 .hui-col-24-md-5, .hui-row-24 .hui-col-24-md-6,
.hui-row-24 .hui-col-24-md-7, .hui-row-24 .hui-col-24-md-8, .hui-row-24 .hui-col-24-md-9, .hui-row-24 .hui-col-24-md-10, .hui-row-24 .hui-col-24-md-11, .hui-row-24 .hui-col-24-md-12,
.hui-row-24 .hui-col-24-md-13, .hui-row-24 .hui-col-24-md-14, .hui-row-24 .hui-col-24-md-15, .hui-row-24 .hui-col-24-md-16, .hui-row-24 .hui-col-24-md-17, .hui-row-24 .hui-col-24-md-18,
.hui-row-24 .hui-col-24-md-19, .hui-row-24 .hui-col-24-md-20, .hui-row-24 .hui-col-24-md-21, .hui-row-24 .hui-col-24-md-22, .hui-row-24 .hui-col-24-md-23, .hui-row-24 .hui-col-24-md-24 {
    float: left;
  }
  .hui-row-24 .hui-col-24-md-24 {
    width: 100%;
  }
  .hui-row-24 .hui-col-24-md-23 {
    width: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-md-22 {
    width: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-md-21 {
    width: 87.5%;
  }
  .hui-row-24 .hui-col-24-md-20 {
    width: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-md-19 {
    width: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-md-18 {
    width: 75%;
  }
  .hui-row-24 .hui-col-24-md-17 {
    width: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-md-16 {
    width: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-md-15 {
    width: 62.5%;
  }
  .hui-row-24 .hui-col-24-md-14 {
    width: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-md-13 {
    width: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-md-12 {
    width: 50%;
  }
  .hui-row-24 .hui-col-24-md-11 {
    width: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-md-10 {
    width: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-md-9 {
    width: 37.5%;
  }
  .hui-row-24 .hui-col-24-md-8 {
    width: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-md-7 {
    width: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-md-6 {
    width: 25%;
  }
  .hui-row-24 .hui-col-24-md-5 {
    width: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-md-4 {
    width: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-md-3 {
    width: 12.5%;
  }
  .hui-row-24 .hui-col-24-md-2 {
    width: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-md-1 {
    width: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-md-pull-24 {
    right: 100%;
  }
  .hui-row-24 .hui-col-24-md-pull-23 {
    right: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-md-pull-22 {
    right: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-md-pull-21 {
    right: 87.5%;
  }
  .hui-row-24 .hui-col-24-md-pull-20 {
    right: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-md-pull-19 {
    right: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-md-pull-18 {
    right: 75%;
  }
  .hui-row-24 .hui-col-24-md-pull-17 {
    right: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-md-pull-16 {
    right: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-md-pull-15 {
    right: 62.5%;
  }
  .hui-row-24 .hui-col-24-md-pull-14 {
    right: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-md-pull-13 {
    right: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-md-pull-12 {
    right: 50%;
  }
  .hui-row-24 .hui-col-24-md-pull-11 {
    right: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-md-pull-10 {
    right: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-md-pull-9 {
    right: 37.5%;
  }
  .hui-row-24 .hui-col-24-md-pull-8 {
    right: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-md-pull-7 {
    right: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-md-pull-6 {
    right: 25%;
  }
  .hui-row-24 .hui-col-24-md-pull-5 {
    right: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-md-pull-4 {
    right: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-md-pull-3 {
    right: 12.5%;
  }
  .hui-row-24 .hui-col-24-md-pull-2 {
    right: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-md-pull-1 {
    right: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-md-pull-0 {
    right: auto;
  }
  .hui-row-24 .hui-col-24-md-push-24 {
    left: 100%;
  }
  .hui-row-24 .hui-col-24-md-push-23 {
    left: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-md-push-22 {
    left: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-md-push-21 {
    left: 87.5%;
  }
  .hui-row-24 .hui-col-24-md-push-20 {
    left: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-md-push-19 {
    left: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-md-push-18 {
    left: 75%;
  }
  .hui-row-24 .hui-col-24-md-push-17 {
    left: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-md-push-16 {
    left: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-md-push-15 {
    left: 62.5%;
  }
  .hui-row-24 .hui-col-24-md-push-14 {
    left: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-md-push-13 {
    left: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-md-push-12 {
    left: 50%;
  }
  .hui-row-24 .hui-col-24-md-push-11 {
    left: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-md-push-10 {
    left: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-md-push-9 {
    left: 37.5%;
  }
  .hui-row-24 .hui-col-24-md-push-8 {
    left: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-md-push-7 {
    left: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-md-push-6 {
    left: 25%;
  }
  .hui-row-24 .hui-col-24-md-push-5 {
    left: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-md-push-4 {
    left: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-md-push-3 {
    left: 12.5%;
  }
  .hui-row-24 .hui-col-24-md-push-2 {
    left: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-md-push-1 {
    left: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-md-push-0 {
    left: auto;
  }
  .hui-row-24 .hui-col-24-md-offset-24 {
    margin-left: 100%;
  }
  .hui-row-24 .hui-col-24-md-offset-23 {
    margin-left: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-md-offset-22 {
    margin-left: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-md-offset-21 {
    margin-left: 87.5%;
  }
  .hui-row-24 .hui-col-24-md-offset-20 {
    margin-left: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-md-offset-19 {
    margin-left: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-md-offset-18 {
    margin-left: 75%;
  }
  .hui-row-24 .hui-col-24-md-offset-17 {
    margin-left: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-md-offset-16 {
    margin-left: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-md-offset-15 {
    margin-left: 62.5%;
  }
  .hui-row-24 .hui-col-24-md-offset-14 {
    margin-left: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-md-offset-13 {
    margin-left: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-md-offset-12 {
    margin-left: 50%;
  }
  .hui-row-24 .hui-col-24-md-offset-11 {
    margin-left: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-md-offset-10 {
    margin-left: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-md-offset-9 {
    margin-left: 37.5%;
  }
  .hui-row-24 .hui-col-24-md-offset-8 {
    margin-left: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-md-offset-7 {
    margin-left: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-md-offset-6 {
    margin-left: 25%;
  }
  .hui-row-24 .hui-col-24-md-offset-5 {
    margin-left: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-md-offset-4 {
    margin-left: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-md-offset-3 {
    margin-left: 12.5%;
  }
  .hui-row-24 .hui-col-24-md-offset-2 {
    margin-left: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-md-offset-1 {
    margin-left: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-md-offset-0 {
    margin-left: 0;
  }
}
@media (min-width: 992px) {
  .hui-row-24 .hui-col-24-lg-1, .hui-row-24 .hui-col-24-lg-2, .hui-row-24 .hui-col-24-lg-3, .hui-row-24 .hui-col-24-lg-4, .hui-row-24 .hui-col-24-lg-5, .hui-row-24 .hui-col-24-lg-6,
.hui-row-24 .hui-col-24-lg-7, .hui-row-24 .hui-col-24-lg-8, .hui-row-24 .hui-col-24-lg-9, .hui-row-24 .hui-col-24-lg-10, .hui-row-24 .hui-col-24-lg-11, .hui-row-24 .hui-col-24-lg-12,
.hui-row-24 .hui-col-24-lg-13, .hui-row-24 .hui-col-24-lg-14, .hui-row-24 .hui-col-24-lg-15, .hui-row-24 .hui-col-24-lg-16, .hui-row-24 .hui-col-24-lg-17, .hui-row-24 .hui-col-24-lg-18,
.hui-row-24 .hui-col-24-lg-19, .hui-row-24 .hui-col-24-lg-20, .hui-row-24 .hui-col-24-lg-21, .hui-row-24 .hui-col-24-lg-22, .hui-row-24 .hui-col-24-lg-23, .hui-row-24 .hui-col-24-lg-24 {
    float: left;
  }
  .hui-row-24 .hui-col-24-lg-24 {
    width: 100%;
  }
  .hui-row-24 .hui-col-24-lg-23 {
    width: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-lg-22 {
    width: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-lg-21 {
    width: 87.5%;
  }
  .hui-row-24 .hui-col-24-lg-20 {
    width: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-lg-19 {
    width: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-lg-18 {
    width: 75%;
  }
  .hui-row-24 .hui-col-24-lg-17 {
    width: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-lg-16 {
    width: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-lg-15 {
    width: 62.5%;
  }
  .hui-row-24 .hui-col-24-lg-14 {
    width: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-lg-13 {
    width: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-lg-12 {
    width: 50%;
  }
  .hui-row-24 .hui-col-24-lg-11 {
    width: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-lg-10 {
    width: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-lg-9 {
    width: 37.5%;
  }
  .hui-row-24 .hui-col-24-lg-8 {
    width: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-lg-7 {
    width: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-lg-6 {
    width: 25%;
  }
  .hui-row-24 .hui-col-24-lg-5 {
    width: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-lg-4 {
    width: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-lg-3 {
    width: 12.5%;
  }
  .hui-row-24 .hui-col-24-lg-2 {
    width: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-lg-1 {
    width: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-lg-pull-24 {
    right: 100%;
  }
  .hui-row-24 .hui-col-24-lg-pull-23 {
    right: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-lg-pull-22 {
    right: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-lg-pull-21 {
    right: 87.5%;
  }
  .hui-row-24 .hui-col-24-lg-pull-20 {
    right: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-lg-pull-19 {
    right: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-lg-pull-18 {
    right: 75%;
  }
  .hui-row-24 .hui-col-24-lg-pull-17 {
    right: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-lg-pull-16 {
    right: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-lg-pull-15 {
    right: 62.5%;
  }
  .hui-row-24 .hui-col-24-lg-pull-14 {
    right: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-lg-pull-13 {
    right: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-lg-pull-12 {
    right: 50%;
  }
  .hui-row-24 .hui-col-24-lg-pull-11 {
    right: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-lg-pull-10 {
    right: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-lg-pull-9 {
    right: 37.5%;
  }
  .hui-row-24 .hui-col-24-lg-pull-8 {
    right: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-lg-pull-7 {
    right: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-lg-pull-6 {
    right: 25%;
  }
  .hui-row-24 .hui-col-24-lg-pull-5 {
    right: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-lg-pull-4 {
    right: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-lg-pull-3 {
    right: 12.5%;
  }
  .hui-row-24 .hui-col-24-lg-pull-2 {
    right: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-lg-pull-1 {
    right: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-lg-pull-0 {
    right: auto;
  }
  .hui-row-24 .hui-col-24-lg-push-24 {
    left: 100%;
  }
  .hui-row-24 .hui-col-24-lg-push-23 {
    left: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-lg-push-22 {
    left: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-lg-push-21 {
    left: 87.5%;
  }
  .hui-row-24 .hui-col-24-lg-push-20 {
    left: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-lg-push-19 {
    left: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-lg-push-18 {
    left: 75%;
  }
  .hui-row-24 .hui-col-24-lg-push-17 {
    left: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-lg-push-16 {
    left: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-lg-push-15 {
    left: 62.5%;
  }
  .hui-row-24 .hui-col-24-lg-push-14 {
    left: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-lg-push-13 {
    left: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-lg-push-12 {
    left: 50%;
  }
  .hui-row-24 .hui-col-24-lg-push-11 {
    left: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-lg-push-10 {
    left: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-lg-push-9 {
    left: 37.5%;
  }
  .hui-row-24 .hui-col-24-lg-push-8 {
    left: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-lg-push-7 {
    left: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-lg-push-6 {
    left: 25%;
  }
  .hui-row-24 .hui-col-24-lg-push-5 {
    left: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-lg-push-4 {
    left: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-lg-push-3 {
    left: 12.5%;
  }
  .hui-row-24 .hui-col-24-lg-push-2 {
    left: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-lg-push-1 {
    left: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-lg-push-0 {
    left: auto;
  }
  .hui-row-24 .hui-col-24-lg-offset-24 {
    margin-left: 100%;
  }
  .hui-row-24 .hui-col-24-lg-offset-23 {
    margin-left: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-lg-offset-22 {
    margin-left: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-lg-offset-21 {
    margin-left: 87.5%;
  }
  .hui-row-24 .hui-col-24-lg-offset-20 {
    margin-left: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-lg-offset-19 {
    margin-left: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-lg-offset-18 {
    margin-left: 75%;
  }
  .hui-row-24 .hui-col-24-lg-offset-17 {
    margin-left: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-lg-offset-16 {
    margin-left: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-lg-offset-15 {
    margin-left: 62.5%;
  }
  .hui-row-24 .hui-col-24-lg-offset-14 {
    margin-left: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-lg-offset-13 {
    margin-left: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-lg-offset-12 {
    margin-left: 50%;
  }
  .hui-row-24 .hui-col-24-lg-offset-11 {
    margin-left: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-lg-offset-10 {
    margin-left: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-lg-offset-9 {
    margin-left: 37.5%;
  }
  .hui-row-24 .hui-col-24-lg-offset-8 {
    margin-left: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-lg-offset-7 {
    margin-left: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-lg-offset-6 {
    margin-left: 25%;
  }
  .hui-row-24 .hui-col-24-lg-offset-5 {
    margin-left: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-lg-offset-4 {
    margin-left: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-lg-offset-3 {
    margin-left: 12.5%;
  }
  .hui-row-24 .hui-col-24-lg-offset-2 {
    margin-left: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-lg-offset-1 {
    margin-left: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-lg-offset-0 {
    margin-left: 0;
  }
}
@media (min-width: 1200px) {
  .hui-row-24 .hui-col-24-xl-1, .hui-row-24 .hui-col-24-xl-2, .hui-row-24 .hui-col-24-xl-3, .hui-row-24 .hui-col-24-xl-4, .hui-row-24 .hui-col-24-xl-5, .hui-row-24 .hui-col-24-xl-6,
.hui-row-24 .hui-col-24-xl-7, .hui-row-24 .hui-col-24-xl-8, .hui-row-24 .hui-col-24-xl-9, .hui-row-24 .hui-col-24-xl-10, .hui-row-24 .hui-col-24-xl-11, .hui-row-24 .hui-col-24-xl-12,
.hui-row-24 .hui-col-24-xl-13, .hui-row-24 .hui-col-24-xl-14, .hui-row-24 .hui-col-24-xl-15, .hui-row-24 .hui-col-24-xl-16, .hui-row-24 .hui-col-24-xl-17, .hui-row-24 .hui-col-24-xl-18,
.hui-row-24 .hui-col-24-xl-19, .hui-row-24 .hui-col-24-xl-20, .hui-row-24 .hui-col-24-xl-21, .hui-row-24 .hui-col-24-xl-22, .hui-row-24 .hui-col-24-xl-23, .hui-row-24 .hui-col-24-xl-24 {
    float: left;
  }
  .hui-row-24 .hui-col-24-xl-24 {
    width: 100%;
  }
  .hui-row-24 .hui-col-24-xl-23 {
    width: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-xl-22 {
    width: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-xl-21 {
    width: 87.5%;
  }
  .hui-row-24 .hui-col-24-xl-20 {
    width: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-xl-19 {
    width: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-xl-18 {
    width: 75%;
  }
  .hui-row-24 .hui-col-24-xl-17 {
    width: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-xl-16 {
    width: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-xl-15 {
    width: 62.5%;
  }
  .hui-row-24 .hui-col-24-xl-14 {
    width: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-xl-13 {
    width: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-xl-12 {
    width: 50%;
  }
  .hui-row-24 .hui-col-24-xl-11 {
    width: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-xl-10 {
    width: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-xl-9 {
    width: 37.5%;
  }
  .hui-row-24 .hui-col-24-xl-8 {
    width: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-xl-7 {
    width: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-xl-6 {
    width: 25%;
  }
  .hui-row-24 .hui-col-24-xl-5 {
    width: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-xl-4 {
    width: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-xl-3 {
    width: 12.5%;
  }
  .hui-row-24 .hui-col-24-xl-2 {
    width: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-xl-1 {
    width: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-xl-pull-24 {
    right: 100%;
  }
  .hui-row-24 .hui-col-24-xl-pull-23 {
    right: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-xl-pull-22 {
    right: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-xl-pull-21 {
    right: 87.5%;
  }
  .hui-row-24 .hui-col-24-xl-pull-20 {
    right: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-xl-pull-19 {
    right: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-xl-pull-18 {
    right: 75%;
  }
  .hui-row-24 .hui-col-24-xl-pull-17 {
    right: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-xl-pull-16 {
    right: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-xl-pull-15 {
    right: 62.5%;
  }
  .hui-row-24 .hui-col-24-xl-pull-14 {
    right: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-xl-pull-13 {
    right: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-xl-pull-12 {
    right: 50%;
  }
  .hui-row-24 .hui-col-24-xl-pull-11 {
    right: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-xl-pull-10 {
    right: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-xl-pull-9 {
    right: 37.5%;
  }
  .hui-row-24 .hui-col-24-xl-pull-8 {
    right: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-xl-pull-7 {
    right: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-xl-pull-6 {
    right: 25%;
  }
  .hui-row-24 .hui-col-24-xl-pull-5 {
    right: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-xl-pull-4 {
    right: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-xl-pull-3 {
    right: 12.5%;
  }
  .hui-row-24 .hui-col-24-xl-pull-2 {
    right: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-xl-pull-1 {
    right: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-xl-pull-0 {
    right: auto;
  }
  .hui-row-24 .hui-col-24-xl-push-24 {
    left: 100%;
  }
  .hui-row-24 .hui-col-24-xl-push-23 {
    left: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-xl-push-22 {
    left: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-xl-push-21 {
    left: 87.5%;
  }
  .hui-row-24 .hui-col-24-xl-push-20 {
    left: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-xl-push-19 {
    left: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-xl-push-18 {
    left: 75%;
  }
  .hui-row-24 .hui-col-24-xl-push-17 {
    left: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-xl-push-16 {
    left: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-xl-push-15 {
    left: 62.5%;
  }
  .hui-row-24 .hui-col-24-xl-push-14 {
    left: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-xl-push-13 {
    left: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-xl-push-12 {
    left: 50%;
  }
  .hui-row-24 .hui-col-24-xl-push-11 {
    left: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-xl-push-10 {
    left: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-xl-push-9 {
    left: 37.5%;
  }
  .hui-row-24 .hui-col-24-xl-push-8 {
    left: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-xl-push-7 {
    left: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-xl-push-6 {
    left: 25%;
  }
  .hui-row-24 .hui-col-24-xl-push-5 {
    left: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-xl-push-4 {
    left: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-xl-push-3 {
    left: 12.5%;
  }
  .hui-row-24 .hui-col-24-xl-push-2 {
    left: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-xl-push-1 {
    left: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-xl-push-0 {
    left: auto;
  }
  .hui-row-24 .hui-col-24-xl-offset-24 {
    margin-left: 100%;
  }
  .hui-row-24 .hui-col-24-xl-offset-23 {
    margin-left: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-xl-offset-22 {
    margin-left: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-xl-offset-21 {
    margin-left: 87.5%;
  }
  .hui-row-24 .hui-col-24-xl-offset-20 {
    margin-left: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-xl-offset-19 {
    margin-left: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-xl-offset-18 {
    margin-left: 75%;
  }
  .hui-row-24 .hui-col-24-xl-offset-17 {
    margin-left: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-xl-offset-16 {
    margin-left: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-xl-offset-15 {
    margin-left: 62.5%;
  }
  .hui-row-24 .hui-col-24-xl-offset-14 {
    margin-left: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-xl-offset-13 {
    margin-left: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-xl-offset-12 {
    margin-left: 50%;
  }
  .hui-row-24 .hui-col-24-xl-offset-11 {
    margin-left: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-xl-offset-10 {
    margin-left: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-xl-offset-9 {
    margin-left: 37.5%;
  }
  .hui-row-24 .hui-col-24-xl-offset-8 {
    margin-left: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-xl-offset-7 {
    margin-left: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-xl-offset-6 {
    margin-left: 25%;
  }
  .hui-row-24 .hui-col-24-xl-offset-5 {
    margin-left: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-xl-offset-4 {
    margin-left: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-xl-offset-3 {
    margin-left: 12.5%;
  }
  .hui-row-24 .hui-col-24-xl-offset-2 {
    margin-left: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-xl-offset-1 {
    margin-left: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-xl-offset-0 {
    margin-left: 0;
  }
}
@media (min-width: 1600px) {
  .hui-row-24 .hui-col-24-xxl-1, .hui-row-24 .hui-col-24-xxl-2, .hui-row-24 .hui-col-24-xxl-3, .hui-row-24 .hui-col-24-xxl-4, .hui-row-24 .hui-col-24-xxl-5, .hui-row-24 .hui-col-24-xxl-6,
.hui-row-24 .hui-col-24-xxl-7, .hui-row-24 .hui-col-24-xxl-8, .hui-row-24 .hui-col-24-xxl-9, .hui-row-24 .hui-col-24-xxl-10, .hui-row-24 .hui-col-24-xxl-11, .hui-row-24 .hui-col-24-xxl-12,
.hui-row-24 .hui-col-24-xxl-13, .hui-row-24 .hui-col-24-xxl-14, .hui-row-24 .hui-col-24-xxl-15, .hui-row-24 .hui-col-24-xxl-16, .hui-row-24 .hui-col-24-xxl-17, .hui-row-24 .hui-col-24-xxl-18,
.hui-row-24 .hui-col-24-xxl-19, .hui-row-24 .hui-col-24-xxl-20, .hui-row-24 .hui-col-24-xxl-21, .hui-row-24 .hui-col-24-xxl-22, .hui-row-24 .hui-col-24-xxl-23, .hui-row-24 .hui-col-24-xxl-24 {
    float: left;
  }
  .hui-row-24 .hui-col-24-xxl-24 {
    width: 100%;
  }
  .hui-row-24 .hui-col-24-xxl-23 {
    width: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-xxl-22 {
    width: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-xxl-21 {
    width: 87.5%;
  }
  .hui-row-24 .hui-col-24-xxl-20 {
    width: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-xxl-19 {
    width: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-xxl-18 {
    width: 75%;
  }
  .hui-row-24 .hui-col-24-xxl-17 {
    width: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-xxl-16 {
    width: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-xxl-15 {
    width: 62.5%;
  }
  .hui-row-24 .hui-col-24-xxl-14 {
    width: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-xxl-13 {
    width: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-xxl-12 {
    width: 50%;
  }
  .hui-row-24 .hui-col-24-xxl-11 {
    width: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-xxl-10 {
    width: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-xxl-9 {
    width: 37.5%;
  }
  .hui-row-24 .hui-col-24-xxl-8 {
    width: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-xxl-7 {
    width: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-xxl-6 {
    width: 25%;
  }
  .hui-row-24 .hui-col-24-xxl-5 {
    width: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-xxl-4 {
    width: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-xxl-3 {
    width: 12.5%;
  }
  .hui-row-24 .hui-col-24-xxl-2 {
    width: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-xxl-1 {
    width: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-24 {
    right: 100%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-23 {
    right: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-22 {
    right: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-21 {
    right: 87.5%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-20 {
    right: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-19 {
    right: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-18 {
    right: 75%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-17 {
    right: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-16 {
    right: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-15 {
    right: 62.5%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-14 {
    right: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-13 {
    right: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-12 {
    right: 50%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-11 {
    right: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-10 {
    right: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-9 {
    right: 37.5%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-8 {
    right: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-7 {
    right: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-6 {
    right: 25%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-5 {
    right: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-4 {
    right: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-3 {
    right: 12.5%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-2 {
    right: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-1 {
    right: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-xxl-pull-0 {
    right: auto;
  }
  .hui-row-24 .hui-col-24-xxl-push-24 {
    left: 100%;
  }
  .hui-row-24 .hui-col-24-xxl-push-23 {
    left: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-xxl-push-22 {
    left: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-xxl-push-21 {
    left: 87.5%;
  }
  .hui-row-24 .hui-col-24-xxl-push-20 {
    left: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-xxl-push-19 {
    left: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-xxl-push-18 {
    left: 75%;
  }
  .hui-row-24 .hui-col-24-xxl-push-17 {
    left: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-xxl-push-16 {
    left: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-xxl-push-15 {
    left: 62.5%;
  }
  .hui-row-24 .hui-col-24-xxl-push-14 {
    left: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-xxl-push-13 {
    left: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-xxl-push-12 {
    left: 50%;
  }
  .hui-row-24 .hui-col-24-xxl-push-11 {
    left: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-xxl-push-10 {
    left: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-xxl-push-9 {
    left: 37.5%;
  }
  .hui-row-24 .hui-col-24-xxl-push-8 {
    left: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-xxl-push-7 {
    left: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-xxl-push-6 {
    left: 25%;
  }
  .hui-row-24 .hui-col-24-xxl-push-5 {
    left: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-xxl-push-4 {
    left: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-xxl-push-3 {
    left: 12.5%;
  }
  .hui-row-24 .hui-col-24-xxl-push-2 {
    left: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-xxl-push-1 {
    left: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-xxl-push-0 {
    left: auto;
  }
  .hui-row-24 .hui-col-24-xxl-offset-24 {
    margin-left: 100%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-23 {
    margin-left: 95.83333333%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-22 {
    margin-left: 91.66666667%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-21 {
    margin-left: 87.5%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-20 {
    margin-left: 83.33333333%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-19 {
    margin-left: 79.16666667%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-18 {
    margin-left: 75%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-17 {
    margin-left: 70.83333333%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-16 {
    margin-left: 66.66666667%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-15 {
    margin-left: 62.5%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-14 {
    margin-left: 58.33333333%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-13 {
    margin-left: 54.16666667%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-12 {
    margin-left: 50%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-11 {
    margin-left: 45.83333333%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-10 {
    margin-left: 41.66666667%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-9 {
    margin-left: 37.5%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-8 {
    margin-left: 33.33333333%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-7 {
    margin-left: 29.16666667%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-6 {
    margin-left: 25%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-5 {
    margin-left: 20.83333333%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-4 {
    margin-left: 16.66666667%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-3 {
    margin-left: 12.5%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-2 {
    margin-left: 8.33333333%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-1 {
    margin-left: 4.16666667%;
  }
  .hui-row-24 .hui-col-24-xxl-offset-0 {
    margin-left: 0;
  }
}

豫ICP备19019279号-1
H-ui只是一个纯web前端的程序，没有后台和数据库，也不提供任何系统代运营服务。所有使用H-ui开发的任何系统版权都归开发者所有，造成的任何损失、不良影响，H-ui均不承担任何法律责任。
未经允许，禁止转载、抄袭、镜像
用心做站，做不一样的站