640 lines
34 KiB
HTML
640 lines
34 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta content="width=device-width, initial-scale=1.0" name="viewport">
|
|
|
|
<title>Laura Bootstrap Template - Index</title>
|
|
<meta content="" name="description">
|
|
<meta content="" name="keywords">
|
|
|
|
<!-- Favicons -->
|
|
<link href="assets/img/favicon.png" rel="icon">
|
|
<link href="assets/img/apple-touch-icon.png" rel="apple-touch-icon">
|
|
|
|
<!-- Google Fonts -->
|
|
<link
|
|
href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,500,500i,600,600i,700,700i|Satisfy"
|
|
rel="stylesheet">
|
|
|
|
<!-- Vendor CSS Files -->
|
|
<link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
|
|
<link href="assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
|
|
<link href="assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
|
|
<link href="assets/vendor/glightbox/css/glightbox.min.css" rel="stylesheet">
|
|
<link href="assets/vendor/swiper/swiper-bundle.min.css" rel="stylesheet">
|
|
|
|
<!-- Template Main CSS File -->
|
|
<link href="assets/css/style.css" rel="stylesheet">
|
|
|
|
<!-- =======================================================
|
|
* Template Name: Laura
|
|
* Updated: Jul 27 2023 with Bootstrap v5.3.1
|
|
* Template URL: https://bootstrapmade.com/laura-free-creative-bootstrap-theme/
|
|
* Author: BootstrapMade.com
|
|
* License: https://bootstrapmade.com/license/
|
|
======================================================== -->
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<!-- ======= Header ======= -->
|
|
<header id="header" class="fixed-top d-flex justify-content-center align-items-center header-transparent">
|
|
|
|
<nav id="navbar" class="navbar">
|
|
<ul>
|
|
<li><a class="nav-link scrollto active" href="#hero">Home</a></li>
|
|
<li><a class="nav-link scrollto" href="#about">About</a></li>
|
|
<li><a class="nav-link scrollto" href="#resume">Resume</a></li>
|
|
<li><a class="nav-link scrollto" href="#services">Services</a></li>
|
|
<li><a class="nav-link scrollto " href="#portfolio">Portfolio</a></li>
|
|
<li><a class="nav-link scrollto" href="#contact">Contact</a></li>
|
|
</ul>
|
|
<i class="bi bi-list mobile-nav-toggle"></i>
|
|
</nav><!-- .navbar -->
|
|
|
|
</header><!-- End Header -->
|
|
|
|
<!-- ======= Hero Section ======= -->
|
|
<section id="hero">
|
|
<div class="hero-container">
|
|
<h1>Arnaud Fauconnet</h1>
|
|
<h2>I'm a Computer Science student</h2>
|
|
<a href="#about" class="btn-scroll scrollto" title="Scroll Down"><i class="bx bx-chevron-down"></i></a>
|
|
</div>
|
|
</section><!-- End Hero -->
|
|
|
|
<main id="main">
|
|
|
|
<!-- ======= About Me Section ======= -->
|
|
<section id="about" class="about">
|
|
<div class="container">
|
|
|
|
<div class="section-title">
|
|
<span>About Me</span>
|
|
<h2>About Me</h2>
|
|
<p> Passionate about computer science and love to have lengthy conversations
|
|
about it.<br>
|
|
Autonomous but also capable of communicating and
|
|
handling people.<br>
|
|
Overall flexible, adaptable and always curious by new experiences.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div
|
|
class="image col-lg-4 d-flex align-items-stretch justify-content-center justify-content-lg-start">
|
|
</div>
|
|
<div class="content col-lg-8 ps-lg-4 d-flex flex-column align-items-stretch justify-content-center">
|
|
<div class="row">
|
|
<div class="col-lg-6">
|
|
<ul>
|
|
<li><i class="bi bi-chevron-right"></i>
|
|
<strong>Name:</strong>
|
|
<span>Arnaud Fauconnet</span>
|
|
</li>
|
|
<li><i class="bi bi-chevron-right"></i> <strong>Website:</strong>
|
|
<a href="https://karma-riuk.com">karma-riuk.com</a>
|
|
</li>
|
|
<li><i class="bi bi-chevron-right"></i>
|
|
<strong>City:</strong>
|
|
<span>Lugano, CH</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<ul>
|
|
<li><i class="bi bi-chevron-right"></i> <strong>Age:</strong> <span>23</span>
|
|
</li>
|
|
<li><i class="bi bi-chevron-right"></i> <strong>Degree:</strong> <span>Master in
|
|
Software and Data
|
|
Engineering </span>
|
|
</li>
|
|
<li><i class="bi bi-chevron-right"></i> <strong>Email:</strong>
|
|
<a
|
|
href="mailto:arnaud.fauconnet.pro@gmail.com">arnaud.fauconnet.pro@gmail.com</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<!-- End .content-->
|
|
|
|
<div class="skills-content ps-lg-4">
|
|
<div class="row">
|
|
<div class="progress col-6">
|
|
<span class="skill">Python <i class="val">95%</i></span>
|
|
<div class="progress-bar-wrap">
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="95"
|
|
aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
</div>
|
|
<div class="progress col-6">
|
|
<span class="skill">Java <i class="val">90%</i></span>
|
|
<div class="progress-bar-wrap">
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="90"
|
|
aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="progress col-6">
|
|
<span class="skill">C <i class="val">85%</i></span>
|
|
<div class="progress-bar-wrap">
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="85"
|
|
aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
</div>
|
|
<div class="progress col-6">
|
|
<span class="skill">C++ <i class="val">95%</i></span>
|
|
<div class="progress-bar-wrap">
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="95"
|
|
aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="progress col-6">
|
|
<span class="skill">HTML/CSS <i class="val">100%</i></span>
|
|
<div class="progress-bar-wrap">
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="100"
|
|
aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
</div>
|
|
<div class="progress col-6">
|
|
<span class="skill">Javscript / Typescript <i class="val">95%</i></span>
|
|
<div class="progress-bar-wrap">
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="95"
|
|
aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="progress col-6">
|
|
<span class="skill">Bash <i class="val">90%</i></span>
|
|
<div class="progress-bar-wrap">
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="90"
|
|
aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
</div>
|
|
<div class="progress col-6">
|
|
<span class="skill">Lua <i class="val">85%</i></span>
|
|
<div class="progress-bar-wrap">
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="85"
|
|
aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</section><!-- End About Me Section -->
|
|
|
|
<!-- ======= My Resume Section ======= -->
|
|
<section id="resume" class="resume">
|
|
<div class="container">
|
|
|
|
<div class="section-title">
|
|
<span>My Resume</span>
|
|
<h2>My Resume</h2>
|
|
<p>Sit sint consectetur velit quisquam cupiditate impedit suscipit alias</p>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-lg-6">
|
|
<h3 class="resume-title">Sumary</h3>
|
|
<div class="resume-item pb-0">
|
|
<h4>Alice Barkley</h4>
|
|
<p><em>Innovative and deadline-driven Graphic Designer with 3+ years of experience designing
|
|
and developing user-centered digital/print marketing material from initial concept
|
|
to final, polished deliverable.</em></p>
|
|
<p>
|
|
<ul>
|
|
<li>Portland par 127,Orlando, FL</li>
|
|
<li>(123) 456-7891</li>
|
|
<li>alice.barkley@example.com</li>
|
|
</ul>
|
|
</p>
|
|
</div>
|
|
|
|
<h3 class="resume-title">Education</h3>
|
|
<div class="resume-item">
|
|
<h4>Master of Fine Arts & Graphic Design</h4>
|
|
<h5>2015 - 2016</h5>
|
|
<p><em>Rochester Institute of Technology, Rochester, NY</em></p>
|
|
<p>Qui deserunt veniam. Et sed aliquam labore tempore sed quisquam iusto autem sit. Ea vero
|
|
voluptatum qui ut dignissimos deleniti nerada porti sand markend</p>
|
|
</div>
|
|
<div class="resume-item">
|
|
<h4>Bachelor of Fine Arts & Graphic Design</h4>
|
|
<h5>2010 - 2014</h5>
|
|
<p><em>Rochester Institute of Technology, Rochester, NY</em></p>
|
|
<p>Quia nobis sequi est occaecati aut. Repudiandae et iusto quae reiciendis et quis Eius vel
|
|
ratione eius unde vitae rerum voluptates asperiores voluptatem Earum molestiae
|
|
consequatur neque etlon sader mart dila</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<h3 class="resume-title">Professional Experience</h3>
|
|
<div class="resume-item">
|
|
<h4>Senior graphic design specialist</h4>
|
|
<h5>2019 - Present</h5>
|
|
<p><em>Experion, New York, NY </em></p>
|
|
<p>
|
|
<ul>
|
|
<li>Lead in the design, development, and implementation of the graphic, layout, and
|
|
production communication materials</li>
|
|
<li>Delegate tasks to the 7 members of the design team and provide counsel on all
|
|
aspects of the project. </li>
|
|
<li>Supervise the assessment of all graphic materials in order to ensure quality and
|
|
accuracy of the design</li>
|
|
<li>Oversee the efficient use of production project budgets ranging from $2,000 -
|
|
$25,000</li>
|
|
</ul>
|
|
</p>
|
|
</div>
|
|
<div class="resume-item">
|
|
<h4>Graphic design specialist</h4>
|
|
<h5>2017 - 2018</h5>
|
|
<p><em>Stepping Stone Advertising, New York, NY</em></p>
|
|
<p>
|
|
<ul>
|
|
<li>Developed numerous marketing programs (logos, brochures,infographics, presentations,
|
|
and advertisements).</li>
|
|
<li>Managed up to 5 projects or tasks at a given time while under pressure</li>
|
|
<li>Recommended and consulted with clients on the most appropriate graphic design</li>
|
|
<li>Created 4+ design presentations and proposals a month for clients and account
|
|
managers</li>
|
|
</ul>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</section><!-- End My Resume Section -->
|
|
|
|
<!-- ======= My Services Section ======= -->
|
|
<section id="services" class="services">
|
|
<div class="container">
|
|
|
|
<div class="section-title">
|
|
<span>My Services</span>
|
|
<h2>My Services</h2>
|
|
<p>Sit sint consectetur velit quisquam cupiditate impedit suscipit alias</p>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-md-6 col-lg-3 d-flex align-items-stretch mb-5 mb-lg-0">
|
|
<div class="icon-box">
|
|
<div class="icon"><i class="bx bxl-dribbble"></i></div>
|
|
<h4 class="title"><a href="">Lorem Ipsum</a></h4>
|
|
<p class="description">Voluptatum deleniti atque corrupti quos dolores et quas molestias
|
|
excepturi sint occaecati cupiditate non provident</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-6 col-lg-3 d-flex align-items-stretch mb-5 mb-lg-0">
|
|
<div class="icon-box">
|
|
<div class="icon"><i class="bx bx-file"></i></div>
|
|
<h4 class="title"><a href="">Sed ut perspiciatis</a></h4>
|
|
<p class="description">Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
|
|
dolore eu fugiat nulla pariatur</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-6 col-lg-3 d-flex align-items-stretch mb-5 mb-lg-0">
|
|
<div class="icon-box">
|
|
<div class="icon"><i class="bx bx-tachometer"></i></div>
|
|
<h4 class="title"><a href="">Magni Dolores</a></h4>
|
|
<p class="description">Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
|
|
officia deserunt mollit anim id est laborum</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-6 col-lg-3 d-flex align-items-stretch mb-5 mb-lg-0">
|
|
<div class="icon-box">
|
|
<div class="icon"><i class="bx bx-world"></i></div>
|
|
<h4 class="title"><a href="">Nemo Enim</a></h4>
|
|
<p class="description">At vero eos et accusamus et iusto odio dignissimos ducimus qui
|
|
blanditiis praesentium voluptatum deleniti atque</p>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</section><!-- End My Services Section -->
|
|
|
|
<!-- ======= Testimonials Section ======= -->
|
|
<section id="testimonials" class="testimonials">
|
|
<div class="container position-relative">
|
|
|
|
<div class="testimonials-slider swiper" data-aos="fade-up" data-aos-delay="100">
|
|
<div class="swiper-wrapper">
|
|
|
|
<div class="swiper-slide">
|
|
<div class="testimonial-item">
|
|
<img src="assets/img/testimonials/testimonials-1.jpg" class="testimonial-img" alt="">
|
|
<h3>Saul Goodman</h3>
|
|
<h4>Ceo & Founder</h4>
|
|
<p>
|
|
<i class="bx bxs-quote-alt-left quote-icon-left"></i>
|
|
Proin iaculis purus consequat sem cure digni ssim donec porttitora entum suscipit
|
|
rhoncus. Accusantium quam, ultricies eget id, aliquam eget nibh et. Maecen aliquam,
|
|
risus at semper.
|
|
<i class="bx bxs-quote-alt-right quote-icon-right"></i>
|
|
</p>
|
|
</div>
|
|
</div><!-- End testimonial item -->
|
|
|
|
<div class="swiper-slide">
|
|
<div class="testimonial-item">
|
|
<img src="assets/img/testimonials/testimonials-2.jpg" class="testimonial-img" alt="">
|
|
<h3>Sara Wilsson</h3>
|
|
<h4>Designer</h4>
|
|
<p>
|
|
<i class="bx bxs-quote-alt-left quote-icon-left"></i>
|
|
Export tempor illum tamen malis malis eram quae irure esse labore quem cillum quid
|
|
cillum eram malis quorum velit fore eram velit sunt aliqua noster fugiat irure amet
|
|
legam anim culpa.
|
|
<i class="bx bxs-quote-alt-right quote-icon-right"></i>
|
|
</p>
|
|
</div>
|
|
</div><!-- End testimonial item -->
|
|
|
|
<div class="swiper-slide">
|
|
<div class="testimonial-item">
|
|
<img src="assets/img/testimonials/testimonials-3.jpg" class="testimonial-img" alt="">
|
|
<h3>Jena Karlis</h3>
|
|
<h4>Store Owner</h4>
|
|
<p>
|
|
<i class="bx bxs-quote-alt-left quote-icon-left"></i>
|
|
Enim nisi quem export duis labore cillum quae magna enim sint quorum nulla quem
|
|
veniam duis minim tempor labore quem eram duis noster aute amet eram fore quis sint
|
|
minim.
|
|
<i class="bx bxs-quote-alt-right quote-icon-right"></i>
|
|
</p>
|
|
</div>
|
|
</div><!-- End testimonial item -->
|
|
|
|
<div class="swiper-slide">
|
|
<div class="testimonial-item">
|
|
<img src="assets/img/testimonials/testimonials-4.jpg" class="testimonial-img" alt="">
|
|
<h3>Matt Brandon</h3>
|
|
<h4>Freelancer</h4>
|
|
<p>
|
|
<i class="bx bxs-quote-alt-left quote-icon-left"></i>
|
|
Fugiat enim eram quae cillum dolore dolor amet nulla culpa multos export minim
|
|
fugiat minim velit minim dolor enim duis veniam ipsum anim magna sunt elit fore quem
|
|
dolore labore illum veniam.
|
|
<i class="bx bxs-quote-alt-right quote-icon-right"></i>
|
|
</p>
|
|
</div>
|
|
</div><!-- End testimonial item -->
|
|
|
|
<div class="swiper-slide">
|
|
<div class="testimonial-item">
|
|
<img src="assets/img/testimonials/testimonials-5.jpg" class="testimonial-img" alt="">
|
|
<h3>John Larson</h3>
|
|
<h4>Entrepreneur</h4>
|
|
<p>
|
|
<i class="bx bxs-quote-alt-left quote-icon-left"></i>
|
|
Quis quorum aliqua sint quem legam fore sunt eram irure aliqua veniam tempor noster
|
|
veniam enim culpa labore duis sunt culpa nulla illum cillum fugiat legam esse veniam
|
|
culpa fore nisi cillum quid.
|
|
<i class="bx bxs-quote-alt-right quote-icon-right"></i>
|
|
</p>
|
|
</div>
|
|
</div><!-- End testimonial item -->
|
|
|
|
</div>
|
|
<div class="swiper-pagination"></div>
|
|
</div>
|
|
|
|
</div>
|
|
</section><!-- End Testimonials Section -->
|
|
|
|
<!-- ======= My Portfolio Section ======= -->
|
|
<section id="portfolio" class="portfolio">
|
|
<div class="container">
|
|
|
|
<div class="section-title">
|
|
<span>My Portfolio</span>
|
|
<h2>My Portfolio</h2>
|
|
<p>Sit sint consectetur velit quisquam cupiditate impedit suscipit alias</p>
|
|
</div>
|
|
|
|
<ul id="portfolio-flters" class="d-flex justify-content-center">
|
|
<li data-filter="*" class="filter-active">All</li>
|
|
<li data-filter=".filter-app">App</li>
|
|
<li data-filter=".filter-card">Card</li>
|
|
<li data-filter=".filter-web">Web</li>
|
|
</ul>
|
|
|
|
<div class="row portfolio-container">
|
|
|
|
<div class="col-lg-4 col-md-6 portfolio-item filter-app">
|
|
<div class="portfolio-img"><img src="assets/img/portfolio/portfolio-1.jpg" class="img-fluid"
|
|
alt=""></div>
|
|
<div class="portfolio-info">
|
|
<h4>App 1</h4>
|
|
<p>App</p>
|
|
<a href="assets/img/portfolio/portfolio-1.jpg" data-gallery="portfolioGallery"
|
|
class="portfolio-lightbox preview-link" title="App 1"><i class="bx bx-plus"></i></a>
|
|
<a href="portfolio-details.html" class="details-link" title="More Details"><i
|
|
class="bx bx-link"></i></a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-4 col-md-6 portfolio-item filter-web">
|
|
<div class="portfolio-img"><img src="assets/img/portfolio/portfolio-2.jpg" class="img-fluid"
|
|
alt=""></div>
|
|
<div class="portfolio-info">
|
|
<h4>Web 3</h4>
|
|
<p>Web</p>
|
|
<a href="assets/img/portfolio/portfolio-2.jpg" data-gallery="portfolioGallery"
|
|
class="portfolio-lightbox preview-link" title="Web 3"><i class="bx bx-plus"></i></a>
|
|
<a href="portfolio-details.html" class="details-link" title="More Details"><i
|
|
class="bx bx-link"></i></a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-4 col-md-6 portfolio-item filter-app">
|
|
<div class="portfolio-img"><img src="assets/img/portfolio/portfolio-3.jpg" class="img-fluid"
|
|
alt=""></div>
|
|
<div class="portfolio-info">
|
|
<h4>App 2</h4>
|
|
<p>App</p>
|
|
<a href="assets/img/portfolio/portfolio-3.jpg" data-gallery="portfolioGallery"
|
|
class="portfolio-lightbox preview-link" title="App 2"><i class="bx bx-plus"></i></a>
|
|
<a href="portfolio-details.html" class="details-link" title="More Details"><i
|
|
class="bx bx-link"></i></a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-4 col-md-6 portfolio-item filter-card">
|
|
<div class="portfolio-img"><img src="assets/img/portfolio/portfolio-4.jpg" class="img-fluid"
|
|
alt=""></div>
|
|
<div class="portfolio-info">
|
|
<h4>Card 2</h4>
|
|
<p>Card</p>
|
|
<a href="assets/img/portfolio/portfolio-4.jpg" data-gallery="portfolioGallery"
|
|
class="portfolio-lightbox preview-link" title="Card 2"><i class="bx bx-plus"></i></a>
|
|
<a href="portfolio-details.html" class="details-link" title="More Details"><i
|
|
class="bx bx-link"></i></a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-4 col-md-6 portfolio-item filter-web">
|
|
<div class="portfolio-img"><img src="assets/img/portfolio/portfolio-5.jpg" class="img-fluid"
|
|
alt=""></div>
|
|
<div class="portfolio-info">
|
|
<h4>Web 2</h4>
|
|
<p>Web</p>
|
|
<a href="assets/img/portfolio/portfolio-5.jpg" data-gallery="portfolioGallery"
|
|
class="portfolio-lightbox preview-link" title="Web 2"><i class="bx bx-plus"></i></a>
|
|
<a href="portfolio-details.html" class="details-link" title="More Details"><i
|
|
class="bx bx-link"></i></a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-4 col-md-6 portfolio-item filter-app">
|
|
<div class="portfolio-img"><img src="assets/img/portfolio/portfolio-6.jpg" class="img-fluid"
|
|
alt=""></div>
|
|
<div class="portfolio-info">
|
|
<h4>App 3</h4>
|
|
<p>App</p>
|
|
<a href="assets/img/portfolio/portfolio-6.jpg" data-gallery="portfolioGallery"
|
|
class="portfolio-lightbox preview-link" title="App 3"><i class="bx bx-plus"></i></a>
|
|
<a href="portfolio-details.html" class="details-link" title="More Details"><i
|
|
class="bx bx-link"></i></a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-4 col-md-6 portfolio-item filter-card">
|
|
<div class="portfolio-img"><img src="assets/img/portfolio/portfolio-7.jpg" class="img-fluid"
|
|
alt=""></div>
|
|
<div class="portfolio-info">
|
|
<h4>Card 1</h4>
|
|
<p>Card</p>
|
|
<a href="assets/img/portfolio/portfolio-7.jpg" data-gallery="portfolioGallery"
|
|
class="portfolio-lightbox preview-link" title="Card 1"><i class="bx bx-plus"></i></a>
|
|
<a href="portfolio-details.html" class="details-link" title="More Details"><i
|
|
class="bx bx-link"></i></a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-4 col-md-6 portfolio-item filter-card">
|
|
<div class="portfolio-img"><img src="assets/img/portfolio/portfolio-8.jpg" class="img-fluid"
|
|
alt=""></div>
|
|
<div class="portfolio-info">
|
|
<h4>Card 3</h4>
|
|
<p>Card</p>
|
|
<a href="assets/img/portfolio/portfolio-8.jpg" data-gallery="portfolioGallery"
|
|
class="portfolio-lightbox preview-link" title="Card 3"><i class="bx bx-plus"></i></a>
|
|
<a href="portfolio-details.html" class="details-link" title="More Details"><i
|
|
class="bx bx-link"></i></a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-4 col-md-6 portfolio-item filter-web">
|
|
<div class="portfolio-img"><img src="assets/img/portfolio/portfolio-9.jpg" class="img-fluid"
|
|
alt=""></div>
|
|
<div class="portfolio-info">
|
|
<h4>Web 3</h4>
|
|
<p>Web</p>
|
|
<a href="assets/img/portfolio/portfolio-9.jpg" data-gallery="portfolioGallery"
|
|
class="portfolio-lightbox preview-link" title="Web 3"><i class="bx bx-plus"></i></a>
|
|
<a href="portfolio-details.html" class="details-link" title="More Details"><i
|
|
class="bx bx-link"></i></a>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</section><!-- End My Portfolio Section -->
|
|
|
|
<!-- ======= Contact Me Section ======= -->
|
|
<section id="contact" class="contact">
|
|
<div class="container">
|
|
|
|
<div class="section-title">
|
|
<span>Contact Me</span>
|
|
<h2>Contact Me</h2>
|
|
<p>Sit sint consectetur velit quisquam cupiditate impedit suscipit alias</p>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<div class="email info-box h-100 d-flex flex-column
|
|
justify-content-around">
|
|
<i><i class="bx bx-envelope"></i></i>
|
|
<h3>Email Me</h3>
|
|
<a href="mailto:arnaud.fauconnet.pro@gmail.com">arnaud.fauconnet.pro@gmail.com</a>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="info-box">
|
|
<i class="bx bx-share-alt"></i>
|
|
<h3>Social Profiles</h3>
|
|
<div class="social-links">
|
|
<a href="#" class="github"><i class="bi bi-github"></i></a>
|
|
<a href="#" class="instagram"><i class="bi bi-instagram"></i></a>
|
|
<a href="#" class="linkedin"><i class="bi bi-linkedin"></i></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</section><!-- End Contact Me Section -->
|
|
|
|
</main><!-- End #main -->
|
|
|
|
<!-- ======= Footer ======= -->
|
|
<footer id="footer">
|
|
<div class="container">
|
|
<h3>Arnaud Fauconnet</h3>
|
|
<p>Thanks a lot for visiting my website, I hope you learned a little
|
|
bit about who I am and what I am capable of.</p>
|
|
<div class="social-links">
|
|
<a href="#" class="github"><i class="bx bxl-github"></i></a>
|
|
<a href="#" class="instagram"><i class="bx bxl-instagram"></i></a>
|
|
<a href="#" class="linkedin"><i class="bx bxl-linkedin"></i></a>
|
|
</div>
|
|
<div class="copyright">
|
|
© Copyright <strong><span>Laura</span></strong>. All Rights Reserved
|
|
</div>
|
|
<div class="credits">
|
|
<!-- All the links in the footer should remain intact. -->
|
|
<!-- You can delete the links only if you purchased the pro version. -->
|
|
<!-- Licensing information: https://bootstrapmade.com/license/ -->
|
|
<!-- Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/laura-free-creative-bootstrap-theme/ -->
|
|
Designed by <a href="https://bootstrapmade.com/">BootstrapMade</a>
|
|
</div>
|
|
</div>
|
|
</footer><!-- End Footer -->
|
|
|
|
<a href="#" class="back-to-top d-flex align-items-center justify-content-center"><i
|
|
class="bi bi-arrow-up-short"></i></a>
|
|
|
|
<!-- Vendor JS Files -->
|
|
<script src="assets/vendor/purecounter/purecounter_vanilla.js"></script>
|
|
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
|
|
<script src="assets/vendor/glightbox/js/glightbox.min.js"></script>
|
|
<script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
|
|
<script src="assets/vendor/swiper/swiper-bundle.min.js"></script>
|
|
<script src="assets/vendor/waypoints/noframework.waypoints.js"></script>
|
|
<script src="assets/vendor/php-email-form/validate.js"></script>
|
|
|
|
<!-- Template Main JS File -->
|
|
<script src="assets/js/main.js"></script>
|
|
|
|
</body>
|
|
|
|
</html>
|