<?php require (PAGE_CONTENT.$PageContent);?>
<div id="<?php echo $pageID;?>" class="page-wrapper row">
	<div class="mobile-img-main hide-on-med-and-up col s12">
		<img src="<?php echo TEMPLATES_ASSETS?>/img/investing/bullion-pricing.jpg" alt="SA Bullion | think long term invest in gold" />
	</div>
	<div class="mobile-txt-main hide-on-med-and-up col s12">
		<h1 class="center-align alrightsansmedium home-hero-head-txt hero-head-type">THINK LONG-TERM. INVEST IN GOLD.</h1>
		<p class="center-align alrightsansregular hero-txt-type">We provide a solid investment solution. You enjoy great flexibility and convenience. Open an investment facility today.</p>
		<a class="center-align link-btn btn-flat alrightsansmedium" id="demo02" href="#modal-02"><span class="text-hover">Start Investing</span><i class="material-icons right arrow-hover"><?php echo file_get_contents(TEMPLATES_ASSETS."/svgs/btn-arrow.svg"); ?></i></a>
	</div>
	<div class="hero-img col s12 hide-on-small-only">
		<div class="hero-txt-container">
			<div class="row">
			<section class="col l5">
			<h1 class="alrightsansmedium home-hero-head-txt hero-head-type"><?php echo $buo_headHero; ?></h1>
			<p class="alrightsansregular hero-txt-type"><?php echo $buo_txtHero; ?></p>
			<a  class="link-btn btn-flat alrightsansregular demo02" href="#modal-02"><span class="text-hover">Start Investing</span><i class="material-icons right arrow-hover"><?php echo file_get_contents(TEMPLATES_ASSETS."/svgs/btn-arrow.svg"); ?></i></a>
			</section>
			</div>
		</div><!-- hero-txt-container -->
		</div><!-- hero-img -->

	<div class="bullion-overview col s12">
		<div class="content-wrap">
		<div class="col l6 s12 bullion-overview-intro-txt ">
			<h2 class="alrightsansmedium intro-head-type"><?php echo $buo_headInfo;?></h2>
			<p class="alrightsansregular intro-txt-type"><?php echo $buo_txtInfo1 ;?></p>
			<!--<p class="alrightsansregular intro-txt-type"><?php //echo $buo_txtInfo2 ;?></p> -->
			<span class="alrightsansbold">Download BullionGold Facility Brochure: &nbsp;</span>
			<a  class="alrightsansbold" href="<?php echo TEMPLATES_ASSETS?>/downloads/BullionGold-Facility-Brochure-investors.pdf" download target="blank">ENG<span style="margin:5px!important;" class="download-icon-holder"><?php echo file_get_contents(TEMPLATES_ASSETS."/svgs/sab_download_icon.svg"); ?></span></a>
			<a  class="alrightsansbold" href="<?php echo TEMPLATES_ASSETS?>/downloads/BullionGold-Facility-Brochure(Afrikaans).pdf" download target="blank">&nbsp; AFR<span style="margin:5px!important;" class="download-icon-holder"><?php echo file_get_contents(TEMPLATES_ASSETS."/svgs/sab_download_icon.svg"); ?></span></a>
		</div>
		<div class="col l6 s12 bullion-overview-intro-vid">
			<div class="ba-overview-img">
				<video id="bullion-investing-vid" class="bullion-invest-overview-ani hide-on-med-and-down" muted>
					 <source src="<?php echo $buo_aniInfoMp4;?>" type="video/mp4">
				</video>
			</div>
		</div>
		</div><!-- content-wrap -->
	</div><!--  bullion-overview  -->



	<div class="investment-explination col s12">
		<div class="content-wrap">
		<h2 class="center-align alrightsansmedium intro-head-type"><?php echo $buo_headHiw;?></h2>
			<div class="invst-explination-wrapper">
				<ul class="invst-explination">
					<li>
					<div class="steps-slider">
						<h4 class="center-align intro-head-type alrightsansmedium"><?php echo $buo_headHiwSteps1 ;?></h4>
						<p class="center-align body-txt-type alrightsansregular"><?php echo $buo_txtHiwSteps1 ;?></p>
					</div><!-- steps-slider -->
					</li>

					<li>
					<div class="steps-slider">
						<h4 class="center-align intro-head-type alrightsansmedium"><?php echo $buo_headHiwSteps2 ;?></h4>

						<p class="center-align body-txt-type alrightsansregular"><?php echo $buo_txtHiwSteps2 ;?></p>
					</div><!-- steps-slider -->
					</li>

					<li>
					<div class="steps-slider">
						<h4 class="center-align intro-head-type alrightsansmedium"><?php echo $buo_headHiwSteps3 ;?></h4>

						<p class="center-align body-txt-type alrightsansregular"><?php echo $buo_txtHiwSteps3 ;?></p>
					</div><!-- steps-slider -->
					</li>

					<li>
					<div class="steps-slider">
						<h4 class="center-align intro-head-type alrightsansmedium"><?php echo $buo_headHiwSteps4 ;?></h4>

						<p class="center-align body-txt-type alrightsansregular"><?php echo $buo_txtHiwSteps4 ;?></p>
					</div><!-- steps-slider -->
					</li>

					<li>
					<div class="steps-slider">
						<h4 class="center-align intro-head-type alrightsansmedium"><?php echo $buo_headHiwSteps5 ;?></h4>

						<p class="center-align body-txt-type alrightsansregular"><?php echo $buo_txtHiwSteps5 ;?></p>
					</div><!-- steps-slider -->
					</li>

					<li>
					<div class="steps-slider">
						<h4 class="center-align intro-head-type alrightsansmedium"><?php echo $buo_headHiwSteps6 ;?></h4>

						<p class="center-align body-txt-type alrightsansregular"><?php echo $buo_txtHiwSteps6 ;?></p>
					</div><!-- steps-slider -->
					</li>
				</ul><!-- ul / invst-explination-->
			</div><!-- invst-explination-wrapper -->
		<div class="col s12">
			<a   class="link-btn btn-flat btn-center alrightsansregular demo02" href="#modal-02"><span class="text-hover">Start Investing</span><i class="material-icons right arrow-hover"><?php echo file_get_contents(TEMPLATES_ASSETS."/svgs/btn-arrow.svg"); ?></i></a>
			<p class="center-align alrightsansregular"><?php echo $buo_txtInvestRecomendation ;?></p>
		</div>
		</div><!-- content-wrap -->
	</div><!-- investment-explination -->

	<div class="investment-image col s12">
		<img class="" src="<?php echo TEMPLATES_ASSETS.'/img/investing/bullion-overview-splash-2016.jpg' ?>" alt="">
	</div><!-- investment-image -->
		<!-- ///////////  img here ////////-->

	<div class="investment-comparison col s12">
		<div class="content-wrap">
		<h3 class="center-align intro-head-type alrightsansmedium"><?php echo $buo_headCompare ;?></h3>
		<p class="center-align body-txt-type alrightsansregular comparison-txt"><?php echo $buo_txtCompare ;?> </p>
		<div class="investment-graph-options col s12">
			<section class="col s12 l6 gold-val-border">
			<h4 class="body-txt-type alrightsansmedium gold-c">BullionGold Facility</h4>
			<h4 class="body-txt-type alrightsansmedium cash-c">Bank Deposit</h4>
			</section>
			<section class="col s12 l6">
			<ul class="select-graph-options body-txt-type alrightsansmedium">
				<li>select</li>
				<li><a class="selectedCurrency" data-currency="ZAR" href="#">R</a></li>
				<li><a class="selectedCurrency" data-currency="USD" href="#">$</a></li>
			</ul>
			</section>
		</div>
		<div class="comparison-illustration col s12">
		<div id="bullion-investment-overview-graph">
		</div>
		<div class="col s12 investment-comparison-vs">
			<div class="col l6 s12 gold-c gold-container">
				<p class="col l6 s12 alrightsansregular body-txt-type gold-m">BullionGold Facility</p>
				<h4 class="col l6 s12 alrightsansmedium gold-val-returned gold-m"></h4>
				<p class="col l6 s12 alrightsansregular body-txt-type">Growth</p>
				<h4 class="col l6 s12 alrightsansmedium gold-growth"></h4>
			</div>
			<div class="col l6 s12 cash-c cash-c-c">
				<p class="col l6 s12 alrightsansregular body-txt-type gold-m">Cash In Bank</p>
				<h4 class="col l6 s12 alrightsansmedium cash-val-returned gold-m"></h4>
				<p class="col l6 s12 alrightsansregular body-txt-type">Growth</p>
				<h4 class="col l6 s12 alrightsansmedium cash-growth"></h4>
			</div>
		</div>
		</div><!-- comparison-illustration -->
		<div class="investment-terms col s12 disclaimer">
			<p class="alrightsansregular"><?php echo $buo_txtTerms ;?></p>
		</div>
		</div><!-- content-wrap -->
	</div><!-- investment-comparison -->

	<div class="bullion-investment-calc col s12">
	<div class="calc-wrap">
		<h2 class="center-align intro-head-type alrightsansmedium"><?php echo $buo_headInvestCalc; ?></h2>

		<p class="center-align body-txt-type alrightsansregular"><?php echo $buo_txtInvestCalc;?></p>

		<div class="ba-investment-calc col s12">
			<?php require(INVEST_CALCULATOR.'/investment-calculator-form-overview.php');?>
		</div><!-- ba-investment-calc -->
		</div><!-- calc-wrap -->
	</div><!-- investment-calc -->

	<div class="ba-investment-cta col s12">

				<div class="cta-container-left">
					<section class="cta-txt-holder">
						<span class="cta-quote">&#8220;</span>
							<h4 class="center-align body-head-type alrightsansmedium"><?php echo $buo_txtCta1; ?></h4>
						<span class="cta-quote">&#8221;</span>
						<p class="center-align body-txt-type alrightsansregular"><?php echo $buo_txtCta2; ?></p>
					</section>
				</div>

				<div class="cta-container-right">
				</div>

	</div><!-- ba-investment-cta -->

	<div class="start-investing col s12">
		<h5 class="center-align alrightsansregular body-head-type"><?php echo $buo_txtQcta;?></h5>
		<a class="link-btn btn-flat btn-center alrightsansregular demo02" href="#modal-02"><span class="text-hover">Open Account</span><i class="material-icons right arrow-hover"><?php echo file_get_contents(TEMPLATES_ASSETS."/svgs/btn-arrow.svg"); ?></i></a>
	</div><!-- invest-question -->


</div><!--  page-wrapper  -->
