.checkbox{
    width:17px;
    height:17px;
    display: inline-block;
    vertical-align: middle;
    margin-right:5px;
    text-align: left;
    border:none;
    cursor: pointer;
    @include common-sprite(checkbox);
    &:hover{
        @include common-sprite(checkbox-hover);
    }
  
}
.checkbox-checked{
    width:17px;
    height:17px;
    display: inline-block;
    vertical-align: middle;
    margin-right:5px;
    text-align: left;
    border:none;
    cursor: pointer;
    @include common-sprite(checkbox-checked);
    &:hover{
       @include common-sprite(checkbox-checked-hover);
    }
}
.checkbox-default-disable{
    width:17px;
    height:17px;
    display: inline-block;
    vertical-align: middle;
    margin-right:5px;
    text-align: left;
    border:none;
    cursor: default;
    @include common-sprite(checkbox-default-disable);
    
}
.checkbox-disable{
    width:17px;
    height:17px;
    display: inline-block;
    vertical-align: middle;
    margin-right:5px;
    text-align: left;
    border:none;
    cursor: default;
    @include common-sprite(checkbox-disabled);
    &:hover{
        @include common-sprite(checkbox-disabled);
    }
}


[class^="radio-"],
[class*=" radio-"] {
    width:17px;
    height:17px;
    display: inline-block;
    vertical-align: middle;
    margin-right:5px;

}
.radio{
    width:17px;
    height:17px;
    display: inline-block;
    vertical-align: middle;
    margin-right:5px;
    @include common-sprite(radio-default);
    &:hover{
        @include common-sprite(radio-hover);
    }
}
.radio-checked{
     @include common-sprite(radio-checked);
     &:hover{
        @include common-sprite(radio-checked-hover);
    }
}
.radio-disable{
     @include common-sprite(radio-disable); 
     cursor: default;
     &:hover{
       @include common-sprite(radio-disable); 
    }
}



.input-default{
    padding:2px 10px 2px 10px;
    border:1px solid $inputBorder;
    border-left:1px solid $inputBorder;
    background-color:#fff;
    position: relative;
    @include border-radius();
    label{
        width:100%;
        position: absolute;
        top:0;
        left:0;
        height:26px;
        line-height:26px;
        text-indent:12px;
        font-size:$fontSizeSmall;
        color:$gay5;
        border-color:transparent;
        cursor:text;
        padding:2px 0;
    }
    input{
        width:100%;
        border:0 none;
        color:$gay5;
        background-color: transparent;
    }
    textarea{
        width:100%;
        border:0 none;
        color:$gay5;
        background-color: transparent;
        overflow-x: hidden;
        overflow-y:auto;
    }

}
.input-focus{
    border:1px solid $inputBorderFocus;
    input,textarea{
        color:#36434D;
    }
}

.input-blur{
    border:1px solid $inputBorder;
    background-color: $inputBackground;
    input,textarea{
        color:$gay1;
    }
}
.input-success{
    border:1px solid $inputBorderSuccess;
    background-color: $inputBackgroundSuccess;
    input,textarea{
       color:$gay1;
    }
}
.input-error{
    border:1px solid $inputBorderError;
    background-color:$inputBackgroundError;
    input,textarea{
      color:$gay1;
    }
}
.input-disable{
    background-color:$gay7;cursor:default;
    input{
        color:$gay5;
    }
    textarea{
        color:$gay5;
        cursor:default;
    }
}


.search-form-list{
    width:200px;
    .input-default{
        position: relative;
        padding-right:42px;
        border-left-width:1px;
    }
    .button_sfl{
        position: absolute;
        right: 0;
        top:0;
        width: 32px;
        height: 28px;
        padding-top:7px;
        text-align: center;
        vertical-align: middle;
        line-height: 0;
        overflow: hidden;
    }
}