Cleanup in main.css

website/styles/main.css

@@ -1,64 +1,10 @@
 /*-----------------------------------------------------------------------------
 Default Stylesheet
 
-last update:    10-01-2017
+last update:    13-01-2017
 Website:        myhyvesbookplus.tk
 -----------------------------------------------------------------------------*/
 
-.profile-picture {
-    border-radius: 50%;
-    height: 42px;
-    width: 42px;
-    object-fit: cover;
-    vertical-align: middle;
-}
-
-.group-picture {
-    border-radius: 5px;
-    height: 42px;
-    width: 42px;
-    object-fit: cover;
-    vertical-align: middle;
-}
-
-html {
-    height: 100%;
-}
-
-body {
-    height: 100%;
-
-    background-color: #B78996;
-    color: #333;
-
-    font-family: Arial, sans-serif;
-}
-
-.content {
-    padding: 20px;
-    margin-top: 80px;
-    margin-left: 256px;
-    min-height: 100%;
-}
-
-.platform {
-    padding: 20px;
-    margin-bottom: 10px;
-    border-radius: 10px;
-    background-color: #FFFFFF;
-    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
-}
-
-::selection {
-    background: #845663;
-    color: white;
-}
-
-::-moz-selection {
-    background: #845663;
-    color: white;
-}
-
 /* Remove padding and margin */
 * {
     margin: 0;
@@ -66,19 +12,15 @@ body {
     border: 0;
 }
 
-/* Move element down (clear), below floating elements */
+html {
-.clear {
+    height: 100%;
-    clear: both;
 }
 
-/* Float element to the left side of its containing block */
+body {
-.right {
+    height: 100%;
-    float: right;
+    background-color: #B78996;
-}
+    color: #333;
-
+    font-family: Arial, sans-serif;
-/* Float element to the left side of its containing block */
-.left {
-    float: left;
 }
 
 /* Font sizes */
@@ -110,23 +52,81 @@ p {
     font-size: 1.2em;
 }
 
+/* Selection colors */
+::selection {
+    background: #845663;
+    color: white;
+}
+
+::-moz-selection {
+    background: #845663;
+    color: white;
+}
+
+/* All content underneath the menu */
+.content {
+    padding: 20px;
+    margin-top: 80px;
+    margin-left: 256px;
+    min-height: 100%;
+}
+
+/* White boxes (squares) */
+.platform {
+    padding: 20px;
+    margin-bottom: 10px;
+    border-radius: 10px;
+    background-color: #FFFFFF;
+    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
+}
+
+.profile-picture, .group-picture {
+    height: 42px;
+    width: 42px;
+    object-fit: cover;
+    vertical-align: middle;
+}
+
+.profile-picture {
+    border-radius: 50%;
+}
+
+.group-picture {
+    border-radius: 5px;
+}
+
+/* Move element down (clear), below floating elements */
+.clear {
+    clear: both;
+}
+
+/* Float element to the left side of its containing block */
+.right {
+    float: right;
+}
+
+/* Float element to the left side of its containing block */
+.left {
+    float: left;
+}
+
+/* All links */
 a, a:link, a:visited, a:hover, a:active {
     color: inherit;
     text-decoration: none;
 }
 
+/* All buttons, inputfields/selectfields. */
 button, input, select {
     width: auto;
     height: 32px;
-
     cursor: pointer;
     border: none;
-
-    font-family: Arial, sans-serif;
     font-size: 16px;
     border-radius: 7px;
 }
 
+/* All textinput and sections */
 textarea, input, select {
     padding: 0 5px;
     background: white;
@@ -134,11 +134,12 @@ textarea, input, select {
     border: 1px solid #845663;
     border-radius: 7px;
     font-size: 16px;
-
-
 }
 
-button, input[type="submit"], input[type="reset"] {
+/* All buttons */
+button,
+input[type="submit"],
+input[type="reset"] {
     background-color: #845663;
     color: white;
     padding: 0 10px;
@@ -157,11 +158,16 @@ td {
 }
 
 /* Custom title box, appears instantaneously */
-a[data-title]:hover, img[data-title]:hover, span[data-title]:hover, div[data-title]:hover {
+a[data-title]:hover,
+img[data-title]:hover,
+span[data-title]:hover,
+div[data-title]:hover {
     position: relative;
 }
 
-a[data-title]:hover:after, img[data-title]:hover:after, span[data-title]:hover:after,
+a[data-title]:hover:after,
+img[data-title]:hover:after,
+span[data-title]:hover:after,
 div[data-title]:hover:after {
     content: attr(data-title);
     padding: 4px 4px;