Copyright © 2020. All Rights Reserved.
This is Clean Charity bootstrap template.
Created: 18 May 2020
Latest Update: 25 May 2020
Thank you for purchasing our theme. alms Construction html5 template. If you have any question, please feel free to contact us.
All the file are well organized, its so easy to work with the template.
1. Unzip the files.
2. Open "alms" folder.
You will find the index.html, about.html, blog-classic.html, blog-single.html, causes-single.html, causes.html, comming-soon.html, contact.html, events-detail.html, events.html, faq.html, not-found.html, projects-detail.html, projects.html, team.html, testimonial.html, thanks.html file on the root that will be edited.
There are 1 directory called "assets".
Also you will see 4 directories under assets directory "css, js, fonts, img".
In the css folder Content you will find style.css and other styling files the all the other files expect the htmls.
Js folder contain only the jquery library. Fonts folder contain essetial font files for fonts.
alms/
├── css/
│ ├── animate.css
│ ├── animation.css
│ ├── bootstrap.css
│ ├── color-switcher-design.css
│ ├── flaticon.css
│ ├── font-awesome.css
│ ├── jquery.bootstrap-touchspin.css
│ ├── jquery.fancybox.min.css
│ ├── jquery.mCustomScrollbar.min.css
│ ├── jquery-ui.css
│ ├── magnific-popup.css
│ ├── style.css
│ └── responsive.css
│ └── owl.css
│ └── slick.css
├── fonts
├── images
├── js/
│ ├── appear.js
│ ├── bootstrap.min.js
│ ├── color-setting.js
│ ├── jquery.countdown.js
│ ├── jquery.fancybox.js
│ ├── jquery.js
│ ├── jquery.magnific-popup.min.js
│ ├── jquery.mCustomScrollbar.concat.min.js
│ ├── jquery-ui.js
│ ├── main.js
│ ├── map-script.js
│ ├── mixitup.js
│ ├── nav-tool.js
│ ├── owl.js
│ ├── popper.min.js
│ ├── script.js
│ ├── slick.js
│ ├── validate.js
│ ├── wow.s
│
├── index.html
├── about.html
├── blog-classic.html
├── blog-single.html
├── causes.html
├── comming-soon.html
├── contact.html
├── events-detail.html
├── events.html
├── faq.html
├── not-found.html
├── projects-detail.html
├── projects.html
├── team.html
├── testimonial.html
├── thanks.html
<!-- Main Structure Start -->
<div class="page-wrapper">
<!-- Preloader -->
<div class="preloader"></div>
<!-- Main Header-->
<header class="main-header">
<!--Header Top-->
<div class="header-top">
<div class="auto-container">
<div class="row clearfix">
<!--Top Right-->
<div class="top-right col-lg-12 col-md-12 col-sm-12">
<div class="question">You have any question? <a href="#">+440-98-8454</a></div>
<!--Social Box-->
<ul class="social-box">
<li><a href="#"><span class="fab fa-facebook-f"></span></a></li>
<li><a href="#"><span class="fab fa-google-plus-g"></span></a></li>
<li><a href="#"><span class="fab fa-skype"></span></a></li>
<li><a href="#"><span class="fab fa-twitter"></span></a></li>
<li><a href="#"><span class="fab fa-linkedin-in"></span></a></li>
</ul>
</div>
</div>
</div>
</div>
<!--Header-Upper-->
<div class="header-upper">
<div class="auto-container">
<div class="clearfix">
<div class="pull-left logo-box">
<div class="logo"><a href="index.html"><img src="images/logo.png" alt="Image" title=""></a></div>
</div>
<div class="pull-right upper-right">
<div class="info-outer clearfix">
<!--Info Box-->
<div class="upper-column info-box">
<div class="icon-box"><span class="flaticon-home-1"></span></div>
<ul>
<li><span>15/E, Lankaway</span> <br> Florida, USA 99544</li>
</ul>
</div>
<!--Info Box-->
<div class="upper-column info-box">
<div class="icon-box"><span class="flaticon-envelope"></span></div>
<ul>
<li><span>Florida, USA 99544</span> <br> alms@support.com</li>
</ul>
</div>
<!--Info Box-->
<div class="upper-column info-box">
<div class="icon-box"><span class="flaticon-stopwatch"></span></div>
<ul>
<li><span>Working Hours</span> <br> Mon-Sat:9.30am to 7.00pm</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<!--End Header Upper-->
<!--Header Lower-->
<div class="header-lower">
<div class="auto-container">
<div class="nav-outer clearfix">
<!-- Main Menu -->
<nav class="main-menu navbar-expand-md">
<div class="navbar-header">
<!-- Toggle Button -->
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="navbar-collapse collapse clearfix" id="navbarSupportedContent">
<ul class="navigation clearfix">
<li class="current"><a href="index.html">Home</a></li>
<li class="dropdown"><a href="#">About</a>
<ul>
<li><a href="about.html">About Us</a></li>
<li><a href="faq.html">Faq</a></li>
<li><a href="team.html">Team</a></li>
<li><a href="comming-soon.html">Comming Soon</a></li>
<li><a href="testimonial.html">Testimonial</a></li>
</ul>
</li>
<li class="dropdown"><a href="#">Causes</a>
<ul>
<li><a href="causes.html">Causes</a></li>
<li><a href="causes-single.html">Causes Detail</a></li>
</ul>
</li>
<li class="dropdown"><a href="#">Events</a>
<ul>
<li><a href="events.html">Events</a></li>
<li><a href="events-detail.html">Events Detail</a></li>
</ul>
</li>
<li class="dropdown has-mega-menu"><a href="#">Pages</a>
<div class="mega-menu">
<div class="mega-menu-bar row clearfix">
<div class="column col-md-3 col-xs-12">
<h3>About Us</h3>
<ul>
<li><a href="faq.html">Faq</a></li>
<li><a href="team.html">Team</a></li>
<li><a href="comming-soon.html">Comming Soon</a></li>
<li><a href="testimonial.html">Testimonial</a></li>
</ul>
</div>
<div class="column col-md-3 col-xs-12">
<h3>Solutions</h3>
<ul>
<li><a href="projects.html">Projects</a></li>
<li><a href="projects-detail.html">Projects Detail</a></li>
<li><a href="causes.html">Causes</a></li>
<li><a href="causes-single.html">Causes Detail</a></li>
<li><a href="not-found.html">Not Found</a></li>
</ul>
</div>
<div class="column col-md-3 col-xs-12">
<h3>Blog</h3>
<ul>
<li><a href="blog-classic.html">Our Blog</a></li>
<li><a href="blog-classic.html">Blog Classic</a></li>
<li><a href="blog-single.html">Blog Single</a></li>
<li><a href="about.html">About Us</a></li>
<li><a href="not-found.html">Not Found</a></li>
</ul>
</div>
<div class="column col-md-3 col-xs-12">
<h3>Events & Causes</h3>
<ul>
<li><a href="events.html">Events</a></li>
<li><a href="events-detail.html">Events Detail</a></li>
<li><a href="causes.html">Causes</a></li>
<li><a href="causes-single.html">Causes Detail</a></li>
<li><a href="not-found.html">Not Found</a></li>
</ul>
</div>
</div>
</div>
</li>
<li class="dropdown"><a href="#">Projects</a>
<ul>
<li><a href="projects.html">Projects</a></li>
<li><a href="projects-detail.html">Projects Detail</a></li>
</ul>
</li>
<li class="dropdown"><a href="#">Blog</a>
<ul>
<li><a href="blog-classic.html">Blog Classic</a></li>
<li><a href="blog-single.html">Blog Single</a></li>
<li><a href="not-found.html">Not Found</a></li>
</ul>
</li>
<li><a href="contact.html">Contact us</a></li>
</ul>
</div>
</nav>
<!-- Main Menu End-->
<div class="outer-box clearfix">
<!--Search Btn-->
<div href="#modal-popup-2" class="navsearch-button xs-modal-popup"><i class="icon flaticon-magnifying-glass-1"></i></div>
<!-- Main Menu End-->
<div class="nav-box">
<div class="nav-btn nav-toggler navSidebar-button"><span class="icon flaticon-menu-1"></span></div>
</div>
</div>
</div>
</div>
</div>
<!--End Header Lower-->
<!--Sticky Header-->
<div class="sticky-header">
<div class="auto-container clearfix">
<!--Logo-->
<div class="logo pull-left">
<a href="index.html" class="img-responsive"><img src="images/logo-small.png" ></a>
</div>
<!--Right Col-->
<div class="right-col pull-right">
<!-- Main Menu -->
<nav class="main-menu navbar-expand-md">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent1" aria-controls="navbarSupportedContent1" aria-expanded="false" aria-label="Toggle navigation">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div class="navbar-collapse collapse clearfix" id="navbarSupportedContent1">
<ul class="navigation clearfix">
<li class=" current"><a href="index.html">Home</a>
</li>
<li class="dropdown"><a href="#">About</a>
<ul>
<li><a href="about.html">About Us</a></li>
<li><a href="faq.html">Faq</a></li>
<li><a href="team.html">Team</a></li>
<li><a href="comming-soon.html">Comming Soon</a></li>
<li><a href="testimonial.html">Testimonial</a></li>
</ul>
</li>
<li class="dropdown"><a href="#">Causes</a>
<ul>
<li><a href="causes.html">Causes</a></li>
<li><a href="causes-single.html">Causes Detail</a></li>
</ul>
</li>
<li class="dropdown"><a href="#">Events</a>
<ul>
<li><a href="events.html">Events</a></li>
<li><a href="events-detail.html">Events Detail</a></li>
</ul>
</li>
<li class="dropdown has-mega-menu"><a href="#">Pages</a>
<div class="mega-menu">
<div class="mega-menu-bar row clearfix">
<div class="column col-md-3 col-xs-12">
<h3>About Us</h3>
<ul>
<li><a href="faq.html">Faq</a></li>
<li><a href="team.html">Team</a></li>
<li><a href="comming-soon.html">Comming Soon</a></li>
<li><a href="testimonial.html">Testimonial</a></li>
</ul>
</div>
<div class="column col-md-3 col-xs-12">
<h3>Solutions</h3>
<ul>
<li><a href="projects.html">Projects</a></li>
<li><a href="projects-detail.html">Projects Detail</a></li>
<li><a href="causes.html">Causes</a></li>
<li><a href="causes-single.html">Causes Detail</a></li>
<li><a href="not-found.html">Not Found</a></li>
</ul>
</div>
<div class="column col-md-3 col-xs-12">
<h3>Blog</h3>
<ul>
<li><a href="blog-classic.html">Our Blog</a></li>
<li><a href="blog-classic.html">Blog Classic</a></li>
<li><a href="blog-single.html">Blog Single</a></li>
<li><a href="about.html">About Us</a></li>
<li><a href="not-found.html">Not Found</a></li>
</ul>
</div>
<div class="column col-md-3 col-xs-12">
<h3>Events & Causes</h3>
<ul>
<li><a href="events.html">Events</a></li>
<li><a href="events-detail.html">Events Detail</a></li>
<li><a href="causes.html">Causes</a></li>
<li><a href="causes-single.html">Causes Detail</a></li>
<li><a href="not-found.html">Not Found</a></li>
</ul>
</div>
</div>
</div>
</li>
<li class="dropdown"><a href="#">Projects</a>
<ul>
<li><a href="projects.html">Projects</a></li>
<li><a href="projects-detail.html">Projects Detail</a></li>
</ul>
</li>
<li class="dropdown"><a href="#">Blog</a>
<ul>
<li><a href="blog-classic.html">Blog Classic</a></li>
<li><a href="blog-single.html">Blog Single</a></li>
<li><a href="not-found.html">Not Found</a></li>
</ul>
</li>
<li><a href="contact.html">Contact us</a></li>
</ul>
</div>
</nav><!-- Main Menu End-->
</div>
</div>
</div>
<!--End Sticky Header-->
</header>
<!--End Main Header -->
<!--Main Slider-->
<section class="main-slider">
<div class="main-slider-carousel owl-carousel owl-theme">
<div class="slide" style="background-image:url(images/main-slider/image-1.jpg)">
<div class="auto-container">
<div class="content clearfix">
<h2>For the People & <br> Causes you Care About</h2>
<div class="text">The Must and most beautiful things in the world cannot <br> be seen or even thouched</div>
<div class="link-box">
<a href="about.html" class="theme-btn btn-style-two">Start Donation</a>
</div>
</div>
</div>
</div>
<div class="slide" style="background-image:url(images/main-slider/image-2.jpg)">
<div class="auto-container">
<div class="content clearfix">
<h2>For the People & <br> Causes you Care About</h2>
<div class="text">The Must and most beautiful things in the world cannot <br> be seen or even thouched</div>
<div class="link-box">
<a href="about.html" class="theme-btn btn-style-two">Start Donation</a>
</div>
</div>
</div>
</div>
<div class="slide" style="background-image:url(images/main-slider/image-3.jpg)">
<div class="auto-container">
<div class="content clearfix">
<h2>For the People & <br> Causes you Care About</h2>
<div class="text">The Must and most beautiful things in the world cannot <br> be seen or even thouched</div>
<div class="link-box">
<a href="about.html" class="theme-btn btn-style-two">Start Donation</a>
</div>
</div>
</div>
</div>
</div>
<!--Scroll Dwwn Btn-->
<div class="mouse-btn-down scroll-to-target" data-target=".welcome-section"></div>
</section>
<!--End Main Slider-->
<!-- Welcome Section -->
<section class="welcome-section" style="background-image:url(images/background/2.jpg)">
<div class="auto-container">
<div class="row clearfix">
<!-- Video Column -->
<div class=" video-column col-lg-6 col-md-12 col-sm-12">
<div class="inner-column">
<!--Video Box-->
<div class="video-box wow fadeInRight" data-wow-delay="0ms" data-wow-duration="1500ms">
<figure class="video-image">
<img src="images/resource/video-img.jpg" alt="Image">
</figure>
<a href="https://www.youtube.com/watch?v=kxPCFljwJws" class="lightbox-image overlay-box"><span class="flaticon-play-button"><i class="ripple"></i></span></a>
</div>
</div>
</div>
<!-- Content Column -->
<div class="content-column col-lg-6 col-md-12 col-sm-12">
<div class="inner-column">
<h2>Welcome To <span class="theme_color">alms</span> Foundation</h2>
<div class="bold-text">We help Poor children to get their life better.</div>
<div class="text">We charity is an international charity that partners with communities through a holistic, sustainable development model that equips families with the tools and skills they need to lift themselves out of poverty. Ad mei nominati expetendis incorrupte, periculis prodesset</div>
<a href="about.html" class="theme-btn btn-style-three">Join Us Now</a>
</div>
</div>
</div>
</div>
</section>
<!-- End Welcome Section -->
<!-- Causes Section -->
<section class="causes-section">
<div class="auto-container">
<!-- Sec Title -->
<div class="sec-title">
<div class="clearfix">
<div class="pull-left">
<h2><span class="theme_color">Our Recent</span> Causes</h2>
<div class="text">Poor people are at high risk of severe malnutrition & no education</div>
</div>
<div class="pull-right">
<a href="causes.html" class="theme-btn btn-style-four">View All Causes</a>
</div>
</div>
</div>
<div class="row clearfix">
<!--Causes Block-->
<div class="causes-block col-lg-4 col-md-6 col-sm-12">
<div class="inner-box wow fadeInLeft" data-wow-delay="0ms" data-wow-duration="1500ms">
<div class="image">
<a href="causes-single.html"><img src="images/resource/cause-1.jpg" alt="Image" /></a>
<a href="causes-single.html" class="like-icon"><span class="icon flaticon-heart"></span></a>
</div>
<div class="lower-content">
<h3><a href="causes-single.html">Education For People</a></h3>
<div class="content">
<div class="text">Auis nostrud exercitation ullamc laboris nisitm aliquip ex bea sed consequat duis autes ure dolor. dolore magna aliqua nim ad minim.</div>
<div class="donate-percentage">
<div class="donate-bar">
<div class="bar-inner"><div class="bar progress-line" data-width="75"><div class="count-box"><span class="count-text" data-speed="2500" data-stop="75">0</span>%</div></div></div>
</div>
<div class="donate-bar-info">
<div class="donate-percent"></div>
</div>
<div class="amounts clearfix">
<div class="pull-left number">Raised: $7,500</div>
<div class="pull-right number">Goal: $10,000</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!--Causes Block-->
<div class="causes-block col-lg-4 col-md-6 col-sm-12">
<div class="inner-box wow fadeInUp" data-wow-delay="300ms" data-wow-duration="1500ms">
<div class="image">
<div class="ribbon">URGENT</div>
<a href="causes-single.html"><img src="images/resource/cause-2.jpg" alt="Image" /></a>
<a href="causes-single.html" class="like-icon"><span class="icon flaticon-heart"></span></a>
</div>
<div class="lower-content">
<h3><a href="causes-single.html">Providing Cloths</a></h3>
<div class="content">
<div class="text">Auis nostrud exercitation ullamc laboris nisitm aliquip ex bea sed consequat duis autes ure dolor. dolore magna aliqua nim ad minim.</div>
<div class="donate-percentage">
<div class="donate-bar">
<div class="bar-inner"><div class="bar progress-line" data-width="65"><div class="count-box"><span class="count-text" data-speed="2500" data-stop="65">0</span>%</div></div></div>
</div>
<div class="donate-bar-info">
<div class="donate-percent"></div>
</div>
<div class="amounts clearfix">
<div class="pull-left number">Raised: $6,500</div>
<div class="pull-right number">Goal: $10,000</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!--Causes Block-->
<div class="causes-block col-lg-4 col-md-6 col-sm-12">
<div class="inner-box wow fadeInRight" data-wow-delay="600ms" data-wow-duration="1500ms">
<div class="image">
<a href="causes-single.html"><img src="images/resource/cause-3.jpg" alt="Image" /></a>
<a href="causes-single.html" class="like-icon"><span class="icon flaticon-heart"></span></a>
</div>
<div class="lower-content">
<h3><a href="causes-single.html">Education For People</a></h3>
<div class="content">
<div class="text">Auis nostrud exercitation ullamc laboris nisitm aliquip ex bea sed consequat duis autes ure dolor. dolore magna aliqua nim ad minim.</div>
<div class="donate-percentage">
<div class="donate-bar">
<div class="bar-inner"><div class="bar progress-line" data-width="85"><div class="count-box"><span class="count-text" data-speed="2500" data-stop="85">0</span>%</div></div></div>
</div>
<div class="donate-bar-info">
<div class="donate-percent"></div>
</div>
<div class="amounts clearfix">
<div class="pull-left number">Raised: $8,500</div>
<div class="pull-right number">Goal: $10,000</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- End Causes Section -->
<!-- help-us section -->
<section class="help-us section-padding text-center">
<div class="container">
<!-- Sec Title -->
<div class="sec-title centered">
<h2><span class="theme_color">How can you </span> <span class="text-white">help us</span></h2>
<div class="text text-white">Cupidatat non proident sunt in culpa qui officia deserunt mollit</div>
</div>
<div class="row">
<div class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
<div class="single-item one">
<div class="icon-box">
<span class="icon flaticon-money-bag"></span>
</div>
<h4>Make a Donation</h4>
</div>
</div>
<div class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
<div class="single-item two">
<div class="icon-box">
<span class="icon flaticon-donation-2"></span>
</div>
<h4>Become A Volunteer</h4>
</div>
</div>
<div class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
<div class="single-item three">
<div class="icon-box">
<span class="icon flaticon-house-1"></span>
</div>
<h4>Shelter for Homeless</h4>
</div>
</div>
<div class="col-lg-3 col-md-6 col-sm-6 col-xs-12">
<div class="single-item four">
<div class="icon-box">
<span class="icon flaticon-world"></span>
</div>
<h4>Make World Happier</h4>
</div>
</div>
</div>
</div>
</section>
<!-- help-us section end -->
<!-- Gallery Section -->
<section class="gallery-section">
<div class="auto-container">
<!-- Sec Title -->
<div class="sec-title centered">
<h2><span class="theme_color">Our Gallery</span> Projects</h2>
<div class="text">We have successfully for Poor Peoples <br> completed 500+ projects</div>
</div>
<!--MixitUp Galery-->
<div class="mixitup-gallery">
<!--Filter-->
<div class="filters clearfix">
<ul class="filter-tabs filter-btns text-center clearfix">
<li class="active filter" data-role="button" data-filter="all">All</li>
<li class="filter" data-role="button" data-filter=".homeless">HOMELESS</li>
<li class="filter" data-role="button" data-filter=".charity">CHARITY</li>
<li class="filter" data-role="button" data-filter=".food">FOOD HELP</li>
<li class="filter" data-role="button" data-filter=".water">CLEAN WATER</li>
</ul>
</div>
<div class="filter-list row clearfix">
<!-- Gallery Block -->
<div class="gallery-block mix water charity col-lg-4 col-md-6 col-sm-12">
<div class="inner-box">
<div class="image">
<img src="images/gallery/1.jpg" alt="Image" />
<div class="overlay-box">
<div class="overlay-inner">
<h3><a href="#">Charity Poor Peoples</a></h3>
<div class="text">Lorem ipsum dolor sit amet, vix an natum labuti eleifd, mel am laoreetmenandri. Ei justo complectitur duo. Ei solet tos soletu possit quo. Sea cu justo laudem.</div>
<ul class="links">
<li><a href="projects-detail.html" class="icon flaticon-web-link"></a></li>
<li><a href="images/gallery/1.jpg" data-fancybox="gallery" data-caption="" class="icon flaticon-full-screen"></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- Gallery Block -->
<div class="gallery-block mix food charity col-lg-4 col-md-6 col-sm-12">
<div class="inner-box">
<div class="image">
<img src="images/gallery/2.jpg" alt="Image" />
<div class="overlay-box">
<div class="overlay-inner">
<h3><a href="#">Charity Poor Peoples</a></h3>
<div class="text">Lorem ipsum dolor sit amet, vix an natum labuti eleifd, mel am laoreetmenandri. Ei justo complectitur duo. Ei solet tos soletu possit quo. Sea cu justo laudem.</div>
<ul class="links">
<li><a href="projects-detail.html" class="icon flaticon-web-link"></a></li>
<li><a href="images/gallery/2.jpg" data-fancybox="gallery" data-caption="" class="icon flaticon-full-screen"></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- Gallery Block -->
<div class="gallery-block mix water homeless col-lg-4 col-md-6 col-sm-12">
<div class="inner-box">
<div class="image">
<img src="images/gallery/3.jpg" alt="Image" />
<div class="overlay-box">
<div class="overlay-inner">
<h3><a href="#">Charity Poor Peoples</a></h3>
<div class="text">Lorem ipsum dolor sit amet, vix an natum labuti eleifd, mel am laoreetmenandri. Ei justo complectitur duo. Ei solet tos soletu possit quo. Sea cu justo laudem.</div>
<ul class="links">
<li><a href="projects-detail.html" class="icon flaticon-web-link"></a></li>
<li><a href="images/gallery/3.jpg" data-fancybox="gallery" data-caption="" class="icon flaticon-full-screen"></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- Gallery Block -->
<div class="gallery-block mix food charity col-lg-4 col-md-6 col-sm-12">
<div class="inner-box">
<div class="image">
<img src="images/gallery/4.jpg" alt="Image" />
<div class="overlay-box">
<div class="overlay-inner">
<h3><a href="#">Charity Poor Peoples</a></h3>
<div class="text">Lorem ipsum dolor sit amet, vix an natum labuti eleifd, mel am laoreetmenandri. Ei justo complectitur duo. Ei solet tos soletu possit quo. Sea cu justo laudem.</div>
<ul class="links">
<li><a href="projects-detail.html" class="icon flaticon-web-link"></a></li>
<li><a href="images/gallery/4.jpg" data-fancybox="gallery" data-caption="" class="icon flaticon-full-screen"></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- Gallery Block -->
<div class="gallery-block mix food col-lg-4 col-md-6 col-sm-12">
<div class="inner-box">
<div class="image">
<img src="images/gallery/5.jpg" alt="Image" />
<div class="overlay-box">
<div class="overlay-inner">
<h3><a href="#">Charity Poor Peoples</a></h3>
<div class="text">Lorem ipsum dolor sit amet, vix an natum labuti eleifd, mel am laoreetmenandri. Ei justo complectitur duo. Ei solet tos soletu possit quo. Sea cu justo laudem.</div>
<ul class="links">
<li><a href="projects-detail.html" class="icon flaticon-web-link"></a></li>
<li><a href="images/gallery/5.jpg" data-fancybox="gallery" data-caption="" class="icon flaticon-full-screen"></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- Gallery Block -->
<div class="gallery-block mix homeless col-lg-4 col-md-6 col-sm-12">
<div class="inner-box">
<div class="image">
<img src="images/gallery/6.jpg" alt="Image" />
<div class="overlay-box">
<div class="overlay-inner">
<h3><a href="#">Charity Poor Peoples</a></h3>
<div class="text">Lorem ipsum dolor sit amet, vix an natum labuti eleifd, mel am laoreetmenandri. Ei justo complectitur duo. Ei solet tos soletu possit quo. Sea cu justo laudem.</div>
<ul class="links">
<li><a href="projects-detail.html" class="icon flaticon-web-link"></a></li>
<li><a href="images/gallery/6.jpg" data-fancybox="gallery" data-caption="" class="icon flaticon-full-screen"></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="load-more-btn text-center">
<a href="#" class="theme-btn btn-style-five">load more</a>
</div>
</div>
</section>
<!-- End Gallery Section -->
<!-- Counter Section -->
<section class="counter-section" style="background-image:url(images/background/1.jpg)">
<div class="auto-container">
<!-- Fact Counter -->
<div class="fact-counter">
<div class="row clearfix">
<!--Column-->
<div class="column counter-column col-lg-3 col-md-6 col-sm-12">
<div class="inner wow fadeInLeft" data-wow-delay="0ms" data-wow-duration="1500ms">
<div class="content">
<div class="icon flaticon-lightbulb"></div>
<div class="count-outer count-box">
<span class="count-text" data-speed="2500" data-stop="3586">0</span>
</div>
<h4 class="counter-title">Donator</h4>
</div>
</div>
</div>
<!--Column-->
<div class="column counter-column col-lg-3 col-md-6 col-sm-12">
<div class="inner wow fadeInLeft" data-wow-delay="300ms" data-wow-duration="1500ms">
<div class="content">
<div class="icon flaticon-startup-1"></div>
<div class="count-outer count-box alternate">
<span class="count-text" data-speed="5000" data-stop="95580">0</span>+
</div>
<h4 class="counter-title">Fundrising</h4>
</div>
</div>
</div>
<!--Column-->
<div class="column counter-column col-lg-3 col-md-6 col-sm-12">
<div class="inner wow fadeInLeft" data-wow-delay="600ms" data-wow-duration="1500ms">
<div class="content">
<div class="icon flaticon-process"></div>
<div class="count-outer count-box">
<span class="count-text" data-speed="2000" data-stop="640">0</span>+
</div>
<h4 class="counter-title">Volunteer</h4>
</div>
</div>
</div>
<!--Column-->
<div class="column counter-column col-lg-3 col-md-6 col-sm-12">
<div class="inner wow fadeInLeft" data-wow-delay="900ms" data-wow-duration="1500ms">
<div class="content">
<div class="icon flaticon-sketch"></div>
<div class="count-outer count-box">
<span class="count-text" data-speed="2500" data-stop="1980">0</span>
</div>
<h4 class="counter-title">Complete Projects</h4>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- End Counter Section -->
<!-- Our Team -->
<section class="our-team" style="background-image:url(images/background/bg-3.png);">
<div class="container">
<!-- Sec title -->
<div class="sec-title centered">
<h2><span class="theme_color">Our</span> Volunteer</h2>
</div>
<div class="row">
<!-- Team member -->
<div class="team-block-one col-lg-4 col-md-6">
<div class="inner-box">
<div class="image">
<a href="team.html"><img src="images/resource/vol1.jpg" alt="Image"></a>
<div class="overlay-box">
<ul class="social-links clearfix">
<li><a href="#"><span class="fab fa-facebook-f"></span></a></li>
<li><a href="#"><span class="fab fa-google-plus-g"></span></a></li>
<li><a href="#"><span class="fab fa-skype"></span></a></li>
<li><a href="#"><span class="fab fa-twitter"></span></a></li>
</ul>
</div>
</div>
<div class="lower-box">
<h4><a href="#">Robert Firoz</a></h4>
<div class="designation">Volunteer</div>
</div>
</div>
</div>
<!-- Team member -->
<div class="team-block-one col-lg-4 col-md-6">
<div class="inner-box">
<div class="image">
<a href="team.html"><img src="images/resource/vol2.jpg" alt="Image"></a>
<div class="overlay-box">
<ul class="social-links clearfix">
<li><a href="#"><span class="fab fa-facebook-f"></span></a></li>
<li><a href="#"><span class="fab fa-google-plus-g"></span></a></li>
<li><a href="#"><span class="fab fa-skype"></span></a></li>
<li><a href="#"><span class="fab fa-twitter"></span></a></li>
</ul>
</div>
</div>
<div class="lower-box">
<h4><a href="#">Denial akon</a></h4>
<div class="designation">Volunteer</div>
</div>
</div>
</div>
<!-- Team member -->
<div class="team-block-one col-lg-4 col-md-6">
<div class="inner-box">
<div class="image">
<a href="team.html"><img src="images/resource/vol3.jpg" alt="Image"></a>
<div class="overlay-box">
<ul class="social-links clearfix">
<li><a href="#"><span class="fab fa-facebook-f"></span></a></li>
<li><a href="#"><span class="fab fa-google-plus-g"></span></a></li>
<li><a href="#"><span class="fab fa-skype"></span></a></li>
<li><a href="#"><span class="fab fa-twitter"></span></a></li>
</ul>
</div>
</div>
<div class="lower-box">
<h4><a href="#">Juthi karim</a></h4>
<div class="designation">Volunteer</div>
</div>
</div>
</div>
<!-- end -->
</div>
</div>
</section>
<!-- Call To Action Section -->
<section class="call-to-action-section">
<div class="auto-container">
<div class="clearfix">
<div class="pull-left">
<h2>Your Small Help Make World Better!</h2>
<div class="text">Help us support their work – make a donation Teenage Cancer</div>
</div>
<div class="pull-right">
<a href="donate.html" class="theme-btn btn-style-two">Donate Now</a>
</div>
</div>
</div>
</section>
<!-- End Call To Action Section -->
<!-- News Section -->
<section class="news-section news-bg">
<div class="auto-container">
<!-- Sec Title -->
<div class="sec-title centered">
<h2><span class="theme_color">Our Latest </span> News</h2>
<div class="text">Our Latest News every time on your mobile and divise</div>
</div>
<div class="row clearfix">
<!-- Column -->
<div class="column col-lg-4 col-md-4 col-sm-12">
<!-- News Block -->
<div class="news-block">
<div class="inner-box wow fadeInLeft" data-wow-delay="0ms" data-wow-duration="1500ms">
<div class="image">
<a href="#"><img src="images/resource/news-5.jpg" alt="Image" /></a>
</div>
<div class="lower-content">
<div class="content">
<div class="date-outer">
<div class="date">25</div>
<div class="month">jan</div>
</div>
<h3><a href="events-detail.html">Provide clean water</a></h3>
<ul class="post-meta">
<li><a href="#"><span class="icon flaticon-chat-comment-oval-speech-bubble-with-text-lines"></span>Comments 10</a></li>
<li><a href="#"><span class="icon far fa-folder-open"></span>Education, Foods, Shelter</a></li>
</ul>
<div class="text">Auisy nostrud exercitation ullamc laboris aliquip ex bea consequat duis autese dolore magna aliqua nim.</div>
</div>
</div>
</div>
</div>
</div>
<!-- Column -->
<div class="column col-lg-4 col-md-4 col-sm-12">
<!-- News Block -->
<div class="news-block">
<div class="inner-box wow fadeInLeft" data-wow-delay="0ms" data-wow-duration="1500ms">
<div class="image">
<a href="#"><img src="images/resource/news-3.jpg" alt="Image" /></a>
</div>
<div class="lower-content">
<div class="content">
<div class="date-outer">
<div class="date">25</div>
<div class="month">jan</div>
</div>
<h3><a href="events-detail.html">Education clothing</a></h3>
<ul class="post-meta">
<li><a href="#"><span class="icon flaticon-chat-comment-oval-speech-bubble-with-text-lines"></span>Comments 10</a></li>
<li><a href="#"><span class="icon far fa-folder-open"></span>Education, Foods, Shelter</a></li>
</ul>
<div class="text">Auisy nostrud exercitation ullamc laboris aliquip ex bea consequat duis autese dolore magna aliqua nim.</div>
</div>
</div>
</div>
</div>
</div>
<!-- Column -->
<div class="column col-lg-4 col-md-4 col-sm-12">
<!-- News Block -->
<div class="news-block">
<div class="inner-box wow fadeInLeft" data-wow-delay="0ms" data-wow-duration="1500ms">
<div class="image">
<a href="#"><img src="images/resource/news-4.jpg" alt="Image" /></a>
</div>
<div class="lower-content">
<div class="content">
<div class="date-outer">
<div class="date">25</div>
<div class="month">jan</div>
</div>
<h3><a href="events-detail.html">Agriculture & food</a></h3>
<ul class="post-meta">
<li><a href="#"><span class="icon flaticon-chat-comment-oval-speech-bubble-with-text-lines"></span>Comments 10</a></li>
<li><a href="#"><span class="icon far fa-folder-open"></span>Education, Foods, Shelter</a></li>
</ul>
<div class="text">Auisy nostrud exercitation ullamc laboris aliquip ex bea consequat duis autese dolore magna aliqua nim.</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- End News Section -->
<!--Clients Section-->
<section class="clients-section">
<div class="outer-container">
<div class="sponsors-outer">
<!--Sponsors Carousel-->
<ul class="sponsors-carousel owl-carousel owl-theme">
<li class="slide-item"><figure class="image-box"><a href="#"><img src="images/clients/1.png" alt="Image"></a></figure></li>
<li class="slide-item"><figure class="image-box"><a href="#"><img src="images/clients/2.png" alt="Image"></a></figure></li>
<li class="slide-item"><figure class="image-box"><a href="#"><img src="images/clients/3.png" alt="Image"></a></figure></li>
<li class="slide-item"><figure class="image-box"><a href="#"><img src="images/clients/4.png" alt="Image"></a></figure></li>
<li class="slide-item"><figure class="image-box"><a href="#"><img src="images/clients/5.png" alt="Image"></a></figure></li>
<li class="slide-item"><figure class="image-box"><a href="#"><img src="images/clients/1.png" alt="Image"></a></figure></li>
<li class="slide-item"><figure class="image-box"><a href="#"><img src="images/clients/2.png" alt="Image"></a></figure></li>
</ul>
</div>
</div>
</section>
<!--End Clients Section-->
<!--Main Footer-->
<footer class="main-footer" style="background-image:url(images/background/map-pattern.png)">
<div class="auto-container">
<!--Widgets Section-->
<div class="widgets-section">
<div class="row clearfix">
<!--Footer Column-->
<div class="footer-column col-lg-4 col-md-6 col-sm-12">
<div class="footer-widget logo-widget">
<div class="logo">
<a href="index.html"><img src="images/footer-logo.png" alt="Image" /></a>
</div>
<div class="text">Core values are the fundamental beliefs of a person or organization. The core values are the guiding prin ples that dictate behavior and action suas labore saperet has there any quote for write lorem percit latineu.</div>
<!--Social Box-->
<ul class="social-box">
<li><a href="#"><span class="fab fa-facebook-f"></span></a></li>
<li><a href="#"><span class="fab fa-google-plus-g"></span></a></li>
<li><a href="#"><span class="fab fa-skype"></span></a></li>
<li><a href="#"><span class="fab fa-twitter"></span></a></li>
<li><a href="#"><span class="fab fa-linkedin-in"></span></a></li>
</ul>
</div>
</div>
<!--Footer Column-->
<div class="footer-column col-lg-4 col-md-6 col-sm-12">
<div class="footer-widget news-widget">
<h2>Recent Posts</h2>
<article class="post">
<figure class="post-thumb"><a href="blog-single.html"><img src="images/resource/news-thumb-1.jpg" alt="Image"></a></figure>
<div class="text"><a href="blog-single.html">Feeding for the poor people help these life.</a></div>
<div class="post-info">16 May, 2020</div>
</article>
<article class="post">
<figure class="post-thumb"><a href="blog-single.html"><img src="images/resource/news-thumb-2.jpg" alt="Image"></a></figure>
<div class="text"><a href="blog-single.html">Take care of children for the greate serving</a></div>
<div class="post-info">17 May, 2020</div>
</article>
</div>
</div>
<!--Footer Column-->
<div class="footer-column col-lg-4 col-md-6 col-sm-12">
<div class="footer-widget info-widget">
<h2>Contact Us</h2>
<ul class="list-style-one">
<li><span class="icon fas fa-map-marker-alt"></span>3571 Ringer House, Newyork, NY, 33220 USA</li>
<li><span class="icon fas fa-phone"></span>Support: <a href="tel:+034-256-7850">+(034) 256 7850</a></li>
<li><span class="icon fas fa-envelope-open"></span>Email: <a href="#">info@example.com</a></li>
</ul>
<!--Emailed Form-->
<div class="emailed-form">
<form method="post" action="#">
<div class="form-group">
<input type="email" name="email" value="" placeholder="Enter Email" required>
<button type="submit" class="theme-btn">submit</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<!-- Footer Bottom -->
<div class="footer-bottom">
<div class="clearfix">
<div class="pull-left">
<div class="copyright">Copyrights © 2020 All rights reserved.</div>
</div>
<div class="pull-right">
<ul class="footer-nav">
<li><a href="#">Privacy Policy</a></li>
<li><a href="#">Sitemap</a></li>
<li><a href="#">Terms of Use</a></li>
</ul>
</div>
</div>
</div>
</div>
</footer>
</div>
<!--End pagewrapper-->
<!--Scroll to top-->
<div class="scroll-to-top scroll-to-target" data-target="html"><span class="fa fa-arrow-up"></span></div>
<!-- Color Palate / Color Switcher -->
<div class="color-palate">
<div class="color-trigger">
<i class="fa fa-paint-brush"></i>
</div>
<div class="color-palate-head">
<h6>Choose Your Color</h6>
</div>
<div class="various-color clearfix">
<div class="colors-list">
<span class="palate default-color active" data-theme-file="css/color-themes/default-theme.css"></span>
<span class="palate green-color" data-theme-file="css/color-themes/green-theme.css"></span>
<span class="palate blue-color" data-theme-file="css/color-themes/blue-theme.css"></span>
<span class="palate orange-color" data-theme-file="css/color-themes/orange-theme.css"></span>
<span class="palate purple-color" data-theme-file="css/color-themes/purple-theme.css"></span>
<span class="palate teal-color" data-theme-file="css/color-themes/teal-theme.css"></span>
<span class="palate brown-color" data-theme-file="css/color-themes/brown-theme.css"></span>
<span class="palate yellow-color" data-theme-file="css/color-themes/yellow-color.css"></span>
</div>
</div>
<ul class="box-version option-box"> <li class="box">Boxed</li> <li>Full width</li></ul>
<ul class="rtl-version option-box"> <li class="rtl">RTL Version</li> <li>LTR Version</li> </ul>
<a href="#" class="purchase-btn">Purchase now $17</a>
<div class="palate-foo">
<span>You will find much more options for colors and styling in admin panel. This color picker is used only for demonstation purposes.</span>
</div>
</div>
<!-- sidebar cart item -->
<div class="xs-sidebar-group info-group">
<div class="xs-overlay xs-bg-black"></div>
<div class="xs-sidebar-widget">
<div class="sidebar-widget-container">
<div class="widget-heading">
<a href="#" class="close-side-widget">
X
</a>
</div>
<div class="sidebar-textwidget">
<!-- Sidebar Info Content -->
<div class="sidebar-info-contents">
<div class="content-inner">
<div class="logo">
<a href="index-2.html"><img src="images/logo-2.png" alt="Image" /></a>
</div>
<div class="content-box">
<h2>About Us</h2>
<p class="text">Core values are the fundamental beliefs of a person or organization. The core values are the guiding prin ples that dictate behavior and action suas labore saperet has there any quote for write lorem percit latineu.</p>
<a href="#" class="theme-btn btn-style-three"><i>Consultation</i></a>
</div>
<div class="contact-info">
<h2>Contact Info</h2>
<ul class="list-style-one">
<li><span class="icon flaticon-map-1"></span>Chicago 12, Melborne City, USA</li>
<li><span class="icon flaticon-telephone"></span>(111) 111-111-1111</li>
<li><span class="icon flaticon-message-1"></span>alms@gmail.com</li>
<li><span class="icon flaticon-timetable"></span>Week Days: 09.00 to 18.00 Sunday: Closed</li>
</ul>
</div>
<!-- Social Box -->
<ul class="social-box">
<li class="facebook"><a href="#" class="fab fa-facebook-f"></a></li>
<li class="twitter"><a href="#" class="fab fa-twitter"></a></li>
<li class="linkedin"><a href="#" class="fab fa-linkedin-in"></a></li>
<li class="instagram"><a href="#" class="fab fa-instagram"></a></li>
<li class="youtube"><a href="#" class="fab fa-youtube"></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- END sidebar widget item -->
<!-- xs modal -->
<div class="zoom-anim-dialog mfp-hide modal-searchPanel" id="modal-popup-2">
<div class="xs-search-panel">
<form action="#" method="POST" class="xs-search-group">
<input type="search" class="form-control" name="search" id="search" placeholder="Search">
<button type="submit" class="search-button"><i class="icon icon-search"></i></button>
</form>
</div>
</div><!-- End xs modal -->
<!-- end language switcher strart -->
<!-- Stylesheets -->
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<link href="css/slick.css" rel="stylesheet">
<link href="css/responsive.css" rel="stylesheet">
<!--Color Switcher Mockup-->
<link href="css/color-switcher-design.css" rel="stylesheet">
<!--Color Themes-->
<link id="theme-color-file" href="css/color-themes/default-theme.css" rel="stylesheet">
<link rel="shortcut icon" href="images/favicon.png" type="image/x-icon">
<link rel="icon" href="images/favicon.png" type="image/x-icon">
<!-- Responsive -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<script src="js/jquery.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.mCustomScrollbar.concat.min.js"></script>
<script src="js/jquery.fancybox.js"></script>
<script src="js/appear.js"></script>
<script src="js/owl.js"></script>
<script src="js/wow.js"></script>
<script src="js/mixitup.js"></script>
<script src="js/slick.js"></script>
<script src="js/nav-tool.js"></script>
<script src="js/jquery.magnific-popup.min.js"></script>
<script src="js/main.js"></script>
<script src="js/jquery-ui.js"></script>
<script src="js/script.js"></script>
<script src="js/color-settings.js"></script>
Thank you for reading the documentaion. If you still have any question or any problem, please contact with us. We will give you best support. Thanks.