Scribd
Upload
24 views60 pages

4

Uploaded by

tegar.chann
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
24 views60 pages

4

Uploaded by

tegar.chann
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 60

<!

DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Tegar Nurwidyatmoko || Personal Portfolio</title>
<meta name="robots" content="noindex, follow">
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-
fit=no">
<!-- Favicon -->
<link rel="shortcut icon" type="image/x-icon" href="assets/images/favicon.ico">
<!-- CSS
============================================ -->
<link rel="stylesheet" href="assets/css/vendor/bootstrap.min.css">
<link rel="stylesheet" href="assets/css/vendor/slick.css">
<link rel="stylesheet" href="assets/css/vendor/slick-theme.css">
<link rel="stylesheet" href="assets/css/vendor/aos.css">
<link rel="stylesheet" href="assets/css/plugins/feature.css">
<!-- Style css -->
<link rel="stylesheet" href="assets/css/style.css">
</head>

<body class="template-color-1 spybody" data-spy="scroll" data-target=".navbar-


example2" data-offset="70">

<!-- Start Header -->


<header class="rn-header haeder-default black-logo-version header--fixed
header--sticky">
<div class="header-wrapper rn-popup-mobile-menu m--0 row align-items-
center">
<!-- Start Header Left -->
<div class="col-lg-2 col-6">
<div class="header-left">
<div class="logo">
<a href="index.html">
<img src="assets/images/logo/logo.png" alt="logo">
</a>
</div>
</div>
</div>
<!-- End Header Left -->
<!-- Start Header Center -->
<div class="col-lg-10 col-6">
<div class="header-center">
<nav id="sideNav" class="mainmenu-nav navbar-example2 d-none d-
xl-block">
<!-- Start Mainmanu Nav -->
<ul class="primary-menu nav nav-pills">
<li class="nav-item"><a class="nav-link smoth-animation
active" href="#home">Home</a></li>
<li class="nav-item"><a class="nav-link smoth-
animation" href="#features">Features</a></li>
<li class="nav-item"><a class="nav-link smoth-
animation" href="#portfolio">Portfolio</a></li>
<li class="nav-item"><a class="nav-link smoth-
animation" href="#resume">Resume</a></li>
<li class="nav-item"><a class="nav-link smoth-
animation" href="#pricing">Pricing</a></li>
<li class="nav-item"><a class="nav-link smoth-
animation" href="#contacts">Contact</a></li>
</ul>
<!-- End Mainmanu Nav -->
</nav>
<!-- Start Header Right -->
<div class="header-right">
<!-- <a class="rn-btn" target="_blank"
href="../../checkout/83025947/create_account.html?license=regular"><span>BUY
NOW</span></a> -->
<div class="hamberger-menu d-block d-xl-none">
<i id="menuBtn" class="feather-menu
humberger-menu"></i>
</div>
<div class="close-menu d-block">
<span class="closeTrigger">
<i data-feather="x"></i>
</span>
</div>
</div>
<!-- End Header Right -->

</div>
</div>
<!-- End Header Center -->
</div>
</header>
<!-- End Header Area -->
<!-- Start Popup Mobile Menu -->
<div class="popup-mobile-menu">
<div class="inner">
<div class="menu-top">
<div class="menu-header">
<a class="logo" href="index.html">
<img src="assets/images/logo/logos-circle.png"
alt="Personal Portfolio">
</a>
<div class="close-button">
<button class="close-menu-activation close"><i data-
feather="x"></i></button>
</div>
</div>
<!-- <p class="discription">Inbio is a personal portfolio template.
You can customize all.</p> -->
</div>
<div class="content">
<ul class="primary-menu nav nav-pills">
<li class="nav-item"><a class="nav-link smoth-animation active"
href="#home">Home</a></li>
<li class="nav-item"><a class="nav-link smoth-animation"
href="#features">Features</a></li>
<li class="nav-item"><a class="nav-link smoth-animation"
href="#portfolio">Portfolio</a></li>
<li class="nav-item"><a class="nav-link smoth-animation"
href="#resume">Resume</a></li>
<li class="nav-item"><a class="nav-link smoth-animation"
href="#pricing">Pricing</a></li>
<li class="nav-item"><a class="nav-link smoth-animation"
href="#contacts">Contact</a></li>
</ul>
<!-- social sharea area -->
<div class="social-share-style-1 mt--40">
<span class="title">find with me</span>
<ul class="social-share d-flex liststyle">
<li class="facebook"><a
href="https://www.facebook.com/profile.php?id=100082671474400"><svg
xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-
linejoin="round" class="feather feather-facebook">
<path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-
8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"></path>
</svg></a>
</li>
<li class="instagram"><a
href="https://www.instagram.com/tegarrnce_3705/"><svg
xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-
linejoin="round" class="feather feather-instagram">
<rect x="2" y="2" width="20" height="20" rx="5"
ry="5"></rect>
<path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1
16 11.37z"></path>
<line x1="17.5" y1="6.5" x2="17.51"
y2="6.5"></line>
</svg></a>
</li>
<li class="linkedin"><a
href="https://www.linkedin.com/in/tegarnurwidyatmoko/"><svg
xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-
linejoin="round" class="feather feather-linkedin">
<path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-
2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"></path>
<rect x="2" y="9" width="4" height="12"></rect>
<circle cx="4" cy="4" r="2"></circle>
</svg></a>
</li>
</ul>
</div>
<!-- end -->
</div>
</div>
</div>
<!-- End Popup Mobile Menu -->

<main class="main-page-wrapper">

<!-- Start Slider Area -->


<div id="home" class="rn-slider-area">
<div class="slide slider-style-1">
<div class="container">
<div class="row row--30 align-items-center">
<div class="order-2 order-lg-1 col-lg-7 mt_md--50 mt_sm--50
mt_lg--30">
<div class="content">
<div class="inner">
<span class="subtitle">Welcome to my
world</span>
<h1 class="title">Hi, I’m
<span>Tegar</span><br>
<span class="header-caption" id="page-top">
<!-- type headline start-->
<span class="cd-headline clip is-full-
width">
<span>a </span>
<!-- ROTATING TEXT -->
<span class="cd-words-wrapper">
<b class="is-visible">UI/UX
Designer.</b>
<b class="is-
hidden">Professional Coder.</b>
<b class="is-hidden">Front-End
Developer.</b>
</span>
</span>
<!-- type headline end -->
</span>
</h1>

<div>
<p class="description">I am an experienced
Front-End Developer and UI/UX Designer with Five years plus experience building and
designing websites and web apps from scratch.
Html, CSS, Scss, Javascript, Angular,
Next, Gatsby, Vue, and Laravel are the field of my expertise when it comes to
building websites and web apps. I deal with servers as well.
I am flawless using Figma, Adobe XD,
Illustrator, and Photoshop for the design. Photography is also one of the skills I
use in my design.</p>
</div>
</div>
<div class="row">
<div class="col-lg-6 col-xl-6 col-md-6 col-sm-6
col-12">
<div class="social-share-inner-left">
<span class="title">find with me</span>
<ul class="social-share d-flex
liststyle">
<li class="facebook"><a
href="https://www.facebook.com/profile.php?id=100082671474400"><i data-
feather="facebook"></i></a>
</li>
<li class="instagram"><a
href="https://www.instagram.com/tegarrnce_3705/"><i
data-feather="instagram"></i></a>
</li>
<li class="linkedin"><a
href="https://www.linkedin.com/in/tegarnurwidyatmoko//"><i data-
feather="linkedin"></i></a>
</li>
</ul>
</div>
</div>
<div class="col-lg-6 col-xl-6 col-md-6 col-sm-6
col-12 mt_mobile--30">
<div class="skill-share-inner">
<span class="title">best skill
on</span>
<ul class="skill-share d-flex
liststyle">
<li><img
src="assets/images/icons/icons-01.png" alt="Icons Images"></li>
<li><img
src="assets/images/icons/icons-02.png" alt="Icons Images"></li>
<li><img
src="assets/images/icons/icons-03.png" alt="Icons Images"></li>
</ul>
</div>
</div>
</div>
</div>
</div>

<div class="order-1 order-lg-2 col-lg-5">


<div class="thumbnail">
<div class="inner">
<img src="assets/images/slider/banner-01.png"
alt="Personal Portfolio Images">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- End Slider Area -->

<!-- Start Service Area -->


<div class="rn-service-area rn-section-gap section-separator"
id="features">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="section-title text-left" data-aos="fade-up"
data-aos-duration="500" data-aos-delay="100" data-aos-once="true">
<span class="subtitle">Features</span>
<h2 class="title">What I Do</h2>
</div>
</div>
</div>
<div class="row row--25 mt_md--10 mt_sm--10">

<!-- Start Single Service -->


