<footer>
	<div class="parallax" style="background:url(images/resource/parallax6.jpg) repeat scroll 0 0 rgba(0, 0, 0, 0);" data-velocity="-.1"></div><!-- PARALLAX BACKGROUND IMAGE -->				
	
<div class="footer-bar">
		<div class="container">
			<div class="row">
				<div class="col-md-6 column">
					<div class="newsletter-signup">
						<h4 class="footer-bar-title">Sign Up <span>Newsletter</span></h4>
						<form>
							<input type="text" placeholder="Enter Your Email" />
							<button class="theme-btn">SUBSCRIBE</button>
						</form>
					</div><!-- Newsletter Signup -->
				</div>
				<div class="col-md-6 column">
					<div class="footer-social-btns">
						<h4 class="footer-bar-title">Stay In <span>Touch</span></h4>
						<div class="social">
							<a itemprop="url" href="#" title=""><i class="fa fa-twitter"></i></a>
							<a itemprop="url" href="#" title=""><i class="fa fa-facebook"></i></a>
							<a itemprop="url" href="#" title=""><i class="fa fa-linkedin"></i></a>
							<a itemprop="url" href="#" title=""><i class="fa fa-google-plus"></i></a>
						</div><!-- Social -->
					</div>
				</div>
			</div>
		</div>
	</div><!-- Footer Bar -->
	<div class="bottom-bar">
		<div class="container">
			<div class="row">
				<div class="col-md-6 column">
					<div class="bottom-links"> 
						<a itemprop="url" href="#" title="">Home</a>
						<a itemprop="url" href="#" title="">Shortcodes</a>
						<a itemprop="url" href="#" title="">Pages</a>
						<a itemprop="url" href="#" title="">Links</a>
						<a itemprop="url" href="#" title="">Features</a>
						<a itemprop="url" href="#" title="">Portfolio</a>
					</div>
				</div>
				<div class="col-md-6 column">
					<p>© 2019 CASEE - All Rights Reserved - Designed and developed by <a href="https:\\www.codersinsight.co.tz" style="color: #FFA500">CodersInsight</a></p>
				</div>
			</div>
		</div>
	</div>
</footer>


<div class="donation-popup">
	<div class="container">
		<div class="popup-centralize">
			<span class="close"><i class="fa fa-remove"></i></span>
			<span class="close"><i class="fa fa-remove"></i></span>
			<div class="parallax" style="background:url(images/resource/parallax5.jpg) repeat scroll 0 0 rgba(0, 0, 0, 0);" data-velocity="-.1"></div><!-- PARALLAX BACKGROUND IMAGE -->				
			<div class="donation-intro">
				<div class="row">
					<div class="col-md-4">
						<div class="make-donation">
							<span>We Need Your Support</span>
							<h5>Make a <i>Donation</i></h5>
							<p>Quis autem velum iure reprehe nderit. Lorem ipsum dolor sitelit. Cras sapien neqqrue, biben dum in sagittis. Nulla or narjusto laoreet onse ctetur adipiscing.</p>
						</div><!-- Make Donation -->
					</div>
					<div class="col-md-8">
						<div class="select-cause">
							<div class="cause-selectbox">
								<select class="select">
									<option>Cause 1</option>
									<option>Cause 2</option>
									<option>Cause 3</option>
									<option>Cause 4</option>
									<option>Cause 5</option>
									<option>Cause 6</option>
									<option>Cause 7</option>
									<option>Cause 8</option>
								</select>
							</div><!-- Cause Select Box -->

							<div class="urgent-progress">
								<div class="row">
									<div class="col-md-4"><div class="amount"><i>$</i> 3830<span>CURRENT COLLECTION</span></div></div>
									<div class="col-md-4"><div class="amount"><i>$</i> 5403<span>TARGET NEEDED</span></div></div>
									<div class="col-md-offset-1 col-md-3"><div class="circular"><input class="knob" data-fgColor="#e47257" data-bgColor="#dddddd" data-thickness=".10" readonly value="84"/><span>Completed</span> </div></div>
								</div>
							</div>							
						</div><!-- Select Cause -->
					</div>
				</div>
			</div><!-- Donation Intro -->

			<div class="payment-box">
				<ul class="frequency">
					<li><a itemprop="url" class="active" href="#" title="">One Time</a></li>
					<li><a itemprop="url" href="#" title="">Daily</a></li>
					<li><a itemprop="url" href="#" title="">Weekly</a></li>
					<li><a itemprop="url" href="#" title="">Fortnightly</a></li>
					<li><a itemprop="url" href="#" title="">Monthly</a></li>
					<li><a itemprop="url" href="#" title="">Half Yearly</a></li>
				</ul><!-- Frequency -->
				<div class="donation-fields">
					<div class="col-md-6 col-md-offset-3">
						<select class="select">
							<option>Currency 1</option>
							<option>Currency 2</option>
							<option>Currency 3</option>
							<option>Currency 4</option>
							<option>Currency 5</option>
							<option>Currency 6</option>
							<option>Currency 6</option>
						</select>
					</div>
					<div class="col-md-8 col-md-offset-2">
						<div class="your-donation">
							<strong class="popup-title">YOUR DONATION</strong>
							<ul class="donation-figures">
								<li><a itemprop="url" class="wpdonation-button active" href="#" title="">$ 10.00</a></li>
								<li><a itemprop="url" class="wpdonation-button" href="#" title="">$ 50.00</a></li>
								<li><a itemprop="url" class="wpdonation-button" href="#" title="">$ 100.00</a></li>
								<li><a itemprop="url" class="wpdonation-button" href="#" title="">$ 500.00</a></li>
								<li><a itemprop="url" href="#" title="">Other Amount</a></li>
							</ul>	
							<div class="donation-amount"><div class="textfield"><textarea placeholder="Enter The Amount You Want">$ 10.00</textarea></div></div>						
							<a itemprop="url" class="proceed proceed-to-donate" href="#" title="">Proceed</a>
						</div><!-- Your Donation -->
					</div>
					<div class="select-payment">
						<strong class="popup-title">Select Your Payment Option</strong>
						<div class="payment-type">
							<ul role="tablist" class="nav nav-tabs" id="child-tab">
								<li class="active"><a itemprop="url" data-toggle="tab" href="#credit">Credit Card</a></li>
								<li><a itemprop="url" data-toggle="tab" href="#transfer">Banking Transfer</a></li>
								<li><a itemprop="url" data-toggle="tab" href="#paypal">Paypal</a></li>
						    </ul>
							<div class="tab-content" id="myTabContent2">
								<div id="credit" class="tab-pane fade active in">
									<p>In Case of credit card ,Transaction in Doller($) will be accepted.</p>
									<div class="form">
										<div class="col-md-offset-3 col-md-6">
											<div class="textfield"><input type="text" placeholder="Enter your 16 digit card number" /></div>
										</div>
										<div class="col-md-5 col-md-offset-1">
											<select class="select">
											    <option>Option 1</option>
											    <option>Option 2</option>
											    <option>Option 3</option>
											</select>			
										</div>
										<div class="col-md-5">
											<select class="select">
											    <option>Option 1</option>
											    <option>Option 2</option>
											    <option>Option 3</option>
											</select>			
										</div>
										<div class="col-md-offset-3 col-md-6">
											<div class="textfield"><input type="text" placeholder="Card Verification Number" /><img itemprop="image" src="images/verification-number.html" alt="" /></div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div><!-- Select Donation -->
					<div class="personal-detail">
						<strong class="popup-title">PERSONAL DETAILS</strong>
						<div class="form">
							<div class="col-md-6"><div class="textfield"><input placeholder="First Name" type="text"></div></div>
							<div class="col-md-6"><div class="textfield"><input placeholder="Last Name" type="text"></div></div>
							<div class="col-md-6"><div class="textfield"><input placeholder="Email Id" type="email"></div></div>
							<div class="col-md-6"><div class="textfield"><input placeholder="Phone Number" type="text"></div></div>
							<div class="col-md-12"><div class="textfield"><input placeholder="Address" type="text"></div></div>
							<div class="col-md-12"><div class="textfield"><textarea placeholder="Detail"></textarea></div></div>
							<div class="donate-now"><a itemprop="url" class="proceed" href="#" title="">Donate Now</a></div>
						</div>
					</div><!-- Personal Detail -->
				</div>
			</div><!-- Payment Box -->
		</div><!-- Popup Centralize -->
	</div>
