Checkbox css vb.net not appearing

i am using an ascx control for a checkbox to drag and drop and renders as

   <div  runat="server" id="divCheckBoxContainer" style="padding-top:5px; padding-bottom:5px;" class="divCheckBoxContainer">
    <asp:Label runat="server" ID="Label1" Visible="false" EnableViewState="false" ViewStateMode="Disabled"  />
    <asp:CheckBox runat="server" ID="CheckBox1" CssClass="text" Width="100%"    Height="18px"   />
    <asp:RequiredFieldValidator     ID="RequiredFieldValidator1"     InitialValue=""    Visible="false"           Display="Dynamic"       runat="server" ErrorMessage="<br />Required<br />"                        Enabled="false" ControlToValidate="CheckBox1"  />
    </div>

and i am trying to create some cool css checkboxes but when i apply this css they disappear

 input[type=checkbox] + label {
    display: block;
    margin: 0.2em;
    cursor: pointer;
    padding: 0.2em;
}

input[type=checkbox] {
    display: none;
}

    input[type=checkbox] + label:before {
        content: "\2714";
        border: 0.1em solid #000;
        border-radius: 0.2em;
        display: inline-block;
        width: 1.5em;
        height: 1.5em;
        padding-left: 0.2em;
        padding-bottom: 0.3em;
        margin-right: 0.2em;
        vertical-align: bottom;
        color: transparent;
        transition: .4s;
    }

    input[type=checkbox] + label:active:before {
        transform: scale(0);
    }

    input[type=checkbox]:checked + label:before {
        background-color: blue;
        border-color: blue;
        color: #fff;
    }

this is supposed to get rid of the original checkbox by the display none then create a new checkbox but isnt creating the new checkbox

Any help is very appreciated