/**
 * Share Links - Default Theme
 */
.ksharelinks.gradient {
        
}
.ksharelinks.gradient .kintro {
        float: left;
        margin: 0 1em 0 0;
}
.ksharelinks.gradient ul {
        margin: 0;
        padding: 0;
        list-style: none;
}
.ksharelinks.gradient ul li {
        float: left;
        margin: 0 1em 0.6em 0;
}
.ksharelinks.gradient ul li:last-of-type {
        margin: 0;
}

// Base styles
// --------------------------------------------------

.ksharelinks.gradient .klink {
    
    display: inline-block;
    margin-bottom: 0; // For input.btn
    font-weight: $btn-font-weight;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    background-image: none; // Reset unusual Firefox-on-Android gradient style; see https://github.com/necolas/normalize.css/issues/214
    border: 1px solid transparent;
    white-space: nowrap;
    text-decoration: none;
    @include button-size( $padding-medium-vertical, $padding-medium-horizontal, $font-size-base, $line-height-base, $border-radius-base );

    .kicon {
        font-size: 1em;
    }
    
    &,
    &:active,
    &.active {
      &:focus {
        // Use themes focus
      }
    }

    &:hover,
    &:focus {
      color: #fff;
      text-decoration: none;
    }

    &:active,
    &.active {
      outline: 0;
      background-image: none;
      box-shadow: inset 0 3px 5px rgba( 0, 0, 0, 0.125 );
    }

    &.disabled,
    &[disabled],
    fieldset[disabled] & {
      cursor: not-allowed;
      pointer-events: none; // Future-proof disabling of clicks
      opacity: 0.65;
      box-shadow: none;
    }
    
}

// Buttons Variations
// --------------------------------------------------