<div data-aos="fade-up" data-aos-duration="500" data-aos-
delay="100" data-aos-once="true" class="col-lg-6 col-xl-4 col-md-6 col-sm-12 col-12
mt--50 mt_md--30 mt_sm--30">
<div class="rn-service">
<div class="inner">
<div class="icon">
<i data-feather="layout"></i>
</div>
<div class="content">
<h4 class="title"><a href="#">Front-End
Development</a></h4>
<p class="description">I optimizie the user
experience using HTML, JQuery, JavaScript and CSS to bring concepts to life.I
Develop and maintain the user interface by following SEO best practices.
.</p>
<!-- <a class="read-more-button" href="#"><i
class="feather-arrow-right"></i></a> -->
</div>
</div>
<a class="over-link" href="#"></a>
</div>
</div>
<!-- End SIngle Service -->
<!-- Start Single Service -->
<div data-aos="fade-up" data-aos-duration="500" data-aos-
delay="300" data-aos-once="true" class="col-lg-6 col-xl-4 col-md-6 col-sm-12 col-12
mt--50 mt_md--30 mt_sm--30">
<div class="rn-service">
<div class="inner">
<div class="icon">
<i data-feather="grid"></i>
</div>
<div class="content">
<h4 class="title"><a href="#">UI UX
Design</a></h4>
<p class="description"> I'm a UX expert and i
quickly understand and translate business objectives into user-centered designs
that also accomplish business objectives.</p>
<!-- <a class="read-more-button" href="#"><i
class="feather-arrow-right"></i></a> -->
</div>
</div>
<a class="over-link" href="#"></a>
</div>
</div>
<!-- End SIngle Service -->
<!-- Start Single Service -->
<div data-aos="fade-up" data-aos-duration="500" data-aos-
delay="500" data-aos-once="true" class="col-lg-6 col-xl-4 col-md-6 col-sm-12 col-12
mt--50 mt_md--30 mt_sm--30">
<div class="rn-service">
<div class="inner">
<div class="icon">
<i data-feather="aperture"></i>
</div>
<div class="content">
<h4 class="title"><a href="#">Logo & Icon
Design</a></h4>
<p class="description">I am specialized in all
types of logo design and branding and can offer you a variety of design techniques
to match your business. .</p>
<!-- <a class="read-more-button" href="#"><i
class="feather-arrow-right"></i></a> -->
</div>
</div>
<a class="over-link" href="#"></a>
</div>
</div>
<!-- End SIngle Service -->
<!-- Start Single Service -->
<!-- <div data-aos="fade-up" data-aos-duration="500" data-aos-
delay="100" data-aos-once="true" class="col-lg-6 col-xl-4 col-md-6 col-sm-12 col-12
mt--50 mt_md--30 mt_sm--30">
<div class="rn-service">
<div class="inner">
<div class="icon">
<i data-feather="twitch"></i>
</div>
<div class="content">
<h4 class="title"><a href="#">Mobile
App</a></h4>
<p class="description">There are many
variations of passages of Lorem Ipsum
available, but the majority.
</p>
<a class="read-more-button" href="#"><i
class="feather-arrow-right"></i></a>
</div>
</div>
<a class="over-link" href="#"></a>
</div>
</div> -->
<!-- End SIngle Service -->
<!-- Start Single Service -->
<!-- <div data-aos="fade-up" data-aos-duration="500" data-aos-
delay="300" data-aos-once="true" class="col-lg-6 col-xl-4 col-md-6 col-sm-12 col-12
mt--50 mt_md--30 mt_sm--30">
<div class="rn-service">
<div class="inner">
<div class="icon">
<i data-feather="wifi"></i>
</div>
<div class="content">
<h4 class="title"><a href="#">CEO
Marketing</a></h4>
<p class="description">always free from
repetition,
injected humour, or non-characteristic
words etc.</p>
<a class="read-more-button" href="#"><i
class="feather-arrow-right"></i></a>
</div>
</div>
<a class="over-link" href="#"></a>
</div>
</div> -->
<!-- End SIngle Service -->
<!-- Start Single Service -->
<!-- <div data-aos="fade-up" data-aos-duration="500" data-aos-
delay="500" data-aos-once="true" class="col-lg-6 col-xl-4 col-md-6 col-sm-12 col-12
mt--50 mt_md--30 mt_sm--30">
<div class="rn-service">
<div class="inner">
<div class="icon">
<i data-feather="slack"></i>
</div>
<div class="content">
<h4 class="title"><a href="#">Personal
Portfolio July</a></h4>
<p class="description"> It uses a dictionary of
over 200 Latin words, combined with
a handful of model sentence.</p>
<a class="read-more-button" href="#"><i
class="feather-arrow-right"></i></a>
</div>
</div>
<a class="over-link" href="#"></a>
</div>
</div> -->
<!-- End SIngle Service -->

</div>
</div>
</div>
<!-- End Service Area -->

<!-- Start Portfolio Area -->


<div class="rn-portfolio-area rn-section-gap section-separator"
id="portfolio">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="section-title text-center">
<span class="subtitle">Visit my portfolio and keep your
feedback</span>
<h2 class="title">My Portfolio</h2>
</div>
</div>
</div>

<div class="row row--25 mt--10 mt_md--10 mt_sm--10">


<!-- Start Single Portfolio -->
<div data-aos="fade-up" data-aos-delay="100" data-aos-
once="true" class="col-lg-6 col-xl-4 col-md-6 col-12 mt--50 mt_md--30 mt_sm--30">
<div class="rn-portfolio" data-toggle="modal" data-
target="#exampleModalCenterr">
<div class="inner">
<div class="thumbnail" style="overflow: auto;
height: 200px;">
<a href="javascript:void(0)">
<img
src="assets/images/portfolio/portfolio-01.jpg" style="height:156px;" alt="Personal
Portfolio Images">
</a>
</div>
<div class="content">
<div class="category-info">
<div class="category-list">
<a href="javascript:void(0)">UI UX
Design of Website</a>
</div>
<div class="meta">
<span><a href="javascript:void(0)"><i
class="feather-heart"></i></a>
10</span>
</div>
</div>
<h4 class="title"><a
href="javascript:void(0)">I Designed UI and UX Design of EasyBux Website portal <i
class="feather-arrow-up-right"></i></a></h4>
</div>
</div>
</div>
</div>
<!-- End Single Portfolio -->
<!-- Start Single Portfolio -->
<div data-aos="fade-up" data-aos-
delay="100" data-aos-once="true" class="col-lg-6 col-xl-4 col-md-6 col-12 mt--50
mt_md--30 mt_sm--30">
<div class="rn-portfolio" data-
toggle="modal" data-target="#ee">
<div class="inner">
<div class="thumbnail"
style="overflow: auto; height: 200px;">
<a
href="javascript:void(0)">
<img
src="assets/images/portfolio/project-2.jpg" style="height:156px;" alt="Personal
Portfolio Images">
</a>
</div>
<div class="content">
<div class="category-info">
<div class="category-
list">
<a
href="javascript:void(0)">UI UX Design of Website</a>
</div>
<div class="meta">
<span><a
href="javascript:void(0)"><i class="feather-heart"></i></a>
5</span>
</div>
</div>
<h4 class="title"><a
href="javascript:void(0)">Design of Loan Landing Page <i class="feather-arrow-up-
right"></i></a></h4>
</div>
</div>
</div>
</div>
<!-- End Single Portfolio -->

<!-- Start Single Portfolio -->


<div data-aos="fade-up" data-aos-delay="300" data-aos-
once="true" class="col-lg-6 col-xl-4 col-md-6 col-12 mt--50 mt_md--30 mt_sm--30">
<div class="rn-portfolio" data-toggle="modal" data-
target="#exampleModalCente">
<div class="inner">
<div class="thumbnail" style="overflow: auto;
height: 200px;">
<a href="javascript:void(0)">
<img
src="assets/images/portfolio/portfolio-02.jpg" style="height:156px;"
alt="Personal Portfolio Images">
</a>
</div>
<div class="content">
<div class="category-info">
<div class="category-list">
<a href="javascript:void(0)">Portfolio
Website</a>
</div>
<div class="meta">
<span><a href="javascript:void(0)"><i
class="feather-heart"></i></a>
8</span>
</div>
</div>
<h4 class="title"><a
href="javascript:void(0)">Design of Portfolio Website <i class="feather-arrow-up-
right"></i></a></h4>
</div>
</div>
</div>
</div>
<!-- End Single Portfolio -->

<!-- Start Single Portfolio -->


<div data-aos="fade-up" data-aos-delay="500" data-aos-
once="true" class="col-lg-6 col-xl-4 col-md-6 col-12 mt--50 mt_md--30 mt_sm--30">
<div class="rn-portfolio" data-toggle="modal" data-
target="#exampleModalCent">
<div class="inner">
<div class="thumbnail" style="overflow: auto;
height: 200px;">
<a href="javascript:void(0)">
<img
src="assets/images/portfolio/portfolio-03.jpg" style="height:156px;"
alt="Personal Portfolio Images">
</a>
</div>
<div class="content">
<div class="category-info">
<div class="category-list">
<a href="javascript:void(0)">Landing
Page</a>
</div>
<div class="meta">
<span><a href="javascript:void(0)"><i
class="feather-heart"></i></a>
9</span>
</div>
</div>
<h4 class="title"><a
href="javascript:void(0)">IT Company Portfolio
<i
class="feather-arrow-up-right"></i></a></h4>
</div>
</div>
</div>
</div>
<!-- End Single Portfolio -->
<!-- Start Single Portfolio -->
<div data-aos="fade-up" data-aos-delay="100" data-aos-
once="true" class="col-lg-6 col-xl-4 col-md-6 col-12 mt--50 mt_md--30 mt_sm--30">
<div class="rn-portfolio" data-toggle="modal" data-
target="#exampleModalCen">
<div class="inner">
<div class="thumbnail" style="overflow: auto;
height: 200px;">
<a href="javascript:void(0)">
<img
src="assets/images/portfolio/portfolio-04.jpg" style="height:156px;"
alt="Personal Portfolio Images">
</a>
</div>
<div class="content">
<div class="category-info">
<div class="category-list">
<a href="javascript:void(0)">Figma</a>
</div>
<div class="meta">
<span><a href="javascript:void(0)"><i
class="feather-heart"></i></a>
360</span>
</div>
</div>
<h4 class="title"><a
href="javascript:void(0)">Mobile app landing design &
Services<i class="feather-arrow-up-
right"></i></a></h4>
</div>
</div>
</div>
</div>
<!-- End Single Portfolio -->

