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

  font-size: 1.0em;
  font-weight: bold;
  line-height: 18px;
  margin-bottom: 0.5em;
  color: $section-header-text-color;
  @include icon($section-header-text-color, 1.0em);
  
  padding: 5px 10px 3px 10px; 
}

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

@mixin section {
  @include section-background;
  margin-bottom: 20px;
  
  > h3 { @include section-header; }
  
  > div { padding: 3px $section-padding $section-padding $section-padding; }
  
  hr {
    border: none;
    border-bottom: 1px solid #E8E8E8;
  }
}
