﻿
/**
 * Custom Checkbox and Radio By CSS
 */

.checkbox-block label,
.radio-block label {
    display: block
}

.checkbox-block img,
.radio-block img {
    width: auto;
    display: inline-block;
    vertical-align: middle
}

.radio-inline,
.checkbox-inline {
    padding: 0
}

    .radio-inline + .radio-inline,
    .checkbox-inline + .checkbox-inline {
        margin-left: 5px
    }

.radio,
.checkbox {
    opacity: 0;
    display: none;
    float: left;
    width: 18px
}

    .radio + label,
    .checkbox + label {
        margin: 0;
        clear: none;
        padding: 4px 0 3px 18px;
        cursor: pointer;
        font-weight: 400;
        line-height: 18px;
        position: relative
    }

        .radio + label:before,
        .checkbox + label:before {
            font-family: 'FontAwesome';
            content: "\f096";
            position: absolute;
            left: 0;
            top: 5px;
            color: #999
        }

        .radio + label:before {
            content: "\f1db"
        }

    .radio:checked + label:before {
        content: "\f192"
    }

.checkbox:checked + label:before {
    content: "\f14a"
}

    .radio + label:hover::before,
    .checkbox + label:hover::before,
    .radio:checked + label:before,
    .checkbox:checked + label:before {
        color: #1E5FC1
    }