<!-- Start Single Portfolio -->


<div data-aos="fade-up" data-aos-delay="300" data-aos-
once="true" class="col-lg-6 col-xl-4 col-md-6 col-12 mt--50 mt_md--30 mt_sm--30">
<div class="rn-portfolio" data-toggle="modal" data-
target="#exampleModalCe">
<div class="inner">
<div class="thumbnail" style="overflow: auto;
height: 200px;">
<a href="javascript:void(0)">
<img
src="assets/images/portfolio/portfolio-05.jpg" style="height:156px;"
alt="Personal Portfolio Images">
</a>
</div>
<div class="content">
<div class="category-info">
<div class="category-list">
<a href="javascript:void(0)">Web
Design</a>
</div>
<div class="meta">
<span><a href="javascript:void(0)"><i
class="feather-heart"></i></a>
280</span>
</div>
</div>
<h4 class="title"><a
href="javascript:void(0)">Design for tecnology & services<i class="feather-arrow-
up-right"></i></a></h4>
</div>
</div>
</div>
</div>
<!-- End Single Portfolio -->

<!-- Start Single Portfolio -->


<div data-aos="fade-up" data-aos-delay="500" data-aos-
once="true" class="col-lg-6 col-xl-4 col-md-6 col-12 mt--50 mt_md--30 mt_sm--30">
<div class="rn-portfolio" data-toggle="modal" data-
target="#exampleModal">
<div class="inner">
<div class="thumbnail" style="overflow: auto;
height: 200px;">
<a href="javascript:void(0)">
<img
src="assets/images/portfolio/portfolio-06.jpg" style="height:156px;" alt="Personal
Portfolio Images">
</a>
</div>
<div class="content">
<div class="category-info">
<div class="category-list">
<a href="javascript:void(0)">Web
Design</a>
</div>
<div class="meta">
<span><a href="javascript:void(0)"><i
class="feather-heart"></i></a>
690</span>
</div>
</div>
<h4 class="title"><a
href="javascript:void(0)">App for tecnology & services<i class="feather-arrow-up-
right"></i></a></h4>
</div>
</div>
</div>
</div>
<!-- End Single Portfolio -->
</div>
</div>
</div>
<!-- End portfolio Area -->

<!-- Start Resume Area -->


<div class="rn-resume-area rn-section-gap section-separator" id="resume">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="section-title text-center">
<span class="subtitle">7+ Years of Experience</span>
<h2 class="title">My Resume</h2>
</div>
</div>
</div>
<div class="row mt--45">
<div class="col-lg-12">
<ul class="rn-nav-list nav nav-tabs" id="myTabs"
role="tablist">
<li class="nav-item">
<a class="nav-link active" id="education-tab" data-
toggle="tab" href="#education" role="tab" aria-controls="education" aria-
selected="true">education</a>
</li>
<li class="nav-item">
<a class="nav-link" id="professional-tab" data-
toggle="tab" href="#professional" role="tab" aria-controls="professional" aria-
selected="false">professional
Skills</a>
</li>
<li class="nav-item">
<a class="nav-link" id="experience-tab" data-
toggle="tab" href="#experience" role="tab" aria-controls="experience" aria-
selected="false">experience</a>
</li>
<!-- <li class="nav-item">
<a class="nav-link" id="interview-tab" data-
toggle="tab" href="#interview" role="tab" aria-controls="interview" aria-
selected="false">interview</a>
</li> -->
</ul>
<!-- Start Tab Content Wrapper -->
<div class="rn-nav-content tab-content" id="myTabContents">
<!-- Start Single Tab -->
<div class="tab-pane show active fade single-tab-area"
id="education" role="tabpanel" aria-labelledby="education-tab">
<div class="personal-experience-inner mt--40">
<div class="row">
<!-- Start Skill List Area -->
<div class="col-lg-6 col-md-12 col-12">
<div class="content">
<span class="subtitle">2007 -
2010</span>
<h4 class="maintitle">Education
Quality</h4>
<div class="experience-list">

<!-- Start Single List -->


<div class="resume-single-
list">
<div class="inner">
<div class="heading">
<div class="title">
<h4>Bechalour
of Computer Science BSCS</h4>
<span>Air
University (2013 - 2018)</span>
</div>
<div class="date-
of-time">
<span>4.30/5</span>
</div>
</div>

</div>
</div>
<!-- End Single List -->

<!-- Start Single List -->


<div class="resume-single-
list">
<div class="inner">
<div class="heading">
<div class="title">
<h4> ICS</h4>
<span>502 Model
College (2011 - 2013)</span>
</div>
<div class="date-
of-time">

<span>4.50/5</span>
</div>
</div>
</div>
</div>
<!-- End Single List -->

<!-- Start Single List -->


<!-- <div class="resume-single-
list">
<div class="inner">
<div class="heading">
<div class="title">
<h4>Tips For
Personal Portfolio</h4>

<span>University of Studies (1997 - 2001)</span>


</div>
<div class="date-
of-time">

<span>4.80/5</span>
</div>
</div>
<p class="description">
If you are going to use a passage.
Ut tincidunt est ac
dolor aliquam sodales.
Phasellus sed
mauris hendrerit, laoreet sem in, lobortis
mauris hendrerit
ante.</p>
</div>
</div> -->
<!-- End Single List -->

</div>
</div>
</div>
<!-- End Skill List Area -->

<!-- Start Skill List Area 2nd -->


<div class="col-lg-6 col-md-12 col-12
mt_md--60 mt_sm--60">
<div class="content">
<span class="subtitle">2016 -
2021</span>
<h4 class="maintitle">Job
Experience</h4>
<div class="experience-list">

<!-- Start Single List -->


<div class="resume-single-
list">
<div class="inner">
<div class="heading">
<div class="title">
<h4>SENIOR
UI/UX DESIGNER</h4>
<span>AKSA SDS
(2020 - 2021)</span>
</div>
<div class="date-
of-time">

<span>4.90/5</span>
</div>
</div>
<p
class="description">Gather and evaluate user requirements in collaboration with
product managers and engineers.Illustrate design ideas using storyboards, process
flows and sitemaps.Design graphic user interface elements, like menus, tabs and
widgets.Build page navigation buttons and search fields.Develop UI mockups and
prototypes that clearly illustrate how sites function and look like.Create original
graphic designs (e.g. images, sketches and tables).Prepare and present rough drafts
to internal teams and key stakeholders.Identify and troubleshoot UX problems (e.g.
responsiveness).</p>
</div>
</div>
<!-- End Single List -->

<!-- Start Single List -->


<div class="resume-single-
list">
<div class="inner">
<div class="heading">
<div class="title">
<h4>SENIOR
UI/UX DESIGNER</h4>
<span>Job at
Arkhitech (2018 - 2021)</span>
</div>
<div class="date-
of-time">

<span>5/5</span>
</div>
</div>
<p
class="description">I was responsible the look and feel of a physical or digital
product. This can include everything from packaging to web design. I work closely
with interaction designers and UI/UX copywriters to create a user experience that
is aesthetically pleasing, user-friendly, and efficient. My job was to assist UI/UX
designers with developing high-fidelity prototypes towards the end of the design
phase.visual styling of an app or website. Think things like how icons are
designed, how they’re arranged on the page, and how they relate to each other.
Design elements such as font choice, color scheme, graphics, buttons, and menu
styling are all elements of interface design.</p>
</div>
</div>
<!-- End Single List -->

<!-- Start Single List -->


<div class="resume-single-
list">
<div class="inner">
<div class="heading">
<div class="title">
<h4>FRONTEND
DEVELOPER</h4>
<span>DEVTREST
PVT LTD (2016 -
2018)</span>
</div>
<div class="date-
of-time">

<span>5.00/5</span>
</div>
</div>
<p
class="description">My responsibility was to Optimizie the user experience.Using
HTML, JavaScript and CSS to bring concepts to life.Developing and maintaining the
user interface.Implementing design on mobile websites.Creating tools that improve
site interaction regardless of the browser.Managing software workflow.Following SEO
best practices.Fixing bugs and testing for usability.Ensure the technical
feasibility of UI/UX designs..</p>
</div>
</div>
<!-- End Single List -->

</div>
</div>
</div>
<!-- End Skill List Area -->
</div>
</div>
</div>
<!-- End Single Tab -->

<!-- Start Single Tab -->


<div class="tab-pane fade " id="professional"
role="tabpanel" aria-labelledby="professional-tab">
<div class="personal-experience-inner mt--40">
<div class="row row--40">
<!-- Start Single Progressbar -->
<div class="col-lg-6 col-md-6 col-12">
<div class="progress-wrapper">
<div class="content">
<span
class="subtitle">Features</span>
<h4 class="maintitle">Design
Skill</h4>
<!-- Start Single Progress
Charts -->
<div class="progress-charts">
<h6 class="heading heading-
h6">PHOTOSHOP</h6>
<div class="progress">
<div class="progress-
bar wow fadeInLeft" data-wow-duration="0.5s" data-wow-delay=".3s"
role="progressbar" style="width: 100%" aria-valuenow="85" aria-valuemin="0" aria-
valuemax="100"><span class="percent-label">100%</span></div>
</div>
</div>
<!-- End Single Progress Charts
-->

<!-- Start Single Progress


Charts -->
<div class="progress-charts">
<h6 class="heading heading-
h6">FIGMA</h6>
<div class="progress">
<div class="progress-
bar wow fadeInLeft" data-wow-duration="0.6s" data-wow-delay=".4s"
role="progressbar" style="width: 95%" aria-valuenow="85" aria-valuemin="0" aria-
valuemax="100"><span class="percent-label">95%</span></div>
</div>
</div>
<!-- End Single Progress Charts
-->

