.demo-form {
  .#{$namespace}-select .#{$namespace}-input {
    width: 380px;
  }
  .#{$namespace}-form {
    width: 460px;
  }

  .line {
    text-align: center;
  }

  .#{$namespace}-checkbox-group {
    width: 320px;
    margin: 0;
    padding: 0;
    list-style: none;

    &:after,
    &:before {
      content: " ";
      display: table;
    }
    &:after {
      clear: both;
      visibility: hidden;
      font-size: 0;
      height: 0;
    }

    .#{$namespace}-checkbox {
      float: left;
      width: 160px;
      padding-right: 20px;
      margin: 0;
      padding: 0;

      + .#{$namespace}-checkbox {
        margin-left: 0;
      }
    }
  }
  .demo-form-normal {
    width: 460px;
  }
  .demo-form-inline {
    width: auto;

    .#{$namespace}-input {
      width: 150px;
    }
    > * {
      margin-right: 10px;
    }
  }
  .demo-ruleForm {
    width: 460px;

    .#{$namespace}-select .#{$namespace}-input {
      width: 360px;
    }
  }
  .demo-dynamic {
    .#{$namespace}-input {
      margin-right: 10px;
      width: 270px;
      vertical-align: top;
    }
  }
  .fr {
    float: right;
  }
}