diff --git a/web/app.html b/web/app.html
index 6ec76fd..5a77ec7 100644
--- a/web/app.html
+++ b/web/app.html
@@ -20,14 +20,14 @@
 <!--banner-->
 <div class="banner">
     <p></p>
-    <div class="btn-toolbar" role="toolbar" aria-label="Toolbar">
+    <div class="btn-toolbar btn-group-sm" role="toolbar" aria-label="Toolbar">
       <div class="btn-group mr-2" role="group" aria-label="Add group">
         <input id="additemid" type="text" placeholder="item id" pattern="[0-9]*">
         <input id="addattributes" type="text" placeholder="attributes (comma separated)" pattern="[0-9a-zA-Z, ]*">
-        <button id="addbutton" type="button">Add</button>
+        <button id="addbutton" class="btn btn-secondary" type="button">add</button>
       </div>
       <div class="btn-group mr-2" role="group" aria-label="Manage list group">
-        <button id="manage_list" type="button">manage list</button>
+        <button id="manage_list" class="btn btn-secondary" type="button">manage list</button>
       </div>
       <div class="dropdown btn-group mr-2" id="filters">
           <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown">
@@ -39,7 +39,7 @@
           </div>
       </div>
       <div class="btn-group mr-2" role="group" aria-label="Toggle show group">
-        <button id="global_toggleshow" class="global_toggleshow" type="button">show hidden</button>
+        <button id="global_toggleshow" class="btn btn-secondary" type="button">show hidden</button>
       </div>
     </div>
 </div>
diff --git a/web/style.css b/web/style.css
index f753294..e41a3c1 100644
--- a/web/style.css
+++ b/web/style.css
@@ -28,7 +28,7 @@ body {
 }
 
 .banner {
-  background-color: #177013;
+  background-color: #30fc66;
   color: #fff;
   padding: 10px;
   position: fixed;