<!-- Start Single Progress


Charts -->
<div class="progress-charts">
<h6 class="heading heading-
h6">ADOBE XD</h6>
<div class="progress">
<div class="progress-
bar wow fadeInLeft" data-wow-duration="0.7s" data-wow-delay=".5s"
role="progressbar" style="width: 60%" aria-valuenow="85" aria-valuemin="0" aria-
valuemax="100"><span class="percent-label">60%</span></div>
</div>
</div>
<!-- End Single Progress Charts
-->

<!-- Start Single Progress


Charts -->
<div class="progress-charts">
<h6 class="heading heading-
h6">ADOBE ILLUSTRATOR</h6>
<div class="progress">
<div class="progress-
bar wow fadeInLeft" data-wow-duration="0.8s" data-wow-delay=".6s"
role="progressbar" style="width: 70%" aria-valuenow="85" aria-valuemin="0" aria-
valuemax="100"><span class="percent-label">70%</span></div>
</div>
</div>
<!-- End Single Progress Charts
-->

<!-- Start Single Progress


Charts -->
<div class="progress-charts">
<h6 class="heading heading-
h6">DESIGN</h6>
<div class="progress">
<div class="progress-
bar wow fadeInLeft" data-wow-duration="0.9s" data-wow-delay=".7s"
role="progressbar" style="width: 90%" aria-valuenow="85" aria-valuemin="0" aria-
valuemax="100"><span class="percent-label">90%</span></div>
</div>
</div>
<!-- End Single Progress Charts
-->

</div>
</div>
</div>
<!-- End Single Progressbar -->

<!-- Start Single Progressbar -->


<div class="col-lg-6 col-md-6 col-12
mt_sm--60">
<div class="progress-wrapper">
<div class="content">
<span
class="subtitle">Features</span>
<h4
class="maintitle">Development Skill</h4>
<!-- Start Single Progress
Charts -->
<div class="progress-charts">
<h6 class="heading heading-
h6">HTML</h6>
<div class="progress">
<div class="progress-
bar wow fadeInLeft" data-wow-duration="0.5s" data-wow-delay=".3s"
role="progressbar" style="width: 85%" aria-valuenow="85" aria-valuemin="0" aria-
valuemax="100"><span class="percent-label">85%</span></div>
</div>
</div>
<!-- End Single Progress Charts
-->

<!-- Start Single Progress


Charts -->
<div class="progress-charts">
<h6 class="heading heading-
h6">CSS</h6>
<div class="progress">
<div class="progress-
bar wow fadeInLeft" data-wow-duration="0.6s" data-wow-delay=".4s"
role="progressbar" style="width: 80%" aria-valuenow="85" aria-valuemin="0" aria-
valuemax="100"><span class="percent-label">80%</span></div>
</div>
</div>
<!-- End Single Progress Charts
-->

<!-- Start Single Progress


Charts -->
<div class="progress-charts">
<h6 class="heading heading-
h6">JAVASCRIPT</h6>
<div class="progress">
<div class="progress-
bar wow fadeInLeft" data-wow-duration="0.7s" data-wow-delay=".5s"
role="progressbar" style="width: 90%" aria-valuenow="85" aria-valuemin="0" aria-
valuemax="100"><span class="percent-label">90%</span></div>
</div>
</div>
<!-- End Single Progress Charts
-->

<!-- Start Single Progress


Charts -->
<div class="progress-charts">
<h6 class="heading heading-
h6">JQuery</h6>
<div class="progress">
<div class="progress-
bar wow fadeInLeft" data-wow-duration="0.8s" data-wow-delay=".6s"
role="progressbar" style="width: 75%" aria-valuenow="85" aria-valuemin="0" aria-
valuemax="100"><span class="percent-label">75%</span></div>
</div>
</div>
<!-- End Single Progress Charts
-->

<!-- Start Single Progress


Charts -->
<div class="progress-charts">
<h6 class="heading heading-
h6">PLUGIN</h6>
<div class="progress">
<div class="progress-
bar wow fadeInLeft" data-wow-duration="0.9s" data-wow-delay=".7s"
role="progressbar" style="width: 70%" aria-valuenow="85" aria-valuemin="0" aria-
valuemax="100"><span class="percent-label">70%</span></div>
</div>
</div>
<!-- End Single Progress Charts
-->

</div>
</div>
</div>
<!-- End Single Progressbar -->
</div>
</div>
</div>
<!-- End Single Tab -->

<!-- Start Single Tab -->


<div class="tab-pane fade" id="experience"
role="tabpanel" aria-labelledby="experience-tab">
<div class="personal-experience-inner mt--40">
<div class="row">
<!-- Start Skill List Area -->
<div class="col-lg-6 col-md-12 col-12">
<div class="content">
<span class="subtitle">2007 -
2010</span>
<h4 class="maintitle">Education
Quality</h4>
<div class="experience-list">

<!-- Start Single List -->


<div class="resume-single-
list">
<div class="inner">
<div class="heading">
<div class="title">
<h4>Bechalour
of Computer Science BSCS</h4>
<span>Air
University (2013 - 2018)</span>
</div>
<div class="date-
of-time">

<span>4.30/5</span>
</div>
</div>

</div>
</div>
<!-- End Single List -->

<!-- Start Single List -->


<div class="resume-single-
list">
<div class="inner">
<div class="heading">
<div class="title">
<h4> ICS</h4>
<span>502 Model
College (2011 - 2013)</span>
</div>
<div class="date-
of-time">

<span>4.50/5</span>
</div>
</div>
</div>
</div>
<!-- End Single List -->

<!-- Start Single List -->


<!-- <div class="resume-single-
list">
<div class="inner">
<div class="heading">
<div class="title">
<h4>Tips For
Personal Portfolio</h4>

<span>University of Studies (1997 - 2001)</span>


</div>
<div class="date-
of-time">

<span>4.80/5</span>
</div>
</div>
<p class="description">
If you are going to use a passage.
Ut tincidunt est ac
dolor aliquam sodales.
Phasellus sed
mauris hendrerit, laoreet sem in, lobortis
mauris hendrerit
ante.</p>
</div>
</div> -->
<!-- End Single List -->

</div>
</div>
</div>
<!-- End Skill List Area -->

<!-- Start Skill List Area 2nd -->


<div class="col-lg-6 col-md-12 col-12
mt_md--60 mt_sm--60">
<div class="content">
<span class="subtitle">2016 -
2021</span>
<h4 class="maintitle">Job
Experience</h4>
<div class="experience-list">

<!-- Start Single List -->


<div class="resume-single-
list">
<div class="inner">
<div class="heading">
<div class="title">
<h4>SENIOR
UI/UX DESIGNER</h4>
<span>AKSA SDS
(2020 - 2021)</span>
</div>
<div class="date-
of-time">
<span>4.90/5</span>
</div>
</div>
<p
class="description">Gather and evaluate user requirements in collaboration with
product managers and engineers.Illustrate design ideas using storyboards, process
flows and sitemaps.Design graphic user interface elements, like menus, tabs and
widgets.Build page navigation buttons and search fields.Develop UI mockups and
prototypes that clearly illustrate how sites function and look like.Create original
graphic designs (e.g. images, sketches and tables).Prepare and present rough drafts
to internal teams and key stakeholders.Identify and troubleshoot UX problems (e.g.
responsiveness).</p>
</div>
</div>
<!-- End Single List -->

<!-- Start Single List -->


<div class="resume-single-
list">
<div class="inner">
<div class="heading">
<div class="title">
<h4>SENIOR
UI/UX DESIGNER</h4>
<span>Job at
Arkhitech (2018 - 2021)</span>
</div>
<div class="date-
of-time">

<span>5/5</span>
</div>
</div>
<p
class="description">I was responsible the look and feel of a physical or digital
product. This can include everything from packaging to web design. I work closely
with interaction designers and UI/UX copywriters to create a user experience that
is aesthetically pleasing, user-friendly, and efficient. My job was to assist UI/UX
designers with developing high-fidelity prototypes towards the end of the design
phase.visual styling of an app or website. Think things like how icons are
designed, how they’re arranged on the page, and how they relate to each other.
Design elements such as font choice, color scheme, graphics, buttons, and menu
styling are all elements of interface design.</p>
</div>
</div>
<!-- End Single List -->

<!-- Start Single List -->


<div class="resume-single-
list">
<div class="inner">
<div class="heading">
<div class="title">
<h4>FRONTEND
DEVELOPER</h4>
<span>DEVTREST
PVT LTD (2016 -
2018)</span>
</div>
<div class="date-
of-time">

<span>5.00/5</span>
</div>
</div>
<p
class="description">My responsibility was to Optimizie the user experience.Using
HTML, JavaScript and CSS to bring concepts to life.Developing and maintaining the
user interface.Implementing design on mobile websites.Creating tools that improve
site interaction regardless of the browser.Managing software workflow.Following SEO
best practices.Fixing bugs and testing for usability.Ensure the technical
feasibility of UI/UX designs..</p>
</div>
</div>
<!-- End Single List -->

</div>
</div>
</div>
<!-- End Skill List Area -->
</div>
</div>
</div>
<!-- End Single Tab -->

<!-- Start Single Tab -->


<div class="tab-pane fade" id="interview"
role="tabpanel" aria-labelledby="interview-tab">
<div class="personal-experience-inner mt--40">
<div class="row">
<!-- Start Skill List Area -->
<div class="col-lg-6 col-md-12 col-12">
<div class="content">
<span class="subtitle">2007 -
2010</span>
<h4 class="maintitle">Company
Experience</h4>
<div class="experience-list">

