docs(changelog): update changelog [skip ci]

Signed-off-by: Alexander Lyall <alex@adcm.uk>

.gitea/workflows/publish.yaml

@@ -1,33 +0,0 @@
-name: Publish to Server
-run-name: ${{ gitea.actor }} is publishing your site using Gitea Actions 🚀
-
-on:
-  workflow_dispatch:
-  # Trigger the workflow on push
-  push:
-    branches: [main]
-
-# Authenticate to the the server via ssh
-# and run our deployment script (sftp upload)
-jobs:
-  deploy:
-    name: Deploy
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v3
-
-      - name: SFTP upload
-        uses: Dylan700/sftp-upload-action@latest
-        with:
-          server: ${{ vars.SSH_HOST }}
-          username: ${{ vars.SSH_USERNAME }}
-          key: ${{ secrets.SSH_KEY }}
-          passphrase: ${{ secrets.KEY_PASSWORD }}
-          port: 22
-          uploads: |
-            ${{ vars.GIT_FOLDER }} => ${{ vars.SSH_FOLDER }}
-          delete: 'false'
-          ignore: |
-            *.git
-            */**/*git*

.gitea/workflows/release.yaml

@@ -0,0 +1,235 @@
+name: Changelog + Release on main
+
+on:
+  push:
+    branches: [ main ]
+  workflow_dispatch:
+
+jobs:
+  changelog_and_release:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout (full history + tags)
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Stop if this is the bot changelog commit
+        shell: bash
+        run: |
+          set -e
+          msg="$(git log -1 --pretty=%B)"
+          echo "$msg" | tr -d '\r' | grep -qi "\[skip ci\]" && {
+            echo "Skipping (bot commit with [skip ci])"
+            exit 0
+          } || true
+
+      - name: Install git-cliff
+        shell: bash
+        run: |
+          set -e
+          GIT_CLIFF_VERSION="2.11.0"
+          URL="https://github.com/orhun/git-cliff/releases/download/v${GIT_CLIFF_VERSION}/git-cliff-${GIT_CLIFF_VERSION}-x86_64-unknown-linux-gnu.tar.gz"
+          curl -L "$URL" -o /tmp/git-cliff.tar.gz
+          tar -xzf /tmp/git-cliff.tar.gz -C /tmp
+          sudo install /tmp/git-cliff-*/git-cliff /usr/local/bin/git-cliff
+          git-cliff --version
+
+      - name: Generate CHANGELOG.md (Keep a Changelog)
+        shell: bash
+        run: |
+          set -e
+          git-cliff --config cliff.toml --output CHANGELOG.md
+          test -s CHANGELOG.md
+
+      - name: Commit and push CHANGELOG.md if changed (CHANGELOG_PAT)
+        shell: bash
+        env:
+          CHANGELOG_PAT: ${{ secrets.CHANGELOG_PAT }}
+        run: |
+          set -e
+
+          if git diff --quiet -- CHANGELOG.md; then
+            echo "No changelog changes."
+          else
+            git config user.name "changelog-bot"
+            git config user.email "changelog-bot@users.noreply.local"
+
+            git add CHANGELOG.md
+            git commit -m "docs(changelog): update changelog [skip ci]"
+
+            origin_url="$(git remote get-url origin)"
+
+            # Convert SSH origin to HTTPS if needed
+            if echo "$origin_url" | grep -q "^git@"; then
+              host="$(echo "$origin_url" | sed -E 's#git@([^:]+):.*#\1#')"
+              path="$(echo "$origin_url" | sed -E 's#git@[^:]+:(.*)#\1#')"
+              origin_url="https://$host/$path"
+            fi
+
+            authed_url="$(echo "$origin_url" | sed -E "s#^https://#https://oauth2:${CHANGELOG_PAT}@#")"
+            git push "$authed_url" HEAD:main
+          fi
+
+      - name: Extract newest changelog section for release body
+        shell: bash
+        run: |
+          set -e
+          # Extract the first "## ..." section (newest section) from CHANGELOG.md
+          # Includes the "## ..." heading and everything until the next "## ..." heading.
+          awk '
+            /^## / { if (seen) exit; seen=1 }
+            seen { print }
+          ' CHANGELOG.md > RELEASE_NOTES.md
+
+          # Clean trailing whitespace/newlines a bit
+          sed -i 's/[[:space:]]*$//' RELEASE_NOTES.md
+
+          test -s RELEASE_NOTES.md
+          echo "---- RELEASE_NOTES.md ----"
+          head -n 60 RELEASE_NOTES.md
+          echo "--------------------------"
+
+      - name: Create export zip (Computing:Box Website.zip)
+        shell: bash
+        run: |
+          set -e
+          if [ ! -d "export" ]; then
+            echo "❌ export/ folder not found in repo root"
+            ls -la
+            exit 1
+          fi
+
+          rm -f "Computing:Box Website.zip"
+          (cd export && zip -r "../Computing:Box Website.zip" .)
+          test -s "Computing:Box Website.zip"
+          ls -lh "Computing:Box Website.zip"
+
+      - name: Prepare YY.MM.DD letter-suffix tag + release name
+        shell: bash
+        run: |
+          set -e
+
+          # Version: YY.MM.DD (UTC). Swap to `date +...` if you prefer UK-local runner time.
+          VERSION="$(date -u +'%y.%m.%d')"
+          PREFIX="v${VERSION}."
+
+          last_letter="$(
+            git tag --list "${PREFIX}[a-z]" \
+              | sed -E "s/^${PREFIX}([a-z])$/\1/" \
+              | sort \
+              | tail -n 1
+          )"
+
+          if [ -z "$last_letter" ]; then
+            next_letter="a"
+          else
+            if [ "$last_letter" = "z" ]; then
+              echo "❌ Already have v${VERSION}.z today. Refusing to create more than 26 releases/day."
+              exit 1
+            fi
+            next_letter="$(printf "%b" "$(printf '\\%03o' "$(( $(printf '%d' "'$last_letter") + 1 ))")")"
+          fi
+
+          TAG="${PREFIX}${next_letter}"
+          RELEASE_NAME="Computing:Box v${VERSION}.${next_letter}"
+
+          echo "TAG=$TAG" >> "$GITHUB_ENV"
+          echo "RELEASE_NAME=$RELEASE_NAME" >> "$GITHUB_ENV"
+          echo "ZIP_PATH=Computing:Box Website.zip" >> "$GITHUB_ENV"
+
+          echo "Using tag: $TAG"
+          echo "Release name: $RELEASE_NAME"
+
+      - name: Create and push tag (CHANGELOG_PAT)
+        shell: bash
+        env:
+          CHANGELOG_PAT: ${{ secrets.CHANGELOG_PAT }}
+        run: |
+          set -e
+
+          git tag -f "$TAG"
+
+          origin_url="$(git remote get-url origin)"
+
+          # Convert SSH origin to HTTPS if needed
+          if echo "$origin_url" | grep -q "^git@"; then
+            host="$(echo "$origin_url" | sed -E 's#git@([^:]+):.*#\1#')"
+            path="$(echo "$origin_url" | sed -E 's#git@[^:]+:(.*)#\1#')"
+            origin_url="https://$host/$path"
+          fi
+
+          authed_url="$(echo "$origin_url" | sed -E "s#^https://#https://oauth2:${CHANGELOG_PAT}@#")"
+          git push "$authed_url" "refs/tags/$TAG" --force
+
+      - name: Create Gitea release + upload asset (CHANGELOG_PAT)
+        shell: bash
+        env:
+          CHANGELOG_PAT: ${{ secrets.CHANGELOG_PAT }}
+        run: |
+          set -e
+
+          origin_url="$(git remote get-url origin)"
+          if echo "$origin_url" | grep -q "^git@"; then
+            host="$(echo "$origin_url" | sed -E 's#git@([^:]+):.*#\1#')"
+            path="$(echo "$origin_url" | sed -E 's#git@[^:]+:(.*)#\1#')"
+            origin_url="https://$host/$path"
+          fi
+
+          base="$(echo "$origin_url" | sed -E 's#(https?://[^/]+)/.*#\1#')"
+          repo_path="$(echo "$origin_url" | sed -E 's#https?://[^/]+/##')"
+          repo_path="$(echo "$repo_path" | sed -E 's/\.git$//')"
+
+          owner="$(echo "$repo_path" | cut -d/ -f1)"
+          repo="$(echo "$repo_path" | cut -d/ -f2-)"
+
+          api="$base/api/v1"
+
+          python3 - <<'PY'
+          import json, os
+          tag = os.environ["TAG"]
+          name = os.environ["RELEASE_NAME"]
+
+          with open("RELEASE_NOTES.md", "r", encoding="utf-8") as f:
+              body = f.read()
+
+          payload = {
+              "tag_name": tag,
+              "target_commitish": "main",
+              "name": name,
+              "body": body,   # newest section only
+              "draft": False,
+              "prerelease": False,
+          }
+
+          with open("release.json", "w", encoding="utf-8") as f:
+              json.dump(payload, f)
+          PY
+
+          curl -sS -X POST \
+            -H "Authorization: Bearer ${CHANGELOG_PAT}" \
+            -H "Content-Type: application/json" \
+            "${api}/repos/${owner}/${repo}/releases" \
+            --data-binary @release.json \
+            -o release_response.json
+
+          release_id="$(python3 - <<'PY'
+          import json
+          with open("release_response.json","r",encoding="utf-8") as f:
+              data=json.load(f)
+          rid=data.get("id")
+          if not rid:
+              raise SystemExit("No release id returned. Response:\n" + json.dumps(data, indent=2))
+          print(rid)
+          PY
+          )"
+          echo "Created release id: $release_id"
+
+          curl -sS -X POST \
+            -H "Authorization: Bearer ${CHANGELOG_PAT}" \
+            "${api}/repos/${owner}/${repo}/releases/${release_id}/assets?name=Computing%3ABox%20Website.zip" \
+            -F "attachment=@${ZIP_PATH}" \
+            >/dev/null
+
+          echo "✅ Release created: ${RELEASE_NAME} (tag: ${TAG}) with asset uploaded"

CHANGELOG.md

