<?php require (PAGE_CONTENT.$PageContent); ini_set("allow_url_fopen", 1);?>
<div id="<?php echo $pageID;?>" class="page-wrapper row">
	<div class="investment-comparison col s12" style="background-color: #f8f7fb;">
	<div class="content-wrap">
		<h3 class="center-align intro-head-type alrightsansmedium"><?php echo $bao_headCompare ;?></h3>
		<span class="krugerrand-info" style="display:inline-flex;padding-left: 97px;">
			<?php echo file_get_contents(TEMPLATES_ASSETS."/svgs/sab_home_tick.svg"); ?> 
			<p><?php echo $bao_txtOffering1 ;?></p>
		</span>
		<span class="krugerrand-info" style="display:inline-flex;padding-left: 97px;">
			<?php echo file_get_contents(TEMPLATES_ASSETS."/svgs/sab_home_tick.svg"); ?> 
			<p><?php echo $bao_txtOffering2 ;?></p>
		</span>
		<span class="krugerrand-info" style="display:inline-flex;padding-left: 97px;">
			<?php echo file_get_contents(TEMPLATES_ASSETS."/svgs/sab_home_tick.svg"); ?> 
			<p><?php echo $bao_txtOffering3 ;?></p>
		</span>
		<span class="krugerrand-info" style="display:inline-flex;padding-left: 97px;">
			<?php echo file_get_contents(TEMPLATES_ASSETS."/svgs/sab_home_tick.svg"); ?> 
			<p><?php echo $bao_txtOffering4 ;?></p>
		</span>


		<span class="krugerrand-price-info" style="display:inline-flex;padding-left: 106px;padding-bottom: 5px;">
			<p style="font-weight:bold;">Price indicator until 2pm <?php echo date('d F Y');  ?></p>
		</span>

		<div>
		<span style="float:left;">
		<img id="back_krugerrand" style="float:left;width:70px;padding-top:160px;visibility: hidden;" src="https://sabullion.co.za/Krugerrand Coin/back.png" >
		<img id="main_image" style="float:left;width:430px;" src="https://sabullion.co.za/Krugerrand Coin/Kruger_back.png">
		<img id="next_krugerrand" style="float:left;width:70px;padding-top:160px;" src="https://sabullion.co.za/Krugerrand Coin/next.png">
		</span>
		
		<span class="krugerrand-cost-container" style="float:left;padding-left:35px;font-size: 23px;color:#B09068;">
			<p style="padding-left: 20px;">1 x One Ounce Bullion Krugerrand</p>
			<p style="padding-left: 20px;">Buy Price: <span id="krugerrandBuyPrice">R18,000.00</span></p>
			<p style="padding-left: 20px;">
			<div class="input-field col s12" style="width:84%;margin-left:12px;">
	      		<input style="padding-left:23px;" class="intKrugerrandQuantity"  id="intKrugerrandQuantity" type="number" min="10">
				<label style="font-size:16px;color:#B09068;" for="intKrugerrandQuantity">Number of Krugerrands</label>
	    	</div>
 			</p>
			<p id="dblKrugerrandTotal" style="padding-left: 23px;">Total: R 0.00</p>
			
		</span>
		<span class="krugerrand-price-info" style="padding-left: 106px;padding-bottom: 5px;clear: both;float:left;">
					<p style="font-weight:bold;">Prices may move up or down subject to changes in the gold price </p>
		</span>
		</div>
	
		</div><!-- content wrap -->
	</div><!-- investment-comparison -->

	<div class="bullion-investment-calc col s12" style="background-color: #ffffff;">
		<div class="calc-wrap">
		<h2 class="center-align intro-head-type alrightsansmedium"><?php echo $bao_headInvestCalc; ?></h2>
		<div class="ba-investment-calc col s12">
			<?php require(KRUGERRAND_BUY_REQUEST_FORM.'/buy-krugerrand-form-overview.php');?>
		</div><!-- ba-investment-calc -->

		</div><!-- calc wrap -->
	</div><!-- investment-calc -->


  <div id="krugerrand-continer-all" class="investment-continer-all  col s12" style="background-color: #f8f7fb;display:none;border-bottom: 1px solid #c9c1d3;">
  <div class="col s12 investment-calculator-container">
      <div class="content-wrap">
    <div  class="investment-calculator-illustration">
      <h2 class="center-align alrightsansmedium intro-head-type"><?php echo $resultsHeading; ?></h2>
      <p class="center-align alrightsansregular intro-txt-type"><?php echo $resultsSubHeading; ?></p>

      <div class="investment-illustration-circle">
          <p class="alrightsansmedium intro-head-type circle-init-amount"></p>
      </div>
    </div><!-- investment-calculator-illustration -->
  </div><!-- content-wrap -->
  </div>
</div><!--  page-wrapper  -->
