<?php
defined('BASEPATH') OR exit('No direct script access allowed');
?><!DOCTYPE html>
<html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  
  <title><?php echo WEBNAME;?> - Payment Reminder</title>
  <base href="<?php echo base_url();?>" />
    
  <!-- Stylesheets -->
  <link rel="stylesheet" href="assets/css/style.css">
  <link rel="stylesheet" href="assets/css/bootstrap.min.css"/>
  <link rel="stylesheet" href="assets/css/font-awesome.min.css"/>
  <link rel="stylesheet" href="assets/css/owl.carousel.min.css"/>
  <link rel="stylesheet" href="assets/css/nice-select.css"/>
  <link rel="stylesheet" href="assets/css/magnific-popup.css"/>
  <link rel="stylesheet" href="assets/css/slicknav.min.css"/>
  <link rel="stylesheet" href="assets/css/animate.css"/>
    
  <link rel="icon" href="favicon.ico" type="image/x-icon">
  <link rel="apple-touch-icon" href="assets/images/logo.png">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="theme-color" content="white">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="apple-mobile-web-app-title" content="NSPL">
  <meta name="msapplication-TileImage" content="images/logo.png">
  <meta name="msapplication-TileColor" content="#FFFFFF">
  
  <script type="text/javascript" src="assets/js/jquery-1.10.2.min.js"></script>
  <style>
  	.blink_me {
	  animation: blinker 1s linear infinite;
	}
	
	@keyframes blinker {
	  70% {
		opacity: 0;
	  }
	}
  </style>
    
</head>
  <body style="background-color:rgb(255 255 255);">
    
	  <div class="ftco-section my-5">
       <div class="container align-items-center pt-4">
        <div class="row align-items-center">
       	 <div class="col-md-12 col-12 mb-5 mx-auto col-lg-5">
          <h2 class="text-center text-danger" style="font-size:35px;margin:0;">Payment Reminder</h2>	 
          <div class="px-4 py-5" style="background-image:url(assets/images/sticky-note-bg.svg);background-repeat: no-repeat; background-position:top center; background-size:100%;">
         	 <div class="pt-4 px-5 pb-5 text-center mt-5">
         	 <h4>Reminder that payments are due. Kindly ensure payment is made before by <strong>October 15, 2024</strong>, to maintain uninterrupted access to all features.<br><br>Untill then all updates are disabled.
             </h4>
         	 
         	 </div>

          </div>
          
          <h5 class="text-danger text-center">Redirecting in <span id="countdown">10</span> seconds...</h5>

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

	</div>
<div class="clearfix"></div>

<!-- <script src="js/main.js"></script> //-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script>
// INCLUDE JQUERY & JQUERY UI 1.12.1
    $( function() {
        $( ".datepicker" ).datepicker({
				dateFormat: "dd-mm-yy"
				,	duration: "fast"
			});
		} );
    </script>
    <script>
	 $(document).ready(function() {
		$('.minus').click(function () {
			var $input = $(this).parent().find('input');
			var count = parseInt($input.val()) - 1;
			count = count < 1 ? 1 : count;
			$input.val(count);
			$input.change();
			return false;
		});
		$('.plus').click(function () {
			var $input = $(this).parent().find('input');
			$input.val(parseInt($input.val()) + 1);
			$input.change();
			return false;
		});
	 });
    </script>

    <script>
        let timeLeft = 10; // Set the initial countdown time
        const countdownElement = document.getElementById('countdown');

        const countdownTimer = setInterval(() => {
            timeLeft--; // Decrement the timer by 1 every second
            countdownElement.textContent = timeLeft;

            if (timeLeft <= 0) {
                clearInterval(countdownTimer); // Stop the timer at 0
                window.location.href = "<?php echo base_url();?>"; // Replace with your desired URL
            }
        }, 1000); // Execute every 1 second (1000 milliseconds)
    </script>
    
</body>
</html>
