wonkmy-company-web
/
about1.html



<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="itran | IT solutions - business services HTML template ">
    <!-- fav icon -->


    <!-- bootstarp css file -->
    <link rel="stylesheet" href="static/css/bootstrap.min.css">

    <!-- owl carousel css file -->
    <link rel="stylesheet" href="static/css/owl.carousel.min.css">
    <link rel="stylesheet" href="static/css/owl.theme.default.min.css">

    <!-- bootstrap icons -->
    <link rel="stylesheet" href="static/css/bootstrap-icons.css">
    <link rel="stylesheet" href="static/css/bootstrap-icons1.css">

    <!-- Google font -->
    <link rel="preconnect" href="https://fonts.googleapis.com/">
    <link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin="">
    <link href="static/css/css2.css" rel="stylesheet">

    <!-- main css file -->
    <link rel="stylesheet" href="static/css/style.css">
    <title>itran | IT solutions - business services HTML template </title>
</head>
<body>
      <!-- start scroll to top button -->
  <div id="progress">
    <span id="progress-value"><i class="bi bi-arrow-up-short"></i></span>
</div>
      <!-- end scroll to top button -->

   <!-- start preLoader -->
   <div id="preloader">
		<div class="spinner"></div>
	</div>
   <!-- end preLoader -->

    <!-- ======= start Header ======= -->
   <header class="header">
    <nav class="navbar navbar-expand-lg navbar-light">
      <div class="container">
        <a class="logo" href="#">itran</a>
        <!-- if you want to use image in your logo uncomment the following line -->
        <!-- <a class="navbar-brand " href="#"><img src="images/logo/logo.png" class="logo"  alt="LOGO"></a> -->
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
          <i class="bi bi-list"></i>
        </button>
        <div class="collapse navbar-collapse justify-content-between" id="navbarNav">
          <ul class="navbar-nav ms-auto" id="navbar">
            <li class="nav-item">
              <a class="nav-link " aria-current="page" href="index.html">Home</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="services.html">services</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="portfolio.html">projects</a>
            </li>
            <li class="nav-item dropdown">
              <a class="nav-link dropdown-toggle" href="" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                about
              </a>
              <ul class="dropdown-menu" aria-labelledby="navbarDropdown">
                <li><a class="dropdown-item py-2" href="">about 01</a></li>
                <li><a class="dropdown-item py-2" href="about2.html">about 02</a></li>
               </ul>
            </li>
            <li class="nav-item dropdown">
              <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                pages
              </a>
              <ul class="dropdown-menu" aria-labelledby="navbarDropdown">
                <li><a class="dropdown-item py-2" href="404.html">404 page</a></li>
                <li><a class="dropdown-item py-2" href="blog.html">blog page</a></li>
               </ul>
            </li>
          </ul>
          <a class="btn ms-auto" href="#">get started</a>
        </div>
      </div>
    </nav>
   </header>
    <!-- ======= end Header ======= -->


<!-- ============== Start About section ========== -->
<div class="about my-4 py-4" id="about">
    <div class="container">
      <h1 class="title col-12"><span class="unique-text">about</span> us</h1>
      <div class="row g-4">
        <div class="col-lg-6 col-12">
          <h2 class="my-2 col-10">We Deal With The Aspects Of Professional IT Services</h2>
          <p class="my-4 col-10">In today's fast-paced world, technology is constantly evolving, and keeping up with these changes can be challenging. That's where we come in. Our team of expert technicians and engineers stay ahead of the curve.</p>
          <p class="my-4 col-10">In today's fast-paced world, technology is constantly evolving, and keeping up with these changes can be challenging. That's where we come in. Our team of expert technicians and engineers stay ahead of the curve.</p>
          <a href="#" class="btn my-2">get started</a>
        </div>
        <div class="col-lg-6 col-12">
           <div class="feature my-2">
              <div class="feature-title align-items-center d-flex gap-2">
                <i class="bi bi-cpu-fill"></i>
                <h4 class="sub-title mx-2">Latest Technologies</h4>
              </div>
              <p class="my-3">
                In today's fast-paced world, technology is constantly evolving, and keeping up with these changes can be challenging. That's where we come in. Our team of expert technicians and engineers.
              </p>
           </div>
           <div class="feature my-2">
            <div class="feature-title align-items-center d-flex gap-2">
              <i class="bi bi-compass-fill"></i>
              <h4 class="sub-title mx-2">unique solutions</h4>
            </div>
            <p class="my-3">
              In today's fast-paced world, technology is constantly evolving, and keeping up with these changes can be challenging. That's where we come in. Our team of expert technicians and engineers.
            </p>
         </div>
         <div class="feature my-2">
          <div class="feature-title align-items-center d-flex gap-2">
            <i class="bi bi-diagram-3-fill"></i>
            <h4 class="sub-title mx-2">Powerful Strategies</h4>
          </div>
          <p class="my-3">
            In today's fast-paced world, technology is constantly evolving, and keeping up with these changes can be challenging. That's where we come in. Our team of expert technicians and engineers.
          </p>
       </div>
        </div>
      </div>

    </div>
  </div>
  <!-- ============== End About section ========== -->


