| Current File : //home/tradevaly/demo.tradevaly.com.bd/content/New Design/Final/home.html |
<!DOCTYPE html>
<html lang="en">
<head>
<title>Trade Valy</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css?family=Work+Sans:200,300,400,500,600,700,800,900&display=swap" rel="stylesheet">
<link rel="stylesheet" href="vendors/font-awesome/css/fontawesome.css">
<link rel="stylesheet" href="vendors/magnific-popup/magnific-popup.css">
<link rel="stylesheet" href="vendors/slick/slick.css">
<link rel="stylesheet" href="vendors/animate.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="vendors/select2/select2.css">
</head>
<body>
<div id="site-wrapper" class="site-wrapper">
<header id="header" class="z-indx-1 main-header bg-white header-sticky header-sticky-smart header-style-01 header-float text-uppercase">
<div class="header-wrapper sticky-area">
<div class="container">
<div class="topbar d-flex">
<div class="topbar-item topbar-item-left d-flex align-items-center text-dark">
<div class="social-icon ">
<ul class="list-inline">
<li class="mr-1 shadow-sm px-2 py-2 bg-white rounded list-inline-item">
<a target="" title="" href="about.html">
<i class="fas fa-user-circle"></i>about us
</a>
</li>
<li class="mr-1 shadow-sm px-2 py-2 bg-white rounded list-inline-item">
<a target="" title="" href="contact.html">
<i class="fas fa-envelope"></i>contact us
</a>
</li>
<li class="mr-1 shadow-sm px-2 py-2 bg-white rounded list-inline-item">
<a target="" href="#">
<i class="fas fa-headset"></i>Customer Support
</a>
</li>
<li class="mr-1 shadow-sm px-2 py-2 bg-white rounded list-inline-item">
<a target="" href="#">
<i class="fas fa-download"></i>Download App
</a>
</li>
<li class="mr-1 shadow-sm px-2 py-2 bg-white rounded list-inline-item">
<a target="" href="">
<i class="fas fa-rss-square"></i>Blog
</a>
</li>
<li class="mr-1 shadow-sm px-2 py-2 bg-white rounded list-inline-item">
<a target="" href="#">
<i class="fas fa-briefcase"></i>Career
</a>
</li>
</ul>
</div>
</div>
<div class="topbar-item ml-auto d-flex align-items-center">
<div class="item">
<div class="social-icon text-dark">
<ul class="so-i-co list-inline">
<li class="mr-1 list-inline-item shadow-sm px-2 py-1 bg-white rounded">
<a target="_blank" title="Facebook" href="#"> <i class="fab fa-facebook-f"></i> <span>Facebook</span> </a>
</li>
<li class="list-inline-item shadow-sm px-2 py-1 bg-white rounded">
<a target="_blank" title="Twitter" href="#"> <i class="fab fa-twitter"></i> <span>Twitter</span> </a>
</li>
</ul>
</div>
</div>
<span class="separate">|</span>
<div class="shadow-sm px-2 py-1 bg-white rounded item language">
<div class="dropdown shadow-md">
<a href="#login-popup" class="log-btn" data-gtf-mfp="true" data-mfp-options='{"type":"inline"}'>
<i class="mr-1 fas fa-user-circle"></i>Sign In</a>
</div>
</div>
<div class="shadow-sm ml-2 px-2 py-1 bg-white rounded item language">
<li class="list-unstyled nav-item dropdown">
<img src="images/user.png" width="18" alt="User">
<a class="my-acc-u log-btn px-0 dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true">My Account
</a>
<div class="my-acc-drop rounded shadow-sm dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownMenuLink">
<a class="do-um dropdown-item" href="#">Dashboard</a>
<a class="do-um dropdown-item" href="#">My Profile</a>
<a class="do-um dropdown-item" href="#">Products</a>
<a class="do-um dropdown-item" href="#">Company Profile</a>
<a class="do-um dropdown-item" href="#">Premium Services</a>
<a class="do-um dropdown-item" data-toggle="modal" data-target="#exampleModalCenter" href="#exampleModalCenter">Popup Box</a>
<a class="do-um dropdown-item" data-toggle="modal" data-target="#exampleModalCenter2" href="#exampleModalCenter2">Select 2</a>
<a class="do-um dropdown-item" href="#">Logout</a>
</div>
</li>
</div>
</div>
</div>
<nav class="navbar navbar-expand-xl">
<div class="header-mobile d-flex d-xl-none flex-fill justify-content-between align-items-center">
<div class="navbar-toggler toggle-icon" data-toggle="collapse" data-target="#navbar-main-menu">
<span></span>
</div>
<a class="navbar-brand navbar-brand-mobile" href="index.html">
<img src="images/logo.svg" alt="TradeValy">
</a>
<a class="mobile-button-search" href="#search-popup" data-gtf-mfp="true" data-mfp-options='{"type":"inline","mainClass":"mfp-move-from-top mfp-align-top search-popup-bg","closeOnBgClick":false,"showCloseBtn":false}'><i class="far fa-search"></i></a>
</div>
<div class="collapse navbar-collapse" id="navbar-main-menu">
<a class="navbar-brand d-none d-xl-block mr-auto" href="index.html">
<img src="images/logo.svg" width="280" alt="TradeValy">
</a>
<ul class="navbar-nav">
<li class="nav-item"><a class="nav-link" href="index.html">Home</a></li>
<li class="nav-item"><a class="nav-link" href="companie.html">Companies</a></li>
<li class="nav-item">
<a class="nav-link" href="#">Services<span class="caret"><i class="fas fa-angle-down"></i></span></a>
<ul class="sub-menu x-animated x-fadeInUp">
<li class="nav-item"><a class="nav-link" href="">Search By Company</a></li>
<li class="nav-item"><a class="nav-link" href="">Buying/Selling</a></li>
<li class="nav-item"><a class="nav-link" href="">Advertise</a></li>
<li class="nav-item"><a class="nav-link" href="">Add Company</a></li>
</ul>
</li>
<li class="nav-item"><a class="nav-link" href="">Recommends</a></li>
<li class="nav-item"><a class="nav-link" href="news.html">Latest News</a></li>
</ul>
</nav>
</div>
</div>
</header>
<div class="content-wrap">
<section id="section-01" class="home-main-intro">
<div class="home-main-intro-container">
<div class="container">
<div class="heading mb-9">
<h1 class="mb-7">
<span class="d-block" data-animate="slideInLeft">Discover</span>
<span class="font-weight-light d-block" data-animate="fadeInRight">Your Desired Sourcing</span>
</h1>
<p class="h5 font-weight-normal text-secondary mb-0" data-animate="fadeInDown">
Find great places to stay, eat, shop, or visit from local experts.
</p>
</div>
<div class="form-search form-search-style-02 pb-9" data-animate="fadeInDown">
<form>
<div class="row align-items-end no-gutters">
<div class="col-xl-3 mb-4 mb-xl-0 py-3 px-4 bg-white border-right position-relative rounded-left form-search-item">
<label for="key-word" class="font-size-md font-weight-semibold text-dark mb-0 lh-1">What</label>
<div class="input-group dropdown show">
<input type="text" autocomplete="off" id="key-word" name="key-word" class="form-control form-control-mini border-0 px-0 bg-transparent" placeholder="Ex: Service" data-toggle="dropdown" aria-haspopup="true">
<a href="#" class="input-group-append text-decoration-none" data-toggle="dropdown">
<i class="fal fa-chevron-down"></i>
</a>
<ul class="dropdown-menu form-search-ajax" aria-labelledby="key-word">
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/1.png" width="25" alt="Icon">
<span class="font-size-md">Mechanical Engineering</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/2.png" width="25" alt="Icon">
<span class="font-size-md">Electrical & Electronics</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/3.png" width="25" alt="Icon">
<span class="font-size-md">Industrial Machinery</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/4.png" width="25" alt="Icon">
<span class="font-size-md">Industrial Chemicals</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/5.png" width="25" alt="Icon">
<span class="font-size-md">Tools & Hardware</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/6.png" width="25" alt="Icon">
<span class="font-size-md">Plastic & Rubber</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/7.png" width="25" alt="Icon">
<span class="font-size-md">Services To Industries</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/8.png" width="25" alt="Icon">
<span class="font-size-md">Printing & Packaging</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/9.png" width="25" alt="Icon">
<span class="font-size-md">Security & Fire Protection</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/10.png" width="25" alt="Icon">
<span class="font-size-md">Food & Beverage</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/11.png" width="25" alt="Icon">
<span class="font-size-md">Automobile & Accessories</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/12.png" width="25" alt="Icon">
<span class="font-size-md">Construction & Decoration</span>
</a>
</li>
</ul>
</div>
</div>
<div class="col-xl-7 mb-4 mb-xl-0 py-3 px-4 bg-white position-relative rounded-right form-search-item">
<label for="key-word" class="font-size-md font-weight-semibold text-dark mb-0 lh-1">Search</label>
<div class="input-group dropdown show">
<input type="text" autocomplete="off" id="region" name="region" class="form-control form-control-mini border-0 px-0 bg-transparent" placeholder="Products/Companies" data-toggle="dropdown" aria-haspopup="true">
</div>
</div>
<div class="col-xl-2 button">
<button type="submit" class="btn btn-primary btn-lg btn-icon-left btn-block"><i class="fal fa-search"></i>Search
</button>
</div>
</div>
</form>
</div>
<div class="font-size-lg mb-4" style="font-size: 1.5rem!important;font-weight: 600;color: #000;text-transform: uppercase;">Or browse the highlights</div>
<div class="hon-12-icon list-inline pb-8 flex-wrap my-n2">
<div class="list-inline-item py-2">
<a href="" class="card border-0 icon-box-style-01 link-hover-dark-white">
<div class="card-body p-0">
<img src="images/1.png" alt="Icon">
<span class="card-text font-size-md font-weight-semibold mt-1 d-block">
</span>
</div>
<span class="ic-tex">Cat Name</span>
</a>
</div>
<div class="list-inline-item py-2">
<a href="" class="card border-0 icon-box-style-01 link-hover-dark-white">
<div class="card-body p-0">
<img src="images/2.png" alt="Icon">
<span class="card-text font-size-md font-weight-semibold mt-1 d-block">
</span>
</div>
<span class="ic-tex">Cat Name</span>
</a>
</div>
<div class="list-inline-item py-2">
<a href="" class="card border-0 icon-box-style-01 link-hover-dark-white">
<div class="card-body p-0">
<img src="images/3.png" alt="Icon">
<span class="card-text font-size-md font-weight-semibold mt-1 d-block">
</span>
</div>
<span class="ic-tex">Cat Name</span>
</a>
</div>
<div class="list-inline-item py-2">
<a href="" class="card border-0 link-hover-dark-white icon-box-style-01">
<div class="card-body p-0">
<img src="images/4.png" alt="Icon">
<span class="card-text font-size-md font-weight-semibold mt-1 d-block">
</span>
</div>
<span class="ic-tex">Cat Name</span>
</a>
</div>
<div class="list-inline-item py-2">
<a href="" class="card border-0 link-hover-dark-white icon-box-style-01">
<div class="card-body p-0">
<img src="images/5.png" alt="Icon">
<span class="card-text font-size-md font-weight-semibold mt-1 d-block">
</span>
</div>
<span class="ic-tex">Cat Name</span>
</a>
</div>
<div class="list-inline-item py-2">
<a href="" class="card border-0 link-hover-dark-white icon-box-style-01">
<div class="card-body p-0">
<img src="images/6.png" alt="Icon">
<span class="card-text font-size-md font-weight-semibold mt-1 d-block">
</span>
</div>
<span class="ic-tex">Cat Name</span>
</a>
</div>
<div class="list-inline-item py-2">
<a href="" class="card border-0 link-hover-dark-white icon-box-style-01">
<div class="card-body p-0">
<img src="images/7.png" alt="Icon">
<span class="card-text font-size-md font-weight-semibold mt-1 d-block">
</span>
</div>
<span class="ic-tex">Cat Name</span>
</a>
</div>
<div class="list-inline-item py-2">
<a href="" class="card border-0 link-hover-dark-white icon-box-style-01">
<div class="card-body p-0">
<img src="images/8.png" alt="Icon">
<span class="card-text font-size-md font-weight-semibold mt-1 d-block">
</span>
</div>
<span class="ic-tex">Cat Name</span>
</a>
</div>
<div class="list-inline-item py-2">
<a href="" class="card border-0 link-hover-dark-white icon-box-style-01">
<div class="card-body p-0">
<img src="images/9.png" alt="Icon">
<span class="card-text font-size-md font-weight-semibold mt-1 d-block">
</span>
</div>
<span class="ic-tex">Cat Name</span>
</a>
</div>
<div class="list-inline-item py-2">
<a href="" class="card border-0 link-hover-dark-white icon-box-style-01">
<div class="card-body p-0">
<img src="images/10.png" alt="Icon">
<span class="card-text font-size-md font-weight-semibold mt-1 d-block">
</span>
</div>
<span class="ic-tex">Cat Name</span>
</a>
</div>
<div class="list-inline-item py-2">
<a href="" class="card border-0 link-hover-dark-white icon-box-style-01">
<div class="card-body p-0">
<img src="images/11.png" alt="Icon">
<span class="card-text font-size-md font-weight-semibold mt-1 d-block">
</span>
</div>
<span class="ic-tex">Cat Name</span>
</a>
</div>
<div class="list-inline-item py-2">
<a href="" class="card border-0 link-hover-dark-white icon-box-style-01">
<div class="card-body p-0">
<img src="images/12.png" alt="Icon">
<span class="card-text font-size-md font-weight-semibold mt-1 d-block">
</span>
</div>
<span class="ic-tex">Cat Name</span>
</a>
</div>
</div>
</div>
<div class="home-main-how-it-work bg-white pt-0">
<div class="job-by mt-0">
<div class="popo-ban-tab job-filter">
<div class="container">
<ul class="nav nav-pills tab-style-02 row font-size-lg" role="tablist">
<li class="nav-item col-md-6"> <a class="nav-link active" id="category-tab" data-toggle="tab" href="#category" role="tab" aria-controls="category" aria-selected="true">Hot Products By Categories</a> </li>
<li class="nav-item col-md-6"> <a class="nav-link" id="popular-search-tab" data-toggle="tab" href="#popular-search" role="tab" aria-controls="popular-search" aria-selected="false">Popular Search</a> </li>
</ul>
</div>
</div>
<div class="job-by-container bg-white">
<div class="container">
<div class="tab-content">
<div class="tab-pane fade show active" id="category" role="tabpanel" aria-labelledby="category-tab">
<div class="row">
<div class="col-sm-6 col-md-3">
<ul class="list-group list-group-flush list-group-borderless py-6">
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Accountancy</a><span class="d-inline-block text-green ml-1">(8,087)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Administration</a><span class="d-inline-block text-green ml-1">(11,732)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Advertising</a><span class="d-inline-block text-green ml-1">(379)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Aerospace</a><span class="d-inline-block text-green ml-1">(35)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Apprenticeships</a><span class="d-inline-block text-green ml-1">(10,278)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Automotive</a><span class="d-inline-block text-green ml-1">(263)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Banking</a><span class="d-inline-block text-green ml-1">(1,729)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Call Centre</a><span class="d-inline-block text-green ml-1">(1,843)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Catering</a><span class="d-inline-block text-green ml-1">(5,067)</span> </li>
</ul>
</div>
<div class="col-sm-6 col-md-3">
<ul class="list-group list-group-flush list-group-borderless py-6">
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Digital</a><span class="d-inline-block text-green ml-1">(2,636)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Education</a><span class="d-inline-block text-green ml-1">(6,624)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Engineering</a><span class="d-inline-block text-green ml-1">(12,180)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Finance</a><span class="d-inline-block text-green ml-1">(3,791)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">FMCG</a><span class="d-inline-block text-green ml-1">(4,634)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Graduate</a><span class="d-inline-block text-green ml-1">(8,797)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Healthcare</a><span class="d-inline-block text-green ml-1">(6,786)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Hospitality</a><span class="d-inline-block text-green ml-1">(5,029)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">HR</a><span class="d-inline-block text-green ml-1">(2,593)</span> </li>
</ul>
</div>
<div class="col-sm-6 col-md-3">
<ul class="list-group list-group-flush list-group-borderless py-6">
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Management Consultancy</a><span class="d-inline-block text-green ml-1">(174)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Manufacturing</a><span class="d-inline-block text-green ml-1">(5,212)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Marketing</a><span class="d-inline-block text-green ml-1">(5,281)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Media</a><span class="d-inline-block text-green ml-1">(1,513)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Nursing</a><span class="d-inline-block text-green ml-1">(2,949)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Oil and Gas</a><span class="d-inline-block text-green ml-1">(169)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">PA</a><span class="d-inline-block text-green ml-1">(1,680)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Part-time</a><span class="d-inline-block text-green ml-1">(10,942)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Pharmaceutical</a><span class="d-inline-block text-green ml-1">(1,166)</span> </li>
</ul>
</div>
<div class="col-sm-6 col-md-3">
<ul class="list-group list-group-flush list-group-borderless py-6">
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Retail</a><span class="d-inline-block text-green ml-1">(6,905)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Sales</a><span class="d-inline-block text-green ml-1">(23,246)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Science</a><span class="d-inline-block text-green ml-1">(1,790)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Secretarial</a><span class="d-inline-block text-green ml-1">(1,569)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Senior Appointments</a><span class="d-inline-block text-green ml-1">(515)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Social Work</a><span class="d-inline-block text-green ml-1">(768)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Teaching</a><span class="d-inline-block text-green ml-1">(3,548)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Telecoms</a><span class="d-inline-block text-green ml-1">(220)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Temporary</a><span class="d-inline-block text-green ml-1">(17,272)</span> </li>
</ul>
</div>
</div>
</div>
<div class="tab-pane fade" id="popular-search" role="tabpanel" aria-labelledby="popular-search-tab">
<div class="row">
<div class="col-sm-6 col-md-3">
<ul class="list-group list-group-flush list-group-borderless py-6">
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Accountancy</a><span class="d-inline-block text-green ml-1">(8,087)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Administration</a><span class="d-inline-block text-green ml-1">(11,732)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Advertising</a><span class="d-inline-block text-green ml-1">(379)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Aerospace</a><span class="d-inline-block text-green ml-1">(35)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Apprenticeships</a><span class="d-inline-block text-green ml-1">(10,278)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Automotive</a><span class="d-inline-block text-green ml-1">(263)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Banking</a><span class="d-inline-block text-green ml-1">(1,729)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Call Centre</a><span class="d-inline-block text-green ml-1">(1,843)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Catering</a><span class="d-inline-block text-green ml-1">(5,067)</span> </li>
</ul>
</div>
<div class="col-sm-6 col-md-3">
<ul class="list-group list-group-flush list-group-borderless py-6">
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Digital</a><span class="d-inline-block text-green ml-1">(2,636)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Education</a><span class="d-inline-block text-green ml-1">(6,624)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Engineering</a><span class="d-inline-block text-green ml-1">(12,180)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Finance</a><span class="d-inline-block text-green ml-1">(3,791)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">FMCG</a><span class="d-inline-block text-green ml-1">(4,634)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Graduate</a><span class="d-inline-block text-green ml-1">(8,797)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Healthcare</a><span class="d-inline-block text-green ml-1">(6,786)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Hospitality</a><span class="d-inline-block text-green ml-1">(5,029)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">HR</a><span class="d-inline-block text-green ml-1">(2,593)</span> </li>
</ul>
</div>
<div class="col-sm-6 col-md-3">
<ul class="list-group list-group-flush list-group-borderless py-6">
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Management Consultancy</a><span class="d-inline-block text-green ml-1">(174)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Manufacturing</a><span class="d-inline-block text-green ml-1">(5,212)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Marketing</a><span class="d-inline-block text-green ml-1">(5,281)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Media</a><span class="d-inline-block text-green ml-1">(1,513)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Nursing</a><span class="d-inline-block text-green ml-1">(2,949)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Oil and Gas</a><span class="d-inline-block text-green ml-1">(169)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">PA</a><span class="d-inline-block text-green ml-1">(1,680)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Part-time</a><span class="d-inline-block text-green ml-1">(10,942)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Pharmaceutical</a><span class="d-inline-block text-green ml-1">(1,166)</span> </li>
</ul>
</div>
<div class="col-sm-6 col-md-3">
<ul class="list-group list-group-flush list-group-borderless py-6">
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Retail</a><span class="d-inline-block text-green ml-1">(6,905)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Sales</a><span class="d-inline-block text-green ml-1">(23,246)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Science</a><span class="d-inline-block text-green ml-1">(1,790)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Secretarial</a><span class="d-inline-block text-green ml-1">(1,569)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Senior Appointments</a><span class="d-inline-block text-green ml-1">(515)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Social Work</a><span class="d-inline-block text-green ml-1">(768)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Teaching</a><span class="d-inline-block text-green ml-1">(3,548)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Telecoms</a><span class="d-inline-block text-green ml-1">(220)</span> </li>
<li class="list-group-item bg-transparent p-0"> <a href="#" class="text-dark ">Temporary</a><span class="d-inline-block text-green ml-1">(17,272)</span> </li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="section-02" class="mt-5 pb- advertise-banner">
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-8 col-lg-8"> <img src="images/Web-UI-UX-Design.jpg" alt=""> </div>
<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4"> <img src="images/Web-UI-UX-Design2.jpg" alt="" class="mb-0"> </div>
</div>
</div>
</section>
<section id="section-03" class="mt-7 pb-8 our-directory">
<div class="container">
<div class="mb-7">
<div class="row">
<h2 class="col-sm-9 col-md-11 mb-0">
<span class="font-weight-semibold">Trending </span>
<span class="font-weight-light">Offers</span>
</h2>
<div class="col-sm-3 col-md-1 mr-0 ml-auto d-flex slick-custom-nav pl-5">
<div class="arrow slick-prev disabled" id="previous"><i class="fas fa-chevron-left"></i></div>
<div class="arrow slick-next" id="next"><i class="fas fa-chevron-right"></i></div>
</div>
</div><!-- row -->
</div>
</div>
<div class="container container-1720">
<div class="tab-content">
<div class="tab-pane fade show active" id="all" role="tabpanel" aria-labelledby="all">
<div class="slick-slider arrow-top full-slide custom-nav equal-height" data-slick-options='{"slidesToShow": 5,"autoplay":false,"dots":false,"arrows":false,"responsive":[{"breakpoint": 2000,"settings": {"slidesToShow": 4}},{"breakpoint": 1500,"settings": {"slidesToShow": 3}},{"breakpoint": 1000,"settings": {"slidesToShow": 2}},{"breakpoint": 770,"settings": {"slidesToShow": 1}}]}'>
<div class="box" data-animate="fadeInUp">
<div class="store card border-0 rounded-0">
<div class="position-relative store-image">
<a href="">
<img src="images/shop/shop-1.jpg" alt="store 1" class="card-img-top rounded-0">
</a>
<div class="image-content position-absolute d-flex align-items-center">
<div class="content-left mr-auto">
<div class="badge badge-primary">Featured</div>
</div>
<div class="content-right ml-auto d-flex w-lg show-link">
<a href="images/shop/full-shop-1.jpg" class="q-viw item viewing" data-toggle="tooltip" data-placement="top" title="Quickview" data-gtf-mfp="true">
<i class="fas fa-expand-arrows-alt"></i>
</a>
</div>
</div>
</div>
<div class="card-body px-0 pb-5 pt-3">
<a href="" class="card-title h5 text-dark d-inline-block mb-2"><span class="letter-spacing-25">Roman
Kraft Hotel</span></a>
<ul class="list-inline store-meta mb-4 font-size-sm d-flex align-items-center flex-wrap">
<li class="list-inline-item"><span class="badge badge-success d-inline-block mr-1">5.0</span><span>4 rating</span></li>
<li class="list-inline-item separate"></li>
<li class="list-inline-item"><span class="mr-1">From</span><span class="text-danger font-weight-semibold">$56.00</span></li>
<li class="list-inline-item separate"></li>
<li class="list-inline-item">
<a href="#" class="link-hover-secondary-primary">
<svg class="icon icon-bed">
<use xlink:href="#icon-bed"></use>
</svg>
<span>Hotel</span>
</a>
</li>
</ul>
<div class="media">
<a href="#" class="d-inline-block mr-3"><img src="images/listing/testimonial-1.png" alt="testimonial" class="rounded-circle">
</a>
<div class="media-body lh-14 font-size-sm">Overlooking Square and walk from the tube station of the same name...
</div>
</div>
</div>
<div class="card-footer align-items-center text-center"> <a href="#" class="text-danger" tabindex="0">view offer</a> </div>
</div>
</div>
<div class="box" data-animate="fadeInUp">
<div class="store card border-0 rounded-0">
<div class="position-relative store-image">
<a href="">
<img src="images/shop/shop-2.jpg" alt="store 1" class="card-img-top rounded-0">
</a>
<div class="image-content position-absolute d-flex align-items-center">
<div class="content-left mr-auto">
<div class="badge badge-primary">Featured</div>
</div>
<div class="content-right ml-auto d-flex w-lg show-link">
<a href="images/shop/full-shop-2.jpg" class="q-viw item viewing" data-toggle="tooltip" data-placement="top" title="Quickview" data-gtf-mfp="true">
<i class="fas fa-expand-arrows-alt"></i>
</a>
</div>
</div>
</div>
<div class="card-body px-0 pb-5 pt-3">
<a href="" class="card-title h5 text-dark d-inline-block mb-2"><span class="letter-spacing-25">Roman
Kraft Hotel</span></a>
<ul class="list-inline store-meta mb-4 font-size-sm d-flex align-items-center flex-wrap">
<li class="list-inline-item"><span class="badge badge-success d-inline-block mr-1">5.0</span><span>4 rating</span></li>
<li class="list-inline-item separate"></li>
<li class="list-inline-item"><span class="mr-1">From</span><span class="text-danger font-weight-semibold">$56.00</span></li>
<li class="list-inline-item separate"></li>
<li class="list-inline-item">
<a href="#" class="link-hover-secondary-primary">
<svg class="icon icon-bed">
<use xlink:href="#icon-bed"></use>
</svg>
<span>Hotel</span>
</a>
</li>
</ul>
<div class="media">
<a href="#" class="d-inline-block mr-3"><img src="images/listing/testimonial-2.png" alt="testimonial" class="rounded-circle">
</a>
<div class="media-body lh-14 font-size-sm">Overlooking Square and walk from the tube station of the same name...
</div>
</div>
</div>
<div class="card-footer align-items-center text-center"> <a href="#" class="text-danger" tabindex="0">view offer</a> </div>
</div>
</div>
<div class="box" data-animate="fadeInUp">
<div class="store card border-0 rounded-0">
<div class="position-relative store-image">
<a href="">
<img src="images/shop/shop-3.jpg" alt="store 1" class="card-img-top rounded-0">
</a>
<div class="image-content position-absolute d-flex align-items-center">
<div class="content-left mr-auto">
<div class="badge badge-primary">Featured</div>
</div>
<div class="content-right ml-auto d-flex w-lg show-link">
<a href="images/shop/full-shop-3.jpg" class="q-viw item viewing" data-toggle="tooltip" data-placement="top" title="Quickview" data-gtf-mfp="true">
<i class="fas fa-expand-arrows-alt"></i>
</a>
</div>
</div>
</div>
<div class="card-body px-0 pb-5 pt-3">
<a href="" class="card-title h5 text-dark d-inline-block mb-2"><span class="letter-spacing-25">Roman
Kraft Hotel</span></a>
<ul class="list-inline store-meta mb-4 font-size-sm d-flex align-items-center flex-wrap">
<li class="list-inline-item"><span class="badge badge-success d-inline-block mr-1">5.0</span><span>4 rating</span></li>
<li class="list-inline-item separate"></li>
<li class="list-inline-item"><span class="mr-1">From</span><span class="text-danger font-weight-semibold">$56.00</span></li>
<li class="list-inline-item separate"></li>
<li class="list-inline-item">
<a href="#" class="link-hover-secondary-primary">
<svg class="icon icon-bed">
<use xlink:href="#icon-bed"></use>
</svg>
<span>Hotel</span>
</a>
</li>
</ul>
<div class="media">
<a href="#" class="d-inline-block mr-3"><img src="images/listing/testimonial-3.png" alt="testimonial" class="rounded-circle">
</a>
<div class="media-body lh-14 font-size-sm">Overlooking Square and walk from the tube station of the same name...
</div>
</div>
</div>
<div class="card-footer align-items-center text-center"> <a href="#" class="text-danger" tabindex="0">view offer</a> </div>
</div>
</div>
<div class="box" data-animate="fadeInUp">
<div class="store card border-0 rounded-0">
<div class="position-relative store-image">
<a href="">
<img src="images/shop/shop-4.jpg" alt="store 1" class="card-img-top rounded-0">
</a>
<div class="image-content position-absolute d-flex align-items-center">
<div class="content-left mr-auto">
<div class="badge badge-primary">Featured</div>
</div>
<div class="content-right ml-auto d-flex w-lg show-link">
<a href="images/shop/full-shop-4.jpg" class="q-viw item viewing" data-toggle="tooltip" data-placement="top" title="Quickview" data-gtf-mfp="true">
<i class="fas fa-expand-arrows-alt"></i>
</a>
</div>
</div>
</div>
<div class="card-body px-0 pb-5 pt-3">
<a href="" class="card-title h5 text-dark d-inline-block mb-2"><span class="letter-spacing-25">Roman
Kraft Hotel</span></a>
<ul class="list-inline store-meta mb-4 font-size-sm d-flex align-items-center flex-wrap">
<li class="list-inline-item"><span class="badge badge-success d-inline-block mr-1">5.0</span><span>4 rating</span></li>
<li class="list-inline-item separate"></li>
<li class="list-inline-item"><span class="mr-1">From</span><span class="text-danger font-weight-semibold">$56.00</span></li>
<li class="list-inline-item separate"></li>
<li class="list-inline-item">
<a href="#" class="link-hover-secondary-primary">
<svg class="icon icon-bed">
<use xlink:href="#icon-bed"></use>
</svg>
<span>Hotel</span>
</a>
</li>
</ul>
<div class="media">
<a href="#" class="d-inline-block mr-3"><img src="images/listing/testimonial-1.png" alt="testimonial" class="rounded-circle">
</a>
<div class="media-body lh-14 font-size-sm">Overlooking Square and walk from the tube station of the same name...
</div>
</div>
</div>
<div class="card-footer align-items-center text-center"> <a href="#" class="text-danger" tabindex="0">view offer</a> </div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="trade-vdo pt-7 pb-7">
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-7 col-lg-7 mb-lg-0 mb-5" data-animate="slideInLeft">
<div class="mb-4">
<h4 class="font-weight-bold text-uppercase">FEATURED ADVERTISERS</h4> </div>
<div class="slick-slider arrows-inner " data-slick-options='{"slidesToShow": 1, "autoplay":false,"dots":false}'>
<div class="box"> <img src="images/slid-ad.jpg" alt=""> </div>
<div class="box"> <img src="images/slid-ad.jpg" alt=""> </div>
<div class="box"> <img src="images/slid-ad.jpg" alt=""> </div>
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-5 col-lg-5 listing-job-feature" data-animate="slideInRight">
<div class="mb-4">
<h4 class="font-weight-bold text-uppercase">Why advertise with TradeValy?</h4> </div>
<div class="ifram-box">
<iframe width="" height="" src="https://www.youtube.com/embed/j8LU-1Cetmk" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</div>
</div>
</div>
</section>
<section id="section-04" class="sub-cat pt-8 pb-7 text-center categories">
<div class="container">
<div class="heading text-center mb-5">
<h3 class="mb-2 font-weight-bold">
What type of services are you looking for?
</h3>
<div class="font-size-lg mb-0">
With over 5000 inviduals and centers in the automotive field directory provides a listing of all provides.
</div>
</div>
<div class="row">
<div class="col-sm-6 col-md-4 col-lg-3 mb-4" data-animate="pulse">
<a class="btn btn-hero text-capitalize rounded-0" title="Category" href="">
Mechanical Engineering </a>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 mb-4" data-animate="pulse">
<a class="btn btn-hero text-capitalize rounded-0" title="Category" href="">Electrical & Electronics</a>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 mb-4" data-animate="pulse">
<a class="btn btn-hero text-capitalize rounded-0" title="Category" href="">Industrial Machinery</a>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 mb-4" data-animate="pulse">
<a class="btn btn-hero text-capitalize rounded-0" title="Category" href="">Industrial Chemicals </a>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 mb-4" data-animate="pulse">
<a class="btn btn-hero text-capitalize rounded-0" title="Category" href="">Tools & Hardware</a>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 mb-4" data-animate="pulse">
<a class="btn btn-hero text-capitalize rounded-0" title="Category" href="">Plastic & Rubber</a>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 mb-4" data-animate="pulse">
<a class="btn btn-hero text-capitalize rounded-0" title="Category" href="">Services To Industries </a>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 mb-4" data-animate="pulse">
<a class="btn btn-hero text-capitalize rounded-0" title="Category" href="">Printing & Packaging</a>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 mb-4" data-animate="pulse">
<a class="btn btn-hero text-capitalize rounded-0" title="Category" href="">Security & Fire Protection</a>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 mb-4" data-animate="pulse">
<a class="btn btn-hero text-capitalize rounded-0" title="Category" href="">
Food & Beverage</a>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 mb-4" data-animate="pulse">
<a class="btn btn-hero text-capitalize rounded-0" title="Category" href="">
Automobile & Accessories </a>
</div>
<div class="col-sm-6 col-md-4 col-lg-3 mb-4" data-animate="pulse">
<a class="btn btn-hero text-capitalize rounded-0" title="Category" href="">
Construction & Decoration </a>
</div>
</div>
</div>
</section>
<section id="" class="pt-7 pb-7 advertise-banner">
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4"> <img src="images/Web-UI-UX-Design2.jpg" alt=""> </div>
<div class="col-xs-12 col-sm-12 col-md-8 col-lg-8"> <img src="images/Web-UI-UX-Design.jpg" alt=""> </div>
</div>
</div>
</section>
<section class="home-main-testimonial pt-8 pb-9" id="section-04">
<div class="container">
<h2 class="mb-8">
<span class="font-weight-semibold">Clients </span>
<span class="font-weight-light">Review</span>
</h2>
<div class="container">
<div class="row">
<div class="col col-md-12">
<div class="slick-slider testimonials-slider arrow-top" data-slick-options='{"slidesToShow": 2,"autoplay":false,"dots":false,"responsive":[{"breakpoint": 992,"settings": {"slidesToShow": 1,"arrows":false}}]}'>
<div class="box">
<div class="card testimonial h-100 border-0 bg-transparent">
<a href="#" class="author-image">
<img src="images/listing/client-1.png" alt="Testimonial" class="rounded-circle">
</a>
<div class="card-body bg-white">
<div class="testimonial-icon text-right">
<svg class="icon icon-quote">
<use xlink:href="#icon-quote"></use>
</svg>
</div>
<ul class="list-inline mb-4 d-flex align-items-end flex-wrap">
<li class="list-inline-item">
<a href="#" class="font-size-lg text-dark font-weight-semibold d-inline-block">Kanye
West
</a>
</li>
<li class="list-inline-item">
<span class="h5 font-weight-light mb-0 d-inline-block ml-1 text-gray">/</span>
</li>
<li>
<span class="text-gray">
CEO at Google INC
</span>
</li>
</ul>
<div class="card-text text-gray pr-4">Sed elit quam, iaculis
sed
semper sit amet
udin
vitae nibh.<br> at magna akal semperFusce commodo molestie
luctus.Lorem ipsum Dolor tusima olatiup.
</div>
</div>
</div>
</div>
<div class="box">
<div class="card testimonial h-100 border-0 bg-transparent">
<a href="#" class="author-image">
<img src="images/listing/client-2.png" alt="Testimonial" class="rounded-circle">
</a>
<div class="card-body bg-white">
<div class="testimonial-icon text-right">
<svg class="icon icon-quote">
<use xlink:href="#icon-quote"></use>
</svg>
</div>
<ul class="list-inline mb-4 d-flex align-items-end flex-wrap">
<li class="list-inline-item">
<a href="#" class="font-size-lg text-dark font-weight-semibold d-inline-block">Anabella
Kleva
</a>
</li>
<li class="list-inline-item">
<span class="h5 font-weight-light mb-0 d-inline-block ml-1 text-gray">/</span>
</li>
<li class="list-inline-item">
<span class="text-gray">
Managerment at Envato
</span>
</li>
</ul>
<div class="card-text text-gray pr-4">Sed elit quam, iaculis
sed
semper sit amet
udin
vitae nibh.<br> at magna akal semperFusce commodo molestie
luctus.Lorem ipsum Dolor tusima olatiup.
</div>
</div>
</div>
</div>
<div class="box">
<div class="card testimonial h-100 border-0 bg-transparent">
<a href="#" class="author-image">
<img src="images/listing/client-1.png" alt="Testimonial" class="rounded-circle">
</a>
<div class="card-body bg-white">
<div class="testimonial-icon text-right">
<svg class="icon icon-quote">
<use xlink:href="#icon-quote"></use>
</svg>
</div>
<ul class="list-inline mb-4 d-flex align-items-end flex-wrap">
<li class="list-inline-item">
<a href="#" class="font-size-lg text-dark font-weight-semibold d-inline-block">Kanye
West
</a>
</li>
<li class="list-inline-item">
<span class="h5 font-weight-light mb-0 d-inline-block ml-1 text-gray">/</span>
</li>
<li>
<span class="text-gray">
CEO at Google INC
</span>
</li>
</ul>
<div class="card-text text-gray pr-4">Sed elit quam, iaculis
sed
semper sit amet
udin
vitae nibh.<br> at magna akal semperFusce commodo molestie
luctus.Lorem ipsum Dolor tusima olatiup.
</div>
</div>
</div>
</div>
<div class="box">
<div class="card testimonial h-100 border-0 bg-transparent">
<a href="#" class="author-image">
<img src="images/listing/client-2.png" alt="Testimonial" class="rounded-circle">
</a>
<div class="card-body bg-white">
<div class="testimonial-icon text-right">
<svg class="icon icon-quote">
<use xlink:href="#icon-quote"></use>
</svg>
</div>
<ul class="list-inline mb-4 d-flex align-items-end flex-wrap">
<li class="list-inline-item">
<a href="#" class="font-size-lg text-dark font-weight-semibold d-inline-block">Anabella
Kleva
</a>
</li>
<li class="list-inline-item">
<span class="h5 font-weight-light mb-0 d-inline-block ml-1 text-gray">/</span>
</li>
<li class="list-inline-item">
<span class="text-gray">
Managerment at Envato
</span>
</li>
</ul>
<div class="card-text text-gray pr-4">Sed elit quam, iaculis
sed
semper sit amet
udin
vitae nibh.<br> at magna akal semperFusce commodo molestie
luctus.Lorem ipsum Dolor tusima olatiup.
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="section-08" class="certifid mt-10 py-5">
<div class="container">
<div class="row align-items-center">
<div class="text-dark col-xs-12 col-sm-12 col-md-6 col-lg-6">
<h2 class="mb-1 text-white">
Tradevely recommends certified !
</h2>
<p class="mb-0 font-size-sm text-white"> business who are with tradevaly recommends will be awareded a sticker to paste in their establishment. with this sticker, customer can easily find your business listing and information on tradevaly recommends, using th QR Code. </p>
</div>
<div class="col-xs-12 col-sm-12 col-md-3 col-lg-3 text-center">
<img class="shadow-sm img" src="images/qr.png" alt="">
</div>
<div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
<div class="qr-text text-center">
<h3 class="text-upper">get your business listet</h3>
<div class="d-block text-white"> <i class="fas fa-arrow-down"></i> </div>
<a href="#" style="font-size:15px!important;" class="btn btn-white btn-icon-right font-size-h5 px-6 py-3 lh-1"> Tradevaler Recommends !<i class="fal fa-chevron-right"></i></a>
</div>
</div>
</div>
</div>
</section>
<section class="bg-white pagignation-main mt-0 py-7">
<div class="container">
<div class="row">
<div class="col-xs-12 text-center col-sm-12 col-md-12 col-lg-12">
<h2 class="mb-3"><span> Search Product Alphabetically </span></h2>
<div class="origin-color si-square">
<ul class="fot-alpha alpha-sort list-inline text-center">
<li><a href="alphabetically-search.html">A</a></li>
<li><a href="alphabetically-search.html">B</a></li>
<li><a href="alphabetically-search.html">C</a></li>
<li><a href="alphabetically-search.html">D</a></li>
<li><a href="alphabetically-search.html">E</a></li>
<li><a href="alphabetically-search.html">F</a></li>
<li><a href="alphabetically-search.html">G</a></li>
<li><a href="alphabetically-search.html">H</a></li>
<li><a href="alphabetically-search.html">I</a></li>
<li><a href="alphabetically-search.html">J</a></li>
<li><a href="alphabetically-search.html">K</a></li>
<li><a href="alphabetically-search.html">L</a></li>
<li><a href="alphabetically-search.html">M</a></li>
<li><a href="alphabetically-search.html">N</a></li>
<li><a href="alphabetically-search.html">O</a></li>
<li><a href="alphabetically-search.html">P</a></li>
<li><a href="alphabetically-search.html">Q</a></li>
<li><a href="alphabetically-search.html">R</a></li>
<li><a href="alphabetically-search.html">S</a></li>
<li><a href="alphabetically-search.html">T</a></li>
<li><a href="alphabetically-search.html">W</a></li>
<li><a href="alphabetically-search.html">X</a></li>
<li><a href="alphabetically-search.html">Y</a></li>
<li><a href="alphabetically-search.html">Z</a></li>
</ul>
</div>
</div>
</div>
</div>
</section>
</div>
<footer class="main-footer main-footer-style-01 bg-pattern-01 pt-8 pb-5">
<div class="footer-second">
<div class="container">
<div class="row">
<div class="col-sm-6 col-lg-4 mb-4 mb-lg-0">
<div class="mb-8"><img src="images/logo.svg" width="250" alt="TradeValy"></div>
<div class="mb-7">
<div class="font-size-md font-weight-semibold text-dark mb-4">Global Headquaters</div>
<p class="mb-0">
Nishindara Se-Re Bangla<br>
Nagor , Bogura<br>
Bangladesh.
</p>
</div>
</div>
<div class="col-md-6 col-lg mb-4 mb-lg-0">
<div class="font-size-md font-weight-semibold text-dark mb-4">
Company
</div>
<ul class="list-group list-group-flush list-group-borderless">
<li class="list-group-item px-0 lh-1625 bg-transparent py-1">
<a href="" class="link-hover-secondary-primary">About Us</a>
</li>
<li class="list-group-item px-0 lh-1625 bg-transparent py-1">
<a href="#" class="link-hover-secondary-primary">Team</a>
</li>
<li class="list-group-item px-0 lh-1625 bg-transparent py-1">
<a href="#" class="link-hover-secondary-primary">Careers</a>
</li>
<li class="list-group-item px-0 lh-1625 bg-transparent py-1">
<a href="#" class="link-hover-secondary-primary">Investors</a>
</li>
<li class="list-group-item px-0 lh-1625 bg-transparent py-1">
<a href="" class="link-hover-secondary-primary">Contact Us</a>
</li>
</ul>
</div>
<div class="col-md-6 col-lg mb-4 mb-lg-0">
<div class="font-size-md font-weight-semibold text-dark mb-4">
Quick Links
</div>
<ul class="list-group list-group-flush list-group-borderless">
<li class="list-group-item px-0 lh-1625 bg-transparent py-1">
<a href="" class="link-hover-secondary-primary">FAQS</a>
</li>
<li class="list-group-item px-0 lh-1625 bg-transparent py-1">
<a href="#" class="link-hover-secondary-primary">Support</a>
</li>
<li class="list-group-item px-0 lh-1625 bg-transparent py-1">
<a href="#" class="link-hover-secondary-primary">Sitemap</a>
</li>
<li class="list-group-item px-0 lh-1625 bg-transparent py-1">
<a href="#" class="link-hover-secondary-primary">Community</a>
</li>
<li class="list-group-item px-0 lh-1625 bg-transparent py-1">
<a href="#" class="link-hover-secondary-primary">Offices</a>
</li>
</ul>
</div>
<div class="col-sm-6 col-lg-4 mb-4 mb-lg-0">
<div class="pl-0 pl-lg-9">
<div class="font-size-md font-weight-semibold text-dark mb-4">Our Newsletter</div>
<div class="mb-4">Subscribe to our newsletter and<br>
we will inform you about newset directory and promotions
</div>
<div class="form-newsletter">
<form>
<div class="input-group bg-white">
<input type="text" class="form-control border-0" placeholder="Email Address... ">
<button type="button" class="input-group-append btn btn-white bg-transparent text-dark border-0">
<i class="fas fa-arrow-right"></i>
</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="footer-last mt-5 mt-md-5">
<div class="container">
<div class="footer-last-container position-relative">
<div class="row align-items-center">
<div class="col-lg-4 mb-3 mb-lg-0">
<div class="social-icon text-dark">
<ul class="list-inline">
<li class="list-inline-item mr-5">
<a target="_blank" title="Twitter" href="#">
<i class="fab fa-twitter">
</i>
<span>Twitter</span>
</a>
</li>
<li class="list-inline-item mr-5">
<a target="_blank" title="Facebook" href="#">
<i class="fab fa-facebook-f">
</i>
<span>Facebook</span>
</a>
</li>
<li class="list-inline-item mr-5">
<a target="_blank" title="Rss" href="#">
<i class="fas fa-rss"></i>
<span>Rss</span>
</a>
</li>
</ul>
</div>
</div>
<div class="col-lg-5 mb-3 mb-lg-0">
<div>
© 2021 Copyright | tradevaly.com | All rights reserved.
</div>
</div>
<div class="back-top text-left text-lg-right gtf-back-to-top">
<a href="#" class="link-hover-secondary-primary"><i class="fal fa-arrow-up"></i><span>Back To Top</span></a>
</div>
</div>
</div>
</div>
</div>
</footer>
</div>
<!-- Modal -->
<div class="modal fade" id="exampleModalCenter" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="py-2 modal-header">
<h6 class="modal-title" id="exampleModalLongTitle">Modal title</h6>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="pt-0 modal-body">
<form>
<div class="form-row">
<div class="mb-0 form-group col-md-6">
<label class="col-form-label col-form-label-sm" for="">Full Name</label>
<div class="input-group mb-1">
<div class="input-group-sm input-group-prepend">
<div class="py-0 input-group-text"><i class="fa fa-address-card" aria-hidden="true"></i></div>
</div>
<input type="text" class="form-control-sm form-control" id="" placeholder="First & Last Name">
</div>
</div><!-- form-group col-md-6 -->
<div class="mb-0 form-group col-md-6">
<label class="col-form-label col-form-label-sm" for="">Company</label>
<div class="input-group mb-1">
<div class="input-group-sm input-group-prepend">
<div class="py-0 input-group-text"><i class="fa fa-building" aria-hidden="true"></i></div>
</div>
<input type="text" class="form-control-sm form-control" id="" placeholder="Company Name">
</div>
</div><!-- form-group col-md-6 -->
</div><!-- form-row -->
<div class="form-row">
<div class="mb-0 form-group col-md-6">
<label class="col-form-label col-form-label-sm" for="">Phone / Mobile</label>
<div class="input-group mb-1">
<div class="input-group-sm input-group-prepend">
<div class="py-0 input-group-text"><i class="icon__flag iti__bd" id=""></i></div>
</div>
<input type="text" class="form-control-sm form-control" id="" placeholder="+880">
</div>
</div><!-- form-group col-md-6 -->
<div class="mb-0 form-group col-md-6">
<label class="col-form-label col-form-label-sm" for="">Email</label>
<div class="input-group mb-1">
<div class="input-group-sm input-group-prepend">
<div class="py-0 input-group-text"><i class="far fa-envelope-open" aria-hidden="true"></i></div>
</div>
<input type="text" class="form-control-sm form-control" id="" placeholder="name@company.com">
</div>
</div><!-- form-group col-md-6 -->
</div><!-- form-row -->
<div class="form-row">
<div class="mb-0 form-group col-md-6">
<label class="col-form-label col-form-label-sm" for="">Interested in Premium Membership?</label>
<div class="input-group mb-1">
<div class="input-group-sm input-group-prepend">
<div class="py-0 input-group-text"><i class="fas fa-store" aria-hidden="true"></i></div>
</div>
<select class="custom-select form-control-sm form-control valid" name="">
<option selected="selected" value="">Choose a package</option>
<option value="6">Elite</option>
<option value="2">Gold</option>
<option value="3">Platinum</option>
<option value="4">Platinum +</option>
<option value="5">Exclusive</option>
</select>
</div>
</div><!-- form-group col-md-6 -->
<div class="mb-0 form-group col-md-6">
<label class="col-form-label col-form-label-sm" for="">Are you a Decision Maker?</label>
<div class="input-group mb-1">
<div class="input-group-sm input-group-prepend">
<div class="py-0 input-group-text"><i class="fas fa-check" aria-hidden="true"></i></div>
</div>
<select class="custom-select form-control-sm form-control valid" name="">
<option selected="selected" value="">Pick a status</option>
<option value="1">Yes</option>
<option value="0">No</option>
</select>
</div>
</div><!-- form-group col-md-6 -->
</div><!-- form-row -->
<div class="form-row">
<div class="mb-0 form-group col-md-12">
<label class="col-form-label col-form-label-sm" for="">Comments</label>
<div class="input-group mb-1">
<div class="input-group-sm input-group-prepend">
<div class="py-0 input-group-text"><i class="far fa-comments" aria-hidden="true"></i></div>
</div>
<textarea name="comments" placeholder="Your Message or Query" class="form-control-sm form-control valid" title="Please enter your comments here" rows="3" required="" aria-required="true"></textarea>
</div>
</div>
</div><!-- form-row -->
</form>
</div>
<div class="modal-footer justify-content-md-center">
<button type="submit" class="btn btn-sm px-7 text-white btn-animated">GET VERIFIED BUYERS</button>
</div>
</div>
</div>
</div>
<div class="modal fade" id="exampleModalCenter2" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="py-2 modal-header">
<h6 class="modal-title" id="exampleModalLongTitle">Modal title</h6>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="pt-0 modal-body">
<form>
<div class="form-row">
<div class="mb-0 form-group col-md-12">
<label class="mt-2" for="">Select 2</label>
<select class="form-control select2 custom-select2">
<optgroup label="Alaskan/Hawaiian Time Zone">
<option value="AK">Alaska</option>
<option value="HI">Hawaii</option>
</optgroup>
<optgroup label="Pacific Time Zone">
<option value="CA">California</option>
<option value="NV">Nevada</option>
<option value="OR">Oregon</option>
<option value="WA">Washington</option>
</optgroup>
<optgroup label="Mountain Time Zone">
<option value="AZ">Arizona</option>
<option value="CO">Colorado</option>
<option value="ID">Idaho</option>
<option value="MT">Montana</option>
<option value="NE">Nebraska</option>
<option value="NM">New Mexico</option>
<option value="ND">North Dakota</option>
<option value="UT">Utah</option>
<option value="WY">Wyoming</option>
</optgroup>
</select>
</div>
<div class="mb-0 form-group col-md-12">
<label class="mt-2" for="">Multiple Select 2</label>
<select name="" id="" class="custom-select select2" multiple="multiple">
<optgroup label="Alaskan/Hawaiian Time Zone">
<option value="AK" selected>Alaska</option>
<option value="HI">Hawaii</option>
</optgroup>
<optgroup label="Pacific Time Zone">
<option value="CA">California</option>
<option value="NV">Nevada</option>
<option value="OR">Oregon</option>
<option value="WA">Washington</option>
</optgroup>
<optgroup label="Mountain Time Zone">
<option value="AZ">Arizona</option>
<option value="CO">Colorado</option>
<option value="ID">Idaho</option>
<option value="MT">Montana</option>
<option value="NE">Nebraska</option>
<option value="NM">New Mexico</option>
<option value="ND">North Dakota</option>
<option value="UT">Utah</option>
<option value="WY">Wyoming</option>
</optgroup>
</select>
</div>
</div><!-- Select 2 -->
</form>
</div>
<div class="modal-footer justify-content-md-center">
<button type="submit" class="btn btn-sm px-7 text-white btn-animated">GET VERIFIED BUYERS</button>
</div>
</div>
</div>
</div>
<div id="login-popup" class="mfp-hide">
<div class="form-login-register">
<div class="tabs mb-5">
<ul class="nav nav-pills tab-style-01 text-capitalize justify-content-center" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="login-tab" data-toggle="tab" href="#login" role="tab" aria-controls="login" aria-selected="true">
<h3>Log In</h3>
</a>
</li>
<li class="nav-item">
<a class="nav-link" id="register-tab" data-toggle="tab" href="#register" role="tab" aria-controls="register" aria-selected="false">
<h3>Register</h3>
</a>
</li>
</ul>
</div>
<div class="tab-content">
<div class="tab-pane fade show active" id="login" role="tabpanel" aria-labelledby="login-tab">
<div class="form-login">
<form>
<div class="font-size-md text-dark mb-5">Log In Your Account</div>
<div class="form-group mb-2">
<label for="username" class="sr-only">Username</label>
<input id="username" type="text" class="form-control" placeholder="Username">
</div>
<div class="form-group mb-3">
<div class="input-group flex-nowrap align-items-center">
<label for="password" class="sr-only">Password</label>
<input id="password" type="text" class="form-control" placeholder="Password">
<a href="#" class="input-group-append text-decoration-none">Forgot?</a>
</div>
</div>
<div class="form-group mb-6">
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="check">
<label class="custom-control-label text-dark" for="check">Remember</label>
</div>
</div>
<button type="submit" class="btn btn-primary btn-block font-weight-bold text-uppercase font-size-lg rounded-sm mb-5">
Log In
</button>
</form>
</div>
</div>
<div class="tab-pane fade " id="register" role="tabpanel" aria-labelledby="register-tab">
<div class="form-register">
<form>
<div class="font-size-md text-dark mb-5">Create Your Account</div>
<div class="form-group mb-2">
<label for="username-rt" class="sr-only">Username</label>
<input id="username-rt" type="text" class="form-control" placeholder="Username">
</div>
<div class="form-group mb-2">
<label for="email" class="sr-only">Email</label>
<input id="email" type="text" class="form-control" placeholder="Email Address">
</div>
<div class="form-group mb-2">
<label for="password-rt" class="sr-only">Username</label>
<input id="password-rt" type="password" class="form-control" placeholder="Password">
</div>
<div class="form-group mb-3">
<label for="r-password" class="sr-only">Username</label>
<input id="r-password" type="password" class="form-control" placeholder="Retype password">
</div>
<div class="form-group mb-5">
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="check-term">
<label class="custom-control-label text-dark" for="check-term">You agree with our
Terms Privacy Policy and</label>
</div>
</div>
<button type="submit" class="btn btn-primary btn-block font-weight-bold text-uppercase font-size-lg rounded-sm">
Create an account
</button>
</form>
</div>
</div>
</div>
</div>
</div>
<div id="search-popup" class="mfp-hide">
<div class="search-popup text-center">
<h2 class="mb-8">Search</h2>
<div class="form-search">
<form>
<div class="row align-items-end">
<div class="form-search-item col-md-5 mb-4 mb-md-0 text-left bg-white">
<label for="key-word-02" class="pt-4 mb-0 text-dark font-weight-semibold font-size-lg lh-1">What</label>
<div class="input-group dropdown show pr-0 bg-transparent align-items-start">
<input type="text" autocomplete="off" id="key-word-02" class="form-control bg-transparent border-0 p-0 font-size-md lh-1" data-toggle="dropdown" aria-haspopup="true" placeholder="Ex: Service">
<ul class="dropdown-menu form-search-ajax" aria-labelledby="key-word-02">
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/1.png" width="25" alt="Icon">
<span class="font-size-md">Mechanical Engineering</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/2.png" width="25" alt="Icon">
<span class="font-size-md">Electrical & Electronics</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/3.png" width="25" alt="Icon">
<span class="font-size-md">Industrial Machinery</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/4.png" width="25" alt="Icon">
<span class="font-size-md">Industrial Chemicals</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/5.png" width="25" alt="Icon">
<span class="font-size-md">Tools & Hardware</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/6.png" width="25" alt="Icon">
<span class="font-size-md">Plastic & Rubber</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/7.png" width="25" alt="Icon">
<span class="font-size-md">Services To Industries</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/8.png" width="25" alt="Icon">
<span class="font-size-md">Printing & Packaging</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/9.png" width="25" alt="Icon">
<span class="font-size-md">Security & Fire Protection</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/10.png" width="25" alt="Icon">
<span class="font-size-md">Food & Beverage</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/11.png" width="25" alt="Icon">
<span class="font-size-md">Automobile & Accessories</span>
</a>
</li>
<li class="dropdown-item item">
<a href="#" class="link-hover-dark-white">
<img src="images/12.png" width="25" alt="Icon">
<span class="font-size-md">Construction & Decoration</span>
</a>
</li>
</ul>
</div>
</div>
<div class="form-search-item col-md-7 mb-4 mb-md-0 text-left bg-white">
<label for="region-02" class="pt-4 mb-0 text-dark font-weight-semibold font-size-lg lh-1">Search</label>
<div class="input-group dropdown show pr-0 bg-transparent align-items-start">
<input type="text" autocomplete="off" id="region" name="region" class="form-control form-control-mini border-0 px-0 bg-transparent" placeholder="Products/Companies" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" >
</div>
</div>
<a href="#" class="mt-5 py-2 btn btn-primary btn-md btn-icon-left btn-block "><i class="fal fa-search"></i> Search </a>
</div>
</form>
</div>
<a href="#" class="d-inline-block button-close mt-5 pt-1 text-dark font-size-lg font-weight-semibold text-decoration-none">
<span class="d-block"><i class="fal fa-times"></i></span>
<span class="d-block">Close</span>
</a>
</div>
</div>
<script src="vendors/jquery.min.js"></script>
<script src="vendors/popper/popper.js"></script>
<script src="vendors/bootstrap/js/bootstrap.js"></script>
<script src="vendors/hc-sticky/hc-sticky.js"></script>
<script src="vendors/isotope/isotope.pkgd.js"></script>
<script src="vendors/magnific-popup/jquery.magnific-popup.js"></script>
<script src="vendors/slick/slick.js"></script>
<script src="vendors/waypoints/jquery.waypoints.js"></script>
<script src="vendors/peash.js"></script>
<!-- ======================Select2 Start============================= -->
<script src="vendors/select2/select2.min.js"></script>
<script>
function matchStart(params, data) {
// If there are no search terms, return all of the data
if ($.trim(params.term) === '') {
return data;
}
// Skip if there is no 'children' property
if (typeof data.children === 'undefined') {
return null;
}
// `data.children` contains the actual options that we are matching against
var filteredChildren = [];
$.each(data.children, function (idx, child) {
if (child.text.toUpperCase().indexOf(params.term.toUpperCase()) == 0) {
filteredChildren.push(child);
}
});
// If we matched any of the timezone group's children, then set the matched children on the group
// and return the group object
if (filteredChildren.length) {
var modifiedData = $.extend({}, data, true);
modifiedData.children = filteredChildren;
// You can return modified objects from here
// This includes matching the `children` how you want in nested data sets
return modifiedData;
}
// Return `null` if the term should not be displayed
return null;
}
$(".select2").select2({
matcher: matchStart
});
</script>
<!-- ======================Select2 End============================= -->
</body>
</html>