.boxes {
    margin: auto;
    padding: 50px;
    background: #484848;
}

/*Checkboxes styles*/
input[type="checkbox"] { display: none; }

input[type="checkbox"] + label {
    display: block;
    position: relative;
    padding-left: 50px;
    padding-top: 5px;
    margin-bottom: 20px;
    font-size: 15px;
    color: #555;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

input[type="checkbox"] + label:last-child { margin-bottom: 0; }

    input[type="checkbox"] + label:before {
        content: '';
        display: block;
        width: 30px;
        height: 30px;
        border: 2px solid #bf1b20;
        position: absolute;
        left: 0;
        top: 0;
        opacity: .6;
        -webkit-transition: all .12s, border-color .08s;
        transition: all .12s, border-color .08s;
    }

    input[type="checkbox"]:checked + label:before {
        width: 15px;
        top: -5px;
        left: 5px;
        margin-left: 5px;
        border-radius: 0;
        opacity: 1;
        border: 3px solid green;
        border-top-color: transparent;
        border-left-color: transparent;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }