Charakterbogen anpassen #7 (#9)

- Use of flexboxes in two columns for better display
- Introduction of item containers for the different storage of items

Co-authored-by: Ender <harald@drueppels.de>
Co-authored-by: Byroks <byroks@gmail.com>
Reviewed-on: Byroks/foundry-vtt-system-midgard5#9
Reviewed-by: Byroks <byroks@gmail.com>

source/style/Character-sheet.less

@@ -3,6 +3,37 @@
 @attributeBorderColor: rgba(0, 0, 0, 0.5);
 
 .midgard5 {
+	.flexbox {
+		display: flex;
+		flex-direction: row;
+		flex-wrap: wrap
+	}
+
+	.flexcolumn-2 {
+		flex: 50%;
+	}
+
+	.flexpart {
+		gap: 0;
+		padding: 0;
+		margin: 10px;
+		background-color: beige;
+		border: 2px solid black;
+	}
+
+	.flexpart-header {
+		font-weight: bold;
+		font-size: large;
+		text-align: center;
+		color: black;
+	}
+
+	.flexpart-icon {
+		height: 2rem;
+		float: left;
+		border: 0px solid transparent;
+	}
+
 	.flexrow {
 		align-items: center;
 	}
@@ -33,7 +64,7 @@
 
 		.profile-img {
 			max-width: 128px;
-			height: 160px;
+			height: 128px;
 			border: 0px solid black;
 		}
 
@@ -68,6 +99,7 @@
 
 	table {
 		background-color: beige;
+		border: 0px solid transparent;
 	}
 
 	td,
@@ -104,10 +136,16 @@
 			padding: 0.5rem 0.5rem 0.5rem 0.5rem;
 			text-align: left;
 			font-weight: bold;
-			background-color: dimgray;
 		}
 	}
 
+	.table-icon {
+		height: 1rem;
+		width: 1rem;
+		float: left;
+		border: 0px solid transparent;
+	}
+
 	input.skill {
 		width: 5rem;
 	}