@@ -0,0 +1,112 @@
+# Changelog
+
+All notable changes to this project will be documented in this file.
+
+The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
+and this project adheres to [Conventional Commits](https://www.conventionalcommits.org/).
+
+## [Unreleased]
+
+
+
+## [v25.12.26.a] - 2025-12-26
+
+
+
+### Documentation
+
+
+- update changelog [skip ci]
+
+- update changelog [skip ci]
+
+
+## [main-29-c9402db] - 2025-12-26
+
+
+
+### Documentation
+
+
+- update changelog [skip ci]
+
+
+## [main-27-82654d9] - 2025-12-26
+
+
+
+### Documentation
+
+
+- update changelog [skip ci]
+
+- update changelog [skip ci]
+
+- update changelog [skip ci]
+
+
+## [v1.9] - 2025-12-26
+
+
+
+### Added
+
+
+- migrate CS:Box content to Computing:Box branding
+
+
+### Bit
+
+
+- Box Feature Migration
+
+
+### CI
+
+
+- add Gitea Actions workflow for site publishing
+
+
+### Chore
+
+
+- update CODEOWNERS and remove exported site artifacts
+
+- reorganise project files and add exported pages
+
+- add git-cliff config
+
+- standardise analytics, branding, and licensing across exported pages
+
+
+### Documentation
+
+
+- apply Creative Commons licence to V1 exported site
+
+- v1.9
+
+- update changelog [skip ci]
+
+
+### Reverted
+
+
+- revert 268a82f17c00792b8e678b5fb93383ae36200dfc
+
+revert ci(deploy): add Gitea Actions workflow for site publishing
+
+- Add publish workflow to deploy main branch via SFTP
+- Configure workflow dispatch and push-to-main triggers
+- Use repository variables and secrets for SSH credentials
+- Update README logo markup for consistent sizing
+
+Signed-off-by: Alexander Davis <alex@adcm.uk>
+
+
+### Signed-off-by
+
+
+- Alexander Davis <alex@adcm.uk>
+
+<!-- generated by git-cliff -->

CODEOWNERS

@@ -3,6 +3,6 @@
 
 # These owners will be the default owners for everything in
 # the repo. Unless a later match takes precedence,
-# @MrDavisCSIT be requested for
+# @alexander.lyall be requested for
 # review when someone opens a pull request.
-*       @MrDavisCSIT
+*       @alexander.lyall

Export/and-gate.html

@@ -1,148 +0,0 @@
-<!DOCTYPE html>
-<html data-bs-theme="auto" lang="en" style="background: rgb(45,44,56);">
-
-<head>
-    <meta charset="utf-8">
-<!-- Matomo -->
-<script>
-  var _paq = window._paq = window._paq || [];
-  /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
-  _paq.push(['trackPageView']);
-  _paq.push(['enableLinkTracking']);
-  (function() {
-    var u="//analytics.adcmnetworks.co.uk/";
-    _paq.push(['setTrackerUrl', u+'matomo.php']);
-    _paq.push(['setSiteId', '2']);
-    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
-    g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
-  })();
-</script>
-<!-- End Matomo Code -->
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
-    <title>AND Gate Simulator - CS:Box</title>
-    <meta name="twitter:card" content="summary_large_image">
-    <meta property="og:type" content="website">
-    <meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
-    <script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&amp;display=swap">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans&amp;display=swap">
-    <link rel="stylesheet" href="assets/css/styles.min.css?h=05023c48128d85662d4f89782ddfb125">
-</head>
-
-<body>
-    <header class="bg-dark">
-        <!-- Start: Site Navigation -->
-        <nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
-            <div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
-                <div class="collapse navbar-collapse" id="navcol-5">
-                    <ul class="navbar-nav ms-auto">
-                        <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
-                        <li class="nav-item"><a class="nav-link" href="about">About</a></li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Binary</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="unsigned-binary">Unsigned Integers</a><a class="dropdown-item" href="twos-compliment-binary">Two's Compliment</a></div>
-                        </li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Hexadecimal</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="gcse-hexadecimal">GCSE</a><a class="dropdown-item" href="a-level-hexadecimal">A Level</a></div>
-                        </li>
-                        <li class="nav-item"><a class="nav-link" href="hex-colours">Hex Colours</a></li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link active" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Logic Gates</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="not-gate">NOT</a><a class="dropdown-item active" href="and-gate">AND</a><a class="dropdown-item" href="or-gate">OR</a><a class="dropdown-item" href="nor-gate">NOR</a><a class="dropdown-item" href="nand-gate">NAND</a><a class="dropdown-item" href="xor-gate">XOR</a><a class="dropdown-item" href="xnor-gate">XNOR</a></div>
-                        </li>
-                    </ul>
-                </div>
-            </div>
-        </nav><!-- End: Site Navigation -->
-    </header><!-- Start: Hero Banner Color -->
-    <section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
-        <div class="container h-100">
-            <div class="text-white border rounded border-0 p-1 bg-danger">
-                <div class="row h-100">
-                    <div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
-                        <div>
-                            <h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE&nbsp;Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
-                            <p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </section><!-- End: Hero Banner Color -->
-    <section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
-        <!-- Start: 1 Row 2 Columns -->
-        <div class="container" style="width: 100%;margin-top: 15px;">
-            <div class="row">
-                <div class="col" style="height: 120px;"></div>
-            </div>
-            <div class="row">
-                <div class="col">
-                    <h1 id="pageHeading" class="simHeading">AND Gate</h1>
-                </div>
-            </div>
-        </div><!-- End: 1 Row 2 Columns -->
-        <!-- Start: 1 Row 3 Columns -->
-        <div class="container">
-            <div class="row">
-                <div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;transform: translate(58px);">⏼</button><button class="btn btn-primary buttonMiddle logicGateInput2" id="swtInput2" type="button" onclick="toggleInput(2)" style="position: relative;display: grid;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/thumb/6/64/AND_ANSI.svg/1920px-AND_ANSI.svg.png" width="460" height="240">
-                    <h1 id="blbAndGate" class="poweredOff dualInputSingleOutput">💡<br></h1>
-                </div>
-            </div>
-            <div class="row">
-                <div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
-            </div>
-        </div><!-- End: 1 Row 3 Columns -->
-        <div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
-    </section><!-- Start: Footer Multi Column -->
-    <footer style="background: rgb(45,44,56);">
-        <div class="container py-4 py-lg-5">
-            <div class="row justify-content-center">
-                <!-- Start: About Project -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
-                        <div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
-                                <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                            </svg><span>GitHub</span></div>
-                    </a>
-                </div><!-- End: About Project -->
-                <!-- Start: About -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
-                <!-- Start: Social Links -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
-                    <div class="row">
-                        <div class="col-md-3"><a href="https://mstdn.social/@MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-mastodon social-media">
-                                    <path d="M11.19 12.195c2.016-.24 3.77-1.475 3.99-2.603.348-1.778.32-4.339.32-4.339 0-3.47-2.286-4.488-2.286-4.488C12.062.238 10.083.017 8.027 0h-.05C5.92.017 3.942.238 2.79.765c0 0-2.285 1.017-2.285 4.488l-.002.662c-.004.64-.007 1.35.011 2.091.083 3.394.626 6.74 3.78 7.57 1.454.383 2.703.463 3.709.408 1.823-.1 2.847-.647 2.847-.647l-.06-1.317s-1.303.41-2.767.36c-1.45-.05-2.98-.156-3.215-1.928a3.614 3.614 0 0 1-.033-.496s1.424.346 3.228.428c1.103.05 2.137-.064 3.188-.189zm1.613-2.47H11.13v-4.08c0-.859-.364-1.295-1.091-1.295-.804 0-1.207.517-1.207 1.541v2.233H7.168V5.89c0-1.024-.403-1.541-1.207-1.541-.727 0-1.091.436-1.091 1.296v4.079H3.197V5.522c0-.859.22-1.541.66-2.046.456-.505 1.052-.764 1.793-.764.856 0 1.504.328 1.933.983L8 4.39l.417-.695c.429-.655 1.077-.983 1.934-.983.74 0 1.336.259 1.791.764.442.505.661 1.187.661 2.046v4.203z"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://www.linkedin.com/in/alexanderedavis/" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-linkedin social-media">
-                                    <path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854V1.146zm4.943 12.248V6.169H2.542v7.225h2.401m-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248-.822 0-1.359.54-1.359 1.248 0 .694.521 1.248 1.327 1.248h.016zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016a5.54 5.54 0 0 1 .016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225h2.4"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://github.com/MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github social-media">
-                                    <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"></div>
-                    </div>
-                </div><!-- End: Social Links -->
-                <!-- Start: Branding -->
-                <div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
-                    <div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
-                    <p class="text-muted">Computer Science Concept Simulators</p>
-                </div><!-- End: Branding -->
-            </div>
-            <hr>
-            <div class="text-muted d-flex justify-content-between align-items-center pt-3">
-                <p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
-            </div>
-        </div>
-    </footer><!-- End: Footer Multi Column -->
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
-    <script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
-</body>
-
-</html>

Export/index.html

@@ -1,150 +0,0 @@
-<!DOCTYPE html>
-<html data-bs-theme="auto" lang="en">
-
-<head>
-    <meta charset="utf-8">
-<!-- Matomo -->
-<script>
-  var _paq = window._paq = window._paq || [];
-  /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
-  _paq.push(['trackPageView']);
-  _paq.push(['enableLinkTracking']);
-  (function() {
-    var u="//analytics.adcmnetworks.co.uk/";
-    _paq.push(['setTrackerUrl', u+'matomo.php']);
-    _paq.push(['setSiteId', '2']);
-    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
-    g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
-  })();
-</script>
-<!-- End Matomo Code -->
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
-    <title>Welcome to CS:Box</title>
-    <meta name="twitter:card" content="summary_large_image">
-    <meta property="og:type" content="website">
-    <meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
-    <script type="application/ld+json">
-        {
-            "@context": "http://schema.org",
-            "@type": "WebSite",
-            "name": "CS:Box",
-            "url": "https://csbox.mrdaviscsit.uk"
-        }
-    </script><script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&amp;display=swap">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans&amp;display=swap">
-    <link rel="stylesheet" href="assets/css/styles.min.css?h=05023c48128d85662d4f89782ddfb125">
-</head>
-
-<body>
-    <header class="bg-dark">
-        <!-- Start: Site Navigation -->
-        <nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
-            <div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
-                <div class="collapse navbar-collapse" id="navcol-5">
-                    <ul class="navbar-nav ms-auto">
-                        <li class="nav-item"><a class="nav-link active" href="/">Home</a></li>
-                        <li class="nav-item"><a class="nav-link" href="about">About</a></li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Binary</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="unsigned-binary">Unsigned Integers</a><a class="dropdown-item" href="twos-compliment-binary">Two's Compliment</a></div>
-                        </li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Hexadecimal</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="gcse-hexadecimal">GCSE</a><a class="dropdown-item" href="a-level-hexadecimal">A Level</a></div>
-                        </li>
-                        <li class="nav-item"><a class="nav-link" href="hex-colours">Hex Colours</a></li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Logic Gates</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="not-gate">NOT</a><a class="dropdown-item" href="and-gate">AND</a><a class="dropdown-item" href="or-gate">OR</a><a class="dropdown-item" href="nor-gate">NOR</a><a class="dropdown-item" href="nand-gate">NAND</a><a class="dropdown-item" href="xor-gate">XOR</a><a class="dropdown-item" href="xnor-gate">XNOR</a></div>
-                        </li>
-                    </ul>
-                </div>
-            </div>
-        </nav><!-- End: Site Navigation -->
-    </header><!-- Start: Hero Banner Color -->
-    <section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
-        <div class="container h-100">
-            <div class="text-white border rounded border-0 p-1 bg-danger">
-                <div class="row h-100">
-                    <div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
-                        <div>
-                            <h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE&nbsp;Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
-                            <p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </section><!-- End: Hero Banner Color -->
-    <section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block">
-        <!-- Start: Hero Clean Reverse -->
-        <div class="container py-5">
-            <div class="row py-5">
-                <div class="col-md-6 text-center text-md-start d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-end mb-4">
-                    <div style="max-width: 450px;">
-                        <p class="fw-bold text-success mb-2">Version 1 Available Now</p>
-                        <h2 class="fw-bold">Understand Computer Science concepts better.</h2>
-                        <p class="completeFeatures"><strong>Coming Soon to CS:Box</strong></p>
-                        <p class="completeFeatures"></p>
-                        <p class="introP">Enhanced User Interface (UI) / User Experience (UX)<br>Interactive Lessons / Tutorials<br>Expanded Gate Functionality<br>Curriculum-Specific Tools<br>Classroom &amp; Teacher Tools<br>Enhanced Reporting / Analytics</p><a href="projects"><button class="btn btn-primary" type="button">Learn More</button></a>
-                    </div>
-                </div>
-                <div class="col-md-6 mb-4">
-                    <div class="p-5 mx-lg-5"><img class="rounded img-fluid shadow w-100 fit-cover" style="min-height: 300px;" src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71"></div>
-                </div>
-                <div class="col"></div>
-            </div>
-        </div><!-- End: Hero Clean Reverse -->
-    </section><!-- Start: Footer Multi Column -->
-    <footer style="background: rgb(45,44,56);">
-        <div class="container py-4 py-lg-5">
-            <div class="row justify-content-center">
-                <!-- Start: About Project -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
-                        <div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
-                                <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                            </svg><span>GitHub</span></div>
-                    </a>
-                </div><!-- End: About Project -->
-                <!-- Start: About -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
-                <!-- Start: Social Links -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
-                    <div class="row">
-                        <div class="col-md-3"><a href="https://mstdn.social/@MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-mastodon social-media">
-                                    <path d="M11.19 12.195c2.016-.24 3.77-1.475 3.99-2.603.348-1.778.32-4.339.32-4.339 0-3.47-2.286-4.488-2.286-4.488C12.062.238 10.083.017 8.027 0h-.05C5.92.017 3.942.238 2.79.765c0 0-2.285 1.017-2.285 4.488l-.002.662c-.004.64-.007 1.35.011 2.091.083 3.394.626 6.74 3.78 7.57 1.454.383 2.703.463 3.709.408 1.823-.1 2.847-.647 2.847-.647l-.06-1.317s-1.303.41-2.767.36c-1.45-.05-2.98-.156-3.215-1.928a3.614 3.614 0 0 1-.033-.496s1.424.346 3.228.428c1.103.05 2.137-.064 3.188-.189zm1.613-2.47H11.13v-4.08c0-.859-.364-1.295-1.091-1.295-.804 0-1.207.517-1.207 1.541v2.233H7.168V5.89c0-1.024-.403-1.541-1.207-1.541-.727 0-1.091.436-1.091 1.296v4.079H3.197V5.522c0-.859.22-1.541.66-2.046.456-.505 1.052-.764 1.793-.764.856 0 1.504.328 1.933.983L8 4.39l.417-.695c.429-.655 1.077-.983 1.934-.983.74 0 1.336.259 1.791.764.442.505.661 1.187.661 2.046v4.203z"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://www.linkedin.com/in/alexanderedavis/" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-linkedin social-media">
-                                    <path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854V1.146zm4.943 12.248V6.169H2.542v7.225h2.401m-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248-.822 0-1.359.54-1.359 1.248 0 .694.521 1.248 1.327 1.248h.016zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016a5.54 5.54 0 0 1 .016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225h2.4"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://github.com/MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github social-media">
-                                    <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"></div>
-                    </div>
-                </div><!-- End: Social Links -->
-                <!-- Start: Branding -->
-                <div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
-                    <div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
-                    <p class="text-muted">Computer Science Concept Simulators</p>
-                </div><!-- End: Branding -->
-            </div>
-            <hr>
-            <div class="text-muted d-flex justify-content-between align-items-center pt-3">
-                <p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
-            </div>
-        </div>
-    </footer><!-- End: Footer Multi Column -->
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
-    <script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
-</body>
-
-</html>

Export/nand-gate.html

@@ -1,148 +0,0 @@
-<!DOCTYPE html>
-<html data-bs-theme="auto" lang="en" style="background: rgb(45,44,56);">
-
-<head>
-    <meta charset="utf-8">
-<!-- Matomo -->
-<script>
-  var _paq = window._paq = window._paq || [];
-  /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
-  _paq.push(['trackPageView']);
-  _paq.push(['enableLinkTracking']);
-  (function() {
-    var u="//analytics.adcmnetworks.co.uk/";
-    _paq.push(['setTrackerUrl', u+'matomo.php']);
-    _paq.push(['setSiteId', '2']);
-    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
-    g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
-  })();
-</script>
-<!-- End Matomo Code -->
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
-    <title>NAND Gate Simulator - CS:Box</title>
-    <meta name="twitter:card" content="summary_large_image">
-    <meta property="og:type" content="website">
-    <meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
-    <script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&amp;display=swap">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans&amp;display=swap">
-    <link rel="stylesheet" href="assets/css/styles.min.css?h=05023c48128d85662d4f89782ddfb125">
-</head>
-
-<body>
-    <header class="bg-dark">
-        <!-- Start: Site Navigation -->
-        <nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
-            <div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
-                <div class="collapse navbar-collapse" id="navcol-5">
-                    <ul class="navbar-nav ms-auto">
-                        <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
-                        <li class="nav-item"><a class="nav-link" href="about">About</a></li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Binary</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="unsigned-binary">Unsigned Integers</a><a class="dropdown-item" href="twos-compliment-binary">Two's Compliment</a></div>
-                        </li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Hexadecimal</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="gcse-hexadecimal">GCSE</a><a class="dropdown-item" href="a-level-hexadecimal">A Level</a></div>
-                        </li>
-                        <li class="nav-item"><a class="nav-link" href="hex-colours">Hex Colours</a></li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link active" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Logic Gates</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="not-gate">NOT</a><a class="dropdown-item" href="and-gate">AND</a><a class="dropdown-item" href="or-gate">OR</a><a class="dropdown-item" href="nor-gate">NOR</a><a class="dropdown-item active" href="nand-gate">NAND</a><a class="dropdown-item" href="xor-gate">XOR</a><a class="dropdown-item" href="xnor-gate">XNOR</a></div>
-                        </li>
-                    </ul>
-                </div>
-            </div>
-        </nav><!-- End: Site Navigation -->
-    </header><!-- Start: Hero Banner Color -->
-    <section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
-        <div class="container h-100">
-            <div class="text-white border rounded border-0 p-1 bg-danger">
-                <div class="row h-100">
-                    <div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
-                        <div>
-                            <h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE&nbsp;Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
-                            <p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </section><!-- End: Hero Banner Color -->
-    <section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
-        <!-- Start: 1 Row 2 Columns -->
-        <div class="container" style="width: 100%;margin-top: 15px;">
-            <div class="row">
-                <div class="col" style="height: 120px;"></div>
-            </div>
-            <div class="row">
-                <div class="col">
-                    <h1 id="pageHeading" class="simHeading">NAND Gate</h1>
-                </div>
-            </div>
-        </div><!-- End: 1 Row 2 Columns -->
-        <!-- Start: 1 Row 3 Columns -->
-        <div class="container">
-            <div class="row">
-                <div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;transform: translate(58px);">⏼</button><button class="btn btn-primary buttonMiddle logicGateInput2" id="swtInput2" type="button" onclick="toggleInput(2)" style="position: relative;display: grid;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/f/f2/NAND_ANSI.svg" width="460" height="240">
-                    <h1 id="blbNandGate" class="poweredOn dualInputSingleOutput">💡<br></h1>
-                </div>
-            </div>
-            <div class="row">
-                <div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset-1" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
-            </div>
-        </div><!-- End: 1 Row 3 Columns -->
-        <div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
-    </section><!-- Start: Footer Multi Column -->
-    <footer style="background: rgb(45,44,56);">
-        <div class="container py-4 py-lg-5">
-            <div class="row justify-content-center">
-                <!-- Start: About Project -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
-                        <div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
-                                <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                            </svg><span>GitHub</span></div>
-                    </a>
-                </div><!-- End: About Project -->
-                <!-- Start: About -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
-                <!-- Start: Social Links -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
-                    <div class="row">
-                        <div class="col-md-3"><a href="https://mstdn.social/@MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-mastodon social-media">
-                                    <path d="M11.19 12.195c2.016-.24 3.77-1.475 3.99-2.603.348-1.778.32-4.339.32-4.339 0-3.47-2.286-4.488-2.286-4.488C12.062.238 10.083.017 8.027 0h-.05C5.92.017 3.942.238 2.79.765c0 0-2.285 1.017-2.285 4.488l-.002.662c-.004.64-.007 1.35.011 2.091.083 3.394.626 6.74 3.78 7.57 1.454.383 2.703.463 3.709.408 1.823-.1 2.847-.647 2.847-.647l-.06-1.317s-1.303.41-2.767.36c-1.45-.05-2.98-.156-3.215-1.928a3.614 3.614 0 0 1-.033-.496s1.424.346 3.228.428c1.103.05 2.137-.064 3.188-.189zm1.613-2.47H11.13v-4.08c0-.859-.364-1.295-1.091-1.295-.804 0-1.207.517-1.207 1.541v2.233H7.168V5.89c0-1.024-.403-1.541-1.207-1.541-.727 0-1.091.436-1.091 1.296v4.079H3.197V5.522c0-.859.22-1.541.66-2.046.456-.505 1.052-.764 1.793-.764.856 0 1.504.328 1.933.983L8 4.39l.417-.695c.429-.655 1.077-.983 1.934-.983.74 0 1.336.259 1.791.764.442.505.661 1.187.661 2.046v4.203z"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://www.linkedin.com/in/alexanderedavis/" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-linkedin social-media">
-                                    <path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854V1.146zm4.943 12.248V6.169H2.542v7.225h2.401m-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248-.822 0-1.359.54-1.359 1.248 0 .694.521 1.248 1.327 1.248h.016zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016a5.54 5.54 0 0 1 .016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225h2.4"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://github.com/MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github social-media">
-                                    <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"></div>
-                    </div>
-                </div><!-- End: Social Links -->
-                <!-- Start: Branding -->
-                <div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
-                    <div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
-                    <p class="text-muted">Computer Science Concept Simulators</p>
-                </div><!-- End: Branding -->
-            </div>
-            <hr>
-            <div class="text-muted d-flex justify-content-between align-items-center pt-3">
-                <p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
-            </div>
-        </div>
-    </footer><!-- End: Footer Multi Column -->
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
-    <script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
-</body>
-
-</html>

Export/nor-gate.html

@@ -1,148 +0,0 @@
-<!DOCTYPE html>
-<html data-bs-theme="auto" lang="en" style="background: rgb(45,44,56);">
-
-<head>
-    <meta charset="utf-8">
-<!-- Matomo -->
-<script>
-  var _paq = window._paq = window._paq || [];
-  /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
-  _paq.push(['trackPageView']);
-  _paq.push(['enableLinkTracking']);
-  (function() {
-    var u="//analytics.adcmnetworks.co.uk/";
-    _paq.push(['setTrackerUrl', u+'matomo.php']);
-    _paq.push(['setSiteId', '2']);
-    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
-    g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
-  })();
-</script>
-<!-- End Matomo Code -->
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
-    <title>NOR Gate Simulator - CS:Box</title>
-    <meta name="twitter:card" content="summary_large_image">
-    <meta property="og:type" content="website">
-    <meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
-    <script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&amp;display=swap">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans&amp;display=swap">
-    <link rel="stylesheet" href="assets/css/styles.min.css?h=05023c48128d85662d4f89782ddfb125">
-</head>
-
-<body>
-    <header class="bg-dark">
-        <!-- Start: Site Navigation -->
-        <nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
-            <div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
-                <div class="collapse navbar-collapse" id="navcol-5">
-                    <ul class="navbar-nav ms-auto">
-                        <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
-                        <li class="nav-item"><a class="nav-link" href="about">About</a></li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Binary</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="unsigned-binary">Unsigned Integers</a><a class="dropdown-item" href="twos-compliment-binary">Two's Compliment</a></div>
-                        </li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Hexadecimal</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="gcse-hexadecimal">GCSE</a><a class="dropdown-item" href="a-level-hexadecimal">A Level</a></div>
-                        </li>
-                        <li class="nav-item"><a class="nav-link" href="hex-colours">Hex Colours</a></li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link active" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Logic Gates</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="not-gate">NOT</a><a class="dropdown-item" href="and-gate">AND</a><a class="dropdown-item" href="or-gate">OR</a><a class="dropdown-item active" href="nor-gate">NOR</a><a class="dropdown-item" href="nand-gate">NAND</a><a class="dropdown-item" href="xor-gate">XOR</a><a class="dropdown-item" href="xnor-gate">XNOR</a></div>
-                        </li>
-                    </ul>
-                </div>
-            </div>
-        </nav><!-- End: Site Navigation -->
-    </header><!-- Start: Hero Banner Color -->
-    <section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
-        <div class="container h-100">
-            <div class="text-white border rounded border-0 p-1 bg-danger">
-                <div class="row h-100">
-                    <div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
-                        <div>
-                            <h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE&nbsp;Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
-                            <p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </section><!-- End: Hero Banner Color -->
-    <section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
-        <!-- Start: 1 Row 2 Columns -->
-        <div class="container" style="width: 100%;margin-top: 15px;">
-            <div class="row">
-                <div class="col" style="height: 120px;"></div>
-            </div>
-            <div class="row">
-                <div class="col">
-                    <h1 id="pageHeading" class="simHeading">NOR Gate</h1>
-                </div>
-            </div>
-        </div><!-- End: 1 Row 2 Columns -->
-        <!-- Start: 1 Row 3 Columns -->
-        <div class="container">
-            <div class="row">
-                <div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;transform: translate(58px);">⏼</button><button class="btn btn-primary buttonMiddle logicGateInput2" id="swtInput2" type="button" onclick="toggleInput(2)" style="position: relative;display: grid;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/6/6c/NOR_ANSI.svg" width="460" height="240">
-                    <h1 id="blbNorGate" class="poweredOn dualInputSingleOutput">💡<br></h1>
-                </div>
-            </div>
-            <div class="row">
-                <div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset-1" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
-            </div>
-        </div><!-- End: 1 Row 3 Columns -->
-        <div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
-    </section><!-- Start: Footer Multi Column -->
-    <footer style="background: rgb(45,44,56);">
-        <div class="container py-4 py-lg-5">
-            <div class="row justify-content-center">
-                <!-- Start: About Project -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
-                        <div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
-                                <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                            </svg><span>GitHub</span></div>
-                    </a>
-                </div><!-- End: About Project -->
-                <!-- Start: About -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
-                <!-- Start: Social Links -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
-                    <div class="row">
-                        <div class="col-md-3"><a href="https://mstdn.social/@MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-mastodon social-media">
-                                    <path d="M11.19 12.195c2.016-.24 3.77-1.475 3.99-2.603.348-1.778.32-4.339.32-4.339 0-3.47-2.286-4.488-2.286-4.488C12.062.238 10.083.017 8.027 0h-.05C5.92.017 3.942.238 2.79.765c0 0-2.285 1.017-2.285 4.488l-.002.662c-.004.64-.007 1.35.011 2.091.083 3.394.626 6.74 3.78 7.57 1.454.383 2.703.463 3.709.408 1.823-.1 2.847-.647 2.847-.647l-.06-1.317s-1.303.41-2.767.36c-1.45-.05-2.98-.156-3.215-1.928a3.614 3.614 0 0 1-.033-.496s1.424.346 3.228.428c1.103.05 2.137-.064 3.188-.189zm1.613-2.47H11.13v-4.08c0-.859-.364-1.295-1.091-1.295-.804 0-1.207.517-1.207 1.541v2.233H7.168V5.89c0-1.024-.403-1.541-1.207-1.541-.727 0-1.091.436-1.091 1.296v4.079H3.197V5.522c0-.859.22-1.541.66-2.046.456-.505 1.052-.764 1.793-.764.856 0 1.504.328 1.933.983L8 4.39l.417-.695c.429-.655 1.077-.983 1.934-.983.74 0 1.336.259 1.791.764.442.505.661 1.187.661 2.046v4.203z"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://www.linkedin.com/in/alexanderedavis/" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-linkedin social-media">
-                                    <path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854V1.146zm4.943 12.248V6.169H2.542v7.225h2.401m-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248-.822 0-1.359.54-1.359 1.248 0 .694.521 1.248 1.327 1.248h.016zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016a5.54 5.54 0 0 1 .016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225h2.4"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://github.com/MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github social-media">
-                                    <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"></div>
-                    </div>
-                </div><!-- End: Social Links -->
-                <!-- Start: Branding -->
-                <div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
-                    <div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
-                    <p class="text-muted">Computer Science Concept Simulators</p>
-                </div><!-- End: Branding -->
-            </div>
-            <hr>
-            <div class="text-muted d-flex justify-content-between align-items-center pt-3">
-                <p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
-            </div>
-        </div>
-    </footer><!-- End: Footer Multi Column -->
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
-    <script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
-</body>
-
-</html>

Export/not-gate.html

@@ -1,148 +0,0 @@
-<!DOCTYPE html>
-<html data-bs-theme="auto" lang="en" style="background: rgb(45,44,56);">
-
-<head>
-    <meta charset="utf-8">
-<!-- Matomo -->
-<script>
-  var _paq = window._paq = window._paq || [];
-  /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
-  _paq.push(['trackPageView']);
-  _paq.push(['enableLinkTracking']);
-  (function() {
-    var u="//analytics.adcmnetworks.co.uk/";
-    _paq.push(['setTrackerUrl', u+'matomo.php']);
-    _paq.push(['setSiteId', '2']);
-    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
-    g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
-  })();
-</script>
-<!-- End Matomo Code -->
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
-    <title>NOT Gate Simulator - CS:Box</title>
-    <meta name="twitter:card" content="summary_large_image">
-    <meta property="og:type" content="website">
-    <meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
-    <script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&amp;display=swap">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans&amp;display=swap">
-    <link rel="stylesheet" href="assets/css/styles.min.css?h=05023c48128d85662d4f89782ddfb125">
-</head>
-
-<body>
-    <header class="bg-dark">
-        <!-- Start: Site Navigation -->
-        <nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
-            <div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
-                <div class="collapse navbar-collapse" id="navcol-5">
-                    <ul class="navbar-nav ms-auto">
-                        <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
-                        <li class="nav-item"><a class="nav-link" href="about">About</a></li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Binary</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="unsigned-binary">Unsigned Integers</a><a class="dropdown-item" href="twos-compliment-binary">Two's Compliment</a></div>
-                        </li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Hexadecimal</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="gcse-hexadecimal">GCSE</a><a class="dropdown-item" href="a-level-hexadecimal">A Level</a></div>
-                        </li>
-                        <li class="nav-item"><a class="nav-link" href="hex-colours">Hex Colours</a></li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link active" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Logic Gates</a>
-                            <div class="dropdown-menu"><a class="dropdown-item active" href="not-gate">NOT</a><a class="dropdown-item" href="and-gate">AND</a><a class="dropdown-item" href="or-gate">OR</a><a class="dropdown-item" href="nor-gate">NOR</a><a class="dropdown-item" href="nand-gate">NAND</a><a class="dropdown-item" href="xor-gate">XOR</a><a class="dropdown-item" href="xnor-gate">XNOR</a></div>
-                        </li>
-                    </ul>
-                </div>
-            </div>
-        </nav><!-- End: Site Navigation -->
-    </header><!-- Start: Hero Banner Color -->
-    <section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
-        <div class="container h-100">
-            <div class="text-white border rounded border-0 p-1 bg-danger">
-                <div class="row h-100">
-                    <div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
-                        <div>
-                            <h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE&nbsp;Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
-                            <p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </section><!-- End: Hero Banner Color -->
-    <section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
-        <!-- Start: 1 Row 2 Columns -->
-        <div class="container" style="width: 100%;margin-top: 15px;">
-            <div class="row">
-                <div class="col" style="height: 120px;"></div>
-            </div>
-            <div class="row">
-                <div class="col">
-                    <h1 id="pageHeading" class="simHeading">NOT Gate</h1>
-                </div>
-            </div>
-        </div><!-- End: 1 Row 2 Columns -->
-        <!-- Start: 1 Row 3 Columns -->
-        <div class="container">
-            <div class="row">
-                <div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;margin-top: 2.8em;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/bc/NOT_ANSI.svg/1920px-NOT_ANSI.svg.png" width="460" height="240">
-                    <h1 id="blbNotGate" class="poweredOn dualInputSingleOutput">💡<br></h1>
-                </div>
-            </div>
-            <div class="row">
-                <div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset-1" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
-            </div>
-        </div><!-- End: 1 Row 3 Columns -->
-        <div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
-    </section><!-- Start: Footer Multi Column -->
-    <footer style="background: rgb(45,44,56);">
-        <div class="container py-4 py-lg-5">
-            <div class="row justify-content-center">
-                <!-- Start: About Project -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
-                        <div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
-                                <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                            </svg><span>GitHub</span></div>
-                    </a>
-                </div><!-- End: About Project -->
-                <!-- Start: About -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
-                <!-- Start: Social Links -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
-                    <div class="row">
-                        <div class="col-md-3"><a href="https://mstdn.social/@MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-mastodon social-media">
-                                    <path d="M11.19 12.195c2.016-.24 3.77-1.475 3.99-2.603.348-1.778.32-4.339.32-4.339 0-3.47-2.286-4.488-2.286-4.488C12.062.238 10.083.017 8.027 0h-.05C5.92.017 3.942.238 2.79.765c0 0-2.285 1.017-2.285 4.488l-.002.662c-.004.64-.007 1.35.011 2.091.083 3.394.626 6.74 3.78 7.57 1.454.383 2.703.463 3.709.408 1.823-.1 2.847-.647 2.847-.647l-.06-1.317s-1.303.41-2.767.36c-1.45-.05-2.98-.156-3.215-1.928a3.614 3.614 0 0 1-.033-.496s1.424.346 3.228.428c1.103.05 2.137-.064 3.188-.189zm1.613-2.47H11.13v-4.08c0-.859-.364-1.295-1.091-1.295-.804 0-1.207.517-1.207 1.541v2.233H7.168V5.89c0-1.024-.403-1.541-1.207-1.541-.727 0-1.091.436-1.091 1.296v4.079H3.197V5.522c0-.859.22-1.541.66-2.046.456-.505 1.052-.764 1.793-.764.856 0 1.504.328 1.933.983L8 4.39l.417-.695c.429-.655 1.077-.983 1.934-.983.74 0 1.336.259 1.791.764.442.505.661 1.187.661 2.046v4.203z"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://www.linkedin.com/in/alexanderedavis/" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-linkedin social-media">
-                                    <path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854V1.146zm4.943 12.248V6.169H2.542v7.225h2.401m-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248-.822 0-1.359.54-1.359 1.248 0 .694.521 1.248 1.327 1.248h.016zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016a5.54 5.54 0 0 1 .016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225h2.4"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://github.com/MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github social-media">
-                                    <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"></div>
-                    </div>
-                </div><!-- End: Social Links -->
-                <!-- Start: Branding -->
-                <div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
-                    <div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
-                    <p class="text-muted">Computer Science Concept Simulators</p>
-                </div><!-- End: Branding -->
-            </div>
-            <hr>
-            <div class="text-muted d-flex justify-content-between align-items-center pt-3">
-                <p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
-            </div>
-        </div>
-    </footer><!-- End: Footer Multi Column -->
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
-    <script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
-</body>
-
-</html>

Export/or-gate.html

@@ -1,148 +0,0 @@
-<!DOCTYPE html>
-<html data-bs-theme="auto" lang="en" style="background: rgb(45,44,56);">
-
-<head>
-    <meta charset="utf-8">
-<!-- Matomo -->
-<script>
-  var _paq = window._paq = window._paq || [];
-  /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
-  _paq.push(['trackPageView']);
-  _paq.push(['enableLinkTracking']);
-  (function() {
-    var u="//analytics.adcmnetworks.co.uk/";
-    _paq.push(['setTrackerUrl', u+'matomo.php']);
-    _paq.push(['setSiteId', '2']);
-    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
-    g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
-  })();
-</script>
-<!-- End Matomo Code -->
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
-    <title>OR Gate Simulator - CS:Box</title>
-    <meta name="twitter:card" content="summary_large_image">
-    <meta property="og:type" content="website">
-    <meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
-    <script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&amp;display=swap">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans&amp;display=swap">
-    <link rel="stylesheet" href="assets/css/styles.min.css?h=05023c48128d85662d4f89782ddfb125">
-</head>
-
-<body>
-    <header class="bg-dark">
-        <!-- Start: Site Navigation -->
-        <nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
-            <div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
-                <div class="collapse navbar-collapse" id="navcol-5">
-                    <ul class="navbar-nav ms-auto">
-                        <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
-                        <li class="nav-item"><a class="nav-link" href="about">About</a></li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Binary</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="unsigned-binary">Unsigned Integers</a><a class="dropdown-item" href="twos-compliment-binary">Two's Compliment</a></div>
-                        </li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Hexadecimal</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="gcse-hexadecimal">GCSE</a><a class="dropdown-item" href="a-level-hexadecimal">A Level</a></div>
-                        </li>
-                        <li class="nav-item"><a class="nav-link" href="hex-colours">Hex Colours</a></li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link active" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Logic Gates</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="not-gate">NOT</a><a class="dropdown-item" href="and-gate">AND</a><a class="dropdown-item active" href="or-gate">OR</a><a class="dropdown-item" href="nor-gate">NOR</a><a class="dropdown-item" href="nand-gate">NAND</a><a class="dropdown-item" href="xor-gate">XOR</a><a class="dropdown-item" href="xnor-gate">XNOR</a></div>
-                        </li>
-                    </ul>
-                </div>
-            </div>
-        </nav><!-- End: Site Navigation -->
-    </header><!-- Start: Hero Banner Color -->
-    <section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
-        <div class="container h-100">
-            <div class="text-white border rounded border-0 p-1 bg-danger">
-                <div class="row h-100">
-                    <div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
-                        <div>
-                            <h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE&nbsp;Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
-                            <p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </section><!-- End: Hero Banner Color -->
-    <section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
-        <!-- Start: 1 Row 2 Columns -->
-        <div class="container" style="width: 100%;margin-top: 15px;">
-            <div class="row">
-                <div class="col" style="height: 120px;"></div>
-            </div>
-            <div class="row">
-                <div class="col">
-                    <h1 id="pageHeading" class="simHeading">OR Gate</h1>
-                </div>
-            </div>
-        </div><!-- End: 1 Row 2 Columns -->
-        <!-- Start: 1 Row 3 Columns -->
-        <div class="container">
-            <div class="row">
-                <div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;transform: translate(58px);">⏼</button><button class="btn btn-primary buttonMiddle logicGateInput2" id="swtInput2" type="button" onclick="toggleInput(2)" style="position: relative;display: grid;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/thumb/b/b5/OR_ANSI.svg/1920px-OR_ANSI.svg.png" width="460" height="240">
-                    <h1 id="blbOrGate" class="poweredOff dualInputSingleOutput">💡<br></h1>
-                </div>
-            </div>
-            <div class="row">
-                <div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset-1" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
-            </div>
-        </div><!-- End: 1 Row 3 Columns -->
-        <div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
-    </section><!-- Start: Footer Multi Column -->
-    <footer style="background: rgb(45,44,56);">
-        <div class="container py-4 py-lg-5">
-            <div class="row justify-content-center">
-                <!-- Start: About Project -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
-                        <div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
-                                <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                            </svg><span>GitHub</span></div>
-                    </a>
-                </div><!-- End: About Project -->
-                <!-- Start: About -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
-                <!-- Start: Social Links -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
-                    <div class="row">
-                        <div class="col-md-3"><a href="https://mstdn.social/@MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-mastodon social-media">
-                                    <path d="M11.19 12.195c2.016-.24 3.77-1.475 3.99-2.603.348-1.778.32-4.339.32-4.339 0-3.47-2.286-4.488-2.286-4.488C12.062.238 10.083.017 8.027 0h-.05C5.92.017 3.942.238 2.79.765c0 0-2.285 1.017-2.285 4.488l-.002.662c-.004.64-.007 1.35.011 2.091.083 3.394.626 6.74 3.78 7.57 1.454.383 2.703.463 3.709.408 1.823-.1 2.847-.647 2.847-.647l-.06-1.317s-1.303.41-2.767.36c-1.45-.05-2.98-.156-3.215-1.928a3.614 3.614 0 0 1-.033-.496s1.424.346 3.228.428c1.103.05 2.137-.064 3.188-.189zm1.613-2.47H11.13v-4.08c0-.859-.364-1.295-1.091-1.295-.804 0-1.207.517-1.207 1.541v2.233H7.168V5.89c0-1.024-.403-1.541-1.207-1.541-.727 0-1.091.436-1.091 1.296v4.079H3.197V5.522c0-.859.22-1.541.66-2.046.456-.505 1.052-.764 1.793-.764.856 0 1.504.328 1.933.983L8 4.39l.417-.695c.429-.655 1.077-.983 1.934-.983.74 0 1.336.259 1.791.764.442.505.661 1.187.661 2.046v4.203z"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://www.linkedin.com/in/alexanderedavis/" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-linkedin social-media">
-                                    <path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854V1.146zm4.943 12.248V6.169H2.542v7.225h2.401m-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248-.822 0-1.359.54-1.359 1.248 0 .694.521 1.248 1.327 1.248h.016zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016a5.54 5.54 0 0 1 .016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225h2.4"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://github.com/MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github social-media">
-                                    <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"></div>
-                    </div>
-                </div><!-- End: Social Links -->
-                <!-- Start: Branding -->
-                <div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
-                    <div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
-                    <p class="text-muted">Computer Science Concept Simulators</p>
-                </div><!-- End: Branding -->
-            </div>
-            <hr>
-            <div class="text-muted d-flex justify-content-between align-items-center pt-3">
-                <p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
-            </div>
-        </div>
-    </footer><!-- End: Footer Multi Column -->
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
-    <script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
-</body>
-
-</html>

Export/projects.html

@@ -1,154 +0,0 @@
-<!DOCTYPE html>
-<html data-bs-theme="auto" lang="en">
-
-<head>
-    <meta charset="utf-8">
-<!-- Matomo -->
-<script>
-  var _paq = window._paq = window._paq || [];
-  /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
-  _paq.push(['trackPageView']);
-  _paq.push(['enableLinkTracking']);
-  (function() {
-    var u="//analytics.adcmnetworks.co.uk/";
-    _paq.push(['setTrackerUrl', u+'matomo.php']);
-    _paq.push(['setSiteId', '2']);
-    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
-    g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
-  })();
-</script>
-<!-- End Matomo Code -->
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
-    <title>Projects - CS:Box</title>
-    <meta name="twitter:card" content="summary_large_image">
-    <meta property="og:type" content="website">
-    <meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
-    <script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&amp;display=swap">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans&amp;display=swap">
-    <link rel="stylesheet" href="assets/css/styles.min.css?h=05023c48128d85662d4f89782ddfb125">
-</head>
-
-<body>
-    <header class="bg-dark">
-        <!-- Start: Site Navigation -->
-        <nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
-            <div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
-                <div class="collapse navbar-collapse" id="navcol-5">
-                    <ul class="navbar-nav ms-auto">
-                        <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
-                        <li class="nav-item"><a class="nav-link" href="about">About</a></li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Binary</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="unsigned-binary">Unsigned Integers</a><a class="dropdown-item" href="twos-compliment-binary">Two's Compliment</a></div>
-                        </li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Hexadecimal</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="gcse-hexadecimal">GCSE</a><a class="dropdown-item" href="a-level-hexadecimal">A Level</a></div>
-                        </li>
-                        <li class="nav-item"><a class="nav-link" href="hex-colours">Hex Colours</a></li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Logic Gates</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="not-gate">NOT</a><a class="dropdown-item" href="and-gate">AND</a><a class="dropdown-item" href="or-gate">OR</a><a class="dropdown-item" href="nor-gate">NOR</a><a class="dropdown-item" href="nand-gate">NAND</a><a class="dropdown-item" href="xor-gate">XOR</a><a class="dropdown-item" href="xnor-gate">XNOR</a></div>
-                        </li>
-                    </ul>
-                </div>
-            </div>
-        </nav><!-- End: Site Navigation -->
-    </header>
-    <section class="py-5">
-        <!-- Start: Projects Grid -->
-        <div class="container">
-            <div class="row mb-5">
-                <div class="col text-center mx-auto">
-                    <h2 class="fw-bold">Coming Soon to CS:Box</h2>
-                    <p class="text-muted">Wave 3 will focus on enhanced usability, new interactive challenges, and a better user experience. Version 2.0 will introduce gamification, personalization, and real-time collaboration, making CS:Box a cutting-edge learning tool for logic gates, binary, and hexadecimal concepts. By adding multi-user collaboration, gamification, and mobile support, CS:Box will evolve into a next-generation educational platform for the UK Computing Curriculum and beyond.</p>
-                </div>
-            </div>
-            <div class="row row-cols-1 row-cols-md-2 mx-auto" style="max-width: 900px;">
-                <div class="col mb-4">
-                    <div><a href="#"><img class="rounded img-fluid shadow w-100 fit-cover" src="assets/img/products/1.jpg?h=fc1e51d44f18accfa3a90f81c9cfffe4" style="height: 250px;"></a>
-                        <div class="py-4"><span class="badge bg-primary mb-2">Website</span>
-                            <h4 class="fw-bold">Lorem libero donec</h4>
-                            <p class="text-muted">Nullam id dolor id nibh ultricies vehicula ut id elit. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus.</p>
-                        </div>
-                    </div>
-                </div>
-                <div class="col mb-4">
-                    <div><a href="#"><img class="rounded img-fluid shadow w-100 fit-cover" src="assets/img/products/2.jpg?h=104fcc18ad179e4b0b9e0ee12b849bed" style="height: 250px;"></a>
-                        <div class="py-4"><span class="badge bg-primary mb-2">Website</span>
-                            <h4 class="fw-bold">Lorem libero donec</h4>
-                            <p class="text-muted">Nullam id dolor id nibh ultricies vehicula ut id elit. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus.</p>
-                        </div>
-                    </div>
-                </div>
-                <div class="col mb-4">
-                    <div><a href="#"><img class="rounded img-fluid shadow w-100 fit-cover" src="assets/img/products/3.jpg?h=fce4fd8e26138d1b5fd8c63ef4f2e64c" style="height: 250px;"></a>
-                        <div class="py-4"><span class="badge bg-primary mb-2">Website</span>
-                            <h4 class="fw-bold">Lorem libero donec</h4>
-                            <p class="text-muted">Nullam id dolor id nibh ultricies vehicula ut id elit. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus.</p>
-                        </div>
-                    </div>
-                </div>
-                <div class="col mb-4">
-                    <div><a href="#"><img class="rounded img-fluid shadow w-100 fit-cover" src="assets/img/products/1.jpg?h=fc1e51d44f18accfa3a90f81c9cfffe4" style="height: 250px;"></a>
-                        <div class="py-4"><span class="badge bg-primary mb-2">Website</span>
-                            <h4 class="fw-bold">Lorem libero donec</h4>
-                            <p class="text-muted">Nullam id dolor id nibh ultricies vehicula ut id elit. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus.</p>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div><!-- End: Projects Grid -->
-    </section><!-- Start: Footer Multi Column -->
-    <footer style="background: rgb(45,44,56);">
-        <div class="container py-4 py-lg-5">
-            <div class="row justify-content-center">
-                <!-- Start: About Project -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
-                        <div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
-                                <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                            </svg><span>GitHub</span></div>
-                    </a>
-                </div><!-- End: About Project -->
-                <!-- Start: About -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
-                <!-- Start: Social Links -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
-                    <div class="row">
-                        <div class="col-md-3"><a href="https://mstdn.social/@MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-mastodon social-media">
-                                    <path d="M11.19 12.195c2.016-.24 3.77-1.475 3.99-2.603.348-1.778.32-4.339.32-4.339 0-3.47-2.286-4.488-2.286-4.488C12.062.238 10.083.017 8.027 0h-.05C5.92.017 3.942.238 2.79.765c0 0-2.285 1.017-2.285 4.488l-.002.662c-.004.64-.007 1.35.011 2.091.083 3.394.626 6.74 3.78 7.57 1.454.383 2.703.463 3.709.408 1.823-.1 2.847-.647 2.847-.647l-.06-1.317s-1.303.41-2.767.36c-1.45-.05-2.98-.156-3.215-1.928a3.614 3.614 0 0 1-.033-.496s1.424.346 3.228.428c1.103.05 2.137-.064 3.188-.189zm1.613-2.47H11.13v-4.08c0-.859-.364-1.295-1.091-1.295-.804 0-1.207.517-1.207 1.541v2.233H7.168V5.89c0-1.024-.403-1.541-1.207-1.541-.727 0-1.091.436-1.091 1.296v4.079H3.197V5.522c0-.859.22-1.541.66-2.046.456-.505 1.052-.764 1.793-.764.856 0 1.504.328 1.933.983L8 4.39l.417-.695c.429-.655 1.077-.983 1.934-.983.74 0 1.336.259 1.791.764.442.505.661 1.187.661 2.046v4.203z"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://www.linkedin.com/in/alexanderedavis/" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-linkedin social-media">
-                                    <path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854V1.146zm4.943 12.248V6.169H2.542v7.225h2.401m-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248-.822 0-1.359.54-1.359 1.248 0 .694.521 1.248 1.327 1.248h.016zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016a5.54 5.54 0 0 1 .016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225h2.4"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://github.com/MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github social-media">
-                                    <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"></div>
-                    </div>
-                </div><!-- End: Social Links -->
-                <!-- Start: Branding -->
-                <div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
-                    <div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
-                    <p class="text-muted">Computer Science Concept Simulators</p>
-                </div><!-- End: Branding -->
-            </div>
-            <hr>
-            <div class="text-muted d-flex justify-content-between align-items-center pt-3">
-                <p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
-            </div>
-        </div>
-    </footer><!-- End: Footer Multi Column -->
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
-    <script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
-</body>
-
-</html>

Export/xnor-gate.html

@@ -1,148 +0,0 @@
-<!DOCTYPE html>
-<html data-bs-theme="auto" lang="en" style="background: rgb(45,44,56);">
-
-<head>
-    <meta charset="utf-8">
-<!-- Matomo -->
-<script>
-  var _paq = window._paq = window._paq || [];
-  /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
-  _paq.push(['trackPageView']);
-  _paq.push(['enableLinkTracking']);
-  (function() {
-    var u="//analytics.adcmnetworks.co.uk/";
-    _paq.push(['setTrackerUrl', u+'matomo.php']);
-    _paq.push(['setSiteId', '2']);
-    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
-    g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
-  })();
-</script>
-<!-- End Matomo Code -->
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
-    <title>XNOR Gate Simulator - CS:Box</title>
-    <meta name="twitter:card" content="summary_large_image">
-    <meta property="og:type" content="website">
-    <meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
-    <script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&amp;display=swap">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans&amp;display=swap">
-    <link rel="stylesheet" href="assets/css/styles.min.css?h=05023c48128d85662d4f89782ddfb125">
-</head>
-
-<body>
-    <header class="bg-dark">
-        <!-- Start: Site Navigation -->
-        <nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
-            <div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
-                <div class="collapse navbar-collapse" id="navcol-5">
-                    <ul class="navbar-nav ms-auto">
-                        <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
-                        <li class="nav-item"><a class="nav-link" href="about">About</a></li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Binary</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="unsigned-binary">Unsigned Integers</a><a class="dropdown-item" href="twos-compliment-binary">Two's Compliment</a></div>
-                        </li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Hexadecimal</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="gcse-hexadecimal">GCSE</a><a class="dropdown-item" href="a-level-hexadecimal">A Level</a></div>
-                        </li>
-                        <li class="nav-item"><a class="nav-link" href="hex-colours">Hex Colours</a></li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link active" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Logic Gates</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="not-gate">NOT</a><a class="dropdown-item" href="and-gate">AND</a><a class="dropdown-item" href="or-gate">OR</a><a class="dropdown-item" href="nor-gate">NOR</a><a class="dropdown-item" href="nand-gate">NAND</a><a class="dropdown-item" href="xor-gate">XOR</a><a class="dropdown-item active" href="xnor-gate">XNOR</a></div>
-                        </li>
-                    </ul>
-                </div>
-            </div>
-        </nav><!-- End: Site Navigation -->
-    </header><!-- Start: Hero Banner Color -->
-    <section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
-        <div class="container h-100">
-            <div class="text-white border rounded border-0 p-1 bg-danger">
-                <div class="row h-100">
-                    <div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
-                        <div>
-                            <h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE&nbsp;Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
-                            <p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </section><!-- End: Hero Banner Color -->
-    <section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
-        <!-- Start: 1 Row 2 Columns -->
-        <div class="container" style="width: 100%;margin-top: 15px;">
-            <div class="row">
-                <div class="col" style="height: 120px;"></div>
-            </div>
-            <div class="row">
-                <div class="col">
-                    <h1 id="pageHeading" class="simHeading">XNOR Gate</h1>
-                </div>
-            </div>
-        </div><!-- End: 1 Row 2 Columns -->
-        <!-- Start: 1 Row 3 Columns -->
-        <div class="container">
-            <div class="row">
-                <div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;transform: translate(58px);">⏼</button><button class="btn btn-primary buttonMiddle logicGateInput2" id="swtInput2" type="button" onclick="toggleInput(2)" style="position: relative;display: grid;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/d/d6/XNOR_ANSI.svg" width="460" height="240">
-                    <h1 id="blbXnorGate" class="poweredOn dualInputSingleOutput">💡<br></h1>
-                </div>
-            </div>
-            <div class="row">
-                <div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset-1" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
-            </div>
-        </div><!-- End: 1 Row 3 Columns -->
-        <div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
-    </section><!-- Start: Footer Multi Column -->
-    <footer style="background: rgb(45,44,56);">
-        <div class="container py-4 py-lg-5">
-            <div class="row justify-content-center">
-                <!-- Start: About Project -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
-                        <div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
-                                <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                            </svg><span>GitHub</span></div>
-                    </a>
-                </div><!-- End: About Project -->
-                <!-- Start: About -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
-                <!-- Start: Social Links -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
-                    <div class="row">
-                        <div class="col-md-3"><a href="https://mstdn.social/@MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-mastodon social-media">
-                                    <path d="M11.19 12.195c2.016-.24 3.77-1.475 3.99-2.603.348-1.778.32-4.339.32-4.339 0-3.47-2.286-4.488-2.286-4.488C12.062.238 10.083.017 8.027 0h-.05C5.92.017 3.942.238 2.79.765c0 0-2.285 1.017-2.285 4.488l-.002.662c-.004.64-.007 1.35.011 2.091.083 3.394.626 6.74 3.78 7.57 1.454.383 2.703.463 3.709.408 1.823-.1 2.847-.647 2.847-.647l-.06-1.317s-1.303.41-2.767.36c-1.45-.05-2.98-.156-3.215-1.928a3.614 3.614 0 0 1-.033-.496s1.424.346 3.228.428c1.103.05 2.137-.064 3.188-.189zm1.613-2.47H11.13v-4.08c0-.859-.364-1.295-1.091-1.295-.804 0-1.207.517-1.207 1.541v2.233H7.168V5.89c0-1.024-.403-1.541-1.207-1.541-.727 0-1.091.436-1.091 1.296v4.079H3.197V5.522c0-.859.22-1.541.66-2.046.456-.505 1.052-.764 1.793-.764.856 0 1.504.328 1.933.983L8 4.39l.417-.695c.429-.655 1.077-.983 1.934-.983.74 0 1.336.259 1.791.764.442.505.661 1.187.661 2.046v4.203z"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://www.linkedin.com/in/alexanderedavis/" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-linkedin social-media">
-                                    <path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854V1.146zm4.943 12.248V6.169H2.542v7.225h2.401m-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248-.822 0-1.359.54-1.359 1.248 0 .694.521 1.248 1.327 1.248h.016zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016a5.54 5.54 0 0 1 .016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225h2.4"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://github.com/MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github social-media">
-                                    <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"></div>
-                    </div>
-                </div><!-- End: Social Links -->
-                <!-- Start: Branding -->
-                <div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
-                    <div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
-                    <p class="text-muted">Computer Science Concept Simulators</p>
-                </div><!-- End: Branding -->
-            </div>
-            <hr>
-            <div class="text-muted d-flex justify-content-between align-items-center pt-3">
-                <p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
-            </div>
-        </div>
-    </footer><!-- End: Footer Multi Column -->
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
-    <script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
-</body>
-
-</html>

Export/xor-gate.html

@@ -1,148 +0,0 @@
-<!DOCTYPE html>
-<html data-bs-theme="auto" lang="en" style="background: rgb(45,44,56);">
-
-<head>
-    <meta charset="utf-8">
-<!-- Matomo -->
-<script>
-  var _paq = window._paq = window._paq || [];
-  /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
-  _paq.push(['trackPageView']);
-  _paq.push(['enableLinkTracking']);
-  (function() {
-    var u="//analytics.adcmnetworks.co.uk/";
-    _paq.push(['setTrackerUrl', u+'matomo.php']);
-    _paq.push(['setSiteId', '2']);
-    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
-    g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
-  })();
-</script>
-<!-- End Matomo Code -->
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
-    <title>XOR Gate Simulator - CS:Box</title>
-    <meta name="twitter:card" content="summary_large_image">
-    <meta property="og:type" content="website">
-    <meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
-    <script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&amp;display=swap">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans&amp;display=swap">
-    <link rel="stylesheet" href="assets/css/styles.min.css?h=05023c48128d85662d4f89782ddfb125">
-</head>
-
-<body>
-    <header class="bg-dark">
-        <!-- Start: Site Navigation -->
-        <nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
-            <div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
-                <div class="collapse navbar-collapse" id="navcol-5">
-                    <ul class="navbar-nav ms-auto">
-                        <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
-                        <li class="nav-item"><a class="nav-link" href="about">About</a></li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Binary</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="unsigned-binary">Unsigned Integers</a><a class="dropdown-item" href="twos-compliment-binary">Two's Compliment</a></div>
-                        </li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Hexadecimal</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="gcse-hexadecimal">GCSE</a><a class="dropdown-item" href="a-level-hexadecimal">A Level</a></div>
-                        </li>
-                        <li class="nav-item"><a class="nav-link" href="hex-colours">Hex Colours</a></li>
-                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link active" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Logic Gates</a>
-                            <div class="dropdown-menu"><a class="dropdown-item" href="not-gate">NOT</a><a class="dropdown-item" href="and-gate">AND</a><a class="dropdown-item" href="or-gate">OR</a><a class="dropdown-item" href="nor-gate">NOR</a><a class="dropdown-item" href="nand-gate">NAND</a><a class="dropdown-item active" href="xor-gate">XOR</a><a class="dropdown-item" href="xnor-gate">XNOR</a></div>
-                        </li>
-                    </ul>
-                </div>
-            </div>
-        </nav><!-- End: Site Navigation -->
-    </header><!-- Start: Hero Banner Color -->
-    <section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
-        <div class="container h-100">
-            <div class="text-white border rounded border-0 p-1 bg-danger">
-                <div class="row h-100">
-                    <div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
-                        <div>
-                            <h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE&nbsp;Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
-                            <p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </section><!-- End: Hero Banner Color -->
-    <section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
-        <!-- Start: 1 Row 2 Columns -->
-        <div class="container" style="width: 100%;margin-top: 15px;">
-            <div class="row">
-                <div class="col" style="height: 120px;"></div>
-            </div>
-            <div class="row">
-                <div class="col">
-                    <h1 id="pageHeading" class="simHeading">XOR Gate</h1>
-                </div>
-            </div>
-        </div><!-- End: 1 Row 2 Columns -->
-        <!-- Start: 1 Row 3 Columns -->
-        <div class="container">
-            <div class="row">
-                <div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;transform: translate(58px);">⏼</button><button class="btn btn-primary buttonMiddle logicGateInput2" id="swtInput2" type="button" onclick="toggleInput(2)" style="position: relative;display: grid;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/0/01/XOR_ANSI.svg" width="460" height="240">
-                    <h1 id="blbXorGate" class="poweredOff dualInputSingleOutput">💡<br></h1>
-                </div>
-            </div>
-            <div class="row">
-                <div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset-1" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
-            </div>
-        </div><!-- End: 1 Row 3 Columns -->
-        <div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
-    </section><!-- Start: Footer Multi Column -->
-    <footer style="background: rgb(45,44,56);">
-        <div class="container py-4 py-lg-5">
-            <div class="row justify-content-center">
-                <!-- Start: About Project -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
-                        <div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
-                                <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                            </svg><span>GitHub</span></div>
-                    </a>
-                </div><!-- End: About Project -->
-                <!-- Start: About -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
-                <!-- Start: Social Links -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
-                    <div class="row">
-                        <div class="col-md-3"><a href="https://mstdn.social/@MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-mastodon social-media">
-                                    <path d="M11.19 12.195c2.016-.24 3.77-1.475 3.99-2.603.348-1.778.32-4.339.32-4.339 0-3.47-2.286-4.488-2.286-4.488C12.062.238 10.083.017 8.027 0h-.05C5.92.017 3.942.238 2.79.765c0 0-2.285 1.017-2.285 4.488l-.002.662c-.004.64-.007 1.35.011 2.091.083 3.394.626 6.74 3.78 7.57 1.454.383 2.703.463 3.709.408 1.823-.1 2.847-.647 2.847-.647l-.06-1.317s-1.303.41-2.767.36c-1.45-.05-2.98-.156-3.215-1.928a3.614 3.614 0 0 1-.033-.496s1.424.346 3.228.428c1.103.05 2.137-.064 3.188-.189zm1.613-2.47H11.13v-4.08c0-.859-.364-1.295-1.091-1.295-.804 0-1.207.517-1.207 1.541v2.233H7.168V5.89c0-1.024-.403-1.541-1.207-1.541-.727 0-1.091.436-1.091 1.296v4.079H3.197V5.522c0-.859.22-1.541.66-2.046.456-.505 1.052-.764 1.793-.764.856 0 1.504.328 1.933.983L8 4.39l.417-.695c.429-.655 1.077-.983 1.934-.983.74 0 1.336.259 1.791.764.442.505.661 1.187.661 2.046v4.203z"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://www.linkedin.com/in/alexanderedavis/" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-linkedin social-media">
-                                    <path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854V1.146zm4.943 12.248V6.169H2.542v7.225h2.401m-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248-.822 0-1.359.54-1.359 1.248 0 .694.521 1.248 1.327 1.248h.016zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016a5.54 5.54 0 0 1 .016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225h2.4"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://github.com/MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github social-media">
-                                    <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"></div>
-                    </div>
-                </div><!-- End: Social Links -->
-                <!-- Start: Branding -->
-                <div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
-                    <div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
-                    <p class="text-muted">Computer Science Concept Simulators</p>
-                </div><!-- End: Branding -->
-            </div>
-            <hr>
-            <div class="text-muted d-flex justify-content-between align-items-center pt-3">
-                <p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
-            </div>
-        </div>
-    </footer><!-- End: Footer Multi Column -->
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
-    <script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
-</body>
-
-</html>

LICENSE

@@ -1,121 +1,437 @@
-Creative Commons Legal Code
+Attribution-NonCommercial-ShareAlike 4.0 International
 
-CC0 1.0 Universal
+=======================================================================
 
-    CREATIVE COMMONS CORPORATION IS NOT A LAW FIRM AND DOES NOT PROVIDE
-    LEGAL SERVICES. DISTRIBUTION OF THIS DOCUMENT DOES NOT CREATE AN
-    ATTORNEY-CLIENT RELATIONSHIP. CREATIVE COMMONS PROVIDES THIS
-    INFORMATION ON AN "AS-IS" BASIS. CREATIVE COMMONS MAKES NO WARRANTIES
-    REGARDING THE USE OF THIS DOCUMENT OR THE INFORMATION OR WORKS
-    PROVIDED HEREUNDER, AND DISCLAIMS LIABILITY FOR DAMAGES RESULTING FROM
-    THE USE OF THIS DOCUMENT OR THE INFORMATION OR WORKS PROVIDED
-    HEREUNDER.
+Creative Commons Corporation ("Creative Commons") is not a law firm and
+does not provide legal services or legal advice. Distribution of
+Creative Commons public licenses does not create a lawyer-client or
+other relationship. Creative Commons makes its licenses and related
+information available on an "as-is" basis. Creative Commons gives no
+warranties regarding its licenses, any material licensed under their
+terms and conditions, or any related information. Creative Commons
+disclaims all liability for damages resulting from their use to the
+fullest extent possible.
 
-Statement of Purpose
+Using Creative Commons Public Licenses
 
-The laws of most jurisdictions throughout the world automatically confer
-exclusive Copyright and Related Rights (defined below) upon the creator
-and subsequent owner(s) (each and all, an "owner") of an original work of
-authorship and/or a database (each, a "Work").
+Creative Commons public licenses provide a standard set of terms and
+conditions that creators and other rights holders may use to share
+original works of authorship and other material subject to copyright
+and certain other rights specified in the public license below. The
+following considerations are for informational purposes only, are not
+exhaustive, and do not form part of our licenses.
 
-Certain owners wish to permanently relinquish those rights to a Work for
-the purpose of contributing to a commons of creative, cultural and
-scientific works ("Commons") that the public can reliably and without fear
-of later claims of infringement build upon, modify, incorporate in other
-works, reuse and redistribute as freely as possible in any form whatsoever
-and for any purposes, including without limitation commercial purposes.
-These owners may contribute to the Commons to promote the ideal of a free
-culture and the further production of creative, cultural and scientific
-works, or to gain reputation or greater distribution for their Work in
-part through the use and efforts of others.
+     Considerations for licensors: Our public licenses are
+     intended for use by those authorized to give the public
+     permission to use material in ways otherwise restricted by
+     copyright and certain other rights. Our licenses are
+     irrevocable. Licensors should read and understand the terms
+     and conditions of the license they choose before applying it.
+     Licensors should also secure all rights necessary before
+     applying our licenses so that the public can reuse the
+     material as expected. Licensors should clearly mark any
+     material not subject to the license. This includes other CC-
+     licensed material, or material used under an exception or
+     limitation to copyright. More considerations for licensors:
+    wiki.creativecommons.org/Considerations_for_licensors
 
-For these and/or other purposes and motivations, and without any
-expectation of additional consideration or compensation, the person
-associating CC0 with a Work (the "Affirmer"), to the extent that he or she
-is an owner of Copyright and Related Rights in the Work, voluntarily
-elects to apply CC0 to the Work and publicly distribute the Work under its
-terms, with knowledge of his or her Copyright and Related Rights in the
-Work and the meaning and intended legal effect of CC0 on those rights.
+     Considerations for the public: By using one of our public
+     licenses, a licensor grants the public permission to use the
+     licensed material under specified terms and conditions. If
+     the licensor's permission is not necessary for any reason--for
+     example, because of any applicable exception or limitation to
+     copyright--then that use is not regulated by the license. Our
+     licenses grant only permissions under copyright and certain
+     other rights that a licensor has authority to grant. Use of
+     the licensed material may still be restricted for other
+     reasons, including because others have copyright or other
+     rights in the material. A licensor may make special requests,
+     such as asking that all changes be marked or described.
+     Although not required by our licenses, you are encouraged to
+     respect those requests where reasonable. More considerations
+     for the public:
+    wiki.creativecommons.org/Considerations_for_licensees
 
-1. Copyright and Related Rights. A Work made available under CC0 may be
-protected by copyright and related or neighboring rights ("Copyright and
-Related Rights"). Copyright and Related Rights include, but are not
-limited to, the following:
+=======================================================================
 
-  i. the right to reproduce, adapt, distribute, perform, display,
-     communicate, and translate a Work;
- ii. moral rights retained by the original author(s) and/or performer(s);
-iii. publicity and privacy rights pertaining to a person's image or
-     likeness depicted in a Work;
- iv. rights protecting against unfair competition in regards to a Work,
-     subject to the limitations in paragraph 4(a), below;
-  v. rights protecting the extraction, dissemination, use and reuse of data
-     in a Work;
- vi. database rights (such as those arising under Directive 96/9/EC of the
-     European Parliament and of the Council of 11 March 1996 on the legal
-     protection of databases, and under any national implementation
-     thereof, including any amended or successor version of such
-     directive); and
-vii. other similar, equivalent or corresponding rights throughout the
-     world based on applicable law or treaty, and any national
-     implementations thereof.
+Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International
+Public License
 
-2. Waiver. To the greatest extent permitted by, but not in contravention
-of, applicable law, Affirmer hereby overtly, fully, permanently,
-irrevocably and unconditionally waives, abandons, and surrenders all of
-Affirmer's Copyright and Related Rights and associated claims and causes
-of action, whether now known or unknown (including existing as well as
-future claims and causes of action), in the Work (i) in all territories
-worldwide, (ii) for the maximum duration provided by applicable law or
-treaty (including future time extensions), (iii) in any current or future
-medium and for any number of copies, and (iv) for any purpose whatsoever,
-including without limitation commercial, advertising or promotional
-purposes (the "Waiver"). Affirmer makes the Waiver for the benefit of each
-member of the public at large and to the detriment of Affirmer's heirs and
-successors, fully intending that such Waiver shall not be subject to
-revocation, rescission, cancellation, termination, or any other legal or
-equitable action to disrupt the quiet enjoyment of the Work by the public
-as contemplated by Affirmer's express Statement of Purpose.
+By exercising the Licensed Rights (defined below), You accept and agree
+to be bound by the terms and conditions of this Creative Commons
+Attribution-NonCommercial-ShareAlike 4.0 International Public License
+("Public License"). To the extent this Public License may be
+interpreted as a contract, You are granted the Licensed Rights in
+consideration of Your acceptance of these terms and conditions, and the
+Licensor grants You such rights in consideration of benefits the
+Licensor receives from making the Licensed Material available under
+these terms and conditions.
 
-3. Public License Fallback. Should any part of the Waiver for any reason
-be judged legally invalid or ineffective under applicable law, then the
-Waiver shall be preserved to the maximum extent permitted taking into
-account Affirmer's express Statement of Purpose. In addition, to the
-extent the Waiver is so judged Affirmer hereby grants to each affected
-person a royalty-free, non transferable, non sublicensable, non exclusive,
-irrevocable and unconditional license to exercise Affirmer's Copyright and
-Related Rights in the Work (i) in all territories worldwide, (ii) for the
-maximum duration provided by applicable law or treaty (including future
-time extensions), (iii) in any current or future medium and for any number
-of copies, and (iv) for any purpose whatsoever, including without
-limitation commercial, advertising or promotional purposes (the
-"License"). The License shall be deemed effective as of the date CC0 was
-applied by Affirmer to the Work. Should any part of the License for any
-reason be judged legally invalid or ineffective under applicable law, such
-partial invalidity or ineffectiveness shall not invalidate the remainder
-of the License, and in such case Affirmer hereby affirms that he or she
-will not (i) exercise any of his or her remaining Copyright and Related
-Rights in the Work or (ii) assert any associated claims and causes of
-action with respect to the Work, in either case contrary to Affirmer's
-express Statement of Purpose.
 
-4. Limitations and Disclaimers.
+Section 1 -- Definitions.
 
- a. No trademark or patent rights held by Affirmer are waived, abandoned,
-    surrendered, licensed or otherwise affected by this document.
- b. Affirmer offers the Work as-is and makes no representations or
-    warranties of any kind concerning the Work, express, implied,
-    statutory or otherwise, including without limitation warranties of
-    title, merchantability, fitness for a particular purpose, non
-    infringement, or the absence of latent or other defects, accuracy, or
-    the present or absence of errors, whether or not discoverable, all to
-    the greatest extent permissible under applicable law.
- c. Affirmer disclaims responsibility for clearing rights of other persons
-    that may apply to the Work or any use thereof, including without
-    limitation any person's Copyright and Related Rights in the Work.
-    Further, Affirmer disclaims responsibility for obtaining any necessary
-    consents, permissions or other rights required for any use of the
-    Work.
- d. Affirmer understands and acknowledges that Creative Commons is not a
-    party to this document and has no duty or obligation with respect to
-    this CC0 or use of the Work.
+  a. Adapted Material means material subject to Copyright and Similar
+     Rights that is derived from or based upon the Licensed Material
+     and in which the Licensed Material is translated, altered,
+     arranged, transformed, or otherwise modified in a manner requiring
+     permission under the Copyright and Similar Rights held by the
+     Licensor. For purposes of this Public License, where the Licensed
+     Material is a musical work, performance, or sound recording,
+     Adapted Material is always produced where the Licensed Material is
+     synched in timed relation with a moving image.
+
+  b. Adapter's License means the license You apply to Your Copyright
+     and Similar Rights in Your contributions to Adapted Material in
+     accordance with the terms and conditions of this Public License.
+
+  c. BY-NC-SA Compatible License means a license listed at
+     creativecommons.org/compatiblelicenses, approved by Creative
+     Commons as essentially the equivalent of this Public License.
+
+  d. Copyright and Similar Rights means copyright and/or similar rights
+     closely related to copyright including, without limitation,
+     performance, broadcast, sound recording, and Sui Generis Database
+     Rights, without regard to how the rights are labeled or
+     categorized. For purposes of this Public License, the rights
+     specified in Section 2(b)(1)-(2) are not Copyright and Similar
+     Rights.
+
+  e. Effective Technological Measures means those measures that, in the
+     absence of proper authority, may not be circumvented under laws
+     fulfilling obligations under Article 11 of the WIPO Copyright
+     Treaty adopted on December 20, 1996, and/or similar international
+     agreements.
+
+  f. Exceptions and Limitations means fair use, fair dealing, and/or
+     any other exception or limitation to Copyright and Similar Rights
+     that applies to Your use of the Licensed Material.
+
+  g. License Elements means the license attributes listed in the name
+     of a Creative Commons Public License. The License Elements of this
+     Public License are Attribution, NonCommercial, and ShareAlike.
+
+  h. Licensed Material means the artistic or literary work, database,
+     or other material to which the Licensor applied this Public
+     License.
+
+  i. Licensed Rights means the rights granted to You subject to the
+     terms and conditions of this Public License, which are limited to
+     all Copyright and Similar Rights that apply to Your use of the
+     Licensed Material and that the Licensor has authority to license.
+
+  j. Licensor means the individual(s) or entity(ies) granting rights
+     under this Public License.
+
+  k. NonCommercial means not primarily intended for or directed towards
+     commercial advantage or monetary compensation. For purposes of
+     this Public License, the exchange of the Licensed Material for
+     other material subject to Copyright and Similar Rights by digital
+     file-sharing or similar means is NonCommercial provided there is
+     no payment of monetary compensation in connection with the
+     exchange.
+
+  l. Share means to provide material to the public by any means or
+     process that requires permission under the Licensed Rights, such
+     as reproduction, public display, public performance, distribution,
+     dissemination, communication, or importation, and to make material
+     available to the public including in ways that members of the
+     public may access the material from a place and at a time
+     individually chosen by them.
+
+  m. Sui Generis Database Rights means rights other than copyright
+     resulting from Directive 96/9/EC of the European Parliament and of
+     the Council of 11 March 1996 on the legal protection of databases,
+     as amended and/or succeeded, as well as other essentially
+     equivalent rights anywhere in the world.
+
+  n. You means the individual or entity exercising the Licensed Rights
+     under this Public License. Your has a corresponding meaning.
+
+
+Section 2 -- Scope.
+
+  a. License grant.
+
+       1. Subject to the terms and conditions of this Public License,
+          the Licensor hereby grants You a worldwide, royalty-free,
+          non-sublicensable, non-exclusive, irrevocable license to
+          exercise the Licensed Rights in the Licensed Material to:
+
+            a. reproduce and Share the Licensed Material, in whole or
+               in part, for NonCommercial purposes only; and
+
+            b. produce, reproduce, and Share Adapted Material for
+               NonCommercial purposes only.
+
+       2. Exceptions and Limitations. For the avoidance of doubt, where
+          Exceptions and Limitations apply to Your use, this Public
+          License does not apply, and You do not need to comply with
+          its terms and conditions.
+
+       3. Term. The term of this Public License is specified in Section
+          6(a).
+
+       4. Media and formats; technical modifications allowed. The
+          Licensor authorizes You to exercise the Licensed Rights in
+          all media and formats whether now known or hereafter created,
+          and to make technical modifications necessary to do so. The
+          Licensor waives and/or agrees not to assert any right or
+          authority to forbid You from making technical modifications
+          necessary to exercise the Licensed Rights, including
+          technical modifications necessary to circumvent Effective
+          Technological Measures. For purposes of this Public License,
+          simply making modifications authorized by this Section 2(a)
+          (4) never produces Adapted Material.
+
+       5. Downstream recipients.
+
+            a. Offer from the Licensor -- Licensed Material. Every
+               recipient of the Licensed Material automatically
+               receives an offer from the Licensor to exercise the
+               Licensed Rights under the terms and conditions of this
+               Public License.
+
+            b. Additional offer from the Licensor -- Adapted Material.
+               Every recipient of Adapted Material from You
+               automatically receives an offer from the Licensor to
+               exercise the Licensed Rights in the Adapted Material
+               under the conditions of the Adapter's License You apply.
+
+            c. No downstream restrictions. You may not offer or impose
+               any additional or different terms or conditions on, or
+               apply any Effective Technological Measures to, the
+               Licensed Material if doing so restricts exercise of the
+               Licensed Rights by any recipient of the Licensed
+               Material.
+
+       6. No endorsement. Nothing in this Public License constitutes or
+          may be construed as permission to assert or imply that You
+          are, or that Your use of the Licensed Material is, connected
+          with, or sponsored, endorsed, or granted official status by,
+          the Licensor or others designated to receive attribution as
+          provided in Section 3(a)(1)(A)(i).
+
+  b. Other rights.
+
+       1. Moral rights, such as the right of integrity, are not
+          licensed under this Public License, nor are publicity,
+          privacy, and/or other similar personality rights; however, to
+          the extent possible, the Licensor waives and/or agrees not to
+          assert any such rights held by the Licensor to the limited
+          extent necessary to allow You to exercise the Licensed
+          Rights, but not otherwise.
+
+       2. Patent and trademark rights are not licensed under this
+          Public License.
+
+       3. To the extent possible, the Licensor waives any right to
+          collect royalties from You for the exercise of the Licensed
+          Rights, whether directly or through a collecting society
+          under any voluntary or waivable statutory or compulsory
+          licensing scheme. In all other cases the Licensor expressly
+          reserves any right to collect such royalties, including when
+          the Licensed Material is used other than for NonCommercial
+          purposes.
+
+
+Section 3 -- License Conditions.
+
+Your exercise of the Licensed Rights is expressly made subject to the
+following conditions.
+
+  a. Attribution.
+
+       1. If You Share the Licensed Material (including in modified
+          form), You must:
+
+            a. retain the following if it is supplied by the Licensor
+               with the Licensed Material:
+
+                 i. identification of the creator(s) of the Licensed
+                    Material and any others designated to receive
+                    attribution, in any reasonable manner requested by
+                    the Licensor (including by pseudonym if
+                    designated);
+
+                ii. a copyright notice;
+
+               iii. a notice that refers to this Public License;
+
+                iv. a notice that refers to the disclaimer of
+                    warranties;
+
+                 v. a URI or hyperlink to the Licensed Material to the
+                    extent reasonably practicable;
+
+            b. indicate if You modified the Licensed Material and
+               retain an indication of any previous modifications; and
+
+            c. indicate the Licensed Material is licensed under this
+               Public License, and include the text of, or the URI or
+               hyperlink to, this Public License.
+
+       2. You may satisfy the conditions in Section 3(a)(1) in any
+          reasonable manner based on the medium, means, and context in
+          which You Share the Licensed Material. For example, it may be
+          reasonable to satisfy the conditions by providing a URI or
+          hyperlink to a resource that includes the required
+          information.
+       3. If requested by the Licensor, You must remove any of the
+          information required by Section 3(a)(1)(A) to the extent
+          reasonably practicable.
+
+  b. ShareAlike.
+
+     In addition to the conditions in Section 3(a), if You Share
+     Adapted Material You produce, the following conditions also apply.
+
+       1. The Adapter's License You apply must be a Creative Commons
+          license with the same License Elements, this version or
+          later, or a BY-NC-SA Compatible License.
+
+       2. You must include the text of, or the URI or hyperlink to, the
+          Adapter's License You apply. You may satisfy this condition
+          in any reasonable manner based on the medium, means, and
+          context in which You Share Adapted Material.
+
+       3. You may not offer or impose any additional or different terms
+          or conditions on, or apply any Effective Technological
+          Measures to, Adapted Material that restrict exercise of the
+          rights granted under the Adapter's License You apply.
+
+
+Section 4 -- Sui Generis Database Rights.
+
+Where the Licensed Rights include Sui Generis Database Rights that
+apply to Your use of the Licensed Material:
+
+  a. for the avoidance of doubt, Section 2(a)(1) grants You the right
+     to extract, reuse, reproduce, and Share all or a substantial
+     portion of the contents of the database for NonCommercial purposes
+     only;
+
+  b. if You include all or a substantial portion of the database
+     contents in a database in which You have Sui Generis Database
+     Rights, then the database in which You have Sui Generis Database
+     Rights (but not its individual contents) is Adapted Material,
+     including for purposes of Section 3(b); and
+
+  c. You must comply with the conditions in Section 3(a) if You Share
+     all or a substantial portion of the contents of the database.
+
+For the avoidance of doubt, this Section 4 supplements and does not
+replace Your obligations under this Public License where the Licensed
+Rights include other Copyright and Similar Rights.
+
+
+Section 5 -- Disclaimer of Warranties and Limitation of Liability.
+
+  a. UNLESS OTHERWISE SEPARATELY UNDERTAKEN BY THE LICENSOR, TO THE
+     EXTENT POSSIBLE, THE LICENSOR OFFERS THE LICENSED MATERIAL AS-IS
+     AND AS-AVAILABLE, AND MAKES NO REPRESENTATIONS OR WARRANTIES OF
+     ANY KIND CONCERNING THE LICENSED MATERIAL, WHETHER EXPRESS,
+     IMPLIED, STATUTORY, OR OTHER. THIS INCLUDES, WITHOUT LIMITATION,
+     WARRANTIES OF TITLE, MERCHANTABILITY, FITNESS FOR A PARTICULAR
+     PURPOSE, NON-INFRINGEMENT, ABSENCE OF LATENT OR OTHER DEFECTS,
+     ACCURACY, OR THE PRESENCE OR ABSENCE OF ERRORS, WHETHER OR NOT
+     KNOWN OR DISCOVERABLE. WHERE DISCLAIMERS OF WARRANTIES ARE NOT
+     ALLOWED IN FULL OR IN PART, THIS DISCLAIMER MAY NOT APPLY TO YOU.
+
+  b. TO THE EXTENT POSSIBLE, IN NO EVENT WILL THE LICENSOR BE LIABLE
+     TO YOU ON ANY LEGAL THEORY (INCLUDING, WITHOUT LIMITATION,
+     NEGLIGENCE) OR OTHERWISE FOR ANY DIRECT, SPECIAL, INDIRECT,
+     INCIDENTAL, CONSEQUENTIAL, PUNITIVE, EXEMPLARY, OR OTHER LOSSES,
+     COSTS, EXPENSES, OR DAMAGES ARISING OUT OF THIS PUBLIC LICENSE OR
+     USE OF THE LICENSED MATERIAL, EVEN IF THE LICENSOR HAS BEEN
+     ADVISED OF THE POSSIBILITY OF SUCH LOSSES, COSTS, EXPENSES, OR
+     DAMAGES. WHERE A LIMITATION OF LIABILITY IS NOT ALLOWED IN FULL OR
+     IN PART, THIS LIMITATION MAY NOT APPLY TO YOU.
+
+  c. The disclaimer of warranties and limitation of liability provided
+     above shall be interpreted in a manner that, to the extent
+     possible, most closely approximates an absolute disclaimer and
+     waiver of all liability.
+
+
+Section 6 -- Term and Termination.
+
+  a. This Public License applies for the term of the Copyright and
+     Similar Rights licensed here. However, if You fail to comply with
+     this Public License, then Your rights under this Public License
+     terminate automatically.
+
+  b. Where Your right to use the Licensed Material has terminated under
+     Section 6(a), it reinstates:
+
+       1. automatically as of the date the violation is cured, provided
+          it is cured within 30 days of Your discovery of the
+          violation; or
+
+       2. upon express reinstatement by the Licensor.
+
+     For the avoidance of doubt, this Section 6(b) does not affect any
+     right the Licensor may have to seek remedies for Your violations
+     of this Public License.
+
+  c. For the avoidance of doubt, the Licensor may also offer the
+     Licensed Material under separate terms or conditions or stop
+     distributing the Licensed Material at any time; however, doing so
+     will not terminate this Public License.
+
+  d. Sections 1, 5, 6, 7, and 8 survive termination of this Public
+     License.
+
+
+Section 7 -- Other Terms and Conditions.
+
+  a. The Licensor shall not be bound by any additional or different
+     terms or conditions communicated by You unless expressly agreed.
+
+  b. Any arrangements, understandings, or agreements regarding the
+     Licensed Material not stated herein are separate from and
+     independent of the terms and conditions of this Public License.
+
+
+Section 8 -- Interpretation.
+
+  a. For the avoidance of doubt, this Public License does not, and
+     shall not be interpreted to, reduce, limit, restrict, or impose
+     conditions on any use of the Licensed Material that could lawfully
+     be made without permission under this Public License.
+
+  b. To the extent possible, if any provision of this Public License is
+     deemed unenforceable, it shall be automatically reformed to the
+     minimum extent necessary to make it enforceable. If the provision
+     cannot be reformed, it shall be severed from this Public License
+     without affecting the enforceability of the remaining terms and
+     conditions.
+
+  c. No term or condition of this Public License will be waived and no
+     failure to comply consented to unless expressly agreed to by the
+     Licensor.
+
+  d. Nothing in this Public License constitutes or may be interpreted
+     as a limitation upon, or waiver of, any privileges and immunities
+     that apply to the Licensor or You, including from the legal
+     processes of any jurisdiction or authority.
+
+=======================================================================
+
+Creative Commons is not a party to its public
+licenses. Notwithstanding, Creative Commons may elect to apply one of
+its public licenses to material it publishes and in those instances
+will be considered the “Licensor.” The text of the Creative Commons
+public licenses is dedicated to the public domain under the CC0 Public
+Domain Dedication. Except for the limited purpose of indicating that
+material is shared under a Creative Commons public license or as
+otherwise permitted by the Creative Commons policies published at
+creativecommons.org/policies, Creative Commons does not authorize the
+use of the trademark "Creative Commons" or any other trademark or logo
+of Creative Commons without its prior written consent including,
+without limitation, in connection with any unauthorized modifications
+to any of its public licenses or any other arrangements,
+understandings, or agreements concerning use of licensed material. For
+the avoidance of doubt, this paragraph does not form part of the
+public licenses.
+
+Creative Commons may be contacted at creativecommons.org.

README.md

@@ -1,6 +1,14 @@
+# This project has evolved to become [Computing:Box](https://git.adcmnetworks.co.uk/alexander.lyall/computing-box)
+### Available at:
+- [Personal Gitea Instance](https://git.adcmnetworks.co.uk/alexander.lyall/computing-box),
+- [GitHub](https://github.com/MrLyallCSIT/Computing-Box)
+- [The Official Computing:Box Website](https://www.computingbox.co.uk)
+
 # CS:Box
-Evolution of Bit:Box to incorporate different elements of the UK Computing Curriculum
-Available at [csbox.mrdaviscsit.uk](https://csbox.mrdaviscsit.uk)
+An evolution of Bit:Box to incorporate different elements of the UK Computing Curriculum
+
+
+<img src="/assets/img/CSBox-Logo.png" alt="CS:Box Logo" width="250px" height="250px"/>
 
 ## Upcoming Features
 ### Original Bit:Box Features (October 2024)
@@ -20,8 +28,24 @@ Available at [csbox.mrdaviscsit.uk](https://csbox.mrdaviscsit.uk)
 - [X] XOR Gate Simulator
 - [X] XNOR Gate Simulator
 
-### Wave 3 CS:Box Features (TBC)
+### Wave 3 CS:Box Features (Spring 2026)
+- [X] Two's Compliment Simulator
+- [ ] Extended Binary Simulator (Custom bit sizes)
+- [ ] Unified Binary Simulator (Unsigned & Two's Completment combined)
+- [ ] Enhanced Gate Simulator (Truth Table Creator)
 - [ ] Compound Gate Simulator
-- [ ] Two's Compliment Simulator
+- [ ] Computer Components Simulator
 
 ## Version 1.0 Release Date: 1<sup>st</sup> September 2025
+## Version 2.0 Release Date (Goal): 1<sup>st</sup> April 2026
+
+Shield: [![CC BY-NC-SA 4.0][cc-by-nc-sa-shield]][cc-by-nc-sa]
+
+This work is licensed under a
+[Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License][cc-by-nc-sa].
+
+[![CC BY-NC-SA 4.0][cc-by-nc-sa-image]][cc-by-nc-sa]
+
+[cc-by-nc-sa]: http://creativecommons.org/licenses/by-nc-sa/4.0/
+[cc-by-nc-sa-image]: https://licensebuttons.net/l/by-nc-sa/4.0/88x31.png
+[cc-by-nc-sa-shield]: https://img.shields.io/badge/License-CC%20BY--NC--SA%204.0-lightgrey.svg

cliff.toml

@@ -0,0 +1,56 @@
+# git-cliff configuration
+# Keep a Changelog compatible
+# Safe for first run with no tags
+
+[changelog]
+header = """
+# Changelog
+
+All notable changes to this project will be documented in this file.
+
+The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
+and this project adheres to [Conventional Commits](https://www.conventionalcommits.org/).
+"""
+
+body = """
+{% if version %}
+## [{{ version }}] - {{ timestamp | date(format="%Y-%m-%d") }}
+{% else %}
+## [Unreleased]
+{% endif %}
+
+{% for group, commits in commits | group_by(attribute="group") %}
+### {{ group }}
+
+{% for commit in commits %}
+- {{ commit.message | trim }}
+{% endfor %}
+{% endfor %}
+"""
+
+footer = """
+<!-- generated by git-cliff -->
+"""
+
+trim = true
+
+[git]
+conventional_commits = true
+filter_unconventional = false
+split_commits = false
+commit_parsers = [
+  { message = "^feat",  group = "Added" },
+  { message = "^fix",   group = "Fixed" },
+  { message = "^docs",  group = "Documentation" },
+  { message = "^style", group = "Styling" },
+  { message = "^refactor", group = "Changed" },
+  { message = "^perf",  group = "Performance" },
+  { message = "^test",  group = "Tests" },
+  { message = "^build", group = "Build" },
+  { message = "^ci",    group = "CI" },
+  { message = "^chore", group = "Chore" },
+  { message = "^revert", group = "Reverted" }
+]
+
+protect_breaking_commits = false
+sort_commits = "oldest"

export/a-level-hexadecimal.html

@@ -7,6 +7,10 @@
 <script>
   var _paq = window._paq = window._paq || [];
   /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+  _paq.push(["setCookieDomain", "*.www.computingbox.co.uk"]);
+  _paq.push(["setDomains", ["*.www.computingbox.co.uk","*.csbox.mrdaviscsit.uk","*.csbox.mrlyall.co.uk","*.csbox.mrlyall.uk"]]);
+  _paq.push(["enableCrossDomainLinking"]);
+  _paq.push(["disableCookies"]);
   _paq.push(['trackPageView']);
   _paq.push(['enableLinkTracking']);
   (function() {
@@ -17,30 +21,118 @@
     g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
   })();
 </script>
+<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="//analytics.adcmnetworks.co.uk/matomo.php?idsite=2&amp;rec=1" style="border:0;" alt="" /></p></noscript>
 <!-- End Matomo Code -->
     <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
     <title>A Level Hexadecimal Simulator - CS:Box</title>
-    <meta name="twitter:card" content="summary_large_image">
+    <link rel="canonical" href="https://www.computingbox.co.uk/a-level-hexadecimal.html">
+    <meta property="og:url" content="https://www.computingbox.co.uk/a-level-hexadecimal.html">
     <meta property="og:type" content="website">
-    <meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
-    <script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&amp;display=swap">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans&amp;display=swap">
-    <link rel="stylesheet" href="assets/css/styles.min.css?h=05023c48128d85662d4f89782ddfb125">
+    <meta name="twitter:card" content="summary_large_image">
+    <meta property="og:image" content="https://www.computingbox.co.uk/assets/img/ComputingBox-Logo.webp">
+    <script>
+        (function() {
+
+            // JavaScript snippet handling Dark/Light mode switching
+
+            const getStoredTheme = () => localStorage.getItem('theme');
+            const setStoredTheme = theme => localStorage.setItem('theme', theme);
+            const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
+
+            const getPreferredTheme = () => {
+
+                if (forcedTheme) return forcedTheme;
+
+                const storedTheme = getStoredTheme();
+                if (storedTheme) {
+                    return storedTheme;
+                }
+
+                const pageTheme = document.documentElement.getAttribute('data-bs-theme');
+
+                if (pageTheme) {
+                    return pageTheme;
+                }
+
+                return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+            }
+
+            const setTheme = theme => {
+                if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+                    document.documentElement.setAttribute('data-bs-theme', 'dark');
+                } else {
+                    document.documentElement.setAttribute('data-bs-theme', theme);
+                }
+            }
+
+            setTheme(getPreferredTheme());
+
+            const showActiveTheme = (theme, focus = false) => {
+                const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
+
+                if (!themeSwitchers.length) return;
+
+                document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
+                    element.classList.remove('active');
+                    element.setAttribute('aria-pressed', 'false');
+                });
+
+                for (const themeSwitcher of themeSwitchers) {
+
+                    const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
+
+                    if (btnToActivate) {
+                        btnToActivate.classList.add('active');
+                        btnToActivate.setAttribute('aria-pressed', 'true');
+                    }
+                }
+            }
+
+            window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
+                const storedTheme = getStoredTheme();
+                if (storedTheme !== 'light' && storedTheme !== 'dark') {
+                    setTheme(getPreferredTheme());
+                }
+            });
+
+            window.addEventListener('DOMContentLoaded', () => {
+                showActiveTheme(getPreferredTheme());
+
+                document.querySelectorAll('[data-bs-theme-value]')
+                    .forEach(toggle => {
+                        toggle.addEventListener('click', (e) => {
+                            e.preventDefault();
+                            const theme = toggle.getAttribute('data-bs-theme-value');
+                            setStoredTheme(theme);
+                            setTheme(theme);
+                            showActiveTheme(theme);
+                        })
+                    })
+            });
+        })();
+    </script>
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" media="(prefers-color-scheme: dark)">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" media="(prefers-color-scheme: dark)">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="stylesheet" href="/assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
+    <link rel="stylesheet" href="/assets/css/DSEG7%20Classic%20Regular.css">
+    <link rel="stylesheet" href="/assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
+    <link rel="stylesheet" href="/assets/css/Inter.css?h=60f7751edc3ab55acc7880f1e25e45d3">
+    <link rel="stylesheet" href="/assets/css/Open%20Sans.css?h=ce1e3121e620675940c895d202b884b3">
+    <link rel="stylesheet" href="/assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
+    <link rel="stylesheet" href="/assets/css/bss-overrides.css?h=3dbfe72d968bc29929e6342eb303e930">
+    <link rel="stylesheet" href="/assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
+    <link rel="stylesheet" href="/assets/css/styles.css?h=88201532374cf4b4d8d775d23183d357">
 </head>
 
 <body>
     <header class="bg-dark">
         <!-- Start: Site Navigation -->
         <nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
-            <div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
+            <div class="container"><img src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>Computing:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
                 <div class="collapse navbar-collapse" id="navcol-5">
                     <ul class="navbar-nav ms-auto">
                         <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
@@ -81,7 +173,7 @@
                 <div class="col centred" style="width: 30%;">
                     <div class="centred reset" style="position: relative;">
                         <p class="resetButton">Reset bit:box</p>
-                        <div style="position: absolute;"><img class="overlay resetIcon" src="assets/img/BitBoxLogo.png?h=a50b3ddb5614299b0c00dd4f01bc402e" onclick="resetHexadecimal()"></div>
+                        <div style="position: absolute;"><img class="overlay resetIcon" src="/assets/img/BitBoxLogo.png?h=a50b3ddb5614299b0c00dd4f01bc402e" onclick="resetHexadecimal()"></div>
                     </div>
                     <div class="row">
                         <div class="col-xl-12 bottomSpacer"></div>
@@ -147,6 +239,9 @@
                     <div class="row">
                         <div class="col"><button class="btn btn-primary hexadecimalButtons customiserButtons" type="button" onclick="requestDenaryForHexadecimal()">Custom Denary</button></div>
                     </div>
+                    <div class="row">
+                        <div class="col"><button class="btn btn-primary hexadecimalButtons customiserButtons" type="button" onclick="requestBinaryforHexadecimal()">Custom Binary</button></div>
+                    </div>
                 </div>
             </div>
         </div><!-- End: 1 Row 2 Columns -->
@@ -208,45 +303,48 @@
             <div class="row justify-content-center">
                 <!-- Start: About Project -->
                 <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
-                        <div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
-                                <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                            </svg><span>GitHub</span></div>
-                    </a>
+                    <div class="fw-bold d-flex align-items-center mb-2"><img src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" style="width: 32px;margin: 5px;" width="32" height="32"><span>Computing:Box</span></div>
+                    <p class="text-muted">Computing Concept Simulators</p>
                 </div><!-- End: About Project -->
-                <!-- Start: About -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
-                <!-- Start: Social Links -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
-                    <div class="row">
-                        <div class="col-md-3"><a href="https://mstdn.social/@MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-mastodon social-media">
-                                    <path d="M11.19 12.195c2.016-.24 3.77-1.475 3.99-2.603.348-1.778.32-4.339.32-4.339 0-3.47-2.286-4.488-2.286-4.488C12.062.238 10.083.017 8.027 0h-.05C5.92.017 3.942.238 2.79.765c0 0-2.285 1.017-2.285 4.488l-.002.662c-.004.64-.007 1.35.011 2.091.083 3.394.626 6.74 3.78 7.57 1.454.383 2.703.463 3.709.408 1.823-.1 2.847-.647 2.847-.647l-.06-1.317s-1.303.41-2.767.36c-1.45-.05-2.98-.156-3.215-1.928a3.614 3.614 0 0 1-.033-.496s1.424.346 3.228.428c1.103.05 2.137-.064 3.188-.189zm1.613-2.47H11.13v-4.08c0-.859-.364-1.295-1.091-1.295-.804 0-1.207.517-1.207 1.541v2.233H7.168V5.89c0-1.024-.403-1.541-1.207-1.541-.727 0-1.091.436-1.091 1.296v4.079H3.197V5.522c0-.859.22-1.541.66-2.046.456-.505 1.052-.764 1.793-.764.856 0 1.504.328 1.933.983L8 4.39l.417-.695c.429-.655 1.077-.983 1.934-.983.74 0 1.336.259 1.791.764.442.505.661 1.187.661 2.046v4.203z"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://www.linkedin.com/in/alexanderedavis/" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-linkedin social-media">
-                                    <path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854V1.146zm4.943 12.248V6.169H2.542v7.225h2.401m-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248-.822 0-1.359.54-1.359 1.248 0 .694.521 1.248 1.327 1.248h.016zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016a5.54 5.54 0 0 1 .016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225h2.4"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://github.com/MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github social-media">
-                                    <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"></div>
-                    </div>
-                </div><!-- End: Social Links -->
-                <!-- Start: Branding -->
-                <div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
-                    <div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
-                    <p class="text-muted">Computer Science Concept Simulators</p>
-                </div><!-- End: Branding -->
             </div>
             <hr>
-            <div class="text-muted d-flex justify-content-between align-items-center pt-3">
-                <p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
-            </div>
+            <div class="col text-center d-block"><a href="https://www.computingbox.co.uk">Computing:Box</a> © 2024 by <a href="https://git.adcmnetworks.co.uk/alexander.lyall">Alexander Lyall</a> is licensed under <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a><br><img src="https://mirrors.creativecommons.org/presskit/icons/cc.svg" alt="" style="max-width: 1.5em;max-height:1.5em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/by.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/nc.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/sa.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><br><a href="copyright">Copyright Notice</a></div>
+            <div class="text-muted d-flex justify-content-center"></div>
+            <p class="mb-0"><noscript><!-- Matomo Image Tracker-->
+<img referrerpolicy="no-referrer-when-downgrade" src="https://analytics.adcmnetworks.co.uk/matomo.php?idsite=2&amp;rec=1" style="border:0" alt="" />
+    <!-- End Matomo --></noscript>Built for UK Computing Curriculum<br>Powered By ADCM Networks</p>
         </div>
     </footer><!-- End: Footer Multi Column -->
+    <header class="bg-dark">
+        <!-- Start: Site Navigation -->
+        <nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
+            <div class="container"><img src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>Computing:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
+                <div class="collapse navbar-collapse" id="navcol-5">
+                    <ul class="navbar-nav ms-auto">
+                        <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
+                        <li class="nav-item"><a class="nav-link" href="about">About</a></li>
+                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Binary</a>
+                            <div class="dropdown-menu"><a class="dropdown-item" href="unsigned-binary">Unsigned Integers</a><a class="dropdown-item" href="twos-compliment-binary">Two's Compliment</a></div>
+                        </li>
+                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Hexadecimal</a>
+                            <div class="dropdown-menu"><a class="dropdown-item" href="gcse-hexadecimal">GCSE</a><a class="dropdown-item" href="a-level-hexadecimal">A Level</a></div>
+                        </li>
+                        <li class="nav-item"><a class="nav-link" href="hex-colours">Hex Colours</a></li>
+                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Logic Gates</a>
+                            <div class="dropdown-menu"><a class="dropdown-item" href="not-gate">NOT</a><a class="dropdown-item" href="and-gate">AND</a><a class="dropdown-item" href="or-gate">OR</a><a class="dropdown-item" href="nor-gate">NOR</a><a class="dropdown-item" href="nand-gate">NAND</a><a class="dropdown-item" href="xor-gate">XOR</a><a class="dropdown-item" href="xnor-gate">XNOR</a></div>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+        </nav><!-- End: Site Navigation -->
+    </header>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
-    <script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
+    <script src="/assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
+    <script src="/assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
+    <script src="/assets/js/hexadecimal.js?h=1d88c5f7da86e237fdac8a16a6958a73"></script>
+    <script src="/assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
+    <script src="/assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
 </body>
 
 </html>

export/about.html

@@ -7,6 +7,10 @@
 <script>
   var _paq = window._paq = window._paq || [];
   /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+  _paq.push(["setCookieDomain", "*.www.computingbox.co.uk"]);
+  _paq.push(["setDomains", ["*.www.computingbox.co.uk","*.csbox.mrdaviscsit.uk","*.csbox.mrlyall.co.uk","*.csbox.mrlyall.uk"]]);
+  _paq.push(["enableCrossDomainLinking"]);
+  _paq.push(["disableCookies"]);
   _paq.push(['trackPageView']);
   _paq.push(['enableLinkTracking']);
   (function() {
@@ -17,30 +21,118 @@
     g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
   })();
 </script>
+<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="//analytics.adcmnetworks.co.uk/matomo.php?idsite=2&amp;rec=1" style="border:0;" alt="" /></p></noscript>
 <!-- End Matomo Code -->
     <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
     <title>About - CS:Box</title>
-    <meta name="twitter:card" content="summary_large_image">
+    <link rel="canonical" href="https://www.computingbox.co.uk/about.html">
+    <meta property="og:url" content="https://www.computingbox.co.uk/about.html">
     <meta property="og:type" content="website">
-    <meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
-    <script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&amp;display=swap">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans&amp;display=swap">
-    <link rel="stylesheet" href="assets/css/styles.min.css?h=05023c48128d85662d4f89782ddfb125">
+    <meta name="twitter:card" content="summary_large_image">
+    <meta property="og:image" content="https://www.computingbox.co.uk/assets/img/ComputingBox-Logo.webp">
+    <script>
+        (function() {
+
+            // JavaScript snippet handling Dark/Light mode switching
+
+            const getStoredTheme = () => localStorage.getItem('theme');
+            const setStoredTheme = theme => localStorage.setItem('theme', theme);
+            const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
+
+            const getPreferredTheme = () => {
+
+                if (forcedTheme) return forcedTheme;
+
+                const storedTheme = getStoredTheme();
+                if (storedTheme) {
+                    return storedTheme;
+                }
+
+                const pageTheme = document.documentElement.getAttribute('data-bs-theme');
+
+                if (pageTheme) {
+                    return pageTheme;
+                }
+
+                return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+            }
+
+            const setTheme = theme => {
+                if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+                    document.documentElement.setAttribute('data-bs-theme', 'dark');
+                } else {
+                    document.documentElement.setAttribute('data-bs-theme', theme);
+                }
+            }
+
+            setTheme(getPreferredTheme());
+
+            const showActiveTheme = (theme, focus = false) => {
+                const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
+
+                if (!themeSwitchers.length) return;
+
+                document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
+                    element.classList.remove('active');
+                    element.setAttribute('aria-pressed', 'false');
+                });
+
+                for (const themeSwitcher of themeSwitchers) {
+
+                    const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
+
+                    if (btnToActivate) {
+                        btnToActivate.classList.add('active');
+                        btnToActivate.setAttribute('aria-pressed', 'true');
+                    }
+                }
+            }
+
+            window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
+                const storedTheme = getStoredTheme();
+                if (storedTheme !== 'light' && storedTheme !== 'dark') {
+                    setTheme(getPreferredTheme());
+                }
+            });
+
+            window.addEventListener('DOMContentLoaded', () => {
+                showActiveTheme(getPreferredTheme());
+
+                document.querySelectorAll('[data-bs-theme-value]')
+                    .forEach(toggle => {
+                        toggle.addEventListener('click', (e) => {
+                            e.preventDefault();
+                            const theme = toggle.getAttribute('data-bs-theme-value');
+                            setStoredTheme(theme);
+                            setTheme(theme);
+                            showActiveTheme(theme);
+                        })
+                    })
+            });
+        })();
+    </script>
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" media="(prefers-color-scheme: dark)">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" media="(prefers-color-scheme: dark)">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="stylesheet" href="/assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
+    <link rel="stylesheet" href="/assets/css/DSEG7%20Classic%20Regular.css">
+    <link rel="stylesheet" href="/assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
+    <link rel="stylesheet" href="/assets/css/Inter.css?h=60f7751edc3ab55acc7880f1e25e45d3">
+    <link rel="stylesheet" href="/assets/css/Open%20Sans.css?h=ce1e3121e620675940c895d202b884b3">
+    <link rel="stylesheet" href="/assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
+    <link rel="stylesheet" href="/assets/css/bss-overrides.css?h=3dbfe72d968bc29929e6342eb303e930">
+    <link rel="stylesheet" href="/assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
+    <link rel="stylesheet" href="/assets/css/styles.css?h=88201532374cf4b4d8d775d23183d357">
 </head>
 
 <body>
     <header class="bg-dark">
         <!-- Start: Site Navigation -->
         <nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
