
	<style type="text/css">
		body { font-family: Helvetica, sans-serif; }
		h2, h3 { margin-top:0; }
		form { margin-top: 15px; }
		form > input { margin-right: 15px; }
		#results { float:right; margin:20px; padding:20px; border:1px solid; background:#ccc; }
	</style>
    <div id="results">Your captured image will appear here...</div>
	
	<h1>WebcamJS Test Page</h1>
	<h3>Demonstrates simple 320x240 capture &amp; display</h3>
	
	<div id="my_camera"></div>
	
	<!-- First, include the Webcam.js JavaScript Library -->
	<script type="text/javascript" src="../webcam.min.js"></script>
	<script src="<?php echo base_url(); ?>assets/js/webcam.min.js"></script>
	
	<!-- Configure a few settings and attach camera -->
	<script language="JavaScript">
		Webcam.set({
			width: 320,
			height: 240,
			image_format: 'jpeg',
			jpeg_quality: 90
		});
		Webcam.attach( '#my_camera' );
	</script>
	
	<!-- A button for taking snaps -->
	<form>
		<input type=button value="Take Snapshot" onClick="take_snapshot()">
	</form>
	
	<!-- Code to handle taking the snapshot and displaying it locally -->
	<script language="JavaScript">
		function take_snapshot() {
			// take snapshot and get image data
			Webcam.snap( function(data_uri) {
				// display results in page
				document.getElementById('results').innerHTML = 
					'<h2>Here is your image:</h2>' + 
					'<img src="'+data_uri+'"/>';
			} );
		}
	</script>


























