From 2bdebab471acc53a0c0325ab83c8a4b8154cf1c8 Mon Sep 17 00:00:00 2001
From: Addechander <40864924+Addechander@users.noreply.github.com>
Date: Thu, 25 Jul 2024 22:11:33 +0545
Subject: [PATCH] Education Section

---
 assets/css/main.css | 33 ++++++++++++++------
 index.html          | 76 +++++++++++++++++++++++++++------------------
 2 files changed, 68 insertions(+), 41 deletions(-)

diff --git a/assets/css/main.css b/assets/css/main.css
index 7d14ea5..3d4f5cf 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -1672,7 +1672,7 @@ input, select, textarea {
 		-moz-transition: background-color .2s ease-in-out;
 		-webkit-transition: background-color .2s ease-in-out;
 		-ms-transition: background-color .2s ease-in-out;
-		transition: background-color .2s ease-in-out;
+		transition: box-shadow 0.3s ease-in-out, background-color 0.3s ease-in-out, transform 0.3s ease-in-out, color 0.3s ease-in-out;
 		-webkit-appearance: none;
 		position: relative;
 		display: inline-block;
@@ -1744,6 +1744,10 @@ input, select, textarea {
 			.button.alt:active {
 				background-color: #3f3f3f;
 			}
+		
+	.button:hover {
+		transform: translateY(-5px);
+	}
 
 /* List */
 
@@ -1889,7 +1893,7 @@ input, select, textarea {
 				}
 
 					ul.social li a:hover:before {
-						background-color: #3BA8D3;
+						background-color: #43B3E0;
 					}
 
 /* Actions */
@@ -1917,7 +1921,7 @@ input, select, textarea {
 		text-align: center;
 		height: 500px; /* Set a fixed height */
 		padding: 2em;
-		transition: box-shadow 0.1s ease-in-out, background-color 0.1s ease-in-out, transform 0.1s ease-in-out, color 0.1s ease-in-out;
+		transition: box-shadow 0.3s ease-in-out, background-color 0.3s ease-in-out, transform 0.3s ease-in-out, color 0.3s ease-in-out;
 		color: inherit;
 		color: #000000 !important;
 		border: 6px solid #000000;
@@ -1934,7 +1938,6 @@ input, select, textarea {
 			box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.25), 0px 4px 6px 0px rgba(0, 0, 0, 0.2);
 			background-color: #3BA8D3;
 			transform: translateY(-5px);
-			color: #fff; /* Change color on hover */
 	}
 
 		.box.style1 {
@@ -1964,7 +1967,6 @@ input, select, textarea {
 		}
 
 
-
 /* Icons */
 
 	.icon {
@@ -2172,6 +2174,7 @@ input, select, textarea {
 		max-width: 800px;
 		margin: 0 auto;
 		padding: 2em 0;
+		transition: box-shadow 0.4s ease-in-out, background-color 0.4s ease-in-out, transform 0.4s ease-in-out, color 0.4s ease-in-out;
 	}
 
 	.timeline::after {
@@ -2189,7 +2192,7 @@ input, select, textarea {
 		padding: 10px 40px;
 		position: relative;
 		background: #fff;
-		border-radius: 6px;
+		border-radius: 10px;
 		width: 50%;
 		box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.1);
 	}
@@ -2199,8 +2202,8 @@ input, select, textarea {
 		position: absolute;
 		width: 25px;
 		height: 25px;
-		right: -17px;
-		background-color: white;
+		right: -27px;
+		background-color: rgb(255, 255, 255);
 		border: 5px solid #000000;
 		top: 15px;
 		border-radius: 50%;
@@ -2216,12 +2219,12 @@ input, select, textarea {
 	}
 
 	.timeline-item:nth-child(even)::after {
-		left: -16px;
+		left: -27px;
 	}
 
 	.timeline-content {
 		padding: 20px 30px;
-		background: #fff;
+		background: #ffffff;
 		position: relative;
 		border-radius: 6px;
 	}
@@ -2241,6 +2244,16 @@ input, select, textarea {
 		color: #000000;
 	}
 
+	.timeline-item:hover {
+		background: #ffffff;
+		transform: translateY(-5px);
+		}
+
+
+	
+
+
+
 /* Copyright */
 
 	#copyright {
diff --git a/index.html b/index.html
index 217dd07..9ce04e4 100644
--- a/index.html
+++ b/index.html
@@ -41,48 +41,54 @@ <h1>Hey, I'm <strong>Prateek Chand</strong>.</h1>
 		</article>
 
 		<!-- About -->
-		<article id="about" class="wrapper style1">
-			<div class="container">
+		<div style="height: 100px;"></div> 
+		<div class="container" class="wrapper style1">
+			<!-- About Section -->
+			<article id="about">
 				<div class="row">
 					<div class="col-4 col-5-large col-12-medium">
 						<span class="image fit"><img src="images/personal.jpeg" alt="" /></span>
 					</div>
-					<div class="col-8 col-7-large col-12-medium">
+					<div class="col-8 col-5-large col-12-medium">
 						<header>
-							<h2>About Me</h2>
+							<h2 style="position: relative; right: -40%;">About Me</h2>
 						</header>
-						<p style="font-size: 19px">I'm an incoming Computer Science freshman at the University of Wisconsin - Madison. Having worked on diverse projects and conducted independent research into the interdisciplinary applications of Machine Learning, I am eager to apply this expertise to tackle pressing societal and environmental challenges that our community faces today.</p>					
-						<a href="Files/CV.pdf" class="button small scrolly" download="Prateek_Chand_Resume"> Resume</a>
+						<p style="font-size: 19px">I'm an incoming Computer Science freshman at the University of Wisconsin - Madison. Having worked on diverse projects and conducted independent research into the interdisciplinary applications of Machine Learning, I am eager to apply this expertise to tackle pressing societal and environmental challenges that our community faces today.</p>                    
+						<a href="Files/CV.pdf" class="button small scrolly" download="Prateek_Chand_Resume" style="position: relative; right: -40%;"> Resume</a>
 					</div>
 				</div>
-			</div>
-		</article>
-		
-		<!-- Education -->
-		<article id="education" class="wrapper style1">
-			<div class="container" style="text-align: left;">
-				<header>
-					<h2>Education</h2>
-				</header>
-				<div class="timeline">
-					<div class="timeline-item">
-						<div class="timeline-content">
-							<h3>University of Wisconsin - Madison</h3>
-							<span>2024 - Present</span>
-							<p>Bachelor of Science in Computer Science</p>
-						</div>
-					</div>
-					<div class="timeline-item">
-						<div class="timeline-content">
-							<h3>St.Xavier's College</h3>
-							<span>2020 - 2022</span>
-							<p>Cambridge International A Level (High School Diploma)</p>
+			</article>
+			<!-- Spacer -->
+			<div style="height: 50px;"></div> <!-- Adjust the height as needed -->
+			<!-- Education Section -->
+			<article id="education">
+				<div class="row">
+					<div class="col-12">
+						<header>
+							<h2 style="position: relative; right: -43%;">Education</h2>
+						</header>
+						<div class="timeline">
+							<div class="timeline-item">
+								<div class="timeline-content">
+									<h3>University of Wisconsin - Madison</h3>
+									<span>2024 - Present</span>
+									<p>Bachelor of Science in Computer Science</p>
+								</div>
+							</div>
+							<div class="timeline-item">
+								<div class="timeline-content">
+									<h3>St.Xavier's College</h3>
+									<span>2020 - 2022</span>
+									<p>Cambridge International A Level (High School Diploma)</p>
+								</div>
+							</div>
 						</div>
 					</div>
 				</div>
-			</div>
-		</article>
-
+			</article>
+			<!-- Additional Spacer if Needed -->
+			<div style="height: 50px;"></div> <!-- Adjust the height as needed -->
+		</div>
 
 		<!-- Portfolio -->
 		<article id="portfolio" class="wrapper style3">
@@ -90,6 +96,7 @@ <h3>St.Xavier's College</h3>
 				<header>
 					<h2>My Recent Projects...</h2>
 				</header>
+				<div style="height: 50px;"></div> 
 				<div class="row">
 					<div class="col-4 col-6-medium col-12-small">
 						<a href="https://github.com/Addechander/Exploratory-Data-Analysis" class="box-link"></a>
@@ -179,9 +186,16 @@ <h3>Find me on ...</h3>
 							</ul>
 							<hr />
 						</div>
+
+						<footer>
+							<ul id="copyright">
+								<li>&copy; Prateek Chand. All rights reserved.</li>
+							</ul>
+						</footer>
 				</div>
 			</div>
 		</article>
+
 	</div>
 		<!-- Scripts -->
 			<script src="assets/js/jquery.min.js"></script>