<html lang="en">

<meta charset="UTF-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Projects</title>

<link rel="stylesheet" href="./style.css">

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.min.css">

<link href="https://fonts.googleapis.com/css2?family=Grechen+Fuemen&display=swap" rel="stylesheet">

<link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;0,500;0,600;1,200&display=swap" rel="stylesheet">

<div class="container">

<header>

<nav>

<div class="logo">

<h1 class="animated infinite heartBeat">PROJECT HUB</h1>

</div>

<div class="menu">

<a href="./index.html">HOME</a>

<a href="./projects.html">PROJECTS</a>

<a href="">ABOUT</a>

<a href="">CONTACT</a>

</div>

</nav>

</header>

<section class="project_section">

<div class="card">

<div class="content">

<h2>01</h2>

<h3>Calculator</h3>

<p>This calculator app will be a great test of your CSS and JS skills especially. If you're wanting to practice using Grid, this challenge will be perfect for you!</p>

<span class="a1">HTML</span>

<span class="a2">CSS</span>

<span class="a3">JavaScript</span>

<a href="./calculator.html" target="_blank">Explore Now</a>

</div>

</div>

<div class="card">

<div class="content">

<h2>02</h2>

<h3>Todo List</h3>

<p>It's a list of tasks you need to complete, or things that you want to do. Most typically, they're organised in order of priority.</p>

<span class="a1">HTML</span>

<span class="a2">CSS</span>

<span class="a3">JavaScript</span>

<a href="./todo.html" target="_blank">Explore Now</a>

</div>

</div>

<div class="card">

<div class="content">

<h2>03</h2>

<h3>Clock</h3>

<p>A clock is a device used to measure, verify, keep, and indicate time. The clock is one of the oldest human inventions, meeting the need to measure intervals of time shorter than the natural units</p>

<span class="a1">HTML</span>

<span class="a2">CSS</span>

<span class="a3">JavaScript</span>

<a href="./clock.html" target="_blank">Explore Now</a>

</div>

</div>

<div class="card">

<div class="content">

<h2>04</h2>

<h3>Disney+ Hotstar Clone</h3>

<p>Disney+ Hotstar - Watch TV Shows, Movies, Specials, Live Cricket</p>

<span class="a1">HTML</span>

<span class="a2">CSS</span>

<span class="a3">JavaScript</span>

<a href="./hotstar.html" target="_blank">Explore Now</a>

</div>

</div>

</section>

</div>

<script type="text/javascript" src="vanilla-tilt.js"></script>

<script src="./projects.js"></script>