</div><!-- Donation Popup -->




</div><!-- Theme Layout -->



	<!-- SCRIPTS-->
	<script type="text/javascript" src="js/modernizr.custom.17475.js"></script>
	<script src="js/jquery-2.1.4.js" type="text/javascript"></script>
    <script src="js/bootstrap.min.js"></script>
	<script src="js/owl.carousel.min.js"></script>
	<script src="js/jquery.poptrox.min.js" type="text/javascript"></script>
	<script src="js/jquery.scrolly.js"></script>
	<script src="js/jquery.knob.js"></script>
	<script src="js/jquery.isotope.min.js"></script>
	<script src="js/isotope-initialize.js"></script>
	<script src="js/jquery.plugin.min.js"></script>
	<script src="js/jquery.countdown.min.js"></script>
	<script src="js/select2.min.js"></script>
	<script src="js/enscroll-0.5.2.min.js"></script>

	<!-- Scripts For Layer Slider  -->
	<script src="layerslider/js/greensock.js" type="text/javascript"></script>
	<script src="layerslider/js/layerslider.transitions.js" type="text/javascript"></script>
	<script src="layerslider/js/layerslider.kreaturamedia.jquery.js" type="text/javascript"></script>
    
	<script>
    jQuery(document).ready(function( $ ) {
        /* ============ LAYER SLIDER ================*/
		jQuery("#layerslider").layerSlider({
			responsive: true,
			responsiveUnder: 1280,
			layersContainer: 1170,
			skin: 'fullwidth',
			hoverPrevNext: true,
			skinsPath: 'layerslider/skins/'
		});
	

        /* ============ Welfare Projects Carousel ================*/
		$('.welfare-projects-carousel').owlCarousel({
			autoplay:true,
			autoplayTimeout:2500,
			smartSpeed:2000,
			autoplayHoverPause:true,
			loop:true,
			dots:false,
			nav:false,
			margin:0,
			mouseDrag:true,
			items:4,
			autoHeight:true,
			responsive : {
			    0 : {items : 1},
			    480 : {items :2},
			    768 : {items : 3},
			    1200 : {items : 4},
			}	
		});	 


        /* ============ Sponsors Carousel ================*/
		$('.sponsors-carousel').owlCarousel({
			autoplay:true,
			autoplayTimeout:2500,
			smartSpeed:2000,
			loop:true,
			dots:false,
			nav:true,
			margin:10,
			mouseDrag:true,
			items:5,
			autoHeight:true,
			responsive : {
			    0 : {items : 1},
			    480 : {items :2},
			    768 : {items : 3},
			    1200 : {items : 5},
			}	
		});	 




        /* ============ Count Down Timer ================*/
		$(function () {
			var date = new Date();
			date = new Date(2020, 4 - 1, 12);
			$('.count-down').countdown({until: date});
		});
		$(function () {
			var date2 = new Date();
			date2 = new Date(2020, 4 - 1, 12);
			$('.count-down2').countdown({until: date2});
		});	 

	});	 
	</script>	
	<script src="js/script.js"></script> 
</body>