Add margins around the page

svelte/src/home_page/HomePage.svelte

@@ -2,12 +2,11 @@
 import Footer from "../layout/Footer.svelte";
 import AddressReputation from "./AddressReputation.svelte";
 import FeatureTable from "./FeatureTable.svelte";
-import ForCreators from "./ForCreators.svelte";
 import OtherPlans from "./OtherPlans.svelte";
 import UploadWidget from "./UploadWidget.svelte";
 </script>
 
-<div id="page_content" class="page_content">
+<div class="page_content">
 	<header>
 		<div class="header_image_container"></div>
 	</header>
@@ -15,7 +14,9 @@ import UploadWidget from "./UploadWidget.svelte";
 	<AddressReputation/>
 
 	<UploadWidget></UploadWidget>
+</div>
 
+<div class="page_content">
 	<header>
 		<h1>What is pixeldrain?</h1>
 	</header>
@@ -43,6 +44,9 @@ import UploadWidget from "./UploadWidget.svelte";
 			registration page</a>. More about pixeldrain's features below.
 		</p>
 	</section>
+</div>
+
+<div class="page_content">
 	<header>
 		<h1 id="pro">Getting more out of pixeldrain</h1>
 	</header>
@@ -65,11 +69,23 @@ import UploadWidget from "./UploadWidget.svelte";
 		<br/>
 	</section>
 
-	<br/>
+</div>
+
+<div class="page_content">
 	<Footer></Footer>
 </div>
 
 <style>
+.page_content {
+	margin-top: 5px;
+	margin-bottom: 10px;
+}
+@media (max-width: 1100px) {
+	.page_content {
+		margin-top: 0;
+	}
+}
+
 .header_image_container {
 	margin: auto;
 	height: 200px;

svelte/src/user_file_manager/DirectoryElement.svelte

@@ -359,6 +359,7 @@ const node_click = (index) => {
 	background: var(--body_background);
 	min-width: 850px;
 	border-top-left-radius: 8px;
+	border-top-right-radius: 8px;
 	border-bottom: 1px solid var(--separator);
 }
 .sorter_button {
@@ -389,6 +390,7 @@ const node_click = (index) => {
 	overflow-x: auto;
 	background: var(--body_background);
 	border-bottom-left-radius: 8px;
+	border-bottom-right-radius: 8px;
 }
 #node_container {
 	display: block;

svelte/src/user_file_manager/FileManager.svelte

@@ -257,7 +257,7 @@ onMount(() => {
 
 <svelte:window on:keydown={keydown} on:hashchange={hashChange} />
 
-<div id="file_manager" class="file_manager">
+<div id="file_manager" class="file_manager page_margins">
 	<div id="nav_bar" class="nav_bar">
 		<button id="btn_menu" onclick="toggleMenu()"><i class="icon">menu</i></button>
 		<button on:click={toggleSelecting} id="btn_select" class:button_highlight={selecting}>
@@ -354,12 +354,14 @@ is collapsed */
 }
 
 #file_manager {
-	position:         absolute;
-	padding:          0;
-	width:            100%;
-	height:           100%;
-	display:          flex;
-	flex-direction:   column;
+	position: absolute;
+	padding: 0;
+	top: 0;
+	right: 0;
+	bottom: 0;
+	left: 0;
+	display: flex;
+	flex-direction: column;
 }
 .nav_bar {
 	flex-shrink: 0;