fixing the flex behavior of the containers

css/style.css

@@ -10,16 +10,17 @@ body {
 .main_container {
 	display: flex;
 	flex-direction: row;
-	flex-wrap: nowrap;
-	margin-left: 7%;
-	margin-right: 9%;
+	flex-wrap: wrap;
+	margin-left: 3%;
+	margin-right: 3%;
+	gap: 2%;
 	/*border: 0.5px solid rgb(208, 160, 236);*/
 }
 
 /*Container*/
 .text_container {
 	position: relative; 
-  	width: 90%;
+  	width: 42%;
   	min-height: 70%;
 	margin: 3%;
 	display: flex;
@@ -32,6 +33,7 @@ body {
 .img_container {
 	margin: 3%;
 	min-height: 40%;
+	width: 42%;
 	display: flex;
 	flex-direction: column;
 	align-items: flex-start;