diff --git a/overrides/css/base.css b/overrides/css/base.css
index 24976d434..d664f493c 100644
--- a/overrides/css/base.css
+++ b/overrides/css/base.css
@@ -106,8 +106,43 @@ html {
   margin-left: 0.5rem;
 }
 
+/* remove default browser styles from the select and manually add an arrow,
+mostly to prevent Safari adding its own glossy styles */
+#wm-language-select-container {
+  position: relative;
+  overflow: hidden;
+}
+
 #wm-language-select {
   border: none;
+  -webkit-appearance: none;
+  appearance: none;
+  height: 100%;
+  padding: 2px 4px;
+  padding-right: 16px;
+  /* hardcoded value trick to match the select size to the longest option (20 characters as of right now),
+  so that the arrow is positioned correctly */
+  width: calc(20ch - 8px);
+  max-width: 100%;
+}
+
+#wm-language-select-container::after {
+  content: "\25BC";
+  pointer-events: none;
+  mask-image: var(--icon-Expand);
+  mask-repeat: no-repeat;
+  mask-position: center;
+  mask-size: contain;
+  background-color: var(--color-light);
+  font-size: initial;
+  width: 16px;
+  height: 16px;
+  position: absolute;
+  transform: rotate(90deg);
+  top: 0;
+  bottom: 0;
+  right: 0;
+  margin: auto;
 }
 
 #wm-language-select, #wm-language-select option {
diff --git a/overrides/topbar.html b/overrides/topbar.html
index b4792b46b..1f4daeec9 100644
--- a/overrides/topbar.html
+++ b/overrides/topbar.html
@@ -24,15 +24,17 @@
     <div class="wm-top-tool wm-vcenter pull-right wm-small-left wm-top-toc-button">
       <button id="wm-toc-button" type="button" class="btn btn-sm btn-default wm-vcentered"><i class="fa fa-th-list" aria-hidden="true"></i></button>
     </div>
-    <select id="wm-language-select" class="wm-top-tool wm-vcenter pull-right wm-small-left home-top-tool-selector" name="lang"
-      {% if config.theme.disable_language_selector %}
-        data-unavailable="true"
-      {% endif %}
-      >
-      {% for lang in config.extra.alternate %}
-      <option value="{{ lang.link }}" {% if lang.code == config.theme.language %}selected{% endif %}>{{ lang.name }}</option>
-      {% endfor %}
-    </select>
+    <div id="wm-language-select-container" class="wm-vcenter wm-top-tool home-top-tool-selector pull-right wm-small-left">
+      <select id="wm-language-select" name="lang"
+        {% if config.theme.disable_language_selector %}
+          data-unavailable="true"
+        {% endif %}
+        >
+        {% for lang in config.extra.alternate %}
+        <option value="{{ lang.link }}" {% if lang.code == config.theme.language %}selected{% endif %}>{{ lang.name }}</option>
+        {% endfor %}
+      </select>
+    </div>
 
     {# Optional forward-back buttons #}
     {% if config.extra.history_buttons %}