<!-- Start Single List -->


<div data-aos="fade-up" data-
aos-duration="500" data-aos-delay="300" data-aos-once="true" class="resume-single-
list">
<div class="inner">
<div class="heading">
<div class="title">
<h4>Personal
Portfolio April Fools</h4>

<span>University of DVI (1997 - 2001)</span>


</div>
<div class="date-
of-time">

<span>4.30/5</span>
</div>
</div>
<p
class="description">The education should be very
interactual. Ut
tincidunt est ac dolor aliquam sodales.
Phasellus sed
mauris hendrerit, laoreet sem in, lobortis
mauris hendrerit
ante.</p>
</div>
</div>
<!-- End Single List -->

<!-- Start Single List -->


<div data-aos="fade-up" data-
aos-duration="500" data-aos-delay="500" data-aos-once="true" class="resume-single-
list">
<div class="inner">
<div class="heading">
<div class="title">
<h4> Examples
Of Personal Portfolio</h4>
<span>College
of Studies (2000 - 2002)</span>
</div>
<div class="date-
of-time">

<span>4.50/5</span>
</div>
</div>
<p
class="description">Maecenas finibus nec sem ut
imperdiet. Ut
tincidunt est ac dolor aliquam sodales.
Phasellus sed
mauris hendrerit, laoreet sem in, lobortis
mauris hendrerit
ante.</p>
</div>
</div>
<!-- End Single List -->

<!-- Start Single List -->


<div data-aos="fade-up" data-
aos-duration="500" data-aos-delay="700" data-aos-once="true" class="resume-single-
list">
<div class="inner">
<div class="heading">
<div class="title">
<h4>Tips For
Personal Portfolio</h4>

<span>University of Studies (1997 - 2001)</span>


</div>
<div class="date-
of-time">

<span>4.80/5</span>
</div>
</div>
<p class="description">
If you are going to use a passage.
Ut tincidunt est ac
dolor aliquam sodales.
Phasellus sed
mauris hendrerit, laoreet sem in, lobortis
mauris hendrerit
ante.</p>
</div>
</div>
<!-- End Single List -->

</div>
</div>
</div>
<!-- End Skill List Area -->

<!-- Start Skill List Area 2nd -->


<div class="col-lg-6 col-md-12 col-12
mt_md--60 mt_sm--60">
<div class="content">
<span class="subtitle">2007 -
2010</span>
<h4 class="maintitle">Job
Experience</h4>
<div class="experience-list">

<!-- Start Single List -->


<div data-aos="fade-up" data-
aos-duration="500" data-aos-delay="500" data-aos-once="true" class="resume-single-
list">
<div class="inner">
<div class="heading">
<div class="title">
<h4>Diploma in
Web Development</h4>
<span>BSE In
CSE (2004 - 2008)</span>
</div>
<div class="date-
of-time">

<span>4.70/5</span>
</div>
</div>
<p
class="description">Contrary to popular belief. Ut
tincidunt est ac
dolor aliquam sodales.
Phasellus sed
mauris hendrerit, laoreet sem in, lobortis
mauris hendrerit
ante.</p>
</div>
</div>
<!-- End Single List -->

<!-- Start Single List -->


<div data-aos="fade-up" data-
aos-duration="500" data-aos-delay="700" data-aos-once="true" class="resume-single-
list">
<div class="inner">
<div class="heading">
<div class="title">
<h4>The
Personal Portfolio Mystery</h4>
<span>Job at
Rainbow-Themes (2008 - 2016)</span>
</div>
<div class="date-
of-time">

<span>4.95/5</span>
</div>
</div>
<p
class="description">Generate Lorem Ipsum which looks. Ut
tincidunt est ac
dolor aliquam sodales.
Phasellus sed
mauris hendrerit, laoreet sem in, lobortis
mauris hendrerit
ante.</p>
</div>
</div>
<!-- End Single List -->

<!-- Start Single List -->


<div data-aos="fade-up" data-
aos-duration="500" data-aos-delay="900" data-aos-once="true" class="resume-single-
list">
<div class="inner">
<div class="heading">
<div class="title">
<h4>Diploma in
Computer Science</h4>
<span>Works at
Plugin Development (2016 -
2020)</span>
</div>
<div class="date-
of-time">

<span>5.00/5</span>
</div>
</div>
<p
class="description">Maecenas finibus nec sem ut
imperdiet. Ut
tincidunt est ac dolor aliquam sodales.
Phasellus sed
mauris hendrerit, laoreet sem in, lobortis
mauris hendrerit
ante.</p>
</div>
</div>
<!-- End Single List -->
</div>
</div>
</div>
<!-- End Skill List Area -->
</div>
</div>
</div>
<!-- End Single Tab -->
</div>
</div>
</div>
</div>
</div>
<!-- End Resume Area -->
<!-- Start Testimonia Area -->

<!-- End Testimonia Area -->


<!-- Start Client Area -->

<!-- End client section -->


<!-- Pricing Area -->
<div class="rn-pricing-area rn-section-gap section-separator" id="pricing">
<div class="container">
<div class="row">
<div class="col-lg-4 col-xl-5 mb_md--40 mb_sm--40 small-margin-
pricing">
<div class="d-block d-lg-flex text-center d-lg-left
section-flex flex-wrap align-content-start h-100">
<div class="position-sticky sticky-top rbt-sticky-top-
adjust">
<div class="section-title text-left">
<span class="subtitle text-center text-lg-
left">Pricing</span>
<h2 class="title text-center text-lg-left">My
Pricing</h2>
</div>
</div>
</div>
</div>

<div class="col-lg-8 col-xl-7">


<!-- Pricing Area -->
<div class="navigation-wrapper">
<ul class="nav " id="myTab" role="tablist">
<li class="nav-item ">
<a class="nav-style" id="test-tab" data-
toggle="tab" href="#test" role="tab" aria-controls="test" aria-
selected="false">Static</a>
</li>

<li class="nav-item recommended">


<a class="nav-style active" id="profile-tab"
data-toggle="tab" href="#profile" role="tab" aria-controls="profile" aria-
selected="true">Standard</a>
</li>
<li class="nav-item">
<a class="nav-style" id="contact-tab" data-
toggle="tab" href="#contact" role="tab" aria-controls="contact" aria-
selected="false">Premium</a>
</li>
</ul>
<div class="tab-content" id="myTabContent">

<div class="tab-pane fade " id="test"


role="tabpanel" aria-labelledby="test-tab">
<!-- Pricing Start -->
<div class="rn-pricing">
<div class="pricing-header">
<div class="header-left">
<h2 class="title">Make Your Single
Page</h2>
<span>Elementor</span>
</div>
<div class="header-right">
<span>$30.00</span>
</div>
</div>
<div class="pricing-body">
<p class="description">
All the Lorem Ipsum generators on
the Internet tend to repeat predefined
chunks as necessary
</p>
<div class="check-wrapper">
<div class="left-area">
<div class="check d-flex">
<i
data-feather="check"></i>
<p>1 Page with
Elementor</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Design Customization</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Responsive Design</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Content Upload</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Design Customization</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>2 Plugins/Extensions</p>
</div>
</div>
<div class="right-area">
<div class="check d-flex">
<i
data-feather="check"></i>
<p>multipage Elementor</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Design Figma</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>MAintaine Design</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Content Upload</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Design With XD</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>8 Plugins/Extensions</p>
</div>
</div>
</div>
</div>
<div class="pricing-footer">
<a href="#" class="rn-btn d-block">
<span>ORDER NOW</span>
<i data-feather="arrow-right"></i>
</a>
<div class="time-line">
<div class="single-cmt d-flex">
<i data-feather="clock"></i>
<span>2 Days Delivery</span>
</div>
<div class="single-cmt d-flex">
<i data-feather="activity"></i>
<span>Unlimited
Revission</span>
</div>
</div>
</div>
</div>
<!-- End -->
</div>

<div class="tab-pane fade show active" id="profile"


role="tabpanel" aria-labelledby="profile-tab">
<!-- Pricing Start -->
<div class="rn-pricing">
<div class="pricing-header">
<div class="header-left">
<h2 class="title">Design Make this
Page</h2>
<span>Elementor</span>
</div>
<div class="header-right">
<span>$50.00</span>
</div>
</div>
<div class="pricing-body">
<p class="description">
Making this the first true
generator on the Internet. It uses a
dictionary & plugin Development.
</p>
<div class="check-wrapper">
<div class="left-area">
<div class="check d-flex">
<i
data-feather="check"></i>
<p>1 Page with
Elementor</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Design Customization</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Responsive Design</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Content Upload</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Design Customization</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>2 Plugins/Extensions</p>
</div>
</div>
<div class="right-area">
<div class="check d-flex">
<i
data-feather="check"></i>
<p>multipage Elementor</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Design Figma</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>MAintaine Design</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Content Upload</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Design With XD</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>8 Plugins/Extensions</p>
</div>
</div>
</div>
</div>
<div class="pricing-footer">
<a href="#" class="rn-btn d-block">
<span>ORDER NOW</span>
<i data-feather="arrow-right"></i>
</a>
<div class="time-line d-flex">
<div class="single-cmt d-flex">
<i data-feather="clock"></i>
<span>2 Days Delivery</span>
</div>
<div class="single-cmt d-flex">
<i data-feather="activity"></i>
<span>Unlimited
Revission</span>
</div>
</div>
</div>
</div>
<!-- End -->
</div>

<div class="tab-pane fade" id="contact"