<html>
    <head>
        <title><?php echo $b_header['title']; ?></h3></title>
        <style>
        
           
              
                .super_container
                {
                    page-break-after: always;
                    margin-top:0.25in;
                    position:relative;
                    width:100vw;
                    height:710px;
                }
            }
            body {margin: 0.2in 0.2in 0.3in 0.2in; box-sizing:border-box;width:100vw; height:100vh;padding-bottom:0.63in;}
            *{margin:0;padding:0;font-family:calibri;}
            .clear:after{content:"";clear:both;display:block;}
            .left{float:left;}
            .right{float:right;}
            .wd-10{width:10%;}
            .wd-20{width:20%;}
            .wd-30{width:30%;}
            .wd-40{width:40%;}
            .wd-50{width:50%;}
            .wd-60{width:60%;}
            .wd-70{width:70%;}
            .wd-80{width:80%;}
            .wd-90{width:90%;}
            .wd-100{width:100%;}
            .wd-15{width:15%;}
            .wd-25{width:25%;}
            .wd-35{width:35%;}
            .wd-45{width:45%;}
            .wd-55{width:55%;}
            .wd-65{width:65%;}
            .wd-75{width:75%;}
            .wd-85{width:85%;}
            .wd-95{width:95%;}
            .wd-100{width:100%;}
            .title{font-size:35px;}
            .super_container
            {
                margin-bottom:200px;
                position:relative;
                width:100vw;
                height:710px;
            }
            .wrapper{
                border:4px dotted #18a05e;
                outline: 7px double #18a05e;
                outline-offset: 5px;
                box-sizing: border-box;
                padding:5px;
            }
            .super_wrapper
            {
                position:absolute;
                top:0;
                left:0;
                width:100%;
                z-index:120;
                margin:0;
                padding:0;
            }
            /*.watermark*/
            /*{*/
            /*    height:200px;*/
            /*    width:300px;*/
            /*    margin:auto;*/
            /*    padding-top:50px;*/
            /*    padding-left:100px;*/
            /*    opacity:0.1;*/
            /*    background:url("<?php echo base_url().$b_header['logo1']; ?>");*/
            /*    background-size:100% 100%;*/
            /*}*/
            /*.watermark_wrapper*/
            /*{*/
            /*    height:470px;*/
            /*    width:100%;*/
            /*    margin-top:50px;*/
            /*    display:inline-flex;*/
            /*    display:-webkit-inline-flex;*/
            /* }*/
            .wrapper.left2{
                width: 120%;
                margin-right: 20px;
                margin-left: 20px;
            }
            h1,h2,h3{
                color:#18a05e;
                font-family:calibri;
                text-align:center;
            }
            .boxed{background:#18a05e;color:#fff;width:80%;margin:0 auto;}
            .header{
                width:100%;
                border-bottom:4px double #18a05e;            
            }
            .body{
				padding-top:6px !important;
                padding:1px;
            }
            .row{
                width:100%;
                margin: 0px auto;  
            }
            .text-center{text-align:center;}
            .bold{font-weight:bold;}
            .b-u-l{
                border-bottom: 1px solid #000;
                height:inherit;
            }
            .x-small{
                font-size: 10px;
            }
            .x-x-small{
                font-size: 7px;
            }
            .page_break{
                width: 100vw;
                height: 100vh;
                padding: 10px 0px;
                box-sizing: border-box;
            }
            .tbl1
            {
                border: 2px dotted #000;
                text-align:center;
                width:100%;
                min-height:20px;
            }
            th{
                border: 1px solid #000;
                background-color:#18a05e; 
                padding: 3px !important;
                color: #fff;
            }
            td{
                border: 1px solid #000;
                padding: 2px !important;
            }
            .normal{
                font-weight: normal !important;
            }
            .text-right{
                text-align: right !important;
            }
            .text-left{
                text-align: left !important;
            }
            .margin-a{margin: 30px auto 0px auto;}
            table { page-break-inside:auto }
            tr    { page-break-inside:avoid; page-break-after:auto }
            thead { display:table-header-group }
            tfoot { display:table-footer-group }
        </style>
    </head>
    <body class="clear">
        <?php date_default_timezone_set("Asia/Karachi"); ?>
        <div class="super_container">
            <div class="page_break clear">
                <div class="watermark_wrapper">
                    <div class="watermark"></div>
                </div>
                <div class="super_wrapper">
                    <div class="wrapper left2 left">
                        <div class="header">
                            <div class="wd-100 clear">
                                <div class=" text-left left ">
                                    <img src="<?php echo base_url().$b_header['logo1']; ?>" style="width:50px;height:50px;">
                                </div>
                                <div class=" text-left right ">
                                    <img src="<?php echo base_url().$b_header['logo2']; ?>" style="width:50px;height:50px;">
                                </div>
                                <div style="">
                                    <center><h1><?php echo $b_header['title']; ?></h1></center>
                                    <center><h3 style="color:#000 !important;"><i><?php echo $b_header['tagline']; ?></i></h3></center>
                                    <center><i><h3 style="color:#000 !important;font-weight:normal;"><?php echo $b_header['short_address']; ?></h3></i></center>
                                    <center><i><h4 style="color:#000 !important;font-weight:bold;"><?php echo $b_header['name']; ?></h4></i></center>
                                    <center><h3 class="boxed" style="margin-top:0px !important;font-size:23px;">All Student Records - <?php echo $b_header['name']; ?></h3></center>
                                    
                                </div>
                            </div>
                            <hr>
                            <br>
                            
                        </div>
                        <div class="body">
                          
                            <table class="tbl1 ">
                             
										<tr style="background-color:#18A05E; color:white;font-weight:bold;">
					<td class="td" >G.R No</td>
                                           
                                            <td class="td" >Name</td>
                                            <td class="td" >Father Name</td>
                                            <td class="td" >Sarname</td>
                                            <td class="td" >Religion</td>
                                            <td class="td" >Place Of Birth</td>
                                            <td class="td" >Date Of Birth</td>
                                            <td class="td" >Last School Attended</td>
                                            <td class="td" >Date Of Admission</td>
                                            <td class="td" >Class In Which Admitted</td>
                                            <td class="td" >Progress</td>
                                            <td class="td" >Conduct</td>
                                            <td class="td" >Class In Which Left</td>
                                            <td class="td" >Date Of Leaving</td>
                                            
                                            <td class="td" >Date Of Issuing Certificate</td>
                                            
                                            <td class="td" >Remarks</td>
                                           
                                        </tr>
                                          <?php
                            if(!empty($student))
                            {
                            foreach($student as $amb){ ?>
                                
                                        <tr style="font-size:8px;">
											
											<td class="td" ><?php echo $amb["grno"];?></td>
                                           
                                            <td class="td" ><?php echo $amb["name"];?></td>
                                            <td class="td" ><?php echo $amb["father_name"];?></td>
                                            <td class="td" ><?php echo $amb["surname"];?></td>
                                            <td class="td" ><?php echo $amb["religion"];?></td>
                                            <td class="td" ><?php echo $amb["pob"];?></td>
                                            <td class="td" ><?php echo $amb["dob"];?></td>
                                            <td class="td" ><?php echo $amb["previous_school"];?></td>
                                            <td class="td" ><?php echo $amb["date_of_admission"];?></td>
                                            <td class="td" ><?php echo $amb["class_admited"];?></td>
                                            <td class="td" ><?php echo $amb["progress"];?></td>
                                            <td class="td" ><?php echo $amb["conduct"];?></td>
                                            <td class="td" ><?php echo $amb["class_in_which_left"];?></td>
                                            <td class="td" ><?php echo $amb["dol"];?></td>
                                            
                                            <td class="td" ><?php echo $amb["certificate_date"];?></td>
                                            
                                            <td class="td" ><?php echo $amb["remarks"];?></td>
                                            
										</tr>
										 <?php }} ?>
                            </table>
                            <br>
                          
<br>
<br>
                           
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </body>
    <script>
        window.print();
    </script>
</html>