<style>
@import url('https://fonts.googleapis.com/css?family=Herr+Von+Muellerhoff');
                     	.signature {
                     		font-family: 'Herr Von Muellerhoff', cursive;
                     		font-size: 25px;
                     	}
.stamp {

	color: #555;
	border: 0.25rem solid #555;
	display: inline-block;
	padding: 0.25rem 1rem;
	text-transform: uppercase;
	border-radius: 1rem;
	-webkit-mask-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/8399/grunge.png');
  -webkit-mask-size: 944px 604px;
  mix-blend-mode: multiply;
}

.is-nope {
  color: #D23;
  border: 0.5rem double #D23;
  transform: rotate(3deg);
	-webkit-mask-position: 2rem 3rem;
}

.is-approved {
	color: #0A9928;
	border: 0.5rem solid #0A9928;
	-webkit-mask-position: 13rem 6rem;
	transform: rotate(-14deg);
  border-radius: 0;
}

.is-draft {
	color: #C4C4C4;
	border: 1rem double #C4C4C4;
	transform: rotate(-5deg);
  border-radius: 0;
  padding: 0.5rem;
}
.content_footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 2.5rem;            /* Footer height */
}
</style>
<link rel="stylesheet" href="<?php echo SITE_URL; ?>/lib/skins/mod1/passport/passport_book.css">
<link rel="stylesheet" href="<?php echo SITE_URL; ?>/lib/skins/mod1/css/passport.css">
<div class="content-header">
    <div class="header-section">
        <h1>
            <strong>Passport</strong><br><small>Flight Opertaions | <?php echo SITE_NAME ?> &copy; <?php echo date("Y"); ?></small>
        </h1>
    </div>
</div>

<div class="alert alert-danger hidden-lg">
    	<strong>Warning</strong> <br>
    	This page is best viewed in Desktop browsers. If viewing from your mobile device, please change to desktop view
    </div>


<div class="container">
  <div class="book-wrapper">
    <div class="book-cover">
      <img src="http://www.pptback.com/uploads/old-book-backgrounds-powerpoint.jpg" alt="">
    </div>

    <div class="pages-container">
      <div class="pages">
        <div class="page-num-1">
          <div class="pages-content">
            <div class="pages-background"></div>
            <div class="content-inner">
               <h1 class="passport_heading"><strong>Passport</strong></h1><hr>
              <div class="text">
                     <small>Belongs to</small>
                     <br>
                     <strong><span class="signature"><?php echo $pilot->firstname.' '.$pilot->lastname; ?> </span></strong>
                     <br><br>
                     <center>
                     	<small>
                     		<table class="table table-responsive">
                     			<tbody class="">
                     				<tr class="">
                     					<td>
                     						Issued On.
                     					</td>
                     					<td>
                     						<?php echo date('d/m/Y', strtotime($pilot->joindate)); ?>
                     					</td>
                     				</tr>
                     				<tr class="">
                     					<td>
                     						Country
                     					</td>
                     					<td>
                     						<?php echo $pilot->location; ?>
                     					</td>
                     				</tr>
                     			</tbody>
                    		</table>
                     	</small>

                     	<br>
                     	<small>
                     		<span class="text-muted">
                     			Issued by <?php echo SITE_NAME; ?>
                     		</span>
                     	</small>
                     </center>
               </div>
            </div>
          </div>
        </div>

        <!-- This is the page where the passport entries begin, we will be doing the code for the pagination here! -->


        <?php
        	$page = 2;
        	$entries = 0;
        	$check_value = 5;
			foreach ($countries as $entry) {
				$angle = rand(-6, 6);
				$stamp_class = array("", "is-nope", "is-draft", "is-approved");
				$class_stamp = $stamp_class[array_rand($stamp_class, 1)];
				$split = explode(",", $entry);
				$country = $split[0];
				$visit_date = $split[1];
				$code = PassportData::getCountryCode($country);
				$ctryimg = Countries::getCountryImage($code);
				// echo "<span class='stamp' style='transform: rotate({$angle}deg);'>{$country}(<img src='{$ctryimg}' />) <br> {$visit_date}</span>";

				$entries++;
				$endvalue = $check_value - 1;
				if($entries > $check_value) {
					$page++;
					$check_value = $check_value + 5;
					echo '<div class="page-num-'.$page.'">';
						echo '<div class="pages-content">
						<div class="content-inner">';

					echo "<span class='stamp ".$class_stamp."' style='transform: rotate({$angle}deg);'>{$country}(<img src='{$ctryimg}' />) <br> {$visit_date}</span>";
					echo '<br>';
					$i++;

				} else if($entries == 1) {

					echo '<div class="page-num-2">';
					echo '<div class="pages-content">
						<div class="content-inner">';
					echo "<span class='stamp ".$class_stamp."' style='transform: rotate({$angle}deg);'>{$country}(<img src='{$ctryimg}' />) <br> {$visit_date}</span>";
					echo '<br>';
					$i++;


				} else if($endvalue == $i) {
					$i++;
					echo "<span class='stamp ".$class_stamp."' style='transform: rotate({$angle}deg);'>{$country}(<img src='{$ctryimg}' />) <br> {$visit_date}</span>";
					echo "<br><br><br><br><small>Page {$page}</small>";
					echo '</div>';
					echo '</div>';
					echo '</div>';
				}

				else {

					echo "<span class='stamp ".$class_stamp."' style='transform: rotate({$angle}deg);'>{$country}(<img src='{$ctryimg}' />) <br> {$visit_date}</span>";
					echo '<br>';
					$i++;

				}

			}
		?>
      </div>
    </div>
  </div>

</div>
<script src="<?php echo SITE_URL; ?>/lib/skins/mod1/passport/passport_book.js"></script>
