boostrap 4 custom checkbox

i have an asp.net bootstrap 4 custom check box which i cannot align in the form group row as pictured Issue with check box

The form group row code is as follows.

    <div class="form-group row">

                <asp:Label ID="lblHowDidYouHear" CssClass="col-2 col-form-label" AssociatedControlID="ddlHowDidYouHear" runat="server" Text="How Did You Hear:"></asp:Label>
                <div class="col-4">
                    <asp:DropDownList ID="ddlHowDidYouHear" runat="server" CssClass="custom-select"></asp:DropDownList>
                </div>
                <%--ISSUE WITH THE FOLLOWING--%>
                <asp:Label ID="lblNoDetails" CssClass="col-2 col-form-label"  runat="server" Text="Personal Information:"></asp:Label>
                <div class="custom-control custom-checkbox">
                    <input type="checkbox" class="custom-control-input" id="customCheck" name="customCheck" runat="server" />
                    <label class="custom-control-label" for="customCheck">Not Provided</label>
                </div>

            </div>

For context, i have several of these form-group rows (as pictured above) with the same setup within a bootstrap card.

I have googled the hell out of this issue and played with the css in Chrome with no luck.

Has someone come across this issue before and could propose a solution please?

Thanks!