Edit credit card payment page

Hello.

First I'm sorry about my English.

I'm using version 3.8 with Brooklyn theme.

I'm trying to change the Paymentinfo page pretty.

I found card.js famous and pretty, Adding CSS and JS does not work.

[url=https://github.com/jessepollak/card]

Using the developer tools, I could not get an event on the input.

Is there a good way?

@using Nop.Web.Framework.UI
@{
    Layout = "";

    Html.AddScriptParts("~/Scripts/card/card.js");
}
@model Nop.Plugin.Payments.NZPayment.Models.PaymentInfoModel
@using Nop.Web.Framework;

    <div class="demo-container">
        <div class="card-wrapper"></div>
        <div class="form-container active">
            <form action="">
                <input placeholder="Card number" type="tel" name="number">
                <input placeholder="Full name" type="text" name="name">
                <input placeholder="MM/YY" type="tel" name="expiry">
                <input placeholder="CVC" type="number" name="CardCode">
            </form>
        </div>
    </div>
    <script>
        new Card({
            form: document.querySelector('form'),
            container: '.card-wrapper'
        });
    </script>

Try this article I've written. Improving NopCommerce UX (User Experience) - Credit Card Form