@define-mixin section-header {
  @mixin secondary-gradient;
  @mixin text-shadow;
  border: solid 1px #cdcdcd;
  @mixin border-colors #e6e6e6, #d4d4d4, #cdcdcd;
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 0 1px #FFF inset;

  font-size: 1em;
  font-weight: bold;
  line-height: 18px;
  margin-bottom: 0.5em;
  color: $section-header-text-color;

  padding: 5px 10px 3px 10px;
}

@define-mixin section-background {
  background: #f4f4f4;
  @mixin rounded 4px;
  @mixin inset-shadow 0,1px,4px, #ddd;
}

@define-mixin section {
  @mixin section-background;
  margin-bottom: 20px;

  > h3 {
    @mixin section-header;

    .header_action {
      float: right;
    }
  }

  > div { padding: 3px $section-padding $section-padding $section-padding; }

  hr {
    border: none;
    border-bottom: 1px solid #E8E8E8;
  }
}
