<!doctype html>
<html lang="en-US">
<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous">

    <!-- Custom Css -->
    <link rel="stylesheet" href="style.css" type="text/css" />

    <!-- Ionic icons -->
    <link href="https://unpkg.com/ionicons@4.2.0/dist/css/ionicons.min.css" rel="stylesheet">

    <!-- Google Fonts -->
    <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900" rel="stylesheet">

    <title>BrainUser: Tiktok Interactive Live Game</title>
    <meta name="description" content="TikTok Live Interactive Games. Boost your audience engagement with LIVE Streaming on TikTok by using interactive games, and start earning now">
    <meta name="keywords" content="Tiktok Interactive Game, Live game tiktok, Interactive LIVE, Earn from tiktok, game streamer">
    <meta name="author" content="BrainUser">

    <!-- favicon (google icon)  https://favicon.io/favicon-converter/ -->
    <link rel="icon" type="image/x-icon" href="images/favicon.ico">

    <link rel="apple-touch-icon" sizes="180x180" href="image/apple-touch-icon.png">
    <link rel="icon" type="image/png" sizes="32x32" href="image/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="16x16" href="image/favicon-16x16.png">
    <link rel="manifest" href="image/site.webmanifest">




    <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3221533158774287"
            crossorigin="anonymous"></script>

    <!-- Google tag (gtag.js) -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=G-FLWWCVRSFB"></script>
    <script>
        window.dataLayer = window.dataLayer || [];
        function gtag() { dataLayer.push(arguments); }
        gtag('js', new Date());

        gtag('config', 'G-FLWWCVRSFB');
    </script>


    <!-- TikTok Pixel Code Start -->
    <script>
        !function (w, d, t) {
            w.TiktokAnalyticsObject = t; var ttq = w[t] = w[t] || []; ttq.methods = ["page", "track", "identify", "instances", "debug", "on", "off", "once", "ready", "alias", "group", "enableCookie", "disableCookie", "holdConsent", "revokeConsent", "grantConsent"], ttq.setAndDefer = function (t, e) { t[e] = function () { t.push([e].concat(Array.prototype.slice.call(arguments, 0))) } }; for (var i = 0; i < ttq.methods.length; i++)ttq.setAndDefer(ttq, ttq.methods[i]); ttq.instance = function (t) {
                for (
                    var e = ttq._i[t] || [], n = 0; n < ttq.methods.length; n++)ttq.setAndDefer(e, ttq.methods[n]); return e
            }, ttq.load = function (e, n) {
                var r = "https://analytics.tiktok.com/i18n/pixel/events.js", o = n && n.partner; ttq._i = ttq._i || {}, ttq._i[e] = [], ttq._i[e]._u = r, ttq._t = ttq._t || {}, ttq._t[e] = +new Date, ttq._o = ttq._o || {}, ttq._o[e] = n || {}; n = document.createElement("script")
                    ; n.type = "text/javascript", n.async = !0, n.src = r + "?sdkid=" + e + "&lib=" + t; e = document.getElementsByTagName("script")[0]; e.parentNode.insertBefore(n, e)
            };


            ttq.load('CQB4FCRC77UCUPKFUK1G');
            ttq.page();
        }(window, document, 'ttq');
    </script>
    <!-- TikTok Pixel Code End -->

</head>

