File "content.php"

Full path: /home/fsibplc/public_html/fsib/content.php
File size: 8.85 B (8.85 KB bytes)
MIME-type: text/x-php
Charset: utf-8

Download   Open   Edit   Advanced Editor   Back

<?php
include('./includes/config.php'); 
$page_title = "First Security Islami Bank PLC.";
//echo $page_title;
//echo $data[0]['value'];
$meta_description = "First Security Islami Bank PLC. Home page description";
$meta_keywords = "First Security Islami Bank PLC., Bank, Website";
include('includes/header.php'); 
include('includes/navbar.php'); 
//include('includes/slider.php'); 
?>
<!-- ++++++++++++++++++++++++++Start Body Tag++++++++++++++++++++++++++ -->


    <style>
        a:hover {
            text-decoration: none;
        }

        button:focus,
        input:focus,
        textarea:focus {
            outline: 0;
        }

        .card_wrapper {
            background: #ffffff;
            width: 100%;
            height: 100vh;
            display: flex;
            align-items: center;
        }

        .head_text {
            color: #7887bf;
            font-size: 35px;
            font-weight: 700;
        }

        .head_para {
            margin-top: 15px;
        }

        .card_box {
            background: url('../resources/mega.png');

            border-radius: 5px;
            margin-top: 40px;
            transition: .3s;
            margin-bottom: 40px;
            height: 150px;
            padding: 10px;
            box-shadow: 1px 2px 3px 1px #7887bf;

            display: flex;
            align-items: center;
        }

        .card_box:hover {
            box-shadow: 1px 2px 3px 1px #133818;
            transform: translateY(-10px);
        }

        .card_text {
            padding: 30px 20px 25px 20px;
        }

        .card_text h4 {
            font-size: 18px;
            font-weight: 600;
            color: #FA4A6F;
        }

        .card_text p {
            font-size: 14px;
            line-height: 150%;
            margin-top: 10px;
            color: #23273A;
        }

        .slider_carousel .owl-nav {
            position: absolute;
            top: 50%;
            width: 100%;
        }

        .slider_carousel .owl-prev,
        .slider_carousel .owl-next {
            width: 40px;
            height: 40px;
            background: #7887bf;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            position: absolute;
            top: 50%;
        }

        .slider_carousel .owl-next {
            right: -50px;
        }

        .slider_carousel .owl-prev {
            left: -50px;
        }
    </style>


    <!-- digital service start -->

    <!-- card area start -->
    <div class="card_wrapper">
        <div class="container">
            <div class="row">
                <div class="col-12 text-center">
                    <h5 class="head_text">Digital Banking Services</h5>

                </div>
                <div class="col-12">
                    <div class="owl-carousel slider_carousel">
                        <div class="card_box" onclick="location.href='content.html';">

                            <img class="img-fluid w-100" src="resources/cloud.png" alt="">
                            <div class="card_text">


                            </div>

                        </div>
                        <div class="card_box" onclick="location.href='content.html';">
                            <img class="img-fluid w-100" src="resources/dcloud.png" alt="">
                            <div class="card_text">


                            </div>
                        </div>
                        <div class="card_box" onclick="location.href='content.html';">
                            <img class="img-fluid w-100" src="resources/firstcash.png" alt="">
                            <div class="card_text">


                            </div>
                        </div>
                        <div class="card_box" onclick="location.href='content.html';">
                            <img class="img-fluid w-100" src="resources/freedom.jpg" alt="">
                            <div class="card_text">


                            </div>
                        </div>
                        <div class="card_box" onclick="location.href='content.html';">
                            <img class="img-fluid w-100" src="resources/sms.jpg" alt="">
                            <div class="card_text">


                            </div>
                        </div>
                        <div class="card_box" onclick="location.href='content.html';">
                            <img class="img-fluid w-100" src="resources/dcloud.png" alt="">
                            <div class="card_text">


                            </div>
                        </div>
                        <div class="card_box" onclick="location.href='content.html';">
                            <img class="img-fluid w-100" src="resources/freedom.jpg" alt="">
                            <div class="card_text">


                            </div>
                        </div>
                        <div class="card_box" onclick="location.href='content.html';">
                            <img class="img-fluid w-100" src="resources/sms.jpg" alt="">
                            <div class="card_text">


                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- card area end -->
    <!-- digital service end -->


    <!-- Contact Form -->
    <h2 class="text-center">Contact Us Form</h2>
    <div class="form_wrapper">
        <form>
            <div class="mb-3">
                <label for="name" class="form-label">Name</label>
                <input type="text" class="form-control" name="name" id="name">
            </div>

            <div class="mb-3">
                <label for="email" class="form-label">Email address</label>
                <input type="email" class="form-control" id="email" aria-describedby="emailHelp">
            </div>

            <div class="mb-3">
                <label for="subject">Subject</label>
                <input type="text" class="form-control" name="subject" id="subject">
            </div>
            <div class="mb-3">
                <label for="phone">Phone</label>
                <input type="text" class="form-control" name="phone" id="phone">
            </div>
            <div class="mb-3">
                <label for="message">Message</label>
                <textarea class="form-control" aria-label="With textarea" name="message"></textarea>
            </div>


            <div class="mb-3 form-check">
                <input type="checkbox" class="form-check-input" id="exampleCheck1">
                <label class="form-check-label" for="exampleCheck1">Check me out</label>
            </div>
            <button type="submit" class="btn btn-primary">Submit</button>
        </form>
    </div>




     
    <script src="assets/jquery-3.4.1.min.js"></script>
    <script src="assets/owl.carousel.min.js"></script>

    <!-- Option 1: Bootstrap Bundle with Popper -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous">
    </script>



    <script>
        var myModal = new bootstrap.Modal(document.getElementById('frontModal'))
        window.onload = function() {
            myModal.show();
        }
    </script>


    <script>
        $(document).ready(function() {

            $('ul.navbar-nav > li')
                .click(function(e) {
                    $('ul.navbar-nav > li')
                        .removeClass('active');
                    $(this).addClass('active');
                });
        });




        function slider_carouselInit() {
            $('.owl-carousel.slider_carousel').owlCarousel({
                dots: false,
                loop: true,
                margin: 30,
                stagePadding: 2,
                autoplay: true,
                nav: true,
                navText: ["<i class='far fa-arrow-alt-circle-left'></i>", "<i class='far fa-arrow-alt-circle-right'></i>"],
                autoplayTimeout: 1500,
                autoplayHoverPause: true,
                responsive: {
                    0: {
                        items: 1
                    },
                    768: {
                        items: 2,
                    },
                    992: {
                        items: 5
                    }
                }
            });
        }
        slider_carouselInit();
    </script>




 
    
<!-- ++++++++++++++++++++++++++Start Footer Section++++++++++++++++++++++++++ -->
<?php include('includes/footer.php'); ?>