.ksharelinks.gradient .buffer {
    @include button-variant( #fff, $buffer, darken( $buffer, 5% ) );
    @include gradient-single( $buffer );
    &:hover,
    &:active {
        background: darken( $buffer, 10% );
    }
}
.ksharelinks.gradient .email {
    @include button-variant( #fff, $email, darken( $email, 5% ) );
    @include gradient-single( $email );
    &:hover,
    &:active {
        background: darken( $email, 10% );
    }
}
.ksharelinks.gradient .facebook {
    @include button-variant( #fff, $facebook, darken( $facebook, 5% ) );
    @include gradient-single( $facebook );
    &:hover,
    &:active {
        background: darken( $facebook, 10% );
    }
}
.ksharelinks.gradient .twitter {
    @include button-variant( #fff, $twitter, darken( $twitter, 5% ) );
    @include gradient-single( $twitter );
    &:hover,
    &:active {
        background: darken( $twitter, 10% );
    }
}
.ksharelinks.gradient .linkedin {
    @include button-variant( #fff, $linkedin, darken( $linkedin, 5% ) );
    @include gradient-single( $linkedin );
    &:hover,
    &:active {
        background: darken( $linkedin, 10% );
    }
}
.ksharelinks.gradient .pinterest {
    @include button-variant( #fff, $pinterest, darken( $pinterest, 5% ) );
    @include gradient-single( $pinterest );
    &:hover,
    &:active {
        background: darken( $pinterest, 10% );
    }
}
.ksharelinks.gradient .googleplus {
    @include button-variant( #fff, $googleplus, darken( $googleplus, 5% ) );
    @include gradient-single( $googleplus );
    &:hover,
    &:active {
        background: darken( $googleplus, 10% );
    }
}
.ksharelinks.gradient .digg {
    @include button-variant( #fff, $digg, darken( $digg, 5% ) );
    @include gradient-single( $digg );
    &:hover,
    &:active {
        background: darken( $digg, 10% );
    }
}
.ksharelinks.gradient .tumblr {
    @include button-variant( #fff, $tumblr, darken( $tumblr, 5% ) );
    @include gradient-single( $tumblr );
    &:hover,
    &:active {
        background: darken( $tumblr, 10% );
    }
}
.ksharelinks.gradient .reddit {
    @include button-variant( #fff, $reddit, darken( $reddit, 5% ) );
    @include gradient-single( $reddit );
    &:hover,
    &:active {
        background: darken( $reddit, 10% );
    }
}
.ksharelinks.gradient .stumbleupon {
    @include button-variant( #fff, $stumbleupon, darken( $stumbleupon, 5% ) );
    @include gradient-single( $stumbleupon );
    &:hover,
    &:active {
        background: darken( $stumbleupon, 10% );
    }
}
.ksharelinks.gradient .delicious {
    @include button-variant( #fff, $delicious, darken( $delicious, 5% ) );
    @include gradient-single( $delicious );
    &:hover,
    &:active {
        background: darken( $delicious, 10% );
    }
}

// Button Sizes
// --------------------------------------------------

// Extra Small
.ksharelinks.gradient.xsmall {
    .kintro {
        padding: $padding-xs-vertical 0;
        line-height: $line-height-xs;
    }
    .klink,
    .kcount {
        @include button-size( $padding-xs-vertical, $padding-xs-horizontal, $font-size-xs, $line-height-xs, $border-radius-small );
        min-width: 3em;
    }
    .kcount {
        @include left-box-arrow( #bbb, 5px, 6px, -10px );
        min-width: 0;
    }
}

// Small
.ksharelinks.gradient.small {
    .kintro {
        padding: $padding-small-vertical 0;
        line-height: $line-height-small;
    }
    .klink,
    .kcount {
        @include button-size( $padding-small-vertical, $padding-small-horizontal, $font-size-small, $line-height-small, $border-radius-small );
        min-width: 3em;
    }
    .kcount {
        @include left-box-arrow( #bbb, 6px, 9px, -12px );
        min-width: 0;
    }
}

// Medium
.ksharelinks.gradient.medium {
    .kintro {
        padding: $padding-medium-vertical 0;
        line-height: $line-height-base;
    }
    .klink,
    .kcount {
        @include button-size( $padding-medium-vertical, $padding-medium-horizontal, $font-size-base, $line-height-base, $border-radius-base );
        min-width: 3em;
        .kicon {
            font-size: 13px;
        }
    }
    .kcount {
        @include left-box-arrow( #bbb, 7px, 10px, -14px );
        min-width: 0;
    }
}

// Large
.ksharelinks.gradient.large {
    .kintro {
        padding: $padding-large-vertical 0;
        line-height: $line-height-large;
    }
    .klink,
    .kcount {
        @include button-size( $padding-large-vertical, $padding-large-horizontal, $font-size-large, $line-height-large, $border-radius-large );
        min-width: 3.4em;
    }
    .kcount {
        @include left-box-arrow( #bbb, 8px, 14px, -16px );
        min-width: 0;
    }
}

// Extra Large
.ksharelinks.gradient.xlarge {
    .kintro {
        padding: $padding-xl-vertical $padding-xl-horizontal;
        line-height: $line-height-large;
    }
    .klink,
    .kcount {
        @include button-size( $padding-xl-vertical, $padding-xl-horizontal, $font-size-xl, $line-height-large, $border-radius-large );
        min-width: 3.4em;
    }
    .kcount {
        @include left-box-arrow( #bbb, 9px, 14px, -18px );
        min-width: 0;
    }
}

// Button Details
// --------------------------------------------------

.ksharelinks.gradient .klink i {
        font-family: zocial;
        background: none;
}
.ksharelinks.gradient .klink {
        //box-shadow: 0px 1px 2px 0px rgba( 0, 0, 0, 0.2 );
}
.ksharelinks.gradient .klink .kicon {
        text-shadow: 1px 1px 1px rgba( 0, 0, 0, 0.2 );
}
.ksharelinks.gradient .klink .kname {
        margin-left: 0.6em;
        text-shadow: 1px 1px 1px rgba( 0, 0, 0, 0.2 );
}
.ksharelinks.gradient .kcount {
        display: inline-block;
        font-weight: $btn-font-weight;
        text-align: center;
        vertical-align: middle;
        background-image: none; // Reset unusual Firefox-on-Android gradient style; see https://github.com/necolas/normalize.css/issues/214
        border: 1px solid transparent;
        white-space: nowrap;
        text-decoration: none;
        @include button-count( #777, #fff, #cccccc );
        margin: 0 0 0 0.4em;
}

// Floating Bar
// --------------------------------------------------

.kfloating.gradient {
        background: #f7f7f7;
        border-top: 1px solid #ddd;
}
.kfloating.gradient .ksharelinks.gradient li {
        margin: 0.6em 1em 0.6em 0;
        float: none;
}
.kfloating.gradient .ksharelinks.gradient li:last-of-type {
        margin-right: 0;
}
.kfloating.gradient .ksharelinks.gradient .klink {
        display: block;
}
.kfloating.gradient .ksharelinks.gradient .kcount {
        display: none;
        margin: 0.7em 0 0 0;
}
.kfloating.gradient .ksharelinks.gradient {
    
    
    .klink,
    .kcount {
        @include button-size( $padding-medium-vertical, $padding-medium-horizontal, $font-size-base, $line-height-base, $border-radius-base );
        width: 3.4em;
        
        
    }
    .klink {
        .kicon {
            font-size: 13px;
        }
    }
    .kcount {
        @include top-box-arrow( #bbb, 7px, 22px, -14px );
    }
    
}
body {
        margin-bottom: 50px !important;
}