<!-- <?php
// Start the session
   session_start();
   
   $inactive = 7200; 
ini_set('session.gc_maxlifetime', $inactive); 
if (isset($_SESSION['testing']) && (time() - $_SESSION['testing'] > $inactive)) {
    // last request was more than 2 hours ago
    session_unset();     // unset $_SESSION variable for this page
    session_destroy();   // destroy session data
    }
if ($_SESSION["email"] =='') {
  header("Location: index.html");
  
}else{

?> -->
<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <!-- Responsive -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <title>Invoice</title>

    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <meta name="description" content="">
    <meta name="author" content="">
    <meta name="keywords" content="">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.2/font/bootstrap-icons.css">    
    <!--CSS -->
    <link rel="icon" href="images/favicon.png" type="image/png" sizes="16x16">
    <!--<link type="text/css" rel="stylesheet" href="css/all.css"/>-->

    <style>
        @font-face {
            font-family: 'Penna-Regular';
            src: url('invoice fonts/Penna.eot?#iefix') format('embedded-opentype'), url('invoice fonts/Penna.woff') format('woff'),
            url('invoice fonts/Penna.ttf') format('truetype'), url('invoice fonts/Penna.svg#Penna-Regular') format('svg');
            font-weight: normal;
            font-style: normal;
        }

        @font-face {
            font-family: 'Poppins-Light';
            src: url('invoice fonts/Poppins-Light.eot?#iefix') format('embedded-opentype'), url('invoice fonts/Poppins-Light.woff') format('woff'),
            url('invoice fonts/Poppins-Light.ttf') format('truetype'), url('invoice fonts/Poppins-Light.svg#Poppins-Light') format('svg');
            font-weight: normal;
            font-style: normal;
        }

        @font-face {
            font-family: 'Poppins-Medium';
            src: url('invoice fonts/Poppins-Medium.eot?#iefix') format('embedded-opentype'), url('invoice fonts/Poppins-Medium.woff') format('woff'),
            url('invoice fonts/Poppins-Medium.ttf') format('truetype'), url('invoice fonts/Poppins-Medium.svg#Poppins-Medium') format('svg');
            font-weight: normal;
            font-style: normal;
        }

        html {
            font-size: 16px;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }

        body {
            width: 500px;
            height: 100%;
            margin: 0;
        }

        h1, h2, h3, h4, h5, h6 {
            /*color: $purple;*/
            font-family: 'Poppins-Light', sans-serif;
        }

        h1 {
            font-size: 5rem;
        }

        h2 {
            font-size: 4.735rem;
        }

        h3 {
            font-size: 3.125rem;

        }

        h4 {
            font-size: 0.5rem;
            margin: 0.25rem 0;
        }

        h5 {
            font-size: 0.55rem;
            margin: 0.15rem auto;
        }

        h6 {
            font-size: 1.17rem;
        }

        p {
            font-size: 1.825rem;
        }

        header .row {
            display: table;
            width: 100%;
        }

        .logo, .brand-name, .bill-no {
            display: table-cell;
            text-align: center;
            vertical-align: middle;
        }

        .logo {
            display: inline-block;
            clear: both;
            margin-left: 155px;
        }

        .logo img {
            padding: 3rem;
            /*background-color: black;*/
            /*float: left;*/
            /*left: 0;*/
            /*width: 2.25rem;*/
            width: 6.25rem;
        }

        .bill-no {
            vertical-align: top;
            padding: 0.5rem;
            padding-bottom: 0;
        }

        .brand-name {
            text-align: left;
            display: inline-block;
            margin-left: 40%;
            margin-top: -100px;
        }

        .brand-name h2 {
            font-family: 'Penna-Regular', monospace;
            font-size: 1.0rem;
            /* text-transform: uppercase; */
            font-weight: bold;
        }

        .bill-no h5 {
            font-family: 'Poppins-Medium', sans-serif;
            right: 0;
            text-align: left;
        }

        .sec-1, .sec-2, .sec-3 {
            margin: 0.5rem;
            position: relative;
        }

        .address, .date-time {
            display: inline-block;
        }

        .date-time {
            right: 0;
            float: right;
            text-align: right;
        }

        .table th, .table td {
            text-align: center;
        }

        .table th:first-child, .table td:first-child {
            text-align: left;
        }

        .table th:last-child, .table td:last-child {
            /*float: right;*/
            text-align: right;
        }

        .table > tbody > tr > td,
        .table > tbody > tr > th,
        .table > tfoot > tr > td,
        .table > tfoot > tr > th,
        .table > thead > tr > td,
        .table > thead > tr > th {
            border-bottom: 0 solid transparent;
            border-top: 0 solid transparent;
        }

        .table > tbody > tr > td > h5 {
            font-weight: bold;
            margin: 0.05rem auto;
        }

        .tfoot {
            margin-bottom: 2rem;
        }

        .tfoot .heading, .tfoot .amount {
            display: inline-block;
        }

        .tfoot .heading {
            float: left;
        }

        .tfoot .amount {
            float: right;
        }

        .tfoot h4 {
            font-family: "Poppins-Medium", sans-serif;
        }

        .conditions > ul {
            font-size: 1rem;
            padding-left: 1rem;
        }

        .conditions > ul > li > h5 {
            font-weight: bold;
        }

        footer {
            text-align: center;
            margin-top: 2rem;
            position: relative;
            width: 100%;
        }

        footer .thanks h5 {
            font-weight: bold;
        }

        footer .barcode {
            margin: 2% 0;
        }

        hr {
            display: block;
            unicode-bidi: isolate;
            margin-block-start: 0.5em;
            margin-block-end: 0.5em;
            margin-inline-start: 2.4em;
            margin-inline-end: 2.4em;
            overflow: hidden;
            border-style: inset;
            border-width: 0.5px;
        }
        .line_right{
            font-size: 1.1rem;
            margin-right: 45px;
        }
        .line_right_side{
            font-size: 1.0rem;
            margin-right: 45px;
        }
        .line_rights{
            font-size: 1.1rem;
            margin-right: 68px;
        }


.bar{
    width: 400px;
    padding-left: 45px;
    padding-top: 40px;
}
    </style>
</head>
<body>




<header>
<img  class="bar" src="./barcode.png" style="height: 40px;" alt="">
    <div class="mainbody">
    <div class="container-fluid" style="height: 166px;">
        <div></div>
        <div class="row">
            <div class="logo">
                
                <img src="img/shimar.png"/>
                
            </div>
            <div class="brand-name">
                <!--<h2>Tahseel تحصيل</h2>-->
                <h2>Tahseelتحصيل</h2>
            </div>
        </div>
        <!--<div class="row">-->
            <!--<div class="bill-no">-->
                <!--<h5>Tahseel <span class="num"> تحصيل</span></h5>-->
            <!--</div>-->
        <!--</div>-->
    </div>
</div>
</header>








<hr>
<article>
    <section class="sec-2">
        <div class="container-fluid">
            <div class="row">

                    <h4 style="font-size: 1.1rem;text-align: center;"> <span class="num"> حكومة الشارقة</span></h4>

            </div>
            <div class="row">
                <div class="col-md-12">
                    <table id="" class="table"
                           cellspacing="0" width="100%">
                        <thead>
                        <tr >
                            <th colspan="4">
                                <h4 style="font-size: 1.1rem; margin-left: 78px;">دالرةاطالية المركزية</h4>
                            </th>
                            <th>
                                <h4 class="line_rights">هيئة الطرق والمواصلات</h4>
                            </th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr>
                            <td colspan="4">
                                <h4 style="font-size: 1.1rem;margin-left: 102px;margin-bottom: 22px;">نظام تحصيل</h4>
                            </td>
                            <td>
                                <h4 class="line_right"> نظام النعرفه الرورية للشاحنات <br><span style="margin-right: 46px;"> بوابة المدام</span></h4>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </section>
    <hr>
    <section class="sec-4">
        <div class="container-fluid">
            <div class="row">

                <h4 style="font-size: 1.1rem;text-align: center;"> <span class="num">(Payment Receipt)</span></h4>
                <h4 style="font-size: 1.0rem;text-align: center;"> <span class="num">Tax Invoice  /  فاتورة ضريبية</span></h4>
                <h4 style="text-align: center;"> <span class="">TRN:100531353900003</span></h4>

            </div><br>
            <div class="row">
                <div class="col-md-12">
                    <table id="" class="table"
                           cellspacing="0" width="100%">
                        <thead>
                        <tr >
                            <th colspan="4">
                                <h4 class="line_right_side" >التاريخ :  02-05-2018 الوقت: 01:30 ص </h4>
                            </th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr>
                            <td colspan="4">
                                <h4 class="line_right_side">رقم الايصال :  34306051963764 </h4>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div><br>
            <div class="row">
                <div class="col-md-12">
                    <table id="" class="table"
                           cellspacing="0" width="100%">
                        <thead>
                        <tr >
                            <th colspan="4">
                                <h4 class="line_right_side">نوع الخدمة : رسوم عبور شاحنة مع مقطورة</h4>
                            </th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr>
                            <td colspan="4">
                                <h4 class="line_right_side">اسم المالك : الحرة للنقل الدولية ش.ذ.م.م </h4>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="4">
                                <h4 class="line_right_side">DXB 59699 : رقم المركبة    </h4>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div><br>
            <div class="row">
                <div class="col-md-12">
                    <table id="" class="table"
                           cellspacing="0" width="100%">
                        <thead>
                        <tr >
                            <th colspan="4">
                                <h4 class="line_right_side">إجمالي المبلغ 420.50  &nbsp;   درهم </h4>
                            </th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr>
                            <td colspan="4">
                                <h4 class="line_right_side"> :رسوم أخرى </h4>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
            <div class="row">

                <div class="col-md-12">
                    <table id="" class="table"
                           cellspacing="0" width="100%">
                        <thead>
                        <tr >
                            <th colspan="4">
                               <h4 style="font-size: 1.1rem; margin-left: 78px;"> <span style="direction:rtl; display: inline-block;"> درهم </span>
                                   10.00</h4>
                            </th>
                            <th>
                                <h4 class="line_right_side">رقم الايحات العامية في امارة الشارقة</h4>
                            </th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr>
                            <td colspan="4">
                                <h4 style="font-size: 1.1rem; margin-left: 78px;"> <span style="direction:rtl; display: inline-block;"> درهم </span>
                                    10.00</h4>
                            </td>
                            <td>
                                <h4 class="line_right_side">نظام تحصيلرسوم خدمات تحصيل</h4>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="4">
                                <h4 style="font-size: 1.1rem; margin-left: 78px;"> <span style="direction:rtl; display: inline-block;"> درهم </span>
                                    0.50</h4>
                            </td>
                            <td>
                                <h4 class="line_right_side">رسوم ضريبية القيمة المضافة</h4>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </section>
</article>
<footer>
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12">
                <div class="thanks">
                    <h5 style="font-size: 1.1rem;">Gate3m &nbsp;&nbsp;&nbsp; :اسم المستخدم</h5>
                </div>
                <div class="barcode">

                </div>
                <div class="developers" >
                    <h5 style="font-size: 0.85rem;">ملا حظة:برجى الاحتفاظ بايصال تحصيل لدواعى امنية</h5>
                </div>
               
            </div>
        </div>
    </div>
</footer>
</body>
</html>
<?php  } ?>