-            <div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
+            <div class="container"><img src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>Computing:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
                 <div class="collapse navbar-collapse" id="navcol-5">
                     <ul class="navbar-nav ms-auto">
                         <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
@@ -65,34 +157,34 @@
         <div class="container">
             <div class="row mb-4 mb-lg-5">
                 <div class="col-md-8 col-xl-6 text-center mx-auto">
-                    <p class="fw-bold text-success mb-2">CS:Box</p>
-                    <h3 class="fw-bold">An&nbsp;evolution of Bit:Box to incorporate different elements of the UK Computing Curriculum</h3>
+                    <p class="fw-bold text-success mb-2">Computing:Box</p>
+                    <h3 class="fw-bold">An interactive learning platform for exploring key ideas from the UK Computing Curriculum.</h3>
                 </div>
             </div>
             <div class="row row-cols-1 row-cols-md-2 mx-auto">
-                <div class="col mb-5"><img class="rounded img-fluid shadow" src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71"></div>
+                <div class="col mb-5"><img class="rounded img-fluid shadow" src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1"></div>
                 <div class="col d-md-flex align-items-md-end align-items-lg-center mb-5">
                     <div>
-                        <h5 class="fw-bold">About CS:Box</h5>
-                        <p class="text-muted mb-4">CS:Box is an innovative educational tool designed to support the teaching of key concepts from the UK Computing Curriculum. Building on the foundations of Bit:Box, CS:Box expands its scope to cover a wider range of essential computing topics, providing an interactive and engaging experience for students.</p>
+                        <h5 class="fw-bold">About Computing:Box</h5>
+                        <p class="text-muted mb-4">Computing:Box is a web-based learning tool designed to help students understand core computing concepts in a clear and practical way. It supports learning across different areas of computing by using interactive activities that make abstract ideas easier to see and understand.<br><br>The platform is designed for use in lessons, independent study, and revision, helping students build confidence as they explore how computers work.</p>
                     </div>
                 </div>
             </div>
             <div class="row row-cols-1 row-cols-md-2 mx-auto">
