TanchoToplineCargo/public/sunsari/elements/tabs.html

700 lines
46 KiB
HTML
Raw Permalink Normal View History

2024-05-05 04:47:49 +00:00
<!DOCTYPE html>
<html lang="en-US" class="no-js">
<!-- Mirrored from quickdevs.com/demo/merit/elements/tabs.html by HTTrack Website Copier/3.x [XR&CO'2014], Wed, 29 Mar 2023 10:24:33 GMT -->
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- TITLE -->
<title>Tabs - Merit Premium Multi-Purpose HTML5 Template</title>
<!-- META TAGS -->
<meta name="keywords"
content="premium multi-Purpose, html template, multipurpose template, bootstrap template, niches, clean, modern, multipurpose, responsive">
<meta name="description" content="Merit is a modern Multi-Purpose HTML Template any bussines.">
<!-- FAVICON -->
<link rel="shortcut icon" href="../images/icons/favicon.png">
<!-- MAIN CSS STYLE SHEET -->
<link rel="stylesheet" href="../css/main.css">
<link rel="stylesheet" href="../css/stylesheet.css">
<link rel="stylesheet" href="../css/responsive.css">
<link rel="stylesheet" href="../css/partials/tabs.css">
<!-- MODERNIZR LIBRARY -->
<script src="../js/modernizr-custom.js"></script>
</head>
<body>
<!-- PRELOADER START -->
<div id="loader-wrapper">
<div class="loader">
<span class="loader-26"></span>
</div>
</div>
<!-- PRELOADER END -->
<!-- HEADER START -->
<header>
<!-- TOP HEADER START -->
<div class="top-header">
<div class="container">
<div class="row">
<div class="col-md-6">
<ul class="top-contact text-left">
<li class="phone"><span class="tel-no"><a href="tel:123-456-7890"> +123-456-7890</a></span>
</li>
<li class="email"><a href="mailto:info@merit.com">info@merit.com</a></li>
</ul>
</div>
<div class="col-md-6 text-right">
<div class="top-social">
<ul class="social-list">
<li><a href="#"><i class="fab fa-facebook-f"></i></a></li>
<li><a href="#"><i class="fab fa-instagram"></i></a></li>
<li><a href="#"><i class="fab fa-twitter"></i></a></li>
<li><a href="#"><i class="fab fa-dribbble"></i></a></li>
<li>
<!-- Button trigger modal -->
<div class="center-element">
<button type="button" class="btn btn-default" data-toggle="modal" data-target="#exampleModal2">Login</button>
</div>
<!-- Modal -->
<div class="modal fade custom-modal" id="exampleModal2" tabindex="-1" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content login-modal">
<button type="button" class="btn-close" data-dismiss="modal" aria-label="Close"></button>
<div class="modal-body">
<figure class="login-avatar">
<img src="../images/icons/user-login-2.png" alt="">
</figure>
<h4>Merit</h4>
<p>Welcome Back!</p>
<div class="google-btn">
<button type="submit" class="tp-btn-primary">
<img class="tp-goole-icon" src="../images/icons/google-icon.png" alt="">
Sign in with Google
</button>
</div>
<p>Or</p>
<div class="row">
<div class="col-md-12">
<form>
<div class="form-group">
<input type="email" class="form-control login-fc" placeholder="Email or Username">
</div>
<div class="form-group mt-3">
<input type="password" class="form-control login-fc" placeholder="Password">
</div>
<div class="login-options d-flex justify-content-between mt-3">
<div class="have-account">
<p><a href="#">Dont have an account?</a></p>
</div>
<div class="forgot-password">
<p><a href="#">Forgot password?</a></p>
</div>
</div>
<div class="login-btn">
<button type="submit" class="tp-btn-primary">Login</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
<hr class="top-line">
</div>
</div>
<!-- TOP HEADER END -->
<!-- MEGAMENU START -->
<div class="main-nav">
<div class="container">
<nav id="navigation1" class="navigation">
<div class="nav-header">
<a class="nav-logo" href="../index.html">
<img src="../images/logos/logo.png" class="white-logo" alt="">
<img src="../images/logos/logo-black.png" class="dark-logo" alt="">
</a>
<div class="nav-toggle"></div>
</div>
<div class="nav-menus-wrapper">
<ul class="nav-menu align-to-right">
<li><a href="#">HOME</a>
<div class="megamenu-panel">
<div class="megamenu-lists">
<ul class="megamenu-list list-col-4">
<li><a href="../1-agency.html">Agency</a></li>
<li><a href="../2-beauty.html">Beauty</a></li>
<li><a href="../3-construction.html">Construction</a></li>
<li><a href="../4-corporate.html">Corporate</a></li>
<li><a href="../5-courier.html">Courier</a></li>
<li><a href="../6-dealer.html">Dealer</a></li>
</ul>
<ul class="megamenu-list list-col-4">
<li><a href="../7-dental.html">Dental</a></li>
<li><a href="../8-education.html">Education</a></li>
<li><a href="../9-gym.html">Gym</a></li>
<li><a href="../10-hotel.html">Hotel</a></li>
<li><a href="../11-medical.html">Medical</a></li>
<li><a href="../12-restaurant.html">Restaurant</a></li>
</ul>
<ul class="megamenu-list list-col-4">
<li><a href="../13-charity.html">Charity</a></li>
<li><a href="../14-cleaning.html">Cleaning</a></li>
<li><a href="../15-finance.html">Finance</a></li>
<li><a href="../16-industrial.html">Industrial</a></li>
<li><a href="../17-hosting.html">Hosting</a></li>
<li><a href="../18-portfolio.html">Portfolio</a></li>
</ul>
<ul class="megamenu-list list-col-4">
<li><a href="../19-organic.html">Organic</a></li>
<li><a href="../20-farm.html">Farm</a></li>
<li><a href="../21-yoga.html">Yoga</a></li>
<li><a href="../22-travel.html">Travel</a></li>
<li><a href="../23-lawyer.html">Lawyer</a></li>
<li><a href="../24-fitness.html">Fitness</a></li>
</ul>
</div>
</div>
</li>
<li><a href="#">PAGES</a>
<div class="megamenu-panel">
<div class="megamenu-lists">
<ul class="megamenu-list list-col-4">
<li><a href="../about-style-1.html">About Us</a></li>
<li><a href="../about-style-2.html">About Me</a></li>
<li><a href="../about-style-3.html">About Us - ALT 2</a></li>
<li><a href="../about-style-4.html">About Us - ALT 3</a></li>
<li><a href="../careers-style-1.html">Careers</a></li>
<li><a href="../careers-style-2.html">Careers - ALT 2</a></li>
<li><a href="../careers-style-3.html">Careers - ALT 3</a></li>
</ul>
<ul class="megamenu-list list-col-4">
<li><a href="../services-style-1.html">Services</a></li>
<li><a href="../services-style-2.html">Services - ALT 2</a></li>
<li><a href="../services-style-3.html">Services - ALT 3</a></li>
<li><a href="../services-style-4.html">Services - ALT 4</a></li>
<li><a href="../profile-style-1.html">Profile</a></li>
<li><a href="../profile-style-2.html">Profile - ALT 2</a></li>
<li><a href="../profile-style-3.html">Profile - ALT 3</a></li>
</ul>
<ul class="megamenu-list list-col-4">
<li><a href="../contact-style-1.html">Contact Us </a></li>
<li><a href="../contact-style-2.html">Contact Us - ALT 2</a></li>
<li><a href="../contact-style-3.html">Contact Us - ALT 3</a></li>
<li><a href="../contact-style-4.html">Contact Us - ALT 4</a></li>
<li><a href="../team-style-1.html">Our Team</a></li>
<li><a href="../team-style-2.html">Our Team - ALT 2</a></li>
<li><a href="../team-style-3.html">Our Team - ALT 3</a></li>
</ul>
<ul class="megamenu-list list-col-4">
<li><a href="../coming-soon-style-1.html">Coming Soon</a></li>
<li><a href="../coming-soon-style-2.html">Coming Soon - ALT 2</a></li>
<li><a href="../404-error-style-1.html">404 Page</a></li>
<li><a href="../404-error-style-2.html">404 Page - ALT 2</a></li>
<li><a href="../login-register-style-1.html">Login / Register</a></li>
<li><a href="../faq.html">Faq</a></li>
<li><a href="../faq-alt.html">Faq - ALT</a></li>
</ul>
</div>
</div>
</li>
<li><a href="#">ELEMENTS</a>
<div class="megamenu-panel">
<div class="megamenu-lists">
<ul class="megamenu-list list-col-4">
<li class="megamenu-list-title"><a href="#">ELEMENTS 1</a></li>
<li><a href="accordions.html"><i class="fas fa-plus-square"></i> &nbsp;
Accordions</a></li>
<li><a href="alerts.html"><i class="fas fa-exclamation-circle"></i> &nbsp;
Alerts</a></li>
<li><a href="animations.html"><i class="fas fa-exchange-alt"></i> &nbsp;
Animations</a></li>
<li><a href="blockquotes.html"><i class="fas fa-quote-left"></i> &nbsp;
Blockquotes</a></li>
<li><a href="breadcrumbs.html"><i class="fas fa-share"></i> &nbsp;
Breadcrumbs</a></li>
<li><a href="buttons.html"><i class="fas fa-square"></i> &nbsp; Buttons</a>
</li>
<li><a href="call-to-action.html"><i class="fas fa-bullhorn"></i> &nbsp;
Call to Action</a></li>
<li><a href="charts.html"><i class="fas fa-circle-notch"></i> &nbsp;
Charts</a></li>
<li><a href="content-boxes.html"><i class="fas fa-th-large"></i> &nbsp;
Content Boxes</a></li>
<li><a href="counters.html"><i class="fas fa-bullseye"></i> &nbsp;
Counters</a></li>
</ul>
<ul class="megamenu-list list-col-4">
<li class="megamenu-list-title"><a href="#">ELEMENTS 2</a></li>
<li><a href="customers.html"><i class="fas fa-user-circle"></i> &nbsp;
Customer</a></li>
<li><a href="dropcaps.html"><i class="fas fa-font"></i> &nbsp; Dropcaps</a>
</li>
<li><a href="flip-boxes.html"><i class="fas fa-sync-alt"></i> &nbsp; Flip
Box</a></li>
<li><a href="google-maps.html"><i class="fas fa-map"></i> &nbsp; Google
Maps</a></li>
<li><a href="grid-boxes.html"><i class="fas fa-th"></i> &nbsp; Grid
Boxes</a></li>
<li><a href="icon-boxes.html"><i class="fas fa-th-large"></i> &nbsp; Icon
Boxes</a></li>
<li><a href="icon-circle.html"><i class="far fa-circle"></i> &nbsp; Icon
Circle</a></li>
<li><a href="image-gallery.html"><i class="fas fa-expand"></i> &nbsp; Image
Gallery</a></li>
<li><a href="images.html"><i class="far fa-image"></i> &nbsp; Images</a>
</li>
<li><a href="image-hover.html"><i class="fas fa-object-ungroup"
aria-hidden="true"></i> &nbsp; Image Hover</a></li>
</ul>
<ul class="megamenu-list list-col-4">
<li class="megamenu-list-title"><a href="#">ELEMENTS 3</a></li>
<li><a href="lightbox.html"><i class="fas fa-lightbulb"></i> &nbsp;
LightBox</a></li>
<li><a href="modal-popup.html"><i class="fas fa-search-plus"></i> &nbsp;
Modal Popup</a></li>
<li><a href="pagination.html"><i class="fas fa-angle-double-right"></i>
&nbsp; Pagination</a></li>
<li><a href="parallax.html"><i class="fas fa-random"></i> &nbsp;
Parallax</a></li>
<li><a href="pricing-table.html"><i class="fas fa-table"></i> &nbsp; Pricing
Tables</a></li>
<li><a href="process-steps.html"><i class="fas fa-arrow-right"></i> &nbsp;
Process Steps</a></li>
<li><a href="profile-cards.html"><i class="fas fa-address-card"></i> &nbsp;
Profile Cards</a></li>
<li><a href="progress-bar.html"><i class="fas fa-tasks"></i> &nbsp; Progress
Bar</a></li>
<li><a href="recent-posts.html"><i class="fas fa-newspaper"></i> &nbsp;
Recent Posts</a></li>
<li><a href="section-styles.html"><i class="fas fa-outdent"></i> &nbsp;
Section Styles</a></li>
</ul>
<ul class="megamenu-list list-col-4">
<li class="megamenu-list-title"><a href="#">ELEMENTS 4</a></li>
<li><a href="separators.html"><i class="fas fa-minus"></i> &nbsp;
Separators</a></li>
<li><a href="shop-banners.html"><i class="fas fa-language"></i> &nbsp; Shop
Banners</a></li>
<li><a href="social-icons.html"><i class="fab fa-twitter"></i> &nbsp; Social
Icons</a></li>
<li><a href="tables.html"><i class="fas fa-table"></i> &nbsp; Tables</a>
</li>
<li><a href="tabs.html"><i class="fas fa-window-maximize"></i> &nbsp;
Tabs</a></li>
<li><a href="team.html"><i class="fas fa-users"></i> &nbsp; Team</a></li>
<li><a href="testimonials.html"><i class="fas fa-edit"></i> &nbsp;
Testimonials</a></li>
<li><a href="timeline.html"><i class="fas fa-arrow-down"></i> &nbsp;
Timeline</a></li>
<li><a href="videos.html"><i class="fas fa-video"></i> &nbsp; Videos &
Audio</a></li>
<li><a href="video-background.html"><i class="fas fa-photo-video"></i>
&nbsp; Video Background</a></li>
</ul>
</div>
</div>
</li>
<li><a href="#">SLIDERS</a>
<div class="megamenu-panel">
<div class="megamenu-lists">
<ul class="megamenu-list list-col-4">
<li class="megamenu-list-title"><a href="#">SLIDERS 1</a></li>
<li><a href="../rev-sliders/3d-parallax-scenes.html">3D Parallax Scenes</a>
</li>
<li><a href="../rev-sliders/404-error.html">404 Error</a></li>
<li><a href="../rev-sliders/agency-slider.html">Agency Slider</a></li>
<li><a href="../rev-sliders/blend-mode.html">Blend Mode</a></li>
<li><a href="../rev-sliders/blur-effect.html">Blur Effect</a></li>
<li><a href="../rev-sliders/car-dealer.html">Car Dealer</a></li>
<li><a href="../rev-sliders/carousel-gallery.html">Carousel Gallery</a></li>
<li><a href="../rev-sliders/classic-carousel.html">Classic Carousel</a></li>
<li><a href="../rev-sliders/coming-soon.html">Coming soon</a></li>
<li><a href="../rev-sliders/concept-slider.html">Concept Slider</a></li>
</ul>
<ul class="megamenu-list list-col-4">
<li class="megamenu-list-title"><a href="#">SLIDERS 2</a></li>
<li><a href="../rev-sliders/double-exposure-effect.html">Double Exposure
Effect</a></li>
<li><a href="../rev-sliders/exploration-header.html">Exploration Header</a>
</li>
<li><a href="../rev-sliders/film-strip.html">Film Strip Effect</a></li>
<li><a href="../rev-sliders/fine-dining.html">Fine Dining</a></li>
<li><a href="../rev-sliders/gravity-design.html">Gravity Design</a></li>
<li><a href="../rev-sliders/happy-hollidays.html">Happy Hollidays</a></li>
<li><a href="../rev-sliders/hero-sports.html">Hero Sports</a></li>
<li><a href="../rev-sliders/inspiration-header.html">Inspiration Header</a>
</li>
<li><a href="../rev-sliders/levano-slider.html">Levano Slider</a></li>
<li><a href="../rev-sliders/magazine-posts.html">Magazine Posts</a></li>
</ul>
<ul class="megamenu-list list-col-4">
<li class="megamenu-list-title"><a href="#">SLIDERS 3</a></li>
<li><a href="../rev-sliders/mask-showcase.html">Mask Showcase</a></li>
<li><a href="../rev-sliders/mountain-parallax.html">Mountain Parallax</a>
</li>
<li><a href="../rev-sliders/over-expousure.html">Over Exposure</a></li>
<li><a href="../rev-sliders/panorama.html">Panorama</a></li>
<li><a href="../rev-sliders/parallax-joy.html">Parallax Joy</a></li>
<li><a href="../rev-sliders/parallax-zoom.html">Parallax Zoom</a></li>
<li><a href="../rev-sliders/particle-effect-one.html">Particle Effect
one</a></li>
<li><a href="../rev-sliders/particle-effect-two.html">Particle Effect
Two</a></li>
<li><a href="../rev-sliders/particle-effect-three.html">Particle Effect
Three</a></li>
<li><a href="../rev-sliders/style-intro.html">Style Intro</a></li>
</ul>
<ul class="megamenu-list list-col-4">
<li class="megamenu-list-title"><a href="#">SLIDERS 4</a></li>
<li><a href="../rev-sliders/reveal.html">Reveal</a></li>
<li><a href="../rev-sliders/rock-band.html">Rock Band</a></li>
<li><a href="../rev-sliders/scroll-effects.html">Scroll Effect</a></li>
<li><a href="../rev-sliders/slider-gym.html">Slider Gym</a></li>
<li><a href="../rev-sliders/slider-news.html">Slider News</a></li>
<li><a href="../rev-sliders/sliding-overlays.html">Sliding Overlays</a></li>
<li><a href="../rev-sliders/web-agency.html">Web Agency</a></li>
<li><a href="../rev-sliders/web-product.html">Web Product</a></li>
<li><a href="../rev-sliders/website-intro.html">Website Intro</a></li>
<li><a href="../rev-sliders/youtube-hero.html">Youtube Hero</a></li>
</ul>
</div>
</div>
</li>
<li><a href="#">SHOP</a>
<ul class="nav-dropdown">
<li><a href="#">CLASSIC</a>
<ul class="nav-dropdown">
<li><a href="../shop-full-width.html">Full width</a></li>
<li><a href="../shop-left-sidebar.html">Left sidebar</a></li>
<li><a href="../shop-right-sidebar.html">Right sidebar</a></li>
</ul>
</li>
<li><a href="#">PRODUCT DETAILS</a>
<ul class="nav-dropdown">
<li><a href="../product-full-width.html">Full width</a></li>
<li><a href="../product-left-sidebar.html">Left sidebar</a></li>
<li><a href="../product-right-sidebar.html">Right sidebar</a></li>
</ul>
</li>
<li><a href="../shopping-cart.html">SHOPING CART</a></li>
<li><a href="../checkout.html">CHECKOUT</a></li>
</ul>
</li>
<li><a href="#">BLOG</a>
<ul class="nav-dropdown">
<li><a href="#">CLASSIC</a>
<ul class="nav-dropdown">
<li><a href="../blog-full-width.html">Full width</a></li>
<li><a href="../blog-left-sidebar.html">Left sidebar</a></li>
<li><a href="../blog-right-sidebar.html">Right sidebar</a></li>
</ul>
</li>
<li><a href="#">GRID</a>
<ul class="nav-dropdown">
<li><a href="../blog-grid-one-column.html">One column</a></li>
<li><a href="../blog-grid-two-column.html">Two column</a></li>
<li><a href="../blog-grid-three-column.html">Three column</a></li>
</ul>
</li>
<li><a href="#">MASONRY</a>
<ul class="nav-dropdown">
<li><a href="../masonry-two-columns.html">Two Columns</a></li>
<li><a href="../masonry-three-columns.html">Three Columns</a></li>
<li><a href="../masonry-four-columns.html">Four Columns</a></li>
</ul>
</li>
<li><a href="#">BLOG SINGLE</a>
<ul class="nav-dropdown">
<li><a href="../blog-single-full-width.html">Blog Single Full Width</a></li>
<li><a href="../blog-single-left-sidebar.html">Blog Single Left Sidebar</a>
</li>
<li><a href="../blog-single-right-sidebar.html">Blog Single Right
Sidebar</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
</nav>
</div>
</div>
<!-- MEGAMENU END -->
<!-- PAGE HERO START -->
<div class="pages-hero">
<div class="pages-hero-diagonal"></div>
<div class="container">
<div class="pages-title-center">
<h1>Tabs</h1>
<p>Build modern websites with this powefull Multi-Purpose Template.</p>
</div>
<div class="left-page-nav">
<!-- Breadcrumbs -->
<ul class="breadcrumb">
<li><a href="#">Home</a></li>
<li>Elements</li>
<li class="current">Tabs</li>
</ul>
<!--/ Breadcrumbs -->
</div>
</div>
</div>
<!-- PAGE HERO END -->
</header>
<!-- HEADER END -->
<!-- CONTENT START -->
<section>
<!-- PRODUCT DETAILS TABS START -->
<div class="container default-tabs mt-5">
<ul class="nav nav-tabs" id="myTab" role="tablist">
<li class="nav-item" role="presentation">
<a class="nav-link active" id="home-tab" data-bs-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true">Home</a>
</li>
<li class="nav-item" role="presentation">
<a class="nav-link" id="profile-tab" data-bs-toggle="tab" href="#profile" role="tab" aria-controls="profile" aria-selected="false">Profile</a>
</li>
<li class="nav-item" role="presentation">
<a class="nav-link" id="contact-tab" data-bs-toggle="tab" href="#contact" role="tab" aria-controls="contact" aria-selected="false">Contact</a>
</li>
</ul>
<div class="tab-content" id="myTabContent">
<div class="tab-pane fade show active custom-tab-pane" id="home" role="tabpanel" aria-labelledby="home-tab">
<h4>Home</h4>
<p>There are many variations of passages of Lorem Ipsum available, but the majority
have
suffered alteration
in some form, by injected humour, or randomised words which don't look even
slightly
believable.</p>
<p>It is a long established fact that a reader will be distracted by the readable
content of a
page when looking at its layout.
The point of using Lorem Ipsum is that it has a more-or-less normal distribution
of letters,
as opposed to using 'Content here, content here'</p>
</div>
<div class="tab-pane fade custom-tab-pane" id="profile" role="tabpanel" aria-labelledby="profile-tab">
<h4>Profile</h4>
<p>There are many variations of passages of Lorem Ipsum available, but the majority
have
suffered alteration
in some form, by injected humour, or randomised words which don't look even
slightly
believable.</p>
<p>It is a long established fact that a reader will be distracted by the readable
content of a
page when looking at its layout.
The point of using Lorem Ipsum is that it has a more-or-less normal distribution
of letters,
as opposed to using 'Content here, content here'</p>
</div>
<div class="tab-pane fade custom-tab-pane" id="contact" role="tabpanel" aria-labelledby="contact-tab">
<h4>Contact</h4>
<p>There are many variations of passages of Lorem Ipsum available, but the majority
have
suffered alteration
in some form, by injected humour, or randomised words which don't look even
slightly
believable.</p>
<p>It is a long established fact that a reader will be distracted by the readable
content of a
page when looking at its layout.
The point of using Lorem Ipsum is that it has a more-or-less normal distribution
of letters,
as opposed to using 'Content here, content here'</p>
</div>
</div>
</div>
<!-- PRODUCT DETAILS TABS END -->
<div class="container mt-5 mb-5">
<div class="tab-wrap default-tabs">
<!-- active tab on page load gets checked attribute -->
<input type="radio" id="tab1" name="tabGroup1" class="tab" checked>
<label for="tab1">Home</label>
<input type="radio" id="tab2" name="tabGroup1" class="tab">
<label for="tab2">Profile</label>
<input type="radio" id="tab3" name="tabGroup1" class="tab">
<label for="tab3">Contact</label>
<div class="tab__content">
<h3>Home</h3>
<p>Praesent nonummy mi in odio. Nullam accumsan lorem in dui. Vestibulum turpis sem, aliquet eget,
lobortis pellentesque, rutrum eu, nisl. Nullam accumsan lorem in dui. Donec pede justo,
fringilla vel, aliquet nec, vulputate eget, arcu.</p>
</div>
<div class="tab__content">
<h3>Profile</h3>
<p>Praesent nonummy mi in odio. Nullam accumsan lorem in dui. Vestibulum turpis sem, aliquet eget,
lobortis pellentesque, rutrum eu, nisl. Nullam accumsan lorem in dui. Donec pede justo,
fringilla vel, aliquet nec, vulputate eget, arcu.</p>
<p>In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Morbi mattis ullamcorper velit.
Pellentesque posuere. Etiam ut purus mattis mauris sodales aliquam. Praesent nec nisl a purus
blandit viverra.</p>
</div>
<div class="tab__content">
<h3>Contact</h3>
<p>Praesent nonummy mi in odio. Nullam accumsan lorem in dui. Vestibulum turpis sem, aliquet eget,
lobortis pellentesque, rutrum eu, nisl. Nullam accumsan lorem in dui. Donec pede justo,
fringilla vel, aliquet nec, vulputate eget, arcu.</p>
<p>In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Morbi mattis ullamcorper velit.
Pellentesque posuere. Etiam ut purus mattis mauris sodales aliquam. Praesent nec nisl a purus
blandit viverra.</p>
<p>Praesent nonummy mi in odio. Nullam accumsan lorem in dui. Vestibulum turpis sem, aliquet eget,
lobortis pellentesque, rutrum eu, nisl. Nullam accumsan lorem in dui. Donec pede justo,
fringilla vel, aliquet nec, vulputate eget, arcu.</p>
<p>In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Morbi mattis ullamcorper velit.
Pellentesque posuere. Etiam ut purus mattis mauris sodales aliquam. Praesent nec nisl a purus
blandit viverra.</p>
</div>
</div>
</div>
</section>
<!-- CONTENT END -->
<!-- FOOTER START -->
<footer>
<div class="container mt-5">
<div class="top-footer">
<div class="row">
<div class="col-lg-12 col-xl-7">
<h3>Creative and affordable website solution</h3>
<p>Build modern websites with this powefull Multi-Purpose Template.</p>
</div>
<div class="col-lg-12 col-xl-5">
<div class="footer-btn">
<a class="tp-btn-primary" href="https://themeforest.net/item/merit-premium-multipurpose-html5-template/21866679" target="_blank" role="button">Purchase now</a>
</div>
</div>
</div>
</div>
<hr class="footer-line">
<div class="center-footer">
<div class="row">
<div class="col-lg-5">
<div class="footer-col footer-left-col">
<figure class="site-footer-logo">
<img src="../images/logos/logo.png" alt="">
</figure>
<p>Let's develop your project with this impressive and powerful template that helps you
create beautiful web pages. An original solution for any business.</p>
<ul class="footer-social">
<li><a href="#"><i class="fab fa-facebook-f"></i></a></li>
<li><a href="#"><i class="fab fa-instagram"></i></a></li>
<li><a href="#"><i class="fab fa-twitter"></i></a></li>
<li><a href="#"><i class="fab fa-dribbble"></i></a></li>
</ul>
</div>
</div>
<div class="col-lg-2">
<div class="footer-col">
<h5>Quick Links</h5>
<ul class="quick-links">
<li><a href="../index.html">Home</a></li>
<li><a href="../services-style-1.html">Services</a></li>
<li><a href="../blog-full-width.html">Blogs</a></li>
<li><a href="../contact-style-1.html">Contact</a></li>
</ul>
</div>
</div>
<div class="col-lg-2">
<div class="footer-col">
<h5>About</h5>
<ul class="quick-links">
<li><a href="../profile-style-1.html">Profile</a></li>
<li><a href="../team-style-1.html">Team</a></li>
<li><a href="../careers-style-1.html">Careers</a></li>
<li><a href="../faq.html">FAQ</a></li>
</ul>
</div>
</div>
<div class="col-lg-3">
<div class="footer-col">
<h5>Get in Touch</h5>
<ul class="footer-contact">
<li class="phone"><a href="tel:123-456-7890">+ 123-456-7890</a></li>
<li class="email"><a href="mailto:info@merit.com">info@merit.com</a></li>
<li>
<div class="d-flex">
<div class="flex-shrink-0">
<i class="fas fa-map-pin"></i>
</div>
<div class="flex-grow-1 ms-3">
<p>7391 North Bay Meadows Circle New York, NY 10040.</p>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
<hr class="footer-line">
<div class="bottom-footer">
<div class="row">
<div class="col-lg-6">
<div class="footer-copyright">
<p>© 2022 <a
href="https://themeforest.net/item/merit-premium-multipurpose-html5-template/21866679"
target="_blank">Merit Premium Template</a> all rights reserved.</p>
</div>
</div>
<div class="col-lg-6">
<ul class="footer-terms">
<li><a href="../terms.html">Terms</a></li>
<li><a href="../privacy.html">Privacy</a></li>
<li><a href="../support.html">Support</a></li>
</ul>
</div>
</div>
</div>
</div>
</footer>
<!-- FOOTER END -->
<!-- SCROLL TOP -->
<a href="#0" class="cd-top">Top</a>
<!-- JAVASCRIPTS START -->
<script src="../js/lib/jquery-3.6.0.min.js"></script>
<script src="../js/lib/bootstrap.min.js"></script>
<script src="../js/lib/plugins.js"></script>
<script src="../js/lib/megamenu.js"></script>
<script src="../js/lib/navigation.js"></script>
<script src="../js/lib/navigation.fixed.min.js"></script>
<script src="../js/main.js"></script>
<!-- JAVASCRIPTS END -->
</body>
<!-- Mirrored from quickdevs.com/demo/merit/elements/tabs.html by HTTrack Website Copier/3.x [XR&CO'2014], Wed, 29 Mar 2023 10:24:33 GMT -->
</html>