Add basic (currently dark grey) arrow icon to select boxes

Towards #163

assets/css/base.css

@@ -308,11 +308,12 @@ input[type=radio] + label {
   }
 
   select {
+    background-image: url('/icons/arrow.svg');
     background-color: var(--input-background);
-    background-image: var(--arrow-down), var(--outset-shadow);
-    background-repeat: no-repeat, repeat;
-    background-position: right 0.75rem top 50%, 0 0;
-    background-size: 0.8em 0.8em, 100%;
+    background-position-x: 95%; /* position at right edge */
+    background-position-y: 50%; /* position vertically centred */
+    background-repeat: no-repeat;
+    background-size: 0.75em 0.75em; /* arrow icon size */
     border-color: var(--input-border);
     border-radius: 0.5em;
     box-shadow: 0 0.05em 0 0.05em var(--shadow);

static/icons/arrow.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="60px" height="40px" viewBox="0 0 60 40" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <polygon id="arrow" fill="#000000" points="0 0 60 0 30 40"></polygon>
+</svg>
\ No newline at end of file