<!-- ============== Start contact section ========== -->
<section class="container contact py-5" id="contact">
    <div class="row">
      <div class="col-12 col-lg-6 gy-3">
        <h1 class="title col-12">
          get in <span class="unique-text">touch</span>
         </h1>
         <p class="col-11">In today's fast-paced world, technology is constantly evolving, and keeping up
           with these changes can be challenging. That's where we come in. Our team of expert
           technicians and engineers stay ahead of the curve</p>
        <div class="d-flex align-items-center my-3">
          <i class="bi bi-envelope-fill"></i>
          <h5 class="ms-4">example@example.com</h5>
      </div>
      <div class="d-flex align-items-center my-3">
        <i class="bi bi-telephone-fill"></i>
        <h5 class="ms-4">+123 456 6789</h5>
    </div>
    <div class="d-flex align-items-center my-3">
      <i class="bi bi-map-fill"></i>
      <h5 class="ms-4">A108 Adam Street, New York, NY 535022</h5>
  </div>
      </div>
      <div class="col-12 col-lg-6">
          <!--Form To have user messages-->
          <form class="main-form" id="contact-us-form" action="contact.php" method="post"><span class="done-msg"></span>
                  <div class="my-2">
                  <h6>your full name <span class="unique-text">*</span></h6>
                  <input class="text-input" id="firstname" required="" name="firstname" type="text">
                  </div>
                  <div class="my-2">
                  <h6>your email<span class="unique-text">*</span></h6>
                  <input class="text-input" id="email" required="" name="email" type="email">
                  </div>
                  <div class="my-2">
                  <h6>your message<span class="unique-text">*</span></h6>
                  <textarea class=" text-input" rows="7" cols="30" required="" name="message"></textarea>
                  </div>
                <button class="btn" id="submit-btn" type="submit" name="UserSubmit">Send now</button>
          </form>
        </div>
  </div>
</section>
<!-- ============== end contact section ========== -->

<!-- ============== Start Footer section ========== -->
<div class="footer">
  <div class="container">
    <div class="py-4 d-flex flex-column  align-items-center justify-content-center ">
    <h1 class="title col-lg-10 col-12 text-center">Unlock your company's full potential with our expert IT services</h1>
    <a href="#" class="btn my-2">get started</a>
  </div>
    <div class="row align-items-center">
      <div class="col-12 col-lg-3 col-md-6 mx-auto my-4">
        <div class="box">
          <a href="#" class="logo dark">itran</a>
          <p class="col-10">photographer with a passion for
             capturing the beauty and emotion of life.</p>
              <div class="social d-flex">
                  <i class="bi bi-facebook"></i>
                  <i class="ms-3 bi bi-instagram"></i>
                  <i class="ms-3 bi bi-twitter "></i>
                  <i class="ms-3 bi bi-youtube"></i>
              </div>
        </div>
      </div>
      <div class="col-12 col-lg-3 col-md-6 mx-auto d-flex flex-column my-4">
        <h4 class="my-2">site map</h4>
        <ul>
        <li><a href="index.html"><i class="bi bi-chevron-right me-2"></i>home</a></li>
        <li><a href="about.html"><i class="bi bi-chevron-right me-2"></i>about</a></li>
        <li><a href="portfolio.html"><i class="bi bi-chevron-right me-2"></i>work</a></li>
        <li><a href="contact.html"><i class="bi bi-chevron-right me-2"></i>contact</a></li>
      </ul>
    </div>
      <div class="col-12 col-lg-3 col-md-6 mx-auto d-flex flex-column my-4">
        <h4 class="my-2">about us</h4>
        <ul>
        <li><a href="#"><i class="bi bi-chevron-right me-2"></i>our story</a></li>
        <li><a href="#"><i class="bi bi-chevron-right me-2"></i>team members</a></li>
        <li><a href="#"><i class="bi bi-chevron-right me-2"></i>careers</a></li>
        <li><a href="#"><i class="bi bi-chevron-right me-2"></i>contact us</a></li>
      </ul>
    </div>
      <div class="col-12 col-lg-3 col-md-6 mx-auto d-flex flex-column my-4">
          <h4 class="my-2">quick links</h4>
          <ul>
          <li><a href="#"><i class="bi bi-chevron-right me-2"></i>terms of use</a></li>
          <li><a href="#"><i class="bi bi-chevron-right me-2"></i>pricacy policy</a></li>
          <li><a href="#"><i class="bi bi-chevron-right me-2"></i>contact support</a></li>
          <li><a href="#"><i class="bi bi-chevron-right me-2"></i>faq's</a></li>
        </ul>
      </div>
    </div>
    </div>
    <hr>
    <div class="copyrights ">
      <div class="container">
        <div class="row">
          <div class="col-12 col-md-6 d-flex justify-content-start">
            <p class="creadits">

             Copyright &copy; 2023.Company name All rights reserved.<a target="_blank" href="https://sc.chinaz.com/moban/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a>
            </p>
          </div>
          <div class="col-12 col-md-6 d-flex justify-content-end">
            <div>
              <a href="#">Terms of Use </a>
              | <a href="#">Privacy Policy</a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
<!-- ============== end Footer section ========== -->


<!--  JQuery file     -->
<script src="static/js/jquery-3.6.1.min.js"></script>

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

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

<!--  counter     -->
<script src="static/js/jquery.counterup.min.js"></script>
<script src="static/js/jquery.waypoints.js"></script>

<!--  main js file  -->
<script src="static/js/main.js"></script>

</body>
</html>