<!DOCTYPE html>
<html lang="en">
<head>
<meta 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.0, user-scalable=0">

<title>BLUE AI</title>

<!-- Fav Icon -->
<link rel="icon" href="../static/images/favicon.ico" type="image/x-icon">

<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600;700;800&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet">

<!-- Stylesheets -->
<link href="../static/css/font-awesome-all.css" rel="stylesheet">
<link href="../static/css/flaticon.css" rel="stylesheet">
<link href="../static/css/owl.css" rel="stylesheet">
<link href="../static/css/bootstrap.css" rel="stylesheet">
<link href="../static/css/jquery.fancybox.min.css" rel="stylesheet">
<link href="../static/css/animate.css" rel="stylesheet">
<link href="../static/css/nice-select.css" rel="stylesheet">
<link href="../static/css/elpath.css" rel="stylesheet">
<link href="../static/css/color/theme-color.css" id="jssDefault" rel="stylesheet">
<link href="../static/css/switcher-style.css" rel="stylesheet">
<link href="../static/css/rtl.css" rel="stylesheet">
<link href="../static/css/style.css" rel="stylesheet">
<link href="../static/css/module-css/banner.css" rel="stylesheet">
<link href="../static/css/module-css/feature.css" rel="stylesheet">
<link href="../static/css/module-css/about.css" rel="stylesheet">
<link href="../static/css/module-css/service.css" rel="stylesheet">
<link href="../static/css/module-css/calculator.css" rel="stylesheet">
<link href="../static/css/module-css/video.css" rel="stylesheet">
<link href="../static/css/module-css/funfact.css" rel="stylesheet">
<link href="../static/css/module-css/apps.css" rel="stylesheet">
<link href="../static/css/module-css/testimonial.css" rel="stylesheet">
<link href="../static/css/module-css/news.css" rel="stylesheet">
<link href="../static/css/module-css/subscribe.css" rel="stylesheet">
<link href="../static/css/responsive.css" rel="stylesheet">

</head>


