Change 'About' section animation

index.html

@@ -109,18 +109,18 @@ <h1 id="colorlib-logo"><a href="index.html">Daley Mottley</a></h1>
 					<div class="colorlib-narrow-content">
 						<div class="row">
 							<div class="col-md-12">
-								<div class="row row-bottom-padded-sm animate-box" data-animate-effect="fadeIn">
+								<div class="row row-bottom-padded-sm z">
 									<div class="col-md-12">
 										<div class="about-desc">
-											<span class="heading-meta">About Me</span>
-											<h2 class="colorlib-heading">Who Am I?</h2>
+											<span class="heading-meta animate-box" data-animate-effect="fadeInLeft">About Me</span>
+											<h2 class="colorlib-heading animate-box" data-animate-effect="fadeInLeft">Who Am I?</h2>
 
-											<div class="author-img visible-xs-block hidden-sm hidden-md hidden-lg"
+											<div class="author-img visible-xs-block hidden-sm hidden-md hidden-lg animate-box" data-animate-effect="fadeIn"
 												style="background-image: url(https://res.cloudinary.com/dzpafdvkm/image/upload/v1719909061/Portfolio/profile-pic.png);">
 											</div>
 
 
-											<p><strong>Hi, I'm Daley Mottley</strong> and welcome to my corner of the
+											<p class="animate-box" data-animate-effect="fadeInLeft"> <strong>Hi, I'm Daley Mottley</strong> and welcome to my corner of the
 												web! I'm an A.I. Consultant and Full-Stack Web Developer, proudly based
 												in the
 												beautiful island of Barbados. With a Bachelor of Applied Science
@@ -130,7 +130,7 @@ <h2 class="colorlib-heading">Who Am I?</h2>
 												performance and efficiency.
 											</p>
 
-											<p>
+											<p class="animate-box" data-animate-effect="fadeIn">
 												My mission is to empower companies and entrepreneurs by creating custom
 												applications and intelligent
 												solutions that streamline operations and boost efficiency. I’m
@@ -933,16 +933,36 @@ <h3>Dessert Shop Website </h3>
 										</div>
 									</div>
 								</article>
-
 							</div>
 
-							<!--
-							<div class="hidden card-project-container col-md-12 animate-box" data-animate-effect="fadeInLeft"
-								data-category="Web Development">
+		<!--					<div class="card-project-container col-md-12 animate-box"
+								data-animate-effect="fadeInLeft" data-category="Web Development">
 								<article class="cardProject cardProject--reverse"><img src="">
 									<div class="cardProject__information">
 										<h3>YouTube Thumbnail Extractor </h3>
 										<p>
+										The YouTube Thumbnail Extractor is a user-friendly tool designed to extract thumbnails from YouTube videos quickly and efficiently. By simply entering the video URL, users can download high-quality thumbnails in various resolutions to suit their needs. This tool streamlines the process of obtaining video thumbnails for purposes such as social media sharing, presentations, and content creation, enhancing productivity and ease of use.
+
+
+</p>
+										<div class="cardProject_skills">
+											<div class="cardSkill"><span>VueJS</span></div>
+											<div class="cardSkill"><span>NodeJS</span></div>
+
+										</div>
+										<div class="cardProject_links">
+
+										</div>
+									</div>
+								</article>
+							</div>
+
+							<div class="card-project-container col-md-12 animate-box"
+								data-animate-effect="fadeInLeft" data-category="Web Development">
+								<article class="cardProject cardProject--reverse"><img src="">
+									<div class="cardProject__information">
+										<h3>PDF Data Extractor </h3>
+										<p>
 										</p>
 										<div class="cardProject_skills">
 											<div class="cardSkill"><span>VueJS</span></div>
@@ -958,11 +978,11 @@ <h3>YouTube Thumbnail Extractor </h3>
 
 							</div>
 
-							<div class="hidden card-project-container col-md-12 animate-box" data-animate-effect="fadeInLeft"
-								data-category="Web Development">
+							<div class="card-project-container col-md-12 animate-box"
+								data-animate-effect="fadeInLeft" data-category="Web Development">
 								<article class="cardProject cardProject--reverse"><img src="">
 									<div class="cardProject__information">
-										<h3>PDF Data Extractor </h3>
+										<h3>cord Bot </h3>
 										<p>
 										</p>
 										<div class="cardProject_skills">
@@ -980,8 +1000,8 @@ <h3>PDF Data Extractor </h3>
 							</div>
 
 
-							<div class="hidden card-project-container col-md-12 animate-box" data-animate-effect="fadeInLeft"
-								data-category="Web Development">
+							<div class="card-project-container col-md-12 animate-box"
+								data-animate-effect="fadeInLeft" data-category="Web Development">
 								<article class="cardProject cardProject--reverse"><img src="">
 									<div class="cardProject__information">
 										<h3>Email to Google Sheets </h3>
@@ -1001,8 +1021,29 @@ <h3>Email to Google Sheets </h3>
 
 							</div>
 
-							<div class="hidden card-project-container col-md-12 animate-box" data-animate-effect="fadeInLeft"
-								data-category="Web Development">
+							<div class="card-project-container col-md-12 animate-box"
+								data-animate-effect="fadeInLeft" data-category="Web Development">
+								<article class="cardProject cardProject--reverse"><img src="">
+									<div class="cardProject__information">
+										<h3>YouTube To Google Drive Uploader </h3>
+										<p>
+										The YouTube to Google Drive Uploader is an efficient application that enables users to download YouTube videos or playlists and directly upload them to their Google Drive. Leveraging the Google Drive API for seamless file uploads, this tool offers features such as Google Sign-In for secure authentication, support for downloading individual videos or entire playlists, and automatic organization of videos into a 'Youtube Videos' folder with subdirectories for playlists. This application simplifies the process of managing and storing YouTube content in Google Drive.</p>
+										<div class="cardProject_skills">
+											<div class="cardSkill"><span>VueJS</span></div>
+											<div class="cardSkill"><span>NodeJS</span></div>
+
+										</div>
+										<div class="cardProject_links">
+
+										</div>
+									</div>
+								</article>
+
+
+							</div>
+
+							<div class="card-project-container col-md-12 animate-box"
+								data-animate-effect="fadeInLeft" data-category="Web Development">
 								<article class="cardProject cardProject--reverse"><img src="">
 									<div class="cardProject__information">
 										<h3>Voice Agent </h3>
@@ -1021,7 +1062,7 @@ <h3>Voice Agent </h3>
 
 							</div>
 
-							-->
+-->
 							<div class="card-project-container col-md-12 animate-box" data-animate-effect="fadeInLeft"
 								data-category="Web Development">
 								<article class="cardProject cardProject--reverse"><img