$negative-margin-width: 24px;
$tab-width: 16%;
$submenu-padding-width: 12px;

$tab-content-width: 100% - $tab-width;
$tab-min-height: 37.5em;

#side-tabs {
  float: left;
  margin-top: -24px;
  margin-left: -$negative-margin-width;
  width: $tab-width;
  font-size: 13px;

 li {
    list-style: none;

    a {
      color: black;
      padding-top: 12px;
      padding-bottom: 12px;

      &:hover {
        color: $tab-menu-active-color;
      }
     }

    a,h3 {
      @include inline-block;
      display: block;
      text-decoration: none;
      text-indent: 24px;
      line-height: 1;
      line-height: 1;
    }
    &.active:first-child > a {
      border-top: none;
    }
    &.active > a {
      border-top: 1px solid $border-color;
      border-bottom: 1px solid $border-color;

      // /margin-top: 12px;


    }

    &.active, &.active a:hover {
      //font-weight: bold;

      position: relative;
      //z-index: 100;



      &>a {
        position: relative;
        z-index: 100;
        color: $tab-menu-active-color;
        background-color: $tab-menu-active-background-color;
      }

      & + li {
        border-top: none;
      }

      ul {
        font-weight: normal;
      }
    }

    ul {
      li {
        &.active:first-child > a {
          border-top: 1px solid $border-color;
        }
      }
    }
  }
}

#tab-content {
  position: relative;
  float: right;
  width: $tab-content-width;
  margin-left: -$negative-margin-width;
  margin-right: -$negative-margin-width;

  background-color: $tab-content-color;
  border-left: 1px solid $tab-border-color;
  border-right: none;

  margin-top: -24px;
  margin-bottom: -24px;

  min-height: $tab-min-height;
  padding: 24px 24px 24px 24px;
  @include border-bottom-right-radius(6px);

  form.formtastic {
    // strange center aligning fixed by moving buttons bit left
    fieldset.buttons {
      position: static;
      padding-left: 0;
      ol {
        position: static;
        left: 0;
      }
    }
  }

  // override stats stylesheets
  .stats-support {
    max-width: 20%;
    width: auto;
    margin-left: 2%;
    position: static;

    #methods {
      width: auto;
      height: auto;
      min-height: 300px;

      &.data-sup ul {
        width: auto;
        max-width: 100%;

        li {
          padding-right: 0.5em;
        }
        span small {
          width: 95%;
          margin-right: 0.5em;
        }
      }
    }
  }

}