role="tabpanel" aria-labelledby="contact-tab">
<!-- Pricing Start -->
<div class="rn-pricing">
<div class="pricing-header">
<div class="header-left">
<h2 class="title">Customize Your
Single Page</h2>
<span>Elementor</span>
</div>
<div class="header-right">
<span>$90.00</span>
</div>
</div>
<div class="pricing-body">
<p class="description">
I will install your desire theme
and made like Theme demo and customize
your single page( homepage)
</p>
<div class="check-wrapper">
<div class="left-area">
<div class="check d-flex">
<i
data-feather="check"></i>
<p>1 Page with
Elementor</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Design Customization</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Responsive Design</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Content Upload</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Design Customization</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>2 Plugins/Extensions</p>
</div>
</div>
<div class="right-area">
<div class="check d-flex">
<i
data-feather="check"></i>
<p>multipage Elementor</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Design Figma</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>MAintaine Design</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Content Upload</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>Design With XD</p>
</div>
<div class="check d-flex">
<i
data-feather="check"></i>
<p>8 Plugins/Extensions</p>
</div>
</div>
</div>
</div>
<div class="pricing-footer">
<a href="#" class="rn-btn d-block">
<span>ORDER NOW</span>
<i data-feather="arrow-right"></i>
</a>
<div class="time-line d-flex">
<div class="single-cmt d-flex">
<i data-feather="clock"></i>
<span>2 Days Delivery</span>
</div>
<div class="single-cmt d-flex">
<i data-feather="activity"></i>
<span>Unlimited
Revission</span>
</div>
</div>
</div>
</div>
<!-- End -->
</div>
</div>
</div>
<!-- End -->
</div>
</div>
</div>
</div>
<!-- pricing area -->
<!-- Start News Area -->

<!-- ENd Mews Area -->


<!-- Start Contact section -->
<div class="rn-contact-area rn-section-gap section-separator"
id="contacts">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="section-title text-center">
<span class="subtitle">Contact</span>
<h2 class="title">Contact With Me</h2>
</div>
</div>
</div>
<div class="row mt--50 mt_md--40 mt_sm--40 mt-contact-sm">
<div class="col-lg-5">
<div class="contact-about-area">
<div class="thumbnail">
<img src="assets/images/contact/contact1.png"
alt="contact-img">
</div>
<div class="title-area">
<h4 class="title">Inam Ur Rehman</h4>
<span>UI UX DESIGNER</span>
</div>
<div class="description">
<p>I am available for freelance work. Connect with
me via and call in to my account.
</p>
<span class="phone">Phone: <a
href="#">+923364491155</a></span>
<span class="mail">Email: <a
href="[email protected]">[email protected]</a></span>
</div>
<div class="social-area">
<div class="name">FIND WITH ME</div>
<div class="social-icone">
<a
href="https://web.facebook.com/inaam1992/"><i data-feather="facebook"></i></a>
<a href="https://www.linkedin.com/in/inam-ur-
rehman-366b1120b/"><i data-feather="linkedin"></i></a>
<a
href="https://www.instagram.com/inaamajay/"><i data-feather="instagram"></i></a>
</div>
</div>
</div>
</div>
<div data-aos-delay="600" class="col-lg-7 contact-input">
<div class="contact-form-wrapper">
<div class="introduce">

<form class="rnt-contact-form rwt-dynamic-form row"


id="contact-form" method="POST" action="mail.php">

<div class="col-lg-6">
<div class="form-group">
<label for="contact-name">Your
Name</label>
<input class="form-control form-
control-lg" name="contact-name" id="contact-name" type="text">
</div>
</div>

<div class="col-lg-6">
<div class="form-group">
<label for="contact-phone">Phone
Number</label>
<input class="form-control"
name="contact-phone" id="contact-phone" type="text">
</div>
</div>

<div class="col-lg-12">
<div class="form-group">
<label
for="contact-email">Email</label>
<input class="form-control form-
control-sm" id="contact-email" name="contact-email" type="email">
</div>
</div>

<div class="col-lg-12">
<div class="form-group">
<label for="subject">subject</label>
<input class="form-control form-
control-sm" id="subject" name="subject" type="text">
</div>
</div>

<div class="col-lg-12">
<div class="form-group">
<label for="contact-message">Your
Message</label>
<textarea name="contact-message"
id="contact-message" cols="30" rows="10"></textarea>
</div>
</div>

<div class="col-lg-12">
<button name="submit" type="submit"
id="submit" class="rn-btn">
<span>SEND MESSAGE</span>
<i data-feather="arrow-right"></i>
</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- End Contuct section -->

<!-- Modal Portfolio Body area Start -->


<div class="modal fade" id="exampleModalCenter" tabindex="-1" role="dialog"
aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"
aria-label="Close">
<span aria-hidden="true"><i
data-feather="x"></i></span>
</button>
</div>
<div class="modal-body">
<div class="row">

<div class="col-lg-6">
<div class="portfolio-popup-thumbnail">
<div class="image">
<img class="w-100"
src="assets/images/portfolio/portfolio-01.jpg" alt="slide">
</div>
</div>
</div>

<div class="col-lg-6">
<div class="text-content">
<h3>
<span>Featured - Design</span> UI UX Design
and development.
</h3>
<p class="mb--30">Designed website portal of
Easybux using figma and for development used bootstrap 5 , JQuery and
javascript</p>
<div class="button-group mt--20">
<a href="#" class="rn-btn thumbs-icon">
<span>LIKE THIS</span>
<i data-feather="thumbs-up"></i>
</a>
<a
href="https://inamurrehman420.github.io/easybux/" class="rn-btn">
<span>VIEW PROJECT</span>
<i data-feather="chevron-right"></i>
</a>
</div>

</div>
<!-- End of .text-content -->
</div>
</div>
<!-- End of .row Body-->
</div>
</div>
</div>
</div>
<!-- End Modal Portfolio area -->

<!-- Modal Portfolio Body area Start -->


<div class="modal fade" id="exampleModalCenterr" tabindex="-1" role="dialog"
aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-
label="Close">
<span aria-hidden="true"><i data-feather="x"></i></span>
</button>
</div>
<div class="modal-body">
<div class="row">

<div class="col-lg-6">
<div class="portfolio-popup-thumbnail">
<div class="image">
<img class="w-100"
src="assets/images/portfolio/portfolio-01.jpg" alt="slide">
</div>
</div>
</div>

<div class="col-lg-6">
<div class="text-content">
<h3>
<span>Featured - Design</span> UI UX Design and
development.
</h3>
<p class="mb--30">Designed website portal of Easybux
using figma and for development used bootstrap 5 , JQuery and javascript</p>
<div class="button-group mt--20">
<a href="#" class="rn-btn thumbs-icon">
<span>LIKE THIS</span>
<i data-feather="thumbs-up"></i>
</a>
<a
href="https://inamurrehman420.github.io/easybux/" class="rn-btn">
<span>VIEW PROJECT</span>
<i data-feather="chevron-right"></i>
</a>
</div>

</div>
<!-- End of .text-content -->
</div>
</div>
<!-- End of .row Body-->
</div>
</div>
</div>
</div>
<!-- End Modal Portfolio area -->

<!-- Modal Portfolio Body area Start -->


<div class="modal fade" id="ee" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-
label="Close">
<span aria-hidden="true"><i data-feather="x"></i></span>
</button>
</div>
<div class="modal-body">
<div class="row">

<div class="col-lg-6">
<div class="portfolio-popup-thumbnail">
<div class="image">
<img class="w-100"
src="assets/images/portfolio/project-2.jpg" alt="slide">
</div>
</div>
</div>

<div class="col-lg-6">
<div class="text-content">
<h3>
<span>Featured - Design</span> UI UX Design and
development.
</h3>
<p class="mb--30">Designed website portal of Easybux
using figma and for development used bootstrap 5 , JQuery and javascript</p>
<div class="button-group mt--20">
<a href="#" class="rn-btn thumbs-icon">
<span>LIKE THIS</span>
<i data-feather="thumbs-up"></i>
</a>
<a
href="https://inamurrehman420.github.io/easybux/" class="rn-btn">
<span>VIEW PROJECT</span>
<i data-feather="chevron-right"></i>
</a>
</div>

</div>
<!-- End of .text-content -->
</div>
</div>
<!-- End of .row Body-->
</div>
</div>
</div>
</div>
<!-- End Modal Portfolio area -->

<!-- Modal Portfolio Body area Start -->


<div class="modal fade" id="exampleModalCente" tabindex="-1" role="dialog" aria-
hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-
label="Close">
<span aria-hidden="true"><i data-feather="x"></i></span>
</button>
</div>
<div class="modal-body">
<div class="row">

<div class="col-lg-6">
<div class="portfolio-popup-thumbnail">
<div class="image">
<img class="w-100"
src="assets/images/portfolio/portfolio-02.jpg" alt="slide">
</div>
</div>
</div>

<div class="col-lg-6">
<div class="text-content">
<h3>
<span>Portfolio - Design</span> UI UX Design and
development.
</h3>
<p class="mb--30">Designed website portal of Easybux
using figma and for development used bootstrap 5 , JQuery and javascript</p>
<div class="button-group mt--20">
<a href="#" class="rn-btn thumbs-icon">
<span>LIKE THIS</span>
<i data-feather="thumbs-up"></i>
</a>
<a
href="https://inamurrehman420.github.io/portfolio/" class="rn-btn">
<span>VIEW PROJECT</span>
<i data-feather="chevron-right"></i>
</a>
</div>

</div>
<!-- End of .text-content -->
</div>
</div>
<!-- End of .row Body-->
</div>
</div>
</div>
</div>
<!-- End Modal Portfolio area -->

<!-- Modal Portfolio Body area Start -->