-                <div class="col order-md-last mb-5"><img class="rounded img-fluid shadow" src="assets/img/BitBoxLogo.png?h=a50b3ddb5614299b0c00dd4f01bc402e"></div>
+                <div class="col order-md-last mb-5"><img class="rounded img-fluid shadow" src="/assets/img/BitBoxLogo.png?h=a50b3ddb5614299b0c00dd4f01bc402e"></div>
                 <div class="col d-md-flex align-items-md-end align-items-lg-center mb-5">
                     <div>
-                        <h5 class="fw-bold">The Evolution from Bit:Box</h5>
-                        <p class="text-muted mb-4">Originally, Bit:Box was developed as a web-based version of a physical Binary Light Box, a hands-on device created by Mr. Davis. This device used lightbulbs and an Arduino microcontroller to visually demonstrate how binary numbers work and the values assigned to each binary column. By interacting with the light switches, students could better understand the concepts of binary counting, place values, and logic.</p>
+                        <h5 class="fw-bold">From Bit:Box to Computing:Box</h5>
+                        <p class="text-muted mb-4">Computing:Box began as Bit:Box, a digital version of a physical Binary Light Box created by Mr Davis. The original device used lightbulbs and an Arduino to show how binary numbers are built using on and off values.<br><br>By switching lights on and off, students could clearly see how binary counting and place values work. This hands-on approach helped make a difficult topic more accessible and engaging.</p>
                     </div>
                 </div>
             </div>
             <div class="row row-cols-1 row-cols-md-2 mx-auto">
-                <div class="col mb-5"><img class="rounded img-fluid shadow" src="assets/img/Evolution_BitBox_to_CSBox.webp?h=1ec7437634c178a31d213253a1700f67"></div>
+                <div class="col mb-5"><img class="rounded img-fluid shadow" src="/assets/img/computingbox-concept-illustration.webp?h=9dc6d025c1d9e28ef023c8c72105cc82"></div>
                 <div class="col d-md-flex align-items-md-end align-items-lg-center mb-5">
                     <div>
-                        <h5 class="fw-bold">How CS:Box Builds on Bit:Box</h5>
-                        <p class="text-muted mb-4">CS:Box retains the interactive, visual, and tactile learning approach introduced by Bit:Box but extends its reach to cover a broader range of computing concepts. By incorporating elements of the UK Computing Curriculum, CS:Box now goes beyond binary to include concepts like hexadecimal, logic gates, and even color representation in computing. It allows students to visualize and manipulate abstract computing concepts in a practical, hands-on way.</p>
+                        <h5 class="fw-bold">What Computing:Box Does Now</h5>
+                        <p class="text-muted mb-4">Computing:Box builds on the ideas behind Bit:Box and expands them to cover a wider range of computing topics from the UK Computing Curriculum. In addition to binary, students can now explore areas such as hexadecimal, logic gates, and how colours are represented in computing.<br><br>The focus remains on learning by doing. Students can interact with simulations, change values, and see results instantly. This helps them understand how computing concepts work, rather than just memorising rules or steps.</p>
                     </div>
                 </div>
             </div>
@@ -103,7 +195,7 @@
             <div class="container bg-dark py-5">
                 <div class="row">
                     <div class="col-md-8 col-xl-6 text-center mx-auto">
-                        <h3 class="fw-bold">Key Features of CS:Box</h3>
+                        <h3 class="fw-bold">Key Features of Computing:Box</h3>
                     </div>
                 </div>
                 <div class="p-lg-5 py-5">
@@ -115,7 +207,7 @@
                                             <path fill-rule="evenodd" d="M6 3.5A1.5 1.5 0 0 1 7.5 2h1A1.5 1.5 0 0 1 10 3.5v1A1.5 1.5 0 0 1 8.5 6v1H14a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-1 0V8h-5v.5a.5.5 0 0 1-1 0V8h-5v.5a.5.5 0 0 1-1 0v-1A.5.5 0 0 1 2 7h5.5V6A1.5 1.5 0 0 1 6 4.5zM8.5 5a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5zM0 11.5A1.5 1.5 0 0 1 1.5 10h1A1.5 1.5 0 0 1 4 11.5v1A1.5 1.5 0 0 1 2.5 14h-1A1.5 1.5 0 0 1 0 12.5zm1.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5zm4.5.5A1.5 1.5 0 0 1 7.5 10h1a1.5 1.5 0 0 1 1.5 1.5v1A1.5 1.5 0 0 1 8.5 14h-1A1.5 1.5 0 0 1 6 12.5zm1.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5zm4.5.5a1.5 1.5 0 0 1 1.5-1.5h1a1.5 1.5 0 0 1 1.5 1.5v1a1.5 1.5 0 0 1-1.5 1.5h-1a1.5 1.5 0 0 1-1.5-1.5zm1.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5z"></path>
                                         </svg></div>
                                     <h5 class="fw-bold card-title">Binary Simulations</h5>
-                                    <p class="text-muted mb-4 card-text">Erat netus est hendrerit, nullam et quis ad cras porttitor iaculis. Bibendum vulputate cras aenean.</p>
+                                    <p class="text-muted mb-4 card-text">Interactive tools that help students understand how numbers work in binary. Students can turn bits on and off and see how the number changes. This helps them learn how binary numbers are built, instead of just memorising conversions.</p>
                                 </div>
                             </div>
                         </div>
@@ -126,7 +218,7 @@
                                             <path d="M8.39 12.648a1.32 1.32 0 0 0-.015.18c0 .305.21.508.5.508.266 0 .492-.172.555-.477l.554-2.703h1.204c.421 0 .617-.234.617-.547 0-.312-.188-.53-.617-.53h-.985l.516-2.524h1.265c.43 0 .618-.227.618-.547 0-.313-.188-.524-.618-.524h-1.046l.476-2.304a1.06 1.06 0 0 0 .016-.164.51.51 0 0 0-.516-.516.54.54 0 0 0-.539.43l-.523 2.554H7.617l.477-2.304c.008-.04.015-.118.015-.164a.512.512 0 0 0-.523-.516.539.539 0 0 0-.531.43L6.53 5.484H5.414c-.43 0-.617.22-.617.532 0 .312.187.539.617.539h.906l-.515 2.523H4.609c-.421 0-.609.219-.609.531 0 .313.188.547.61.547h.976l-.516 2.492c-.008.04-.015.125-.015.18 0 .305.21.508.5.508.265 0 .492-.172.554-.477l.555-2.703h2.242l-.515 2.492zm-1-6.109h2.266l-.515 2.563H6.859l.532-2.563z"></path>
                                         </svg></div>
                                     <h5 class="fw-bold card-title">Hexadecimal Tools</h5>
-                                    <p class="text-muted mb-4 card-text">Erat netus est hendrerit, nullam et quis ad cras porttitor iaculis. Bibendum vulputate cras aenean.</p>
+                                    <p class="text-muted mb-4 card-text">Easy-to-use tools that help students learn hexadecimal. Students can practise changing numbers between binary, denary, and hexadecimal. Clear steps and visual support help students understand how the number systems are connected.</p>
                                 </div>
                             </div>
                         </div>
@@ -138,7 +230,7 @@
                                             <path d="M16 8A5 5 0 1 1 6 8a5 5 0 0 1 10 0"></path>
                                         </svg></div>
                                     <h5 class="fw-bold card-title">Logic Gates</h5>
-                                    <p class="text-muted mb-4 card-text">Erat netus est hendrerit, nullam et quis ad cras porttitor iaculis. Bibendum vulputate cras aenean.</p>
+                                    <p class="text-muted mb-4 card-text">Simple simulations that show how logic gates work. Students can change the inputs and see the output update instantly. This helps them understand how gates like AND, OR, and NOT make decisions inside computers.</p>
                                 </div>
                             </div>
                         </div>
@@ -150,7 +242,7 @@
                                             <path d="M16 8c0 3.15-1.866 2.585-3.567 2.07C11.42 9.763 10.465 9.473 10 10c-.603.683-.475 1.819-.351 2.92C9.826 14.495 9.996 16 8 16a8 8 0 1 1 8-8m-8 7c.611 0 .654-.171.655-.176.078-.146.124-.464.07-1.119-.014-.168-.037-.37-.061-.591-.052-.464-.112-1.005-.118-1.462-.01-.707.083-1.61.704-2.314.369-.417.845-.578 1.272-.618.404-.038.812.026 1.16.104.343.077.702.186 1.025.284l.028.008c.346.105.658.199.953.266.653.148.904.083.991.024C14.717 9.38 15 9.161 15 8a7 7 0 1 0-7 7"></path>
                                         </svg></div>
                                     <h5 class="fw-bold card-title">Hex Colors</h5>
-                                    <p class="text-muted mb-4 card-text">Erat netus est hendrerit, nullam et quis ad cras porttitor iaculis. Bibendum vulputate cras aenean.</p>
+                                    <p class="text-muted mb-4 card-text">A visual tool that shows how colours are created using hexadecimal values. Students can see how red, green, and blue values change a colour. This helps link hexadecimal numbers to real uses like websites and digital design.</p>
                                 </div>
                             </div>
                         </div>
@@ -161,7 +253,7 @@
                                             <path d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8m7.5-6.923c-.67.204-1.335.82-1.887 1.855A7.97 7.97 0 0 0 5.145 4H7.5zM4.09 4a9.267 9.267 0 0 1 .64-1.539 6.7 6.7 0 0 1 .597-.933A7.025 7.025 0 0 0 2.255 4zm-.582 3.5c.03-.877.138-1.718.312-2.5H1.674a6.958 6.958 0 0 0-.656 2.5zM4.847 5a12.5 12.5 0 0 0-.338 2.5H7.5V5zM8.5 5v2.5h2.99a12.495 12.495 0 0 0-.337-2.5zM4.51 8.5a12.5 12.5 0 0 0 .337 2.5H7.5V8.5zm3.99 0V11h2.653c.187-.765.306-1.608.338-2.5zM5.145 12c.138.386.295.744.468 1.068.552 1.035 1.218 1.65 1.887 1.855V12zm.182 2.472a6.696 6.696 0 0 1-.597-.933A9.268 9.268 0 0 1 4.09 12H2.255a7.024 7.024 0 0 0 3.072 2.472M3.82 11a13.652 13.652 0 0 1-.312-2.5h-2.49c.062.89.291 1.733.656 2.5zm6.853 3.472A7.024 7.024 0 0 0 13.745 12H11.91a9.27 9.27 0 0 1-.64 1.539 6.688 6.688 0 0 1-.597.933M8.5 12v2.923c.67-.204 1.335-.82 1.887-1.855.173-.324.33-.682.468-1.068zm3.68-1h2.146c.365-.767.594-1.61.656-2.5h-2.49a13.65 13.65 0 0 1-.312 2.5zm2.802-3.5a6.959 6.959 0 0 0-.656-2.5H12.18c.174.782.282 1.623.312 2.5zM11.27 2.461c.247.464.462.98.64 1.539h1.835a7.024 7.024 0 0 0-3.072-2.472c.218.284.418.598.597.933zM10.855 4a7.966 7.966 0 0 0-.468-1.068C9.835 1.897 9.17 1.282 8.5 1.077V4z"></path>
                                         </svg></div>
                                     <h5 class="fw-bold card-title">User-Focused Design</h5>
-                                    <p class="text-muted mb-4 card-text">CS:Box is accessible on any device with a browser. Its web-based design ensures students can engage with computing concepts from any location, promoting independent learning and experimentation.</p>
+                                    <p class="text-muted mb-4 card-text">Computing:Box is accessible on any device with a browser. Its web-based design ensures students can engage with computing concepts from any location, promoting independent learning and experimentation.</p>
                                 </div>
                             </div>
                         </div>
@@ -172,11 +264,11 @@
         <!-- Start: Features Cards -->
         <div class="container py-5">
             <div class="row row-cols-1 row-cols-md-2 mx-auto">
-                <div class="col mb-5"><img class="rounded img-fluid shadow" src="assets/img/Educational_Impact.webp?h=63a87115577f492ad78640012051f84a"></div>
+                <div class="col mb-5"><img class="rounded img-fluid shadow" src="/assets/img/Educational_Impact.webp?h=63a87115577f492ad78640012051f84a"></div>
                 <div class="col d-md-flex align-items-md-end align-items-lg-center mb-5">
                     <div>
                         <h5 class="fw-bold">Educational Impact</h5>
-                        <p class="text-muted mb-4">CS:Box is more than a collection of interactive tools — it is a guided learning experience for students to understand complex computing concepts. By combining hands-on manipulation with visual feedback, it provides a scaffolded learning approach for students at different stages of their educational journey.<br><br>Whether students are learning binary for the first time or deepening their knowledge of hexadecimal and logic gates, CS:Box offers a clear, engaging, and practical method to achieve those learning goals. It exemplifies Mr. Davis' dedication to creating meaningful, student-friendly educational resources for the modern classroom.</p>
+                        <p class="text-muted mb-4">Computing:Box is more than a set of interactive tools. It is designed to help students learn computing concepts step by step, using clear visuals and simple interactions.<br><br>By changing values and seeing results straight away, students can build understanding at their own pace. This supports learners with different levels of confidence and helps make challenging ideas easier to grasp.<br><br>Whether students are learning binary for the first time or developing their understanding of hexadecimal and logic gates, Computing:Box provides a clear and practical way to learn. The platform reflects a focus on creating accessible, student-friendly resources that support learning in the modern classroom.</p>
                     </div>
                 </div>
             </div>
@@ -187,45 +279,25 @@
             <div class="row justify-content-center">
                 <!-- Start: About Project -->
                 <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
-                        <div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
-                                <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                            </svg><span>GitHub</span></div>
-                    </a>
+                    <div class="fw-bold d-flex align-items-center mb-2"><img src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" style="width: 32px;margin: 5px;" width="32" height="32"><span>Computing:Box</span></div>
+                    <p class="text-muted">Computing Concept Simulators</p>
                 </div><!-- End: About Project -->
-                <!-- Start: About -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
-                <!-- Start: Social Links -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
-                    <div class="row">
-                        <div class="col-md-3"><a href="https://mstdn.social/@MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-mastodon social-media">
-                                    <path d="M11.19 12.195c2.016-.24 3.77-1.475 3.99-2.603.348-1.778.32-4.339.32-4.339 0-3.47-2.286-4.488-2.286-4.488C12.062.238 10.083.017 8.027 0h-.05C5.92.017 3.942.238 2.79.765c0 0-2.285 1.017-2.285 4.488l-.002.662c-.004.64-.007 1.35.011 2.091.083 3.394.626 6.74 3.78 7.57 1.454.383 2.703.463 3.709.408 1.823-.1 2.847-.647 2.847-.647l-.06-1.317s-1.303.41-2.767.36c-1.45-.05-2.98-.156-3.215-1.928a3.614 3.614 0 0 1-.033-.496s1.424.346 3.228.428c1.103.05 2.137-.064 3.188-.189zm1.613-2.47H11.13v-4.08c0-.859-.364-1.295-1.091-1.295-.804 0-1.207.517-1.207 1.541v2.233H7.168V5.89c0-1.024-.403-1.541-1.207-1.541-.727 0-1.091.436-1.091 1.296v4.079H3.197V5.522c0-.859.22-1.541.66-2.046.456-.505 1.052-.764 1.793-.764.856 0 1.504.328 1.933.983L8 4.39l.417-.695c.429-.655 1.077-.983 1.934-.983.74 0 1.336.259 1.791.764.442.505.661 1.187.661 2.046v4.203z"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://www.linkedin.com/in/alexanderedavis/" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-linkedin social-media">
-                                    <path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854V1.146zm4.943 12.248V6.169H2.542v7.225h2.401m-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248-.822 0-1.359.54-1.359 1.248 0 .694.521 1.248 1.327 1.248h.016zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016a5.54 5.54 0 0 1 .016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225h2.4"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://github.com/MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github social-media">
-                                    <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"></div>
-                    </div>
-                </div><!-- End: Social Links -->
-                <!-- Start: Branding -->
-                <div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
-                    <div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
-                    <p class="text-muted">Computer Science Concept Simulators</p>
-                </div><!-- End: Branding -->
             </div>
             <hr>
