<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="description" content=""> <meta name="author" content=""> <link href="https://fonts.googleapis.com/css?family=Raleway:100,300,400,500,700,900" rel="stylesheet"> <title>Asfaq Ahmed Portfolio</title> <!-- Elegance Template https://templatemo.com/tm-528-elegance --> <!-- Additional CSS Files --> <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"> <link rel="stylesheet" type="text/css" href="css/font-awesome.css"> <link rel="stylesheet" type="text/css" href="css/fullpage.min.css"> <link rel="stylesheet" type="text/css" href="css/owl.carousel.css"> <link rel="stylesheet" href="css/animate.css"> <link rel="stylesheet" href="css/templatemo-style.css"> <link rel="stylesheet" href="css/responsive.css"> </head> <body> <div id="video"> <div class="preloader"> <div class="preloader-bounce"> <span></span> <span></span> <span></span> </div> </div> <header id="header"> <div class="container-fluid"> <div class="navbar"> <a href="/" id="logo" title="Elegance by TemplateMo"> Asfaq Ahmed </a> <div class="navigation-row"> <nav id="navigation"> <button type="button" class="navbar-toggle"> <i class="fa fa-bars"></i> </button> <div class="nav-box navbar-collapse"> <ul class="navigation-menu nav navbar-nav navbars" id="nav"> <li data-menuanchor="slide01" class="active"><a href="#slide01">Home</a></li> <li data-menuanchor="slide02"><a href="#slide02">About Me</a></li> <li data-menuanchor="slide03"><a href="#slide03">Services</a></li> <li data-menuanchor="slide04"><a href="#slide04">Skills</a></li> <li data-menuanchor="slide05"><a href="#slide05">My Projects</a></li> <li data-menuanchor="slide07"><a href="#slide07">Contact Me</a></li> </ul> </div> </nav> </div> </div> </div> </header> <video autoplay muted loop id="myVideo"> <source src="images/Pexels Videos 2757709.mp4" type="video/mp4"> </video> <div id="fullpage" class="fullpage-default"> <div class="section animated-row" data-section="slide01"> <div class="section-inner"> <div class="welcome-box"> <span class="welcome-first animate" data-animate="fadeInUp">Hello, welcome to</span> <h1 class="welcome-title animate" data-animate="fadeInUp">My Portfolio</h1> <p class="animate" data-animate="fadeInUp">This is a my portfolio website. It contains modern HTML5 template with a video background. Please contact us If you want any website. Thank you.</p> <div class="scroll-down next-section animate data-animate="fadeInUp""><img src="images/mouse-scroll.png" alt=""><span>Scroll Down</span></div> </div> </div> </div> <div class="section animated-row" data-section="slide02" id="aboutdiv"> <div class="section-inner"> <div class="about-section"> <div class="row justify-content-center"> <div class="col-lg-8 wide-col-laptop"> <div class="row"> <div class="col-md-6"> <div class="about-contentbox"> <div class="animate" data-animate="fadeInUp"> <span>About Me</span> <h2>Who am i?</h2> <p>Credits go to <strong>Unsplash</strong> and <strong>Pexels</strong> for photos and video used in this template. Vivamus tincidunt, augue rutrum convallis volutpat, massa lacus tempus leo.</p> </div> <div class="facts-list owl-carousel"> <div class="item animate" data-animate="fadeInUp"> <div class="counter-box"> <i class="fa fa-trophy counter-icon" aria-hidden="true"></i><span class="count-number">32</span> Awards Won </div> </div> <div class="item animate" data-animate="fadeInUp"> <div class="counter-box"> <i class="fa fa-graduation-cap counter-icon" aria-hidden="true"></i><span class="count-number">4</span> Degrees </div> </div> <div class="item animate" data-animate="fadeInUp"> <div class="counter-box"> <i class="fa fa-desktop counter-icon" aria-hidden="true"></i><span class="count-number">12</span> Working Years </div> </div> <div class="item animate" data-animate="fadeInUp"> <div class="counter-box"> <i class="fa fa-support counter-icon" aria-hidden="true"></i><span class="count-number">6</span> Team Members </div> </div> <div class="item animate" data-animate="fadeInUp"> <div class="counter-box"> <i class="fa fa-certificate counter-icon" aria-hidden="true"></i><span class="count-number">10</span> Certificates </div> </div> </div> </div> </div> <div class="col-md-6"> <figure class="about-img animate" data-animate="fadeInUp"><img src="images/My.jpg" class="rounded" id="myimage" alt=""></figure> </div> </div> </div> </div> </div> </div> </div> <div class="section animated-row" data-section="slide03"> <div class="section-inner"> <div class="row justify-content-center"> <div class="col-md-8 wide-col-laptop"> <div class="title-block animate" data-animate="fadeInUp"> <span>Services</span> <h2>What I Do?</h2> </div> <div class="services-section"> <div class="services-list owl-carousel"> <div class="item animate" data-animate="fadeInUp"> <div class="service-box"> <span class="service-icon"><i class="fa fa-bookmark" aria-hidden="true"></i></span> <h3>Full Stack web Application</h3> <p>I will create multipage, secure website to your bussiness In Django and React </p> </div> </div> <div class="item animate" data-animate="fadeInUp"> <div class="service-box"> <span class="service-icon"><i class="fa fa-cloud" aria-hidden="true"></i></span> <h3>Front End Development</h3> <p>I will create front end web Application in React js, jquery, And vanila Javascript. </p> </div> </div> <div class="item animate" data-animate="fadeInUp"> <div class="service-box"> <span class="service-icon"><i class="fa fa-desktop" aria-hidden="true"></i></span> <h3>Fully Responsive</h3> <p>My project will be fully responsive. </p> </div> </div> <div class="item animate" data-animate="fadeInUp"> <div class="service-box"> <span class="service-icon"><i class="fa fa-mobile" aria-hidden="true"></i></span> <h3>Mobile Friendly</h3> <p>My projects are not only resposive It will be mobile friendly Application. </p> </div> </div> <div class="item animate" data-animate="fadeInUp"> <div class="service-box"> <span class="service-icon"><i class="fa fa-database" aria-hidden="true"></i></span> <h3>24-hour Up Time</h3> <p>You can contact anytime I will response In the email or phone number given In the website. </p> </div> </div> </div> </div> </div> </div> </div> </div> <div class="section animated-row" data-section="slide04"> <div class="section-inner"> <div class="row justify-content-center"> <div class="col-md-7 wide-col-laptop"> <div class="title-block animate" data-animate="fadeInUp"> <span>My Skills</span> <h2>What i’m good?</h2> </div> <div class="skills-row animate" data-animate="fadeInDown"> <div class="row"> <div class="col-md-8 offset-md-2"> <div class="skill-item"> <h6>HTML CSS</h6> <div class="skill-bar"> <span>70%</span> <div class="filled-bar"></div> </div> </div> <div class="skill-item"> <h6>PSD Design</h6> <div class="skill-bar"> <span>90%</span> <div class="filled-bar-2"></div> </div> </div> <div class="skill-item"> <h6>Social Media</h6> <div class="skill-bar"> <span>70%</span> <div class="filled-bar"></div> </div> </div> <div class="skill-item last-skill"> <h6>Leadership</h6> <div class="skill-bar"> <span>90%</span> <div class="filled-bar-2"></div> </div> </div> </div> </div> </div> </div> </div> </div> </div> <div class="section animated-row" data-section="slide06"> <div class="section-inner"> <div class="row justify-content-center"> <div class="col-md-8 wide-col-laptop"> <div class="title-block animate" data-animate="fadeInUp"> <span>My Work</span> <h2>what i’ve done?</h2> </div> <div class="gallery-section"> <div class="gallery-list owl-carousel"> <div class="item animate" data-animate="fadeInUp"> <div class="portfolio-item"> <div class="thumb"> <img src="images/item-1.jpg" alt=""> </div> <div class="thumb-inner animate" data-animate="fadeInUp"> <h4>templatemo is the best</h4> <p>Please tell your friends about it. Templatemo is the best website to download free Bootstrap CSS templates.</p> </div> </div> </div> <div class="item animate" data-animate="fadeInUp"> <div class="portfolio-item"> <div class="thumb"> <img src="images/item-2.jpg" alt=""> </div> <div class="thumb-inner animate" data-animate="fadeInUp"> <h4>templatemo is the best</h4> <p>Please tell your friends about it. Templatemo is the best website to download free Bootstrap themes.</p> </div> </div> </div> <div class="item animate" data-animate="fadeInUp"> <div class="portfolio-item"> <div class="thumb"> <img src="images/item-3.jpg" alt=""> </div> <div class="thumb-inner animate" data-animate="fadeInUp"> <h4>templatemo is the best</h4> <p>Please tell your friends about it. Templatemo is the best website to download free Bootstrap layouts.</p> </div> </div> </div> <div class="item animate" data-animate="fadeInUp"> <div class="portfolio-item"> <div class="thumb"> <img src="images/item-1.jpg" alt=""> </div> <div class="thumb-inner animate" data-animate="fadeInUp"> <h4>templatemo is the best</h4> <p>Please tell your friends about it. Templatemo is the best website to download free Bootstrap templates.</p> </div> </div> </div> <div class="item animate" data-animate="fadeInUp"> <div class="portfolio-item"> <div class="thumb"> <img src="images/item-2.jpg" alt=""> </div> <div class="thumb-inner animate" data-animate="fadeInUp"> <h4>templatemo is the best</h4> <p>Please tell your friends about it. Templatemo is the best website to download Bootstrap CSS templates.</p> </div> </div> </div> <div class="item animate" data-animate="fadeInUp"> <div class="portfolio-item"> <div class="thumb"> <img src="images/item-3.jpg" alt=""> </div> <div class="thumb-inner animate" data-animate="fadeInUp"> <h4>templatemo is the best</h4> <p>Please tell your friends about it. Templatemo is the best website to download free Bootstrap templates.</p> </div> </div> </div> <div class="item animate" data-animate="fadeInUp"> <div class="portfolio-item"> <div class="thumb"> <img src="images/item-1.jpg" alt=""> </div> <div class="thumb-inner animate" data-animate="fadeInUp"> <h4>templatemo is the best</h4> <p>Please tell your friends about it. Templatemo is the best website to download free Bootstrap templates.</p> </div> </div> </div> <div class="item animate" data-animate="fadeInUp"> <div class="portfolio-item"> <div class="thumb"> <img src="images/item-2.jpg" alt=""> </div> <div class="thumb-inner animate" data-animate="fadeInUp"> <h4>templatemo is the best</h4> <p>Please tell your friends about it. Templatemo is the best website to download free Bootstrap templates.</p> </div> </div> </div> <div class="item animate" data-animate="fadeInUp"> <div class="portfolio-item"> <div class="thumb"> <img src="images/item-3.jpg" alt=""> </div> <div class="thumb-inner animate" data-animate="fadeInUp"> <h4>templatemo is the best</h4> <p>Please tell your friends about it. Templatemo is the best website to download free Bootstrap templates.</p> </div> </div> </div> </div> </div> </div> </div> </div> </div> <div class="section animated-row" data-section="slide05"> <div class="section-inner"> <div class="row justify-content-center"> <div class="col-md-8 wide-col-laptop"> <div class="title-block animate" data-animate="fadeInUp"> <span>TESTIMONIALS</span> <h2>what THEY SAY?</h2> </div> <div class="col-md-8 offset-md-2"> <div class="testimonials-section"> <div class="testimonials-slider owl-carousel"> <div class="item animate" data-animate="fadeInUp"> <div class="testimonial-item"> <div class="client-row"> <img src="images/profile-01.jpg" class="rounded-circle" alt="profile 1"> </div> <div class="testimonial-content"> <h4>Sandar</h4> <p>"Ut varius leo eu mauris lacinia, eleifend posuere urna gravida. Aenean a mattis lacus."</p> <span>Managing Director</span> </div> </div> </div> <div class="item animate" data-animate="fadeInUp"> <div class="testimonial-item"> <div class="client-row"> <img src="images/profile-01.jpg" class="rounded-circle" alt="profile 2"> </div> <div class="testimonial-content"> <h4>Shinn</h4> <p>"Nam iaculis, leo nec facilisis sollicitudin, dui massa tempus odio, vitae malesuada ante elit vitae eros."</p> <span>CEO and Founder</span> </div> </div> </div> <div class="item animate" data-animate="fadeInUp"> <div class="testimonial-item"> <div class="client-row"> <img src="images/profile-01.jpg" class="rounded-circle" alt="profile 3"> </div> <div class="testimonial-content"> <h4>Marlar</h4> <p>"Etiam efficitur, tortor facilisis finibus semper, diam magna fringilla lectus, et fringilla felis urna posuere tortor."</p> <span>Chief Marketing Officer</span> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> <div class="section animated-row" data-section="slide07"> <div class="section-inner"> <div class="row justify-content-center"> <div class="col-md-7 wide-col-laptop"> <div class="title-block animate" data-animate="fadeInUp"> <span>Contact</span> <h2>Get In Touch!</h2> </div> <div class="contact-section"> <div class="row"> <div class="col-md-6 animate" data-animate="fadeInUp"> <div class="contact-box"> <div class="contact-row"> <i class="fa fa-map-marker"></i> 270 Weaving Center Road, Meeravoda-04 , Batticaloa </div> <div class="contact-row"> <i class="fa fa-phone"></i> +94 756605254 </div> <div class="contact-row"> <i class="fa fa-envelope"></i> asfaqahmed356@gmail.com </div> </div> </div> <div class="col-md-6 animate" data-animate="fadeInUp"> <form id="ajax-contact" method="post" action="#"> <div class="input-field"> <input type="text" class="form-control" name="name" id="name" required placeholder="Name"> </div> <div class="input-field"> <input type="email" class="form-control" name="email" id="email" required placeholder="Email"> </div> <div class="input-field"> <textarea class="form-control" name="message" id="message" required placeholder="Message"></textarea> </div> <button class="btn" type="submit">Submit</button> </form> <div id="form-messages" class="mt-3"></div> </div> </div> </div> </div> </div> </div> </div> </div> <div id="social-icons"> <div class="text-right"> <ul class="social-icons"> <li><a href="https://www.facebook.com/asfaq.ahmed.338/" title="Facebook"><i class="fa fa-facebook"></i></a></li> <li><a href="https://twitter.com/asfaqah16919030" title="Twitter"><i class="fa fa-twitter"></i></a></li> <li><a href="https://www.linkedin.com/in/asfaq-ahmed-44212abb/" title="Linkedin"><i class="fa fa-linkedin"></i></a></li> <li><a href="https://www.instagram.com/asfaqahmed356/" title="Instagram"><i class="fa fa-behance"></i></a></li> </ul> </div> </div> </div> <script src="js/jquery.js"></script> <script src="js/bootstrap.min.js"></script> <script src="js/fullpage.min.js"></script> <script src="js/scrolloverflow.js"></script> <script src="js/owl.carousel.min.js"></script> <script src="js/jquery.inview.min.js"></script> <script src="js/form.js"></script> <script src="js/custom.js"></script> </body> </html>