Changing container layout, moving projects under the img

css/style.css

@@ -7,19 +7,12 @@ body {
 	font-family: Arial, sans-serif;
 }
 
-h1 {
-  	color: white;
-  	text-align: center;
-	margin: 2%;
-}
-
 .main_container {
 	display: flex;
 	flex-direction: row;
 	flex-wrap: nowrap;
 	margin-left: 12%;
 	margin-right: 4%;
-
 	/*border: 0.5px solid rgb(208, 160, 236);*/
 }
 
@@ -33,18 +26,16 @@ h1 {
 	flex-direction: column;
 	flex-wrap: wrap;
 	justify-content: flex-start;
-
-	/*border: 0.5px solid rgb(206, 138, 138);*/
+	border: 0.5px solid rgb(255, 255, 255);
 }
 
 .img_container {
 	margin: 3%;
 	min-height: 40%;
 	display: flex;
-	justify-content: center;
-	padding: 3%;
+	flex-direction: column;
 	align-items: flex-start;
-	/*border: 0.5px solid rgb(138, 206, 186);*/
+	border: 0.5px solid rgb(255, 255, 255);
 }
 
 /*Content Classes*/
@@ -53,15 +44,17 @@ h1 {
 	padding: 15px;
 	margin: 3%;
 	text-align: left;
-	border: 0.5px solid white;
 	border-radius: 0px;
 	color: white;
 	align-self: flex-start;
+	/*border: 0.5px solid white;*/
 }
 
 .main_img {
 	position: static;
-	width: 60%;
+	justify-self: center;
+	margin-left: 30%;
+	width: 45%;
   	height: auto;
 	border-radius: 70%;
 	object-fit: cover;
@@ -72,11 +65,12 @@ h1 {
 	order: 1;
 	padding: 2%;
 	margin: 3%;
+	margin-top: 5.5%;
 	text-align: left;
-	border: 0.5px solid white;
 	border-radius: 0px;
 	align-self: flex-start;
 	color: white;
+	/*border: 0.5px solid white;*/
 }
 
 .contacts {
@@ -84,8 +78,8 @@ h1 {
 	padding: 2%;
 	margin: 3%;
 	text-align: left;
-	border: 0.5px solid white;
 	border-radius: 0px;
 	align-self: flex-start;
 	color: white;
+	/*border: 0.5px solid white;*/
 }

index.html

@@ -12,21 +12,15 @@
 		<script src="https://keepandroidopen.org/banner.js?size=minimal&animation=off&hidebutton=off"> </script>
 	</div>
 
-	<h1>Moin / Hi</h1>
-
 	<div class="main_container">
 		<div class="text_container">
 			<div class="main_text">
-				<p>I'm BaumSplitter41, I'm am an IT student from germany.</p>
+				<p><strong>Moin / Hi,</strong></p>
+				<p> I'm BaumSplitter41, I'm am an IT student from germany.</p>
 				<p>This is my little personal website. I'm still working on this website. Feel free to contact me.</p>
 			</div>
 
-			<div class="projects">
-				<h2>Projects</h2>
-				<p>Little projects I worked on or currently working on.</p>
-				<p> <a target="_blank" rel="noopener noreferrer" style="color:#82A5D3; text-decoration: none;" href="https://github.com/baumsplitter41">• My git repositories</a></p>
-				<p> <a target="_blank" rel="noopener noreferrer" style="color:#82A5D3; text-decoration: none;" href="https://vicepd-fivem.de/">• VicePD Fivem Server</a></p>
-			</div>
+
 
 			<div class="contacts">
 				<h2>Contact</h2>
@@ -40,6 +34,13 @@
 
 		<div class="img_container">
 			<img src="/assets/Logo_BaumSplitter41.png" alt="Logo BaumSplitter41", class = "main_img">
+		
+			<div class="projects">
+				<h2>Projects</h2>
+				<p>Projects I worked on or currently working on.</p>
+				<p> <a target="_blank" rel="noopener noreferrer" style="color:#82A5D3; text-decoration: none;" href="https://github.com/baumsplitter41">• My git repositories</a></p>
+				<p> <a target="_blank" rel="noopener noreferrer" style="color:#82A5D3; text-decoration: none;" href="https://vicepd-fivem.de/">• VicePD Fivem Server</a></p>
+			</div>
 		</div>
 	</div>