<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Your Name | Portfolio</title>
<link rel="stylesheet" href="../css/about.css">
</head>
<body>
<main class="portfolio">
<!-- Intro Section -->
<section class="portfolio__section portfolio__section--intro">
<div class="content">
<h1 class="intro-title">Hello, I'm <span class="highlight">Your Name</span></h1>
<p class="intro-subtitle">Job Title / Profession</p>
<div class="social-links">
<a href="#" target="_blank" class="social-link">LinkedIn</a>
<a href="#" target="_blank" class="social-link">GitHub</a>
<a href="#" target="_blank" class="social-link">Twitter</a>
</div>
</div>
<div class="bg-image" style="background-image: url('https://visme.co/blog/wp-content/uploads/2017/07/50-Beautiful-and-Minimalist-Presentation-Backgrounds-013.jpg')"></div>
</section>
<!-- About Section -->
<section class="portfolio__section">
<div class="content">
<h2 class="section-title">About Me</h2>
<div class="about-content">
<div class="about-text">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in dui mauris. Vivamus hendrerit arcu sed erat molestie vehicula.</p>
<p>Sed auctor neque eu tellus rhoncus ut eleifend nibh porttitor. Ut in nulla enim. Phasellus molestie magna non est bibendum non venenatis nisl tempor.</p>
</div>
<div class="about-image">
<img src="https://viewpointservices.com/wp-content/uploads/2019/07/GettyImages-1142192666-1.jpg" alt="Your Name">
</div>
</div>
</div>
<div class="bg-image" style="background-image: url('https://www.elegantthemes.com/blog/wp-content/uploads/2013/09/bg-1-full.jpg')"></div>
</section>
<!-- Experience Section -->
<section class="portfolio__section">
<div class="content">
<h2 class="section-title">Experience</h2>
<div class="timeline">
<div class="timeline-item">
<h3 class="timeline-title">Senior Developer</h3>
<p class="timeline-company">Tech Company Inc. (2020-Present)</p>
<p class="timeline-description">Lead developer for web applications.</p>
</div>
<div class="timeline-item">
<h3 class="timeline-title">Web Developer</h3>
<p class="timeline-company">Digital Agency (2017-2020)</p>
<p class="timeline-description">Front-end development and UX design.</p>
</div>
</div>
</div>
<div class="bg-image" style="background-image: url('https://wallpapers.com/images/hd/professional-zoom-background-3h69jq8rrky7f3tj.jpg')"></div>
</section>
<!-- Projects Section -->
<section class="portfolio__section">
<div class="content">
<h2 class="section-title">Projects</h2>
<div class="projects-grid">
<div class="project-card">
<h3 class="project-title">Project 1</h3>
<p class="project-description">Description of project and technologies used.</p>
<a href="#" class="project-link">View Project</a>
</div>
<div class="project-card">
<h3 class="project-title">Project 2</h3>
<p class="project-description">Description of project and technologies used.</p>
<a href="#" class="project-link">View Project</a>
</div>
</div>
</div>
<div class="bg-image" style="background-image: url('https://wallpapers.com/images/hd/integral-project-management-cover-erpo8ef1af3wuquu.jpg')"></div>
</section>
<!-- Contact/Footer Section -->
<section class="portfolio__section portfolio__section--footer">
<div class="content">
<h2 class="section-title">Get In Touch</h2>
<div class="contact-info">
<p>Email: <a href="mailto:you@example.com">you@example.com</a></p>
<p>Phone: (123) 456-7890</p>
</div>
<div class="footer-links">
<a href="#" class="footer-link">Resume (PDF)</a>
<a href="#" class="footer-link">GitHub</a>
<a href="#" class="footer-link">LinkedIn</a>
</div>
<p class="copyright">© 2023 Your Name. All rights reserved.</p>
</div>
</section>
</main>
<script src="../js/smoothscroll.js" defer></script>
</body>
</html>