-            <div class="text-muted d-flex justify-content-between align-items-center pt-3">
-                <p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
-            </div>
+            <div class="col text-center d-block"><a href="https://www.computingbox.co.uk">Computing:Box</a> © 2024 by <a href="https://git.adcmnetworks.co.uk/alexander.lyall">Alexander Lyall</a> is licensed under <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a><br><img src="https://mirrors.creativecommons.org/presskit/icons/cc.svg" alt="" style="max-width: 1.5em;max-height:1.5em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/by.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/nc.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/sa.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><br><a href="copyright">Copyright Notice</a></div>
+            <div class="text-muted d-flex justify-content-center"></div>
+            <p class="mb-0"><noscript><!-- Matomo Image Tracker-->
+<img referrerpolicy="no-referrer-when-downgrade" src="https://analytics.adcmnetworks.co.uk/matomo.php?idsite=2&amp;rec=1" style="border:0" alt="" />
+    <!-- End Matomo --></noscript>Built for UK Computing Curriculum<br>Powered By ADCM Networks</p>
         </div>
     </footer><!-- End: Footer Multi Column -->
     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
-    <script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
+    <script src="/assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
+    <script src="/assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
+    <script src="/assets/js/hexadecimal.js?h=1d88c5f7da86e237fdac8a16a6958a73"></script>
+    <script src="/assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
+    <script src="/assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
 </body>
 
 </html>

export/and-gate.html

@@ -0,0 +1,220 @@
+<!DOCTYPE html>
+<html data-bs-theme="auto" lang="en" style="background: rgb(45,44,56);">
+
+<head>
+    <meta charset="utf-8">
+<!-- Matomo -->
+<script>
+  var _paq = window._paq = window._paq || [];
+  /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+  _paq.push(["setCookieDomain", "*.www.computingbox.co.uk"]);
+  _paq.push(["setDomains", ["*.www.computingbox.co.uk","*.csbox.mrdaviscsit.uk","*.csbox.mrlyall.co.uk","*.csbox.mrlyall.uk"]]);
+  _paq.push(["enableCrossDomainLinking"]);
+  _paq.push(["disableCookies"]);
+  _paq.push(['trackPageView']);
+  _paq.push(['enableLinkTracking']);
+  (function() {
+    var u="//analytics.adcmnetworks.co.uk/";
+    _paq.push(['setTrackerUrl', u+'matomo.php']);
+    _paq.push(['setSiteId', '2']);
+    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+    g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+  })();
+</script>
+<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="//analytics.adcmnetworks.co.uk/matomo.php?idsite=2&amp;rec=1" style="border:0;" alt="" /></p></noscript>
+<!-- End Matomo Code -->
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
+    <title>AND Gate Simulator - CS:Box</title>
+    <link rel="canonical" href="https://www.computingbox.co.uk/and-gate.html">
+    <meta property="og:url" content="https://www.computingbox.co.uk/and-gate.html">
+    <meta property="og:type" content="website">
+    <meta name="twitter:card" content="summary_large_image">
+    <meta property="og:image" content="https://www.computingbox.co.uk/assets/img/ComputingBox-Logo.webp">
+    <script>
+        (function() {
+
+            // JavaScript snippet handling Dark/Light mode switching
+
+            const getStoredTheme = () => localStorage.getItem('theme');
+            const setStoredTheme = theme => localStorage.setItem('theme', theme);
+            const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
+
+            const getPreferredTheme = () => {
+
+                if (forcedTheme) return forcedTheme;
+
+                const storedTheme = getStoredTheme();
+                if (storedTheme) {
+                    return storedTheme;
+                }
+
+                const pageTheme = document.documentElement.getAttribute('data-bs-theme');
+
+                if (pageTheme) {
+                    return pageTheme;
+                }
+
+                return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+            }
+
+            const setTheme = theme => {
+                if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+                    document.documentElement.setAttribute('data-bs-theme', 'dark');
+                } else {
+                    document.documentElement.setAttribute('data-bs-theme', theme);
+                }
+            }
+
+            setTheme(getPreferredTheme());
+
+            const showActiveTheme = (theme, focus = false) => {
+                const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
+
+                if (!themeSwitchers.length) return;
+
+                document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
+                    element.classList.remove('active');
+                    element.setAttribute('aria-pressed', 'false');
+                });
+
+                for (const themeSwitcher of themeSwitchers) {
+
+                    const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
+
+                    if (btnToActivate) {
+                        btnToActivate.classList.add('active');
+                        btnToActivate.setAttribute('aria-pressed', 'true');
+                    }
+                }
+            }
+
+            window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
+                const storedTheme = getStoredTheme();
+                if (storedTheme !== 'light' && storedTheme !== 'dark') {
+                    setTheme(getPreferredTheme());
+                }
+            });
+
+            window.addEventListener('DOMContentLoaded', () => {
+                showActiveTheme(getPreferredTheme());
+
+                document.querySelectorAll('[data-bs-theme-value]')
+                    .forEach(toggle => {
+                        toggle.addEventListener('click', (e) => {
+                            e.preventDefault();
+                            const theme = toggle.getAttribute('data-bs-theme-value');
+                            setStoredTheme(theme);
+                            setTheme(theme);
+                            showActiveTheme(theme);
+                        })
+                    })
+            });
+        })();
+    </script>
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" media="(prefers-color-scheme: dark)">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" media="(prefers-color-scheme: dark)">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="stylesheet" href="/assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
+    <link rel="stylesheet" href="/assets/css/DSEG7%20Classic%20Regular.css">
+    <link rel="stylesheet" href="/assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
+    <link rel="stylesheet" href="/assets/css/Inter.css?h=60f7751edc3ab55acc7880f1e25e45d3">
+    <link rel="stylesheet" href="/assets/css/Open%20Sans.css?h=ce1e3121e620675940c895d202b884b3">
+    <link rel="stylesheet" href="/assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
+    <link rel="stylesheet" href="/assets/css/bss-overrides.css?h=3dbfe72d968bc29929e6342eb303e930">
+    <link rel="stylesheet" href="/assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
+    <link rel="stylesheet" href="/assets/css/styles.css?h=88201532374cf4b4d8d775d23183d357">
+</head>
+
+<body>
+    <header class="bg-dark">
+        <!-- Start: Site Navigation -->
+        <nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
+            <div class="container"><img src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" style="width: 32px;margin: 5px;" width="32" height="32"><a class="navbar-brand d-flex align-items-center" href="/"><span>Computing:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
+                <div class="collapse navbar-collapse" id="navcol-5">
+                    <ul class="navbar-nav ms-auto">
+                        <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
+                        <li class="nav-item"><a class="nav-link" href="about">About</a></li>
+                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Binary</a>
+                            <div class="dropdown-menu"><a class="dropdown-item" href="unsigned-binary">Unsigned Integers</a><a class="dropdown-item" href="twos-compliment-binary">Two's Compliment</a></div>
+                        </li>
+                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Hexadecimal</a>
+                            <div class="dropdown-menu"><a class="dropdown-item" href="gcse-hexadecimal">GCSE</a><a class="dropdown-item" href="a-level-hexadecimal">A Level</a></div>
+                        </li>
+                        <li class="nav-item"><a class="nav-link" href="hex-colours">Hex Colours</a></li>
+                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link active" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Logic Gates</a>
+                            <div class="dropdown-menu"><a class="dropdown-item" href="not-gate">NOT</a><a class="dropdown-item active" href="and-gate">AND</a><a class="dropdown-item" href="or-gate">OR</a><a class="dropdown-item" href="nor-gate">NOR</a><a class="dropdown-item" href="nand-gate">NAND</a><a class="dropdown-item" href="xor-gate">XOR</a><a class="dropdown-item" href="xnor-gate">XNOR</a></div>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+        </nav><!-- End: Site Navigation -->
+    </header><!-- Start: Hero Banner Color -->
+    <section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
+        <div class="container h-100">
+            <div class="text-white border rounded border-0 p-1 bg-danger">
+                <div class="row h-100">
+                    <div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
+                        <div>
+                            <h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE&nbsp;Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
+                            <p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section><!-- End: Hero Banner Color -->
+    <section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
+        <!-- Start: 1 Row 2 Columns -->
+        <div class="container" style="width: 100%;margin-top: 15px;">
+            <div class="row">
+                <div class="col" style="height: 120px;"></div>
+            </div>
+            <div class="row">
+                <div class="col">
+                    <h1 id="pageHeading" class="simHeading">AND Gate</h1>
+                </div>
+            </div>
+        </div><!-- End: 1 Row 2 Columns -->
+        <!-- Start: 1 Row 3 Columns -->
+        <div class="container">
+            <div class="row">
+                <div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary buttonMiddle logicGateInput1" id="swtInput1" type="button" onclick="toggleInput(1)" style="display: grid;position: relative;transform: translate(58px);">⏼</button><button class="btn btn-primary buttonMiddle logicGateInput2" id="swtInput2" type="button" onclick="toggleInput(2)" style="position: relative;display: grid;">⏼</button><img class="logicGate" src="https://upload.wikimedia.org/wikipedia/commons/thumb/6/64/AND_ANSI.svg/1920px-AND_ANSI.svg.png" width="460" height="240">
+                    <h1 id="blbAndGate" class="poweredOff dualInputSingleOutput">💡<br></h1>
+                </div>
+            </div>
+            <div class="row">
+                <div class="col-auto logicGates centred" style="height: 194px;"><button class="btn btn-primary warning btnReset" id="gateReset" type="button" style="margin-top: 3em;" onclick="resetGate()">Reset</button></div>
+            </div>
+        </div><!-- End: 1 Row 3 Columns -->
+        <div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
+    </section><!-- Start: Footer Multi Column -->
+    <footer style="background: rgb(45,44,56);">
+        <div class="container py-4 py-lg-5">
+            <div class="row justify-content-center">
+                <!-- Start: About Project -->
+                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
+                    <div class="fw-bold d-flex align-items-center mb-2"><img src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" style="width: 32px;margin: 5px;" width="32" height="32"><span>Computing:Box</span></div>
+                    <p class="text-muted">Computing Concept Simulators</p>
+                </div><!-- End: About Project -->
+            </div>
+            <hr>
+            <div class="col text-center d-block"><a href="https://www.computingbox.co.uk">Computing:Box</a> © 2024 by <a href="https://git.adcmnetworks.co.uk/alexander.lyall">Alexander Lyall</a> is licensed under <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a><br><img src="https://mirrors.creativecommons.org/presskit/icons/cc.svg" alt="" style="max-width: 1.5em;max-height:1.5em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/by.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/nc.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/sa.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><br><a href="copyright">Copyright Notice</a></div>
+            <div class="text-muted d-flex justify-content-center"></div>
+            <p class="mb-0"><noscript><!-- Matomo Image Tracker-->
+<img referrerpolicy="no-referrer-when-downgrade" src="https://analytics.adcmnetworks.co.uk/matomo.php?idsite=2&amp;rec=1" style="border:0" alt="" />
+    <!-- End Matomo --></noscript>Built for UK Computing Curriculum<br>Powered By ADCM Networks</p>
+        </div>
+    </footer><!-- End: Footer Multi Column -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
+    <script src="/assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
+    <script src="/assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
+    <script src="/assets/js/hexadecimal.js?h=1d88c5f7da86e237fdac8a16a6958a73"></script>
+    <script src="/assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
+    <script src="/assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
+</body>
+
+</html>

export/assets/css/DSEG7 Classic Regular.css

@@ -0,0 +1,8 @@
+@font-face {
+	font-family: 'DSEG7 Classic Regular';
+	src: url(/assets/fonts/DSEG7ClassicRegular.woff) format('woff'),
+	url(/assets/fonts/DSEG7ClassicRegular.ttf) format('truetype');
+	font-weight: 400;
+	font-style: normal;
+	font-display: auto;
+}

export/assets/css/IEC symbols Unicode.css

@@ -0,0 +1,8 @@
+@font-face {
+	font-family: 'IEC symbols Unicode';
+	src: url(/assets/fonts/IEC%20symbols%20Unicode-7accb483a44c18d55e8700feb3ddc713.woff2?h=f58bcc159dfcde3a8902f3c3e5961248) format('woff2'),
+	url(/assets/fonts/IEC%20symbols%20Unicode-f2f2e5d8588f3b01658e423c74d599be.woff?h=f58bcc159dfcde3a8902f3c3e5961248) format('woff');
+	font-weight: normal;
+	font-style: normal;
+	font-display: swap;
+}

export/assets/css/Inter.css

@@ -0,0 +1,629 @@
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-de58982b96a72dfd9e457f42f13c8def.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 300;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-910d93a8fd7d89ae99ae550bf779b0cb.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 300;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-49d8b8f280231a9679ec1f34d0f177ce.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 300;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+1F00-1FFF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-93de0e0c318ba5fc351ed069a801b791.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 300;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-db78de5246196d0d93187248cbebc6c2.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 300;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-b076fc26c61e86fdfdbd5a3b96aa9a56.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 300;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-990bab229e94ccb55fad37cff3dae646.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 300;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-de58982b96a72dfd9e457f42f13c8def.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 400;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-910d93a8fd7d89ae99ae550bf779b0cb.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 400;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-49d8b8f280231a9679ec1f34d0f177ce.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 400;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+1F00-1FFF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-93de0e0c318ba5fc351ed069a801b791.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 400;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-db78de5246196d0d93187248cbebc6c2.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 400;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-b076fc26c61e86fdfdbd5a3b96aa9a56.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 400;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-990bab229e94ccb55fad37cff3dae646.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 400;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-de58982b96a72dfd9e457f42f13c8def.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 600;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-910d93a8fd7d89ae99ae550bf779b0cb.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 600;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-49d8b8f280231a9679ec1f34d0f177ce.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 600;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+1F00-1FFF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-93de0e0c318ba5fc351ed069a801b791.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 600;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-db78de5246196d0d93187248cbebc6c2.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 600;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-b076fc26c61e86fdfdbd5a3b96aa9a56.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 600;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-990bab229e94ccb55fad37cff3dae646.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 600;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-de58982b96a72dfd9e457f42f13c8def.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 700;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-910d93a8fd7d89ae99ae550bf779b0cb.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 700;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-49d8b8f280231a9679ec1f34d0f177ce.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 700;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+1F00-1FFF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-93de0e0c318ba5fc351ed069a801b791.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 700;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-db78de5246196d0d93187248cbebc6c2.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 700;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-b076fc26c61e86fdfdbd5a3b96aa9a56.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 700;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-990bab229e94ccb55fad37cff3dae646.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 700;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-de58982b96a72dfd9e457f42f13c8def.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 800;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-910d93a8fd7d89ae99ae550bf779b0cb.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 800;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-49d8b8f280231a9679ec1f34d0f177ce.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 800;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+1F00-1FFF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-93de0e0c318ba5fc351ed069a801b791.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 800;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-db78de5246196d0d93187248cbebc6c2.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 800;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-b076fc26c61e86fdfdbd5a3b96aa9a56.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 800;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-990bab229e94ccb55fad37cff3dae646.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 800;
+	font-style: italic;
+	font-display: swap;
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-69ef5cde33d6fd526d060fcf78a34c88.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 300;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-2cb61e24915ad23d81f18cd8849def8c.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 300;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-deeb3bf9a981d6a5c32705d435675328.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 300;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+1F00-1FFF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-e1e86f846d97ba2bd5de747adfc78049.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 300;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-aa0964911973a0fbaf081bae32a490f3.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 300;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-2083c91140e7bbb7db951151ac57a155.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 300;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-19884df4a8102ca66ed497ef7f549816.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 300;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-69ef5cde33d6fd526d060fcf78a34c88.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 400;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-2cb61e24915ad23d81f18cd8849def8c.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 400;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-deeb3bf9a981d6a5c32705d435675328.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 400;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+1F00-1FFF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-e1e86f846d97ba2bd5de747adfc78049.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 400;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-aa0964911973a0fbaf081bae32a490f3.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 400;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-2083c91140e7bbb7db951151ac57a155.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 400;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-19884df4a8102ca66ed497ef7f549816.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 400;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-69ef5cde33d6fd526d060fcf78a34c88.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 600;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-2cb61e24915ad23d81f18cd8849def8c.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 600;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-deeb3bf9a981d6a5c32705d435675328.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 600;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+1F00-1FFF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-e1e86f846d97ba2bd5de747adfc78049.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 600;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-aa0964911973a0fbaf081bae32a490f3.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 600;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-2083c91140e7bbb7db951151ac57a155.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 600;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-19884df4a8102ca66ed497ef7f549816.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 600;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-69ef5cde33d6fd526d060fcf78a34c88.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 700;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-2cb61e24915ad23d81f18cd8849def8c.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 700;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-deeb3bf9a981d6a5c32705d435675328.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 700;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+1F00-1FFF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-e1e86f846d97ba2bd5de747adfc78049.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 700;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-aa0964911973a0fbaf081bae32a490f3.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 700;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-2083c91140e7bbb7db951151ac57a155.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 700;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-19884df4a8102ca66ed497ef7f549816.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 700;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-69ef5cde33d6fd526d060fcf78a34c88.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 800;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-2cb61e24915ad23d81f18cd8849def8c.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 800;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-deeb3bf9a981d6a5c32705d435675328.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 800;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+1F00-1FFF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-e1e86f846d97ba2bd5de747adfc78049.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 800;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-aa0964911973a0fbaf081bae32a490f3.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 800;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-2083c91140e7bbb7db951151ac57a155.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 800;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+@font-face {
+	font-family: 'Inter';
+	src: url(/assets/fonts/Inter-19884df4a8102ca66ed497ef7f549816.woff2?h=60f7751edc3ab55acc7880f1e25e45d3) format('woff2');
+	font-weight: 800;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}

export/assets/css/Open Sans.css