<body>

    <!-- N A V B A R -->
    <nav class="navbar navbar-default navbar-expand-lg fixed-top custom-navbar">
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
            <span class="icon ion-md-menu"></span>
        </button>
        <img src="images/logo1.png" width="6%" height="6%" class="img-fluid nav-logo-mobile" alt="Company Logo">
        <div class="collapse navbar-collapse" id="navbarNavDropdown">
            <div class="container">
                <img src="images/logo1.png" width="6%" height="6%" class="img-fluid nav-logo-desktop" alt="Company Logo">
                <ul class="navbar-nav ml-auto nav-right" data-easing="easeInOutExpo" data-speed="1250" data-offset="65">
                    <li class="nav-item nav-custom-link">
                        <a class="nav-link" href="index.html">Home <i class="icon ion-ios-arrow-forward icon-mobile"></i></a>
                    </li>
                    <li class="nav-item nav-custom-link">
                        <a class="nav-link" href="#gameList">Our Games<i class="icon ion-ios-arrow-forward icon-mobile"></i></a>
                        <!-- <a class="nav-link" href="#Screenshot">Screenshot<i class="icon ion-ios-arrow-forward icon-mobile"></i></a>  -->
                    </li>
                    <li class="nav-item nav-custom-link">
                        <a class="nav-link" href="https://www.youtube.com/channel/UCraYyvbQu547a11Lgr81I7Q" target="_blank"> Youtube <i class="icon ion-ios-arrow-forward icon-mobile"></i></a>
                    </li>
                    <li class="nav-item nav-custom-link">
                        <a class="nav-link" href="https://discord.com/invite/DGNFqNxMfm" target="_blank"> Discord <i class="icon ion-ios-arrow-forward icon-mobile"></i></a>
                    </li>
                    <li class="nav-item nav-custom-link">
                        <a class="nav-link" href="https://www.facebook.com/Brain-User-104055804804539" target="_blank"> Facebook <i class="icon ion-ios-arrow-forward icon-mobile"></i></a>
                    </li>
                    <li class="nav-item nav-custom-link">
                        <a class="nav-link" href="https://www.tiktok.com/@brainuser55?lang=en" target="_blank"> Tiktok <i class="icon ion-ios-arrow-forward icon-mobile"></i></a>
                    </li>
                    <li class="nav-item nav-custom-link btn btn-demo-small">
                        <a class="nav-link" href="#pricing"> Start Now <i class="icon ion-ios-arrow-forward icon-mobile"></i></a>
                    </li>
                </ul>
            </div>
        </div>
    </nav>
    <!-- E N D  N A V B A R   /*style="width: 100%; height: auto;*/ -->
    <!-- H E R O  style="padding:150px" -->
    <section id="hero">
        <div class="container">
            <div class="row">
                <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4  justify-content-center">
                    <!--<img href="game2_LightHit.html" src="images/img1.png" class="img-fluid" alt="Demo image">-->
                    <video autoplay loop muted class="img-fluid" style="width: 80%; height: auto; ">
                        <source src="images/websitegif.mp4" type="video/mp4">
                        Your browser does not support the video tag.
                    </video>
                </div>
                <!-- <div class="col-md-5 content-box hero-content"> -->
                <!-- <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8 content-box hero-content"  style="width: 80%; height: 100%; align-self: flex-start;" > -->
                <div class="col-md-8 " style="width: 80%; height: 100%; align-self: center; padding: 0; padding-left: 20px;">
                    <!--  <span> Light Hit 3D</span> -->
                    <!--<p> </p>-->
                    <h1> <b>Tiktok interactive Live Games  </b></h1>
                    <h1> Start earning from tikok LIVE!</h1>
                    <p>Get more followers and increase your audience engagement by streaming ours smart interactive games</p>
                    <p> Very satisfying game!</p>
                    <p> A lot of FUN!</p>
                    <a href="#pricing" class="btn btn-regular">Start Now</a>
                    <!--<a href="game2_LightHit.html" class="btn btn-regular"> Screenshot </a>-->
                </div>
            </div>
        </div>
    </section>
    <!--
    <section id="Screenshot">
    <div class="container">
    </div>
    </section>
    -->
    <!-- H E R O
    <section id="hero">
      <div class="container">
        <div class="row">
          <div class="col-lg-5 col-md-5 col-sm-5 col-xs-5">
            <img  onClick="window.open("game1_snakeNG.html")" src="images/card1.png" class="img-fluid" alt="Demo image">
          </div>
          <div class="col-md-7 content-box hero-content">
           <p> </p>
            <h1> <b>Flutter: Snake Next Gen, Multiplayer dice, AI</b></h1>
            <h1> New way of playing snake, Let AI play for you</h1>
            <p> Play online with real player from all the world</p>
            <a href="https://play.google.com/store/apps/details?id=nm.multipalyer.snake_ng" target="_blank" class="btn btn-regular">Play Now</a>
            <a href="game1_snakeNG.html" class="btn btn-regular"> Screenshot </a>
          </div>
        </div>
      </div>
    </section>
    -->
    <!-- SNAKE
    <section id="Screenshot">
      <div class="container">
        <div class="title-block">
          <h2>Enjoy Multiplayer mode & AI mode & Classic mode</h2>
          <p>have you ever played snake inverted ? you are moving the food not the snake ?!!</p>
        </div>
        <div class="row">
          <div class="col-md-4">
              <img src="images/card2.png" class="img-fluid" alt="Demo image">
          </div>
          <div class="col-md-4">
              <img src="images/card3.png" class="img-fluid" alt="Demo image">
          </div>
          <div class="col-md-4">
              <img src="images/card4.png" class="img-fluid" alt="Demo image">
          </div>


          </div>
        </div>
    </section>
    -->
    <!-- Games Lists -->
    <!--
    <section id="pricing">
      <div class="container">
        <div class="title-block">
          <h2>Our Games</h2>
          <p>The best software to develop perfect content and advertising strategies to increase leads and sales.</p>
        </div>
        <div class="row">
          <div class="col-md-3">

            <div class="pricing-box">
              <center>
                  <h4>Be the King V1</h4>
              </center>
              <img href="game2_LightHit.html" src="images/img1.png" class="img-fluid" alt="Demo image">
                <a href="#" class="btn btn-buy">Details</a>
            </div>
          </div>
          <div class="col-md-3">
            <div class="pricing-box">
              <h3>LifeTime</h3>
              <h6>€199</h6>
              <small>lifetime</small>
              <p>Suitable for pro streamers </p>
              <div class="divider-light"></div>
              <ul>
                <li><i class="icon ion-md-checkmark-circle-outline"></i>All Lite games</li>
                <li><i class="icon ion-md-checkmark-circle-outline"></i>All Premuim games</li>
                <li><i class="icon ion-md-checkmark-circle-outline"></i>LifeTime</li>
                <li><i class="icon ion-md-checkmark-circle-outline"></i>Change account</li>
                <li><i class="icon ion-md-checkmark-circle-outline"></i>P1 Customer support</li>
                <li><i></i>  </li>
              </ul>
              <div class="text-center">
                <a href="#" class="btn btn-buy">Buy now</a>
              </div>
            </div>
          </div>
          <div class="col-md-3">
            <div class="pricing-box">
              <h3>LifeTime VIP</h3>
              <h6>€299</h6>
              <small>lifetime</small>
              <p> Suitable for pro streamers </p>
              <div class="divider-light"></div>
              <ul>
                <li><i class="icon ion-md-checkmark-circle-outline"></i>All Lite games</li>
                <li><i class="icon ion-md-checkmark-circle-outline"></i>All Premuim games</li>
                <li><i class="icon ion-md-checkmark-circle-outline"></i>LifeTime</li>
                <li><i class="icon ion-md-checkmark-circle-outline"></i>Change account</li>
                <li><i class="icon ion-md-checkmark-circle-outline"></i>P1 Customer support</li>
                <li><i class="icon ion-md-checkmark-circle-outline"></i>New games </li>
              </ul>
              <div class="text-center">
                <a href="#" class="btn btn-buy">Buy now</a>
              </div>
            </div>
          </div>
          <div class="col-md-3">
            <div class="pricing-box">
              <h3>Company partner</h3>
              <h6>Custom</h6>
              <small>Multiple account Key</small>
              <p>For agencies and businesses partner</p>
              <div class="divider-light"></div>
              <ul>
                <li><i class="icon ion-md-checkmark-circle-outline"></i>All Lite games</li>
                <li><i class="icon ion-md-checkmark-circle-outline"></i>All Premuim games</li>
                <li><i class="icon ion-md-checkmark-circle-outline"></i>Special Keys</li>
                <li><i class="icon ion-md-checkmark-circle-outline"></i>re-sell possible</li>
                <li><i class="icon ion-md-checkmark-circle-outline"></i>Change account</li>
                <li><i class="icon ion-md-checkmark-circle-outline"></i>x50 accounts</li>
              </ul>
              <div class="text-center">
                <a href="#" class="btn btn-buy">Contact Now</a>
              </div>
            </div>
          </div>

        </div>
      </div>
    </section>
    -->
    <!-- E N D  M A R K E T I N G -->
    <style>
        /* Add your CSS styles here */

        .img1 {
            width: 50px;
            height: 50px;
        }

        .p1 {
            margin: 5px 0;
        }

        /* Style the counter container */
        .counter {
            display: flex;
            flex-wrap: wrap; /* Allow items to wrap to the next row on smaller screens */
            justify-content: space-between;
            align-items: center; /* Center items vertically */
            padding: 20px;
        }

        /* Style the counter card containers */
        .counter-item {
            background-color: #f5f5f5;
            padding: 20px;
            border-radius: 8px;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
            text-align: center;
            flex: 1; /* Grow to occupy available space */
            min-width: 200px; /* Set a minimum width for each card */
            margin: 10px;
            box-sizing: border-box; /* Include padding in width calculation */

            display: flex; /* Make container a flex container */
            flex-direction: column; /* Stack image and text vertically */
            align-items: center; /* Center items horizontally */
            /* Responsive styles for smaller screens (e.g., mobile) */
            @media (max-width: 768px) {
                flex-basis: calc(50% - 20px); /* Two cards per row on smaller screens */
            }
        }

        /* Add margin between the cards */
        .counter-item {
            margin: 10px;
        }

        /* Style the counter number */
        .count {
            font-size: 50px; /* Adjust the font size as needed */
            font-weight: bold; /* Make the text bold */
            color: #FF5733; /* Change the color to your desired color */
        }
    </style>

    <section id="counter-section">
        <div class="container">

            <center>
                <h1> <b>Numbers don't lie </b></h1>
                <h3> Check how big we are !</h3>
            </center>

            <div class="counter">


                <div class="counter-item">
                    <div class="counter-card">
                        <img class="img1" src="counterWidget\discord.png" alt="Followers">
                        <div style="display: flex; flex-direction: row; align-items: center;">
                            <p style="font-size: 40px; font-weight: bold; margin: 0; padding: 0; ">+</p>
                            <p style="font-size: 40px; font-weight: bold; margin: 0; padding: 0; " id="follower-count">0</p>
                        </div>
                        <p>Members</p>
                    </div>
                </div>
                <div class="counter-item">
                    <div class="counter-card">
                        <img class="img1" src="counterWidget\game2.png" alt="Games">
                        <div style="display: flex; flex-direction: row; align-items: center;">
                            <p style="font-size: 40px; font-weight: bold; margin: 0; padding: 0;">+</p>
                            <p style="font-size: 40px; font-weight: bold; margin: 0; padding: 0;" id="games-count">0</p>
                        </div>
                        <p>Games</p>
                    </div>
                </div>
                <div class="counter-item">
                    <div class="counter-card">
                        <img class="img1" src="counterWidget\proft.png" alt="Customers">
                        <div style="display: flex; flex-direction: row; align-items: center;">
                            <p style="font-size: 40px; font-weight: bold; margin: 0; padding: 0;">+</p>
                            <p style="font-size: 40px; font-weight: bold; margin: 0; padding: 0;" id="customer-count">0</p>
                        </div>
                        <p>Customers</p>
                    </div>
                </div>
                <div class="counter-item">
                    <div class="counter-card">
                        <img class="img1" src="counterWidget\country.png" alt="Experience">
                        <div style="display: flex; flex-direction: row; align-items: center;">
                            <p style="font-size: 40px; font-weight: bold; margin: 0; padding: 0;">+</p>
                            <p style="font-size: 40px; font-weight: bold; margin: 0; padding: 0;" id="experience-count">0</p>
                        </div>
                        <p>Countries</p>
                    </div>
                </div>
            </div>

            <center>
                <br>
                <h3> We are a community on discord, JOIN NOW !</h3>
                <iframe src="https://discord.com/widget?id=1025107332969013269&theme=light"
                        width="80%" height="300"
                        allowtransparency="true"
                        frameborder="0"
                        style="border-radius: 5px; border: 1px solid gray; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) "
                        sandbox="allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts"></iframe>
            </center>
        </div>
        <script>
            // JavaScript code to animate the counters
            const followerCount = document.getElementById('follower-count');
            const gamesCount = document.getElementById('games-count');
            const customerCount = document.getElementById('customer-count');
            const experienceCount = document.getElementById('experience-count');

            const targetValues = {
                follower: 9423, // discord
                games: 25,
                customer: 5915,
                experience: 53 // country
            };

            //const updateCounter = (element, targetValue) => {
            //    let currentValue = 0;
            //    const increment = Math.ceil(targetValue / 100); // Adjust the animation speed here

            //    const intervalId = setInterval(() => {
            //        currentValue += increment;
            //        if (currentValue >= targetValue) {
            //            currentValue = targetValue;
            //            clearInterval(intervalId);
            //        }
            //        element.textContent = currentValue;//+"+";
            //    }, 50); // Adjust the interval time here
            //};

            const updateCounter = (element, targetValue, duration = 2000) => {
                let startValue = 0;
                const increment = (targetValue - startValue) / (duration / 50); // Calculate the increment based on the duration

                const intervalId = setInterval(() => {
                    startValue += increment;
                    if (startValue >= targetValue) {
                        startValue = targetValue;
                        clearInterval(intervalId);
                    }
                    element.textContent = Math.round(startValue); // Round the value for whole numbers
                }, 50); // Use a fixed interval for smoother animation
            };


            // Function to handle the counting animation
            function startCounting() {
                updateCounter(followerCount, targetValues.follower);
                updateCounter(gamesCount, targetValues.games);
                updateCounter(customerCount, targetValues.customer);
                updateCounter(experienceCount, targetValues.experience);
                // Your counting animation logic here
            }

            // Options for the Intersection Observer
            const options = {
                root: null, // Use the viewport as the root
                rootMargin: '0px', // No margin around the root
                threshold: 0.4 // Trigger the callback when 50% of the section is visible
            };

            // Create an observer to watch for the section
            const observer = new IntersectionObserver((entries, observer) => {
                entries.forEach(entry => {
                    if (entry.isIntersecting) {
                        // The section is visible, start counting
                        startCounting();

                        // Disconnect the observer since it's no longer needed
                        observer.disconnect();
                    }
                });
            }, options);

            // Observe the section
            const counterSection = document.querySelector('#counter-section');
            observer.observe(counterSection);

        </script>
    </section>
    <!-- E N D  M A R K E T I N G -->
    <!--  Game List -->
    <section id="gameList" style="width: 100%; height: 900px;">
        <div class="title-block">
            <h2>List of our games </h2>
            <p>All games all fully automated</p>
        </div>
        <iframe id="content-frame" src="games/allGamesScroll.html" style="width: 100%; height: 100%; border: none; box-shadow: none;"></iframe>
        <!--<div class="col-md-6">
            <div class="testimonial-box">
                <div class="row personal-info">
                    <div class="col-md-2 col-xs-2">
                        <div class="profile-picture review-one"></div>
                    </div>
                    <div class="col-md-10 col-xs-10">
                        <h6>Joshua M. Salas <span class="rating">5 <i class="icon ion-md-star"></i></span></h6>
                        <small>Marketing Intelligence | Author & Content Creator</small>
                    </div>
                </div>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur scelerisque, tortor nec mattis feugiat, velit purus euismod odio, quis vulputate velit urna sit amet enim. Maecenas vulputate auctor ligula sed sollicitudin.</p>
            </div>
        </div>
        <div class="col-md-6">
            <div class="testimonial-box">
                <div class="row personal-info">
                    <div class="col-md-2 col-xs-2">
                        <div class="profile-picture review-one"></div>
                    </div>
                    <div class="col-md-10 col-xs-10">
                        <h6>Michael Edwards <span class="rating">5 <i class="icon ion-md-star"></i></span></h6>
                        <small>Seo Consultant | Author & Content Creator</small>
                    </div>
                </div>
                <p>In euismod, metus ac elementum tincidunt, dui eros ullamcorper lorem, at euismod augue augue quis leo. Fusce non dui augue. In hac habitasse platea dictumst. Mauris quis lacinia mauris. Proin ut pretium quam. Nam at ex finibus.</p>
            </div>
        </div>-->
    </section>
    <!-- E N D  Game List -->
    <!-- Pricing  -->
    <section id="pricing">
        <div class="container">
            <div class="title-block">
                <h2>Plans and Pricing</h2>
                <p>The best gaming platform to stream wonderful content and increase audience & income.</p>
            </div>
            <div class="row">
                <!--
                <div class="col-md-3">
                  <div class="pricing-box">
                    <h3 class="demo">Test Key </h3>
                    <h6>€20</h6>
                    <small>10 days</small>
                    <p>Suitable for beginner to try 1 (lite) games </p>
                    <div class="divider-light"></div>
                    <ul>
                      <li><i class="icon ion-md-checkmark-circle-outline demo"></i>1x Lite game</li>
                      <li><i class="icon ion-md-checkmark-circle-outline demo"></i>10 days access</li>
                      <li><i class="icon ion-md-checkmark-circle-outline demo"></i>1x change account</li>
                      <li><i class="icon ion-md-checkmark-circle-outline demo"></i>P3 Customer support</li>
                      <li><i></i>  </li>
                      <li><i></i>  </li>
                      <!-- <li><i class="icon ion-md-checkmark-circle-outline demo"></i>Five projects - <span class="demo">¡New!</span></li> -->
                <!--
                    </ul>
                    <div class="text-center">
                      <a href="#" class="btn btn-demo-disabled">Not Available</a>
                    </div>
                    <a href="https://buy.stripe.com/8wMaHL9lkeJh7WU6ou" class="btn btn-buy" target="_blank">Buy now</a>

                  </div>

                </div>
                -->

                <div class="col-md-3">

                    <div class="pricing-box">
                        <h3>Standard Key</h3>
                        <h6>€49</h6>
                        <small>1 month</small>
                        <p>Suitable for Normal users to make profit </p>
                        <div class="divider-light"></div>
                        <ul>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>All Lite games</li>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>All Premuim games</li>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>1 month access</li>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>Change account</li>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>P2 Customer support</li>
                            <li><i></i>  </li>
                            <!--  <li><i class="icon ion-md-checkmark-circle-outline"></i>More earning chances <span>¡New!</span></li>
                            -->
                        </ul>
                        <!--<div class="text-center" data-toggle="modal" data-target="#my-modal" data-order="2">
                            <a href="#pricing" class="btn btn-buy">Buy now</a>
                        </div>-->
                        <a href="https://buy.stripe.com/5kAaHLgNM9oXgtq5kn" class="btn btn-buy" target="_blank">Buy now</a>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="pricing-box">
                        <h3>LifeTime</h3>
                        <h6>€199</h6>
                        <small>lifetime</small>
                        <p>Suitable for pro streamers </p>
                        <div class="divider-light"></div>
                        <ul>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>All Lite games</li>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>All Premuim games</li>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>LifeTime</li>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>Change account</li>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>P1 Customer support</li>
                            <li><i></i>  </li>
                        </ul>
                        <!--<div class="text-center" data-toggle="modal" data-target="#my-modal" data-order="3">
                            <a href="#pricing" class="btn btn-buy">Buy now</a>
                        </div>-->
                        <a href="https://buy.stripe.com/8wM7vz0OO30zfpm14b" class="btn btn-buy" target="_blank">Buy now</a>

                    </div>
                </div>
                <div class="col-md-3">
                    <div class="pricing-box">
                        <h3>LifeTime VIP</h3>
                        <h6>€299</h6>
                        <small>lifetime updates</small>
                        <p> Suitable for pro streamers (long-term)</p>
                        <div class="divider-light"></div>
                        <ul>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>All Lite games</li>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>All Premuim games</li>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>LifeTime</li>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>Change account</li>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>P1 Customer support</li>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>New games </li>
                        </ul>
                        <!--<div class="text-center" data-toggle="modal" data-target="#my-modal" data-order="4">
                            <a href="#pricing" class="btn btn-buy">Buy now</a>
                        </div>-->
                        <a href="https://buy.stripe.com/8wMaHL9lkeJh7WU6ou" class="btn btn-buy" target="_blank">Buy now</a>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="pricing-box">
                        <h3>Company partner</h3>
                        <h6>Custom</h6>
                        <small>Multiple account Key</small>
                        <p>For agencies and businesses partner</p>
                        <div class="divider-light"></div>
                        <ul>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>All Lite games</li>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>All Premuim games</li>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>Special Keys</li>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>re-sell possible</li>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>Dashboard access</li>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>Multiple accounts</li>
                            <li><i class="icon ion-md-checkmark-circle-outline"></i>Custom games</li>
                        </ul>
                        <div class="text-center">
                            <a href="https://discord.com/invite/DGNFqNxMfm" class="btn btn-buy" target="_blank">Contact Now</a>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </section>
    <!-- E N D  Pricing -->
    <!-- Tutorial GUIDE  -->
    <section id="testimonials" style="width: 100%; height: 900px;">
        <div class="container">
            <div class="title-block">
                <h1><b>Platform Tutorial</b></h1>
                <p>Very easy to start streaming, all you is to follow our tutorial...</p>
                <p>If you bought from here, you will get the download link and key per email.</p>
            </div>
        </div>
        <iframe id="content-frame" src="games/allTutorial.html" style="width: 100%; height: 100%; border: none; box-shadow: none;"></iframe>
    </section>
    <!--<section id="testimonials">
        <div class="container">
            <div class="title-block">
                <h1><b>Platform Tutorial</b></h1>
                <p>Very easy to start streaming, all you is to follow our tutorial...</p>
                <p>If you bought from here, you will get the download link and key per email.</p>
            </div>
        </div>
        <style>
            .video-container {
                position: relative;
                padding-bottom: 56.25%; /* 16:9 aspect ratio (9 / 16 * 100%) */

                overflow: hidden;
                display: flex;
                justify-content: center;
                align-items: center;
                /* background: #FF5733;*/
            }

                .video-container iframe {
                    margin: auto; /* Center the iframe horizontally */
                    position: absolute;
                    top: 0;
                    width: 90%;
                    height: 100%;
                }
        </style>
        <div class="container">
            <div class="video-container">
                <iframe src="https://www.youtube.com/embed/s5i5ceVaiME?si=4j4AwUcBko28RjfE&amp;start=33"
                        title="YouTube video player"
                        frameborder="0"
                        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
                        allowfullscreen
                        style="border-radius: 15px; box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3); ">
                </iframe>
            </div>
        </div>
    </section>-->
    <!-- E N D  Tutorial GUIDE -->
    <!-- Frequently Asked Questions -->
    <style>
        .faq-item {
            border: 1px solid #ddd;
            margin-bottom: 20px;
            padding: 10px;
            border-radius: 5px;
        }

            .faq-item h3 {
                margin: 0;
                cursor: pointer;
                color: #333;
                display: flex;
                justify-content: space-between;
                align-items: center;
            }

            .faq-item .answer {
                display: none;
                margin-top: 10px;
                color: #666;
            }

            .faq-item p {
                font-size: 16px;
                font-weight: 300;
                margin-top: 25px;
                line-height: 1.8;
                padding: 0px;
            }

            .faq-item .collapse-button {
                background-color: transparent; /* No background color */
                color: #333; /* Text color */
                border: 1px solid #333; /* Border */
                padding: 5px 10px;
                cursor: pointer;
                width: 25px; /* Fixed width */
                height: 25px; /* Fixed height */
                border-radius: 5px;
                display: flex;
                justify-content: center;
                align-items: center;
            }

                .faq-item .collapse-button:hover {
                    color: #555; /* Text color on hover */
                }
    </style>
    <section id="faq">
        <div class="container">
            <div class="title-block">
                <h1><b>Frequently Asked Questions</b></h1>
            </div>

            <!-- FAQ Item 1 -->
            <div class="faq-item">
                <h3>How does it work? <button class="collapse-button">+</button></h3>
                <div class="answer">
                    <p>
                        After payment, you will receive an automatic email containing your ID and key.
                        Then you can start immediately streaming the games.
                    </p>
                </div>
            </div>

            <!-- FAQ Item 2 -->
            <div class="faq-item">
                <h3>How can I stream these games? <button class="collapse-button">+</button></h3>
                <div class="answer">
                    <p>
                        Currently, the games need a Windows PC. You can stream our games in two different modes:
                        <br>
                        - Using TikTok Live Studio (make sure you have already access from TikTok)
                        <br>
                        - Or using a mobile camera and point it to the computer screen. (the game will connect automatically)
                    </p>
                </div>
            </div>
            <!-- FAQ Item 3 -->
            <div class="faq-item">
                <h3>What are the requirement to go LIVE ? <button class="collapse-button">+</button></h3>
                <div class="answer">
                    <p>
                        You need either camera live access or tiktok live studio access:
                        <br>
                        - Camera live access: 1k follower
                        <br>
                        - Tiktok live studio access: depends on the country please search it on the internet.
                    </p>
                </div>
            </div>
            <!-- FAQ Item 4 -->
            <div class="faq-item">
                <h3>How much do you earn ? <button class="collapse-button">+</button></h3>
                <div class="answer">
                    <p>
                        It is completely random but usually from 3$ per day to 100$ (on the weekends …).
                        But nothing is guaranteed, it depends on your streaming skills and your account/follower/country etc. (this is only my experience).
                    </p>
                </div>
            </div>
            <!-- FAQ Item 5 -->
            <div class="faq-item">
                <h3>Do I get follower while streaming ? <button class="collapse-button">+</button></h3>
                <div class="answer">
                    <p>
                        Yes, it is not fixed but in my case +50, 500 up to 1k per day
                    </p>
                </div>
            </div>
            <!-- FAQ Item 6 -->
            <div class="faq-item">
                <h3>What should i know ? <button class="collapse-button">+</button></h3>
                <div class="answer">
                    <p>
                        The game can interacte automatically with Tiktok events: gifts, like, comment, share, follow... But It is recommended to animate your LIVE and interact with viewers (camera, mic etc).
                        Depends on the countries you can get a warning from Tiktok for inauthentic gift request.
                    </p>
                </div>
            </div>
            <!-- Add more FAQ items following the same pattern -->
        </div>
    </section>
    <script>
        // JavaScript to toggle the answers when the buttons are clicked
        const collapseButtons = document.querySelectorAll(".collapse-button");
        collapseButtons.forEach((button) => {
            button.addEventListener("click", () => {
                const answer = button.parentElement.nextElementSibling; // Get the next sibling, which is the answer
                const isCollapsed = answer.style.display === "none" || answer.style.display === "";
                answer.style.display = isCollapsed ? "block" : "none";
                button.textContent = isCollapsed ? "-" : "+";
            });
        });
    </script>
    <!-- E N D  Questions -->
    <!--
    Yes of course, if your TikTok account can obtain a stream key.
    Can I use this games if I can't LIVE with a PC yet?
    Yes you can, start LIVE stream with mobile game option or open the game on your laptop/pc and shoot directly with your phone camera.
    Can this games be opened in a mobile browser?
    Yes of course, our cloud-based game can be opened in any modern web browser.
    What payment methods do you accept?
    Paypal, USDT (Crypto), DANA, OVO, Gopay, & BNI

    -->
    <!-- CANCELED M O D A L -->

    <div class="container d-flex justify-content-center">
        <div id="my-modal23" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
            <div class="modal-dialog  modal-dialog-centered justify-content-center " role="document">
                <div class="modal-content  border-0 mx-3">
                    <div class="modal-body  p-0">
                        <div class="card border-0">
                            <div class="card-header pb-0  bg-white">
                                <div class="row">
                                    <div class="col-10"><h5 class="font-weight-bold mt-2">Order status </h5> </div>
                                    <div class="col-2 my-auto"> <span class="text-right"><button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">&times;</span> </button></span></div>
                                </div>
                            </div>
                            <div class="card-body">
                                <p class="text-muted text-left"> You have canceled order. Try again </p>
                                <!-- <img src="" class="img-fluid" />-->
                                <div class="row justify-content-center mt-4"><div class="col-6"><button type="button" class="btn btn-outline-success btn-block font-weight-bold text-dark" data-dismiss="modal">Okay</button></div></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- E N D  M O D A L -->
    <!-- SUCCESS M O D A L -->

    <div class="container d-flex justify-content-center">
        <div id="my-modal2" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
            <div class="modal-dialog  modal-dialog-centered justify-content-center " role="document">
                <div class="modal-content  border-0 mx-3">
                    <div class="modal-body  p-0">
                        <div class="card border-0">
                            <div class="card-header pb-0  bg-white">
                                <div class="row">
                                    <div class="col-10"><h5 class="font-weight-bold mt-2">Order status </h5> </div>
                                    <div class="col-2 my-auto"> <span class="text-right"><button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">&times;</span> </button></span></div>
                                </div>
                            </div>
                            <div class="card-body">
                                <p class="text-muted text-left"> We will send you an mail to the given e-mail address with access Token (Please check also spam folder)</p>
                                <!-- <img src="" class="img-fluid" />-->
                                <div class="row justify-content-center mt-4"><div class="col-6"><button type="button" class="btn btn-outline-success btn-block font-weight-bold text-dark" data-dismiss="modal">Okay</button></div></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- E N D  M O D A L -->
    <!-- M O D A L -->

    <div class="container d-flex justify-content-center">
        <div id="my-modal" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
            <div class="modal-dialog  modal-dialog-centered justify-content-center " role="document">
                <div class="modal-content  border-0 mx-3">
                    <div class="modal-body  p-0">
                        <div class="card border-0">
                            <div class="card-header pb-0  bg-white">
                                <div class="row">
                                    <div class="col-10"><h5 class="font-weight-bold mt-2" id="modal_title">Buy  </h5> </div>
                                    <div class="col-2 my-auto"> <span class="text-right"><button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">&times;</span> </button></span></div>
                                </div>
                            </div>
                            <div class="card-body">
                                <p class="text-muted text-left"> We need your TikTok @username to assign access Token. E-mail is used to send you confirmation and token info. </p>
                                <!-- <img src="" class="img-fluid" />-->
                                <div class="row justify-content-center mt-4">
                                    <div class="col-8">
                                        <input id="ttname" type="text" maxlength="32" placeholder="TikTok @username" />
                                        <input id="email" type="email" maxlength="64" placeholder="Email" />
                                    </div>
                                </div>

                                <p class="text-muted text-left">   </p>
                                <p class="text-muted text-left"> By purchasing access you agree to our <a href="term-of-service.html" target="_blank">Terms of Service</a> </p>
                                <!--
                                <div class="text-center">
                                    <a href="#pricing" class="btn btn-buy" id="buy_button" type="button" data-dismiss="modal" onclick="buy(1)" > PAY </a>
                                </div>
                                -->
                                <div class="row justify-content-center mt-4">
                                    <div class="col-6">
                                        <button id="buy_button" type="button" class="btn btn-outline-success btn-block font-weight-bold text-dark" data-dismiss="modal" onclick="buy(1)">
                                            PAY
                                        </button>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- E N D  M O D A L -->
    <!-- C A L L  T O  A C T I O N -->
    <!--
    <section id="call-to-action">
        <div class="container text-center">
            <h2>
                Start your streaming journey now
            </h2>
            <div class="title-block">
                <p>Grow your tiktok account, get more engament and have a passive income</p>
                <a href="#pricing" class="btn btn-regular">Get Started</a>
            </div>
        </div>
    </section>
          -->
    <!-- E N D  C A L L  T O  A C T I O N -->
    <!--  F O O T E R  -->
    <footer>
        <div class="container">
            <div class="row">
                <div class="col-md-3">
                    <h5>Game Streaming </h5>
                    <ul>
                        <li><a href="#pricing">Pricing</a></li>
                        <li><a href="#">Affiliate Program</a></li>
                        <li><a href="https://discord.com/invite/DGNFqNxMfm" target="_blank">Support</a></li>
                        <li><a href="https://youtu.be/s5i5ceVaiME" target="_blank">Video Tutorials</a></li>
                    </ul>
                </div>
                <div class="col-md-3">
                    <h5>Helpful links</h5>
                    <ul>
                        <li><a href="term-of-service.html" target="_blank">Terms of Service</a></li>
                        <li><a href="privacy-policy.html" target="_blank">Privacy Policy</a></li>
                        <li><a href="disclamer.html" target="_blank">Disclaimer</a></li>
                        <li><a href="#faq">FAQ</a></li>
                    </ul>
                </div>
                <div class="col-md-3">
                    <h5>BrainUser</h5>
                    <p>Game development, Streaming services and more... </p>
                    <p><a href="mailto:brainusernm@gmail.com" class="external-links">brain-user.com</a></p>
                    <div class="container">
                        <img src="images/paypal.png" alt="PayPal Logo" style="width: 70px; margin-right: 10px;">
                        <img src="images/visa.png" alt="Visa Logo" style="width: 40px; margin-right: 10px;">
                        <img src="images/master.png" alt="Mastercard Logo" style="width: 30px; margin-right: 10px;">
                    </div>
                </div>
                <!--<div class="col-md-3">
                    <h5>Payment Methods</h5>
                        <img src="images/paypal.png" alt="PayPal Logo" style="width: 50px; margin-right: 10px;">
                        <img src="images/visa.png" alt="Visa Logo" style="width: 50px; margin-right: 10px;">
                        <img src="images/master.png" alt="Mastercard Logo" style="width: 50px; margin-right: 10px;">
                </div>-->
            </div>
            <div class="divider"></div>
            <div class="row">
                <div class="col-md-6 col-xs-12">
                    <a href="https://www.facebook.com/Brain-User-104055804804539" target="_blank"><i class="icon ion-logo-facebook"></i></a>
                    <a href="https://www.instagram.com/brainusermn/" target="_blank"><i class="icon ion-logo-instagram"></i></a>
                    <a href="https://discord.com/invite/DGNFqNxMfm" target="_blank"><i class="icon ion-logo-twitter"></i></a>
                    <a href="https://www.youtube.com/channel/UCraYyvbQu547a11Lgr81I7Q" target="_blank"><i class="icon ion-logo-youtube"></i></a>
                </div>
                <div class="col-md-6 col-xs-12">
                    <small>2023 &copy; All rights reserved.</small>
                </div>
            </div>
        </div>
    </footer>
    <!--  E N D  F O O T E R  -->
    <!-- External JavaScripts -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T" crossorigin="anonymous"></script>
    <script src="scripts/script.js"></script>
</body>
</html>