<!-- page wrapper -->
<body>

    <div class="boxed_wrapper ltr">


        <!-- preloader -->
        <div class="loader-wrap">
            <div class="preloader">
                <div class="preloader-close">close</div>
                <div id="handle-preloader" class="handle-preloader">
                    <div class="animation-preloader">
                        <div class="spinner"></div>
                        <div class="txt-loading">
                            <span data-text-preloader="b" class="letters-loading">
                                b
                            </span>
                            <span data-text-preloader="l" class="letters-loading">
                                l
                            </span>
                            <span data-text-preloader="u" class="letters-loading">
                                u
                            </span>
                            <span data-text-preloader="e" class="letters-loading">
                                e
                            </span>
                            <span data-text-preloader="a" class="letters-loading">
                                a
                            </span>
                            <span data-text-preloader="i" class="letters-loading">
                                i
                            </span>
                        </div>
                    </div>  
                </div>
            </div>
        </div>
        <!-- preloader end -->


        <!-- page-direction -->
        <div class="page_direction">
            <div class="demo-rtl direction_switch"><button class="rtl">RTL</button></div>
            <div class="demo-ltr direction_switch"><button class="ltr">LTR</button></div>
        </div>
        <!-- page-direction end -->


        <!-- switcher menu -->
        <div class="switcher">
            <div class="switch_btn">
                <button><i class="fas fa-palette"></i></button>
            </div>
            <div class="switch_menu">
                <!-- color changer -->
                <div class="switcher_container">
                    <ul id="styleOptions" title="switch styling">
                        <li>
                            <a href="javascript: void(0)" data-theme="theme-color" class="theme-color"></a>
                        </li>
                        <li>
                            <a href="javascript: void(0)" data-theme="pink" class="pink-color"></a>
                        </li>
                        <li>
                            <a href="javascript: void(0)" data-theme="violet" class="violet-color"></a>
                        </li>
                        <li>
                            <a href="javascript: void(0)" data-theme="crimson" class="crimson-color"></a>
                        </li>
                        <li>
                            <a href="javascript: void(0)" data-theme="orange" class="orange-color"></a>
                        </li>
                    </ul>
                </div> 
            </div>
        </div>
        <!-- end switcher menu -->


        <!-- main header -->
        <header class="main-header">
            <!-- header-top -->
            <div class="header-top">
                <div class="large-container">
                    <div class="top-inner">
                        <ul class="links-list clearfix">
                            <li><a href="index.html">Career</a></li>
                            <li><a href="index.html">Faq</a></li>
                            <li><a href="index.html">Rewards</a></li>
                            <li><a href="index.html">Media</a></li>
                        </ul>
                        <ul class="info-list clearfix"> 
                            <li>
                                <i class="icon-1"></i>
                                <a href="mailto:attul@redoctopusinnovation.com">attul@redoctopusinnovation.com</a>
                            </li>
                            <li>
                                <i class="icon-2"></i>
                                Find Nearest Branch
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <!-- header-lower -->
            <div class="header-lower">
                <div class="large-container">
                    <div class="outer-box">
                        <div class="logo-box">
                            <div class="shape"></div>
                            <figure class="logo"><a href="index.html"><img src="../static/images/logo.png" alt=""></a></figure>
                        </div>
                        <div class="menu-area">
                            <!--Mobile Navigation Toggler-->
                            <div class="mobile-nav-toggler">
                                <i class="icon-bar"></i>
                                <i class="icon-bar"></i>
                                <i class="icon-bar"></i>
                            </div>
                            <nav class="main-menu navbar-expand-md navbar-light clearfix">
                                <div class="collapse navbar-collapse show clearfix" id="navbarSupportedContent">
                                    <ul class="navigation clearfix">
                                        <li class="current dropdown"><a href="index.html">Home</a>
                                            <ul>
                                                <li><a href="index.html">Home Page One</a></li>
                                                <li><a href="index-2.html">Home Page Two</a></li>
                                                <li><a href="index-3.html">Home Page Three</a></li>
                                                <li><a href="index-onepage.html">OnePage Home</a></li>
                                            </ul>
                                        </li> 
                                        <li><a href="about.html">About</a></li>
                                        <li class="dropdown"><a href="index.html">Services</a>
                                            <ul>
                                                <li><a href="service.html">Our Services</a></li>
                                                <li><a href="service-2.html">Our Services 2</a></li>
                                                <li><a href="service-details.html">Digital Banking</a></li>
                                                <li><a href="service-details-2.html">Mobile & Web Banking</a></li>
                                                <li><a href="service-details-3.html">Insurance Policies</a></li>
                                                <li><a href="service-details-4.html">Home & Property Loan</a></li>
                                                <li><a href="service-details-5.html">All Bank Account</a></li>
                                                <li><a href="service-details-6.html">Borrowing Accounts</a></li>
                                                <li><a href="service-details-7.html">Private Banking</a></li>
                                                <li><a href="service-details-8.html">Fixed Term Account</a></li>
                                            </ul>
                                        </li> 
                                        <li class="dropdown"><a href="index.html">Pages</a>
                                            <ul>
                                                <li class="dropdown"><a href="index.html">Directors</a>
                                                    <ul>
                                                        <li><a href="team.html">Board of Directors</a></li>
                                                        <li><a href="team-details.html">Director Details</a></li>
                                                    </ul>
                                                </li>
                                                <li class="dropdown"><a href="index.html">Career</a>
                                                    <ul>
                                                        <li><a href="career.html">Career Page</a></li>
                                                        <li><a href="career-details.html">Career Details</a></li>
                                                    </ul>
                                                </li>
                                                <li class="dropdown"><a href="index.html">Blog</a>
                                                    <ul>
                                                        <li><a href="blog.html">Blog Grid</a></li>
                                                        <li><a href="blog-2.html">Blog Image</a></li>
                                                        <li><a href="blog-3.html">Blog Standard</a></li>
                                                        <li><a href="blog-details.html">Blog Details</a></li>
                                                    </ul>
                                                </li>
                                                <li><a href="currency.html">Currency Exchange</a></li>
                                                <li><a href="credit-cards.html">Credit Cards</a></li>
                                                <li><a href="faq.html">General FAQ’s</a></li>
                                                <li><a href="error.html">404 Error</a></li>
                                            </ul>
                                        </li> 
                                        <li><a href="contact.html">Contact</a></li> 
                                    </ul>
                                </div>
                            </nav>
                            <div class="menu-right-content ml_70">
                                <a href="/login" class="theme-btn btn-two mr_20">Login</a>
                                <a href="/register" class="theme-btn btn-one">Register Your Team</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!--sticky Header-->
            <div class="sticky-header">
                <div class="large-container">
                    <div class="outer-box">
                        <div class="logo-box">
                            <div class="shape"></div>
                            <figure class="logo"><a href="index.html"><img src="../static/images/logo.png" alt=""></a></figure>
                        </div>
                        <div class="menu-area">
                            <nav class="main-menu clearfix">
                                <!--Keep This Empty / Menu will come through Javascript-->
                            </nav>
                            <div class="menu-right-content ml_70">
                                <a href="/login" class="theme-btn btn-two mr_20">Login</a>
                                <a href="/register" class="theme-btn btn-one">Register Your Team</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </header>
        <!-- main-header end -->


        <!-- Mobile Menu  -->
        <div class="mobile-menu">
            <div class="menu-backdrop"></div>
            <div class="close-btn"><i class="fas fa-times"></i></div>
            
            <nav class="menu-box">
                <div class="nav-logo"><a href="index.html"><img src="../static/images/logo.png" alt="" title=""></a></div>
                <div class="menu-outer"><!--Here Menu Will Come Automatically Via Javascript / Same Menu as in Header--></div>
                <div class="contact-info">
                    <h4>Contact Info</h4>
                    <ul>
                        <li>Chicago 12, Melborne City, USA</li>
                        <li><a href="tel:+8801682648101">+88 01682648101</a></li>
                        <li><a href="mailto:attul@redoctopusinnovation.com">attul@redoctopusinnovation.com</a></li>
                    </ul>
                </div>
                <div class="social-links">
                    <ul class="clearfix">
                        <li><a href="index.html"><span class="fab fa-twitter"></span></a></li>
                        <li><a href="index.html"><span class="fab fa-facebook-square"></span></a></li>
                        <li><a href="index.html"><span class="fab fa-pinterest-p"></span></a></li>
                        <li><a href="index.html"><span class="fab fa-instagram"></span></a></li>
                        <li><a href="index.html"><span class="fab fa-youtube"></span></a></li>
                    </ul>
                </div>
            </nav>
        </div><!-- End Mobile Menu -->


        <!-- banner-section -->
        <section class="banner-section p_relative">
            <div class="banner-carousel owl-theme owl-carousel owl-dots-none">
                <div class="slide-item p_relative">
                    <div class="bg-layer" style="background-image: url(../static/images/banner/banner-1.jpg);"></div>
                    <div class="pattern-layer">
                        <div class="pattern-1" style="background-image: url(../static/images/shape/shape-1.png);"></div>
                        <div class="pattern-2" style="background-image: url(../static/images/shape/shape-2.png);"></div>
                    </div>
                    <div class="auto-container">
                        <div class="content-box">
                            <h2>Start playing <span>Best Marketing Simulation</span> Game</h2>
                            <p>Blue AI presents <span>The only Marketing Simulation Game</span> which enables you to learn how to target the most complicated of demographics to launch your products and make them a success.</p>
                            <div class="btn-box">
                                <a href="index.html" class="theme-btn btn-one">Start Now</a>
                            </div>
                        </div> 
                    </div>
                </div>
                <div class="slide-item p_relative">
                    <div class="bg-layer" style="background-image: url(../static/images/banner/banner-2.jpg);"></div>
                    <div class="pattern-layer">
                        <div class="pattern-1" style="background-image: url(../static/images/shape/shape-1.png);"></div>
                        <div class="pattern-2" style="background-image: url(../static/images/shape/shape-2.png);"></div>
                    </div>
                    <div class="auto-container">
                        <div class="content-box">
                            <h2>Start playing <span>Best Marketing Simulation</span> Game</h2>
                            <p>Blue AI presents <span>The only Marketing Simulation Game</span> which enables you to learn how to target the most complicated of demographics to launch your products and make them a success.</p>
                            <div class="btn-box">
                                <a href="index.html" class="theme-btn btn-one">Start Now</a>
                            </div>
                        </div> 
                    </div>
                </div>
                <div class="slide-item p_relative">
                    <div class="bg-layer" style="background-image: url(../static/images/banner/banner-3.jpg);"></div>
                    <div class="pattern-layer">
                        <div class="pattern-1" style="background-image: url(../static/images/shape/shape-1.png);"></div>
                        <div class="pattern-2" style="background-image: url(../static/images/shape/shape-2.png);"></div>
                    </div>
                    <div class="auto-container">
                        <div class="content-box">
                            <h2>Start playing <span>Best Marketing Simulation</span> Game</h2>
                            <p>Blue AI presents <span>The only Marketing Simulation Game</span> which enables you to learn how to target the most complicated of demographics to launch your products and make them a success.</p>
                            <div class="btn-box">
                                <a href="index.html" class="theme-btn btn-one">Start Now</a>
                            </div>
                        </div>  
                    </div>
                </div>
            </div>
        </section>
        <!-- banner-section end -->


        <!-- feature-section -->
        <section class="feature-section">
            <div class="auto-container">
                <div class="inner-container clearfix wow fadeInLeft animated" data-wow-delay="00ms" data-wow-duration="1500ms">
                    <div class="feature-block-one">
                        <div class="inner-box">
                            <div class="icon-box"><i class="icon-5"></i></div>
                            <h4><a href="index.html">Secure International Transaction</a></h4>
                            <p>Tortor neque sed tellus estian eget dui id ante tristique more tristique dolor.</p>
                        </div>
                    </div>
                    <div class="feature-block-one">
                        <div class="inner-box">
                            <div class="icon-box"><i class="icon-6"></i></div>
                            <h4><a href="index.html">24/7 Support from the Expert Team</a></h4>
                            <p>Tortor neque sed tellus estian eget dui id ante tristique more tristique dolor.</p>
                        </div>
                    </div>
                    <div class="feature-block-one">
                        <div class="inner-box">
                            <div class="icon-box"><i class="icon-7"></i></div>
                            <h4><a href="index.html">Lowest Processing Fee than Other Banks</a></h4>
                            <p>Tortor neque sed tellus estian eget dui id ante tristique more tristique dolor.</p>
                        </div>
                    </div>
                    <div class="feature-block-one">
                        <div class="inner-box">
                            <div class="icon-box"><i class="icon-8"></i></div>
                            <h4><a href="index.html">Less Time in any Loans Approval</a></h4>
                            <p>Tortor neque sed tellus estian eget dui id ante tristique more tristique dolor.</p>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- feature-section end -->


        <!-- about-section -->
        <section class="about-section pt_120 pb_120">
            <div class="pattern-layer rotate-me"></div>
            <div class="auto-container">
                <div class="row clearfix">
                    <div class="col-lg-6 col-md-12 col-sm-12 image-column">
                        <div class="image_block_one">
                            <div class="image-box pr_90 mr_40">
                                <div class="image-shape" style="background-image: url(../static/images/shape/shape-3.png);"></div>
                                <figure class="image"><img src="../static/images/resource/about-1.jpg" alt=""></figure>
                                <div class="rating-box">
                                    <ul class="rating mb_5 clearfix">
                                        <li><i class="icon-9"></i></li>
                                        <li><i class="icon-9"></i></li>
                                        <li><i class="icon-9"></i></li>
                                        <li><i class="icon-9"></i></li>
                                        <li><i class="icon-9"></i></li>
                                    </ul>
                                    <h6>5 Star Rating Bank</h6>
                                </div>
                                <div class="experience-box">
                                    <div class="inner">
                                        <h2>40</h2>
                                        <h6>Years of Experiense</h6>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-12 col-sm-12 content-column">
                        <div class="content_block_one">
                            <div class="content-box ml_40">
                                <div class="sec-title mb_20">
                                    <h6>About US</h6>
                                    <h2>Financial Guidance for Every Stage of Life.</h2>
                                </div>
                                <div class="text-box mb_40">
                                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec felis, suscipit you take action against fraud. See it the Security Center for and Mobile and Online Banking.</p>
                                </div>
                                <div class="inner-box mb_45">
                                    <div class="single-item">
                                        <div class="icon-box"><i class="icon-10"></i></div>
                                        <h3>Solution Focused</h3>
                                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec felis tincidunt feugiat</p>
                                    </div>
                                    <div class="single-item">
                                        <div class="icon-box"><i class="icon-11"></i></div>
                                        <h3>99.99% Success</h3>
                                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec felis tincidunt feugiat</p>
                                    </div>
                                </div>
                                <div class="btn-box">
                                    <a href="index.html" class="theme-btn btn-one">Discover More</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- about-section end -->


        <!-- service-section -->
        <section class="service-section pt_120 pb_90">
            <div class="bg-layer" style="background-image: url(../static/images/background/service-bg.jpg);"></div>
            <div class="auto-container">
                <div class="sec-title centred mb_60">
                    <h6>Our Services</h6>
                    <h2>Online Banking at Your <br />Fingertips</h2>
                </div>
                <div class="row clearfix">
                    <div class="col-lg-3 col-md-6 col-sm-12 service-block">
                        <div class="service-block-one wow fadeInUp animated" data-wow-delay="00ms" data-wow-duration="1500ms">
                            <div class="inner-box">
                                <div class="shape"></div>
                                <div class="icon-box"><i class="icon-12"></i></div>
                                <h4><a href="service-details.html">Digital Banking</a></h4>
                                <ul class="list-item clearfix">
                                    <li>Bank & savings accounts</li>
                                    <li>Credit cards</li>
                                    <li>Personal loans</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-6 col-sm-12 service-block">
                        <div class="service-block-one wow fadeInUp animated" data-wow-delay="300ms" data-wow-duration="1500ms">
                            <div class="inner-box">
                                <div class="shape"></div>
                                <div class="icon-box"><i class="icon-13"></i></div>
                                <h4><a href="service-details-2.html">Mobile & Web Banking</a></h4>
                                <ul class="list-item clearfix">
                                    <li>Instant Access</li>
                                    <li>Savings Fixed Term</li>
                                    <li>Savings Instant</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-6 col-sm-12 service-block">
                        <div class="service-block-one wow fadeInUp animated" data-wow-delay="600ms" data-wow-duration="1500ms">
                            <div class="inner-box">
                                <div class="shape"></div>
                                <div class="icon-box"><i class="icon-14"></i></div>
                                <h4><a href="service-details-3.html">Insurance Policies</a></h4>
                                <ul class="list-item clearfix">
                                    <li>Pet insurance</li>
                                    <li>Transport Insurance</li>
                                    <li>Accident insurance</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-6 col-sm-12 service-block">
                        <div class="service-block-one wow fadeInUp animated" data-wow-delay="900ms" data-wow-duration="1500ms">
                            <div class="inner-box">
                                <div class="shape"></div>
                                <div class="icon-box"><i class="icon-15"></i></div>
                                <h4><a href="service-details-4.html">Home & Property Loan</a></h4>
                                <ul class="list-item clearfix">
                                    <li>Residential Mortgages</li>
                                    <li>Buy-to-let Mortgages</li>
                                    <li>Building Mortgages</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-6 col-sm-12 service-block">
                        <div class="service-block-one wow fadeInUp animated" data-wow-delay="00ms" data-wow-duration="1500ms">
                            <div class="inner-box">
                                <div class="shape"></div>
                                <div class="icon-box"><i class="icon-16"></i></div>
                                <h4><a href="service-details-5.html">All Bank Account</a></h4>
                                <ul class="list-item clearfix">
                                    <li>nstant Access Savings</li>
                                    <li>Instant Access Cash</li>
                                    <li>Young Savers Account</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-6 col-sm-12 service-block">
                        <div class="service-block-one wow fadeInUp animated" data-wow-delay="300ms" data-wow-duration="1500ms">
                            <div class="inner-box">
                                <div class="shape"></div>
                                <div class="icon-box"><i class="icon-17"></i></div>
                                <h4><a href="service-details-6.html">borrowing accounts</a></h4>
                                <ul class="list-item clearfix">
                                    <li>Bank Credit Card</li>
                                    <li>Setter personal loan</li>
                                    <li>Overdraft</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-6 col-sm-12 service-block">
                        <div class="service-block-one wow fadeInUp animated" data-wow-delay="600ms" data-wow-duration="1500ms">
                            <div class="inner-box">
                                <div class="shape"></div>
                                <div class="icon-box"><i class="icon-18"></i></div>
                                <h4><a href="service-details-7.html">Private Banking</a></h4>
                                <ul class="list-item clearfix">
                                    <li>Dedicated personal service</li>
                                    <li>Specialist teams</li>
                                    <li>Tailored products</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-3 col-md-6 col-sm-12 service-block">
                        <div class="service-block-one wow fadeInUp animated" data-wow-delay="900ms" data-wow-duration="1500ms">
                            <div class="inner-box">
                                <div class="shape"></div>
                                <div class="icon-box"><i class="icon-19"></i></div>
                                <h4><a href="service-details-8.html">Fixed term accounts</a></h4>
                                <ul class="list-item clearfix">
                                    <li>Fixed Term Saving</li>
                                    <li>Fixed Rate Cash</li>
                                    <li>Resume your Current</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- service-section end -->


        <!-- calculator-section -->
        <section class="calculator-section pt_120 pb_120">
            <div class="light-icon float-bob-y" style="background-image: url(../static/images/icons/icon-1.png);"></div>
            <div class="auto-container">
                <div class="inner-container">
                    <div class="shape" style="background-image: url(../static/images/shape/shape-3.png);"></div>
                    <div class="row clearfix">
                        <div class="col-lg-6 col-md-12 col-sm-12 content-column">
                            <div class="content_block_two">
                                <div class="content-box">
                                    <div class="sec-title mb_50">
                                        <h6>Calculate Loan</h6>
                                        <h2>Online EMI Calculator</h2>
                                    </div>
                                    <div class="calculator-inner">
                                        <form id="loan-form">
                                            <div class="form-group">
                                                <div class="input-group">
                                                    <input type="number" id="amount" placeholder="Loan amount">
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <input type="number" id="years" placeholder="Number of months">
                                            </div>
                                            <div class="form-group">
                                                <div class="input-group">
                                                    <input type="number" id="interest" placeholder="Interest rate">
                                                </div>
                                            </div>
                                            <div class="form-group d-flex">
                                                <input type="submit" value="Calculate" class="theme-btn btn-one mr_20">
                                                <input type="button" value="Reset Data" class="reset-btn">
                                            </div> 
                                        </form>
                                        <div id="results">
                                            <div class="form-group">
                                                <div class="input-group">
                                                    <input type="number" placeholder="Monthly Installment is" id="monthly-payment" disabled>
                                                </div>
                                            </div>
                                            <div class="form-group none">
                                                <div class="input-group">
                                                    <input type="number" id="total-payment" disabled>
                                                </div>
                                            </div>
                                            <div class="form-group none">
                                                <div class="input-group">
                                                    <input type="number" id="total-interest" disabled>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-6 col-md-12 col-sm-12 image-column">
                            <figure class="image-box"><img src="../static/images/resource/calculator-1.jpg" alt=""></figure>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- calculator-section end -->


        <!-- video-section -->
        <section class="video-section centred">
            <div class="bg-layer parallax-bg" data-parallax='{"y": 100}' style="background-image: url(../static/images/background/video-bg.jpg);"></div>
            <div class="auto-container">
                <div class="inner-box">
                    <h2>The 3rd Generation Private Commercial Bank</h2>
                    <div class="video-btn">
                        <a href="https://www.youtube.com/watch?v=nfP5N9Yc72A&amp;t=28s" class="lightbox-image" data-caption="">
                            <i class="icon-20"></i>
                            <span class="border-animation border-1"></span>
                            <span class="border-animation border-2"></span>
                            <span class="border-animation border-3"></span>
                        </a>
                    </div>
                </div>
            </div>
        </section>
        <!-- video-section end -->


        <!-- funfact-section -->
        <section class="funfact-section">
            <div class="auto-container">
                <div class="inner-container clearfix">
                    <div class="funfact-block-one">
                        <div class="inner-box">
                            <div class="icon-box"><i class="icon-21"></i></div>
                            <div class="count-outer count-box">
                                <span class="count-text" data-speed="1500" data-stop="50">0</span><span>k+</span>
                            </div>
                            <p>Happy Clients</p>
                        </div>
                    </div>
                    <div class="funfact-block-one">
                        <div class="inner-box">
                            <div class="icon-box"><i class="icon-22"></i></div>
                            <div class="count-outer count-box">
                                <span class="count-text" data-speed="1500" data-stop="90">0</span><span>Bn</span>
                            </div>
                            <p>Total Transection</p>
                        </div>
                    </div>
                    <div class="funfact-block-one">
                        <div class="inner-box">
                            <div class="icon-box"><i class="icon-23"></i></div>
                            <div class="count-outer count-box">
                                <span class="count-text" data-speed="1500" data-stop="40">0</span><span>+</span>
                            </div>
                            <p>Branchs in USA</p>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- funfact-section end -->


        <!-- apps-section -->
        <section class="apps-section pt_120 pb_120">
            <div class="light-icon" style="background-image: url(../static/images/icons/icon-4.png);"></div>
            <div class="auto-container">
                <div class="inner-container">
                    <div class="shape">
                        <div class="shape-1" style="background-image: url(../static/images/shape/shape-4.png);"></div>
                        <div class="shape-2" style="background-image: url(../static/images/shape/shape-3.png);"></div>
                    </div>
                    <div class="row align-items-center">
                        <div class="col-lg-6 col-md-12 col-sm-12 image-column">
                            <div class="image-box">
                                <figure class="image image-1"><img src="../static/images/resource/mockup-1.png" alt=""></figure>
                                <figure class="image image-2"><img src="../static/images/resource/mockup-2.png" alt=""></figure>
                            </div>
                        </div>
                        <div class="col-lg-6 col-md-12 col-sm-12 content-column">
                            <div class="content-box">
                                <div class="sec-title mb_20">
                                    <h6>Mobile App</h6>
                                    <h2>Get the Fastest and Most Secure Banking</h2>
                                </div>
                                <div class="text-box mb_50">
                                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec felis, suscipit you take action against fraud. See it the Security Center for and Mobile and Online Banking.</p>
                                </div>
                                <div class="btn-box">
                                    <a href="index.html" class="play-store mr_20">
                                        <img src="../static/images/icons/icon-2.png" alt="">
                                        <span>get it on</span>
                                        Google Play
                                    </a>
                                    <a href="index.html" class="play-store">
                                        <img src="../static/images/icons/icon-3.png" alt="">
                                        <span>Download on the</span>
                                        App Store
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- apps-section end -->


        <!-- testimonial-section -->
        <section class="testimonial-section centred pt_120 pb_120">
            <div class="bg-layer" style="background-image: url(../static/images/background/testimonial-bg.jpg);"></div>
            <div class="auto-container">
                <div class="sec-title mb_70">
                    <h6>Testimonials</h6>
                    <h2>Love from Our Clients</h2>
                </div>
                <div class="three-item-carousel owl-carousel owl-theme owl-dots-none owl-nav-none">
                    <div class="testimonial-block-one">
                        <div class="inner-box">
                            <figure class="thumb-box"><img src="../static/images/resource/testimonial-1.png" alt=""></figure>
                            <h4>Sandra Bullock</h4>
                            <span class="designation">Manager</span>
                            <ul class="rating mb_6 clearfix">
                                <li><i class="icon-26"></i></li>
                                <li><i class="icon-26"></i></li>
                                <li><i class="icon-26"></i></li>
                                <li><i class="icon-26"></i></li>
                                <li><i class="icon-26"></i></li>
                            </ul>
                            <p>“Lorem ipsum dolor sit amet consectetur adipiscing elit pellentesque etiam nis quis at arcu nunc neque ac integer sit lobortis diam semper nulla duis in blandit.”</p>
                        </div>
                    </div>
                    <div class="testimonial-block-one">
                        <div class="inner-box">
                            <figure class="thumb-box"><img src="../static/images/resource/testimonial-2.png" alt=""></figure>
                            <h4>Julien Anthor</h4>
                            <span class="designation">Manager</span>
                            <ul class="rating mb_6 clearfix">
                                <li><i class="icon-26"></i></li>
                                <li><i class="icon-26"></i></li>
                                <li><i class="icon-26"></i></li>
                                <li><i class="icon-26"></i></li>
                                <li><i class="icon-26"></i></li>
                            </ul>
                            <p>“Lorem ipsum dolor sit amet consectetur adipiscing elit pellentesque etiam nis quis at arcu nunc neque ac integer sit lobortis diam semper nulla duis in blandit.”</p>
                        </div>
                    </div>
                    <div class="testimonial-block-one">
                        <div class="inner-box">
                            <figure class="thumb-box"><img src="../static/images/resource/testimonial-3.png" alt=""></figure>
                            <h4>Rolier Demonil</h4>
                            <span class="designation">Manager</span>
                            <ul class="rating mb_6 clearfix">
                                <li><i class="icon-26"></i></li>
                                <li><i class="icon-26"></i></li>
                                <li><i class="icon-26"></i></li>
                                <li><i class="icon-26"></i></li>
                                <li><i class="icon-26"></i></li>
                            </ul>
                            <p>“Lorem ipsum dolor sit amet consectetur adipiscing elit pellentesque etiam nis quis at arcu nunc neque ac integer sit lobortis diam semper nulla duis in blandit.”</p>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- testimonial-section end -->


        <!-- news-section -->
        <section class="news-section pt_120 pb_90">
            <div class="pattern-layer">
                <div class="pattern-1" style="background-image: url(../static/images/shape/shape-6.png);"></div>
                <div class="pattern-2" style="background-image: url(../static/images/shape/shape-7.png);"></div>
            </div>
            <div class="auto-container">
                <div class="sec-title centred mb_70">
                    <h6>Latest News</h6>
                    <h2>Our Latest Media Update</h2>
                </div>
                <div class="row clearfix">
                    <div class="col-lg-4 col-md-6 col-sm-12 news-block">
                        <div class="news-block-one wow fadeInUp animated" data-wow-delay="00ms" data-wow-duration="1500ms">
                            <div class="inner-box" style="background-image: url(../static/images/news/news-1.jpg);">
                                <div class="content-box">
                                    <span class="post-date"><i class="icon-27"></i>Apr 17, 2022</span>
                                    <h3><a href="blog-details.html">Self-Guided Driving & Tours Walk Of Greater City</a></h3>
                                    <ul class="post-info mb_25">
                                        <li><i class="icon-28"></i><a href="blog-details.html">Admin</a></li>
                                        <li><i class="icon-29"></i>0 Comment</li>
                                    </ul>
                                    <div class="btn-box"><a href="blog-details.html" class="theme-btn btn-three">Read More</a></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4 col-md-6 col-sm-12 news-block">
                        <div class="news-block-one wow fadeInUp animated" data-wow-delay="300ms" data-wow-duration="1500ms">
                            <div class="inner-box" style="background-image: url(../static/images/news/news-2.jpg);">
                                <div class="content-box">
                                    <span class="post-date"><i class="icon-27"></i>Apr 16, 2022</span>
                                    <h3><a href="blog-details.html">Assistance For Homes & Properties Real Estate</a></h3>
                                    <ul class="post-info mb_25">
                                        <li><i class="icon-28"></i><a href="blog-details.html">Admin</a></li>
                                        <li><i class="icon-29"></i>4 Comment</li>
                                    </ul>
                                    <div class="btn-box"><a href="blog-details.html" class="theme-btn btn-three">Read More</a></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-4 col-md-6 col-sm-12 news-block">
                        <div class="news-block-one wow fadeInUp animated" data-wow-delay="600ms" data-wow-duration="1500ms">
                            <div class="inner-box" style="background-image: url(../static/images/news/news-3.jpg);">
                                <div class="content-box">
                                    <span class="post-date"><i class="icon-27"></i>Apr 15, 2022</span>
                                    <h3><a href="blog-details.html">Long-Term Vision Of Health & Attractive Facility</a></h3>
                                    <ul class="post-info mb_25">
                                        <li><i class="icon-28"></i><a href="blog-details.html">Admin</a></li>
                                        <li><i class="icon-29"></i>1 Comment</li>
                                    </ul>
                                    <div class="btn-box"><a href="blog-details.html" class="theme-btn btn-three">Read More</a></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- news-section end -->


        <!-- subscribe-section -->
        <section class="subscribe-section">
            <div class="pattern-layer" style="background-image: url(../static/images/shape/shape-5.png);"></div>
            <div class="auto-container">
                <div class="row align-items-center">
                    <div class="col-lg-6 col-md-12 col-sm-12 text-column">
                        <div class="text-box">
                            <h2>Subscribe us to Recieve Latest Updates</h2>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-12 col-sm-12 form-column">
                        <div class="form-inner ml_40">
                            <form method="post" action="contact.html">
                                <div class="form-group">
                                    <input type="email" name="email" placeholder="Your email" required>
                                    <button type="submit" class="theme-btn btn-two">Subscribe Now</button>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- subscribe-section end -->


        <!-- main-footer -->
        <footer class="main-footer">
            <div class="widget-section">
                <div class="pattern-layer">
                    <div class="pattern-1" style="background-image: url(../static/images/shape/shape-8.png);"></div>
                    <div class="pattern-2" style="background-image: url(../static/images/shape/shape-9.png);"></div>
                </div>
                <div class="auto-container">
                    <div class="row clearfix">
                        <div class="col-lg-3 col-md-6 col-sm-12 footer-column">
                            <div class="footer-widget logo-widget">
                                <figure class="footer-logo"><a href="index.html"><img src="../static/images/logo-2.png" alt=""></a></figure>
                                <p>Tincidunt neque pretium lectus donec risus. Mauris mi tempor nunc orc leo consequat vitae erat gravida lobortis nec et sagittis.</p>
                                <ul class="social-links">
                                    <li><a href="index.html"><i class="fab fa-facebook-f"></i></a></li>
                                    <li><a href="index.html"><i class="fab fa-twitter"></i></a></li>
                                    <li><a href="index.html"><i class="fab fa-instagram"></i></a></li>
                                </ul>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-6 col-sm-12 footer-column">
                            <div class="footer-widget links-widget ml_40">
                                <div class="widget-title">
                                    <h4>Explore</h4>
                                </div>
                                <div class="widget-content">
                                    <ul class="links-list clearfix">
                                        <li><a href="about.html">About Us</a></li>
                                        <li><a href="index.html">Testimonials</a></li>
                                        <li><a href="career.html">Careers</a></li>
                                        <li><a href="career-details.html">Career Detail</a></li>
                                        <li><a href="faq.html">Faq’s</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-6 col-sm-12 footer-column">
                            <div class="footer-widget links-widget">
                                <div class="widget-title">
                                    <h4>Usefull Links</h4>
                                </div>
                                <div class="widget-content">
                                    <ul class="links-list clearfix">
                                        <li><a href="index.html">Credit Card</a></li>
                                        <li><a href="index.html">Saving Account</a></li>
                                        <li><a href="index.html">Digital Gift Cards</a></li>
                                        <li><a href="index.html">Apply for Loans</a></li>
                                        <li><a href="index.html">Mobile Application</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-3 col-md-6 col-sm-12 footer-column">
                            <div class="footer-widget contact-widget">
                                <div class="widget-title">
                                    <h4>Find Our Branch & ATM</h4>
                                </div>
                                <div class="form-inner">
                                    <form method="post" action="index.html">
                                        <div class="form-group">
                                            <div class="select-box">
                                                <select class="wide">
                                                   <option data-display="Branch">Branch</option>
                                                   <option value="1">California</option>
                                                   <option value="2">Man City</option>
                                                   <option value="3">New York</option>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <input type="text" name="location" placeholder="Location">
                                        </div>
                                        <div class="form-group">
                                            <button type="submit" class="theme-btn btn-one">Find on Map</button>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="footer-bottom centred">
                <div class="auto-container">
                    <div class="copyright"><p>Copyright 2023 by <a href="index.html">MertoBank</a>. All Right Reserved.</p></div>
                </div>
            </div>
        </footer>
        <!-- main-footer end -->



        <!--Scroll to top-->
        <div class="scroll-to-top">
            <div>
                <div class="scroll-top-inner">
                    <div class="scroll-bar">
                        <div class="bar-inner"></div>
                    </div>
                    <div class="scroll-bar-text">Go To Top</div>
                </div>
            </div>
        </div>
        <!-- Scroll to top end -->
        
    </div>


    <!-- jequery plugins -->
    <script src="../static/js/jquery.js"></script>
    <script src="../static/js/bootstrap.min.js"></script>
    <script src="../static/js/owl.js"></script>
    <script src="../static/js/wow.js"></script>
    <script src="../static/js/validation.js"></script>
    <script src="../static/js/jquery.fancybox.js"></script>
    <script src="../static/js/appear.js"></script>
    <script src="../static/js/isotope.js"></script>
    <script src="../static/js/parallax-scroll.js"></script>
    <script src="../static/js/jquery.nice-select.min.js"></script>
    <script src="../static/js/jQuery.style.switcher.min.js"></script>
    <script src="../static/js/emi-calculator.js"></script>

    <!-- main-js -->
    <script src="../static/js/script.js"></script>

</body><!-- End of .page_wrapper -->
</html>