@@ -0,0 +1,89 @@
+@font-face {
+	font-family: 'Open Sans';
+	src: url(/assets/fonts/Open%20Sans-6dec32ba32c583143f37e96a59e0fb9e.woff2?h=ce1e3121e620675940c895d202b884b3) format('woff2');
+	font-weight: 400;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
+}
+
+@font-face {
+	font-family: 'Open Sans';
+	src: url(/assets/fonts/Open%20Sans-225b7d18262c1041a32b79d200e92bf1.woff2?h=ce1e3121e620675940c895d202b884b3) format('woff2');
+	font-weight: 400;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
+}
+
+@font-face {
+	font-family: 'Open Sans';
+	src: url(/assets/fonts/Open%20Sans-dea7e20916bef72920c929acfb3a4641.woff2?h=ce1e3121e620675940c895d202b884b3) format('woff2');
+	font-weight: 400;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+1F00-1FFF;
+}
+
+@font-face {
+	font-family: 'Open Sans';
+	src: url(/assets/fonts/Open%20Sans-15e68f85ff378c85165faa90038c1c34.woff2?h=ce1e3121e620675940c895d202b884b3) format('woff2');
+	font-weight: 400;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
+}
+
+@font-face {
+	font-family: 'Open Sans';
+	src: url(/assets/fonts/Open%20Sans-5e916bd22ed9429b9b6c1e583e7e3bac.woff2?h=ce1e3121e620675940c895d202b884b3) format('woff2');
+	font-weight: 400;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
+}
+
+@font-face {
+	font-family: 'Open Sans';
+	src: url(/assets/fonts/Open%20Sans-fab2dc2a64560c0036fff6d74173d2fe.woff2?h=ce1e3121e620675940c895d202b884b3) format('woff2');
+	font-weight: 400;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0310, U+0312, U+0315, U+031A, U+0326-0327, U+032C, U+032F-0330, U+0332-0333, U+0338, U+033A, U+0346, U+034D, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2016-2017, U+2034-2038, U+203C, U+2040, U+2043, U+2047, U+2050, U+2057, U+205F, U+2070-2071, U+2074-208E, U+2090-209C, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2100-2112, U+2114-2115, U+2117-2121, U+2123-214F, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B7, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+3030, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;
+}
+
+@font-face {
+	font-family: 'Open Sans';
+	src: url(/assets/fonts/Open%20Sans-92fcb6995c062a9e725f088d0a4946e3.woff2?h=ce1e3121e620675940c895d202b884b3) format('woff2');
+	font-weight: 400;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8BB, U+1F8C0-1F8C1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA89, U+1FA8F-1FAC6, U+1FACE-1FADC, U+1FADF-1FAE9, U+1FAF0-1FAF8, U+1FB00-1FBFF;
+}
+
+@font-face {
+	font-family: 'Open Sans';
+	src: url(/assets/fonts/Open%20Sans-698c10e372a42d57247ac8e1ba5de182.woff2?h=ce1e3121e620675940c895d202b884b3) format('woff2');
+	font-weight: 400;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
+}
+
+@font-face {
+	font-family: 'Open Sans';
+	src: url(/assets/fonts/Open%20Sans-68df54b884d8032b226b60b2de0d3d9f.woff2?h=ce1e3121e620675940c895d202b884b3) format('woff2');
+	font-weight: 400;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+
+@font-face {
+	font-family: 'Open Sans';
+	src: url(/assets/fonts/Open%20Sans-d839b7fe1395f21cd350be1b26d80cfc.woff2?h=ce1e3121e620675940c895d202b884b3) format('woff2');
+	font-weight: 400;
+	font-style: normal;
+	font-display: swap;
+	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}

export/assets/css/Seven Segment.css

@@ -0,0 +1,8 @@
+@font-face {
+	font-family: 'Seven Segment';
+	src: url(/assets/fonts/Seven%20Segment-2949e811e8b49e67e29f877a915145a4.woff2?h=f58bcc159dfcde3a8902f3c3e5961248) format('woff2'),
+	url(/assets/fonts/Seven%20Segment-4bffe92707a7a725aa309b14ed55c43e.woff?h=f58bcc159dfcde3a8902f3c3e5961248) format('woff');
+	font-weight: normal;
+	font-style: normal;
+	font-display: swap;
+}

export/assets/css/Slider-Range.css

@@ -0,0 +1,29 @@
+.slidecontainer {
+  width: 100%;
+}
+
+.slider {
+  -webkit-appearance: none;
+  width: 100%;
+  height: 25px;
+  background: #d3d3d3;
+  outline: none;
+  opacity: 0.7;
+  -webkit-transition: .2s;
+  transition: opacity .2s;
+}
+
+.slider:hover {
+  opacity: 1;
+}
+
+.customiserButtons {
+  background-color: var(--bs-btn-active-bg) !important;
+  border-color: var(--bs-btn-active-border-color) !important;
+}
+
+.customiserButtons:hover {
+  background-color: #198754 !important;
+  border-color: #198754 !important;
+}
+

export/assets/css/bss-overrides.css

@@ -0,0 +1,113 @@
+:root, [data-bs-theme=light] {
+  --bs-body-bg: rgb(39,38,46);
+  --bs-body-bg-rgb: 39,38,46;
+  --bs-link-color: #ffffff;
+  --bs-link-color-rgb: 255,255,255;
+  --bs-link-hover-color: #19f5aa;
+  --bs-link-hover-color-rgb: 25,245,170;
+}
+
+[data-bs-theme=dark] {
+  --bs-link-color: #ffffff;
+  --bs-link-color-rgb: 255,255,255;
+  --bs-link-hover-color: #19f5aa;
+  --bs-link-hover-color-rgb: 25,245,170;
+}
+
+.mx-auto {
+  margin-right: auto !important;
+  margin-left: auto !important;
+}
+
+.mb-0 {
+  margin-bottom: 0 !important;
+}
+
+.mb-2 {
+  margin-bottom: .5rem !important;
+}
+
+.mb-3 {
+  margin-bottom: 1rem !important;
+}
+
+.mb-4 {
+  margin-bottom: 1.5rem !important;
+}
+
+.mb-5 {
+  margin-bottom: 3rem !important;
+}
+
+.ms-auto {
+  margin-left: auto !important;
+}
+
+.p-1 {
+  padding: .25rem !important;
+}
+
+.p-5 {
+  padding: 3rem !important;
+}
+
+.px-4 {
+  padding-right: 1.5rem !important;
+  padding-left: 1.5rem !important;
+}
+
+.py-3 {
+  padding-top: 1rem !important;
+  padding-bottom: 1rem !important;
+}
+
+.py-4 {
+  padding-top: 1.5rem !important;
+  padding-bottom: 1.5rem !important;
+}
+
+.py-5 {
+  padding-top: 3rem !important;
+  padding-bottom: 3rem !important;
+}
+
+@media (min-width: 768px) {
+  .px-md-5 {
+    padding-left: 3rem !important;
+    padding-right: 3rem !important;
+  }
+}
+
+@media (min-width: 992px) {
+  .mx-lg-5 {
+    margin-left: 3rem !important;
+    margin-right: 3rem !important;
+  }
+}
+
+@media (min-width: 992px) {
+  .mb-lg-5 {
+    margin-bottom: 3rem !important;
+  }
+}
+
+@media (min-width: 992px) {
+  .p-lg-5 {
+    padding: 3rem !important;
+  }
+}
+
+@media (min-width: 992px) {
+  .py-lg-5 {
+    padding-top: 3rem !important;
+    padding-bottom: 3rem !important;
+  }
+}
+
+@media (min-width: 1200px) {
+  .py-xl-5 {
+    padding-top: 3rem !important;
+    padding-bottom: 3rem !important;
+  }
+}
+

export/assets/css/styles.css

@@ -0,0 +1,559 @@
+html {
+  background: #000000;
+  color: rgb(255,255,255);
+  --bs-primary: #dc3545;
+  --bs-primary-rgb: 220,53,69;
+  --bs-secondary: #198754;
+  --bs-secondary-rgb: 25,135,84;
+}
+
+.btn-primary, .btn-primary:focus {
+  color: #fff;
+  background-color: #dc3545;
+  border-color: #dc3545;
+  border-radius: 6px;
+  padding: 6px 12px;
+}
+
+.btn:hover, .btn-primary:hover {
+  background-color: #0d6efd;
+  border-color: #ffc107;
+}
+
+.btnActive, .btnActive:focus {
+  color: #fff;
+  background-color: #198754;
+  border-color: #198754;
+}
+
+.poweredOn {
+  filter: opacity(100%);
+}
+
+.poweredOff {
+  filter: opacity(5%);
+}
+
+.overlay {
+  transition: .5s ease;
+  height: 100px;
+  width: 100px;
+  opacity: 1;
+}
+
+.overlay:hover {
+  opacity: 0;
+}
+
+.central {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.centred {
+  opacity: 1;
+  margin: auto;
+}
+
+.reset {
+  background-image: url("/assets/img/BitBoxLogo.png?h=a50b3ddb5614299b0c00dd4f01bc402e");
+  height: 100px;
+  width: 100px;
+}
+
+.homeIcon:hover {
+  opacity: 1;
+}
+
+.homeIcon {
+  width: 100px;
+  height: 100px;
+  opacity: 0.25;
+  transition: .5s ease;
+}
+
+.warning {
+  background-color: #ffc107;
+  border-color: #ffc107;
+  margin-top: 10px;
+  text-align: center;
+  margin-bottom: 10px;
+}
+
+.warning:hover {
+  background-color: #dc3545;
+  border-color: #dc3545;
+  margin-top: 10px;
+  text-align: center;
+  margin-bottom: 10px;
+}
+
+.bulb-text {
+  text-align: center;
+  font-size: 40px;
+  font-family: 'Seven Segment Regular';
+  position: relative;
+  opacity: 0.75;
+  z-index: 2;
+}
+
+.stacked {
+  position: relative;
+  height: 110px;
+}
+
+.bulbs {
+  text-align: center;
+  font-size: 48px;
+  opacity: 0;
+  /*position: absolute;*/
+  /*margin-top: 1em;*/
+  /*left: 50%;*/
+  /*-webkit-transform: translate(-50%, -50%);*/
+  /*z-index: 1;*/
+}
+
+.bulb-div {
+  position: relative;
+  top: 0;
+  left: 0;
+}
+
+.buttonMiddle {
+  font-size: xx-large;
+  font-family: 'IEC symbols Unicode';
+  height: 62px;
+}
+
+table .high-toggle {
+  padding-bottom: 0px;
+}
+
+table .mid-toggle {
+  padding-top: 0px;
+}
+
+table .stacked {
+  width: 11%;
+}
+
+.btnUp {
+  border-bottom-right-radius: 0;
+  border-bottom-left-radius: 0;
+  margin-top: 10px;
+  text-align: center;
+  margin-bottom: 0px;
+}
+
+.btnDown {
+  margin-top: 0px;
+  text-align: center;
+  margin-bottom: 10px;
+  border-top-left-radius: 0;
+  border-top-right-radius: 0;
+}
+
+.btnUp svg, .btnDown svg {
+  font-size: 5em;
+}
+
+.simHeading {
+  font-family: 'Seven Segment';
+  text-align: center;
+}
+
+.simData {
+  text-align: center;
+  color: #10ff00;
+  font-family: 'DSEG7 Classic Regular';
+  white-space: nowrap;
+}
+
+.simColumns {
+  text-align: center;
+  font-family: 'DSEG7 Classic Regular';
+  color: rgb(255,255,255);
+}
+
+.btnReset {
+  margin-top: 10px;
+  text-align: center;
+  margin-bottom: 10px;
+}
+
+.bs-icon {
+  --bs-icon-size: .75rem;
+  display: flex;
+  flex-shrink: 0;
+  justify-content: center;
+  align-items: center;
+  font-size: var(--bs-icon-size);
+  width: calc(var(--bs-icon-size) * 2);
+  height: calc(var(--bs-icon-size) * 2);
+  color: var(--bs-primary);
+}
+
+.bs-icon-xs {
+  --bs-icon-size: 1rem;
+  width: calc(var(--bs-icon-size) * 1.5);
+  height: calc(var(--bs-icon-size) * 1.5);
+}
+
+.bs-icon-sm {
+  --bs-icon-size: 1rem;
+}
+
+.bs-icon-md {
+  --bs-icon-size: 1.5rem;
+}
+
+.bs-icon-lg {
+  --bs-icon-size: 2rem;
+}
+
+.bs-icon-xl {
+  --bs-icon-size: 2.5rem;
+}
+
+.bs-icon.bs-icon-primary {
+  color: var(--bs-white);
+  background: var(--bs-primary);
+}
+
+.bs-icon.bs-icon-primary-light {
+  color: var(--bs-primary);
+  background: rgba(var(--bs-primary-rgb), .2);
+}
+
+.bs-icon.bs-icon-semi-white {
+  color: var(--bs-primary);
+  background: rgba(255, 255, 255, .5);
+}
+
+.bs-icon.bs-icon-rounded {
+  border-radius: .5rem;
+}
+
+.bs-icon.bs-icon-circle {
+  border-radius: 50%;
+}
+
+.dropdown-menu {
+  opacity: 0;
+  transform: translateY(2rem);
+  transition: transform 0.5s;
+}
+
+.dropdown:hover > .dropdown-menu {
+  opacity: 1;
+  transform: translateY(-2px);
+  transition: opacity 0.5s, transform 0.5s;
+}
+
+.introP {
+  margin-bottom: 1rem !important;
+}
+
+.completeFeatures {
+  font-weight: bold;
+  color: rgb(25,245,170);
+  margin-bottom: 0px;
+}
+
+.hexColourToggles {
+  margin-right: 5em;
+  display: inline-grid;
+}
+
+.hexColourTogglesEnd {
+  display: inline-grid;
+}
+
+.resetButton {
+  font-weight: 600;
+  color: black;
+  text-align: center;
+  position: absolute;
+  top: 25%;
+  left: 50%;
+  -webkit-transform: translate(-50%, -50%);
+  -ms-transform: translate(-50%, -50%);
+  transform: translate(-50%);
+}
+
+.resetIcon {
+  z-index: -1;
+}
+
+.bottomSpacer {
+  height: 12px;
+}
+
+.spacer {
+  height: 56px;
+}
+
+.binaryButtons {
+  margin: auto;
+  display: flex;
+  height: 38px;
+}
+
+.hexColourButtons {
+  margin: auto;
+  display: flex;
+  height: 38px;
+  margin-top: 10px;
+}
+
+.logicGateInput2 {
+  float: left;
+  margin-top: 4em;
+}
+
+.logicGateInput1 {
+  float: left;
+  margin-top: 1.5em;
+}
+
+.logicGateOutput {
+}
+
+.logicGate {
+  filter: invert(100%);
+  margin: auto;
+  padding: 10px;
+  height: 15em;
+  float: left;
+}
+
+.oneInputRows {
+  display: inline-flex;
+  vertical-align: middle;
+  justify-content: right;
+  height: 75px;
+}
+
+.twoInputRows {
+  display: inline-flex;
+  vertical-align: middle;
+  justify-content: right;
+  margin-top: 30px;
+}
+
+.singleInputSingleOutput {
+  text-align: left;
+  font-size: 72px;
+  width: 20%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  float: left;
+  margin-top: 90px;
+  margin-left: -90px;
+}
+
+.dualInputSingleOutput {
+  text-align: left;
+  font-size: 5em;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  float: left;
+  margin-top: .90em;
+  margin-left: -0.5em;
+}
+
+.tableCells {
+  width: 110px;
+}
+
+.social-media {
+  font-size: 25px;
+  display: grid;
+  margin: auto;
+}
+
+a:hover {
+  color: var(--bs-success);
+}
+
+a {
+  color: #ffffff;
+}
+
+#mainNav.navbar-dark .navbar-nav > li.nav-item > a.nav-link:hover, #mainNav.navbar-dark .navbar-nav > li.nav-item > a.nav-link:focus {
+  color: #19f5aa;
+}
+
+#mainNav.navbar-dark .navbar-nav > li.nav-item > a.nav-link {
+  color: #fff;
+}
+
+#mainNav .navbar-nav > li.nav-item > a.nav-link.active {
+  font-weight: 700 !important;
+  color: #19f5aa;
+}
+
+.dropdown-item.active, .dropdown-item:active {
+  color: #19f5aa!important;
+  text-decoration: none;
+  background-color: rgb(45, 44, 56);
+}
+
+.dropdown-item:hover, .dropdown-item:focus {
+  color: #19f5aa;
+  background-color: var(--bs-dropdown-link-hover-bg);
+}
+
+.vertical-center {
+  transform: rotate(-90deg);
+  -ms-transform: translateY(-50%);
+  top: 50%;
+  margin: auto;
+  position: relative;
+  width: 8em;
+}
+
+.hexSliders {
+  height: 150px;
+}
+
+.hexadecimalButtons {
+  margin: 0.5em auto 0.5em auto;
+  display: flex;
+  height: 38px;
+}
+
+.cc-nc:before {
+  background-image: url(https://creativecommons.org/wp-content/themes/vocabulary-theme/vocabulary/svg/cc/icons/cc-icons.svg#cc-nc);
+  float: left;
+  margin-left: -2.5em;
+  filter: invert(100%);
+}
+
+.cc-by:before {
+  background-image: url(https://creativecommons.org/wp-content/themes/vocabulary-theme/vocabulary/svg/cc/icons/cc-icons.svg#cc-by);
+  float: left;
+  margin-left: -2.5em;
+  filter: invert(100%);
+}
+
+li {
+  display: list-item;
+  unicode-bidi: isolate;
+}
+
+.cc-terms ul > li:before {
+  background-repeat: no-repeat;
+  background-size: contain;
+  content: "";
+  height: 2em;
+  width: 2em;
+}
+
+.cc-terms ul > li {
+  padding-left: 2.5em;
+  clear: both;
+  list-style: none;
+  margin-bottom: 2em;
+  min-height: 2em;
+}
+
+.cc-terms ul {
+  padding: 0;
+  font-size: 1.5rem;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 150%;
+  margin: 0 0 2em 2em;
+}
+
+ul {
+  display: block;
+  margin-block-start: 1em;
+  margin-block-end: 1em;
+  padding-inline-start: 40px;
+  unicode-bidi: isolate;
+}
+
+.cc-sa:before {
+  background-image: url(https://creativecommons.org/wp-content/themes/vocabulary-theme/vocabulary/svg/cc/icons/cc-icons.svg#cc-sa);
+  float: left;
+  margin-left: -2.5em;
+  filter: invert(100%);
+}
+
+.cc-terms a:hover {
+  color: var(--bs-warning);
+}
+
+.cc-terms a {
+  text-decoration: underline;
+  color: var(--bs-success);
+}
+
+.cc-terms p {
+  margin-bottom: 2em;
+  font-size: 1.5em;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 150%;
+}
+
+.cc-terms h1 {
+  box-sizing: border-box;
+  text-transform: none;
+  margin: 0.2em 0;
+  order: 2;
+  width: 100%;
+  margin-top: .39em;
+  margin-bottom: 0;
+  grid: 0 / auto;
+  font-size: 3.56em;
+  font-style: normal;
+  font-weight: 700;
+}
+
+.cc-heading h1 {
+  box-sizing: border-box;
+  text-transform: none;
+  margin: 0.2em 0;
+  order: 2;
+  width: 100%;
+  margin-top: .39em;
+  margin-bottom: 0;
+  grid: 0 / auto;
+  font-size: 3.56em;
+  font-style: normal;
+  font-weight: 700;
+}
+
+.cc-terms h2 {
+  width: 100%;
+  box-sizing: border-box;
+  font-style: normal;
+  font-weight: 700;
+  font-size: 2.1em;
+  text-transform: none;
+}
+
+.cc-heading h2 {
+  width: 100%;
+  box-sizing: border-box;
+  font-style: normal;
+  font-weight: 700;
+  font-size: 2.1em;
+  text-transform: none;
+}
+
+.alert p {
+  margin-bottom: 0px;
+}
+
+.cc-heading p {
+  margin-top: 16px;
+  margin-bottom: 0px;
+}
+

export/assets/js/binary.js

@@ -0,0 +1,210 @@
+// ** Check if the filename contains "binary" **
+if (window.location.pathname.includes('binary')) {
+
+    let denary = 0;
+    let bits = {
+        '-128': false,
+        '1': false,
+        '2': false,
+        '4': false,
+        '8': false,
+        '16': false,
+        '32': false,
+        '64': false,
+        '128': false
+    };
+
+    let bitValues = [];
+    const twosComplementCheck = document.getElementById("blbN128");
+
+    // ** Initialize the bit values on page load **
+    function initialize() {
+        setBitValues(); // Set the bit values dynamically
+        resetBinarySimulator(); // Reset the simulator to the initial state
+    }
+
+    // ** Dynamically set bit values based on 2's complement mode **
+    function setBitValues() {
+        bitValues = twosComplementCheck 
+            ? [-128, 64, 32, 16, 8, 4, 2, 1] 
+            : [128, 64, 32, 16, 8, 4, 2, 1];
+    }
+
+    // ** Helper function to toggle power for a specific bit **
+    function togglePower(bitValue, isActive) {
+        const bitId = bitValue < 0 ? `N${Math.abs(bitValue)}` : bitValue;
+        const bulb = document.getElementById(`blb${bitId}`);
+        const switchBtn = document.getElementById(`swt${bitId}`);
+        if (bulb && switchBtn) {
+            bulb.classList.toggle('poweredOn', isActive);
+            bulb.classList.toggle('poweredOff', !isActive);
+            switchBtn.classList.toggle('btnActive', isActive);
+        }
+    }
+
+    // ** Reset all bits and denary **
+    function resetBinarySimulator() {
+        Object.keys(bits).forEach(bit => {
+            togglePower(parseInt(bit, 10), false);
+            bits[bit] = false;
+        });
+        denary = 0;
+        updateBinary();
+    }
+
+    // ** Toggle a specific bit **
+    function changeBit(bitValue) {
+        const key = getBitKey(bitValue);
+        const isActive = bits[key];
+        togglePower(bitValue, !isActive);
+        bits[key] = !isActive;
+        denary += isActive ? -bitValue : bitValue;
+        updateBinary();
+    }
+
+    // ** Update binary string and denary display **
+    function updateBinary() {
+        const binary = bitValues.map(bit => (bits[getBitKey(bit)] ? '1' : '0')).join('');
+        document.getElementById("denaryNumber").innerText = denary;
+        document.getElementById("binaryNumber").innerText = binary;
+    }
+
+    // ** Parse a custom binary string and set bits accordingly **
+    function customBinaryParser(binaryPattern) {
+        resetBinarySimulator();
+        binaryPattern = binaryPattern.padStart(8, '0'); // Ensure 8-bit format
+        binaryPattern.split('').forEach((bit, index) => {
+            if (bit === '1') {
+                changeBit(bitValues[index]);
+            }
+        });
+    }
+
+    // ** Parse a custom denary value and set bits accordingly **
+    function customDenaryParser(customDenary) {
+        const min = twosComplementCheck ? -128 : 0;
+        const max = twosComplementCheck ? 127 : 255;
+
+        if (customDenary === null) {
+            customDenary = 0; // Default to 0 if user cancels input
+        }
+
+        if (customDenary < min || customDenary > max) {
+            alert(`Invalid input! Please enter a denary value between ${min} and ${max}.`);
+            return requestDenary(); // Prompt user again
+        }
+
+        resetBinarySimulator();
+        if (twosComplementCheck && customDenary < 0) {
+            let absDenary = Math.abs(customDenary);
+            if (customDenary === -128) {
+                changeBit(-128);
+            } else {
+                bitValues.forEach(bit => {
+                    if (absDenary >= Math.abs(bit)) {
+                        changeBit(bit);
+                        absDenary -= Math.abs(bit);
+                    }
+                });
+                twosComplementFlip();
+            }
+        } else {
+            bitValues.forEach(bit => {
+                if (customDenary >= Math.abs(bit)) {
+                    changeBit(bit);
+                    customDenary -= Math.abs(bit);
+                }
+            });
+        }
+    }
+
+    // ** Handle logical binary shifting (left or right) **
+    function shiftBinary(direction) {
+        const binaryString = document.getElementById("binaryNumber").innerText;
+        let shiftedBinary;
+        if (direction === 'left') {
+            shiftedBinary = binaryString.slice(1) + '0';
+        } else if (direction === 'right') {
+            shiftedBinary = '0' + binaryString.slice(0, -1);
+        }
+        customBinaryParser(shiftedBinary);
+    }
+
+    // ** Handle arithmetic shifting for 2's complement **
+    function shiftTwosComplement(direction) {
+        const binaryString = document.getElementById("binaryNumber").innerText;
+        let shiftedBinary;
+        if (direction === 'left') {
+            shiftedBinary = binaryString.slice(1) + '0';
+        } else if (direction === 'right') {
+            shiftedBinary = binaryString[0] + binaryString.slice(0, -1);
+        }
+        customBinaryParser(shiftedBinary);
+    }
+
+    // ** Flip binary bits for 2's complement **
+    function twosComplementFlip() {
+        let binary = document.getElementById("binaryNumber").innerText;
+        const flippedBinary = binary.split('').map(bit => (bit === '1' ? '0' : '1')).join('');
+        const result = addBinaryNumbers(flippedBinary, '00000001');
+        customBinaryParser(result.binaryResult);
+    }
+
+    // ** Add two binary numbers **
+    function addBinaryNumbers(binary1, binary2) {
+        let carry = 0;
+        let result = '';
+        for (let i = 7; i >= 0; i--) {
+            const bit1 = parseInt(binary1[i], 10) || 0;
+            const bit2 = parseInt(binary2[i], 10) || 0;
+            const sum = bit1 + bit2 + carry;
+            result = (sum % 2) + result;
+            carry = Math.floor(sum / 2);
+        }
+        return { binaryResult: result.slice(-8), overflow: carry ? '1' : '0' };
+    }
+
+    // ** Helper to normalize bit keys **
+    function getBitKey(bitValue) {
+        return bitValue < 0 ? `N${Math.abs(bitValue)}` : bitValue.toString();
+    }
+
+    // ** Request binary input from user **
+    function requestBinary() {
+        let binary;
+        do {
+            binary = prompt("Please enter an 8-bit Binary Value (only 0s and 1s are allowed):");
+            if (binary === null) {
+                binary = "00000000"; // Default to 0 if user cancels input
+                break;
+            }
+            if (!/^[01]{1,8}$/.test(binary)) {
+                alert("Invalid input! Binary values must be up to 8 digits long and only contain 0 or 1.");
+            }
+        } while (!/^[01]{1,8}$/.test(binary));
+        customBinaryParser(binary);
+    }
+
+    // ** Request denary input from user **
+    function requestDenary() {
+        let customDenary;
+        const min = twosComplementCheck ? -128 : 0;
+        const max = twosComplementCheck ? 127 : 255;
+
+        do {
+            customDenary = prompt(`Enter a Denary Value (${min} to ${max}):`);
+            if (customDenary === null) {
+                customDenary = 0; // Default to 0 if user cancels input
+                break;
+            }
+            customDenary = parseInt(customDenary, 10);
+            if (isNaN(customDenary) || customDenary < min || customDenary > max) {
+                alert(`Invalid input! Please enter a denary value between ${min} and ${max}.`);
+            }
+        } while (isNaN(customDenary) || customDenary < min || customDenary > max);
+        customDenaryParser(customDenary);
+    }
+
+    // ** On page load, initialize the simulator **
+    document.addEventListener("DOMContentLoaded", initialize);
+}

export/assets/js/boldAndDark.js

@@ -0,0 +1,61 @@
+(function() {
+  "use strict"; // Start of use strict
+
+  function initParallax() {
+
+    if (!('requestAnimationFrame' in window)) return;
+    if (/Mobile|Android/.test(navigator.userAgent)) return;
+
+    var parallaxItems = document.querySelectorAll('[data-bss-parallax]');
+
+    if (!parallaxItems.length) return;
+
+    var defaultSpeed = 0.5;
+    var visible = [];
+    var scheduled;
+
+    window.addEventListener('scroll', scroll);
+    window.addEventListener('resize', scroll);
+
+    scroll();
+
+    function scroll() {
+
+      visible.length = 0;
+
+      for (var i = 0; i < parallaxItems.length; i++) {
+        var rect = parallaxItems[i].getBoundingClientRect();
+        var speed = parseFloat(parallaxItems[i].getAttribute('data-bss-parallax-speed'), 10) || defaultSpeed;
+
+        if (rect.bottom > 0 && rect.top < window.innerHeight) {
+          visible.push({
+            speed: speed,
+            node: parallaxItems[i]
+          });
+        }
+
+      }
+
+      cancelAnimationFrame(scheduled);
+
+      if (visible.length) {
+        scheduled = requestAnimationFrame(update);
+      }
+
+    }
+
+    function update() {
+
+      for (var i = 0; i < visible.length; i++) {
+        var node = visible[i].node;
+        var speed = visible[i].speed;
+
+        node.style.transform = 'translate3d(0, ' + (-window.scrollY * speed) + 'px, 0)';
+      }
+
+    }
+  }
+
+  initParallax();
+})(); // End of use strict
+

export/assets/js/hexColours.js

@@ -0,0 +1,113 @@
+const LIGHT_MULTIPLIER = 100 / 15;
+const COLORS = ['R', 'G', 'B'];
+const PLACES = [1, 16];
+
+let denary = 0;
+let redDenary = 0;
+let greenDenary = 0;
+let blueDenary = 0;
+let redBinary = "";
+let greenBinary = "";
+let blueBinary = "";
+let hexadecimal = "";
+
+const places = {
+    R16: 0, R1: 0,
+    G16: 0, G1: 0,
+    B16: 0, B1: 0
+};
+
+function resetColours() {
+    COLORS.forEach(color => {
+        PLACES.forEach(place => {
+            resetPlace(color, place);
+        });
+    });
+}
+
+function resetPlace(color, place) {
+    const placeKey = `${color}${place}`;
+    places[placeKey] = 0;
+    const light = (LIGHT_MULTIPLIER * places[placeKey]) / 100;
+    document.getElementById(`blb${placeKey}`).style.opacity = light;
+    updateColours();
+}
+
+function togglePlace(color, place, direction) {
+    const placeKey = `${color}${place}`;
+    const currentValue = places[placeKey];
+    if ((direction === 'up' && currentValue < 15) || (direction === 'down' && currentValue > 0)) {
+        places[placeKey] += direction === 'up' ? 1 : -1;
+        const light = (LIGHT_MULTIPLIER * places[placeKey]) / 100;
+        document.getElementById(`blb${placeKey}`).style.opacity = light;
+        updateColours();
+    }
+}
+
+function updateColours() {
+    redDenary = (places.R16 * 16) + places.R1;
+    greenDenary = (places.G16 * 16) + places.G1;
+    blueDenary = (places.B16 * 16) + places.B1;
+
+    denary = `${redDenary}, ${greenDenary}, ${blueDenary}`;
+    hexadecimal = `#${convertToHex(places.R16)}${convertToHex(places.R1)}${convertToHex(places.G16)}${convertToHex(places.G1)}${convertToHex(places.B16)}${convertToHex(places.B1)}`;
+
+    redBinary = `${convertToBinary(places.R16)}${convertToBinary(places.R1)}`;
+    greenBinary = `${convertToBinary(places.G16)}${convertToBinary(places.G1)}`;
+    blueBinary = `${convertToBinary(places.B16)}${convertToBinary(places.B1)}`;
+
+    document.getElementById("denaryNumber").innerHTML = denary;
+    document.getElementById("hexadecimalNumber").innerHTML = hexadecimal;
+    document.getElementById("colouredHex").style.backgroundColor = hexadecimal;
+    document.getElementById("invertedHex").style.backgroundColor = invertedHex();
+    document.getElementById("redBinaryNumber").innerHTML = redBinary;
+    document.getElementById("blueBinaryNumber").innerHTML = blueBinary;
+    document.getElementById("greenBinaryNumber").innerHTML = greenBinary;
+}
+
+function invertedHex() {
+    return `#${convertToHex(15 - places.R16)}${convertToHex(15 - places.R1)}${convertToHex(15 - places.G16)}${convertToHex(15 - places.G1)}${convertToHex(15 - places.B16)}${convertToHex(15 - places.B1)}`;
+}
+
+function convertToHex(num) {
+    return num < 10 ? num.toString() : String.fromCharCode(55 + num); // 55 = ASCII offset for A (65) - 10
+}
+
+function convertToBinary(num) {
+    return num.toString(2).padStart(4, '0');
+}
+
+function updateHex(customHex) {
+    if (!customHex) {
+        resetColours();
+    } else {
+        if (customHex.charAt(0) === "#") customHex = customHex.slice(1);
+        if (isHex(customHex) && customHex.length === 6) {
+            customHex.split('').forEach((digit, i) => {
+                const color = COLORS[Math.floor(i / 2)];
+                const place = i % 2 === 0 ? 16 : 1;
+                const placeKey = `${color}${place}`;
+                places[placeKey] = parseInt(digit, 16);
+                const light = (LIGHT_MULTIPLIER * places[placeKey]) / 100;
+                document.getElementById(`blb${placeKey}`).style.opacity = light;
+            });
+            updateColours();
+        } else {
+            alert("Invalid Entry");
+            resetColours();
+        }
+    }
+}
+
+function isHex(str) {
+    return /^[0-9A-Fa-f]+$/.test(str);
+}
+
+function requestHex() {
+    const customHex = prompt("Please enter your Hex Value");
+    updateHex(customHex);
+}
+
+function invertHex() {
+    updateHex(invertedHex());
+}

export/assets/js/hexadecimal.js

@@ -0,0 +1,161 @@
+// Ensure the script only runs if the URL path contains "hexadecimal"
+if (window.location.pathname.includes("hexadecimal")) {
+  const isGCSE = window.location.pathname.includes("gcse-hexadecimal");
+  const hexLength = isGCSE ? 2 : 4;       // GCSE: 2 hex digits, A Level: 4
+  const binaryLength = isGCSE ? 8 : 16;   // GCSE: 8 bits, A Level: 16
+  const maxDenary = isGCSE ? 255 : 65535;
+
+  // Each slider represents a 4-bit nibble (0–15) at a given place value
+  const placeValues = { 1: 0, 16: 0, 256: 0, 4096: 0 };
+  const sliders = {};
+
+  // Order matters: left->right nibble columns
+  const columnValues = isGCSE ? [16, 1] : [4096, 256, 16, 1];
+
+  // Attach event listeners for sliders
+  ["slider1", "slider16", "slider256", "slider4096"].forEach((sliderId) => {
+    const slider = document.getElementById(sliderId);
+    if (slider) {
+      sliders[sliderId] = slider;
+      slider.addEventListener("input", (e) => {
+        e.stopPropagation(); // Prevent event propagation to Bootstrap
+        updatePlace(parseInt(sliderId.replace("slider", ""), 10));
+      });
+    }
+  });
+
+  function updatePlace(place) {
+    const slider = sliders[`slider${place}`];
+    if (!slider) return;
+    placeValues[place] = parseInt(slider.value, 10) || 0;
+    updateNumbers();
+  }
+
+  function updateNumbers() {
+    let denary = 0;
+    let binary = "";
+    let hexadecimal = "";
+
+    columnValues.forEach((column) => {
+      const value = placeValues[column] ?? 0; // nibble 0..15
+      denary += value * column;
+      binary += convertToBinaryNibble(value);
+      hexadecimal += convertToHexDigit(value);
+    });
+
+    // Ensure fixed lengths
+    binary = binary.slice(-binaryLength).padStart(binaryLength, "0");
+    hexadecimal = hexadecimal.slice(-hexLength).padStart(hexLength, "0");
+
+    const binEl = document.getElementById("binaryNumber");
+    const denEl = document.getElementById("denaryNumber");
+    const hexEl = document.getElementById("hexadecimalNumber");
+
+    if (binEl) binEl.innerText = binary;
+    if (denEl) denEl.innerText = denary;
+    if (hexEl) hexEl.innerText = hexadecimal;
+  }
+
+  function convertToBinaryNibble(num) {
+    return num.toString(2).padStart(4, "0");
+  }
+
+  function convertToHexDigit(num) {
+    return num.toString(16).toUpperCase(); // 0..F
+  }
+
+  function setSlidersFromDenary(denary) {
+    // Clamp & normalise
+    denary = Number.isFinite(denary) ? denary : 0;
+    denary = Math.max(0, Math.min(maxDenary, Math.floor(denary)));
+
+    // Convert denary into nibble values for each column
+    columnValues.forEach((column) => {
+      const nibble = Math.floor(denary / column);
+      placeValues[column] = Math.max(0, Math.min(15, nibble));
+      denary -= placeValues[column] * column;
+    });
+
+    // Push values to sliders (if present)
+    columnValues.forEach((column) => {
+      const slider = sliders[`slider${column}`];
+      if (slider) slider.value = placeValues[column];
+    });
+
+    updateNumbers();
+  }
+
+  function cleanHexInput(input) {
+    return String(input)
+      .trim()
+      .replace(/^0x/i, "")
+      .toUpperCase();
+  }
+
+  function cleanBinaryInput(input) {
+    return String(input).trim().replace(/\s+/g, "");
+  }
+
+  // === PUBLIC BUTTON HANDLERS ===
+  // Call these from onclick="" on your buttons
+
+  window.requestHexadecimal = function requestHexadecimal() {
+    const raw = prompt(
+      `Enter a ${hexLength}-digit hexadecimal value (0-9, A-F):`,
+      ""
+    );
+    if (raw === null) return;
+
+    const hex = cleanHexInput(raw);
+
+    const re = new RegExp(`^[0-9A-F]{${hexLength}}$`);
+    if (!re.test(hex)) {
+      alert(`Please enter exactly ${hexLength} hex digit(s) using 0-9 and A-F.`);
+      return;
+    }
+
+    const denary = parseInt(hex, 16);
+    setSlidersFromDenary(denary);
+  };
+
+  window.requestDenaryForHexadecimal =
+    function requestDenaryForHexadecimal() {
+      const raw = prompt(`Enter a denary value (0 to ${maxDenary}):`, "");
+      if (raw === null) return;
+
+      // Allow digits only
+      const cleaned = String(raw).trim();
+      if (!/^\d+$/.test(cleaned)) {
+        alert("Please enter a whole number in denary (digits only).");
+        return;
+      }
+
+      const denary = parseInt(cleaned, 10);
+      if (denary < 0 || denary > maxDenary) {
+        alert(`Please enter a number between 0 and ${maxDenary}.`);
+        return;
+      }
+
+      setSlidersFromDenary(denary);
+    };
+
+  window.requestBinaryforHexadecimal = function requestBinaryforHexadecimal() {
+    const raw = prompt(`Enter a ${binaryLength}-bit binary value (0s and 1s):`, "");
+    if (raw === null) return;
+
+    const bin = cleanBinaryInput(raw);
+
+    const re = new RegExp(`^[01]{${binaryLength}}$`);
+    if (!re.test(bin)) {
+      alert(`Please enter exactly ${binaryLength} bits using only 0 and 1.`);
+      return;
+    }
+
+    const denary = parseInt(bin, 2);
+    setSlidersFromDenary(denary);
+  };
+
+  document.addEventListener("DOMContentLoaded", () => {
+    updateNumbers();
+  });
+}

export/assets/js/logicGates.js

@@ -0,0 +1,105 @@
+let inputs = {
+    input1: false,
+    input2: false
+};
+
+let gateValue = false;
+
+// ** Toggle input (handles both input1 and input2) **
+function toggleInput(inputNumber) {
+    const inputKey = `input${inputNumber}`;
+    inputs[inputKey] = !inputs[inputKey];
+    updateInputState(`swtInput${inputNumber}`, inputs[inputKey]);
+    updateGate();
+}
+
+// ** Update the gate's state based on the current inputs and gate type **
+function updateGate() {
+    const pageHeading = document.getElementById("pageHeading").textContent;
+    gateValue = evaluateGate(pageHeading);
+    updateGateLight(pageHeading, gateValue);
+}
+
+// ** Evaluate the gate logic **
+function evaluateGate(pageHeading) {
+    const { input1, input2 } = inputs;
+
+    switch (pageHeading) {
+        case "AND Gate":
+            return input1 && input2;
+        case "OR Gate":
+            return input1 || input2;
+        case "NOT Gate":
+            return !input1; // NOT gate only uses Input1
+        case "NAND Gate":
+            return !(input1 && input2); // Correct NAND logic
+        case "NOR Gate":
+            return !(input1 || input2);
+        case "XOR Gate":
+            return input1 !== input2; // XOR is true if inputs are different
+        case "XNOR Gate":
+            return input1 === input2; // XNOR is true if inputs are the same
+        default:
+            console.error("Unknown Gate Type");
+            return false;
+    }
+}
+
+// ** Update the lightbulb based on the gate's value **
+function updateGateLight(pageHeading, value) {
+    const lightBulbId = getLightBulbId(pageHeading);
+    const lightBulb = document.getElementById(lightBulbId);
+    if (lightBulb) {
+        lightBulb.classList.toggle("poweredOn", value);
+        lightBulb.classList.toggle("poweredOff", !value);
+    }
+}
+
+// ** Get the correct lightbulb ID based on the gate type **
+function getLightBulbId(pageHeading) {
+    switch (pageHeading) {
+        case "AND Gate":
+            return "blbAndGate";
+        case "OR Gate":
+            return "blbOrGate";
+        case "NOT Gate":
+            return "blbNotGate";
+        case "NAND Gate":
+            return "blbNandGate";
+        case "NOR Gate":
+            return "blbNorGate";
+        case "XOR Gate":
+            return "blbXorGate";
+        case "XNOR Gate":
+            return "blbXnorGate";
+        default:
+            console.error("Unknown Gate Type");
+            return null;
+    }
+}
+
+// ** Update the toggle switch to reflect its active/inactive state **
+function updateInputState(switchId, isActive) {
+    const toggleSwitch = document.getElementById(switchId);
+    if (toggleSwitch) {
+        toggleSwitch.classList.toggle("btnActive", isActive);
+    }
+}
+
+// ** Reset the gate to its default state **
+function resetGate() {
+    inputs.input1 = false;
+    inputs.input2 = false;
+    updateInputState("swtInput1", inputs.input1);
+    updateInputState("swtInput2", inputs.input2);
+
+    const pageHeading = document.getElementById("pageHeading").textContent;
+
+    if (pageHeading === "NOT Gate") {
+        // For NOT Gate, the light should be on by default
+        gateValue = true;
+        updateGateLight(pageHeading, gateValue);
+    } else {
+        updateGate();
+    }
+}

export/binary.html

@@ -0,0 +1,334 @@
+<!DOCTYPE html>
+<html data-bs-theme="auto" lang="en" style="background: rgb(45,44,56);">
+
+<head>
+    <meta charset="utf-8">
+<!-- Matomo -->
+<script>
+  var _paq = window._paq = window._paq || [];
+  /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+  _paq.push(["setCookieDomain", "*.www.computingbox.co.uk"]);
+  _paq.push(["setDomains", ["*.www.computingbox.co.uk","*.csbox.mrdaviscsit.uk","*.csbox.mrlyall.co.uk","*.csbox.mrlyall.uk"]]);
+  _paq.push(["enableCrossDomainLinking"]);
+  _paq.push(["disableCookies"]);
+  _paq.push(['trackPageView']);
+  _paq.push(['enableLinkTracking']);
+  (function() {
+    var u="//analytics.adcmnetworks.co.uk/";
+    _paq.push(['setTrackerUrl', u+'matomo.php']);
+    _paq.push(['setSiteId', '2']);
+    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+    g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+  })();
+</script>
+<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="//analytics.adcmnetworks.co.uk/matomo.php?idsite=2&amp;rec=1" style="border:0;" alt="" /></p></noscript>
+<!-- End Matomo Code -->
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
+    <title>Binary Simulator - CS:Box</title>
+    <link rel="canonical" href="https://www.computingbox.co.uk/binary.html">
+    <meta property="og:url" content="https://www.computingbox.co.uk/binary.html">
+    <meta property="og:type" content="website">
+    <meta name="twitter:card" content="summary_large_image">
+    <meta property="og:image" content="https://www.computingbox.co.uk/assets/img/ComputingBox-Logo.webp">
+    <script>
+        (function() {
+
+            // JavaScript snippet handling Dark/Light mode switching
+
+            const getStoredTheme = () => localStorage.getItem('theme');
+            const setStoredTheme = theme => localStorage.setItem('theme', theme);
+            const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
+
+            const getPreferredTheme = () => {
+
+                if (forcedTheme) return forcedTheme;
+
+                const storedTheme = getStoredTheme();
+                if (storedTheme) {
+                    return storedTheme;
+                }
+
+                const pageTheme = document.documentElement.getAttribute('data-bs-theme');
+
+                if (pageTheme) {
+                    return pageTheme;
+                }
+
+                return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+            }
+
+            const setTheme = theme => {
+                if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+                    document.documentElement.setAttribute('data-bs-theme', 'dark');
+                } else {
+                    document.documentElement.setAttribute('data-bs-theme', theme);
+                }
+            }
+
+            setTheme(getPreferredTheme());
+
+            const showActiveTheme = (theme, focus = false) => {
+                const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
+
+                if (!themeSwitchers.length) return;
+
+                document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
+                    element.classList.remove('active');
+                    element.setAttribute('aria-pressed', 'false');
+                });
+
+                for (const themeSwitcher of themeSwitchers) {
+
+                    const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
+
+                    if (btnToActivate) {
+                        btnToActivate.classList.add('active');
+                        btnToActivate.setAttribute('aria-pressed', 'true');
+                    }
+                }
+            }
+
+            window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
+                const storedTheme = getStoredTheme();
+                if (storedTheme !== 'light' && storedTheme !== 'dark') {
+                    setTheme(getPreferredTheme());
+                }
+            });
+
+            window.addEventListener('DOMContentLoaded', () => {
+                showActiveTheme(getPreferredTheme());
+
+                document.querySelectorAll('[data-bs-theme-value]')
+                    .forEach(toggle => {
+                        toggle.addEventListener('click', (e) => {
+                            e.preventDefault();
+                            const theme = toggle.getAttribute('data-bs-theme-value');
+                            setStoredTheme(theme);
+                            setTheme(theme);
+                            showActiveTheme(theme);
+                        })
+                    })
+            });
+        })();
+    </script>
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" media="(prefers-color-scheme: dark)">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" media="(prefers-color-scheme: dark)">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="stylesheet" href="/assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
+    <link rel="stylesheet" href="/assets/css/DSEG7%20Classic%20Regular.css">
+    <link rel="stylesheet" href="/assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
+    <link rel="stylesheet" href="/assets/css/Inter.css?h=60f7751edc3ab55acc7880f1e25e45d3">
+    <link rel="stylesheet" href="/assets/css/Open%20Sans.css?h=ce1e3121e620675940c895d202b884b3">
+    <link rel="stylesheet" href="/assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
+    <link rel="stylesheet" href="/assets/css/bss-overrides.css?h=3dbfe72d968bc29929e6342eb303e930">
+    <link rel="stylesheet" href="/assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
+    <link rel="stylesheet" href="/assets/css/styles.css?h=88201532374cf4b4d8d775d23183d357">
+</head>
+
+<body>
+    <header class="bg-dark">
+        <!-- Start: Site Navigation -->
+        <nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
+            <div class="container"><img src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>Computing:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
+                <div class="collapse navbar-collapse" id="navcol-5">
+                    <ul class="navbar-nav ms-auto">
+                        <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
+                        <li class="nav-item"><a class="nav-link" href="about">About</a></li>
+                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link active" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Binary</a>
+                            <div class="dropdown-menu"><a class="dropdown-item active" href="unsigned-binary">Unsigned Integers</a><a class="dropdown-item" href="twos-compliment-binary">Two's Compliment</a></div>
+                        </li>
+                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Hexadecimal</a>
+                            <div class="dropdown-menu"><a class="dropdown-item" href="gcse-hexadecimal">GCSE</a><a class="dropdown-item" href="a-level-hexadecimal">A Level</a></div>
+                        </li>
+                        <li class="nav-item"><a class="nav-link" href="hex-colours">Hex Colours</a></li>
+                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Logic Gates</a>
+                            <div class="dropdown-menu"><a class="dropdown-item" href="not-gate">NOT</a><a class="dropdown-item" href="and-gate">AND</a><a class="dropdown-item" href="or-gate">OR</a><a class="dropdown-item" href="nor-gate">NOR</a><a class="dropdown-item" href="nand-gate">NAND</a><a class="dropdown-item" href="xor-gate">XOR</a><a class="dropdown-item" href="xnor-gate">XNOR</a></div>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+        </nav><!-- End: Site Navigation -->
+    </header><!-- Start: Hero Banner Color -->
+    <section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
+        <div class="container h-100">
+            <div class="text-white border rounded border-0 p-1 bg-danger">
+                <div class="row h-100">
+                    <div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
+                        <div>
+                            <h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE&nbsp;Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
+                            <p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section><!-- End: Hero Banner Color -->
+    <section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block" style="background: rgb(39,38,46);">
+        <!-- Start: 1 Row 2 Columns -->
+        <div class="container" style="width: 100%;margin-top: 15px;">
+            <div class="row">
+                <div class="col centred" style="width: 35%;">
+                    <div class="centred reset" style="position: relative;">
+                        <p class="resetButton">Reset bit:box</p>
+                        <div style="position: absolute;"><img class="overlay resetIcon" src="/assets/img/BitBoxLogo.png?h=a50b3ddb5614299b0c00dd4f01bc402e" onclick="resetBinarySimulator()"></div>
+                    </div>
+                    <div class="row">
+                        <div class="col-xl-12 bottomSpacer"></div>
+                    </div>
+                </div>
+                <div class="col-md-6" style="width: 60%;">
+                    <div class="row">
+                        <div class="col">
+                            <h1 class="simHeading">Denary</h1>
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col">
+                            <h1 id="denaryNumber" class="simData">0</h1>
+                        </div>
+                    </div>
+                </div>
+                <div class="col-md-6" style="width: 20%;">
+                    <div class="row">
+                        <div class="col hexadecimalButtons"><button class="btn btn-primary binaryButtons customiserButtons" type="button" onclick="requestBinary()">Custom Binary</button></div>
+                    </div>
+                    <div class="row">
+                        <div class="col hexadecimalButtons"><button class="btn btn-primary binaryButtons customiserButtons" type="button" onclick="requestDenary()">Custom Denary</button></div>
+                    </div>
+                </div>
+            </div>
+            <div class="row">
+                <div class="col centred" style="width: 35%;">
+                    <div class="row">
+                        <div class="col-xl-12 bottomSpacer"></div>
+                    </div>
+                </div>
+                <div class="col-md-6" style="width: 60%;">
+                    <div class="row">
+                        <div class="col">
+                            <h1 class="simHeading">Binary</h1>
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col">
+                            <h1 id="binaryNumber" class="simData">00000000</h1>
+                        </div>
+                    </div>
+                </div>
+                <div class="col-md-6" style="width: 20%;">
+                    <div class="row">
+                        <div class="col hexadecimalButtons"><button class="btn btn-primary binaryButtons customiserButtons" type="button" onclick="shiftBinary(&quot;left&quot;)">Left Shift</button></div>
+                    </div>
+                    <div class="row">
+                        <div class="col hexadecimalButtons"><button class="btn btn-primary binaryButtons customiserButtons" type="button" onclick="shiftBinary(&quot;right&quot;)">Right Shift</button></div>
+                    </div>
+                </div>
+            </div>
+            <div class="row">
+                <div class="col spacer" style="width: 100%;"></div>
+            </div>
+        </div><!-- End: 1 Row 2 Columns -->
+        <div class="container d-xl-flex justify-content-xl-center centred">
+            <div class="text-center d-xl-flex justify-content-xl-center" style="width: 100%;">
+                <table class="table table-borderless">
+                    <thead>
+                        <tr>
+                            <th class="tableCells">
+                                <h1 id="blb128" class="poweredOff" style="text-align: center;font-size: 48px;">💡<br></h1>
+                            </th>
+                            <th class="tableCells">
+                                <h1 id="blb64" class="poweredOff" style="text-align: center;font-size: 48px;">💡<br></h1>
+                            </th>
+                            <th class="tableCells">
+                                <h1 id="blb32" class="poweredOff" style="text-align: center;font-size: 48px;">💡<br></h1>
+                            </th>
+                            <th class="tableCells">
+                                <h1 id="blb16" class="poweredOff" style="text-align: center;font-size: 48px;">💡<br></h1>
+                            </th>
+                            <th class="tableCells">
+                                <h1 id="blb8" class="poweredOff" style="text-align: center;font-size: 48px;">💡<br></h1>
+                            </th>
+                            <th class="tableCells">
+                                <h1 id="blb4" class="poweredOff" style="text-align: center;font-size: 48px;">💡<br></h1>
+                            </th>
+                            <th class="tableCells">
+                                <h1 id="blb2" class="poweredOff" style="text-align: center;font-size: 48px;">💡<br></h1>
+                            </th>
+                            <th class="tableCells">
+                                <h1 id="blb1" class="poweredOff" style="text-align: center;font-size: 48px;">💡</h1>
+                            </th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <tr>
+                            <td class="tableCells">
+                                <h1 id="lbl-msb" class="simColumns">128</h1>
+                            </td>
+                            <td class="tableCells">
+                                <h1 class="simColumns">64</h1>
+                            </td>
+                            <td class="tableCells">
+                                <h1 class="simColumns">32</h1>
+                            </td>
+                            <td class="tableCells">
+                                <h1 class="simColumns">16</h1>
+                            </td>
+                            <td class="tableCells">
+                                <h1 class="simColumns">8</h1>
+                            </td>
+                            <td class="tableCells">
+                                <h1 class="simColumns">4</h1>
+                            </td>
+                            <td class="tableCells">
+                                <h1 class="simColumns">2</h1>
+                            </td>
+                            <td class="tableCells">
+                                <h1 id="lbl-lsb" class="simColumns">1</h1>
+                            </td>
+                        </tr>
+                        <tr>
+                            <td class="text-center tableCells"><button class="btn btn-primary buttonMiddle" id="swt128" type="button" onclick="changeBit(128)">⏼<br></button></td>
+                            <td class="text-center tableCells"><button class="btn btn-primary buttonMiddle" id="swt64" type="button" onclick="changeBit(64)">⏼<br></button></td>
+                            <td class="text-center tableCells"><button class="btn btn-primary buttonMiddle" id="swt32" type="button" onclick="changeBit(32)">⏼<br></button></td>
+                            <td class="text-center tableCells"><button class="btn btn-primary buttonMiddle" id="swt16" type="button" onclick="changeBit(16)">⏼<br></button></td>
+                            <td class="text-center tableCells"><button class="btn btn-primary buttonMiddle" id="swt8" type="button" onclick="changeBit(8)">⏼<br></button></td>
+                            <td class="text-center tableCells"><button class="btn btn-primary buttonMiddle" id="swt4" type="button" onclick="changeBit(4)">⏼<br></button></td>
+                            <td class="text-center tableCells"><button class="btn btn-primary buttonMiddle" id="swt2" type="button" onclick="changeBit(2)">⏼<br></button></td>
+                            <td class="text-center"><button class="btn btn-primary buttonMiddle" id="swt1" type="button" onclick="changeBit(1)">⏼<br></button></td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+        <div class="container d-xl-flex justify-content-xl-center centred" style="height: 120px;"></div>
+    </section><!-- Start: Footer Multi Column -->
+    <footer style="background: rgb(45,44,56);">
+        <div class="container py-4 py-lg-5">
+            <div class="row justify-content-center">
+                <!-- Start: About Project -->
+                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
+                    <div class="fw-bold d-flex align-items-center mb-2"><img src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" style="width: 32px;margin: 5px;" width="32" height="32"><span>Computing:Box</span></div>
+                    <p class="text-muted">Computing Concept Simulators</p>
+                </div><!-- End: About Project -->
+            </div>
+            <hr>
+            <div class="col text-center d-block"><a href="https://www.computingbox.co.uk">Computing:Box</a> © 2024 by <a href="https://git.adcmnetworks.co.uk/alexander.lyall">Alexander Lyall</a> is licensed under <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a><br><img src="https://mirrors.creativecommons.org/presskit/icons/cc.svg" alt="" style="max-width: 1.5em;max-height:1.5em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/by.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/nc.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/sa.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><br><a href="copyright">Copyright Notice</a></div>
+            <div class="text-muted d-flex justify-content-center"></div>
+            <p class="mb-0"><noscript><!-- Matomo Image Tracker-->
+<img referrerpolicy="no-referrer-when-downgrade" src="https://analytics.adcmnetworks.co.uk/matomo.php?idsite=2&amp;rec=1" style="border:0" alt="" />
+    <!-- End Matomo --></noscript>Built for UK Computing Curriculum<br>Powered By ADCM Networks</p>
+        </div>
+    </footer><!-- End: Footer Multi Column -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
+    <script src="/assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
+    <script src="/assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
+    <script src="/assets/js/hexadecimal.js?h=1d88c5f7da86e237fdac8a16a6958a73"></script>
+    <script src="/assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
+    <script src="/assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
+</body>
+
+</html>

