Continued work on the UI

public/css/style.css

@@ -32,7 +32,7 @@ div#middle_section {
 
 /* Center section */
 #search > input#searchbar{
-	width: calc(100% - 16px);
+	width: calc(100% - 32px);
 	height: 32px;
 	padding: 0px 8px;
 	margin: 8px;
@@ -45,6 +45,7 @@ div#middle_section {
 	width: 100%;
 	height: calc(100% - 48px);
 	overflow-y: scroll;
+	padding-left: 10px
 }
 #content::-webkit-scrollbar {
   width: 10px;
@@ -61,8 +62,54 @@ div#middle_section {
 	padding: 0px 2px;
 }
 
-#container{
-	margin: 8px;
+@media only screen and (min-width: 600px) {
+  #container{
+    margin-left: 5%;
+    margin-right: 5%;
+  }
+}
+
+@media only screen and (min-width: 960px) {
+  #container {
+    margin-left: 10%;
+    margin-right: 10%;
+  }
+}
+
+@media only screen and (min-width: 1280px) {
+  #container {
+    display: block;
+    margin-left: 20%;
+    margin-right: 20%;
+  }
+}
+
+/* Main Search Tab */
+
+#main_search > .search_section{
+	float: none;
+}
+
+.top_result {
+	display: flex;
+	align-items:center;
+}
+.top_result > img {
+	display: inline-block;
+	border-radius: 5px;
+	width: 156px;
+	height: 156px;
+}
+.top_result > .info_box {
+	display: inline-block;
+	padding-left: 24px;
+}
+.top_result > .info_box > p {
+	margin: 0px;
+	margin-bottom: 4px;
+}
+.top_result > .info_box > .subtitle {
+	opacity: 0.75;
 }
 
 /* Download tab section */
@@ -91,3 +138,16 @@ div#download_tab{
 	font-size: 24px;
 	margin: 4px;
 }
+
+/* Global stuff */
+img.rounded {
+	border-radius: 50%;
+}
+span.tag {
+	background-color: #222324;
+  border-radius: 2px;
+  color: #ffffff;
+  display: inline-block;
+  font-size: 10px;
+  padding: 3px 6px;
+}