lots and lots of transitions

res/static/style/layout.css

@@ -57,7 +57,6 @@ html{height: 100%;}
 body{
 	background-color: var(--background_color);
 	background-repeat: repeat;
-	font-size: 16px;
 	font-family: 'Ubuntu';
 	margin: 0;
 	text-align: center; /* Center the header and body */
@@ -103,7 +102,7 @@ body{
 	text-decoration: none;
 	font-family: "Lato Thin", sans-serif;
 	font-weight: bold;
-	font-size: 26px;
+	font-size: 1.8em;
 	transition: box-shadow 0.5s;
 }
 .navigation a:hover {
@@ -214,13 +213,13 @@ pre{
 }
 
 .big_button{
-	height: 40px;
+	height: 1.3em;
 	width: 40%;
 	min-width: 200px;
 	max-width: 400px;
 	margin: 10px !important;
 	border-radius: 10px;
-	font-size: 30px;
+	font-size: 1.9em;
 	font-weight: normal;
 	line-height: 8px;
 }
@@ -252,14 +251,6 @@ pre{
 	white-space: nowrap;
 }
 
-.uploads_queue{
-	position: relative;
-	width: 100%;
-	height: 0;
-	overflow-x: hidden;
-	overflow-y: scroll;
-}
-
 .file_button{
 	position: relative;
 	box-sizing: border-box;
@@ -276,7 +267,7 @@ pre{
 	text-align: left;
 	line-height: 120%;
 	display: inline-block;
-	transition: box-shadow 0.3s;
+	transition: box-shadow 0.3s, opacity 2s;
 }
 .file_button:hover{
 	box-shadow: 0px 0px 10px 3px var(--highlight_color), inset 0px 0px 6px 1px var(--highlight_color);
@@ -344,7 +335,7 @@ input[type="button"]:active,
 input[type="color"]:active,
 select:active{
 	background: linear-gradient(var(--input_color_dark), var(--input_color));
-	box-shadow: inset 3px 3px 6px var(--shadow_color);
+	box-shadow: inset 5px 5px 10px var(--shadow_color);
 	padding: 11px 3px 1px 13px; /* Exactly 5px offset compared to the inactive padding to give a depth effect */
 }
 .button_full_width      {width: calc(100% - 4px);}
@@ -371,8 +362,8 @@ input[type="number"]{
 	padding: 3px 5px;
 	color: var(--input_text_color);
 	height: 26px;
-	font-size: 18px;
 	font-family: 'Ubuntu', sans-serif;
+	font-size: 1em;
 	vertical-align: bottom;
 	outline: 0;
 	transition: box-shadow 0.3s;