export/copyright.html

@@ -0,0 +1,221 @@
+<!DOCTYPE html>
+<html data-bs-theme="auto" lang="en">
+
+<head>
+    <meta charset="utf-8">
+<!-- Matomo -->
+<script>
+  var _paq = window._paq = window._paq || [];
+  /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+  _paq.push(["setCookieDomain", "*.www.computingbox.co.uk"]);
+  _paq.push(["setDomains", ["*.www.computingbox.co.uk","*.csbox.mrdaviscsit.uk","*.csbox.mrlyall.co.uk","*.csbox.mrlyall.uk"]]);
+  _paq.push(["enableCrossDomainLinking"]);
+  _paq.push(["disableCookies"]);
+  _paq.push(['trackPageView']);
+  _paq.push(['enableLinkTracking']);
+  (function() {
+    var u="//analytics.adcmnetworks.co.uk/";
+    _paq.push(['setTrackerUrl', u+'matomo.php']);
+    _paq.push(['setSiteId', '2']);
+    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+    g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+  })();
+</script>
+<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="//analytics.adcmnetworks.co.uk/matomo.php?idsite=2&amp;rec=1" style="border:0;" alt="" /></p></noscript>
+<!-- End Matomo Code -->
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
+    <title>Services - CS:Box</title>
+    <link rel="canonical" href="https://www.computingbox.co.uk/copyright.html">
+    <meta property="og:url" content="https://www.computingbox.co.uk/copyright.html">
+    <meta property="og:type" content="website">
+    <meta name="twitter:card" content="summary_large_image">
+    <meta property="og:image" content="https://www.computingbox.co.uk/assets/img/ComputingBox-Logo.webp">
+    <script>
+        (function() {
+
+            // JavaScript snippet handling Dark/Light mode switching
+
+            const getStoredTheme = () => localStorage.getItem('theme');
+            const setStoredTheme = theme => localStorage.setItem('theme', theme);
+            const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
+
+            const getPreferredTheme = () => {
+
+                if (forcedTheme) return forcedTheme;
+
+                const storedTheme = getStoredTheme();
+                if (storedTheme) {
+                    return storedTheme;
+                }
+
+                const pageTheme = document.documentElement.getAttribute('data-bs-theme');
+
+                if (pageTheme) {
+                    return pageTheme;
+                }
+
+                return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+            }
+
+            const setTheme = theme => {
+                if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+                    document.documentElement.setAttribute('data-bs-theme', 'dark');
+                } else {
+                    document.documentElement.setAttribute('data-bs-theme', theme);
+                }
+            }
+
+            setTheme(getPreferredTheme());
+
+            const showActiveTheme = (theme, focus = false) => {
+                const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
+
+                if (!themeSwitchers.length) return;
+
+                document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
+                    element.classList.remove('active');
+                    element.setAttribute('aria-pressed', 'false');
+                });
+
+                for (const themeSwitcher of themeSwitchers) {
+
+                    const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
+
+                    if (btnToActivate) {
+                        btnToActivate.classList.add('active');
+                        btnToActivate.setAttribute('aria-pressed', 'true');
+                    }
+                }
+            }
+
+            window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
+                const storedTheme = getStoredTheme();
+                if (storedTheme !== 'light' && storedTheme !== 'dark') {
+                    setTheme(getPreferredTheme());
+                }
+            });
+
+            window.addEventListener('DOMContentLoaded', () => {
+                showActiveTheme(getPreferredTheme());
+
+                document.querySelectorAll('[data-bs-theme-value]')
+                    .forEach(toggle => {
+                        toggle.addEventListener('click', (e) => {
+                            e.preventDefault();
+                            const theme = toggle.getAttribute('data-bs-theme-value');
+                            setStoredTheme(theme);
+                            setTheme(theme);
+                            showActiveTheme(theme);
+                        })
+                    })
+            });
+        })();
+    </script>
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" media="(prefers-color-scheme: dark)">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" media="(prefers-color-scheme: dark)">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="stylesheet" href="/assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
+    <link rel="stylesheet" href="/assets/css/DSEG7%20Classic%20Regular.css">
+    <link rel="stylesheet" href="/assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
+    <link rel="stylesheet" href="/assets/css/Inter.css?h=60f7751edc3ab55acc7880f1e25e45d3">
+    <link rel="stylesheet" href="/assets/css/Open%20Sans.css?h=ce1e3121e620675940c895d202b884b3">
+    <link rel="stylesheet" href="/assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
+    <link rel="stylesheet" href="/assets/css/bss-overrides.css?h=3dbfe72d968bc29929e6342eb303e930">
+    <link rel="stylesheet" href="/assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
+    <link rel="stylesheet" href="/assets/css/styles.css?h=88201532374cf4b4d8d775d23183d357">
+</head>
+
+<body>
+    <header class="bg-dark">
+        <!-- Start: Site Navigation -->
+        <nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
+            <div class="container"><img src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>Computing:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
+                <div class="collapse navbar-collapse" id="navcol-5">
+                    <ul class="navbar-nav ms-auto">
+                        <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
+                        <li class="nav-item"><a class="nav-link" href="about">About</a></li>
+                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Binary</a>
+                            <div class="dropdown-menu"><a class="dropdown-item" href="unsigned-binary">Unsigned Integers</a><a class="dropdown-item" href="twos-compliment-binary">Two's Compliment</a></div>
+                        </li>
+                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Hexadecimal</a>
+                            <div class="dropdown-menu"><a class="dropdown-item" href="gcse-hexadecimal">GCSE</a><a class="dropdown-item" href="a-level-hexadecimal">A Level</a></div>
+                        </li>
+                        <li class="nav-item"><a class="nav-link" href="hex-colours">Hex Colours</a></li>
+                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Logic Gates</a>
+                            <div class="dropdown-menu"><a class="dropdown-item" href="not-gate">NOT</a><a class="dropdown-item" href="and-gate">AND</a><a class="dropdown-item" href="or-gate">OR</a><a class="dropdown-item" href="nor-gate">NOR</a><a class="dropdown-item" href="nand-gate">NAND</a><a class="dropdown-item" href="xor-gate">XOR</a><a class="dropdown-item" href="xnor-gate">XNOR</a></div>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+        </nav><!-- End: Site Navigation -->
+    </header>
+    <section class="py-5">
+        <!-- Start: Features Cards -->
+        <div class="container">
+            <div class="row mb-4 mb-lg-5">
+                <div class="col-auto col-sm-auto col-md-8 col-lg-auto col-xl-6 col-xxl-auto text-center mx-auto">
+                    <div class="cc-heading">
+                        <h1 class="fw-bold text-success mb-2">Copyright Notice</h1><a href="https://www.computingbox.co.uk">Computing:Box</a> © 2024 by <a href="https://git.adcmnetworks.co.uk/alexander.lyall">Alexander Lyall</a> is licensed under <h2><a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International</a></h2><img src="https://mirrors.creativecommons.org/presskit/icons/cc.svg" alt="" style="max-width: 3em;max-height:3em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/by.svg" alt="" style="max-width: 3em;max-height:3em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/nc.svg" alt="" style="max-width: 3em;max-height:3em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/sa.svg" alt="" style="max-width: 3em;max-height:3em;margin-left: .2em;">
+                        <p>The following is a copy of the <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">Original License Deed</a><br>See a copy of the&nbsp;<a href="legal-code">Legal Code</a></p>
+                    </div>
+                </div>
+            </div>
+            <div class="row mx-auto">
+                <div class="col-auto col-sm-auto col-md-auto col-lg-auto col-xl-auto col-xxl-auto d-md-flex align-items-md-end align-items-lg-center mb-5">
+                    <div class="cc-terms">
+                        <h1 class="text-center">What Does This Mean For You?</h1>
+                        <h2>You are free to:</h2>
+                        <ul class="list-unstyled">
+                            <li><strong>Share</strong>&nbsp;— copy and redistribute the material in any medium or format</li>
+                            <li><strong>Adapt</strong>&nbsp;— remix, transform, and build upon the material</li>
+                            <li>The licensor cannot revoke these freedoms as long as you follow the license terms.</li>
+                        </ul>
+                        <h2>Under the following terms:</h2>
+                        <ul class="list-unstyled">
+                            <li class="cc-by"><strong>Attribution&nbsp;</strong>— You must give&nbsp;<a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en#ref-appropriate-credit">appropriate credit</a>, provide a link to the license, and <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en#ref-indicate-changes">indicate if changes were made</a>. You may do so in any reasonable manner, but not in any way that suggests the licensor endorses you or your use.</li>
+                            <li class="cc-nc"><strong>NonCommercial</strong> — You may not use the material for <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en#ref-commercial-purposes">commercial purposes</a>.</li>
+                            <li class="cc-sa"><strong>ShareAlike</strong> — If you remix, transform, or build upon the material, you must distribute your contributions under the <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en#ref-same-license">same license</a>&nbsp;as the original.</li>
+                            <li><strong>No additional restrictions</strong> — You may not apply legal terms or <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en#ref-technological-measures">technological measures</a>&nbsp;that legally restrict others from doing anything the license permits.</li>
+                        </ul>
+                        <h2>Notices:</h2>
+                        <p class="text-body mb-4">You do not have to comply with the license for elements of the material in the public domain or where your use is permitted by an applicable <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en#ref-exception-or-limitation">exception or limitation</a>.<br><br>No warranties are given. The license may not give you all of the permissions necessary for your intended use. For example, other rights such as <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en#ref-publicity-privacy-or-moral-rights">publicity, privacy, or moral rights</a>&nbsp;may limit how you use the material.</p>
+                        <div class="alert alert-info" role="alert">
+                            <h2><strong>Notice</strong></h2>
+                            <p>This deed highlights only some of the key features and terms of the actual license. It is not a license and has no legal value. You should carefully review all of the terms and conditions of the actual license before using the licensed material.<br><br><br><br>Creative Commons is not a law firm and does not provide legal services. Distributing, displaying, or linking to this deed or the license that it summarizes does not create a lawyer-client or any other relationship.</p>
+                        </div>
+                        <p class="mb-4">Creative Commons is the nonprofit behind the open licenses and other legal tools that allow creators to share their work.</p><a class="fs-5" href="https://creativecommons.org/share-your-work/cclicenses/">Learn more about CC Licensing</a>
+                    </div>
+                </div>
+            </div>
+        </div><!-- End: Features Cards -->
+    </section><!-- Start: Footer Multi Column -->
+    <footer style="background: rgb(45,44,56);">
+        <div class="container py-4 py-lg-5">
+            <div class="row justify-content-center">
+                <!-- Start: About Project -->
+                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
+                    <div class="fw-bold d-flex align-items-center mb-2"><img src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" style="width: 32px;margin: 5px;" width="32" height="32"><span>Computing:Box</span></div>
+                    <p class="text-muted">Computing Concept Simulators</p>
+                </div><!-- End: About Project -->
+            </div>
+            <hr>
+            <div class="col text-center d-block"><a href="https://www.computingbox.co.uk">Computing:Box</a> © 2024 by <a href="https://git.adcmnetworks.co.uk/alexander.lyall">Alexander Lyall</a> is licensed under <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a><br><img src="https://mirrors.creativecommons.org/presskit/icons/cc.svg" alt="" style="max-width: 1.5em;max-height:1.5em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/by.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/nc.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/sa.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><br><a href="copyright">Copyright Notice</a></div>
+            <div class="text-muted d-flex justify-content-center"></div>
+            <p class="mb-0"><noscript><!-- Matomo Image Tracker-->
+<img referrerpolicy="no-referrer-when-downgrade" src="https://analytics.adcmnetworks.co.uk/matomo.php?idsite=2&amp;rec=1" style="border:0" alt="" />
+    <!-- End Matomo --></noscript>Built for UK Computing Curriculum<br>Powered By ADCM Networks</p>
+        </div>
+    </footer><!-- End: Footer Multi Column -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
+    <script src="/assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
+    <script src="/assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
+    <script src="/assets/js/hexadecimal.js?h=1d88c5f7da86e237fdac8a16a6958a73"></script>
+    <script src="/assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
+    <script src="/assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
+</body>
+
+</html>

export/gcse-hexadecimal.html

@@ -7,6 +7,10 @@
 <script>
   var _paq = window._paq = window._paq || [];
   /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+  _paq.push(["setCookieDomain", "*.www.computingbox.co.uk"]);
+  _paq.push(["setDomains", ["*.www.computingbox.co.uk","*.csbox.mrdaviscsit.uk","*.csbox.mrlyall.co.uk","*.csbox.mrlyall.uk"]]);
+  _paq.push(["enableCrossDomainLinking"]);
+  _paq.push(["disableCookies"]);
   _paq.push(['trackPageView']);
   _paq.push(['enableLinkTracking']);
   (function() {
@@ -17,30 +21,118 @@
     g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
   })();
 </script>
+<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="//analytics.adcmnetworks.co.uk/matomo.php?idsite=2&amp;rec=1" style="border:0;" alt="" /></p></noscript>
 <!-- End Matomo Code -->
     <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
     <title>GCSE Hexadecimal Simulator - CS:Box</title>
-    <meta name="twitter:card" content="summary_large_image">
+    <link rel="canonical" href="https://www.computingbox.co.uk/gcse-hexadecimal.html">
+    <meta property="og:url" content="https://www.computingbox.co.uk/gcse-hexadecimal.html">
     <meta property="og:type" content="website">
-    <meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
-    <script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&amp;display=swap">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans&amp;display=swap">
-    <link rel="stylesheet" href="assets/css/styles.min.css?h=05023c48128d85662d4f89782ddfb125">
+    <meta name="twitter:card" content="summary_large_image">
+    <meta property="og:image" content="https://www.computingbox.co.uk/assets/img/ComputingBox-Logo.webp">
+    <script>
+        (function() {
+
+            // JavaScript snippet handling Dark/Light mode switching
+
+            const getStoredTheme = () => localStorage.getItem('theme');
+            const setStoredTheme = theme => localStorage.setItem('theme', theme);
+            const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
+
+            const getPreferredTheme = () => {
+
+                if (forcedTheme) return forcedTheme;
+
+                const storedTheme = getStoredTheme();
+                if (storedTheme) {
+                    return storedTheme;
+                }
+
+                const pageTheme = document.documentElement.getAttribute('data-bs-theme');
+
+                if (pageTheme) {
+                    return pageTheme;
+                }
+
+                return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+            }
+
+            const setTheme = theme => {
+                if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+                    document.documentElement.setAttribute('data-bs-theme', 'dark');
+                } else {
+                    document.documentElement.setAttribute('data-bs-theme', theme);
+                }
+            }
+
+            setTheme(getPreferredTheme());
+
+            const showActiveTheme = (theme, focus = false) => {
+                const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
+
+                if (!themeSwitchers.length) return;
+
+                document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
+                    element.classList.remove('active');
+                    element.setAttribute('aria-pressed', 'false');
+                });
+
+                for (const themeSwitcher of themeSwitchers) {
+
+                    const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
+
+                    if (btnToActivate) {
+                        btnToActivate.classList.add('active');
+                        btnToActivate.setAttribute('aria-pressed', 'true');
+                    }
+                }
+            }
+
+            window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
+                const storedTheme = getStoredTheme();
+                if (storedTheme !== 'light' && storedTheme !== 'dark') {
+                    setTheme(getPreferredTheme());
+                }
+            });
+
+            window.addEventListener('DOMContentLoaded', () => {
+                showActiveTheme(getPreferredTheme());
+
+                document.querySelectorAll('[data-bs-theme-value]')
+                    .forEach(toggle => {
+                        toggle.addEventListener('click', (e) => {
+                            e.preventDefault();
+                            const theme = toggle.getAttribute('data-bs-theme-value');
+                            setStoredTheme(theme);
+                            setTheme(theme);
+                            showActiveTheme(theme);
+                        })
+                    })
+            });
+        })();
+    </script>
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" media="(prefers-color-scheme: dark)">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" media="(prefers-color-scheme: dark)">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="stylesheet" href="/assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
+    <link rel="stylesheet" href="/assets/css/DSEG7%20Classic%20Regular.css">
+    <link rel="stylesheet" href="/assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
+    <link rel="stylesheet" href="/assets/css/Inter.css?h=60f7751edc3ab55acc7880f1e25e45d3">
+    <link rel="stylesheet" href="/assets/css/Open%20Sans.css?h=ce1e3121e620675940c895d202b884b3">
+    <link rel="stylesheet" href="/assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
+    <link rel="stylesheet" href="/assets/css/bss-overrides.css?h=3dbfe72d968bc29929e6342eb303e930">
+    <link rel="stylesheet" href="/assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
+    <link rel="stylesheet" href="/assets/css/styles.css?h=88201532374cf4b4d8d775d23183d357">
 </head>
 
 <body>
     <header class="bg-dark">
         <!-- Start: Site Navigation -->
         <nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
-            <div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
+            <div class="container"><img src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>Computing:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
                 <div class="collapse navbar-collapse" id="navcol-5">
                     <ul class="navbar-nav ms-auto">
                         <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
@@ -81,7 +173,7 @@
                 <div class="col centred" style="width: 30%;">
                     <div class="centred reset" style="position: relative;">
                         <p class="resetButton">Reset bit:box</p>
-                        <div style="position: absolute;"><img class="overlay resetIcon" src="assets/img/BitBoxLogo.png?h=a50b3ddb5614299b0c00dd4f01bc402e" onclick="resetHexadecimal()"></div>
+                        <div style="position: absolute;"><img class="overlay resetIcon" src="/assets/img/BitBoxLogo.png?h=a50b3ddb5614299b0c00dd4f01bc402e" onclick="resetHexadecimal()"></div>
                     </div>
                     <div class="row">
                         <div class="col-xl-12 bottomSpacer"></div>
@@ -147,6 +239,9 @@
                     <div class="row">
                         <div class="col"><button class="btn btn-primary hexadecimalButtons customiserButtons" type="button" onclick="requestDenaryForHexadecimal()">Custom Denary</button></div>
                     </div>
+                    <div class="row">
+                        <div class="col"><button class="btn btn-primary hexadecimalButtons customiserButtons" type="button" onclick="requestBinaryforHexadecimal()">Custom Binary</button></div>
+                    </div>
                 </div>
             </div>
         </div><!-- End: 1 Row 2 Columns -->
@@ -200,45 +295,25 @@
             <div class="row justify-content-center">
                 <!-- Start: About Project -->
                 <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
-                        <div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
-                                <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                            </svg><span>GitHub</span></div>
-                    </a>
+                    <div class="fw-bold d-flex align-items-center mb-2"><img src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" style="width: 32px;margin: 5px;" width="32" height="32"><span>Computing:Box</span></div>
+                    <p class="text-muted">Computing Concept Simulators</p>
                 </div><!-- End: About Project -->
-                <!-- Start: About -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
-                <!-- Start: Social Links -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
-                    <div class="row">
-                        <div class="col-md-3"><a href="https://mstdn.social/@MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-mastodon social-media">
-                                    <path d="M11.19 12.195c2.016-.24 3.77-1.475 3.99-2.603.348-1.778.32-4.339.32-4.339 0-3.47-2.286-4.488-2.286-4.488C12.062.238 10.083.017 8.027 0h-.05C5.92.017 3.942.238 2.79.765c0 0-2.285 1.017-2.285 4.488l-.002.662c-.004.64-.007 1.35.011 2.091.083 3.394.626 6.74 3.78 7.57 1.454.383 2.703.463 3.709.408 1.823-.1 2.847-.647 2.847-.647l-.06-1.317s-1.303.41-2.767.36c-1.45-.05-2.98-.156-3.215-1.928a3.614 3.614 0 0 1-.033-.496s1.424.346 3.228.428c1.103.05 2.137-.064 3.188-.189zm1.613-2.47H11.13v-4.08c0-.859-.364-1.295-1.091-1.295-.804 0-1.207.517-1.207 1.541v2.233H7.168V5.89c0-1.024-.403-1.541-1.207-1.541-.727 0-1.091.436-1.091 1.296v4.079H3.197V5.522c0-.859.22-1.541.66-2.046.456-.505 1.052-.764 1.793-.764.856 0 1.504.328 1.933.983L8 4.39l.417-.695c.429-.655 1.077-.983 1.934-.983.74 0 1.336.259 1.791.764.442.505.661 1.187.661 2.046v4.203z"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://www.linkedin.com/in/alexanderedavis/" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-linkedin social-media">
-                                    <path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854V1.146zm4.943 12.248V6.169H2.542v7.225h2.401m-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248-.822 0-1.359.54-1.359 1.248 0 .694.521 1.248 1.327 1.248h.016zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016a5.54 5.54 0 0 1 .016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225h2.4"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://github.com/MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github social-media">
-                                    <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"></div>
-                    </div>
-                </div><!-- End: Social Links -->
-                <!-- Start: Branding -->
-                <div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
-                    <div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
-                    <p class="text-muted">Computer Science Concept Simulators</p>
-                </div><!-- End: Branding -->
             </div>
             <hr>
-            <div class="text-muted d-flex justify-content-between align-items-center pt-3">
-                <p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
-            </div>
+            <div class="col text-center d-block"><a href="https://www.computingbox.co.uk">Computing:Box</a> © 2024 by <a href="https://git.adcmnetworks.co.uk/alexander.lyall">Alexander Lyall</a> is licensed under <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a><br><img src="https://mirrors.creativecommons.org/presskit/icons/cc.svg" alt="" style="max-width: 1.5em;max-height:1.5em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/by.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/nc.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/sa.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><br><a href="copyright">Copyright Notice</a></div>
+            <div class="text-muted d-flex justify-content-center"></div>
+            <p class="mb-0"><noscript><!-- Matomo Image Tracker-->
+<img referrerpolicy="no-referrer-when-downgrade" src="https://analytics.adcmnetworks.co.uk/matomo.php?idsite=2&amp;rec=1" style="border:0" alt="" />
+    <!-- End Matomo --></noscript>Built for UK Computing Curriculum<br>Powered By ADCM Networks</p>
         </div>
     </footer><!-- End: Footer Multi Column -->
     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
-    <script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
+    <script src="/assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
+    <script src="/assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
+    <script src="/assets/js/hexadecimal.js?h=1d88c5f7da86e237fdac8a16a6958a73"></script>
+    <script src="/assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
+    <script src="/assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
 </body>
 
 </html>

export/hex-colours.html

@@ -7,6 +7,10 @@
 <script>
   var _paq = window._paq = window._paq || [];
   /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+  _paq.push(["setCookieDomain", "*.www.computingbox.co.uk"]);
+  _paq.push(["setDomains", ["*.www.computingbox.co.uk","*.csbox.mrdaviscsit.uk","*.csbox.mrlyall.co.uk","*.csbox.mrlyall.uk"]]);
+  _paq.push(["enableCrossDomainLinking"]);
+  _paq.push(["disableCookies"]);
   _paq.push(['trackPageView']);
   _paq.push(['enableLinkTracking']);
   (function() {
@@ -17,30 +21,118 @@
     g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
   })();
 </script>
+<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="//analytics.adcmnetworks.co.uk/matomo.php?idsite=2&amp;rec=1" style="border:0;" alt="" /></p></noscript>
 <!-- End Matomo Code -->
     <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
     <title>Hex Colours - CS:Box</title>
-    <meta name="twitter:card" content="summary_large_image">
+    <link rel="canonical" href="https://www.computingbox.co.uk/hex-colours.html">
+    <meta property="og:url" content="https://www.computingbox.co.uk/hex-colours.html">
     <meta property="og:type" content="website">
-    <meta property="og:image" content="https://csbox.mrdaviscsit.uk/assets/img/CSBoxLogo.svg">
-    <script>!function(){const e=()=>localStorage.getItem("theme"),t=document.documentElement.getAttribute("data-bss-forced-theme"),a=()=>{if(t)return t;const a=e();if(a)return a;const r=document.documentElement.getAttribute("data-bs-theme");return r||(window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light")},r=e=>{"auto"===e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.setAttribute("data-bs-theme","dark"):document.documentElement.setAttribute("data-bs-theme",e)};r(a());const c=(e,t=!1)=>{const a=[].slice.call(document.querySelectorAll(".theme-switcher"));if(a.length){document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.classList.remove("active"),e.setAttribute("aria-pressed","false")}));for(const t of a){const a=t.querySelector('[data-bs-theme-value="'+e+'"]');a&&(a.classList.add("active"),a.setAttribute("aria-pressed","true"))}}};window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",(()=>{const t=e();"light"!==t&&"dark"!==t&&r(a())})),window.addEventListener("DOMContentLoaded",(()=>{c(a()),document.querySelectorAll("[data-bs-theme-value]").forEach((e=>{e.addEventListener("click",(t=>{t.preventDefault();const a=e.getAttribute("data-bs-theme-value");(e=>{localStorage.setItem("theme",e)})(a),r(a),c(a)}))}))}))}();</script>
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" media="(prefers-color-scheme: dark)">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="icon" type="image/svg+xml" sizes="500x500" href="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71">
-    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&amp;display=swap">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans&amp;display=swap">
-    <link rel="stylesheet" href="assets/css/styles.min.css?h=05023c48128d85662d4f89782ddfb125">
+    <meta name="twitter:card" content="summary_large_image">
+    <meta property="og:image" content="https://www.computingbox.co.uk/assets/img/ComputingBox-Logo.webp">
+    <script>
+        (function() {
+
+            // JavaScript snippet handling Dark/Light mode switching
+
+            const getStoredTheme = () => localStorage.getItem('theme');
+            const setStoredTheme = theme => localStorage.setItem('theme', theme);
+            const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
+
+            const getPreferredTheme = () => {
+
+                if (forcedTheme) return forcedTheme;
+
+                const storedTheme = getStoredTheme();
+                if (storedTheme) {
+                    return storedTheme;
+                }
+
+                const pageTheme = document.documentElement.getAttribute('data-bs-theme');
+
+                if (pageTheme) {
+                    return pageTheme;
+                }
+
+                return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+            }
+
+            const setTheme = theme => {
+                if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+                    document.documentElement.setAttribute('data-bs-theme', 'dark');
+                } else {
+                    document.documentElement.setAttribute('data-bs-theme', theme);
+                }
+            }
+
+            setTheme(getPreferredTheme());
+
+            const showActiveTheme = (theme, focus = false) => {
+                const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
+
+                if (!themeSwitchers.length) return;
+
+                document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
+                    element.classList.remove('active');
+                    element.setAttribute('aria-pressed', 'false');
+                });
+
+                for (const themeSwitcher of themeSwitchers) {
+
+                    const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
+
+                    if (btnToActivate) {
+                        btnToActivate.classList.add('active');
+                        btnToActivate.setAttribute('aria-pressed', 'true');
+                    }
+                }
+            }
+
+            window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
+                const storedTheme = getStoredTheme();
+                if (storedTheme !== 'light' && storedTheme !== 'dark') {
+                    setTheme(getPreferredTheme());
+                }
+            });
+
+            window.addEventListener('DOMContentLoaded', () => {
+                showActiveTheme(getPreferredTheme());
+
+                document.querySelectorAll('[data-bs-theme-value]')
+                    .forEach(toggle => {
+                        toggle.addEventListener('click', (e) => {
+                            e.preventDefault();
+                            const theme = toggle.getAttribute('data-bs-theme-value');
+                            setStoredTheme(theme);
+                            setTheme(theme);
+                            showActiveTheme(theme);
+                        })
+                    })
+            });
+        })();
+    </script>
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" media="(prefers-color-scheme: dark)">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" media="(prefers-color-scheme: dark)">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="stylesheet" href="/assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
+    <link rel="stylesheet" href="/assets/css/DSEG7%20Classic%20Regular.css">
+    <link rel="stylesheet" href="/assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
+    <link rel="stylesheet" href="/assets/css/Inter.css?h=60f7751edc3ab55acc7880f1e25e45d3">
+    <link rel="stylesheet" href="/assets/css/Open%20Sans.css?h=ce1e3121e620675940c895d202b884b3">
+    <link rel="stylesheet" href="/assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
+    <link rel="stylesheet" href="/assets/css/bss-overrides.css?h=3dbfe72d968bc29929e6342eb303e930">
+    <link rel="stylesheet" href="/assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
+    <link rel="stylesheet" href="/assets/css/styles.css?h=88201532374cf4b4d8d775d23183d357">
 </head>
 
 <body>
     <header class="bg-dark">
         <!-- Start: Site Navigation -->
         <nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
