diff --git a/a_defective_system.html.pm b/a_defective_system.html.pm
index 30fd858..a047bae 100644
--- a/a_defective_system.html.pm
+++ b/a_defective_system.html.pm
@@ -31,17 +31,17 @@ If I did print money---a ◊strong{lot} of money---and spent it like this, what
 
 For starters, if I just kept the money without spending it, nothing would change:
 
-◊img[#:src "/images/counterfeiting1.png" #:alt "The counterfeiter can print a large stash of cash."]{
+◊img[#:src "/images/counterfeiting1.png" #:alt "The counterfeiter can print a large stash of cash, but other people would not benefit."]{
     The counterfeit money is colored yellow and the real money is green.
 }
 
 Then if I decided to buy a bunch of LEGO®, the store would get some of my money:
 
-◊img[#:src "/images/counterfeiting2.png" #:alt "The counterfeiter buys LEGO."]{}
+◊img[#:src "/images/counterfeiting2.png" #:alt "The counterfeiter buys LEGO, sharing the wealth with the store."]{}
 
 After a while the store would use the counterfeited money to pay their supplier:
 
-◊img[#:src "/images/counterfeiting3.png" #:alt "Money further trickles down to the supplier, but not to everyone."]{}
+◊img[#:src "/images/counterfeiting3.png" #:alt "Money further trickles down to the supplier, but not to everyone. The poor people did not get more money than they had before, and now they're even poorer relative to the others."]{}
 
 Who in turn will use it to buy other stuff, and in this way the counterfeited money slowly trickles out into the rest of the economy. This extra money has two important effects:
 
@@ -356,7 +356,7 @@ While taking out debt to fuel investments was only supposed to be a temporary me
 
 ◊; Actual source
 ◊; https://fred.stlouisfed.org/graph/?id=GFDEBTN,
-◊img[#:src "images/usa-debt.svg" #:link #t #:alt "The federal debt of the United States, measure in trillions of dollars, since 1966."]{
+◊img[#:src "images/usa-debt.svg" #:link #t #:alt "The federal debt of the United States figure"]{
     The ◊link[usa-national-debt]{federal debt of the United States}, measure in trillions of dollars, since 1966.  
     After the ◊link[financial_crisis]{2008 financial crisis} the amount of debt skyrocketed, signifying a shift in economic policy.  
     During the COVID-19 pandemic the debt explosively increased at a pace unseen before.
@@ -444,18 +444,18 @@ It seems like we're moving away from the original Keynesian ideas to something e
 
 There's a worrying trend in the world: ◊link[global-inequality]{global inequality is rising}. The rich get richer and the poor get... poorer.
 
-◊img[#:src "images/income-inequality-world.svg" #:link #t #:alt "Top 10% income share between 1980 and 2015."]{
+◊img[#:src "images/income-inequality-world.svg" #:link #t #:alt "World income share figure"]{
     Top 10% income share between 1980 and 2015.  
     Source ◊link[inequality-data]{World Inequality Database}.
 }
 
 The inequality is on the rise in nearly every country. If we take a closer look at the United States, it paints a gloomy picture:◊mn{report}
 
-◊img[#:src "images/income-inequality.svg" #:link #t #:alt "Income share in the United States between 1962 and 2014."]{
+◊img[#:src "images/income-inequality.svg" #:link #t #:alt "United States income share figure"]{
     Income share in the United States between 1962 and 2014.  
     Source ◊link[inequality-data]{World Inequality Database}.
 }
-◊img[#:src "images/wealth-inequality.svg" #:link #t #:alt "Net personal wealth in the United States between 1962 and 2014."]{
+◊img[#:src "images/wealth-inequality.svg" #:link #t #:alt "Net personal wealth figure"]{
     Net personal wealth in the United States between 1962 and 2014.  
     Source ◊link[inequality-data]{World Inequality Database}.
 }
diff --git a/antifragile.html.pm b/antifragile.html.pm
index 2a929f0..9b28877 100644
--- a/antifragile.html.pm
+++ b/antifragile.html.pm
@@ -142,11 +142,11 @@ Cryptocurrencies work the same way. When a weakness is discovered developers wil
 
 While you can argue that an individual cryptocurrency is antifragile, antifragility also applies to the cryptocurrency concept itself. People like to point at the thousands of cryptocurrencies as some sort of drawback, but it's actually the opposite. Cryptocurrencies being created and then dying off en mass is good as each time one fails we might learn something new and use that to improve the survivors.
 
-◊img[#:src "/images/btc-hydra.png" #:alt "A hydra with one Bitcoin head"]{
+◊img[#:src "/images/btc-hydra.png" #:alt "A hydra with one head looking like the Bitcoin logo."]{
     Cryptocurrencies are like a Hydra.
 }
 
-◊img[#:src "/images/bch-xmr-hydra.png" #:alt "A hydra with two heads, one Bitcoin Cash and one Monero"]{
+◊img[#:src "/images/bch-xmr-hydra.png" #:alt "A hydra with three heads; one cut off, one like the Bitcoin Cash logo and one like the Monero logo."]{
    Cut off one head, two more shall take its place.
 }
 
diff --git a/are_cryptocurrencies_money.html.pm b/are_cryptocurrencies_money.html.pm
index e5aa566..1fb2a55 100644
--- a/are_cryptocurrencies_money.html.pm
+++ b/are_cryptocurrencies_money.html.pm
@@ -203,7 +203,7 @@ We've looked at the properties---but how well do they function as money, today?
 
         The valuation is highly speculation driven and has been notoriously volatile.◊mn{sov} ◊note-pos{sov}
 
-        ◊img[#:src "images/btc-valuation.svg" #:link #t #:alt "Bitcoin closing price per month, between 2010 and 2019."]{
+        ◊img[#:src "images/btc-valuation.svg" #:link #t #:alt "Bitcoin closing price per month, between 2010 and 2020."]{
             ◊link[btc-valuation]{Bitcoin price per week up to the beginning of 2020}.  
             The price peaked in December 2017 to $19,870, and some exchanges had it even higher. A year later the price had dropped to $3,177, a drop of over 84%.
         }
diff --git a/challenges.html.pm b/challenges.html.pm
index e2d924a..38eac70 100644
--- a/challenges.html.pm
+++ b/challenges.html.pm
@@ -97,12 +97,12 @@ Bitcoin, like most cryptocurrencies, uses a public ledger where all transactions
      "https://www.chainalysis.com/"
      "Chainalysis: The Blockchain Analysis Company"))
 
-◊img[#:src "/images/coin-tracing.png" #:alt "Paying someone with allows you to see their funds."]{
+◊img[#:src "/images/coin-tracing.png" #:alt "Image of John's address that has sent 1 BTC to the merchant and 13 BTC to another address."]{
     After the merchant receives a payment from John, the merchant can see that John has sent 13 BTC to another address, out of an initial 40 BTC.
     John appears to be quite rich.
 }
 
-◊img[#:src "/images/coin-tracing2.png" #:alt "You can trace coins back in history."]{
+◊img[#:src "/images/coin-tracing2.png" #:alt "Image of how John's 40 BTC originates from a hacked exchange."]{
     It's possible to trace coins further back in history. Here we see that John's coins come from a hacked exchange, whose address is known. It might mean John is the hacker or, more probably, that John has received ◊em{tainted} coins (coins associated with illegal behavior).
 }
 
@@ -119,7 +119,7 @@ You can explore the Bitcoin blockchain, and see all transactions and addresses,
 
 In an attempt to make Bitcoin more private "mixing" services such as ◊link[coinjoin]{CoinJoin} can be used. They work by mixing together your coins with the coins of others, in an attempt to obscure where the coins are coming from:
 
-◊img[#:src "/images/coinjoin.png" #:alt "Obfuscation by mixing coins with other addresses."]{
+◊img[#:src "/images/coinjoin.png" #:alt "Image of mixing coins by sending them to and from various addresses."]{
     A mixing service makes several addresses send to each other, in order to obfuscate the history. Although not shown here, because it would be too messy, all addresses and amounts are still visible.
 }
 
diff --git a/chapter.html.p b/chapter.html.p
index 6161533..2b0e503 100644
--- a/chapter.html.p
+++ b/chapter.html.p
@@ -58,7 +58,7 @@
         <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
     </head>
     <body>
-      <article class="◊|article-class|">
+      <main class="◊|article-class|">
         <nav class="where">
           <a href="/toc.html" tilte="Table of contents" class="home">Why Cryptocurrencies?</a>
           ◊when/splice[parent-page]{
@@ -66,23 +66,24 @@
             ◊(ref parent-page parent-title parent-title)
           }
         </nav>
-        <header>
-          <h1>◊|title|</h1>
-          <h2>◊|subtitle|</h2>
-          ◊(when side-space? (->html
-             `(div ((class "date"))
-                 (span ((class "published")) ,published)
-                 ,(if updated
-                      `(span ((class "updated")) ,updated)
-                      ""))))
-          </div>
-        </header>
+        <article>
+          <header>
+            <h1>◊|title|</h1>
+            <h2>◊|subtitle|</h2>
+            ◊(when side-space? (->html
+              `(div ((class "date"))
+                  (span ((class "published")) ,published)
+                  ,(if updated
+                        `(span ((class "updated")) ,updated)
+                        ""))))
+          </header>
 
-        ◊(->html doc #:splice? #t)
+          ◊(->html doc #:splice? #t)
+        </article>
 
         ◊(->html (make-section-nav #:section-header? section-chapters-headers?
                                     here))
-      </article>
+      </main>
 
       ◊(when side-space? (->html `(div ((class "side-space")))))
 
diff --git a/cryptography.html.pm b/cryptography.html.pm
index 1a9f23f..635d936 100644
--- a/cryptography.html.pm
+++ b/cryptography.html.pm
@@ -110,7 +110,7 @@ You ◊em{encrypt} a message by placing it in the mailbox, this way nobody but t
     This is where our mailbox metaphor breaks down a bit. It may seem that it's more inconvenient to sign a message than to encrypt one, but digitally they're both straightforward.
 }
 
-◊img[#:src "/images/encrypted_mailbox.png" #:alt "Placing a letter in the mailbox."]{
+◊img[#:src "/images/encrypted_mailbox.png" #:alt "A letter is placed in the mailbox."]{
     Placing a message inside the mailbox ensures that only the one with the key can read it.
 }
 
diff --git a/darknet_markets.html.pm b/darknet_markets.html.pm
index 6940877..9ad8328 100644
--- a/darknet_markets.html.pm
+++ b/darknet_markets.html.pm
@@ -38,16 +38,13 @@ There's a concept we need to have in mind while looking at darknet markets: some
 
 Here's a table to illustrate the problem:
 
+◊(define sbr
+   `(br))
+
 ◊table-body[#:class "legal-moral"]{
-    ◊tr{◊td{}           ◊ths{Legal}                     ◊ths{Illegal}}
-    ◊tr{◊tds{Moral}     ◊good{Self defense
-                              Free speech}
-                                                        ◊mo-il{Some types of sex
-                                                               Starving child steals food}}
-    ◊tr{◊tds{Immoral}   ◊im-le{Mass surveillance
-                               Civil asset forfeiture}
-                                                        ◊bad{Slavery
-                                                             Murder}}
+    ◊tr{◊td{}           ◊ths{Legal}                                             ◊ths{Illegal}}
+    ◊tr{◊tds{Moral}     ◊good{Self defense◊|sbr|Free speech}                    ◊mo-il{Some types of sex◊|sbr|Starving child steals food}}
+    ◊tr{◊tds{Immoral}   ◊im-le{Mass surveillance◊|sbr|Civil asset forfeiture}   ◊bad{Slavery◊|sbr|Murder}}
 }
 
 It's actually quite hard to classify things as legal or illegal and moral or immoral; they both change depending on the country, the time period and who you ask. For instance most would agree that slavery is immoral and should be illegal, but it was legal and viewed as normal for thousands of years. Similarly today in the western world we take free speech for granted, but that's not the case in all countries.
@@ -152,7 +149,7 @@ So if none of those things are available, what can you buy on a darknet market?
 
 The following example, based on a real-life story I read a few years ago, illustrates why darknet markets aren't purely evil.
 
-◊div[#:class "story"]{
+◊section[#:class "story"]{
 
     Tom met the love of his life five years ago, when he went to get some of his teeth removed. Hardly the most romantic meeting, with her drilling into his aching teeth, but it was love at first sight.
 
diff --git a/for_the_unbanked.html.pm b/for_the_unbanked.html.pm
index e92b1e4..8c7c596 100644
--- a/for_the_unbanked.html.pm
+++ b/for_the_unbanked.html.pm
@@ -44,7 +44,7 @@ There are ◊strong{◊link[findex-report]{1.7 billion adults}} without a bank a
 ◊; #df65b0  36-60
 ◊; #dd1c77  61-80
 ◊; #980043  81-100
-◊img[#:src "images/unbanked-map.png" #:class "fullwidth" #:link #t #:alt "Adults without a bank account, 2017."]{
+◊img[#:src "images/unbanked-map.png" #:class "fullwidth" #:link #t #:alt "A world map showing the fraction of adults without a bank account in each country, 2017."]{
     Adults without a bank account, 2017.
     Source ◊link[findex-report]{Global Findex database}.
 }
@@ -63,7 +63,7 @@ Another way to look at the world is to visualize the raw number of unbanked in e
 ◊;#43a2ca   50 - 100 mil
 ◊;          100 - 150 mil (no country!)
 ◊;#0868ac   > 150 mil
-◊img[#:src "images/unbanked-count-map.png" #:class "fullwidth" #:link #t #:alt "The number of adults without a bank account, 2017."]{
+◊img[#:src "images/unbanked-count-map.png" #:class "fullwidth" #:link #t #:alt "A world map showing the number of adults without a bank account in each country, 2017."]{
     The number of adults without a bank account, 2017.
     Source ◊link[findex-report]{Global Findex database} (◊link[findex-interactive]{interactive}).
 }
@@ -81,7 +81,7 @@ The ◊link[findex-report]{Global Findex database} also tried to examine why peo
     If this is interesting to you I suggest you ◊link[findex-report]{give the report a read}. There are tons of different statistics and I only refer to a fraction of the data available.
 }
 
-◊img[#:src "images/why-unbanked.svg" #:link #t #:alt "Reported reason for adults not having a bank account, 2017."]{
+◊img[#:src "images/why-unbanked.svg" #:link #t #:alt "Reported reasons table."]{
     Reported reason for adults not having a bank account, 2017. More than one reason could be given.
     Source ◊link[findex-report]{Global Findex database}.
 }
diff --git a/freezing_of_merchant_accounts.html.pm b/freezing_of_merchant_accounts.html.pm
index 5c9d178..c3c50ad 100644
--- a/freezing_of_merchant_accounts.html.pm
+++ b/freezing_of_merchant_accounts.html.pm
@@ -30,7 +30,7 @@ This chapter continues on the same idea as the ◊link[prev]{previous one}, but
 
 Imagine coming in to work one day and having this conversion with your boss:
 
-◊div[#:class "story"]{
+◊section[#:class "story"]{
     ◊trow{I'm sorry John, but we'll pay you in 6 months.}
     ◊trow{What?}
     ◊trow{Don't worry, you'll still get your full salary, but we'll pay it in 6 months.}
diff --git a/global_currency.html.pm b/global_currency.html.pm
index 1b879e0..5bcddd7 100644
--- a/global_currency.html.pm
+++ b/global_currency.html.pm
@@ -9,7 +9,7 @@
 
 ◊(clear-sidenotes)
 
-◊img[#:src "/images/global.png" #:alt "You can send coins all over the world."]{}
+◊img[#:src "/images/global.png" #:alt "You can send coins all over the world." #:decorative #t]{}
 
 Cryptocurrencies don't have any borders. They allow you to send and receive money from anywhere in the world; to bypass sanctions and border control; opt-out of local monetary policies; and use a currency that's global to an extent we've never seen before.
 
diff --git a/how_do_cryptocurrencies_work.html.pm b/how_do_cryptocurrencies_work.html.pm
index 81768f4..1c2cae0 100644
--- a/how_do_cryptocurrencies_work.html.pm
+++ b/how_do_cryptocurrencies_work.html.pm
@@ -83,7 +83,7 @@ For example, Sneaky Steve wants to buy a computer from Honest Harry and wants to
 What Sneaky Steve tries to do is send ◊sans-tnum{1 BTC} to the merchant, Honest Harry, and then send a copy of ◊sans-tnum{1 BTC} to his other address: ◊sans-tnum{Sneaky Steve 2}. (It's possible to have as many addresses as you want---a consequence of the permissionless nature of Bitcoin.)
 
 ◊img[#:src "/images/double-spend.png"
-     #:alt "Double spending by sending a coin to someone and back to himself."]{Sneaky Steve sends a digital coin both to Honest Harry and himself.}
+     #:alt "Double spending figure"]{Sneaky Steve sends a digital coin both to Honest Harry and himself.}
 
 If we didn't prevent this, the ledger might look like this:
 
@@ -269,7 +269,7 @@ When a miner finds a solution, she can update the ledger by adding a block to th
 
 A blockchain is what it sounds like: a chain of blocks where a new block builds on previous blocks. When a miner searches for a solution, she must target a block on a specific height---the POW problem includes a reference to the previous block and it only fits at a specific position in the chain. When a new block is added, all miners need to work on a new problem targeting that block.
 
-◊img[#:src "/images/add_block.png" #:alt "A new block is added by linking it with a POW solution."]{
+◊img[#:src "/images/add_block.png" #:alt "A new block is added by linking it to the previous block with a POW solution."]{
     The blocks in the blockchain are linked with a key obtained by solving the POW problem.
 }
 
@@ -344,7 +344,7 @@ The blockchain is duplicated, stored, and maintained by many different people; y
 What happens if two miners find a block at the same height? For example, one where Sneaky Steve sends money to Honest Harry and one where Sneaky Steve sends money to himself?
 
 ◊img[#:src "/images/double_spend_fork.png"
-     #:alt "Two blocks can be added at the same height."]{
+     #:alt "Two blocks can be added at the same height, even if they contain different transactions."]{
     Two blocks at the same height with different transactions.
 }
 
@@ -388,7 +388,7 @@ It works like this:
     }
 }
 
-◊img[#:src "/images/reversal1.png" #:alt "Sneaky Steve pays Honest Harry."]{
+◊img[#:src "/images/reversal1.png" #:alt "Sneaky Steve paying Honest Harry, and a block with two confirmations."]{
     Sneaky Steve pays Honest Harry and they wait until the transaction has two confirmations.
 }
 ◊img[#:src "/images/reversal3.png" #:alt "Honest Harry gives Sneaky Steve jeans."]{
diff --git a/pollen.rkt b/pollen.rkt
index 264f495..6210c4e 100644
--- a/pollen.rkt
+++ b/pollen.rkt
@@ -34,7 +34,7 @@
 
   (provide (all-defined-out))
 
-  (define block-tags (append '(img table tbody tr dt dd dl) default-block-tags))
+  (define block-tags (append '(img table thead tbody tr dt dd dl) default-block-tags))
 
   ;; Use our own publish script instead...
   ;; Ignore stuff during 'raco pollen publish'
diff --git a/properties_of_a_cryptocurrency.html.pm b/properties_of_a_cryptocurrency.html.pm
index 6f1a3b2..958265e 100644
--- a/properties_of_a_cryptocurrency.html.pm
+++ b/properties_of_a_cryptocurrency.html.pm
@@ -41,13 +41,13 @@ The important difference between a cryptocurrency and the digital payments we ha
 
 Sending money to people via your bank isn't peer-to-peer as you rely on your bank to send it for you. VISA, PayPal, Swish, Apple Pay, and other digital payments have the same problem, all except cryptocurrencies.
 
-◊img[#:src "images/give_cash.png" #:alt "Cash is given directly from hand to hand."]{
+◊img[#:src "images/give_cash.png" #:alt "Giving cash figure"]{
     Cash is given directly from hand to hand.
 }
-◊img[#:src "images/send_bank.png" #:alt "Regular digital payments are sent through a bank or different payment processors."]{
+◊img[#:src "images/send_bank.png" #:alt "Payments through a bank figure"]{
     Regular digital payments are sent through a bank or different payment processors.
 }
-◊img[#:src "images/send_crypto.png" #:alt "Cryptocurrencies are sent directly from device to device."]{
+◊img[#:src "images/send_crypto.png" #:alt "Sent between devices figure"]{
     Cryptocurrencies are sent directly from device to device.
 }
 
@@ -87,7 +87,7 @@ Problems with counterfeit coins and bills go far back. From biting coins to test
 
 With cryptocurrencies, anyone can independently verify the integrity of the coins you send and receive. Details on how is in the ◊link[next-chapter]{next chapter} but I assure you no biting is needed. You cannot counterfeit coins and you cannot send the same coin to multiple people ◊em{(double-spend)}. This is what allows cryptocurrencies to operate without a trusted third-party.
 
-◊img[#:src "/images/double-spend.png" #:alt "Double spending by sending a coin to someone and back to himself."]{
+◊img[#:src "/images/double-spend.png" #:alt "Double spending figure"]{
     A double spending occurs when someone sends the same coin both to a merchant and back to himself.
 }
 
diff --git a/rkt/refs.rkt b/rkt/refs.rkt
index b18ad17..983792d 100644
--- a/rkt/refs.rkt
+++ b/rkt/refs.rkt
@@ -73,5 +73,13 @@
       (regexp-match #rx"^mailto:" x))))
 
 (define (to-name x)
-  (string-replace (string-downcase x) " " "-"))
-
+  (regexp-replace #rx"[?%#]"
+                  (string-replace (string-downcase x) " " "-")
+                  ""))
+
+(module+ test
+  (require rackunit)
+  (check-equal? (to-name "What is this?") "what-is-this")
+  (check-equal? (to-name "50%") "50")
+  (check-equal? (to-name "a#b") "ab")
+  )
diff --git a/rkt/sidenotes.rkt b/rkt/sidenotes.rkt
index 648b503..58fa262 100644
--- a/rkt/sidenotes.rkt
+++ b/rkt/sidenotes.rkt
@@ -305,7 +305,7 @@
                                    styles)))
       (string-join styles " ")))
 
-  (define attrs `((class "sidenote")))
+  (define attrs `((class "sidenote") (role "note")))
   (when (non-empty-string? styles)
     (set! attrs (append attrs
                         `((style ,styles)))))
@@ -341,21 +341,30 @@
   ;; Like including an "ignore" tag to match only against the most important things,
   ;; but that's too much work for me now. Meh.
   (define expected
-    `((p "One."
-         (span ((class "sidenote-label")) "1")
-         " Two." (span ((class "sidenote-label")) "2")
-         " Three." (span ((class "sidenote-label")) "3"))
-      (div ((class "sidenote")) (span ((class "sidenote-number")) "1")
-             "1st")
-      (div ((class "sidenote")) (span ((class "sidenote-number")) "2")
-             "2nd")
-      (ol
-        (li "a" (span ((class "sidenote-label")) "4"))
-        (li "b"))
-      (div ((class "sidenote")) (span ((class "sidenote-number")) "4")
-             "In list.")
-      (div ((class "sidenote")) (span ((class "sidenote-number")) "3")
-             "3rd")))
+  '((p
+      "One."
+      (sup ((class "sidenote-number")) "1")
+      " Two."
+      (sup ((class "sidenote-number")) "2")
+      " Three."
+      (sup ((class "sidenote-number")) "3"))
+    (aside
+      ((class "sidenote") (role "note"))
+      (sup ((class "sidenote-number")) "1")
+      "1st")
+    (aside
+      ((class "sidenote") (role "note"))
+      (sup ((class "sidenote-number")) "2")
+      "2nd")
+    (ol (li "a" (sup ((class "sidenote-number")) "4")) (li "b"))
+    (aside
+      ((class "sidenote") (role "note"))
+      (sup ((class "sidenote-number")) "4")
+      "In list.")
+    (aside
+      ((class "sidenote") (role "note"))
+      (sup ((class "sidenote-number")) "3")
+      "3rd")))
 
   (check-equal? (decode-sidenotes input) expected)
   )
diff --git a/rkt/tags.rkt b/rkt/tags.rkt
index b469938..0b85e83 100644
--- a/rkt/tags.rkt
+++ b/rkt/tags.rkt
@@ -165,12 +165,14 @@
 
 
 (define (subhead x)
+  (define id (to-name x))
   `(h2
-    (a [[name ,(to-name x)]] ,x)))
+    (a [[name ,id] [id ,id]] ,x)))
 
 (define (subhead3 x)
+  (define id (to-name x))
    `(h3
-     (a [[name ,(to-name x)]] ,x)))
+     (a [[name ,id] [id ,id]] ,x)))
 
 (define (li-plus . txt)
    `(li ((class "plus")) ,@txt))
@@ -222,6 +224,19 @@
       `()
       `((class ,(string-join classes)))))
 
+(module+ test
+  (require rackunit)
+  (check-equal? (stable
+                  "Person             Swedish krona" "\n" "Sneaky Steve       7 000 SEK" "\n" "Honest Harry       1 000 SEK")
+                '(div
+                   ((class "centered"))
+                   (table
+                     ()
+                     (thead (tr (th "Person") (th "Swedish krona")))
+                     (tbody
+                       (tr (td "Sneaky Steve") (td "7 000 SEK"))
+                       (tr (td "Honest Harry") (td "1 000 SEK")))))
+                ))
 
 (define (epigraph  . txt)
   `(div ((class "epigraph"))
@@ -352,11 +367,12 @@
 
 (define (img #:src src
              #:alt alt
+             #:decorative [decorative #f]
              #:title [title #f]
              #:class [c #f]
              #:margin [margin #f]
              #:link [link #f] . caption)
-  (define attrs `())
+  (define attrs `((role "group")))
   (when c
     (set! attrs (cons `(class ,c) attrs)))
   (when title
@@ -373,17 +389,32 @@
 
   `(figure
      ,attrs
-     ,(raw-img #:src src #:link link #:alt alt)
+     ,(raw-img #:src src #:link link #:alt alt #:decorative decorative)
      ,figcaption))
 
-(define (raw-img #:src src #:link [link #f] #:alt alt)
+(define (raw-img #:src src #:link [link #f] #:alt alt #:decorative [decorative #f])
+  (define attrs `((src ,(~a src)) (alt ,alt)))
+  (when decorative
+    (set! attrs (cons `(role "presentation") attrs)))
   (define img
-     `(img ((src ,(~a src)) (alt ,alt))))
+     `(img ,attrs))
   (if link
       `(a ((href ,src) (target "_blank") (class "img-wrapper"))
           ,img)
       img))
 
+(module+ test
+  (require rackunit)
+  (check-equal? (raw-img #:src "/src.png" #:alt "alt")
+                `(img ((src "/src.png") (alt "alt"))))
+  (check-equal? (raw-img #:src "/src.png" #:alt "alt" #:decorative #t)
+                `(img ((role "presentation") (src "/src.png") (alt "alt"))))
+
+  (check-equal? (img #:src "/src.png" #:alt "alt" #:decorative #t)
+                `(figure ((role "group"))
+                         (img ((role "presentation") (src "/src.png") (alt "alt")))
+                         (figcaption))))
+
 ;; FIXME rename to figcaption
 (define (decoded-figcaption . args)
   `(figcaption ,@(std-decode args)))
diff --git a/sass/chapter.scss b/sass/chapter.scss
index 729f989..c120110 100644
--- a/sass/chapter.scss
+++ b/sass/chapter.scss
@@ -2,103 +2,101 @@ $fullwidth: 1220px;
 $sidenote-float-width: 1280px;
 
 .chapter {
-    max-width: 800px;
-    //background-color: lightyellow;
-    flex: 1 1 auto;
-    margin: 0.5rem 1.2rem;
+  max-width: 800px;
+  //background-color: lightyellow;
+  flex: 1 1 auto;
+  margin: 0.5rem 1.2rem;
 }
 
 %fullwidth {
-    width: 100%;
+  width: 100%;
 }
 
 @media (min-width: $sidenote-float-width) {
-    %fullwidth {
-        width: $fullwidth;
-    }
+  %fullwidth {
+    width: $fullwidth;
+  }
 }
 
-
 /*
  * Header
  */
-.chapter > header {
-    h2 {
-        font-weight: normal;
-        font-style: italic;
-        font-size: 1rem;
+.chapter header {
+  h2 {
+    font-weight: normal;
+    font-style: italic;
+    font-size: 1rem;
 
-        margin-top: 0.4em;
-        margin-bottom: 0.8em;
-    }
+    margin-top: 0.4em;
+    margin-bottom: 0.8em;
+  }
 }
 
-.chapter > header > .date {
-    text-align: right;
-    font-size: 0.7rem;
-    margin-top: -0.2rem;
-    margin-bottom: 0.4rem;
-    @extend %sans-serif;
-    color: $body-font-color2;
+.chapter header > .date {
+  text-align: right;
+  font-size: 0.7rem;
+  margin-top: -0.2rem;
+  margin-bottom: 0.4rem;
+  @extend %sans-serif;
+  color: $body-font-color2;
 
-    .published {
-        margin-right: 0.4rem;
-    }
+  .published {
+    margin-right: 0.4rem;
+  }
 }
 
 @media (min-width: $sidenote-float-width) {
-    .chapter > header > .date {
-        text-align: left;
-
-        float: right;
-        margin-top: -3rem;
-        margin-right: -420px;
-        width: 380px;
-        .published {
-            display: block;
-        }
-        .update {
-            display: block;
-        }
+  .chapter header > .date {
+    text-align: left;
+
+    float: right;
+    margin-top: -3rem;
+    margin-right: -420px;
+    width: 380px;
+    .published {
+      display: block;
+    }
+    .update {
+      display: block;
     }
+  }
 }
 
 .where a {
-    text-decoration: none;
-    background: none;
-    text-shadow: none;
+  text-decoration: none;
+  background: none;
+  text-shadow: none;
 }
 .where a:hover {
-    text-decoration: underline;
+  text-decoration: underline;
 }
 
 .where {
-    font-size: 0.8rem;
-    @extend %sans-serif;
-    margin-bottom: 0.8rem;
-    color: $eth-dark-gray;
+  font-size: 0.8rem;
+  @extend %sans-serif;
+  margin-bottom: 0.8rem;
+  color: $eth-dark-gray;
 }
 .where .home {
-    @extend %sans-serif;
+  @extend %sans-serif;
 }
 .where .up {
 }
 .where .divider {
-    font-size: 0.65rem;
-    color: $eth-light-gray;
+  font-size: 0.65rem;
+  color: $eth-light-gray;
 }
 
 /*
  * Headers
  */
 .chapter h2 > a:hover {
-    color: $body-font-color;
+  color: $body-font-color;
 }
 .chapter h3 > a:hover {
-    color: $body-font-color;
+  color: $body-font-color;
 }
 
-
 /*
  * Lists
  */
@@ -106,922 +104,922 @@ $first-list-offset: -1.3rem;
 $list-p-margin: 0.6em;
 
 .chapter {
-    ul, ol {
-        list-style: none;
-        margin: 1rem 0 1rem 2em;
-        p {
-            margin-bottom: $list-p-margin;
-        }
-    }
-    ol {
-        counter-reset: foobar;
-    }
-    ol li, ul li {
-        margin-bottom: 0.4em;
-        font-size: 95%;
-        line-height: 1.35;
-    }
-
-    ol > li::before {
-        @extend %sans-serif;
-        counter-increment: foobar;
-        content: counter(foobar);
-        color: $body-list-sym-color;
-    }
-    ul > li::before {
-        @extend %sans-serif;
-        //content: "⭑";
-        //content: "~";
-        //content: "≈";
-        //content: "→";
-        //content: "»";
-        //content: "*";
-        content: "•";
-        //content: "†";
-        color: $body-list-sym-color;
-    }
-    ul > li > p:first-child, ol > li > p:first-child {
-        // To avoid li signifier on a line of it's own
-        margin-top: $first-list-offset;
-    }
-    ul > li::before, ol > li::before {
-        // Avoid floats here as sidenotes may interfere
-        margin-left: -2em;
-        padding-right: 1.5em;
-    }
+  ul,
+  ol {
+    list-style: none;
+    margin: 1rem 0 1rem 2em;
+    p {
+      margin-bottom: $list-p-margin;
+    }
+  }
+  ol {
+    counter-reset: foobar;
+  }
+  ol li,
+  ul li {
+    margin-bottom: 0.4em;
+    font-size: 95%;
+    line-height: 1.35;
+  }
 
-    // Description lists
-    dl {
-        font-size: 95%;
-        line-height: 1.35;
-        margin-bottom: 1rem;
-    }
-    dl > dt {
-        font-weight: bold;
-        margin-left: 1em;
-    }
-    dl > dd {
-        margin-left: 2em;
-        margin-bottom: $list-p-margin;
-    }
+  ol > li::before {
+    @extend %sans-serif;
+    counter-increment: foobar;
+    content: counter(foobar);
+    color: $body-list-sym-color;
+  }
+  ul > li::before {
+    @extend %sans-serif;
+    //content: "⭑";
+    //content: "~";
+    //content: "≈";
+    //content: "→";
+    //content: "»";
+    //content: "*";
+    content: "•";
+    //content: "†";
+    color: $body-list-sym-color;
+  }
+  ul > li > p:first-child,
+  ol > li > p:first-child {
+    // To avoid li signifier on a line of it's own
+    margin-top: $first-list-offset;
+  }
+  ul > li::before,
+  ol > li::before {
+    // Avoid floats here as sidenotes may interfere
+    margin-left: -2em;
+    padding-right: 1.5em;
+  }
+
+  // Description lists
+  dl {
+    font-size: 95%;
+    line-height: 1.35;
+    margin-bottom: 1rem;
+  }
+  dl > dt {
+    font-weight: bold;
+    margin-left: 1em;
+  }
+  dl > dd {
+    margin-left: 2em;
+    margin-bottom: $list-p-margin;
+  }
 }
 
-.chapter > .subnav {
-    margin-top: 1.5rem;
-    @extend %sans-serif;
+.chapter .subnav {
+  margin-top: 1.5rem;
+  @extend %sans-serif;
 
-    .chapters {
-        font-size: 1.1rem;
-        font-weight: bold;
-    }
+  .chapters {
+    font-size: 1.1rem;
+    font-weight: bold;
+  }
 
-    ul {
-        list-style: none;
-        margin: 0;
-    }
-    ul > li {
-        font-size: 100%;
-        margin-left: 0.6rem;
-        margin-top: 0.3rem;
-    }
-    ul > li::before {
-        display: none;
-    }
+  ul {
+    list-style: none;
+    margin: 0;
+  }
+  ul > li {
+    font-size: 100%;
+    margin-left: 0.6rem;
+    margin-top: 0.3rem;
+  }
+  ul > li::before {
+    display: none;
+  }
 
-    a {
-        background: none;
-        text-shadow: none;
-    }
-    a:hover {
-        text-decoration: underline;
-    }
+  a {
+    background: none;
+    text-shadow: none;
+  }
+  a:hover {
+    text-decoration: underline;
+  }
 
-    .planned {
-        color: $planned-chapter-link;
-    }
+  .planned {
+    color: $planned-chapter-link;
+  }
 }
 
-
 /*
  * Horizontal rules
  */
 .chapter hr {
-    margin: 1em auto;
+  margin: 1em auto;
 
-    border: 0;
-    border-bottom: 1px solid $body-hr-color;
+  border: 0;
+  border-bottom: 1px solid $body-hr-color;
 }
 
-
 /*
  * Quotes
  */
 blockquote {
-    font-size: 95%;
-    line-height: 1.4;
-    margin: 2em;
+  font-size: 95%;
+  line-height: 1.4;
+  margin: 2em;
 }
 blockquote > footer {
-    font-size: 80%;
-    text-align: right;
+  font-size: 80%;
+  text-align: right;
 }
 blockquote > footer > cite {
-    font-style: italic;
+  font-style: italic;
 }
 blockquote .emphasis {
-    font-size: 80%;
+  font-size: 80%;
 }
 blockquote.center {
-    text-align: center;
+  text-align: center;
 }
 
 // Should we shut it down for small text?
 //blockquote > footer a:link {
-    //text-decoration: underline;
-    //background: none;
-    //text-shadow: none;
+//text-decoration: underline;
+//background: none;
+//text-shadow: none;
 //}
 
 .epigraph {
-    margin: 2em 0;
+  margin: 2em 0;
 
-    blockquote {
-        font-size: 1rem;
-        font-style: italic; // Regular shouldn't be italic?
-    }
-    blockquote > footer {
-        font-style: normal;
-    }
+  blockquote {
+    font-size: 1rem;
+    font-style: italic; // Regular shouldn't be italic?
+  }
+  blockquote > footer {
+    font-style: normal;
+  }
 }
 
-
 /*
  * Tables
  */
 table {
-    @extend %sans-serif-tnum;
-    font-size: 0.95rem;
-    margin-bottom: 1rem;
+  @extend %sans-serif-tnum;
+  font-size: 0.95rem;
+  margin-bottom: 1rem;
 
-    display: block;
-    overflow-x: auto;
-    white-space: nowrap;
+  display: block;
+  overflow-x: auto;
+  white-space: nowrap;
 }
-th, td {
-    text-align: left;
-    padding: 0.1em 1.5em 0.1em 0em;
+th,
+td {
+  text-align: left;
+  padding: 0.1em 1.5em 0.1em 0em;
 }
 // Had tons of trouble centering a table which could also
 // overflow on x.
 .centered {
-    display: flex;
-    justify-content: center;
+  display: flex;
+  justify-content: center;
 }
 
-
 /*
  * Code
  */
-pre, code {
-    font-family: $code-font-family;
-    font-size: 0.83rem;
-    line-height: 1.45;
+pre,
+code {
+  font-family: $code-font-family;
+  font-size: 0.83rem;
+  line-height: 1.45;
 }
 code {
-    //background-color: tomato;
+  //background-color: tomato;
 }
 pre {
-    overflow-wrap: normal;
-    overflow: auto;
+  overflow-wrap: normal;
+  overflow: auto;
 
-    margin-bottom: 1rem;
-    padding: 0.4rem 0.6rem;
+  margin-bottom: 1rem;
+  padding: 0.4rem 0.6rem;
 }
 li pre {
-    margin-bottom: $list-p-margin;
+  margin-bottom: $list-p-margin;
 }
 .sidenote code {
-    font-size: 0.65rem;
-    line-height: 1.4;
-    //white-space: nowrap;
+  font-size: 0.65rem;
+  line-height: 1.4;
+  //white-space: nowrap;
 }
 
-
 /*
  * Misc
  */
 .def {
-    font-style: italic;
+  font-style: italic;
 }
 cite.book {
-    font-style: normal;
+  font-style: normal;
 }
 
-
 /*
  * Side content
  */
 .side-space {
-    // Serves to take up space. Inline content from the chapter is floated on top.
-    width: 420px;
-    //background-color: antiquewhite;
-    // Avoids swallowing clicks and interactions intended for wider images
-    visibility: hidden;
+  // Serves to take up space. Inline content from the chapter is floated on top.
+  width: 420px;
+  //background-color: antiquewhite;
+  // Avoids swallowing clicks and interactions intended for wider images
+  visibility: hidden;
 }
 
 .sidenote {
-    @extend %sans-serif;
-    font-size: 0.8rem;
+  @extend %sans-serif;
+  font-size: 0.8rem;
 }
-.sidenote img, {
-    max-width: 100%;
+.sidenote img {
+  max-width: 100%;
 }
 .sidenote .sidenote-number {
-    padding-right: 0.2rem;
+  padding-right: 0.2rem;
 }
-.sidenote-number, .sidenote-label {
-    font-family: $sans-serif-font-family;
-    //vertical-align: super;
-    font-size: 0.7em;
-    display: inline-block;
-    //background-color: tomato;
+.sidenote-number,
+.sidenote-label {
+  font-family: $sans-serif-font-family;
+  //vertical-align: super;
+  font-size: 0.7em;
+  display: inline-block;
+  //background-color: tomato;
 }
 
 .sidenote .talking {
-    .row:before {
-        content: "–";
-        padding-right: 0.3rem;
-    }
+  .row:before {
+    content: "–";
+    padding-right: 0.3rem;
+  }
 }
 
 @media (max-width: $sidenote-float-width - 1) {
-    .sidenote {
-        display: block;
-        margin: 1em 4em 1.4em 4em !important;
-
-        img {
-            display: block;
-            margin: 0 auto;
-        }
-        code {
-            max-width: 101%;
-        }
-    }
-    //.sidenote { background-color: lightblue; }
-}
-@media (min-width: $sidenote-float-width) {
-    .side-space {
-        display: block;
-    }
-    .sidenote {
-        float: right;
-        clear: right;
-        // Approximate adjustment for notes at the last line of a paragraph.
-        // Will get overridden by local styles.
-        margin-top: -2em;
-        margin-bottom: 4em;
-        margin-right: -420px;
-        width: 380px;
-        position: relative;
-        display: inline-block;
-        //background-color: moccasin;
-    }
-    blockquote .sidenote {
-        margin-right: -462px;
+  .sidenote {
+    display: block;
+    margin: 1em 4em 1.4em 4em !important;
+
+    img {
+      display: block;
+      margin: 0 auto;
     }
     code {
-        max-width: 380px;
+      max-width: 101%;
     }
-    //.sidenote { background-color: pink; }
+  }
+  //.sidenote { background-color: lightblue; }
+}
+@media (min-width: $sidenote-float-width) {
+  .side-space {
+    display: block;
+  }
+  .sidenote {
+    float: right;
+    clear: right;
+    // Approximate adjustment for notes at the last line of a paragraph.
+    // Will get overridden by local styles.
+    margin-top: -2em;
+    margin-bottom: 4em;
+    margin-right: -420px;
+    width: 380px;
+    position: relative;
+    display: inline-block;
+    //background-color: moccasin;
+  }
+  blockquote .sidenote {
+    margin-right: -462px;
+  }
+  code {
+    max-width: 380px;
+  }
+  //.sidenote { background-color: pink; }
 }
-
 
 /*
  * Donations
  */
 .donations {
-    margin: 1rem 0;
-    margin-left: 0.5rem;
+  margin: 1rem 0;
+  margin-left: 0.5rem;
 }
 .donation-label {
-    @extend %sans-serif;
-    font-size: 0.9rem;
-    font-weight: bold;
-    color: $body-font-color;
-    cursor: pointer;
-    text-decoration: underline;
+  @extend %sans-serif;
+  font-size: 0.9rem;
+  font-weight: bold;
+  color: $body-font-color;
+  cursor: pointer;
+  text-decoration: underline;
 }
 .donation-label:hover {
-    color: $body-link-hover-color;
+  color: $body-link-hover-color;
 }
 .donation-toggle {
-    display: none;
+  display: none;
 }
 .donation-content {
-    display: none;
+  display: none;
 }
 .donation-toggle:checked + .donation-content {
-    display: block;
-    text-align: center;
-    padding-top: 0.2rem;
+  display: block;
+  text-align: center;
+  padding-top: 0.2rem;
 }
 .donation-content .qr {
-    margin-right: 0.5em;
+  margin-right: 0.5em;
 }
 .donation-content .address {
-    font-family: $triplicate;
-    font-size: 0.9rem;
-    word-wrap: break-word;
+  font-family: $triplicate;
+  font-size: 0.9rem;
+  word-wrap: break-word;
 }
 
-
 /*
  * Images
  */
 a.img-wrapper:link {
-    background: none;
-    text-shadow: none;
+  background: none;
+  text-shadow: none;
 }
 a.img-wrapper:hover {
-    @include a-background(#333);
+  @include a-background(#333);
 }
 
-
 /*
  * Figures
  */
 figure {
-    margin-bottom: 1rem;
-    text-align: center;
+  margin-bottom: 1rem;
+  text-align: center;
 
-    img {
-        max-width: 100%;
-    }
-    > figcaption {
-        @extend %sans-serif;
-        font-size: 0.9rem;
-    }
+  img {
+    max-width: 100%;
+  }
+  > figcaption {
+    @extend %sans-serif;
+    font-size: 0.9rem;
+  }
 }
 figure.fullwidth {
-    img {
-        width: 100%;
-    }
+  img {
+    width: 100%;
+  }
 }
 figure.slim {
-    margin: 0;
+  margin: 0;
 }
 figcaption.margin {
-    @extend %sans-serif;
+  @extend %sans-serif;
 }
 
 @media (min-width: $sidenote-float-width) {
-    figure.fullwidth {
-        width: $fullwidth;
-    }
-    figcaption.margin {
-        font-size: 0.8rem;
-        float: right;
-        clear: right;
-        margin-right: -420px;
-        margin-bottom: 2rem;
-        width: 380px;
-        position: relative;
-        display: inline-block;
-        text-align: left;
-    }
-    // Override the above in a fullwidth image. Not sure how to avoid this?
-    figure.fullwidth > figcaption.margin {
-        font-size: 0.9rem;
-        float: none;
-        margin: 0;
-        position: static;
-        display: block;
-        text-align: center;
-        width: 100%;
-    }
+  figure.fullwidth {
+    width: $fullwidth;
+  }
+  figcaption.margin {
+    font-size: 0.8rem;
+    float: right;
+    clear: right;
+    margin-right: -420px;
+    margin-bottom: 2rem;
+    width: 380px;
+    position: relative;
+    display: inline-block;
+    text-align: left;
+  }
+  // Override the above in a fullwidth image. Not sure how to avoid this?
+  figure.fullwidth > figcaption.margin {
+    font-size: 0.9rem;
+    float: none;
+    margin: 0;
+    position: static;
+    display: block;
+    text-align: center;
+    width: 100%;
+  }
 }
 
 figure .sidenote {
-    text-align: left;
+  text-align: left;
 }
 
-
 /*
  * Misc
  */
 .whitepaper {
-    display: flex;
-    justify-content: center;
-    width: 100%;
-    margin-bottom: 1rem;
+  display: flex;
+  justify-content: center;
+  width: 100%;
+  margin-bottom: 1rem;
 
-    a {
-        @extend %sans-serif;
-        font-size: 1.05rem;
-    }
+  a {
+    @extend %sans-serif;
+    font-size: 1.05rem;
+  }
 }
 
 .todo {
-    @extend %sans-serif;
-    font-size: 0.8rem;
-    margin: 1rem 1rem;
+  @extend %sans-serif;
+  font-size: 0.8rem;
+  margin: 1rem 1rem;
 
-    .pre {
-        font-weight: bold;
-    }
-    .txt {
-    }
+  .pre {
+    font-weight: bold;
+  }
+  .txt {
+  }
 }
 
 .story {
-    padding: 1rem 0;
-    margin: 1.5rem 0;
-    border-top: 1px dashed $body-hr-color;
-    border-bottom: 1px dashed $body-hr-color;
-
-    .talk:before {
-        content: "–";
-        padding-right: 0.3rem;
-    }
-    .talk:not(:first-child) {
-        margin-top: 0.6rem;
-    }
+  padding: 1rem 0;
+  margin: 1.5rem 0;
+  border-top: 1px dashed $body-hr-color;
+  border-bottom: 1px dashed $body-hr-color;
 
-    // Avoid double spacing at the bottom.
-    p:last-of-type {
-        margin-bottom: 0;
-    }
-    // Avoid ugly spacing when sidenote is placed at the end.
-    .sidenote:last-child {
-        margin-bottom: 0 !important;
-    }
+  .talk:before {
+    content: "–";
+    padding-right: 0.3rem;
+  }
+  .talk:not(:first-child) {
+    margin-top: 0.6rem;
+  }
+
+  // Avoid double spacing at the bottom.
+  p:last-of-type {
+    margin-bottom: 0;
+  }
+  // Avoid ugly spacing when sidenote is placed at the end.
+  .sidenote:last-child {
+    margin-bottom: 0 !important;
+  }
 }
 
 .story-talking {
 }
 
-
-.appendix, .error {
-    max-width: 600px;
+.appendix,
+.error {
+  max-width: 600px;
 }
 
 .fullwidth {
-    @extend %fullwidth;
+  @extend %fullwidth;
 }
 
 table.crypto-eval {
-    th, td {
-        padding: 0.1em 0.6em;
-    }
-    td {
-        text-align: left;
-    }
-    td.ths {
-        font-weight: bold;
-        text-align: center;
-    }
-    td.tds {
-        font-weight: bold;
-    }
-    td.poor {
-        background-color: $poor;
-        text-align: center;
-    }
-    td.good {
-        background-color: $good;
-        text-align: center;
-    }
-    td.excellent {
-        background-color: $excellent;
-        text-align: center;
-    }
+  th,
+  td {
+    padding: 0.1em 0.6em;
+  }
+  td {
+    text-align: left;
+  }
+  td.ths {
+    font-weight: bold;
+    text-align: center;
+  }
+  td.tds {
+    font-weight: bold;
+  }
+  td.poor {
+    background-color: $poor;
+    text-align: center;
+  }
+  td.good {
+    background-color: $good;
+    text-align: center;
+  }
+  td.excellent {
+    background-color: $excellent;
+    text-align: center;
+  }
 }
 
 table.legal-moral {
-    th, td {
-        padding: 0.1em 1.0em 0.1em 0.5em;
-    }
-    td {
-        text-align: center;
-    }
-    td.ths {
-        font-weight: bold;
-        text-align: center;
-    }
-    td.tds {
-        font-weight: bold;
-        text-align: right;
-    }
-
-    .good {
-        background-color: $legal-moral;
-    }
-    .moral-illegal {
-        background-color: $illegal-moral;
-    }
-    .immoral-legal {
-        background-color: $legal-immoral;
-    }
-    .bad {
-        background-color: $illegal-immoral;
-    }
+  th,
+  td {
+    padding: 0.1em 1em 0.1em 0.5em;
+  }
+  td {
+    text-align: center;
+  }
+  td.ths {
+    font-weight: bold;
+    text-align: center;
+  }
+  td.tds {
+    font-weight: bold;
+    text-align: right;
+  }
+
+  .good {
+    background-color: $legal-moral;
+  }
+  .moral-illegal {
+    background-color: $illegal-moral;
+  }
+  .immoral-legal {
+    background-color: $legal-immoral;
+  }
+  .bad {
+    background-color: $illegal-immoral;
+  }
 }
 
 table.address-examples {
-    td.ths {
-        font-weight: bold;
-    }
-    td.tdc {
-        //font-weight: bold;
-    }
+  td.ths {
+    font-weight: bold;
+  }
+  td.tdc {
+    //font-weight: bold;
+  }
 }
 
 .sans {
-    @extend %sans-serif;
+  @extend %sans-serif;
 }
 .sans-tnum {
-    @extend %sans-serif-tnum;
+  @extend %sans-serif-tnum;
 }
 
 .strikethrough {
-    text-decoration: line-through;
+  text-decoration: line-through;
 }
 
 .chapter .subscribe {
-    max-width: 25em;
+  max-width: 25em;
 }
 
 .money-examples .example {
-    width: 100%;
+  width: 100%;
+  margin-bottom: 1em;
+  display: flex;
+
+  .txt {
+    margin: 0 0.5em;
+  }
+
+  img {
+    flex-shrink: 0;
+    align-self: center;
+    max-width: 10em;
     margin-bottom: 1em;
+  }
+  h3 {
+    margin-top: 0;
+  }
+  .header {
+    font-size: 1.1rem;
+    @extend %sans-serif;
+    line-height: 1;
     display: flex;
-
-    .txt {
-        margin: 0 0.5em;
-    }
-
-    img {
-        flex-shrink: 0;
-        align-self: center;
-        max-width: 10em;
-        margin-bottom: 1em;
-    }
-    h3 {
-        margin-top: 0;
-    }
-    .header {
-        font-size: 1.1rem;
-        @extend %sans-serif;
-        line-height: 1;
-        display: flex;
-    }
-    .date {
-        margin-left: 0.5rem;
-    }
+  }
+  .date {
+    margin-left: 0.5rem;
+  }
 }
 
 .inflation-examples .example {
-    //margin: 0 0.5em 1em 0.5em;
-    margin: 1em 0;
-
-    h3 {
-        margin-top: 0;
-    }
-    .header {
-        font-size: 1.1rem;
-        @extend %sans-serif;
-        line-height: 1;
-        display: flex;
-    }
-    .date {
-        margin-left: 0.5rem;
-    }
-    .txt {
-        margin-left: 0.5rem;
-    }
+  //margin: 0 0.5em 1em 0.5em;
+  margin: 1em 0;
+
+  h3 {
+    margin-top: 0;
+  }
+  .header {
+    font-size: 1.1rem;
+    @extend %sans-serif;
+    line-height: 1;
+    display: flex;
+  }
+  .date {
+    margin-left: 0.5rem;
+  }
+  .txt {
+    margin-left: 0.5rem;
+  }
 }
 
 .wikileaks {
-    padding-top: 1em;
-    margin-bottom: 1em;
-    //margin: 1.5em 0;
-    border-top: 1px dashed $body-hr-color;
-    border-bottom: 1px dashed $body-hr-color;
+  padding-top: 1em;
+  margin-bottom: 1em;
+  //margin: 1.5em 0;
+  border-top: 1px dashed $body-hr-color;
+  border-bottom: 1px dashed $body-hr-color;
 }
 
 .wikileaks .entry:not(:first-child) {
-    margin-top: 1.5em;
+  margin-top: 1.5em;
 }
 
 .wikileaks .entry {
-    width: 100%;
+  width: 100%;
 
-    h3 {
-        margin-top: 0;
-    }
-    > .header {
-        font-size: 1.1rem;
-        @extend %sans-serif;
-        line-height: 1;
-        display: flex;
-        flex-wrap: wrap;
-        //margin-bottom: 0.3rem;
-    }
-    > .header > h3 {
-        margin-right: 0.5rem;
-        margin-bottom: 0.3rem;
-    }
-    > .header > .date {
-        margin-bottom: 0.3rem;
-    }
-
-    .caution {
-        margin-top: 0.5em;
-        margin-bottom: 0.8em;
-        margin-left: 1em;
-        font-size: 90%;
-    }
+  h3 {
+    margin-top: 0;
+  }
+  > .header {
+    font-size: 1.1rem;
+    @extend %sans-serif;
+    line-height: 1;
+    display: flex;
+    flex-wrap: wrap;
+    //margin-bottom: 0.3rem;
+  }
+  > .header > h3 {
+    margin-right: 0.5rem;
+    margin-bottom: 0.3rem;
+  }
+  > .header > .date {
+    margin-bottom: 0.3rem;
+  }
+
+  .caution {
+    margin-top: 0.5em;
+    margin-bottom: 0.8em;
+    margin-left: 1em;
+    font-size: 90%;
+  }
 }
 
 .snowden-leaks > li.leak > .title {
-    margin-top: $first-list-offset;
-    margin-bottom: $list-p-margin;
-    font-weight: bold;
+  margin-top: $first-list-offset;
+  margin-bottom: $list-p-margin;
+  font-weight: bold;
 }
 
 .wikileaks li.leak {
-    margin-bottom: 2em;
+  margin-bottom: 2em;
 
-    > .title {
-        margin-top: $first-list-offset;
-        margin-bottom: $list-p-margin;
-        font-weight: bold;
-    }
+  > .title {
+    margin-top: $first-list-offset;
+    margin-bottom: $list-p-margin;
+    font-weight: bold;
+  }
 
-    .transcript {
-        margin: 1rem 0;
-        padding-left: 1rem;
-        font-size: 95%;
-        line-height: 1.4;
-        border-left: 1px solid $body-hr-color;
-    }
+  .transcript {
+    margin: 1rem 0;
+    padding-left: 1rem;
+    font-size: 95%;
+    line-height: 1.4;
+    border-left: 1px solid $body-hr-color;
+  }
 }
 
 .wikileaks .transcript-wrapper {
-    margin: 1.5em 0;
-    border-top: 1px dashed $body-hr-color;
-    border-bottom: 1px dashed $body-hr-color;
+  margin: 1.5em 0;
+  border-top: 1px dashed $body-hr-color;
+  border-bottom: 1px dashed $body-hr-color;
 }
 
-
 .wikileaks .transcript > .row {
-    width: 100%;
-    display: flex;
-    justify-content: flex-start;
-
-    > .time {
-        margin-right: 1.5rem;
-        flex: none;
-    }
-    > .txt {
+  width: 100%;
+  display: flex;
+  justify-content: flex-start;
 
-    }
+  > .time {
+    margin-right: 1.5rem;
+    flex: none;
+  }
+  > .txt {
+  }
 }
 
-
-
 @media only screen and (min-width: 521px) {
-    .money-examples .example:nth-child(even) {
-        justify-content: space-between;
-        img {
-            order: 9;
-            margin-right: 0;
-        }
+  .money-examples .example:nth-child(even) {
+    justify-content: space-between;
+    img {
+      order: 9;
+      margin-right: 0;
     }
+  }
 }
 
 @media only screen and (max-width: 520px) {
-    .money-examples .example {
-        flex-wrap: wrap;
-        justify-content: flex-start;
-        flex-direction: column;
-
-        .txt {
-            width: 100%;
-            order: 1;
-        }
-        img {
-            order: 0;
-        }
+  .money-examples .example {
+    flex-wrap: wrap;
+    justify-content: flex-start;
+    flex-direction: column;
+
+    .txt {
+      width: 100%;
+      order: 1;
+    }
+    img {
+      order: 0;
     }
+  }
 }
 ul > li.plus:before {
-    font-family: $code-font-family;
-    content: "+";
+  font-family: $code-font-family;
+  content: "+";
 }
 ul > li.neg:before {
-    font-family: $code-font-family;
-    content: "-";
+  font-family: $code-font-family;
+  content: "-";
 }
 ul.talking > li:before {
-    content: "–";
+  content: "–";
 }
 
 .qt-tab {
-    padding-left: 1.2rem;
+  padding-left: 1.2rem;
 }
 
 /*
  * Pretty video embedding
  */
 .video-wrapper {
-    //@extend %media-offset-wrapper;
-    //margin: 1em 0;
+  //@extend %media-offset-wrapper;
+  //margin: 1em 0;
 }
 .video-container {
-    position: relative;
-    padding-bottom: 56.25%;
-    padding-top: 30px;
-    height: 0;
-    overflow: hidden;
+  position: relative;
+  padding-bottom: 56.25%;
+  padding-top: 30px;
+  height: 0;
+  overflow: hidden;
 }
 
-.video-container iframe, .video-container object, .video-container embed {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
+.video-container iframe,
+.video-container object,
+.video-container embed {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
 }
 
 table.address-message {
-    font-family: $code-font-family;
-    font-size: 0.71rem;
-    line-height: 1.45;
-    //font-style: italic;
-    .msg-char {
-        padding: 0 0.2em;
-        font-weight: bold;
-    }
+  font-family: $code-font-family;
+  font-size: 0.71rem;
+  line-height: 1.45;
+  //font-style: italic;
+  .msg-char {
+    padding: 0 0.2em;
+    font-weight: bold;
+  }
 }
 
-
 /*
  * Legacy HN
  */
 .hn {
-    font-size: 0.8rem;
-    font-family: Verdana;
+  font-size: 0.8rem;
+  font-family: Verdana;
+  color: #828282;
+  background-color: #f6f6ef;
+  margin: 1rem;
+  overflow-x: hidden;
+  white-space: nowrap;
+
+  a:link {
+    text-shadow: none;
+    background: none;
+    color: #000;
+  }
+  a:visited {
     color: #828282;
-    background-color: #f6f6ef;
-    margin: 1rem;
-    overflow-x: hidden;
-    white-space: nowrap;
-
-    a:link {
-        text-shadow: none;
-        background: none;
-        color: #000;
-    }
-    a:visited {
-        color:#828282;
-    }
+  }
 }
 .hn table {
-    font-size: 0.8rem;
-    font-family: Verdana;
-    padding: 0 0 0.2rem 0.4rem;
+  font-size: 0.8rem;
+  font-family: Verdana;
+  padding: 0 0 0.2rem 0.4rem;
+  margin: 0;
+  overflow-x: hidden;
+  white-space: nowrap;
+
+  th,
+  td {
     margin: 0;
-    overflow-x: hidden;
-    white-space: nowrap;
-
-    th, td {
-        margin: 0;
-        padding: 0;
-    }
-    .title {
-        font-size: 1em;
-    }
-    .comhead {
-        font-size: 0.8em;
-    }
-    .subtext {
-        font-size: 0.7em;
-    }
-    .comhead a:link, .subtext a:link, .subtext a:visited {
-        color:#828282;
-    }
-    .subtext a:hover, .comhead a:hover {
-        text-decoration: underline;
-    }
-    .arrow {
-        font-size: 0.65em;
-        color: #b3b3b3;
-        margin-left: 0.4em;
-        margin-right: 0.3em;
-        position: relative;
-        top: -0.12em;
-        cursor: pointer;
-    }
+    padding: 0;
+  }
+  .title {
+    font-size: 1em;
+  }
+  .comhead {
+    font-size: 0.8em;
+  }
+  .subtext {
+    font-size: 0.7em;
+  }
+  .comhead a:link,
+  .subtext a:link,
+  .subtext a:visited {
+    color: #828282;
+  }
+  .subtext a:hover,
+  .comhead a:hover {
+    text-decoration: underline;
+  }
+  .arrow {
+    font-size: 0.65em;
+    color: #b3b3b3;
+    margin-left: 0.4em;
+    margin-right: 0.3em;
+    position: relative;
+    top: -0.12em;
+    cursor: pointer;
+  }
 }
 
 .hn .header {
-    font-size: 0.8rem;
-    font-family: Verdana;
-    background-color: #ff6600;
-    margin: 0;
-    padding: 0;
-    margin-bottom: 0.4rem;
-    height: 1.3rem;
-    text-align: left;
-
+  font-size: 0.8rem;
+  font-family: Verdana;
+  background-color: #ff6600;
+  margin: 0;
+  padding: 0;
+  margin-bottom: 0.4rem;
+  height: 1.3rem;
+  text-align: left;
+
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+
+  .logo a {
     display: flex;
-    justify-content: flex-start;
+    justify-content: center;
     align-items: center;
-
-    .logo a {
-        display: flex;
-        justify-content: center;
-        align-items: center;
-    }
-    .logo a img {
-        border: 1px #fff solid;
-        max-width: 20px;
-        max-height: 20px;
-        margin: 0 0.2rem;
-    }
-    .pagetop {
-        font-size: 1em;
-        color:#222222;
-    }
-    .pagetop a:visited {
-        color:#000000;
-    }
-    .hn-title {
-        font-weight: bold;
-        margin-right: 0.8em;
-    }
+  }
+  .logo a img {
+    border: 1px #fff solid;
+    max-width: 20px;
+    max-height: 20px;
+    margin: 0 0.2rem;
+  }
+  .pagetop {
+    font-size: 1em;
+    color: #222222;
+  }
+  .pagetop a:visited {
+    color: #000000;
+  }
+  .hn-title {
+    font-weight: bold;
+    margin-right: 0.8em;
+  }
 }
 
 .fractional-table-ex {
-    @extend %sans-serif-tnum;
-    font-size: 0.95rem;
-    margin: 1em 0 1.2em 0;
+  @extend %sans-serif-tnum;
+  font-size: 0.95rem;
+  margin: 1em 0 1.2em 0;
 
-    .row {
-        width: 100%;
-        display: flex;
-        flex-wrap: nowrap;
-        justify-content: center;
-    }
-    .header {
-        font-weight: bold;
-    }
-    .cell {
-        width: 5em;
-        text-align: center;
-        margin-right: 1.5em;
-    }
+  .row {
+    width: 100%;
+    display: flex;
+    flex-wrap: nowrap;
+    justify-content: center;
+  }
+  .header {
+    font-weight: bold;
+  }
+  .cell {
+    width: 5em;
+    text-align: center;
+    margin-right: 1.5em;
+  }
 }
 
 .money-visualization {
-    margin: 1em 0;
+  margin: 1em 0;
 }
 
 .money-visualization .block {
-    width: 100%;
-    display: flex;
-    justify-content: center;
-    flex-wrap: wrap;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  flex-wrap: wrap;
 
-    .title {
-        @extend %sans-serif;
-        font-size: 1rem;
-        width: 100%;
-        text-align: center;
-    }
-    .wrapper {
-        width: 100%;
-        text-align: center;
-        overflow-x: auto;
-    }
-    .wrapper.small {
-        margin-top: -0.4rem;
-        margin-bottom: -0.4rem;
-    }
+  .title {
+    @extend %sans-serif;
+    font-size: 1rem;
+    width: 100%;
+    text-align: center;
+  }
+  .wrapper {
+    width: 100%;
+    text-align: center;
+    overflow-x: auto;
+  }
+  .wrapper.small {
+    margin-top: -0.4rem;
+    margin-bottom: -0.4rem;
+  }
 }
 
 .money-vis-small {
-    background: url(/images/markets/small.png) left top no-repeat;
-    width: 10px;
-    height: 10px;
-    display: inline-block;
+  background: url(/images/markets/small.png) left top no-repeat;
+  width: 10px;
+  height: 10px;
+  display: inline-block;
 }
 .money-vis-big {
-    background: url(/images/markets/big.png) left top no-repeat;
-    width: 12px;
-    height: 12px;
-    display: inline-block;
+  background: url(/images/markets/big.png) left top no-repeat;
+  width: 12px;
+  height: 12px;
+  display: inline-block;
 }
 
 /*
@@ -1077,49 +1075,51 @@ table.address-message {
 */
 
 .hidden-label {
-    @include a-background(#333);
-    cursor: pointer;
+  @include a-background(#333);
+  cursor: pointer;
 }
 .hidden-label:hover {
-    color: $body-link-hover-color;
-    background: none;
-    shadow: none;
+  color: $body-link-hover-color;
+  background: none;
+  shadow: none;
 }
 .hidden-toggle {
-    display: none;
+  display: none;
 }
 .hidden-content {
-    display: none;
-    @extend %sans-serif;
-    font-size: 0.8rem;
+  display: none;
+  @extend %sans-serif;
+  font-size: 0.8rem;
 }
 .hidden-toggle:checked + .hidden-content {
-    display: block;
-    text-align: center;
-    padding-top: 0.2rem;
+  display: block;
+  text-align: center;
+  padding-top: 0.2rem;
 }
 
-.flex-20, .flex-25, .flex-50, .flex-33 {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: center;
-    align-items: center;
+.flex-20,
+.flex-25,
+.flex-50,
+.flex-33 {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  align-items: center;
 
-    img {
-        padding: 0.2em;
-    }
+  img {
+    padding: 0.2em;
+  }
 }
 
 .flex-20 img {
-    max-width: 20%;
+  max-width: 20%;
 }
 .flex-25 img {
-    max-width: 25%;
+  max-width: 25%;
 }
 .flex-33 img {
-    max-width: 33%;
+  max-width: 33%;
 }
 .flex-50 img {
-    max-width: 50%;
+  max-width: 50%;
 }
-
diff --git a/sass/code-highlight.scss b/sass/code-highlight.scss
index 505028d..6a9404e 100644
--- a/sass/code-highlight.scss
+++ b/sass/code-highlight.scss
@@ -35,20 +35,36 @@ $gb-lm-light-orange: #af3a03;
 $gb-lm-light-gray: #7c6f64;
 
 .highlight {
-    margin: 1rem 0;
-    border-top: 1px dashed $body-hr-color;
-    border-bottom: 1px dashed $body-hr-color;
+  margin: 1rem 0;
+  border-top: 1px dashed $body-hr-color;
+  border-bottom: 1px dashed $body-hr-color;
 
-    > pre {
-        padding: 0 0.6em;
-        margin: 1em 0;
-    }
+  > pre {
+    padding: 0 0.6em;
+    margin: 1em 0;
+  }
 
-    // Builtin
-    .nb { color: $gb-lm-light-orange; }
-    //  Strings
-    .s, .s1, .s2, .sb, .sc, .sd, .sh { color: $gb-lm-light-green}
-    // Keywords
-    .k, .kc, .kd, .kn, .kp, .kr { color: $gb-lm-light-blue; }
+  // Builtin
+  .nb {
+    color: $gb-lm-light-orange;
+  }
+  //  Strings
+  .s,
+  .s1,
+  .s2,
+  .sb,
+  .sc,
+  .sd,
+  .sh {
+    color: $gb-lm-light-green;
+  }
+  // Keywords
+  .k,
+  .kc,
+  .kd,
+  .kn,
+  .kp,
+  .kr {
+    color: $gb-lm-light-blue;
+  }
 }
-
diff --git a/sass/colors.scss b/sass/colors.scss
index b90c0ec..a1e57e4 100644
--- a/sass/colors.scss
+++ b/sass/colors.scss
@@ -1,7 +1,7 @@
 // Common cryptocurrency colors:
-$bch-green: #5DCB79;
+$bch-green: #5dcb79;
 $bch-green2: #478559;
-$btc-orange: #F59332;
+$btc-orange: #f59332;
 $eth-light-gray: #7e8891;
 $eth-dark-gray: #343535;
 $xmr-orange: #ff6600;
@@ -58,4 +58,3 @@ $illegal-moral: #b3cde3;
 $legal-moral: #ccebc5;
 $legal-immoral: #decbe4;
 // https://colorbrewer2.org/#type=qualitative&scheme=Pastel1&n=6
-
diff --git a/sass/fonts.scss b/sass/fonts.scss
index 9140046..a2a59d4 100644
--- a/sass/fonts.scss
+++ b/sass/fonts.scss
@@ -1,126 +1,130 @@
-$century-supra: 'century_supra_a';
+$century-supra: "century_supra_a";
 @font-face {
-    font-family: $century-supra;
-    font-style: normal;
-    font-weight: normal;
-    font-stretch: normal;
-    font-display: auto;
-    src: url('/fonts/century_supra_a_regular.woff2') format('woff2');
+  font-family: $century-supra;
+  font-style: normal;
+  font-weight: normal;
+  font-stretch: normal;
+  font-display: auto;
+  src: url("/fonts/century_supra_a_regular.woff2") format("woff2");
 }
 @font-face {
-    font-family: $century-supra;
-    font-style: italic;
-    font-weight: normal;
-    font-stretch: normal;
-    font-display: auto;
-    src: url('/fonts/century_supra_a_italic.woff2') format('woff2');
+  font-family: $century-supra;
+  font-style: italic;
+  font-weight: normal;
+  font-stretch: normal;
+  font-display: auto;
+  src: url("/fonts/century_supra_a_italic.woff2") format("woff2");
 }
 @font-face {
-    font-family: $century-supra;
-    font-style: normal;
-    font-weight: bold;
-    font-stretch: normal;
-    font-display: auto;
-    src: url('/fonts/century_supra_a_bold.woff2') format('woff2');
+  font-family: $century-supra;
+  font-style: normal;
+  font-weight: bold;
+  font-stretch: normal;
+  font-display: auto;
+  src: url("/fonts/century_supra_a_bold.woff2") format("woff2");
 }
 @font-face {
-    font-family: $century-supra;
-    font-style: italic;
-    font-weight: bold;
-    font-stretch: normal;
-    font-display: auto;
-    src: url('/fonts/century_supra_a_bold_italic.woff2') format('woff2');
+  font-family: $century-supra;
+  font-style: italic;
+  font-weight: bold;
+  font-stretch: normal;
+  font-display: auto;
+  src: url("/fonts/century_supra_a_bold_italic.woff2") format("woff2");
 }
 
-$concourse: 'concourse_4';
+$concourse: "concourse_4";
 @font-face {
-    font-family: $concourse;
-    font-style: normal;
-    font-weight: normal;
-    font-stretch: normal;
-    font-display: auto;
-    src: url('/fonts/concourse_4_regular.woff2') format('woff2');
+  font-family: $concourse;
+  font-style: normal;
+  font-weight: normal;
+  font-stretch: normal;
+  font-display: auto;
+  src: url("/fonts/concourse_4_regular.woff2") format("woff2");
 }
 @font-face {
-    font-family: $concourse;
-    font-style: italic;
-    font-weight: normal;
-    font-stretch: normal;
-    font-display: auto;
-    src: url('/fonts/concourse_4_italic.woff2') format('woff2');
+  font-family: $concourse;
+  font-style: italic;
+  font-weight: normal;
+  font-stretch: normal;
+  font-display: auto;
+  src: url("/fonts/concourse_4_italic.woff2") format("woff2");
 }
 @font-face {
-    font-family: $concourse;
-    font-style: normal;
-    font-weight: bold;
-    font-stretch: normal;
-    font-display: auto;
-    src: url('/fonts/concourse_4_bold.woff2') format('woff2');
+  font-family: $concourse;
+  font-style: normal;
+  font-weight: bold;
+  font-stretch: normal;
+  font-display: auto;
+  src: url("/fonts/concourse_4_bold.woff2") format("woff2");
 }
 @font-face {
-    font-family: $concourse;
-    font-style: italic;
-    font-weight: bold;
-    font-stretch: normal;
-    font-display: auto;
-    src: url('/fonts/concourse_4_bold_italic.woff2') format('woff2');
+  font-family: $concourse;
+  font-style: italic;
+  font-weight: bold;
+  font-stretch: normal;
+  font-display: auto;
+  src: url("/fonts/concourse_4_bold_italic.woff2") format("woff2");
 }
 
-$triplicate: 'Triplicate';
+$triplicate: "Triplicate";
 @font-face {
-    font-family: $triplicate;
-    font-style: normal;
-    font-weight: normal;
-    font-stretch: normal;
-    font-display: auto;
-    src: url('/fonts/triplicate_a_code_regular.woff2') format('woff2');
+  font-family: $triplicate;
+  font-style: normal;
+  font-weight: normal;
+  font-stretch: normal;
+  font-display: auto;
+  src: url("/fonts/triplicate_a_code_regular.woff2") format("woff2");
 }
 @font-face {
-    font-family: $triplicate;
-    font-style: italic;
-    font-weight: normal;
-    font-stretch: normal;
-    font-display: auto;
-    src: url('/fonts/triplicate_a_code_italic.woff2') format('woff2');
+  font-family: $triplicate;
+  font-style: italic;
+  font-weight: normal;
+  font-stretch: normal;
+  font-display: auto;
+  src: url("/fonts/triplicate_a_code_italic.woff2") format("woff2");
 }
 @font-face {
-    font-family: $triplicate;
-    font-style: normal;
-    font-weight: bold;
-    font-stretch: normal;
-    font-display: auto;
-    src: url('/fonts/triplicate_a_code_bold.woff2') format('woff2');
+  font-family: $triplicate;
+  font-style: normal;
+  font-weight: bold;
+  font-stretch: normal;
+  font-display: auto;
+  src: url("/fonts/triplicate_a_code_bold.woff2") format("woff2");
 }
 @font-face {
-    font-family: $triplicate;
-    font-style: italic;
-    font-weight: bold;
-    font-stretch: normal;
-    font-display: auto;
-    src: url('/fonts/triplicate_a_code_bold_italic.woff2') format('woff2');
+  font-family: $triplicate;
+  font-style: italic;
+  font-weight: bold;
+  font-stretch: normal;
+  font-display: auto;
+  src: url("/fonts/triplicate_a_code_bold_italic.woff2") format("woff2");
 }
 
-
-$serif-font-family: $century-supra, Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif", "Liberation Serif", Georgia, serif;
-$sans-serif-font-family: $concourse, Frutiger, "Frutiger Linotype", Univers, Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;
-$code-font-family: $triplicate, Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;
-
+$serif-font-family: $century-supra, Constantia, "Lucida Bright", Lucidabright,
+  "Lucida Serif", Lucida, "DejaVu Serif", "Bitstream Vera Serif",
+  "Liberation Serif", Georgia, serif;
+$sans-serif-font-family: $concourse, Frutiger, "Frutiger Linotype", Univers,
+  Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad,
+  "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva,
+  "Helvetica Neue", Helvetica, Arial, sans-serif;
+$code-font-family: $triplicate, Consolas, "Andale Mono WT", "Andale Mono",
+  "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono",
+  "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco,
+  "Courier New", Courier, monospace;
 
 %sans-serif {
-    text-rendering: optimizeLegibility;
-    font-family: $sans-serif-font-family;
-    font-feature-settings: "onum" off, "kern" on;
+  text-rendering: optimizeLegibility;
+  font-family: $sans-serif-font-family;
+  font-feature-settings: "onum" off, "kern" on;
 }
 %sans-serif-tnum {
-    text-rendering: optimizeLegibility;
-    @extend %sans-serif;
-    font-feature-settings: 'kern' on, 'tnum' on;
+  text-rendering: optimizeLegibility;
+  @extend %sans-serif;
+  font-feature-settings: "kern" on, "tnum" on;
 }
 
 %serif {
-    text-rendering: optimizeLegibility;
-    font-family: $serif-font-family;
-    font-feature-settings: "kern" on;
+  text-rendering: optimizeLegibility;
+  font-family: $serif-font-family;
+  font-feature-settings: "kern" on;
 }
-
-
diff --git a/sass/global.scss b/sass/global.scss
index 33c0251..e0e6c78 100644
--- a/sass/global.scss
+++ b/sass/global.scss
@@ -1,144 +1,147 @@
 * {
-    // Predictable styling.
-    margin: 0;
-    padding: 0;
-    // Better box model, includes border in width calculations.
-    box-sizing: border-box;
-    // Flexbox overrides min-width which makes <pre> not overflow properly
-    // https://weblog.west-wind.com/posts/2016/Feb/15/Flexbox-Containers-PRE-tags-and-managing-Overflow
-    min-width: 0;
+  // Predictable styling.
+  margin: 0;
+  padding: 0;
+  // Better box model, includes border in width calculations.
+  box-sizing: border-box;
+  // Flexbox overrides min-width which makes <pre> not overflow properly
+  // https://weblog.west-wind.com/posts/2016/Feb/15/Flexbox-Containers-PRE-tags-and-managing-Overflow
+  min-width: 0;
 }
 
-
-
 html {
-    font-size: 22px;
-    line-height: 1.45;
+  font-size: 22px;
+  line-height: 1.45;
 }
 
 @media only screen and (max-width: 700px) {
-    html {
-        font-size: 20px;
-    }
+  html {
+    font-size: 20px;
+  }
 }
 @media only screen and (max-width: 600px) {
-    html {
-        font-size: 18px;
-    }
+  html {
+    font-size: 18px;
+  }
 }
 @media only screen and (max-width: 520px) {
-    html {
-        font-size: 16px;
-    }
+  html {
+    font-size: 16px;
+  }
 }
 
-
 /*
  * Main body
  */
 body {
-    @extend %serif;
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: center;
+  @extend %serif;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
 
-    color: $body-font-color;
-    background-color: $body-background-color;
+  color: $body-font-color;
+  background-color: $body-background-color;
 }
 
-
 p {
-    margin-bottom: 1em;
+  margin-bottom: 1em;
 }
 
-
 /*
  * Headers
  */
-h1, h2, h3, h4 {
-    @extend %sans-serif;
-    line-height: 1;
+h1,
+h2,
+h3,
+h4 {
+  @extend %sans-serif;
+  line-height: 1;
 }
 h1 {
-    font-size: 1.45rem;
+  font-size: 1.45rem;
 }
 h2 {
-    font-size: 1.22rem;
-    margin-top: 1.2em;
-    margin-bottom: 0.3em;
+  font-size: 1.22rem;
+  margin-top: 1.2em;
+  margin-bottom: 0.3em;
 }
 h3 {
-    font-size: 1.1rem;
-    margin-top: 1em;
-    margin-bottom: 0.3em;
+  font-size: 1.1rem;
+  margin-top: 1em;
+  margin-bottom: 0.3em;
 }
 h4 {
-    font-size: 0.91rem;
-    margin-top: 1em;
-    margin-bottom: 0.3em;
+  font-size: 0.91rem;
+  margin-top: 1em;
+  margin-bottom: 0.3em;
 }
 
-
 /*
  * Links: replicate underline that clears descenders
  * Source: https://edwardtufte.github.io/tufte-css/
  * who credits Adam Schwartz
  */
 @mixin a-text-shadow($col) {
-    text-shadow: 0.03em 0 $col, -0.03em 0 $col, 0 0.03em $col, 0 -0.03em $col,
-                 0.06em 0 $col, -0.06em 0 $col, 0.09em 0 $col, -0.09em 0 $col,
-                 0.12em 0 $col, -0.12em 0 $col, 0.15em 0 $col, -0.15em 0 $col;
+  text-shadow: 0.03em 0 $col, -0.03em 0 $col, 0 0.03em $col, 0 -0.03em $col,
+    0.06em 0 $col, -0.06em 0 $col, 0.09em 0 $col, -0.09em 0 $col, 0.12em 0 $col,
+    -0.12em 0 $col, 0.15em 0 $col, -0.15em 0 $col;
 }
 
 @mixin a-background($col) {
-    background: -webkit-linear-gradient($body-background-color, $body-background-color),
-        -webkit-linear-gradient($body-background-color, $body-background-color),
-        -webkit-linear-gradient($col, $col);
-    background: linear-gradient($body-background-color, $body-background-color),
-        linear-gradient($body-background-color, $body-background-color),
-        linear-gradient($col, $col);
-
-    $background-size: 0.05em 1px, 0.05em 1px, 1px 1px;
-    -webkit-background-size: $background-size;
-    -moz-background-size: $background-size;
-    background-size: $background-size;
-
-    background-repeat: no-repeat, no-repeat, repeat-x;
-    @include a-text-shadow($body-background-color);
-    background-position: 0% 93%, 100% 93%, 0% 93%;
+  background: -webkit-linear-gradient(
+      $body-background-color,
+      $body-background-color
+    ),
+    -webkit-linear-gradient($body-background-color, $body-background-color),
+    -webkit-linear-gradient($col, $col);
+  background: linear-gradient($body-background-color, $body-background-color),
+    linear-gradient($body-background-color, $body-background-color),
+    linear-gradient($col, $col);
+
+  $background-size: 0.05em 1px, 0.05em 1px, 1px 1px;
+  -webkit-background-size: $background-size;
+  -moz-background-size: $background-size;
+  background-size: $background-size;
+
+  background-repeat: no-repeat, no-repeat, repeat-x;
+  @include a-text-shadow($body-background-color);
+  background-position: 0% 93%, 100% 93%, 0% 93%;
 }
 
 a:link {
-    text-decoration: none;
-    @include a-background(#333);
+  text-decoration: none;
+  @include a-background(#333);
 }
 
 @media screen and (-webkit-min-device-pixel-ratio: 0) {
-    a:link { background-position-y: 89%, 89%, 89%; }
+  a:link {
+    background-position-y: 89%, 89%, 89%;
+  }
 }
 
-a:link::selection, a:link::-moz-selection {
-    @include a-text-shadow($body-selection-color);
-    background: $body-selection-color;
+a:link::selection,
+a:link::-moz-selection {
+  @include a-text-shadow($body-selection-color);
+  background: $body-selection-color;
 }
 
-a:link, a:visited {
-    color: inherit;
+a:link,
+a:visited {
+  color: inherit;
 }
 a:hover {
-    //@include a-background($body-link-hover-color);
-    background: none;
-    shadow: none;
-    color: $body-link-hover-color;
+  //@include a-background($body-link-hover-color);
+  background: none;
+  shadow: none;
+  color: $body-link-hover-color;
 }
 a:hover.xref {
-    color: $body-xref-hover-color;
+  color: $body-xref-hover-color;
 }
 a:hover.invalid-iref {
-    color: $body-invalid-iref-hover-color;
+  color: $body-invalid-iref-hover-color;
 }
 
-
 /*
  * Selection
  */
@@ -149,225 +152,232 @@ a:hover.invalid-iref {
   background: $body-selection-color; /* Gecko Browsers */
 }
 
-
 /*
  * Prev/next nav panes
  */
 .edge-wrapper {
-    a {
-        text-decoration: none;
-        background: none;
-        text-shadow: none;
-        color: #ddd;
-    }
-    a:hover {
-        color: $body-font-color;
-        background-color: $btc-orange;
-        //background-color: $bch-green;
-        //background-color: $body-selection-color;
-    }
+  a {
+    text-decoration: none;
+    background: none;
+    text-shadow: none;
+    color: #ddd;
+  }
+  a:hover {
+    color: $body-font-color;
+    background-color: $btc-orange;
+    //background-color: $bch-green;
+    //background-color: $body-selection-color;
+  }
 }
-.prev-pan, .next-pan {
-    background-color: yellow;
-    font-size: 2.5rem;
-    text-align: center;
-    position: fixed;
-    top: 0;
-    bottom: 0;
-    width: 1.2em;
-    display: flex;
-    justify-content: center;
-    align-content: center;
-    flex-direction: column;
-
-    .content {
-        display: inline-block;
-    }
+.prev-pan,
+.next-pan {
+  background-color: yellow;
+  font-size: 2.5rem;
+  text-align: center;
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  width: 1.2em;
+  display: flex;
+  justify-content: center;
+  align-content: center;
+  flex-direction: column;
+
+  .content {
+    display: inline-block;
+  }
 }
 .prev-pan {
-    left: 0;
+  left: 0;
 }
 .next-pan {
-    right: 0;
+  right: 0;
 }
 
 @media only screen and (max-width: 1340px) {
-    .prev-pan, .next-pan {
-        width: 1em;
-        font-size: 1.2rem;
-    }
+  .prev-pan,
+  .next-pan {
+    width: 1em;
+    font-size: 1.2rem;
+  }
 }
 @media only screen and (max-width: 900px) {
-    .prev-pan, .next-pan {
-        width: 1em;
-        font-size: 1rem;
-    }
-    .edge-wrapper a {
-        color: #ccc;
-    }
+  .prev-pan,
+  .next-pan {
+    width: 1em;
+    font-size: 1rem;
+  }
+  .edge-wrapper a {
+    color: #ccc;
+  }
 }
 
-
 /*
  * Follow
  */
 .follow {
-    @extend %sans-serif;
-    margin-top: 2rem;
-    margin-bottom: 2rem;
+  @extend %sans-serif;
+  margin-top: 2rem;
+  margin-bottom: 2rem;
 }
 
 .follow > .links {
-    margin: 0.3rem;
-    font-size: 0.8rem;
+  margin: 0.3rem;
+  font-size: 0.8rem;
 }
 .follow > .wip {
-    margin: 0.3rem;
-    font-size: 0.8rem;
+  margin: 0.3rem;
+  font-size: 0.8rem;
 }
 .follow > .donate {
-    margin: 0.3rem;
-    font-size: 0.8rem;
+  margin: 0.3rem;
+  font-size: 0.8rem;
 }
-.subscribe > .email, .subscribe > .submit {
-    @extend %serif;
-    font-size: 0.75rem;
-    border: 1px solid #ddd;
-    background: $body-background-color;
-    padding: 0.5em;
+.subscribe > .email,
+.subscribe > .submit {
+  @extend %serif;
+  font-size: 0.75rem;
+  border: 1px solid #ddd;
+  background: $body-background-color;
+  padding: 0.5em;
 }
 
 .subscribe > .email:hover,
 .subscribe > .submit:hover {
-    border: 1px solid #aaa;
-    color: $body-font-color;
+  border: 1px solid #aaa;
+  color: $body-font-color;
 }
 .subscribe > .email:invalid {
-    color: $email-invalid-color;
+  color: $email-invalid-color;
 }
 .subscribe > .submit:hover {
-    color: $body-xref-hover-color;
-    cursor: pointer;
+  color: $body-xref-hover-color;
+  cursor: pointer;
 }
 .subscribe {
-    display: flex;
+  display: flex;
 }
 .subscribe > .email {
-    flex: 4;
-    margin-right: 0.2rem;
+  flex: 4;
+  margin-right: 0.2rem;
 }
 .subscribe > .submit {
-    flex: 1;
+  flex: 1;
 }
 
 .buy {
-    @extend %sans-serif;
-    margin-top: 1rem;
-    font-size: 0.9rem;
-
-    a:link {
-        text-decoration: underline;
-    }
-    a:hover {
-        text-decoration: none;
-    }
+  @extend %sans-serif;
+  margin-top: 1rem;
+  font-size: 0.9rem;
+
+  a:link {
+    text-decoration: underline;
+  }
+  a:hover {
+    text-decoration: none;
+  }
 }
 
-
 /*
  * Footer
  */
 body > footer {
-    @extend %sans-serif;
+  @extend %sans-serif;
 
-    width: 100%;
-    height: 3em;
-    margin-top: 1em;
-
-    nav {
-        display: flex;
-        flex-wrap: wrap;
-        justify-content: center;
-        font-size: 0.95rem;
-
-        a:link {
-            text-decoration: none;
-            background: none;
-            text-shadow: none;
-        }
-        a:hover {
-            text-decoration: underline;
-        }
-    }
+  width: 100%;
+  height: 3em;
+  margin-top: 1em;
 
-    .follow-wrapper {
-        display: flex;
-        flex-wrap: wrap;
-        justify-content: center;
-        margin-top: 1rem;
-    }
-    .follow-wrapper > .follow {
-        margin-top: 0;
-    }
+  nav {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: center;
+    font-size: 0.95rem;
 
-    .prev, .parent, .home, .next {
-        margin: 0 0.3em;
-    }
-    .prev {
-        order: 1;
-    }
-    .next {
-        order: 2;
+    a:link {
+      text-decoration: none;
+      background: none;
+      text-shadow: none;
     }
-    .middle {
-        order: 0;
-        width: 100%;
-        display: flex;
-        justify-content: center;
+    a:hover {
+      text-decoration: underline;
     }
-}
-.buy-wrapper {
+  }
+
+  .follow-wrapper {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
-    font-size: 0.95rem;
+    margin-top: 1rem;
+  }
+  .follow-wrapper > .follow {
+    margin-top: 0;
+  }
+
+  .prev,
+  .parent,
+  .home,
+  .next {
+    margin: 0 0.3em;
+  }
+  .prev {
+    order: 1;
+  }
+  .next {
+    order: 2;
+  }
+  .middle {
+    order: 0;
+    width: 100%;
+    display: flex;
+    justify-content: center;
+  }
+}
+.buy-wrapper {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  font-size: 0.95rem;
 
-    .buy {
-        text-align: center;
+  .buy {
+    text-align: center;
 
-        p {
-            margin-bottom: 0.4em;
-        }
+    p {
+      margin-bottom: 0.4em;
     }
+  }
 }
 .homepage-footer {
+  width: 100%;
+  //background-color: lightyellow;
+  flex: 1 1 auto;
+  margin: 0.5rem 1.2rem;
+  display: flex;
+  justify-content: center;
+  flex-wrap: wrap;
+
+  .buy {
     width: 100%;
-    //background-color: lightyellow;
-    flex: 1 1 auto;
-    margin: 0.5rem 1.2rem;
-    display: flex;
-    justify-content: center;
-    flex-wrap: wrap;
-
-    .buy {
-        width: 100%;
-    }
+  }
 }
 
 @media (min-width: 800px) {
-    body > footer {
-        .prev, .parent, .home, .next {
-            margin: 0 0.6em;
-        }
-        .prev {
-            order: 0;
-        }
-        .middle {
-            order: 1;
-            width: auto;
-        }
-        .next {
-            order: 2;
-        }
+  body > footer {
+    .prev,
+    .parent,
+    .home,
+    .next {
+      margin: 0 0.6em;
+    }
+    .prev {
+      order: 0;
+    }
+    .middle {
+      order: 1;
+      width: auto;
+    }
+    .next {
+      order: 2;
     }
+  }
 }
diff --git a/sass/homepage.scss b/sass/homepage.scss
index 298dbef..5369575 100644
--- a/sass/homepage.scss
+++ b/sass/homepage.scss
@@ -1,57 +1,57 @@
 .homepage {
-    max-width: 600px;
-    margin: 0.5rem 1.2rem;
+  max-width: 600px;
+  margin: 0.5rem 1.2rem;
 }
 
 .homepage > header {
-    margin-bottom: 1em;
-    padding-bottom: 0.3em;
-    border-bottom: 0.2em solid;
+  margin-bottom: 1em;
+  padding-bottom: 0.3em;
+  border-bottom: 0.2em solid;
 
-    h1 {
-        @extend %sans-serif;
-        font-size: 2rem;
-        margin-bottom: 0.2rem;
-    }
-    h2 {
-        @extend %sans-serif;
-        font-size: 1rem;
-        font-weight: normal;
-        font-style: italic;
-        margin: 0;
-        margin-left: 0.3rem;
-        margin-bottom: 0.2rem;
-    }
+  h1 {
+    @extend %sans-serif;
+    font-size: 2rem;
+    margin-bottom: 0.2rem;
+  }
+  h2 {
+    @extend %sans-serif;
+    font-size: 1rem;
+    font-weight: normal;
+    font-style: italic;
+    margin: 0;
+    margin-left: 0.3rem;
+    margin-bottom: 0.2rem;
+  }
 }
 
 .toc section:not(:first-child) {
-    padding-top: 1.2rem;
+  padding-top: 1.2rem;
 }
 
 .toc {
-    @extend %sans-serif;
-    a {
-        text-decoration: none;
-        background: none;
-        text-shadow: none;
-    }
-    a:hover {
-        text-decoration: underline;
-    }
+  @extend %sans-serif;
+  a {
+    text-decoration: none;
+    background: none;
+    text-shadow: none;
+  }
+  a:hover {
+    text-decoration: underline;
+  }
 }
 
 .toc h1 {
-    font-size: 1.1rem;
+  font-size: 1.1rem;
 }
 .toc ul {
-    margin-top: 0.5rem;
-    list-style: none;
+  margin-top: 0.5rem;
+  list-style: none;
 
-    li {
-        margin-left: 0.6rem;
-        margin-top: 0.3rem;
-    }
+  li {
+    margin-left: 0.6rem;
+    margin-top: 0.3rem;
+  }
 }
 .toc .planned {
-    color: $planned-chapter-link;
+  color: $planned-chapter-link;
 }
diff --git a/sass/landing.scss b/sass/landing.scss
index 72ed60d..ce8c09b 100644
--- a/sass/landing.scss
+++ b/sass/landing.scss
@@ -84,52 +84,51 @@ $cover-dark5: #606060;
 // #606030
 // #90A860
 
-$cover-green-hl: #C0D890;
-
-
-$pink-050: #FFE0F0;
-$pink-100: #FAB8D9;
-$pink-200: #F191C1;
-$pink-300: #E668A7;
-$pink-400: #DA4A91;
-$pink-500: #C42D78;
-$pink-600: #AD2167;
-$pink-700: #9B1B5A;
+$cover-green-hl: #c0d890;
+
+$pink-050: #ffe0f0;
+$pink-100: #fab8d9;
+$pink-200: #f191c1;
+$pink-300: #e668a7;
+$pink-400: #da4a91;
+$pink-500: #c42d78;
+$pink-600: #ad2167;
+$pink-700: #9b1b5a;
 $pink-800: #781244;
-$pink-900: #5C0B33;
-
-$magenta-050: #F5E1F7;
-$magenta-100: #ECBDF2;
-$magenta-200: #CE80D9;
-$magenta-300: #BB61C7;
-$magenta-400: #AD4BB8;
-$magenta-500: #A23DAD;
-$magenta-600: #90279C;
-$magenta-700: #7C1A87;
+$pink-900: #5c0b33;
+
+$magenta-050: #f5e1f7;
+$magenta-100: #ecbdf2;
+$magenta-200: #ce80d9;
+$magenta-300: #bb61c7;
+$magenta-400: #ad4bb8;
+$magenta-500: #a23dad;
+$magenta-600: #90279c;
+$magenta-700: #7c1a87;
 $magenta-800: #671270;
-$magenta-900: #4E0754;
-
-$yellow-050: #FFFAEB;
-$yellow-100: #FCEFC7;
-$yellow-200: #F8E3A3;
-$yellow-300: #F9DA8B;
-$yellow-400: #F7D070;
-$yellow-500: #E9B949;
-$yellow-600: #C99A2E;
-$yellow-700: #A27C1A;
-$yellow-800: #7C5E10;
-$yellow-900: #513C06;
-
-$warm-grey-050: #FAF9F7;
-$warm-grey-100: #E8E6E1;
-$warm-grey-200: #D3CEC4;
-$warm-grey-300: #B8B2A7;
-$warm-grey-400: #A39E93;
-$warm-grey-500: #857F72;
-$warm-grey-600: #625D52;
-$warm-grey-700: #504A40;
-$warm-grey-800: #423D33;
-$warm-grey-900: #27241D;
+$magenta-900: #4e0754;
+
+$yellow-050: #fffaeb;
+$yellow-100: #fcefc7;
+$yellow-200: #f8e3a3;
+$yellow-300: #f9da8b;
+$yellow-400: #f7d070;
+$yellow-500: #e9b949;
+$yellow-600: #c99a2e;
+$yellow-700: #a27c1a;
+$yellow-800: #7c5e10;
+$yellow-900: #513c06;
+
+$warm-grey-050: #faf9f7;
+$warm-grey-100: #e8e6e1;
+$warm-grey-200: #d3cec4;
+$warm-grey-300: #b8b2a7;
+$warm-grey-400: #a39e93;
+$warm-grey-500: #857f72;
+$warm-grey-600: #625d52;
+$warm-grey-700: #504a40;
+$warm-grey-800: #423d33;
+$warm-grey-900: #27241d;
 
 $button-hover-color: $bch-green;
 $button-color: $yellow-300;
@@ -143,29 +142,31 @@ $large-width: 1280px;
 $small-screen: 1067px;
 
 .landing {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: center;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
 }
 
 .landing {
-    a {
-        text-shadow: none;
-        background: none;
-        text-shadow: none;
-        text-decoration: underline;
-    }
-    a:link, a:visited, a:link:selection {
-        text-shadow: none;
-        background: none;
-        text-decoration: underline;
-    }
-    a:link {
-        color: #000;
-    }
-    a:hover {
-        color: $btc-orange;
-    }
+  a {
+    text-shadow: none;
+    background: none;
+    text-shadow: none;
+    text-decoration: underline;
+  }
+  a:link,
+  a:visited,
+  a:link:selection {
+    text-shadow: none;
+    background: none;
+    text-decoration: underline;
+  }
+  a:link {
+    color: #000;
+  }
+  a:hover {
+    color: $btc-orange;
+  }
 }
 
 .landing .books,
@@ -174,446 +175,451 @@ $small-screen: 1067px;
 .landing .header,
 .landing .faq,
 .landing .ending {
-    width: 100%;
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: center;
+  width: 100%;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
 }
 
 .landing .hero {
-    width: 100%;
-    background-color: $body-background-color;
-    background-color: $warm-grey-050;
+  width: 100%;
+  background-color: $body-background-color;
+  background-color: $warm-grey-050;
 }
 .landing .hero .header {
-    padding: 8px;
-    display: flex;
-    flex-wrap: wrap;
-    // margin-top: 64px;
+  padding: 8px;
+  display: flex;
+  flex-wrap: wrap;
+  // margin-top: 64px;
 }
 .landing .hero .title {
-    margin-top: 24px;
-    max-width: 650px;
-    // background-color: red;
-    // flex: 1;
-    h1 {
-        font-size: 48px;
-        margin: 0;
-        margin-bottom: 8px;
-        // margin-bottom: 24px;
-    }
-    h2 {
-        @extend %sans-serif;
-        font-size: 24px;
-        font-weight: normal;
-        font-style: italic;
-        margin: 0;
-        margin-bottom: 24px;
-        // margin: 0;
-        // margin-left: 0.3rem;
-        // margin-bottom: 0.2rem;
-        // display: none;
-    }
-
-    .sell-it {
-        // text-align: center;
-        // padding-right: 64px;
-        // max-width: 650px;
-    }
-    .afford {
-        font-weight: bold;
-    }
+  margin-top: 24px;
+  max-width: 650px;
+  // background-color: red;
+  // flex: 1;
+  h1 {
+    font-size: 48px;
+    margin: 0;
+    margin-bottom: 8px;
+    // margin-bottom: 24px;
+  }
+  h2 {
+    @extend %sans-serif;
+    font-size: 24px;
+    font-weight: normal;
+    font-style: italic;
+    margin: 0;
+    margin-bottom: 24px;
+    // margin: 0;
+    // margin-left: 0.3rem;
+    // margin-bottom: 0.2rem;
+    // display: none;
+  }
+
+  .sell-it {
+    // text-align: center;
+    // padding-right: 64px;
+    // max-width: 650px;
+  }
+  .afford {
+    font-weight: bold;
+  }
 }
 .landing .hero .buttons {
-    width: 100%;
-    margin-top: 32px;
-    margin-bottom: 48px;
-    width: 100%;
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-evenly;
+  width: 100%;
+  margin-top: 32px;
+  margin-bottom: 48px;
+  width: 100%;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-evenly;
 }
 .landing .hero .buttons a {
-    flex: 1;
-    text-decoration: none;
-    color: inherit;
-    text-align: center;
-    background-color: $button-color;
-    border: 0;
-    border-radius: 4px;
-    font-size: 1rem;
-    padding: 12px 16px;
-    margin: 8px;
-    cursor: pointer;
-    box-shadow: 1px 1px 0px $button-shadow-color;
-    min-width: 160px;
+  flex: 1;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  background-color: $button-color;
+  border: 0;
+  border-radius: 4px;
+  font-size: 1rem;
+  padding: 12px 16px;
+  margin: 8px;
+  cursor: pointer;
+  box-shadow: 1px 1px 0px $button-shadow-color;
+  min-width: 160px;
 }
 .landing .hero .buttons a:hover {
-    text-decoration: none;
-    color: inherit;
-    background-color: $button-hover-color;
+  text-decoration: none;
+  color: inherit;
+  background-color: $button-hover-color;
 }
 
 .landing .hero .book {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: center;
-    width: 100%;
-    img {
-        max-width: 600px;
-    }
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  width: 100%;
+  img {
+    max-width: 600px;
+  }
 }
 
 .landing .user-comments {
-    padding: 48px 0;
-    background-color: $warm-grey-050;
+  padding: 48px 0;
+  background-color: $warm-grey-050;
 }
 .landing .user-comments h1 {
-    width: 100%;
-    text-align: center;
+  width: 100%;
+  text-align: center;
 }
 .landing .user-comments blockquote {
-    // background-color: $warm-grey-050;
+  // background-color: $warm-grey-050;
 }
 
 .landing .books {
-    background-color: $warm-grey-800;
-    padding: 48px 0;
+  background-color: $warm-grey-800;
+  padding: 48px 0;
 }
 .landing .format-wrapper {
-    width: 100%;
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: center;
+  width: 100%;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
 }
 .landing .format {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  padding: 0;
+  border-radius: 8px;
+
+  background-color: $yellow-050;
+  // border: solid 1px $yellow-100;
+  // border-radius: 8px;
+  margin-bottom: 48px;
+
+  h1 {
+    margin-bottom: 16px;
+  }
+  ul {
+    list-style: none;
+  }
+  ol li,
+  ul li {
+    margin-bottom: 0.4em;
+    font-size: 95%;
+    line-height: 1.35;
+  }
+  nav.buttons {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
-    padding: 0;
-    border-radius: 8px;
-
-    background-color: $yellow-050;
-    // border: solid 1px $yellow-100;
-    // border-radius: 8px;
-    margin-bottom: 48px;
+  }
+  nav.buttons a,
+  nav.buttons div.soon {
+    // flex: 1;
+    text-align: center;
+    width: 100%;
+    background-color: $button-color;
+    border: 0;
+    border-radius: 4px;
+    font-size: 1rem;
+    padding: 12px 16px;
+    // margin: 8px;
+    margin-bottom: 8px;
+    cursor: pointer;
+    box-shadow: 1px 1px 0px $button-shadow-color;
 
-    h1 {
-        margin-bottom: 16px;
-    }
-    ul {
-        list-style: none;
-    }
-    ol li, ul li {
-        margin-bottom: 0.4em;
-        font-size: 95%;
-        line-height: 1.35;
-    }
-    nav.buttons {
-        display: flex;
-        flex-wrap: wrap;
-        justify-content: center;
-    }
-    nav.buttons a, nav.buttons div.soon {
-        // flex: 1;
-        text-align: center;
-        width: 100%;
-        background-color: $button-color;
-        border: 0;
-        border-radius: 4px;
-        font-size: 1rem;
-        padding: 12px 16px;
-        // margin: 8px;
-        margin-bottom: 8px;
-        cursor: pointer;
-        box-shadow: 1px 1px 0px $button-shadow-color;
-
-        display: flex;
-        flex-wrap: wrap;
-        justify-content: center;
-
-        span {
-            // flex: 0;
-            width: 100%;
-        }
-    }
-    nav.buttons a:hover {
-        background-color: $button-hover-color;
-        cursor: pointer;
-    }
-    nav.buttons div.soon {
-        cursor: auto;
-        background-color: $invalid-button-color;
-        box-shadow: 1px 1px 0px $invalid-button-shadow-color;
-    }
-    nav.buttons span.spanner {
-        width: 100%;
-        display: flex;
-        flex-wrap: wrap;
-        justify-content: center;
-    }
-    nav.buttons span.spanner a {
-        flex: 1;
-    }
-    nav.buttons span.spanner a:not(:first-child) {
-        margin-left: 8px;
-    }
-    .small-emph {
-        // flex: 0;
-        // width: 100%;
-        font-size: 0.9rem;
-        font-style: italic;
-    }
-    .coming {
-        font-size: 0.9rem;
-        //font-style: italic;
-    }
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: center;
 
-    ul.features {
-        margin-top: 24px;
-    }
-    ul.features li::before {
-        @extend %sans-serif;
-        content: "•";
-        margin-left: -20px;
-        padding-right: 8px;
-        color: $yellow-500;
-    }
-    ul.features li {
-        margin-left: 32px;
-    }
-    ul.features a, ul.features a:link {
-        text-decoration: underline;
-        cursor: pointer;
-    }
-    ul.features a:hover {
-        color: $btc-orange;
+    span {
+      // flex: 0;
+      width: 100%;
     }
+  }
+  nav.buttons a:hover {
+    background-color: $button-hover-color;
+    cursor: pointer;
+  }
+  nav.buttons div.soon {
+    cursor: auto;
+    background-color: $invalid-button-color;
+    box-shadow: 1px 1px 0px $invalid-button-shadow-color;
+  }
+  nav.buttons span.spanner {
+    width: 100%;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: center;
+  }
+  nav.buttons span.spanner a {
+    flex: 1;
+  }
+  nav.buttons span.spanner a:not(:first-child) {
+    margin-left: 8px;
+  }
+  .small-emph {
+    // flex: 0;
+    // width: 100%;
+    font-size: 0.9rem;
+    font-style: italic;
+  }
+  .coming {
+    font-size: 0.9rem;
+    //font-style: italic;
+  }
+
+  ul.features {
+    margin-top: 24px;
+  }
+  ul.features li::before {
+    @extend %sans-serif;
+    content: "•";
+    margin-left: -20px;
+    padding-right: 8px;
+    color: $yellow-500;
+  }
+  ul.features li {
+    margin-left: 32px;
+  }
+  ul.features a,
+  ul.features a:link {
+    text-decoration: underline;
+    cursor: pointer;
+  }
+  ul.features a:hover {
+    color: $btc-orange;
+  }
 }
 
 .landing .background {
-    display: inline-block;
-    padding-left: 24px;
+  display: inline-block;
+  padding-left: 24px;
 }
 
 .landing .format .left {
-    width: 520px;
-    margin-right: 16px;
-    padding: 16px;
+  width: 520px;
+  margin-right: 16px;
+  padding: 16px;
 
-    a, a:link, a:hover {
-        color: inherit;
-        text-decoration: none;
-        cursor: auto;
-    }
+  a,
+  a:link,
+  a:hover {
+    color: inherit;
+    text-decoration: none;
+    cursor: auto;
+  }
 }
 .landing .format .img-wrapper {
-    width: 500px;
-    border-radius: 8px;
-    border-bottom-left-radius: 0;
-    border-top-left-radius: 0;
-    background-image: url("/images/cover/front.png");
-    // padding: 8px;
+  width: 500px;
+  border-radius: 8px;
+  border-bottom-left-radius: 0;
+  border-top-left-radius: 0;
+  background-image: url("/images/cover/front.png");
+  // padding: 8px;
 }
 .landing .print .img-wrapper {
-    background-image: url("/images/landing/print.png");
+  background-image: url("/images/landing/print.png");
 }
 .landing .ebook .img-wrapper {
-    background-image: url("/images/landing/ebook.png");
+  background-image: url("/images/landing/ebook.png");
 }
 .landing .pdf .img-wrapper {
-    background-image: url("/images/landing/pdf.png");
+  background-image: url("/images/landing/pdf.png");
 }
 .landing .web .img-wrapper {
-    background-image: url("/images/landing/unbanked.png");
+  background-image: url("/images/landing/unbanked.png");
 }
 
 .landing .praise {
-    max-width: $large-width;
-    display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(500px, 1fr));
-    grid-gap: 4px;
+  max-width: $large-width;
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(500px, 1fr));
+  grid-gap: 4px;
 }
 .landing .what {
-    background-color: $cover-dark3;
-    padding-top: 32px;
-    padding-bottom: 32px;
-    color: $warm-grey-100;
+  background-color: $cover-dark3;
+  padding-top: 32px;
+  padding-bottom: 32px;
+  color: $warm-grey-100;
 }
 .landing .what .head {
-    width: 100%;
-    text-align: center;
-    margin-bottom: 32px;
+  width: 100%;
+  text-align: center;
+  margin-bottom: 32px;
 }
 .landing .what .examples {
-    max-width: $large-width;
-    display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(500px, 1fr));
-    grid-gap: 48px;
+  max-width: $large-width;
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(500px, 1fr));
+  grid-gap: 48px;
 }
 .landing .what .ex {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-between;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
 }
 .landing .what .ex h2 {
-    margin: 0;
-    margin-bottom: 0.3rem;
+  margin: 0;
+  margin-bottom: 0.3rem;
 }
 .landing .what .img-wrapper {
-    width: 130px;
-    height: 130px;
-    border-radius: 65px;
-    // border-radius: 8px;
-    // float: left;
+  width: 130px;
+  height: 130px;
+  border-radius: 65px;
+  // border-radius: 8px;
+  // float: left;
 }
 .landing .what .utility .img-wrapper {
-    background-image: url("/images/landing/casino.png");
+  background-image: url("/images/landing/casino.png");
 }
 .landing .what .easy .img-wrapper {
-    background-image: url("/images/landing/huh.png");
+  background-image: url("/images/landing/huh.png");
 }
 .landing .what .concepts .img-wrapper {
-    background-image: url("/images/landing/miners.png");
+  background-image: url("/images/landing/miners.png");
 }
 .landing .what .order .img-wrapper {
-    background-image: url("/images/landing/heli.png");
+  background-image: url("/images/landing/heli.png");
 }
 .landing .what .general .img-wrapper {
-    background-image: url("/images/landing/bank.png");
+  background-image: url("/images/landing/bank.png");
 }
 .landing .what .variety .img-wrapper {
-    background-image: url("/images/landing/snowden.png");
+  background-image: url("/images/landing/snowden.png");
 }
 .landing .what .right {
-    // float: left;
-    // width: 100px;
-    flex: 1;
-    margin-left: 16px;
+  // float: left;
+  // width: 100px;
+  flex: 1;
+  margin-left: 16px;
 }
 
 .landing .faq {
-    background-color: $warm-grey-900;
-    // background-color: $cover-dark3;
-    padding: 32px 8px;
-    // color: $warm-grey-100;
-    background-color: $warm-grey-200;
+  background-color: $warm-grey-900;
+  // background-color: $cover-dark3;
+  padding: 32px 8px;
+  // color: $warm-grey-100;
+  background-color: $warm-grey-200;
 }
 .landing .faq .questions {
-    width: 100%;
+  width: 100%;
 }
 .landing .faq h1 {
-    margin-bottom: 24px;
+  margin-bottom: 24px;
 }
 .landing .faq a {
-    color: inherit;
-    text-decoration: underline;
+  color: inherit;
+  text-decoration: underline;
 }
 .landing .faq a:hover {
-    color: $btc-orange;
-    text-decoration: none;
+  color: $btc-orange;
+  text-decoration: none;
 }
 .landing .faq .questions .question-answer {
-    width: 100%;
-    margin-bottom: 32px;
+  width: 100%;
+  margin-bottom: 32px;
 }
 .landing .faq .question {
-    width: 800px;
-    margin: 0 auto;
-    font-weight: bold;
+  width: 800px;
+  margin: 0 auto;
+  font-weight: bold;
 }
 .landing .faq .answer {
-    margin: 0 auto;
-    width: 800px;
+  margin: 0 auto;
+  width: 800px;
 }
 .landing .faq .answer ul {
-    list-style: none;
-    margin: 1rem 0 1rem 0em;
-
-    > li::before {
-        @extend %sans-serif;
-        //content: "⭑";
-        //content: "~";
-        //content: "≈";
-        //content: "→";
-        //content: "»";
-        //content: "*";
-        content: "•";
-        //content: "†";
-        // color: $body-list-sym-color;
-    }
+  list-style: none;
+  margin: 1rem 0 1rem 0em;
+
+  > li::before {
+    @extend %sans-serif;
+    //content: "⭑";
+    //content: "~";
+    //content: "≈";
+    //content: "→";
+    //content: "»";
+    //content: "*";
+    content: "•";
+    //content: "†";
+    // color: $body-list-sym-color;
+  }
 }
 
 .landing .ending {
-    padding-top: 8px;
-    padding-bottom: 8px;
-    background-color: $body-background-color;
-    // color: $warm-grey-050;
+  padding-top: 8px;
+  padding-bottom: 8px;
+  background-color: $body-background-color;
+  // color: $warm-grey-050;
 }
 .landing .ending {
-    a:link {
-        color: inherit;
-        text-decoration: underline;
-    }
-    a:hover {
-        color: $btc-orange;
-        text-decoration: none;
-    }
+  a:link {
+    color: inherit;
+    text-decoration: underline;
+  }
+  a:hover {
+    color: $btc-orange;
+    text-decoration: none;
+  }
 }
 
 @media only screen and (max-width: $small-screen) {
-    .landing .format {
-        width: 520px;
-        margin-left: 16px;
-        margin-right: 16px;
-        // padding: 16px;
-        border-radius: 8px;
-        padding: 0;
-    }
-    .landing .format .left {
-        order: 2;
-        width: 100%;
-        margin: 0;
-        padding: 16px;
-    }
-    .landing .format .img-wrapper {
-        order: 1;
-        width: 100%;
-        height: 300px;
-        border-radius: 8px;
-        border-bottom-left-radius: 0;
-        border-bottom-right-radius: 0;
-    }
-    .landing .what .examples {
-        display: block;
-    }
-    .landing .what .ex {
-        margin-bottom: 48px;
-    }
-    .landing .faq {
-        padding: 32px;
-    }
-    .landing .faq .questions .question-answer {
-        width: 100%;
-    }
-    .landing .faq .question,
-    .landing .faq .answer {
-        width: 100%;
-    }
-    .landing .hero .buttons a {
-        flex: 0 1 auto;
-        width: 100%;
-    }
+  .landing .format {
+    width: 520px;
+    margin-left: 16px;
+    margin-right: 16px;
+    // padding: 16px;
+    border-radius: 8px;
+    padding: 0;
+  }
+  .landing .format .left {
+    order: 2;
+    width: 100%;
+    margin: 0;
+    padding: 16px;
+  }
+  .landing .format .img-wrapper {
+    order: 1;
+    width: 100%;
+    height: 300px;
+    border-radius: 8px;
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+  }
+  .landing .what .examples {
+    display: block;
+  }
+  .landing .what .ex {
+    margin-bottom: 48px;
+  }
+  .landing .faq {
+    padding: 32px;
+  }
+  .landing .faq .questions .question-answer {
+    width: 100%;
+  }
+  .landing .faq .question,
+  .landing .faq .answer {
+    width: 100%;
+  }
+  .landing .hero .buttons a {
+    flex: 0 1 auto;
+    width: 100%;
+  }
 }
 
 @media only screen and (max-width: 520px) {
-    .landing .format {
-        width: 100%;
-    }
-    .landing .praise {
-        display: block;
-    }
-    .landing .praise blockquote {
-        margin-bottom: 48px;
-    }
+  .landing .format {
+    width: 100%;
+  }
+  .landing .praise {
+    display: block;
+  }
+  .landing .praise blockquote {
+    margin-bottom: 48px;
+  }
 }
diff --git a/separation_of_money_and_state.html.pm b/separation_of_money_and_state.html.pm
index 6e3debd..8eeebe1 100644
--- a/separation_of_money_and_state.html.pm
+++ b/separation_of_money_and_state.html.pm
@@ -9,7 +9,7 @@
 
 ◊(clear-sidenotes)
 
-◊img[#:src "/images/bitcoin-priest.png" #:class "slim" #:alt "A priest with a crown, holding a sword and a bag of Bitcoin."]{}
+◊img[#:src "/images/bitcoin-priest.png" #:class "slim" #:alt "A priest with a crown, holding a sword and a bag of Bitcoin." #:decorative #t]{}
 
 When I first started thinking about cryptocurrencies, I thought they were just useful for some people who couldn't use regular transactions, like buying weed or things on a darknet market. Or that it was simply a better payment system as there was no middleman to skim off large fees from all transactions. That's useful, but it didn't strike me as revolutionary.◊mn{fees}
 
diff --git a/timestamping_service.html.pm b/timestamping_service.html.pm
index f15fd59..b6f1fe2 100644
--- a/timestamping_service.html.pm
+++ b/timestamping_service.html.pm
@@ -305,7 +305,7 @@ Let's now encode and timestamp it using the Bitcoin Cash blockchain:
 
         ◊img[#:src "images/electroncash-opreturn.png"
              #:title "Electron Cash custom OP_RETURN"
-             #:alt "Electron Cash custom OP_RETURN."]{
+             #:alt "Electron Cash OP_RETURN figure"]{
           Custom OP_RETURN using ◊link[electroncash]{Electron Cash}.
         }
 
diff --git a/tokens.html.pm b/tokens.html.pm
index 824d80b..de43fc8 100644
--- a/tokens.html.pm
+++ b/tokens.html.pm
@@ -207,12 +207,12 @@ I think visualizations can help us compare large amounts like these, so here's o
    `(div ((class "block"))
       (div ((class "title")) ,title)
       (div ((class "wrapper"))
-        (img ((src ,src))))))
+        (img ((src ,src) (role "presentation") (alt ,title))))))
 ◊(define (small-img title src)
    `(div ((class "block"))
       (div ((class "title")) ,title)
       (div ((class "wrapper small"))
-        (img ((src ,src))))))
+        (img ((src ,src) (role "presentation") (alt ,title))))))
 
 
 ◊; Extremely difficult to this with text, as fonts/sizes looks very different.
diff --git a/uncensorable_donations.html.pm b/uncensorable_donations.html.pm
index b1e5980..4cde0fd 100644
--- a/uncensorable_donations.html.pm
+++ b/uncensorable_donations.html.pm
@@ -195,7 +195,7 @@ This is ◊strong{not} a glorification of WikiLeaks---they have ◊link[wikileak
   ◊entry["The Chelsea Manning leaks"
          #:date "July 5, 2010"]{
 
-    ◊div[#:class "caution"]{First I must caution you: it's very easy to become numb when you read about these leaks. The sheer amount of horror is enough to overwhelm you and might cause your brain to suppress your emotions, maybe out of self-defense. But try to remember that this happened to real people---it's not just a mass of text and numbers. Please don't relegate this as just another forgettable statistic.}
+    ◊div[#:class "caution" #:role "note"]{First I must caution you: it's very easy to become numb when you read about these leaks. The sheer amount of horror is enough to overwhelm you and might cause your brain to suppress your emotions, maybe out of self-defense. But try to remember that this happened to real people---it's not just a mass of text and numbers. Please don't relegate this as just another forgettable statistic.}
 
     Chelsea Manning (formerly Bradley Manning) is a former soldier of the United States who provided WikiLeaks with nearly 750,000 military and diplomatic documents. They were released in batches and spread out over a period of time. Some of the content was absolutely shocking and caused global outrage, I've tried to pick out some notable leaks◊mn{more-leaks}:
 
@@ -220,7 +220,7 @@ This is ◊strong{not} a glorification of WikiLeaks---they have ◊link[wikileak
             At 2019-08-28 the transcript timestamps are slightly off compared to the full video, I've tried to match them up better.
         }
 
-        ◊div[#:class "transcript-wrapper"]{
+        ◊section[#:class "transcript-wrapper"]{
 
           ◊transcript{
               02:34  He's got an RPG [Rocket Propelled Grenade]?
@@ -589,10 +589,10 @@ This is ◊strong{not} a glorification of WikiLeaks---they have ◊link[wikileak
      (if (string=? row "\n")
        ""
        (let ((cols (string-split row "  ")))
-         `(div ((class "row"))
-            (span ((class "time")) ,(car cols))
-            (span ((class "txt")) ,@(cdr cols))))))
-   `(div ((class "transcript"))
+         `(div ((class "row") (role "row"))
+            (span ((class "time") (role "cell")) ,(car cols))
+            (span ((class "txt") (role "cell")) ,@(cdr cols))))))
+   `(div ((class "transcript") (role "grid"))
       ,@(map make-row rows)))
 
 ◊(define execution-of-children
diff --git a/undesirable_businesses.html.pm b/undesirable_businesses.html.pm
index 32ad9c1..bf6b641 100644
--- a/undesirable_businesses.html.pm
+++ b/undesirable_businesses.html.pm
@@ -161,14 +161,14 @@ Therefore, most payment processors ◊link[stripe-restricted]{explicitly forbid}
 
 
 ◊img[#:src "/images/xxx-payments1.png"
-     #:alt "Payment processor doesn't want to do business with porn."]{
+     #:alt "Payment processing denied figure"]{
     Payment processors usually don't want anything to do with porn sites.
 }
 
 Instead, they have a third-party request the payment on their behalf and do some shady stuff. They can for example claim the payment is for another type of business, which isn't banned by the payment processor.
 
 ◊img[#:src "/images/xxx-payments2.png"
-     #:alt "An intermediary makes it possible for the porn business to use a payment processor."]{
+     #:alt "Payment processing ok with an intermediary figure"]{
     Another party acting as an intermediary might get accepted by the payment processor, especially if they disguise themselves.
 }
 
diff --git a/voting.html.pm b/voting.html.pm
index b251225..46ffe74 100644
--- a/voting.html.pm
+++ b/voting.html.pm
@@ -280,7 +280,7 @@ With the tokens distributed, you could cast a vote by sending them to predetermi
     It's easy to give multiple options. For example if you want to be able to differentiate between those who don't care, and those who want to vote but not any candidate, just have an additional "blank" address voters can send to.
 }
 
-◊img[#:src "/images/voting.png" #:alt "One vote is given out to each person, who then sends it to their voting address of choice."]{
+◊img[#:src "/images/voting.png" #:alt "One vote is given out to each person by the state, who then sends it to their voting address of choice (Hillary or Trump)."]{
     Each arrow corresponds to a token transaction and the "Hillary" and "Trump" boxes are addresses. The state is responsible for issuing the voting tokens to the voters and the voters in turn send them to the address they want to vote for. In this example Hillary got 1 vote and Trump got 2, and everyone voted.
 }
 
diff --git a/what_is_money.html.pm b/what_is_money.html.pm
index 888d44f..88ff2a2 100644
--- a/what_is_money.html.pm
+++ b/what_is_money.html.pm
@@ -40,13 +40,13 @@ First, let's look at some interesting historical examples of items that have bee
     ◊money["Shells"
            #:date "1200 B.C."
            #:img "/images/cowry.png"
-           #:alt "Sea shells."]{
+           #:alt "Sea shells"]{
         Sea shells ◊link[sea-shells]{have been used as money for centuries} and were commonly used in parts of Africa and Asia but also in other parts of the world. In West Africa, they saw ◊link[shell-usage]{significant use until the 20◊sup{th} century}.
     }
     ◊money["Coins in ancient Greece"
            #:date "500 B.C."
            #:img "images/greek_coin.png"
-           #:alt "A greek coin."]{
+           #:alt "A greek coin"]{
         The Greeks ◊link[ancient-greece-coinage]{used coins} made from precious metal like silver, bronze, and gold. They also stamped the coins with beautiful portraits for a truly modern look.
     }
     ◊money["Rai stones"
@@ -58,7 +58,7 @@ First, let's look at some interesting historical examples of items that have bee
     ◊money["A 20kg copper coin"
            #:date "1644"
            #:img "images/20kg_copper.png"
-           #:alt "A 20kg copper coin in a wheelbarrow."]{
+           #:alt "A 20kg copper coin in a wheelbarrow"]{
         Another example of---let's say interesting---form of money is ◊link[largest-coin]{the world's largest coin.} It's a copper coin weighing 20kg, issued in Sweden.
 
         Since copper was worth much less than silver, very large coins had to be made to offset the difference. At that time, coins did contain raw materials according to their value, which isn't the case today.
@@ -66,7 +66,7 @@ First, let's look at some interesting historical examples of items that have bee
     ◊money["A 100 billion mark note"
            #:date "1924"
            #:img "images/german_notes.png"
-           #:alt "A large pyramid of paper money."]{
+           #:alt "A large pyramid of paper money"]{
         Bank notes---paper money---are easy to use but they do have problems of their own. Unless kept in check, by for example ◊link[rel-gold-standard]{the gold standard}, they can be mass produced to cause ◊link[hyperinflation]{hyperinflation}.
 
         ◊link[germany-wallpaper]{This is what happened in Germany} after the first World War. They had massive debts after losing the war, so they tried to print enough money to pay off the debts.◊mn{germany-stories}
@@ -78,13 +78,13 @@ First, let's look at some interesting historical examples of items that have bee
     ◊money["Cigarettes in prison"
            #:date `("20" (sup "th") " century")
            #:img "images/prison_money.png"
-           #:alt "A cigarette."]{
+           #:alt "A cigarette"]{
         Like depicted in the movie Shawshank Redemption cigarettes are used in some prisons ◊link[prison-cigarettes]{as a form of money}. Today, some prisons have started to ban smoking, so they instead use things like ◊link[prison-stamps]{stamps} or ◊link[prison-ramen]{ramen}.
     }
     ◊money["Euro bank notes"
            #:date `("21" (sup "th") " century")
            #:img "images/bank_notes.png"
-           #:alt "Euro bank notes."]{
+           #:alt "Euro bank notes"]{
         There are many kinds of ◊em{fiat currencies},◊mn{fiat-commodity} for example, the Euro. Modern coins aren't made of valuable metal and paper notes are used for large denominations.
 
         ◊note-pos[#:top -6 #:bottom -20]{fiat-commodity}
@@ -92,13 +92,13 @@ First, let's look at some interesting historical examples of items that have bee
     ◊money["Dogecoin"
            #:date "2013"
            #:img "images/doge.png"
-           #:alt "Doge."]{
+           #:alt "Doge"]{
         Dogecoin is a cryptocurrency and while created as a "joke currency" it quickly gained popularity as a tipping tool online. You can still find merchants who accept it today for things like domain names, web hosting, VPNs, or games.
     }
     ◊money["Marbles on the school yard"
            #:date "2017"
            #:img "images/marbles.png"
-           #:alt "Two people playing with marbles."]{
+           #:alt "Two people playing with marbles"]{
         Kids on the school-yard often come up with interesting forms of money. For example, collectible card games or game components. Another example is  marbles used in a Swedish game where you win your opponents marbles. (And those with many marbles had higher status in class.)◊mn{pokemon}
 
         ◊note-pos[#:bottom -20]{pokemon}
@@ -131,7 +131,7 @@ First, let's look at some interesting historical examples of items that have bee
        [else
         ""]))
    `(div ((class "example"))
-      (img ((src ,img) (alt ,alt)))
+      (img ((src ,img) (alt ,alt) (role "presentation")))
       (div ((class "txt"))
         (div ((class "header"))
           (h3 ,title)