<!DOCTYPE html>
<html lang="en" dir="ltr" data-nav-layout="horizontal" data-nav-style="menu-hover" data-theme-mode="light">
        
    <head>
        <!-- META DATA -->
        <meta charset="UTF-8">
        <meta name='viewport' content='width=device-width, initial-scale=1.0, user-scalable=0'>
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="author" content="Spruko Technologies Private Limited">
        <meta name="keywords" content="Hosting Website Templates, PHP Hosting Website Template, Hosting PHP Template, Professional Hosting PHP Template, Top Web Hosting PHP Templates, Web Hosting PHP Template, web hosting Bootstrap template, This professional Hosting PHP Template, Web Hosting Template, Bootstrap hosting template, Web Hosting Template Bootstrap, Bootstrap Web Hosting Template, Web Hosting Programming Template.">

        <!-- TITLE -->
        <title>Hostma – PHP Modern Web Hosting Template </title>
        
        <!-- FAVICON -->
        <link rel="icon" href="../assets/images/brand/favicon.ico" type="image/x-icon">
        
        <?php include '../layouts/styles.php'; ?>
    
    </head>

    <body class="main-body light-theme custom-page">

        <!-- BACK-TO-TOP -->
        <a href="#top" id="back-to-top" class="back-to-top rounded-circle shadow all-ease-03 fade-in">
            <i class="fe fe-arrow-up"></i>
        </a>
        <!-- END BACK-TO-TOP -->

        <!-- PAGE -->
        <div class="page">
            <div class="head_menu_container">
                
                <!-- HEADER -->
                <?php include '../layouts/header.php'; ?>

                <!-- END HEADER -->

                <!-- SIDEBAR -->
                <?php include '../layouts/sidebar.php'; ?>

                <!-- END SIDEBAR -->
            </div>

            <!-- END MAIN-CONTENT -->
            <div class="main-content app-content">
                <section class="section banner-section bg-pattern-1">
                    <img src="../assets/images/patterns/2.png" alt="img" class="patterns-6 op-1 z-index-0 top-14p">
                    <img src="../assets/images/patterns/2.png" alt="img" class="patterns-1 op-1">
                    <div class="container">
                        <div class="heading-section">
                            <div class="heading-subtitle"><span class="tx-primary tx-16 fw-semibold">Register</span></div>
                            <div class="heading-title">User <span class="tx-primary">Registration</span></div>
                        </div>
                        <div class="row justify-content-center align-items-center">
                            <div class="col-xl-7 col-lg-9 mt-3">
                                <a href="index.php">
                                    <img src="../assets/images/brand/logo-color.png" alt="img" class="auth-logo logo-color mb-4 mx-auto">
                                    <img src="../assets/images/brand/logo-white.png" alt="img" class="auth-logo logo-dark mb-4 mx-auto">
                                </a>
                                <div class="card border">
                                    <div class="card-body p-sm-6">
                                        <h3 class="mb-1">Register</h3>
                                        <p class="mb-4 tx-muted">Register here to continue.</p>
                                        <form class="form-horizontal" action="index.php">
                                            <div class="row">
                                                <div class="col-sm-6">
                                                    <div class="mb-3">
                                                        <label class="mb-2 fw-500">First Name<span class="tx-danger ms-1">*</span></label>
                                                        <input class="form-control ms-0" type="text" placeholder="Enter First Name">
                                                    </div>
                                                </div>
                                                <div class="col-sm-6">
                                                    <div class="mb-3">
                                                        <label class="mb-2 fw-500">
                                                            <span class="d-inline-flex">Last Name</span>
                                                            <span class="tx-muted op-7 ms-1 tx-12 fw-normal">(optional)</span>
                                                        </label>
                                                        <input class="form-control ms-0" type="text" placeholder="Enter Last Name">
                                                    </div>
                                                </div>
                                                <div class="col-sm-6">
                                                    <div class="mb-3">
                                                        <label class="mb-2 fw-500">Email<span class="tx-danger ms-1">*</span></label>
                                                        <input class="form-control ms-0" type="email" placeholder="Enter your Email">
                                                    </div>
                                                </div>
                                                <div class="col-sm-6">
                                                    <div class="mb-3">
                                                        <label class="mb-2 fw-500">Phone<span class="tx-danger ms-1">*</span></label>
                                                        <input class="form-control ms-0" type="text" placeholder="Enter Mobile Number">
                                                    </div>
                                                </div>
                                                <div class="col-sm-6">
                                                    <div class="mb-3">
                                                        <label class="mb-2 fw-500">Create a Password<span class="tx-danger ms-1">*</span></label>
                                                        <div class="input-group">
                                                            <input class="form-control ms-0 border-end-0" type="password" placeholder="Create a Password" id="password">
                                                            <a href="javascript:void(0)" class="input-group-text bg-transparent tx-muted">
                                                                <i class="fe fe-eye tx-muted op-7" id="showPassword"></i>
                                                            </a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-sm-6">
                                                    <div class="mb-3">
                                                        <label class="mb-2 fw-500">Confirm Password<span class="tx-danger ms-1">*</span></label>
                                                        <input class="form-control ms-0" type="password" placeholder="Confirm Password">
                                                    </div>
                                                </div>
                                                <div class="col-xl-12">
                                                    <div class="form-check mb-3">
                                                        <input class="form-check-input" type="checkbox" value="" id="flexCheckChecked">
                                                        <label class="form-check-label tx-15" for="flexCheckChecked">
                                                        Remember me
                                                        </label>
                                                    </div>
                                                    <div class="d-grid mb-3">
                                                        <a href="index.php" class="btn btn-primary"> Create an Account</a>
                                                    </div>
                                                    <div class="d-grid mb-3">
                                                        <button type="button" class="btn btn-white border"><img src="../assets/images/png/45.png" class="me-2" alt="img" width="20">Continue with Google</button>
                                                    </div>
                                                    <div class="text-center">
                                                        <p class="mb-0 tx-14">Already have an account ?
                                                            <a href="login.php" class="tx-primary ms-1">Login</a>
                                                        </p>
                                                    </div>
                                                </div>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </section>

                <section class="section bg-pattern-1 bg-image6 bg-gray-100 overflow-hidden">
                    <img src="../assets/images/patterns/7.png" alt="img" class="patterns-6 op-1 top-0">
                    <img src="../assets/images/patterns/7.png" alt="img" class="patterns-5 op-1 transform-rotate-180">
                    <img src="../assets/images/patterns/11.png" alt="img" class="patterns-3 op-1">
                    <div class="container">
                        <div class="row align-items-center">
                            <div class="col-lg-6 col-md-5">
                                <p class="h2">Join 1000+ Subscribers</p>
                                <p class="mb-0">Stay in the loop with everything you need to know</p>
                            </div>
                            <div class="col-lg-6 col-md-7">
                                <form action="javascript:void(0);" class="mb-2 mt-3 mt-md-0">
                                    <div class="form-group custom-form-group">
                                        <input type="text" class="form-control form-control-lg rounded-pill" placeholder="Your Email Address">
                                        <button class="custom-form-btn btn btn-lg btn-primary bg-primary-gradient rounded-pill border-0" type="button" id="btn-addon">Subscribe</button>
                                    </div>
                                </form>
                                <p class="text-center">We can take care your data with our <a href="privacy-policy.php" class="tx-primary">privacy policy</a></p>
                            </div>
                        </div>
                    </div>
                </section>
            </div>
            <!-- END MAIN-CONTENT -->

            <!-- FOOTER -->
            <?php include '../layouts/footer.php'; ?>

            <!-- END FOOTER -->
        </div>
        <!-- END PAGE -->

        <!-- ACCEPT-COOKIE -->
        <?php include '../layouts/accept-cookie.php'; ?>

        <!-- END ACCEPT-COOKIE -->

        <!-- SCRIPTS -->
        <?php include '../layouts/scripts.php'; ?>

        <!-- STICKY JS -->
        <script src="../assets/js/sticky.js"></script>

        <!-- SHOW PASSWORD JS -->
        <script src="../assets/js/show-password.js"></script>

        <!-- CUSTOM JS -->
        <script src="../assets/js/custom.js"></script>

        <!-- END SCRIPTS -->

    </body>
</html>