Current File : //home/tradevaly/demo.tradevaly.com.bd/content/New Design/Final/invoice.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&amp;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"> </head>

<body>
	<div id="site-wrapper" class="site-wrapper">
		<header id="header" class="shadow-sm 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="#"> <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>
					</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="#">Home</a></li>
								<li class="nav-item"><a class="nav-link" href="#">About</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 id="wrapper-content" class="bg-gray-04 panel page-invoice-details wrapper-content pt-0 pb-0">
			<div class="inner-page-banner heading-title-behind text-center">
		      <div class="heading heading-style-title-behind mb-0">
		        <div class="heading-title-wrapper">
		          <span>Detail Invoice</span>
		          <h1 class="text-white heading-title h2 font-weight-semibold">Detail Invoice</h1>
		          <ul class="po-bread breadcrumb justify-content-center fadeInUp animated" data-animate="fadeInUp">
		            <li class="breadcrumb-item"><a href="index.html">Home</a></li>
		            <li class="breadcrumb-item">Invoice</li>
		          </ul>
		        </div>
		      </div>
		    </div>
			<div class="about-intro text-center pt-8 pb-1">
				<div class="container">
					<div class="bg-white shadow-sm mb-7 text-center rounded py-5 px-5 lh-14 text-dark mb-4">
		                <h4 class="border-bottom pb-4 mb-0">Detail Invoice</h4>

		                <div class="page-content text-left col-12 col-lg-12">							
								<div class="mb-6 row flex-md-nowrap">
								<div class="col-md-4 mb-4 mb-md-0">
								<div class="mb-5"><img src="images/other/coderpoint.png" alt="TradeValy"></div>
								<div class="text-dark font-size-md lh-1625">
								<address>
								Stack Creative Studio<br>
								4025 Oak Avenue,<br>
								New York,<br>
								NY 10092,<br>
								United States
								</address>
								</div>
								</div>
								<div class="col-md-4 mb-4 mb-md-0">
								<div class="text-gray font-weight-medium text-uppercase mb-4">
								Bill to
								</div>
								<div class="text-dark font-size-md lh-1625">
								<address>
								Mr. Bret Lezama<br>
								4879 Westfall Avenue,<br>
								Albuquerque,<br>
								New Mexico-87102.<br>
								Mexico
								</address>
								</div>
								</div>
								<div class="col-md-4  ml-0 ml-md-auto text-left text-md-right">
								<div class="text-gray font-weight-medium text-uppercase mb-4">
								information invoice
								</div>
								<div class="text-dark font-size-md lh-1625">
								<div class="">
								<span class="text-dark font-weight-semibold">Order:</span>
								<span class="text-link"> INV-0001</span>
								</div>
								<div class="">
								<span class="text-dark font-weight-semibold">Issued:</span>
								<span> 20/07/2017 </span>
								</div>
								<span class="text-secondary">
								Due 7 days from date of issue
								</span>
								</div>
								</div>
								</div>
								<div class="table-responsive-md">
								<table class="table table-bordered">
								<thead class="thead-light">
								<tr>
								<th style="width:34%">items &amp; description</th>
								<th>quantity</th>
								<th>price</th>
								<th>VAT</th>
								<th class="text-right">total</th>
								</tr>
								</thead>
								<tbody>
								<tr>
								<td>Premium Plan</td>
								<td>1 Years</td>
								<td>$59.00/mo</td>
								<td>10%</td>
								<td>$599.00</td>
								</tr>
								</tbody>
								</table>
								</div>
								<div class="d-flex mt-4">
								<div class="ml-auto text-right">
								<span class="text-dark font-size-lg d-block font-weight-semibold total">Invoice Total: $599.00</span>
								<span class="font-size-md">Paid via Credit Card</span>
								</div>
								</div>
								<div class="contact-info d-flex flex-wrap flex-md-nowrap font-size-md mt-10">
								<a href="mailto:www.example.com" class="link-hover-dark-primary">www.example.com</a>
								<span class="separate text-dark">|</span>
								<a href="mailto:office@example.com" class="link-hover-dark-primary">office@example.com </a>
								<span class="separate text-dark">|</span>
								<span class="text-dark">(123) 123-456</span>
								</div>
						</div>

		            </div>
					
				</div>
			</div>
			<section class="bg-white pagignation-main mt-8 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 class=""><a href="#">A</a></li>
									<li class=""><a href="#">B</a></li>
									<li class=""><a href="#">C</a></li>
									<li class=""><a href="#">D</a></li>
									<li class=""><a href="#">E</a></li>
									<li class=""><a href="#">F</a></li>
									<li class=""><a href="#">G</a></li>
									<li class=""><a href="#">H</a></li>
									<li class=""><a href="#">I</a></li>
									<li class=""><a href="#">J</a></li>
									<li class=""><a href="#">K</a></li>
									<li class=""><a href="#">L</a></li>
									<li class=""><a href="#">M</a></li>
									<li class=""><a href="#">N</a></li>
									<li class=""><a href="#">O</a></li>
									<li class=""><a href="#">P</a></li>
									<li class=""><a href="#">Q</a></li>
									<li class=""><a href="#">R</a></li>
									<li class=""><a href="#">S</a></li>
									<li class=""><a href="#">T</a></li>
									<li class=""><a href="#">W</a></li>
									<li class=""><a href="#">X</a></li>
									<li class=""><a href="#">Y</a></li>
									<li class=""><a href="#">Z</a></li>
								</ul>
									</div>
						</div>
					</div>
				</div>
			</section>
		</div>
		<!-- wrapper-content -->
		<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> &copy; 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>

		<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> -->
</body>

</html>