<div class="modal fade" id="exampleModalCent" tabindex="-1" role="dialog" aria-
hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-
label="Close">
<span aria-hidden="true"><i data-feather="x"></i></span>
</button>
</div>
<div class="modal-body">
<div class="row">

<div class="col-lg-6">
<div class="portfolio-popup-thumbnail">
<div class="image">
<img class="w-100"
src="assets/images/portfolio/portfolio-03.jpg" alt="slide">
</div>
</div>
</div>

<div class="col-lg-6">
<div class="text-content">
<h3>
<span>APP Market - Design</span> UI UX Design and
development.
</h3>
<p class="mb--30">Designed website portal of Easybux
using figma and for development used bootstrap 5 , JQuery and javascript</p>
<div class="button-group mt--20">
<a href="#" class="rn-btn thumbs-icon">
<span>LIKE THIS</span>
<i data-feather="thumbs-up"></i>
</a>
<!-- <a
href="https://inamurrehman420.github.io/easybux/" class="rn-btn">
<span>VIEW PROJECT</span>
<i data-feather="chevron-right"></i>
</a> -->
</div>

</div>
<!-- End of .text-content -->
</div>
</div>
<!-- End of .row Body-->
</div>
</div>
</div>
</div>
<!-- End Modal Portfolio area -->
<!-- Modal Portfolio Body area Start -->
<div class="modal fade" id="exampleModalCen" tabindex="-1" role="dialog" aria-
hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-
label="Close">
<span aria-hidden="true"><i data-feather="x"></i></span>
</button>
</div>
<div class="modal-body">
<div class="row">

<div class="col-lg-6">
<div class="portfolio-popup-thumbnail">
<div class="image">
<img class="w-100"
src="assets/images/portfolio/portfolio-04.jpg" alt="slide">
</div>
</div>
</div>

<div class="col-lg-6">
<div class="text-content">
<h3>
<span>APP - Design</span> UI UX Design and
development.
</h3>
<p class="mb--30">Designed website portal of Easybux
using figma and for development used bootstrap 5 , JQuery and javascript</p>
<div class="button-group mt--20">
<a href="#" class="rn-btn thumbs-icon">
<span>LIKE THIS</span>
<i data-feather="thumbs-up"></i>
</a>
<!-- <a
href="https://inamurrehman420.github.io/easybux/" class="rn-btn">
<span>VIEW PROJECT</span>
<i data-feather="chevron-right"></i>
</a> -->
</div>
</div>
<!-- End of .text-content -->
</div>
</div>
<!-- End of .row Body-->
</div>
</div>
</div>
</div>
<!-- End Modal Portfolio area -->
<!-- Modal Portfolio Body area Start -->
<div class="modal fade" id="exampleModalCe" tabindex="-1" role="dialog" aria-
hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-
label="Close">
<span aria-hidden="true"><i data-feather="x"></i></span>
</button>
</div>
<div class="modal-body">
<div class="row">

<div class="col-lg-6">
<div class="portfolio-popup-thumbnail">
<div class="image">
<img class="w-100"
src="assets/images/portfolio/portfolio-05.jpg" alt="slide">
</div>
</div>
</div>

<div class="col-lg-6">
<div class="text-content">
<h3>
<span>Travek - Design</span> UI UX Design and
development.
</h3>
<p class="mb--30">Designed website portal of Easybux
using figma and for development used bootstrap 5 , JQuery and javascript</p>
<div class="button-group mt--20">
<a href="#" class="rn-btn thumbs-icon">
<span>LIKE THIS</span>
<i data-feather="thumbs-up"></i>
</a>
<!-- <a
href="https://inamurrehman420.github.io/easybux/" class="rn-btn">
<span>VIEW PROJECT</span>
<i data-feather="chevron-right"></i>
</a> -->
</div>

</div>
<!-- End of .text-content -->
</div>
</div>
<!-- End of .row Body-->
</div>
</div>
</div>
</div>

<!-- End Modal Portfolio area -->


<!-- Modal Portfolio Body area Start -->
<div class="modal fade" id="exampleModalC" tabindex="-1" role="dialog" aria-
hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-
label="Close">
<span aria-hidden="true"><i data-feather="x"></i></span>
</button>
</div>
<div class="modal-body">
<div class="row">

<div class="col-lg-6">
<div class="portfolio-popup-thumbnail">
<div class="image">
<img class="w-100"
src="assets/images/portfolio/portfolio-06.jpg" alt="slide">
</div>
</div>
</div>

<div class="col-lg-6">
<div class="text-content">
<h3>
<span>Dashboard - Design</span> UI UX Design and
development.
</h3>
<p class="mb--30">Designed website portal of Easybux
using figma and for development used bootstrap 5 , JQuery and javascript</p>
<div class="button-group mt--20">
<a href="#" class="rn-btn thumbs-icon">
<span>LIKE THIS</span>
<i data-feather="thumbs-up"></i>
</a>
<!-- <a
href="https://inamurrehman420.github.io/easybux/" class="rn-btn">
<span>VIEW PROJECT</span>
<i data-feather="chevron-right"></i>
</a> -->
</div>

</div>
<!-- End of .text-content -->
</div>
</div>
<!-- End of .row Body-->
</div>
</div>
</div>
</div>
<!-- End Modal Portfolio area -->
<!-- Modal Portfolio Body area Start -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-
hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-
label="Close">
<span aria-hidden="true"><i data-feather="x"></i></span>
</button>
</div>
<div class="modal-body">
<div class="row">

<div class="col-lg-6">
<div class="portfolio-popup-thumbnail">
<div class="image">
<img class="w-100"
src="assets/images/portfolio/portfolio-04.jpg" alt="slide">
</div>
</div>
</div>

<div class="col-lg-6">
<div class="text-content">
<h3>
<span>Featured - Design</span> UI UX Design and
development.
</h3>
<p class="mb--30">Designed website portal of Easybux
using figma and for development used bootstrap 5 , JQuery and javascript</p>
<div class="button-group mt--20">
<a href="#" class="rn-btn thumbs-icon">
<span>LIKE THIS</span>
<i data-feather="thumbs-up"></i>
</a>
<a
href="https://inamurrehman420.github.io/easybux/" class="rn-btn">
<span>VIEW PROJECT</span>
<i data-feather="chevron-right"></i>
</a>
</div>

</div>
<!-- End of .text-content -->
</div>
</div>
<!-- End of .row Body-->
</div>
</div>
</div>
</div>
<!-- End Modal Portfolio area -->
<!-- Modal Blog Body area Start -->
<div class="modal fade" id="exampleModalCenters" tabindex="-1"
role="dialog" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-news"
role="document">
<div class="modal-content">

<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"
aria-label="Close">
<span aria-hidden="true"><i
data-feather="x"></i></span>
</button>
</div>

<!-- End of .modal-header -->

<div class="modal-body">
<img src="assets/images/blog/blog-big-01.jpg" alt="news
modal" class="img-fluid modal-feat-img">
<div class="news-details">
<span class="date">2 May, 2021</span>
<h2 class="title">Digital Marketo to Their New
Office.</h2>
<p>Nobis eleifend option congue nihil imperdiet doming
id quod mazim placerat
facer
possim assum.
Typi non
habent claritatem insitam; est usus legentis in iis
qui facit eorum
claritatem.
Investigationes
demonstraverunt
lectores legere me lius quod ii legunt saepius.
Claritas est etiam processus
dynamicus, qui
sequitur
mutationem consuetudium lectorum.</p>
<h4>Nobis eleifend option conguenes.</h4>
<p>Mauris tempor, orci id pellentesque convallis, massa
mi congue eros, sed
posuere
massa nunc quis
dui.
Integer ornare varius mi, in vehicula orci
scelerisque sed. Fusce a massa
nisi.
Curabitur sit
amet
suscipit nisl. Sed eget nisl laoreet, suscipit enim
nec, viverra eros. Nunc
imperdiet risus
leo,
in rutrum erat dignissim id.</p>
<p>Ut rhoncus vestibulum facilisis. Duis et lorem vitae
ligula cursus venenatis.
Class aptent
taciti sociosqu
ad litora torquent per conubia nostra, per inceptos
himenaeos. Nunc vitae
nisi
tortor. Morbi
leo
nulla, posuere vel lectus a, egestas posuere lacus.
Fusce eleifend hendrerit
bibendum. Morbi
nec
efficitur ex.</p>
<h4>Mauris tempor, orci id pellentesque.</h4>
<p>Nulla non ligula vel nisi blandit egestas vel eget
leo. Praesent fringilla
dapibus dignissim.
Pellentesque
quis quam enim. Vestibulum ultrices, leo id
suscipit efficitur, odio lorem
rhoncus dolor, a
facilisis
neque mi ut ex. Quisque tempor urna a nisi pretium,
a pretium massa
tristique.
Nullam in
aliquam
diam. Maecenas at nibh gravida, ornare eros non,
commodo ligula. Sed
efficitur
sollicitudin
auctor.
Quisque nec imperdiet purus, in ornare odio.
Quisque odio felis, vestibulum
et.</p>
</div>

<!-- Comment Section Area Start -->


