tum
/
whitesports


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506
							<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>Eco Green Template | Single Volunteer page</title>

<!-- Stylesheets -->

<link href="css/bootstrap.css" rel="stylesheet">

<link href="css/revolution-slider.css" rel="stylesheet">

<link href="css/style.css" rel="stylesheet">

<!--Favicon-->

<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon">

<link rel="icon" href="images/favicon.ico" 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">

<link href="css/responsive.css" rel="stylesheet">


</head>


<body>

<div class="page-wrapper">  

    <!-- Preloader -->

    
    <!-- .preloader -->

    <div class="preloader"></div>

    <!-- /.preloader -->


    <!--Header search-->

    <section class="header-search">

        <div class="container">

            <div class="row">

                <div class="col-md-12 col-sm-12 col-xs-12">

                <div class="search-form pull-right">

                        <form action="#">

                            <div class="search">

                                <input type="search" name="search" value="" placeholder="Search Something">

                                <button type="submit"><span class="fa fa-search" aria-hidden="true"></span></button>

                            </div>

                        </form>

                    </div>

                </div>

            </div>

        </div>

    </section>

    <!--End Header search-->


    <!-- Main Header-->

    <header class="main-header">

        <div class="header-top">

            <div class="container">

                <div class="info-outer clearfix">

                    <ul class="main-header-info pull-left">

                        <li><i class="fa fa-phone" aria-hidden="true"></i>Call: &nbsp; 123 4561 5523 </li>

                        <li><i class="fa fa-envelope" aria-hidden="true"></i><a href="#">Email:&nbsp; info@templatepath.com</a></li>

                    </ul>

                    <div class="header-top-info pull-right">

                        <div class="header-info">

                            <li><a href="#"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>

                            <li><a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>

                            <li><a href="#"><i class="fa fa-linkedin" aria-hidden="true"></i></a></li>

                            <li><a href="#"><i class="fa fa-pinterest-p" aria-hidden="true"></i></a></li>

                        </div>

                        <button class="donate-box-btn">donate now</button>

                    </div>

                </div>

            </div>

        </div>                    

        <div class="header-lower">

            <div class="container">

                <div class="header-area clearfix">

                    <div class="logo pull-left">

                        <figure>

                            <a href="index.html"><img src="images/logo.png" alt=""></a>

                        </figure>

                    </div>

                    <nav class="main-menu pull-right">

                        <div class="navbar-header clearfix">

                            <!-- Toggle Button -->      

                            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">

                                <span class="icon-bar"></span>

                                <span class="icon-bar"></span>

                                <span class="icon-bar"></span>

                            </button>

                        </div>

                        
                        <div class="navbar-collapse collapse clearfix">

                            <ul class="navigation clearfix">

                                <li><a href="index.html">Home</a></li>

                                <li><a href="about.html">About</a></li>

                                <li class="dropdown"><a href="#">Causes</a>

                                    <ul>

                                        <li><a href="causes.html">our causes</a></li>

                                        <li><a href="cause-details.html">causes details</a></li>

                                    </ul>

                                </li>

                                <li class="dropdown"><a href="#">events</a>

                                    <ul>

                                        <li><a href="events.html">events</a></li>

                                        <li><a href="events-details.html">events details</a></li>

                                    </ul>

                                </li>

                                <li class="dropdown current"><a href="#">Pages</a>

                                    <ul>

                                        <li><a href="team.html">our team</a></li> 

                                        <li><a href="single-profile.html">single volateer</a></li> 

                                        <li><a href="gallery.html">our gallery</a></li> 

                                    </ul>

                                </li>

                                <li class="dropdown"><a href="#">Blog</a>

                                    <ul>

                                        <li><a href="blog.html">our blog</a></li>

                                        <li><a href="single-blog.html">blog details</a></li>

                                    </ul>

                                </li>

                                
                                <li><a href="contact-us.html">Contact</a></li>

                            </ul>

                        </div>                    

                    </nav>

                    <div class="search-button">

                        <div class="toggle-search">

                            <button><span class="fa fa-search" aria-hidden="true"></span></button>

                        </div>

                    </div>

                </div>

            </div>

        </div>

        <div class="sticky-header">

            <div class="container clearfix">

                <!--Logo-->

                <div class="logo">

                    <a href="index.html"><img src="images/logo.png" alt=""></a>

                </div>

                
                <!--Right Col-->

                <div class="right-col">

                    <!-- Main Menu -->

                    <nav class="main-menu">

                        <div class="navbar-header clearfix">

                            <!-- Toggle Button -->      

                            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">

                                <span class="icon-bar"></span>

                                <span class="icon-bar"></span>

                                <span class="icon-bar"></span>

                            </button>

                        </div>

                        
                        <div class="navbar-collapse collapse clearfix">

                            <ul class="navigation clearfix">

                                <li><a href="index.html">Home</a></li>

                                <li><a href="about.html">About</a></li>

                                <li class="dropdown"><a href="#">Causes</a>

                                    <ul>

                                        <li><a href="causes.html">our causes</a></li>

                                        <li><a href="cause-details.html">causes details</a></li>

                                    </ul>

                                </li>

                                <li class="dropdown"><a href="#">events</a>

                                    <ul>

                                        <li><a href="events.html">events</a></li>

                                        <li><a href="events-details.html">events details</a></li>

                                    </ul>

                                </li>

                                <li class="dropdown current"><a href="#">Pages</a>

                                    <ul>

                                        <li><a href="team.html">our team</a></li> 

                                        <li><a href="single-profile.html">single volateer</a></li> 

                                        <li><a href="gallery.html">our gallery</a></li> 

                                    </ul>

                                </li>

                                <li class="dropdown"><a href="#">Blog</a>

                                    <ul>

                                        <li><a href="blog.html">our blog</a></li>

                                        <li><a href="single-blog.html">blog details</a></li>

                                    </ul>

                                </li>                                

                                <li><a href="contact-us.html">Contact</a></li>

                            </ul>

                        </div>                    

                    </nav><!-- Main Menu End-->

                </div>                

            </div>

        </div>

    </header>

    <!--End Main Header -->

    
    <!--Page Title-->

    <section class="page-title" style="background-image:url(images/background/1.jpg);">

        <div class="container">

            <div class="title-text">

                <h1>Single Volunteer</h1>

                <ul class="title-menu clearfix">

                    <li><a href="index.html">home</a></li>

                    <li>Single Volunteer</li>

                </ul>

            </div>           

        </div>

    </section>

    <!--End Page Title-->


    <!--profile-details-->

    <div class="profile-details">

        <div class="container">

            <div class="row">

                <div class="col-md-4 col-sm-12 col-xs-12">

                    <div class="image-box">

                        <figure>

                            <img src="images/blog/30.jpg" alt="">

                        </figure>

                    </div>

                </div>

                <div class="col-md-8 col-sm-12 col-xs-12">

                    <div class="image-content">

                        <div class="section-title">

                            <h3>Jessica  Tailor</h3>

                            <span>Fund Organaizer</span>

                            <p>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<br>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium totam<br>rem aperiam</p>

                        </div>

                        <ul class="social-links">

                            <li>Phone:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span>(+1) 251-235-3256</span></li>

                            <li>Email:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#"><span>info@jessicatailor.com</span></a></li>

                            <li>Socials: &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 

                                <a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a>

                                <a href="#"><i class="fa fa-linkedin" aria-hidden="true"></i></a>

                                <a href="#"><i class="fa fa-facebook" aria-hidden="true"></i></a>

                                <a href="#"><i class="fa fa-skype" aria-hidden="true"></i></a>

                            </li>

                        </ul>

                        <div class="content-text">

                            <p>Vinteger eu libero rutrum, imperdiet arcueniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error sit voluptatem. accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi</p>

                            <p>architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet consectetur adipisci velit.</p>

                        </div>

                    </div>

                </div>

            </div>

        </div>

    </div>

    <!--End profile-details-->


    <!--Main Footer-->

    <footer class="main-footer" style="background-image: url(./images/footer/4.jpg);">

        <div class="container">

            <!--Widgets Section-->

            <div class="widgets-section">

                <div class="row">                          

                    <!--Footer Column-->

                    <div class="footer-column col-md-3 col-sm-6 col-xs-12">

                        <div class="about-widget">

                            <div class="footer-logo">

                                <a href="index.html"><img src="images/logo-2.png" alt=""></a>

                            </div> 

                            <div class="widget-content">

                                <p>Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin</p>

                                <p>Richard McClintock a Latin professor. <br>at Hampden-Sydney College in Virginia, looked up one of the more</p>

                            </div> 

                            <ul class="social-links">

                                <li><a href="#"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>

                                <li><a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>

                                <li><a href="#"><i class="fa fa-instagram" aria-hidden="true"></i></a></li>

                                <li><a href="#"><i class="fa fa-rss" aria-hidden="true"></i></a></li>

                                <li><a href="#"><i class="fa fa-vimeo" aria-hidden="true"></i></a></li>

                            </ul>                 

                        </div>

                    </div>                    

                    <!--Footer Column-->

                    <div class="footer-column col-md-3 col-sm-6 col-xs-12">

                        <div class="gallery-column">

                            <h5>Our Gallery</h5>

                            <div class="gallery-content">

                                <div class="item">

                                    <div class="image-box">

                                        <figure>

                                            <a href="gallery.html"><img src="images/footer/1.jpg" alt=""></a>

                                        </figure>

                                    </div>

                                    <a href="gallery.html"><h6>Ante eget ligula var</h6></a>

                                    <span>12 Augest 2016</span>

                                </div>

                                <div class="item">

                                    <div class="image-box">

                                        <figure>

                                            <a href="gallery.html"><img src="images/footer/2.jpg" alt=""></a>

                                        </figure>

                                    </div>

                                    <a href="gallery.html"><h6>Sed massa mollis</h6></a>

                                    <span>12 Augest 2016</span>

                                </div>

                                <div class="item">

                                    <div class="image-box">

                                        <figure>

                                            <a href="gallery.html"><img src="images/footer/3.jpg" alt=""></a>

                                        </figure>

                                    </div>

                                    <a href="gallery.html"><h6>Curabitur ut erat ac</h6></a>

                                    <span>12 Augest 2016</span>

                                </div>

                            </div>

                        </div>

                    </div> 

                    <!--Footer Column-->

                    <div class="footer-column col-md-3 col-sm-6 col-xs-12">

                        <div class="links-widget">

                            <h5>quick links</h5>

                            <ul class="links-list">

                                <li><a href="about.html"><i class="fa fa-angle-right" aria-hidden="true"></i>About Us</a></li>

                                <li><a href="causes.html"><i class="fa fa-angle-right" aria-hidden="true"></i>Causes</a></li>

                                <li><a href="gallery.html"><i class="fa fa-angle-right" aria-hidden="true"></i>Gallery</a></li>

                                <li><a href="team.html"><i class="fa fa-angle-right" aria-hidden="true"></i>Volunteers</a></li>

                                <li><a href="blog.html"><i class="fa fa-angle-right" aria-hidden="true"></i>Latest News</a></li>

                            </ul>

                        </div>

                    </div>                                          

                    <!--Footer Column-->

                    <div class="footer-column col-md-3 col-sm-6 col-xs-12">

                        <div class="contact-links">

                            <h5>contact us</h5>

                            <span>Lorem ipsum dolor sit amet, consectetur adipisicing elit sed do eiusmod.</span>

                            <div class="widget-content">

                                <div class="footer-info">

                                    <i class="fa fa-home" aria-hidden="true"></i>

                                    <h6>1201 park street,Fifth <br>Avenue,</h6>

                                </div>

                                <div class="footer-info">

                                    <i class="fa fa-phone" aria-hidden="true"></i>

                                    <h6>[88] 657 524 332</h6>

                                </div>

                                <div class="footer-info">

                                    <i class="fa fa-envelope-o" aria-hidden="true"></i>

                                    <a href="#"><h6>info@ecogreen.com</h6></a>

                                </div>

                            </div>

                        </div>

                        <div class="newsletter">

                            <h5>Newsletter</h5>

                            <div class="default-form-area">

                                <form method="post" action="index.html" class="subscribe-form">

                                    <div class="form-group">

                                        <input type="email" name="useremail" value="" placeholder="Enter Your Email Address" required="">

                                        <button type="submit" data-loading-text="Please wait..."><i class="fa fa-long-arrow-right" aria-hidden="true"></i></button>

                                    </div>

                                </form>                               

                            </div>

                        </div>

                    </div>                 

                </div>

            </div>         

        </div>        

        <!--Footer Bottom-->

        <div class="footer-bottom">

            <div class="container">

                <div class="text-center footer-text"><p>Copyright &copy; Ecogreen 2017. All Rights Reserved</p></div>

            </div>            

        </div>         

    </footer>

    <!--Main Footer-->