-            <div class="container"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>CS:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
+            <div class="container"><img src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" style="width: 32px;margin: 5px;" width="32" height="32"><a class="navbar-brand d-flex align-items-center" href="/"><span>Computing:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
                 <div class="collapse navbar-collapse" id="navcol-5">
                     <ul class="navbar-nav ms-auto">
                         <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
@@ -81,7 +173,7 @@
                 <div class="col centred" style="width: 30%;">
                     <div class="centred reset" style="position: relative;">
                         <p class="resetButton">Reset bit:box</p>
-                        <div style="position: absolute;"><img class="overlay resetIcon" src="assets/img/BitBoxLogo.png?h=a50b3ddb5614299b0c00dd4f01bc402e" onclick="resetColours()"></div>
+                        <div style="position: absolute;"><img class="overlay resetIcon" src="/assets/img/BitBoxLogo.png?h=a50b3ddb5614299b0c00dd4f01bc402e" onclick="resetColours()"></div>
                     </div>
                     <div class="row">
                         <div class="col spacer"><button class="btn btn-primary hexColourButtons customiserButtons" type="button" onclick="requestHex()">Custom Hex Code</button></div>
@@ -304,45 +396,25 @@
             <div class="row justify-content-center">
                 <!-- Start: About Project -->
                 <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">About Project</h1><a href="https://github.com/MrDavisCSIT/CS-Box" target="_blank">
-                        <div class="fw-bold d-flex align-items-center mb-2"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github" style="font-size: 25px;margin-right: 10px;">
-                                <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                            </svg><span>GitHub</span></div>
-                    </a>
+                    <div class="fw-bold d-flex align-items-center mb-2"><img src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" style="width: 32px;margin: 5px;" width="32" height="32"><span>Computing:Box</span></div>
+                    <p class="text-muted">Computing Concept Simulators</p>
                 </div><!-- End: About Project -->
-                <!-- Start: About -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column"></div><!-- End: About -->
-                <!-- Start: Social Links -->
-                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
-                    <h1 style="font-size: 16px;font-weight: bold;margin-top: 10px;">Social Media</h1>
-                    <div class="row">
-                        <div class="col-md-3"><a href="https://mstdn.social/@MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-mastodon social-media">
-                                    <path d="M11.19 12.195c2.016-.24 3.77-1.475 3.99-2.603.348-1.778.32-4.339.32-4.339 0-3.47-2.286-4.488-2.286-4.488C12.062.238 10.083.017 8.027 0h-.05C5.92.017 3.942.238 2.79.765c0 0-2.285 1.017-2.285 4.488l-.002.662c-.004.64-.007 1.35.011 2.091.083 3.394.626 6.74 3.78 7.57 1.454.383 2.703.463 3.709.408 1.823-.1 2.847-.647 2.847-.647l-.06-1.317s-1.303.41-2.767.36c-1.45-.05-2.98-.156-3.215-1.928a3.614 3.614 0 0 1-.033-.496s1.424.346 3.228.428c1.103.05 2.137-.064 3.188-.189zm1.613-2.47H11.13v-4.08c0-.859-.364-1.295-1.091-1.295-.804 0-1.207.517-1.207 1.541v2.233H7.168V5.89c0-1.024-.403-1.541-1.207-1.541-.727 0-1.091.436-1.091 1.296v4.079H3.197V5.522c0-.859.22-1.541.66-2.046.456-.505 1.052-.764 1.793-.764.856 0 1.504.328 1.933.983L8 4.39l.417-.695c.429-.655 1.077-.983 1.934-.983.74 0 1.336.259 1.791.764.442.505.661 1.187.661 2.046v4.203z"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://www.linkedin.com/in/alexanderedavis/" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-linkedin social-media">
-                                    <path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854V1.146zm4.943 12.248V6.169H2.542v7.225h2.401m-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248-.822 0-1.359.54-1.359 1.248 0 .694.521 1.248 1.327 1.248h.016zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016a5.54 5.54 0 0 1 .016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225h2.4"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"><a href="https://github.com/MrDavisCSIT" target="_blank"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-github social-media">
-                                    <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8"></path>
-                                </svg></a></div>
-                        <div class="col-md-3"></div>
-                    </div>
-                </div><!-- End: Social Links -->
-                <!-- Start: Branding -->
-                <div class="col-lg-3 text-center text-lg-start d-flex flex-column align-items-center order-first align-items-lg-start order-lg-last">
-                    <div class="fw-bold d-flex align-items-center mb-2"><img src="assets/img/CSBoxLogo.svg?h=ca838acaf7f1bc97e10657f07ed63d71" style="width: 32px;margin: 5px;"><span>CS:Box</span></div>
-                    <p class="text-muted">Computer Science Concept Simulators</p>
-                </div><!-- End: Branding -->
             </div>
             <hr>
-            <div class="text-muted d-flex justify-content-between align-items-center pt-3">
-                <p class="mb-0">Copyright © 2025 CS:Box<br>Powered By ADCM Networks</p>
-            </div>
+            <div class="col text-center d-block"><a href="https://www.computingbox.co.uk">Computing:Box</a> © 2024 by <a href="https://git.adcmnetworks.co.uk/alexander.lyall">Alexander Lyall</a> is licensed under <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a><br><img src="https://mirrors.creativecommons.org/presskit/icons/cc.svg" alt="" style="max-width: 1.5em;max-height:1.5em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/by.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/nc.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/sa.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><br><a href="copyright">Copyright Notice</a></div>
+            <div class="text-muted d-flex justify-content-center"></div>
+            <p class="mb-0"><noscript><!-- Matomo Image Tracker-->
+<img referrerpolicy="no-referrer-when-downgrade" src="https://analytics.adcmnetworks.co.uk/matomo.php?idsite=2&amp;rec=1" style="border:0" alt="" />
+    <!-- End Matomo --></noscript>Built for UK Computing Curriculum<br>Powered By ADCM Networks</p>
         </div>
     </footer><!-- End: Footer Multi Column -->
     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
-    <script src="assets/js/script.min.js?h=0285b128be1c36f7774d736c7ffa9df9"></script>
+    <script src="/assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
+    <script src="/assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
+    <script src="/assets/js/hexadecimal.js?h=1d88c5f7da86e237fdac8a16a6958a73"></script>
+    <script src="/assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
+    <script src="/assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
 </body>
 
 </html>

export/index.html

@@ -0,0 +1,223 @@
+<!DOCTYPE html>
+<html data-bs-theme="auto" lang="en">
+
+<head>
+    <meta charset="utf-8">
+<!-- Matomo -->
+<script>
+  var _paq = window._paq = window._paq || [];
+  /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+  _paq.push(["setCookieDomain", "*.www.computingbox.co.uk"]);
+  _paq.push(["setDomains", ["*.www.computingbox.co.uk","*.csbox.mrdaviscsit.uk","*.csbox.mrlyall.co.uk","*.csbox.mrlyall.uk"]]);
+  _paq.push(["enableCrossDomainLinking"]);
+  _paq.push(["disableCookies"]);
+  _paq.push(['trackPageView']);
+  _paq.push(['enableLinkTracking']);
+  (function() {
+    var u="//analytics.adcmnetworks.co.uk/";
+    _paq.push(['setTrackerUrl', u+'matomo.php']);
+    _paq.push(['setSiteId', '2']);
+    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+    g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+  })();
+</script>
+<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="//analytics.adcmnetworks.co.uk/matomo.php?idsite=2&amp;rec=1" style="border:0;" alt="" /></p></noscript>
+<!-- End Matomo Code -->
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
+    <title>Welcome to CS:Box</title>
+    <link rel="canonical" href="https://www.computingbox.co.uk/">
+    <meta property="og:url" content="https://www.computingbox.co.uk/">
+    <meta property="og:type" content="website">
+    <meta name="twitter:card" content="summary_large_image">
+    <meta property="og:image" content="https://www.computingbox.co.uk/assets/img/ComputingBox-Logo.webp">
+    <script type="application/ld+json">
+        {
+            "@context": "http://schema.org",
+            "@type": "WebSite",
+            "name": "Computing:Box",
+            "url": "https://www.computingbox.co.uk"
+        }
+    </script>
+    <script>
+        (function() {
+
+            // JavaScript snippet handling Dark/Light mode switching
+
+            const getStoredTheme = () => localStorage.getItem('theme');
+            const setStoredTheme = theme => localStorage.setItem('theme', theme);
+            const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
+
+            const getPreferredTheme = () => {
+
+                if (forcedTheme) return forcedTheme;
+
+                const storedTheme = getStoredTheme();
+                if (storedTheme) {
+                    return storedTheme;
+                }
+
+                const pageTheme = document.documentElement.getAttribute('data-bs-theme');
+
+                if (pageTheme) {
+                    return pageTheme;
+                }
+
+                return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+            }
+
+            const setTheme = theme => {
+                if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+                    document.documentElement.setAttribute('data-bs-theme', 'dark');
+                } else {
+                    document.documentElement.setAttribute('data-bs-theme', theme);
+                }
+            }
+
+            setTheme(getPreferredTheme());
+
+            const showActiveTheme = (theme, focus = false) => {
+                const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
+
+                if (!themeSwitchers.length) return;
+
+                document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
+                    element.classList.remove('active');
+                    element.setAttribute('aria-pressed', 'false');
+                });
+
+                for (const themeSwitcher of themeSwitchers) {
+
+                    const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
+
+                    if (btnToActivate) {
+                        btnToActivate.classList.add('active');
+                        btnToActivate.setAttribute('aria-pressed', 'true');
+                    }
+                }
+            }
+
+            window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
+                const storedTheme = getStoredTheme();
+                if (storedTheme !== 'light' && storedTheme !== 'dark') {
+                    setTheme(getPreferredTheme());
+                }
+            });
+
+            window.addEventListener('DOMContentLoaded', () => {
+                showActiveTheme(getPreferredTheme());
+
+                document.querySelectorAll('[data-bs-theme-value]')
+                    .forEach(toggle => {
+                        toggle.addEventListener('click', (e) => {
+                            e.preventDefault();
+                            const theme = toggle.getAttribute('data-bs-theme-value');
+                            setStoredTheme(theme);
+                            setTheme(theme);
+                            showActiveTheme(theme);
+                        })
+                    })
+            });
+        })();
+    </script>
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" media="(prefers-color-scheme: dark)">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" media="(prefers-color-scheme: dark)">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="stylesheet" href="/assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
+    <link rel="stylesheet" href="/assets/css/DSEG7%20Classic%20Regular.css">
+    <link rel="stylesheet" href="/assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
+    <link rel="stylesheet" href="/assets/css/Inter.css?h=60f7751edc3ab55acc7880f1e25e45d3">
+    <link rel="stylesheet" href="/assets/css/Open%20Sans.css?h=ce1e3121e620675940c895d202b884b3">
+    <link rel="stylesheet" href="/assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
+    <link rel="stylesheet" href="/assets/css/bss-overrides.css?h=3dbfe72d968bc29929e6342eb303e930">
+    <link rel="stylesheet" href="/assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
+    <link rel="stylesheet" href="/assets/css/styles.css?h=88201532374cf4b4d8d775d23183d357">
+</head>
+
+<body>
+    <header class="bg-dark">
+        <!-- Start: Site Navigation -->
+        <nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
+            <div class="container"><img src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>Computing:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
+                <div class="collapse navbar-collapse" id="navcol-5">
+                    <ul class="navbar-nav ms-auto">
+                        <li class="nav-item"><a class="nav-link active" href="/">Home</a></li>
+                        <li class="nav-item"><a class="nav-link" href="about">About</a></li>
+                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Binary</a>
+                            <div class="dropdown-menu"><a class="dropdown-item" href="unsigned-binary">Unsigned Integers</a><a class="dropdown-item" href="twos-compliment-binary">Two's Compliment</a></div>
+                        </li>
+                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Hexadecimal</a>
+                            <div class="dropdown-menu"><a class="dropdown-item" href="gcse-hexadecimal">GCSE</a><a class="dropdown-item" href="a-level-hexadecimal">A Level</a></div>
+                        </li>
+                        <li class="nav-item"><a class="nav-link" href="hex-colours">Hex Colours</a></li>
+                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Logic Gates</a>
+                            <div class="dropdown-menu"><a class="dropdown-item" href="not-gate">NOT</a><a class="dropdown-item" href="and-gate">AND</a><a class="dropdown-item" href="or-gate">OR</a><a class="dropdown-item" href="nor-gate">NOR</a><a class="dropdown-item" href="nand-gate">NAND</a><a class="dropdown-item" href="xor-gate">XOR</a><a class="dropdown-item" href="xnor-gate">XNOR</a></div>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+        </nav><!-- End: Site Navigation -->
+    </header><!-- Start: Hero Banner Color -->
+    <section class="d-print-none d-lg-none d-xl-none d-xxl-none py-4 py-xl-5">
+        <div class="container h-100">
+            <div class="text-white border rounded border-0 p-1 bg-danger">
+                <div class="row h-100">
+                    <div class="col-md-10 col-xl-8 text-center d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-center mx-auto">
+                        <div>
+                            <h1 class="text-uppercase fw-bold text-white mb-3" style="font-size: 24pt;">SITE&nbsp;Not Suitable for DEVICES WITH SMALLER SCREENS</h1>
+                            <p class="mb-4">This site is not suitable for mobile devices and tablets, please try accessing this site on a desktop or laptop.</p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section><!-- End: Hero Banner Color -->
+    <section class="d-none d-print-block d-sm-none d-md-none d-lg-block d-xl-block d-xxl-block">
+        <!-- Start: Hero Clean Reverse -->
+        <div class="container py-5">
+            <div class="row py-5">
+                <div class="col-md-6 text-center text-md-start d-flex d-sm-flex d-md-flex justify-content-center align-items-center justify-content-md-start align-items-md-center justify-content-xl-end mb-4">
+                    <div style="max-width: 450px;">
+                        <p class="fw-bold text-success mb-2">Version 1 Available Now<br>Version 2 Coming Soon</p>
+                        <h2 class="fw-bold">Understand Computing concepts better.</h2>
+                        <p class="completeFeatures"><strong>Coming Soon to Computing:Box</strong></p>
+                        <p class="completeFeatures"></p>
+                        <p class="introP">New User Interface (UI)<br>Expanded Gate Functionality - Automatic Truth Tables<br>Computer Part Simulator</p><a href="projects"><button class="btn btn-primary" type="button">Learn More</button></a>
+                    </div>
+                </div>
+                <div class="col-md-6 mb-4">
+                    <div class="p-5 mx-lg-5"><img class="rounded img-fluid shadow w-100 fit-cover" style="min-height: 300px;" src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1"></div>
+                </div>
+                <div class="col"></div>
+            </div>
+        </div><!-- End: Hero Clean Reverse -->
+    </section><!-- Start: Footer Multi Column -->
+    <footer style="background: rgb(45,44,56);">
+        <div class="container py-4 py-lg-5">
+            <div class="row justify-content-center">
+                <!-- Start: About Project -->
+                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
+                    <div class="fw-bold d-flex align-items-center mb-2"><img src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" style="width: 32px;margin: 5px;" width="32" height="32"><span>Computing:Box</span></div>
+                    <p class="text-muted">Computing Concept Simulators</p>
+                </div><!-- End: About Project -->
+            </div>
+            <hr>
+            <div class="col text-center d-block"><a href="https://www.computingbox.co.uk">Computing:Box</a> © 2024 by <a href="https://git.adcmnetworks.co.uk/alexander.lyall">Alexander Lyall</a> is licensed under <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a><br><img src="https://mirrors.creativecommons.org/presskit/icons/cc.svg" alt="" style="max-width: 1.5em;max-height:1.5em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/by.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/nc.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/sa.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><br><a href="copyright">Copyright Notice</a></div>
+            <div class="text-muted d-flex justify-content-center"></div>
+            <p class="mb-0"><noscript><!-- Matomo Image Tracker-->
+<img referrerpolicy="no-referrer-when-downgrade" src="https://analytics.adcmnetworks.co.uk/matomo.php?idsite=2&amp;rec=1" style="border:0" alt="" />
+    <!-- End Matomo --></noscript>Built for UK Computing Curriculum<br>Powered By ADCM Networks</p>
+        </div>
+    </footer><!-- End: Footer Multi Column -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
+    <script src="/assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
+    <script src="/assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
+    <script src="/assets/js/hexadecimal.js?h=1d88c5f7da86e237fdac8a16a6958a73"></script>
+    <script src="/assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
+    <script src="/assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
+</body>
+
+</html>

export/legal-code.html

@@ -0,0 +1,232 @@
+<!DOCTYPE html>
+<html data-bs-theme="auto" lang="en">
+
+<head>
+    <meta charset="utf-8">
+<!-- Matomo -->
+<script>
+  var _paq = window._paq = window._paq || [];
+  /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+  _paq.push(["setCookieDomain", "*.www.computingbox.co.uk"]);
+  _paq.push(["setDomains", ["*.www.computingbox.co.uk","*.csbox.mrdaviscsit.uk","*.csbox.mrlyall.co.uk","*.csbox.mrlyall.uk"]]);
+  _paq.push(["enableCrossDomainLinking"]);
+  _paq.push(["disableCookies"]);
+  _paq.push(['trackPageView']);
+  _paq.push(['enableLinkTracking']);
+  (function() {
+    var u="//analytics.adcmnetworks.co.uk/";
+    _paq.push(['setTrackerUrl', u+'matomo.php']);
+    _paq.push(['setSiteId', '2']);
+    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+    g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+  })();
+</script>
+<noscript><p><img referrerpolicy="no-referrer-when-downgrade" src="//analytics.adcmnetworks.co.uk/matomo.php?idsite=2&amp;rec=1" style="border:0;" alt="" /></p></noscript>
+<!-- End Matomo Code -->
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
+    <title>Services - CS:Box</title>
+    <link rel="canonical" href="https://www.computingbox.co.uk/legal-code.html">
+    <meta property="og:url" content="https://www.computingbox.co.uk/legal-code.html">
+    <meta property="og:type" content="website">
+    <meta name="twitter:card" content="summary_large_image">
+    <meta property="og:image" content="https://www.computingbox.co.uk/assets/img/ComputingBox-Logo.webp">
+    <script>
+        (function() {
+
+            // JavaScript snippet handling Dark/Light mode switching
+
+            const getStoredTheme = () => localStorage.getItem('theme');
+            const setStoredTheme = theme => localStorage.setItem('theme', theme);
+            const forcedTheme = document.documentElement.getAttribute('data-bss-forced-theme');
+
+            const getPreferredTheme = () => {
+
+                if (forcedTheme) return forcedTheme;
+
+                const storedTheme = getStoredTheme();
+                if (storedTheme) {
+                    return storedTheme;
+                }
+
+                const pageTheme = document.documentElement.getAttribute('data-bs-theme');
+
+                if (pageTheme) {
+                    return pageTheme;
+                }
+
+                return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+            }
+
+            const setTheme = theme => {
+                if (theme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+                    document.documentElement.setAttribute('data-bs-theme', 'dark');
+                } else {
+                    document.documentElement.setAttribute('data-bs-theme', theme);
+                }
+            }
+
+            setTheme(getPreferredTheme());
+
+            const showActiveTheme = (theme, focus = false) => {
+                const themeSwitchers = [].slice.call(document.querySelectorAll('.theme-switcher'));
+
+                if (!themeSwitchers.length) return;
+
+                document.querySelectorAll('[data-bs-theme-value]').forEach(element => {
+                    element.classList.remove('active');
+                    element.setAttribute('aria-pressed', 'false');
+                });
+
+                for (const themeSwitcher of themeSwitchers) {
+
+                    const btnToActivate = themeSwitcher.querySelector('[data-bs-theme-value="' + theme + '"]');
+
+                    if (btnToActivate) {
+                        btnToActivate.classList.add('active');
+                        btnToActivate.setAttribute('aria-pressed', 'true');
+                    }
+                }
+            }
+
+            window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
+                const storedTheme = getStoredTheme();
+                if (storedTheme !== 'light' && storedTheme !== 'dark') {
+                    setTheme(getPreferredTheme());
+                }
+            });
+
+            window.addEventListener('DOMContentLoaded', () => {
+                showActiveTheme(getPreferredTheme());
+
+                document.querySelectorAll('[data-bs-theme-value]')
+                    .forEach(toggle => {
+                        toggle.addEventListener('click', (e) => {
+                            e.preventDefault();
+                            const theme = toggle.getAttribute('data-bs-theme-value');
+                            setStoredTheme(theme);
+                            setTheme(theme);
+                            showActiveTheme(theme);
+                        })
+                    })
+            });
+        })();
+    </script>
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" media="(prefers-color-scheme: dark)">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" media="(prefers-color-scheme: dark)">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="icon" type="image/webp" sizes="1024x1024" href="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1">
+    <link rel="stylesheet" href="/assets/bootstrap/css/bootstrap.min.css?h=bec7173809e9299f24e368ea574911e3">
+    <link rel="stylesheet" href="/assets/css/DSEG7%20Classic%20Regular.css">
+    <link rel="stylesheet" href="/assets/css/IEC%20symbols%20Unicode.css?h=f58bcc159dfcde3a8902f3c3e5961248">
+    <link rel="stylesheet" href="/assets/css/Inter.css?h=60f7751edc3ab55acc7880f1e25e45d3">
+    <link rel="stylesheet" href="/assets/css/Open%20Sans.css?h=ce1e3121e620675940c895d202b884b3">
+    <link rel="stylesheet" href="/assets/css/Seven%20Segment.css?h=f58bcc159dfcde3a8902f3c3e5961248">
+    <link rel="stylesheet" href="/assets/css/bss-overrides.css?h=3dbfe72d968bc29929e6342eb303e930">
+    <link rel="stylesheet" href="/assets/css/Slider-Range.css?h=f8e9df474f99934e8bddde82bea5ff22">
+    <link rel="stylesheet" href="/assets/css/styles.css?h=88201532374cf4b4d8d775d23183d357">
+</head>
+
+<body>
+    <header class="bg-dark">
+        <!-- Start: Site Navigation -->
+        <nav class="navbar navbar-expand-md sticky-top py-3 navbar-dark" id="mainNav" style="background: rgb(45, 44, 56);">
+            <div class="container"><img src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" style="width: 32px;margin: 5px;"><a class="navbar-brand d-flex align-items-center" href="/"><span>Computing:Box</span></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
+                <div class="collapse navbar-collapse" id="navcol-5">
+                    <ul class="navbar-nav ms-auto">
+                        <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
+                        <li class="nav-item"><a class="nav-link" href="about">About</a></li>
+                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Binary</a>
+                            <div class="dropdown-menu"><a class="dropdown-item" href="unsigned-binary">Unsigned Integers</a><a class="dropdown-item" href="twos-compliment-binary">Two's Compliment</a></div>
+                        </li>
+                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Hexadecimal</a>
+                            <div class="dropdown-menu"><a class="dropdown-item" href="gcse-hexadecimal">GCSE</a><a class="dropdown-item" href="a-level-hexadecimal">A Level</a></div>
+                        </li>
+                        <li class="nav-item"><a class="nav-link" href="hex-colours">Hex Colours</a></li>
+                        <li class="nav-item dropdown"><a class="dropdown-toggle nav-link" aria-expanded="false" data-bs-toggle="dropdown" data-bs-auto-close="false" href="#">Logic Gates</a>
+                            <div class="dropdown-menu"><a class="dropdown-item" href="not-gate">NOT</a><a class="dropdown-item" href="and-gate">AND</a><a class="dropdown-item" href="or-gate">OR</a><a class="dropdown-item" href="nor-gate">NOR</a><a class="dropdown-item" href="nand-gate">NAND</a><a class="dropdown-item" href="xor-gate">XOR</a><a class="dropdown-item" href="xnor-gate">XNOR</a></div>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+        </nav><!-- End: Site Navigation -->
+    </header>
+    <section class="py-5">
+        <!-- Start: Features Cards -->
+        <div class="container">
+            <div class="row mb-4 mb-lg-5">
+                <div class="col-auto col-sm-auto col-md-8 col-lg-auto col-xl-6 col-xxl-auto text-center mx-auto">
+                    <div class="cc-heading">
+                        <h1 class="fw-bold text-success mb-2">Legal Code</h1><a href="https://www.computingbox.co.uk">Computing:Box</a> © 2024 by <a href="https://git.adcmnetworks.co.uk/alexander.lyall">Alexander Lyall</a> is licensed under <h2><a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International</a></h2><img src="https://mirrors.creativecommons.org/presskit/icons/cc.svg" alt="" style="max-width: 3em;max-height:3em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/by.svg" alt="" style="max-width: 3em;max-height:3em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/nc.svg" alt="" style="max-width: 3em;max-height:3em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/sa.svg" alt="" style="max-width: 3em;max-height:3em;margin-left: .2em;">
+                        <p>The following is a copy of the <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">Original License Deed</a><br>See a copy of the&nbsp;<a href="https://creativecommons.org/licenses/by-nc-sa/4.0/legalcode.en">Original Legal Code</a></p>
+                    </div>
+                </div>
+            </div>
+            <div class="row mx-auto">
+                <div class="col-auto col-sm-auto col-md-auto col-lg-auto col-xl-auto col-xxl-auto d-md-flex align-items-md-end align-items-lg-center mb-5">
+                    <div class="cc-terms">
+                        <div class="alert alert-warning" role="alert">
+                            <h2>About the license and Creative Commons</h2>
+                            <p class="mb-4">Creative Commons Corporation ("Creative Commons") is not a law firm and does not provide legal services or legal advice. Distribution of Creative Commons public licenses does not create a lawyer-client or other relationship. Creative Commons makes its licenses and related information available on an "as-is" basis. Creative Commons gives no warranties regarding its licenses, any material licensed under their terms and conditions, or any related information. Creative Commons disclaims all liability for damages resulting from their use to the fullest extent possible.</p>
+                        </div>
+                        <div class="alert alert-warning" role="alert">
+                            <h2>Using Creative Commons Public Licenses</h2>
+                            <p class="mb-4">Creative Commons public licenses provide a standard set of terms and conditions that creators and other rights holders may use to share original works of authorship and other material subject to copyright and certain other rights specified in the public license below. The following considerations are for informational purposes only, are not exhaustive, and do not form part of our licenses.</p>
+                            <hr>
+                            <h2>Considerations for licensors</h2>
+                            <p class="mb-4">Our public licenses are intended for use by those authorized to give the public permission to use material in ways otherwise restricted by copyright and certain other rights. Our licenses are irrevocable. Licensors should read and understand the terms and conditions of the license they choose before applying it. Licensors should also secure all rights necessary before applying our licenses so that the public can reuse the material as expected. Licensors should clearly mark any material not subject to the license. This includes other CC-licensed material, or material used under an exception or limitation to copyright. More considerations for licensors.</p>
+                            <hr>
+                            <h2>Considerations for the public</h2>
+                            <p>By using one of our public licenses, a licensor grants the public permission to use the licensed material under specified terms and conditions. If the licensor’s permission is not necessary for any reason–for example, because of any applicable exception or limitation to copyright–then that use is not regulated by the license. Our licenses grant only permissions under copyright and certain other rights that a licensor has authority to grant. Use of the licensed material may still be restricted for other reasons, including because others have copyright or other rights in the material. A licensor may make special requests, such as asking that all changes be marked or described. Although not required by our licenses, you are encouraged to respect those requests where reasonable. More considerations for the public.</p>
+                        </div>
+                        <ul class="list-unstyled">
+                            <li><strong>Share</strong>&nbsp;— copy and redistribute the material in any medium or format</li>
+                            <li><strong>Adapt</strong>&nbsp;— remix, transform, and build upon the material</li>
+                            <li>The licensor cannot revoke these freedoms as long as you follow the license terms.</li>
+                        </ul>
+                        <h2>Under the following terms:</h2>
+                        <ul class="list-unstyled">
+                            <li class="cc-by"><strong>Attribution&nbsp;</strong>— You must give&nbsp;<a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en#ref-appropriate-credit">appropriate credit</a>, provide a link to the license, and <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en#ref-indicate-changes">indicate if changes were made</a>. You may do so in any reasonable manner, but not in any way that suggests the licensor endorses you or your use.</li>
+                            <li class="cc-nc"><strong>NonCommercial</strong> — You may not use the material for <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en#ref-commercial-purposes">commercial purposes</a>.</li>
+                            <li class="cc-sa"><strong>ShareAlike</strong> — If you remix, transform, or build upon the material, you must distribute your contributions under the <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en#ref-same-license">same license</a>&nbsp;as the original.</li>
+                            <li><strong>No additional restrictions</strong> — You may not apply legal terms or <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en#ref-technological-measures">technological measures</a>&nbsp;that legally restrict others from doing anything the license permits.</li>
+                        </ul>
+                        <h2>Notices:</h2>
+                        <p class="text-body mb-4">You do not have to comply with the license for elements of the material in the public domain or where your use is permitted by an applicable <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en#ref-exception-or-limitation">exception or limitation</a>.<br><br>No warranties are given. The license may not give you all of the permissions necessary for your intended use. For example, other rights such as <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.en#ref-publicity-privacy-or-moral-rights">publicity, privacy, or moral rights</a>&nbsp;may limit how you use the material.</p>
+                        <div class="alert alert-info" role="alert">
+                            <h2><strong>Notice</strong></h2>
+                            <p>This deed highlights only some of the key features and terms of the actual license. It is not a license and has no legal value. You should carefully review all of the terms and conditions of the actual license before using the licensed material.<br><br><br><br>Creative Commons is not a law firm and does not provide legal services. Distributing, displaying, or linking to this deed or the license that it summarizes does not create a lawyer-client or any other relationship.</p>
+                        </div><a class="fs-5" href="https://creativecommons.org/share-your-work/cclicenses/">Learn more about CC Licensing</a>
+                    </div>
+                </div>
+            </div>
+        </div><!-- End: Features Cards -->
+    </section><!-- Start: Footer Multi Column -->
+    <footer style="background: rgb(45,44,56);">
+        <div class="container py-4 py-lg-5">
+            <div class="row justify-content-center">
+                <!-- Start: About Project -->
+                <div class="col-sm-4 col-md-3 text-center text-lg-start d-flex flex-column">
+                    <div class="fw-bold d-flex align-items-center mb-2"><img src="/assets/img/ComputingBox-Logo.webp?h=6ac4a5bf6a143a74e3e10fd9455bcce1" style="width: 32px;margin: 5px;" width="32" height="32"><span>Computing:Box</span></div>
+                    <p class="text-muted">Computing Concept Simulators</p>
+                </div><!-- End: About Project -->
+            </div>
+            <hr>
+            <div class="col text-center d-block"><a href="https://www.computingbox.co.uk">Computing:Box</a> © 2024 by <a href="https://git.adcmnetworks.co.uk/alexander.lyall">Alexander Lyall</a> is licensed under <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a><br><img src="https://mirrors.creativecommons.org/presskit/icons/cc.svg" alt="" style="max-width: 1.5em;max-height:1.5em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/by.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/nc.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><img src="https://mirrors.creativecommons.org/presskit/icons/sa.svg" alt="" style="max-width: 1.5em;max-height:1em;margin-left: .2em;"><br><a href="copyright">Copyright Notice</a></div>
+            <div class="text-muted d-flex justify-content-center"></div>
+            <p class="mb-0"><noscript><!-- Matomo Image Tracker-->
+<img referrerpolicy="no-referrer-when-downgrade" src="https://analytics.adcmnetworks.co.uk/matomo.php?idsite=2&amp;rec=1" style="border:0" alt="" />
+    <!-- End Matomo --></noscript>Built for UK Computing Curriculum<br>Powered By ADCM Networks</p>
+        </div>
+    </footer><!-- End: Footer Multi Column -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.6/dist/js/bootstrap.bundle.min.js"></script>
+    <script src="/assets/js/binary.js?h=122236ea60351806f6898510a67d196b"></script>
+    <script src="/assets/js/boldAndDark.js?h=78569998362133b84a76614652f3624f"></script>
+    <script src="/assets/js/hexadecimal.js?h=1d88c5f7da86e237fdac8a16a6958a73"></script>
+    <script src="/assets/js/hexColours.js?h=c64f15434dac1c095562a6a5fe8b155b"></script>
+    <script src="/assets/js/logicGates.js?h=cb132aa615fb58918ab65db03c7face7"></script>
+</body>
+
+</html>