<div class="comment-inner">
<h3 class="title mb--40 mt--50">Leave a Reply</h3>
<form action="#">
<div class="row">
<div class="col-lg-6 col-md-12 col-12">
<div class="rnform-group"><input
type="text" placeholder="Name">
</div>
<div class="rnform-group"><input
type="email" placeholder="Email">
</div>
<div class="rnform-group"><input
type="text" placeholder="Website">
</div>
</div>
<div class="col-lg-6 col-md-12 col-12">
<div class="rnform-group">
<textarea
placeholder="Comment"></textarea>
</div>
</div>
<div class="col-lg-12">
<a class="rn-btn" href="#"><span>SUBMIT
NOW</span></a>
</div>
</div>
</form>
</div>
<!-- Comment Section End -->
</div>
<!-- End of .modal-body -->
</div>
</div>
</div>
<!-- End Modal Blog area -->
<!-- Back to top Start -->
<div class="backto-top">
<div>
<i data-feather="arrow-up"></i>
</div>
</div>
<!-- Back to top end -->

<!-- Start Right Demo -->


<!-- <div class="rn-right-demo">
<button class="demo-button">
<span class="text">Demos</span>
</button>
</div> -->
<!-- End Right Demo -->

<!-- Start Modal Area -->


<div class="demo-modal-area">
<div class="wrapper">
<div class="close-icon">
<button class="demo-close-btn"><span
class="feather-x"></span></button>
</div>
<div class="rn-modal-inner">
<div class="demo-top text-center">
<h4 class="title">InBio</h4>
<p class="subtitle">Its a personal portfolio template. You
can built any personal website easily.</p>
</div>

<ul class="popuptab-area nav nav-tabs" id="popuptab"


role="tablist">
<li class="nav-item">
<a class="nav-link active demo-dark" id="demodark-tab"
data-toggle="tab" href="#demodark" role="tab" aria-controls="demodark" aria-
selected="true">Dark Demo</a>
</li>
<li class="nav-item">
<a class="nav-link demo-light" id="demolight-tab" data-
toggle="tab" href="#demolight" role="tab" aria-controls="demolight" aria-
selected="false">Light Demo</a>
</li>
</ul>

<div class="tab-content" id="popuptabContent">


<div class="tab-pane show active" id="demodark"
role="tabpanel" aria-labelledby="demodark-tab">
<div class="content">
<div class="row">

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner">
<div class="thumbnail">
<a href="index.html">
<img class="w-100"
src="assets/images/demo/main-demo.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="index.html">Main Demo</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner badge-2">
<div class="thumbnail">
<a href="index-
technician.html">
<img class="w-100"
src="assets/images/demo/index-technician.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="index-technician.html">Technician</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner badge-2">
<div class="thumbnail">
<a href="index-model.html">
<img class="w-100"
src="assets/images/demo/home-model-v2.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="index-model.html">Model</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner badge-1">
<div class="thumbnail">
<a href="home-consulting.html">
<img class="w-100"
src="assets/images/demo/home-consulting.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="home-consulting.html">Consulting</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner badge-1">
<div class="thumbnail">
<a href="fashion-
designer.html">
<img class="w-100"
src="assets/images/demo/fashion-designer.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="fashion-designer.html">Fashion Designer</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner">
<div class="thumbnail">
<a href="index-developer.html">
<img class="w-100"
src="assets/images/demo/developer.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="index-developer.html">Developer</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner">
<div class="thumbnail">
<a href="instructor-
fitness.html">
<img class="w-100"
src="assets/images/demo/instructor-fitness.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="instructor-fitness.html">Fitness Instructor</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->
<!-- Start Single Content -->
<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner badge-1">
<div class="thumbnail">
<a href="home-web-
Developer.html">
<img class="w-100"
src="assets/images/demo/home-model.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="home-web-Developer.html">Web Developer</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner">
<div class="thumbnail">
<a href="home-designer.html">
<img class="w-100"
src="assets/images/demo/home-video.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="home-designer.html">Designer</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner">
<div class="thumbnail">
<a href="home-content-
writer.html">
<img class="w-100"
src="assets/images/demo/text-rotet.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="home-content-writer.html">Content Writter</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner">
<div class="thumbnail">
<a href="home-instructor.html">
<img class="w-100"
src="assets/images/demo/index-boxed.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="home-instructor.html">Instructor</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner">
<div class="thumbnail">
<a href="home-freelancer.html">
<img class="w-100"
src="assets/images/demo/home-sticky.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="home-freelancer.html">Freelancer</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner">
<div class="thumbnail">
<a href="home-
photographer.html">
<img class="w-100"
src="assets/images/demo/index-bg-image.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="home-photographer.html">Photographer</a>
</h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner">
<div class="thumbnail">
<a href="index-
politician.html">
<img class="w-100"
src="assets/images/demo/front-end.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="index-politician.html">Politician</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo coming-soon">
<div class="inner">
<div class="thumbnail">
<a href="#">
<img class="w-100"
src="assets/images/demo/coming-soon.png" alt="Personal Portfolio">
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="#">Accountant</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

</div>
</div>
</div>

<div class="tab-pane" id="demolight" role="tabpanel" aria-


labelledby="demolight-tab">
<div class="content">
<div class="row">

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner">
<div class="thumbnail">
<a href="index-white-
version.html">
<img class="w-100"
src="assets/images/demo/main-demo-white-version.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="index-white-version.html">Main Demo</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner badge-2">
<div class="thumbnail">
<a href="index-technician-
white-version.html">
<img class="w-100"
src="assets/images/demo/index-technician-white-version.png" alt="Personal
Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="index-technician-white-version.html">Technician</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner badge-2">
<div class="thumbnail">
<a href="index-model-white-
version.html">
<img class="w-100"
src="assets/images/demo/home-model-v2-white.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="index-model-white-version.html">Model</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner badge-1">
<div class="thumbnail">
<a href="home-consulting-white-
version.html">
<img class="w-100"
src="assets/images/demo/home-consulting-white-version.png" alt="Personal
Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="home-consulting-white-version.html">Consulting</a>
</h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner badge-1">
<div class="thumbnail">
<a href="fashion-designer-
white-version.html">
<img class="w-100"
src="assets/images/demo/fashion-designer-white-version.png" alt="Personal
Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="fashion-designer-white-version.html">Fashion Designer</a>
</h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner">
<div class="thumbnail">
<a href="index-developer-white-
version.html">
<img class="w-100"
src="assets/images/demo/developer-white-version.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="index-developer-white-version.html">Developer</a>
</h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->
<!-- Start Single Content -->
<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner">
<div class="thumbnail">
<a href="instructor-fitness-
white-version.html">
<img class="w-100"
src="assets/images/demo/instructor-fitness-white-version.png" alt="Personal
Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="instructor-fitness-white-version.html">Fitness Instructor</a>
</h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->
<!-- Start Single Content -->
<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner badge-1">
<div class="thumbnail">
<a href="home-web-developer-
white-version.html">
<img class="w-100"
src="assets/images/demo/home-model-white-version.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="home-web-developer-white-version.html">Web Developer</a>
</h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner">
<div class="thumbnail">
<a href="home-designer-white-
version.html">
<img class="w-100"
src="assets/images/demo/home-video-white-version.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="home-designer-white-version.html">Designer</a>
</h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner">
<div class="thumbnail">
<a href="home-content-writer-
white-version.html">
<img class="w-100"
src="assets/images/demo/text-rotet-white-version.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="home-content-writer-white-version.html">Content
Writter</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner">
<div class="thumbnail">
<a href="home-instructor-white-
version.html">
<img class="w-100"
src="assets/images/demo/index-boxed-white-version.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="home-instructor-white-version.html">Instructor</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner">
<div class="thumbnail">
<a href="home-freelancer-white-
version.html">
<img class="w-100"
src="assets/images/demo/home-sticky-white-version.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="home-freelancer-white-version.html">Freelancer</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner">
<div class="thumbnail">
<a href="home-photographer-
white-version.html">
<img class="w-100"
src="assets/images/demo/index-bg-image-white-version.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="home-photographer-white-version.html">Photographer</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo">
<div class="inner">
<div class="thumbnail">
<a href="index-politician-
white-version.html">
<img class="w-100"
src="assets/images/demo/front-end-white-version.png" alt="Personal Portfolio">
<span class="overlay-
content">
<span class="overlay-text">View
Demo <i class="feather-external-link"></i></span>
</span>
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="index-politician-white-version.html">Politician</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

<!-- Start Single Content -->


<div class="col-lg-4 col-md-6 col-12">
<div class="single-demo coming-soon">
<div class="inner">
<div class="thumbnail">
<a href="#">
<img class="w-100"
src="assets/images/demo/coming-soon.png" alt="Personal Portfolio">
</a>
</div>
<div class="inner">
<h3 class="title"><a
href="#">Accountant</a></h3>
</div>
</div>
</div>
</div>
<!-- End Single Content -->

</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- End Modal Area -->

</main>

<!-- Start Footer Area -->


<div class="rn-footer-area rn-section-gap section-separator">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="footer-area text-center">
<div class="logo">
<a href="index.html">
<img src="assets/images/logo/logo-vertical.png"
alt="logo">
</a>
</div>

<p class="description mt--30">© Tegar Nurwidyatmoko 2024.


All rights reserved by <a target="_blank"></a></p>
</div>
</div>
</div>
</div>
</div>
<!-- End Footer Area -->

<!-- JS ============================================ -->


<script src="assets/js/vendor/jquery.js"></script>
<script src="assets/js/vendor/modernizer.min.js"></script>
<script src="assets/js/vendor/feather.min.js"></script>
<script src="assets/js/vendor/slick.min.js"></script>
<script src="assets/js/vendor/bootstrap.js"></script>
<script src="assets/js/vendor/text-type.js"></script>
<script src="assets/js/vendor/wow.js"></script>
<script src="assets/js/vendor/aos.js"></script>
<script src="assets/js/vendor/particles.js"></script>
<!-- main JS -->
<script src="assets/js/main.js"></script>
</body>

</html>

You might also like