diff --git a/accessibility.js b/accessibility.js
new file mode 100644
index 0000000..110f468
--- /dev/null
+++ b/accessibility.js
@@ -0,0 +1,16 @@
+/*jslint indent: 2, browser: true */
+
+(function () {
+  'use strict';
+
+  if (document.addEventListener && document.documentElement.classList) {
+    document.addEventListener('click', function (event) {
+      var classes = event.target.classList;
+
+      if (classes.contains('color-change')) {
+        document.getElementById('accessibility').classList[classes.contains('wob') ? 'add' : 'remove']('inverted');
+        event.preventDefault();
+      }
+    });
+  }
+}());
diff --git a/ca_nl_stjohns.html b/ca_nl_stjohns.html
index f646a84..00d207e 100644
--- a/ca_nl_stjohns.html
+++ b/ca_nl_stjohns.html
@@ -72,5 +72,6 @@ <h3>The People</h3>
         rights to this work.
       </p>
     </section> 
+    <script src="accessibility.js"></script>
   </body>
 </html>
diff --git a/ca_qc_montreal.html b/ca_qc_montreal.html
index c93f124..148cde2 100644
--- a/ca_qc_montreal.html
+++ b/ca_qc_montreal.html
@@ -39,5 +39,6 @@ <h3>Contacts</h3>
         rights to this work.
       </p>
     </section> 
+    <script src="accessibility.js"></script>
   </body>
 </html>
diff --git a/de_berlin.html b/de_berlin.html
index d4ed19e..602adee 100644
--- a/de_berlin.html
+++ b/de_berlin.html
@@ -141,5 +141,6 @@ <h4><i>Die Gruppen</i></h4>
         rights to this work.
       </p>
     </section> 
+    <script src="accessibility.js"></script>
   </body>
 </html>
diff --git a/index.html b/index.html
index 7f6bb1b..1e851df 100644
--- a/index.html
+++ b/index.html
@@ -146,6 +146,7 @@ <h4 id="groups">The Groups</h4>
         rights to this work.
       </p>
     </section>
+    <script src="accessibility.js"></script>
   </body>
 </html>
 
diff --git a/new_groups.html b/new_groups.html
index 03aeca6..f11a1cf 100644
--- a/new_groups.html
+++ b/new_groups.html
@@ -74,5 +74,6 @@ <h1>Starting a Group</h1>
         rights to this work.
       </p>
     </section>
+    <script src="accessibility.js"></script>
   </body>
 </html>
diff --git a/style.css b/style.css
index 3199315..ae3361c 100644
--- a/style.css
+++ b/style.css
@@ -19,17 +19,17 @@ body {
     background-color:black;
     padding:0.2em;
 }
-#accessibility:target{
+#accessibility:target, #accessibility.inverted {
     color:white;
     background-color:black;
 }
-#accessibility:target a{
+#accessibility:target a, #accessibility.inverted a {
     color:white;
 }
-#accessibility:target .wob{
+#accessibility:target .wob, #accessibility.inverted .wob {
     display:none;
 }
-#accessibility:target .bow{
+#accessibility:target .bow, #accessibility.inverted .bow {
     display:inline;
 }
 section {
diff --git a/uk_east_london.html b/uk_east_london.html
index 79b1b1a..cc0cebd 100644
--- a/uk_east_london.html
+++ b/uk_east_london.html
@@ -85,5 +85,6 @@ <h3>The People</h3>
         rights to this work.
       </p>
     </section> 
+    <script src="accessibility.js"></script>
   </body>
 </html>
diff --git a/uk_edinburgh.html b/uk_edinburgh.html
index d6261ef..f269b83 100644
--- a/uk_edinburgh.html
+++ b/uk_edinburgh.html
@@ -153,5 +153,6 @@ <h4>People to contact:</h4>
         rights to this work.
       </p>
     </section> 
+    <script src="accessibility.js"></script>
   </body>
 </html>
diff --git a/uk_manchester.html b/uk_manchester.html
index 8dd2874..afd20a6 100644
--- a/uk_manchester.html
+++ b/uk_manchester.html
@@ -49,5 +49,6 @@ <h2 id="venues">Potential Venues</h2>
       
       
     </section>
+    <script src="accessibility.js"></script>
   </body>
 </html>
diff --git a/uk_oxford.html b/uk_oxford.html
index e5fc43c..23421c1 100644
--- a/uk_oxford.html
+++ b/uk_oxford.html
@@ -52,6 +52,7 @@ <h4 id="location">The Date &amp; Location</h4>
         rights to this work.
       </p>
     </section>
+    <script src="accessibility.js"></script>
   </body>
 </html>
 
diff --git a/uk_west_london.html b/uk_west_london.html
index 1a28c9c..a294f6c 100644
--- a/uk_west_london.html
+++ b/uk_west_london.html
@@ -46,5 +46,6 @@ <h3>The People</h3>
         rights to this work.
       </p>
     </section> 
+    <script src="accessibility.js"></script>
   </body>
 </html>
diff --git a/us_austin.html b/us_austin.html
index e3d7df6..e86ba2a 100644
--- a/us_austin.html
+++ b/us_austin.html
@@ -73,5 +73,6 @@ <h3>The People</h3>
         rights to this work.
       </p>
     </section> 
+    <script src="accessibility.js"></script>
   </body>
 </html>
diff --git a/us_boston.html b/us_boston.html
index d919d33..87a2692 100644
--- a/us_boston.html
+++ b/us_boston.html
@@ -52,5 +52,6 @@ <h3>The People</h3>
         rights to this work.
       </p>
     </section> 
+    <script src="accessibility.js"></script>
   </body>
 </html>
diff --git a/us_sanfrancisco.html b/us_sanfrancisco.html
index 4258b76..b208d43 100644
--- a/us_sanfrancisco.html
+++ b/us_sanfrancisco.html
@@ -133,5 +133,6 @@ <h3>The People</h3>
         rights to this work.
       </p>
     </section> 
+    <script src="accessibility.js"></script>
   </body>
 </html>