1 files changed, 24 insertions, 17 deletions
diff --git a/talermerchantdemos/static/demo.css b/talermerchantdemos/static/demo.css
index d6fb5a0..3c74bfa 100644
--- a/talermerchantdemos/static/demo.css
+++ b/talermerchantdemos/static/demo.css
@@ -1,12 +1,22 @@
 @charset "UTF-8";
-/*
-Style common to all demo pages.
+@import url(/static/theme.css);
 
-Colors:
-- #1e2739 (dark blue)
-- #0042b2 (default blue)
-- #3daee9 (highlight blue)
-*/
+
+.skip {
+  position: absolute;
+  left: -10000px;
+  top: auto;
+  width: 1px;
+  height: fit-content;
+  overflow: hidden;
+}
+
+.skip:focus {
+  position: static;
+  width: auto;
+  background: black;
+  padding: 5px;
+}
 
 .demobar h1 {
   text-align: center;
@@ -18,7 +28,7 @@ Colors:
 
 .demobar a,
 .demobar a:visited {
-  color: inherit;
+  color: white;
 }
 
 .tt {
@@ -39,6 +49,7 @@ Colors:
 
 .content {
   margin-left: 2em;
+  margin-right: 2em;
   overflow-x: auto;
 }
 
@@ -80,6 +91,7 @@ nav {
 }
 
 nav a,
+nav button,
 nav span,
 .navbtn {
   border: none;
@@ -92,6 +104,7 @@ nav span,
 }
 
 nav a,
+nav button,
 nav span,
 .navbtn {
   padding: 15px 32px;
@@ -106,7 +119,7 @@ nav span:hover,
 nav a.active,
 nav span.active,
 .navbtn.active {
-  background-color: #1e2739;
+  background-color: var(--demo-common-dark-blue);
 }
 
 nav a.active:hover,
@@ -125,13 +138,7 @@ nav .right {
   float: right;
   margin-right: 5vw;
 }
-nav .right div.nav {
-  display: none;
-}
-nav .right div.nav:hover {
-  display: block;
-}
 
-nav .right:hover div.nav {
-  display: block;
+nav .hide div.nav {
+  display: none;
 }