.checkbox
 {
    padding-left: 22px; 
    margin-bottom: 0px;
    margin-top: 6px;
}
    .checkbox label {
      display: inline-block;
      position: relative;
      padding-left: 5px;
      font-size: 14px;
    }

      .checkbox label::before {
        content: "";
        display: inline-block;
        position: absolute;
        width: 17px;
        height: 17px;
        left: 0;
        margin-left: -20px;
        top: 6px;
        border: 1px solid #cccccc;
        border-radius: 3px;
        background-color: #fff;
        -webkit-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
        -o-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
        transition: border 0.15s ease-in-out, color 0.15s ease-in-out; }

      .checkbox label::after {
        display: inline-block;
        position: absolute;
        width: 16px;
        height: 16px;
        left: 0;
        top: 12;
        margin-left: -20px;
        padding-left: 3px;
        padding-top: 1px;
        font-size: 11px;
        color: #555555; }

    .checkbox input[type="checkbox"] {
      opacity: 0; 
    }
      .checkbox input[type="checkbox"]:focus + label::before {
        outline: thin dotted;
        outline: 5px auto -webkit-focus-ring-color;
        outline-offset: -2px; }
      .checkbox input[type="checkbox"]:checked + label::after {
        font-family: 'FontAwesome';
        content: "\f00c"; }
      .checkbox input[type="checkbox"]:disabled + label {
        opacity: 0.65; }
        .checkbox input[type="checkbox"]:disabled + label::before {
          background-color: #eeeeee;
          cursor: not-allowed; }
    .checkbox.checkbox-circle label::before {
      border-radius: 50%;
     }
    .checkbox.checkbox-inline {
      margin-top: 0; }

      .checkbox-circle input[type="checkbox"]:checked + label::before {
        
        border-color: #4178b5; 
    }
      .checkbox-circle input[type="checkbox"]:checked + label::after {
        color: #fff; 

 }
 .checkbox-primary input[type="checkbox"]:checked + label::before {
    background-color: #4178b5;
        background-image: linear-gradient(#4178b5, #244383);
        border-color: #4178b5;  }
  .checkbox-primary input[type="checkbox"]:checked + label::after {
    color: #fff; }


.radio {
    padding-left: 20px;
}

    .radio label {
        display: inline-block;
        position: relative;
        padding-left: 5px;
    }

        .radio label::before {
            content: "";
            display: inline-block;
            position: absolute;
            width: 17px;
            height: 17px;
            left: 0;
            margin-left: -20px;
            border: 1px solid #cccccc;
            border-radius: 50%;
            background-color: #fff;
            -webkit-transition: border 0.15s ease-in-out;
            -o-transition: border 0.15s ease-in-out;
            transition: border 0.15s ease-in-out;
            top: 5px
        }

        .radio label::after {
            display: inline-block;
            position: absolute;
            content: " ";
            width: 11px;
            height: 11px;
            left: 3px;
            top: 8px;
            margin-left: -20px;
            border-radius: 50%;
            background-color: #555555;
            -webkit-transform: scale(0, 0);
            -ms-transform: scale(0, 0);
            -o-transform: scale(0, 0);
            transform: scale(0, 0);
            -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
            -moz-transition: -moz-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
            -o-transition: -o-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
            transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33);
        }

    .radio input[type="radio"] {
        opacity: 0;
    }

        .radio input[type="radio"]:focus + label::before {
            outline: thin dotted;
            outline: 5px auto -webkit-focus-ring-color;
            outline-offset: -2px;
        }

        .radio input[type="radio"]:checked + label::after {
            -webkit-transform: scale(1, 1);
            -ms-transform: scale(1, 1);
            -o-transform: scale(1, 1);
            transform: scale(1, 1);
        }

        .radio input[type="radio"]:disabled + label {
            opacity: 0.65;
        }

            .radio input[type="radio"]:disabled + label::before {
                cursor: not-allowed;
            }

    .radio.radio-inline {
        margin-top: 0;
    }

.radio-primary input[type="radio"] + label::after {
    background-image: linear-gradient(#4178b5, #244383);
}

.radio-primary input[type="radio"]:checked + label::before {
    border-color: #428bca;
}

.radio-primary input[type="radio"]:checked + label::after {
    background-color: #428bca;
}