@theme(sc-huge-size) {

  $theme.button {
    font-size:13px;
    .sc-button-label {
      margin-top:4px;
      height: 30px;
    }


    @include slices("normal_button.png", $left: 3, $right: 3);

    &.active {
      @include slices("active_button.png", $left: 3, $right: 3);
    }

    &.sel, &.def {
      @include slices("selected_button.png", $left: 3, $right: 3);

    }

    &.sel.active, &.def.active {
      @include slices("selected_active_button.png", $left: 3, $right: 3);
    }
    
    &.sc-static-layout .sc-button-label {
      margin-left: 12px;
      margin-right: 12px;
    }
  }

  @theme(point-left) {
    $theme.button {
      @include slices("normal_button_pointer.png", $left: 12, $right: 12, $skip: middle right);

      .middle { left: 12px; }
      .right { right:10px; width:3px }

      &.active {
        @include slices("active_button_pointer.png", $left: 12, $right: 12, $skip: middle right);
        .middle { left: 12px; }
        .right { right:10px; width:3px }
      }

      &.sel, &.def {
        @include slices("selected_button_pointer.png", $left: 12, $right: 12, $skip: middle right);
        .middle { left: 12px; }
        .right { right:10px; width:3px }
      }

      &.sel.active, &.def.active {
        @include slices("selected_active_button_pointer.png", $left: 12, $right: 12, $skip: middle right);
        .middle { left: 12px; }
        .right { right:10px; width:3px }
      }
    }
  }

  @theme(point-right) {
    $theme.button {
      @include slices("normal_button_pointer.png", $left: 12, $right: 12, $skip: middle left);

      .middle { right: 12px; }
      .left { left:10px; width:3px }

      &.active {
        @include slices("active_button_pointer.png", $left: 12, $right: 12, $skip: middle left);
        .middle { right: 12px; }
        .left { left:10px; width:3px }
      }

      &.sel, &.def {
        @include slices("selected_button_pointer.png", $left: 12, $right: 12, $skip: middle left);
        .middle { right: 12px; }
        .left { left:10px; width:3px }
      }

      &.sel.active, &.def.active {
        @include slices("selected_active_button_pointer.png", $left: 12, $right: 12, $skip: middle left);
        .middle { right: 12px; }
        .left { left:10px; width:3px }
      }
    }
  }
}