</div>

<!--End pagewrapper-->


<!--Scroll to top-->

<div class="scroll-to-top scroll-to-target" data-target=".main-header"><span class="icon fa fa-long-arrow-up"></span></div>


<div id="donate-popup" class="donate-popup">

    <div class="close-donate theme-btn"><span class="fa fa-close"></span></div>

    <div class="popup-inner">

        <div class="container">

            <div class="donate-form-area">

                <h2>Donation Information</h2>

                <h4>How much would you like to donate:</h4>

                <form  action="#" class="donate-form default-form">

                    <ul class="chicklet-list clearfix">

                        <li>

                            <input type="radio" id="donate-amount-1" name="donate-amount" />

                            <label for="donate-amount-1" data-amount="1000" >$1000</label>

                        </li>

                        <li>

                            <input type="radio" id="donate-amount-2" name="donate-amount" checked="checked" />

                            <label for="donate-amount-2" data-amount="2000">$2000</label>

                        </li>

                        <li>

                            <input type="radio" id="donate-amount-3" name="donate-amount" />

                            <label for="donate-amount-3" data-amount="3000">$3000</label>

                        </li>

                        <li>

                            <input type="radio" id="donate-amount-4" name="donate-amount" />

                            <label for="donate-amount-4" data-amount="4000">$4000</label>

                        </li>

                        <li>

                            <input type="radio" id="donate-amount-5" name="donate-amount" />

                            <label for="donate-amount-5" data-amount="5000">$5000</label>

                        </li>

                        <li class="other-amount">


                            <div class="input-container" data-message="Every dollar you donate helps end hunger.">

                                <span>Or</span><input type="text" id="other-amount" placeholder="Other Amount"  />

                            </div>

                        </li>

                    </ul>

                    <h3>Donor Information</h3>

                    <div class="form-bg">

                        <div class="row clearfix">

                            <div class="col-md-6 col-sm-6 col-xs-12">           

                                <div class="form-group">

                                    <p>Your Name*</p>

                                    <input type="text" name="fname" placeholder="">

                                </div>

                            </div>

                            <div class="col-md-6 col-sm-6 col-xs-12">

                                <div class="form-group">

                                    <p>Email*</p>

                                    <input type="text" name="fname" placeholder="">

                                </div>

                            </div>

                            <div class="col-md-6 col-sm-6 col-xs-12">

                                <div class="form-group">

                                    <p>Address*</p>

                                    <input type="text" name="fname" placeholder="">

                                </div>

                            </div>

                            <div class="col-md-6 col-sm-6 col-xs-12">

                                <div class="form-group">

                                    <p>Phn Num*</p>

                                    <input type="text" name="fname" placeholder="">

                                </div>

                            </div>

                        </div>

                    </div>

                    <ul class="payment-option">

                        <li>

                            <h4>Choose your payment method:</h4>

                        </li>

                        <li>

                            <div class="checkbox">

                                <label>

                                    <input name="pay-us" type="checkbox">

                                    <span>Paypal</span>

                                </label>

                            </div>

                        </li>

                        <li>

                           <div class="checkbox">

                                <label>

                                    <input name="pay-us" type="checkbox">

                                    <span>Offline Donation</span>

                                </label>

                            </div> 

                        </li>

                        <li>

                            <div class="checkbox">

                                <label>

                                    <input name="pay-us" type="checkbox">

                                    <span>Credit Card</span>

                                </label>

                            </div>

                        </li>

                        <li>

                            <div class="checkbox">

                                <label>

                                    <input name="pay-us" type="checkbox">

                                    <span>Debit Card</span>

                                </label>

                            </div>

                        </li>

                    </ul>

                    <div class="center"><button class="btn-style-one" type="submit">Donate Now</button></div>          

                </form>

            </div>

        </div>

    </div>

</div>


<script src="js/jquery.js"></script>

<script type="text/javascript" src="js/jquery-2.1.4.js"></script> 

<script src="js/jquery.bxslider.min.js"></script>

<script src="js/bootstrap.min.js"></script>

<script src="js/bootstrap-select.min.js"></script>

<script type="text/javascript" src="js/jquery-ui.min.js"></script>

<script src="js/revolution.min.js"></script>

<script src="js/isotope.js"></script>

<script src="js/jquery.fancybox.pack.js"></script>

<script src="js/jquery.fancybox-media.js"></script>

<script src="js/html5lightbox.js"></script>

<script src="js/circle-progress.js"></script>

<script src="js/owl.js"></script>

<script type="text/javascript" src="js/jquery.mixitup.min.js"></script>

<script src="js/masterslider/masterslider.js"></script>

<script src="js/owl.carousel.min.js"></script>

<script src="js/mixitup.js"></script>

<script src="js/validate.js"></script>

<script src="js/wow.js"></script>

<script src="js/jquery.appear.js"></script>

<script src="js/jquery.countTo.js"></script>

<script src="js/jquery.counterup.min.js"></script>

<script src="js/script.js"></script>

</body>

</html>