Lebenslauf ergänzt

assets/css/main.css

@@ -1398,7 +1398,7 @@ body.is-preload #bg:before {
 	position: relative;
 	min-height: 100vh;
 	width: 100%;
-	padding: 4rem 2rem;
+	padding: 2rem 1rem;
 	z-index: 3;
 }
 
@@ -1740,7 +1740,7 @@ body.is-preload #header .content .inner {
 	transition: opacity 0.325s ease-in-out, transform 0.325s ease-in-out;
 	padding: 4.5rem 2.5rem 1.5rem 2.5rem;
 	position: relative;
-	width: 40rem;
+	width: 60rem;
 	max-width: 100%;
 	background-color: rgba(27, 31, 34, 0.85);
 	border-radius: 4px;
@@ -1855,6 +1855,29 @@ body.is-preload #header .content .inner {
 	border-radius: 6px;
 }
 
+.timeline-content-title-container {
+	display: flex;
+	flex-direction: row;
+	justify-content: space-between;
+	flex-wrap: nowrap;
+	gap: 8%;
+}
+
+.timeline-content-title-container h4 {
+	margin-bottom: .8rem;
+}
+
+.timeline-content-title-container h5 {
+	text-align: end;
+	min-width: fit-content;
+	color: #e7cf6e;
+}
+
+#techstack {
+	opacity: 50%;
+	margin: 0;
+}
+
 @media screen and (min-width: 768px) {
 	.timeline {
 		display: grid;
@@ -1871,7 +1894,7 @@ body.is-preload #header .content .inner {
 		-moz-border-radius: 25px;
 		-ms-border-radius: 25px;
 		-o-border-radius: 25px;
-}
+	}
 
 	.main-middle {
 		opacity: 0;

index.html

@@ -71,16 +71,30 @@ <h2 class="major">Lebenslauf</h2>
 							<div class="timeline-circle"></div>
 						</div>
 						<div class="timeline-content">
-							<h3>HTML</h3>
-							<p>Some Text</p>
+							<div class="timeline-content-title-container">
+								<h4>Ausbildung: <br>Fachinformatiker Anwendungsentwickler</h4>
+								<h5>Aug. 2021 <br>‑ Jun. 2024</h5>
+							</div>
+							<h5>SP_Data GmbH & Co. KG</h5>
+							<p>Zuständig für die Pflege und Weiterentwicklung der Personalabrechnungssoftware
+								mit einem Fokus auf der Umsetzung gesetzlicher Änderungen.</p>
+							<p id="techstack">Techstack: Delphi, MSSQL, Scrum, TortoiseSVN</p>
 						</div>
 
 						<div class="timeline-middle">
 							<div class="timeline-circle"></div>
 						</div>
 						<div class="timeline-content">
-							<h3>CSS</h3>
-							<p>Some Text.</p>
+							<div class="timeline-content-title-container">
+								<h4>Allgemeine Hochschulreife:<br>Schwerpunkt Informatik</h4>
+								<h5>Aug. 2018 <br>‑ Jul. 2021</h5>
+							</div>
+							<h5>August Griese Berufskolleg</h5>
+							<p>Abitur mit Schwerpunkt auf Informatik, einschließlich vertiefter Kenntnisse in Fächern
+								wie: <br>
+								Informatik, Technische Informatik (Datenbanken, Betriebssysteme/Netzwerke,
+								Mikrocontroller) und Elektrotechnik.</p>
+							<p id="techstack">Techstack: Java, Python, C++, MySQL(MariaDB)</p>
 						</div>
 
 						<div class="timeline-middle">