If you have any questions, please use our profile contact form on Envato ( https://themeforest.net/user/thewebmax ).

This documentation is August 2020

Thank you for purchasing this HTML template.

If you like this template, Please support us by rating this template with 5 stars

We hope you found this document helpful. Thank you!

  • Unique Home Pages
  • Easy to customize
  • HTML5 & CSS3
  • Clean & Simple Design
  • Fully Responsive Layout
  • Crossbrowser Compatible
  • W3 Valid
  • FlatIcons and Fontawesome icons
  • Powered with Bootstrap latest Version
  • Working Contact Form
  1. css — folder with CSS files.
  2. fonts — folder with fonts files.
  3. images — folder with images files.
  4. js — folder with Javascript files.
  5. plugins — folder with Revolution slider files.
HTML Files:
  1. about-1.html — about page
  2. about-2.html — about page
  3. blog-grid.html — blog grid page
  4. blog-list-sidebar.html — blog list with sidebar page
  5. blog-post-right-sidebar.html — blog post right sidebar page
  6. contact_1.html — contact page
  7. error-404.html — error Page
  8. Faq.html — FAQ Page
  9. icon-font.html — icons Page
  10. index.html — home Page
  11. index-2.html — home 2 Page
  12. index-3.html — home 3 Page
  13. project-carousel.html — project-carousel Page
  14. project-detail.html — project-detail Page
  15. project-grid.html — project-grid Page
  16. project-masonry.html — project-masonry Page
  17. service-1.html — service-1 Page
  18. Service-2.html — service-2 Page
  19. service-detail.html — service detaiil Page
  20. team.html — team Page

Followings are the css files which loaded inside the Head Section:


    <!-- BOOTSTRAP STYLE SHEET -->
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
    <!-- FONTAWESOME STYLE SHEET -->
    <link rel="stylesheet" type="text/css" href="css/fontawesome/css/font-awesome.min.css" />
    <!-- OWL CAROUSEL STYLE SHEET -->
    <link rel="stylesheet" type="text/css" href="css/owl.carousel.min.css">
    <!-- BOOTSTRAP SLECT BOX STYLE SHEET  -->
    <link rel="stylesheet" type="text/css" href="css/bootstrap-select.min.css">    
    <!-- MAGNIFIC POPUP STYLE SHEET -->
    <link rel="stylesheet" type="text/css" href="css/magnific-popup.min.css">
    <!-- LOADER STYLE SHEET -->
    <link rel="stylesheet" type="text/css" href="css/loader.min.css">    
    <!-- MAIN STYLE SHEET -->
    <link rel="stylesheet" type="text/css" href="css/style.css">
    <!-- FLATICON STYLE SHEET -->
    <link rel="stylesheet" type="text/css" href="css/flaticon.min.css">
    <!-- BUBBLE STYLE SHEET -->
    <link rel="stylesheet" type="text/css" href="css/bubbles.css">      
     <!-- REVOLUTION SLIDER CSS -->
    <link rel="stylesheet" type="text/css" href="plugins/revolution/revolution/css/settings.css">
    <!-- REVOLUTION NAVIGATION STYLE -->
    <link rel="stylesheet" type="text/css" href="plugins/revolution/revolution/css/navigation.css">
    <!-- GOOGLE FONTS -->
    <link href="https://fonts.googleapis.com/css2?family=Heebo:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet"> 
    <link href="https://fonts.googleapis.com/css2?family=Overlock:ital,wght@0,400;0,700;0,900;1,400;1,700;1,900&display=swap" rel="stylesheet">

Followings are the JS files which loaded before the end of HEAD or BODY Section:.


    <!-- JAVASCRIPT  FILES ========================================= --> 
    <script  src="js/jquery-2.2.0.min.js"></script><!-- JQUERY.MIN JS -->
    <script  src="js/popper.min.js"></script><!-- POPPER.MIN JS -->
    <script  src="js/bootstrap.min.js"></script><!-- BOOTSTRAP.MIN JS -->
    <script  src="js/bootstrap-select.min.js"></script><!-- Form js -->
    <script  src="js/magnific-popup.min.js"></script><!-- MAGNIFIC-POPUP JS -->
    <script  src="js/waypoints.min.js"></script><!-- WAYPOINTS JS -->
    <script  src="js/counterup.min.js"></script><!-- COUNTERUP JS -->
    <script  src="js/waypoints-sticky.min.js"></script><!-- STICKY HEADER -->
    <script  src="js/isotope.pkgd.min.js"></script><!-- MASONRY  -->
    <script  src="js/owl.carousel.min.js"></script><!-- OWL  SLIDER  -->
    <script  src="js/stellar.min.js"></script><!-- PARALLAX BG IMAGE   -->
    <script  src="js/theia-sticky-sidebar.js"></script><!-- STICKY SIDEBAR  -->
    <script  src="js/jquery.bootstrap-touchspin.js"></script><!-- FORM JS -->
    <script  src="js/custom.js"></script><!-- CUSTOM FUCTIONS  -->
    <script  src="js/jquery.bgscroll.js"></script><!-- BACKGROUND SCROLL -->
    <!-- REVOLUTION JS FILES -->
    <script  src="plugins/revolution/revolution/js/jquery.themepunch.tools.min.js"></script>
    <script  src="plugins/revolution/revolution/js/jquery.themepunch.revolution.min.js"></script>
    <!-- SLIDER REVOLUTION 5.0 EXTENSIONS  (Load Extensions only on Local File Systems !  The following part can be removed on Server for On Demand Loading) -->	
    <script  src="plugins/revolution/revolution/js/extensions/revolution-plugin.js"></script>
    <!-- REVOLUTION SLIDER SCRIPT FILES -->
    <script  src="js/rev-script-1.js"></script>


<!-- ABOUT ONE SECTION START -->
<div class="section-full p-t120 p-b90 bg-no-repeat bg-no-repeat bg-bottom-center bg-gray-light" style="background-image:url(images/background/bg-wash.png)">
	<div class="about-section-one">
        <div class="container">
            <div class="section-content">                 
                <div class="row justify-content-center d-flex">
                
                    <div class="col-lg-6 col-md-12 m-b30">
                        <div class="about-clean-one">
                            <div class="about-clean-one-media"><img src="images/intro-pic.png" alt="" ></div>
                        </div>
                    </div>  
                                          
                    <div class="col-lg-6 col-md-12 m-b30">
                        <div class="about-section-one-right">
                        <!-- TITLE START-->
                        <div class="left wt-small-separator-outer">
                            <div class="wt-small-separator site-text-primary">
                                <div  class="sep-leaf-left"><i class="flaticon-wiping-swipe-for-floors"></i></div>
                                <div>About</div>
                                
                            </div>
                            <h2>Making your house as good as new</h2>
                            <p>Our mission is not only to meet your expectations but to exceed them, we also provide many more like condos and apartment cleaning. Our unique Healthy Touch Deep Cleaning System will ensure you’ll receive a healthy, thorough housecleaning with every visit. We use cleaning products that are friendly to the environment.</p>
                        </div>
                        <!-- TITLE END-->
                        
                        <div class="ex-year-section site-bg-secondry">
                        	<div class="foud-year">
                        		<span>Founded in 1995</span>
                            </div>
                            <span class="year-count site-text-primary">25</span>
                            <h3 class="wt-tilte">Years of Cleaning Experience</h3>
                            <i class="flaticon-household"></i>
                        </div>  
                        <ul class="site-list-style-one icon-style">
                            <li><div class="check-list-outer"><span><i class="flaticon-checked"></i></span>Neat & Cleaning Service</div></li>
                            <li><div class="check-list-outer"><span><i class="flaticon-checked"></i></span>Expert Cleaner</div></li>
                            <li><div class="check-list-outer"><span><i class="flaticon-checked"></i></span>Office & Property Clean</div> </li>
                            <li><div class="check-list-outer"><span><i class="flaticon-checked"></i></span> 24/7 Online Support</div></li>
                        </ul>
                        
                        <a href="about-1.html" class="site-button site-btn-effect">View all information</a> 
                        </div>                                                                
                    </div>
                                                                         

                </div>
            </div>
        </div> 
    </div>
</div>   
<!-- ABOUT ONE SECTION END -->

Click this button

You will need these 2 files to make contact form working 1 — (class.simple_mail.php) , 2 — (form-handler2.php)


<div class="contact-form-line m-b50">
    <form  class="cons-contact-form" method="post" action="form-handler2.php">
        <!-- TITLE START -->
        <div class="section-head center wt-small-separator-outer">
            <h3>Get In Touch</h3>
        </div>                                                                                
        <!-- TITLE END --> 
                                                
        <div class="row">
           <div class="col-lg-6 col-md-12">
                <div class="form-group">
                    <input name="username" type="text" required class="form-control" placeholder="Name">
                </div>
            </div>
            
            <div class="col-lg-6 col-md-12">
                <div class="form-group">
                   <input name="email" type="text" class="form-control" required placeholder="Email">
                </div>
            </div>
            
            <div class="col-lg-6 col-md-12">
                <div class="form-group">
                    <input name="phone" type="text" class="form-control" required placeholder="Phone">
                 </div>
            </div>
            
            <div class="col-lg-6 col-md-12">
                <div class="form-group">
                     <input name="subject" type="text" class="form-control" required placeholder="Subject">
                 </div>
            </div>
            
            <div class="col-md-12">
                <div class="form-group">
                   <textarea name="message" class="form-control" rows="4" placeholder="Message"></textarea>
                 </div>
            </div>
            
           <div class="col-md-12">
                <button type="submit" class="site-button site-btn-effect">Submit Now</button>
            </div>
            
        </div>
   </form>
</div>

To get started using the Google Maps click the button below, which guides you through the process of activating the Google Maps JavaScript API and any related services automatically.

Get a Key

Contact us page map

or visit

http://www.latlong.net/
http://itouchmap.com/latlong.html

Find in map.script.js

Use API Key

File path: js/custome.js


	function gallery_slider2(){
	jQuery('.gallery-slider2').owlCarousel({
		loop:true,
		autoplay:true,
		nav:false,
		dots: true,	
		margin:30,
		navText: ['', ''],
		responsive:{
			0:{
				items:1,
			},
			640:{
				items:1,
			},			
			767:{
				items:2,
     		},				
			991:{
				items:2,
			},
			1024:{
				items:3,
			}
		}
	});
	}	

More Info please browser the link: Owl Carousel Docs Options

Please remove or comment the below code file path: js/custome.js


// > page loader function by = custom.js ========================= //		
	function page_loader() {
		$('.loading-area').fadeOut(1000);
	}

Also, please remove or comment the below code all HTML files


<!-- LOADING AREA START ===== -->
<div class="loading-area">
    <div class="loading-box"></div>
    <div class="loading-pic">
    	<h4>Loading</h4>
        <div class="drop-container">
          <div class="drop"></div>
        </div>
    </div>
</div>
<!-- LOADING AREA  END ====== -->

Note: All images are used for preview purpose only and not included in the final purchase files.

Images from:
https://www.shutterstock.com   ———   https://www.freepik.com/   ———   https://pixabay.com/  ———   https://unsplash.com/

Google Fonts:
Heebo   ———   Overlock

IconFont
FlatIcon

If you want to keep the corner of the box sharp, then use this CSS css/skin/skin-2.css


<!-- BORDER RADIUS (YES/NO) STYLE SHEET -->
<link rel="stylesheet" class="skin" type="text/css" href="css/skin/skin-2.css">