remove github actions

test content
update
2025-06-22 12:33:54 +03:00 · 2025-06-22 12:31:10 +03:00 · 2025-06-18 13:19:50 +03:00 · 2025-05-25 17:48:16 +03:00 · 2025-05-25 17:47:06 +03:00 · 2025-05-25 17:34:15 +03:00
224 changed files with 1524 additions and 8669 deletions
--- a/.github/workflows/tf_update_dev.yml
+++ b/.github/workflows/tf_update_dev.yml
@ -1,46 +0,0 @@
 name: www2.threefold_io
 on: 
  push:
    branches: [ development ]
 jobs:
  deploy:
    name: Deploy
    runs-on: ubuntu-latest
    steps:
    - name: pushing latest change on www2.threefold.io
      uses: appleboy/ssh-action@master
      with:
        host: dev.threefold.io
        username: webuser
        key: ${{ secrets.TF_SECRET }}
        port: 34022
        script: |
          cd websites/www2/www_threefold_io/
          git log -1
          git fetch
          git reset --hard origin/development
          sed -i "s/https:\/\/www.threefold.io/https:\/\/dev.threefold.io/g" config.toml
          ./build.sh
  wait:
    needs: deploy
    name: Wait for Website Update
    runs-on: ubuntu-latest
    steps:
    - name: Wait Period
      id: wait-deploy
      run: |
        echo "Sleeping for 30"
        sleep 30
  checklinks:
    needs: wait
    name: Check for Broken Links
    runs-on: ubuntu-latest
    steps:
      - name: Check for Broken Links
        id: link-report
        uses: docker://ghcr.io/threefoldfoundation/website-link-checker:latest
        with:
          args: 'https://www2.threefold.io -w 404'
--- a/.github/workflows/tf_update_prod.yml
+++ b/.github/workflows/tf_update_prod.yml
@ -1,46 +0,0 @@
 name: www.threefold_io
 on: 
  push:
    branches: [ master ]
 jobs:
  deploy:
    name: Deploy
    runs-on: ubuntu-latest
    steps:
    - name: pushing latest change on www.threefold.io
      uses: appleboy/ssh-action@master
      with:
        host: www.threefold.io
        username: root
        key: ${{ secrets.TF_SECRET }}
        port: 22
        script: |
          cd /opt/www_threefold_io/
          git log -1
          git fetch
          git reset --hard origin/master
          sed -i "s/https:\/\/dev.threefold.io/https:\/\/www.threefold.io/g" config.toml
          ./build.sh
  wait:
    needs: deploy
    name: Wait for Website Update
    runs-on: ubuntu-latest
    steps:
    - name: Wait Period
      id: wait-deploy
      run: |
        echo "Sleeping for 30"
        sleep 30
  checklinks:
    needs: wait
    name: Check for Broken Links
    runs-on: ubuntu-latest
    steps:
      - name: Check for Broken Links
        id: link-report
        uses: docker://ghcr.io/threefoldfoundation/website-link-checker:latest
        with:
          args: 'https://www.threefold.io -w 404'
--- a/.github/workflows/update_dev2.yml
+++ b/.github/workflows/update_dev2.yml
@ -1,46 +0,0 @@
 name: www3.threefold_io
 on: 
  push:
    branches: [ development_sasha ]
 jobs:
  deploy:
    name: Deploy
    runs-on: ubuntu-latest
    steps:
    - name: pushing latest change on www3.threefold.io
      uses: appleboy/ssh-action@master
      with:
        host: www3.threefold.io
        username: webuser
        key: ${{ secrets.TF_SECRET }}
        port: 34022
        script: |
          cd websites/tmp/www_threefold_io/
          git log -1
          git restore .
          git pull
          sed -i "s/https:\/\/dev.threefold.io/https:\/\/dev2.threefold.io/g" config.toml
          bash build.sh
  wait:
    needs: deploy
    name: Wait for Website Update
    runs-on: ubuntu-latest
    steps:
    - name: Wait Period
      id: wait-deploy
      run: |
        echo "Sleeping for 30"
        sleep 30
  checklinks:
    needs: wait
    name: Check for Broken Links
    runs-on: ubuntu-latest
    steps:
      - name: Check for Broken Links
        id: link-report
        uses: docker://ghcr.io/threefoldfoundation/website-link-checker:latest
        with:
          args: 'https://www3.threefold.io -w 404'
--- a/.github/workflows/update_www3.yml
+++ b/.github/workflows/update_www3.yml
@ -1,46 +0,0 @@
 name: www3.threefold_io
 on: 
  push:
    branches: [ 3.10.0 ]
 jobs:
  deploy:
    name: Deploy
    runs-on: ubuntu-latest
    steps:
    - name: pushing latest change on www3.threefold.io
      uses: appleboy/ssh-action@master
      with:
        host: www3.threefold.io
        username: webuser
        key: ${{ secrets.TF_SECRET }}
        port: 34022
        script: |
          cd websites/www3/www_threefold_io/
          git log -1
          git restore .
          git pull
          sed -i "s/https:\/\/www.threefold.io/https:\/\/www3.threefold.io/g" config.toml
          bash build.sh
  wait:
    needs: deploy
    name: Wait for Website Update
    runs-on: ubuntu-latest
    steps:
    - name: Wait Period
      id: wait-deploy
      run: |
        echo "Sleeping for 30"
        sleep 30
  checklinks:
    needs: wait
    name: Check for Broken Links
    runs-on: ubuntu-latest
    steps:
      - name: Check for Broken Links
        id: link-report
        uses: docker://ghcr.io/threefoldfoundation/website-link-checker:latest
        with:
          args: 'https://www3.threefold.io -w 404'
--- a/_archive/team.html
+++ b/_archive/team.html
@ -1,69 +0,0 @@
 <div class="bg-transparent relative isolate overflow-hidden py-12">
    <div class="mx-auto max-w-7xl px-6 lg:px-8">
      <div class="mx-auto max-w-2xl lg:max-w-none">
        <div class="text-center">
          <h2 class="fade-in text-balance text-4xl font-normal tracking-tight text-black lg:text-5xl">The Team Behind ThreeFold</h2>
          <p class="mx-auto mt-4 max-w-3xl text-pretty lg:text-2xl text-xl font-medium text-gray-200 fade-in">Founded by Internet Pioneers 1.0</p>
          <p class="mx-auto mb-10 mt-6 max-w-4xl text-pretty lg:text-xl text-lg font-light text-gray-200 fade-in">We are a dedicated group committed to advancing a new digital era. Some of us have been working on Internet technology since the early days, when it was a decentralized network. We aim to help bring that vision to life once more. Beyond those below, we have more than 50 engineers, developers, and other team members supporting the project.</p>
        </div>
        <div class="mt-12 grid grid-cols-1 gap-x-4 lg:gap-y-10 lg:gap-x-8 lg:grid-cols-4 gap-y-0">
            <!-- Team Member -->
            <div class="group relative fade-in mb-8">
              <div class="h-56 w-full overflow-hidden rounded-md bg-gray-200 group-hover:opacity-75 lg:h-72 xl:h-80">
                <img src="/images/kds.png" alt="kristof_de_spiegeleer" class="size-full object-cover">
              </div>
              <h3 class="mt-4 text-xl font-semibold text-black">
                  Kristof de Spiegeleer
              </h3>
              <p class="text-md text-gray-300">Co-founder & CEO</p>
              <p class="mt-1 text-sm font-light  text-black">
                Serial entrepreneur with 30 years of experience in Internet infrastructure and cloud technology. Passionate about tech for good. +600m $ exits.</p>
            </div>
            <!-- Team Member -->
              <div class="group relative fade-in mb-8">
                <div class="h-56 w-full overflow-hidden rounded-md bg-gray-200 group-hover:opacity-75 lg:h-72 xl:h-80">
                  <img src="/images/adnan.png" alt="adnan_fatayerji" class="size-full object-cover">
                </div>
                <h3 class="mt-4 text-xl font-semibold text-black">
                    Adnan Fatayerji
                </h3>
                <p class="text-md text-gray-300">Co-founder</p>
                <p class="mt-1 text-sm font-light  text-black">
                  Tech entrepreneur with multiple exits. Based in Dubai for 20 years. Head of Partnerships and Business Development..</p>
              </div>
                <!-- Team Member -->
              <div class="group relative fade-in mb-8">
                <div class="h-56 w-full overflow-hidden rounded-md bg-gray-200 group-hover:opacity-75 lg:h-72 xl:h-80">
                  <img src="/images/jan.png" alt="jan_de_landtsheer" class="size-full object-cover">
                </div>
                <h3 class="mt-4 text-xl font-semibold text-black">
                    Jan De Landtsheer
                </h3>
                <p class="text-md text-gray-300">Co-founder & CTO</p>
                <p class="mt-1 text-sm font-light  text-black">
                  Engineer with 40+ years of experience in deep tech, networking, cloud and storage.</p>
              </div>
                    <!-- Team Member -->
              <div class="group relative fade-in mb-8">
                <div class="h-56 w-full overflow-hidden rounded-md bg-gray-200 group-hover:opacity-75 lg:h-72 xl:h-80">
                  <img src="/images/flo.png" alt="florian_fournier" class="size-full object-cover">
                </div>
                <h3 class="mt-4 text-xl font-semibold text-black">
                    Florian Fournier
                </h3>
                <p class="text-md text-gray-300">Co-founder & CMO</p>
                <p class="mt-1 text-sm font-light  text-black">
                  Ex Apple marketing director, serial entrepreneur living between Africa and Latin America.</p>
              </div>
          </div>
     </div>
     <div class="mt-8 flex items-center justify-center gap-x-6 fade-in">
        <a href="/people" class="fade-in rounded-2xl bg-white px-4 py-2.5 text-sm font-semibold text-black shadow-sm hover:bg-gray-200 hover:text-gray-800 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-offset-2">Meet the Team</a>
      </div>
 </div>
--- a/config.toml
+++ b/config.toml
@ -6,12 +6,12 @@ title = "Mycelium"
 description = "Our global digital backbone"
 # When set to "true", a feed is automatically generated.
-generate_feed = true
+# generate_feed = true
 # The filename to use for the feed. Used as the template filename, too.
 # Defaults to "atom.xml", which has a built-in template that renders an Atom 1.0 feed.
 # There is also a built-in template "rss.xml" that renders an RSS 2.0 feed.
-feed_filename = "atom.xml"
+# feed_filename = "atom.xml"
 # The number of articles to include in the feed. All items are included if
 # this limit is not set (the default).
@ -51,8 +51,8 @@ external_links_no_referrer = true
 # For example, `...` into `…`, `"quote"` into `“curly”` etc
 smart_punctuation = true
-[build]
+#[build]
-not_found = "404.md"
+#not_found = "404.md"
 [[taxonomies]]
 name = "categories"
--- a/content/_index.md
+++ b/content/_index.md
@ -1,12 +1,12 @@
 ---
 title: "Mycelium"
 description: "Mycelium is a decentralized networking and storage solution designed to integrate seamlessly with AI workloads, content delivery, and messaging. " # quotation marks to allow colons where used
-date: 2018-09-14T21:00:00-05:00
+#date: 2018-09-14T21:00:00-05:00
-updated: 2021-02-20T14:40:00-06:00
+#updated: 2021-02-20T14:40:00-06:00
 draft: false
 extra:
-  author: ThreeFold
+  author: Mycelium
-  imgPath: home/tf.png
+  imgPath: home/mycel2.png
 ---
@ -48,13 +48,7 @@ ThreeFold is a peer-to-peer open-source Internet platform that connects users di
 <!-- section 2 (Map) -->
 {% grid_stats() %}
 ### The ThreeFold Grid v3.7.0
 ## **Live and Operational**
 {% end %}
 <!-- section 3 (EXPAND) -->
@ -111,7 +105,7 @@ True digital sovereignty for open-source builders. The ThreeFold Grid provides l
 |||
-<button>[The Manual](https://manual.grid.tf/)</button>
+<button>[The Manual](https://threefold.info/mycelium/docs/)</button>
 |||
@ -121,19 +115,11 @@ True digital sovereignty for open-source builders. The ThreeFold Grid provides l
 <!-- section 4 (FEATURED STORIES) -->
 {% featured_stories() %}
 ## Featured Stories
 {% end %}
 <!-- section 5 (THE TEAM) -->
 {% team_sec() %}
 ## **The Team**
 {% end %}
 <!-- section 6 (PARTNERS) -->
--- a/content/about/index.md
+++ b/content/about/index.md
@ -1,7 +1,7 @@
 ---
 title: "Mycelium"
 description: "Mycelium is a decentralized networking and storage solution designed to integrate seamlessly with AI workloads, content delivery, and messaging." # quotation marks to allow colons where used
-template: "layouts/about.html"
+template: "page.html"
 insert_anchor_links: "left"
 extra:
 author: ThreeFold
@ -10,21 +10,101 @@ extra:
 <!--
  This page is made by combining different 'section' (partial html pages) together. 
  To edit the page content, please go to specific 'section' that you would like to edit (stored inside templates/partials folders).
  To see the list of the section blocks in this page, add or remove some of the partial pages, 
  go to: static/templates/layouts/why.html.
 ABOUT / WHY PAGE (static/templates/layouts/why.html) contains:
  1. About hero section: "templates/partials/about/about1.html"
  2.  benefit1 section: "templates/partials/about/about2.html"
  3. benefit2 section: "templates/partials/about/about3.html"
  4.  benefit3 new section: "templates/partials/about/about4.html"
  5. tf section: "templates/partials/about/about5.html"
  6. faq section: "templates/partials/about/about6.html"
  7. cta section: "templates/partials/hero/myhero7.html"
- -->
+<!-- section 1 -->
 {{ hero_right_img(
    image_src="/images/mycel5.jpg",
    image_alt="Mobile App Screenshot",
    title="About Mycelium",
    subtitle="Redefining Digital Communication",
    description_1="Mycelium is designed to improve how we connect and communicate in the digital world. Its goal is to create a secure, efficient, and scalable digital ecosystem where data flows seamlessly and remains protected.",
    description_2="We aim to build a system that adapts to our growing digital needs while promoting sustainability and security."
 ) }}
 <!-- section 2 -->
 {{ desciption_blockquote(
    title="Our Technology",
    description_1="Mycelium enables secure, efficient, and scalable data transfer between network nodes by optimizing data routing. It ensures that information takes the shortest path with the lowest latency, resulting in faster and more efficient communication.",
    description_2="The technology relies on end-to-end encryption, with each node uniquely identified by its own key pair, guaranteeing the security and privacy of data. This approach ensures that data remains confidential and authentic, strengthening the overall privacy and integrity of the network.",
    description_3="Mycelium was created to overcome the limitations of traditional networking protocols while promoting a more sustainable and eco-friendly digital ecosystem. Its goal is to transform digital communication, making it not only efficient and secure but also environmentally responsible.",
    description_4="The inspiration behind Mycelium comes from the need for a technology that can adapt to changing network conditions and continue to operate efficiently in a rapidly evolving digital landscape."
 ) }}
 <!-- section 3 -->
 {{ text_left_img(
    image_src="/images/efficient.jpeg",
    image_alt="Discover Mycelium",
    title="Highly Efficient",
    subheader="BENEFITS",
    subtitle="Optimizing Data Routing",
    description="Mycelium's routing algorithms prioritize minimizing latency in data transfer. This ensures that data takes the most direct and efficient route, reducing the time it takes to travel from the source node to the destination node.",
    description_2="",
    button_text="",
    button_link=""
 ) }}
 <!-- section 4 -->
 {{ text_right_img(
    image_src="/images/security.jpeg",
    image_alt="Discover Mycelium",
    title="Enhancing Security",
    subheader="BENEFITS",
    subtitle="End-to-End Encryption",
    description="Each node in the Mycelium network is assigned a unique key pair, consisting of a public and private key. The public key is used to encrypt data intended for that node, while the private key decrypts the data upon receipt. This cryptographic system ensures that only the intended recipient can access the information.",
    description_2="When one node sends data to another within the Mycelium network, the data is encrypted with the recipient's public key. This ensures that even if the data is intercepted during transmission, it remains secure and unreadable without the corresponding private key.",
    button_text="",
    button_link=""
 ) }}
 <!-- section 5 -->
 {{ text_left_img(
    image_src="/images/scalability.jpeg",
    image_alt="Discover Mycelium",
    title="Enhances Scalability",
    subheader="BENEFITS",
    subtitle="Designed to Adapt",
    description="Mycelium is an open-source project built to adapt dynamically to changing network conditions. As new nodes join or existing nodes leave, the system adjusts seamlessly, allowing Mycelium to scale and support more participants without sacrificing performance.",
    description_2="The system is designed to efficiently distribute network traffic. During periods of high demand or increased data transfer, Mycelium balances the load by routing data through multiple paths or nodes. This ensures the network can handle greater traffic and more users without becoming overloaded.",
    button_text="",
    button_link=""
 ) }}
 <!-- section 6 -->
 {{ text_center(
    title="A Part of ThreeFold Ecosystem",
    subheader="BENEFITS",
    subtitle="An Integral Component of Sustainable Decentralization",
    description="Mycelium seamlessly integrates into the larger ThreeFold ecosystem, driving the shift toward sustainable and decentralized digital transformation. As a core pillar, it enhances the ThreeFold Grid with efficient, secure, and scalable networking solutions, contributing to a future where digital connectivity is both eco-conscious and accessible to all."
 ) }}
 <!-- section 6 -->
 {{ cta(
    image_src="/images/mycel3.png",
    image_alt="App screenshot",
    title="Get Mycelium Today",
    description="Join the Mycelium network and be a part of the decentralized movement.",
    button_text="Download Now",
    button_link="/download",
    button_text2="Read More",
    button_link2="https://threefold.info/mycelium/docs/"
 ) }}
--- a/content/download/index.md
+++ b/content/download/index.md
@ -1,7 +1,7 @@
 ---
 title: "Download now"
 description: "Mycelium is a decentralized networking and storage solution designed to integrate seamlessly with AI workloads, content delivery, and messaging."
-template: "layouts/download.html"
+template: "page.html"
 insert_anchor_links: "left"
 extra:
@ -9,16 +9,138 @@ extra:
 imgPath: mycel2.png
 ---
 {{ left_header(
    subtitle="",
    subtitle_2="Nature's Blueprint for Digital Connectivity",
    title="Download Mycelium",
    description="Get Mycelium for Android, Windows, macOS, and iOS to securely connect, store, and interact with the decentralized network—seamlessly and efficiently.",
    description3="Not sure how it works?",
    button_link="https://threefold.info/mycelium/docs/",
    button_text="Read the manual." 
 ) }}
-<!--
+<div class="lg:max-w-7xl container mx-auto lg:pb-24 pb-12">
-  This page is made by combining different 'section' (partial html pages) together. 
+<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4 m mt-10 y-12">
-  To edit the page content, please go to specific 'section' that you would like to edit (stored inside templates/partials folders).
+{{ 
-  To see the list of the section blocks in this page, add or remove some of the partial pages, 
+    feature_card(
-  go to: static/templates/layouts/index.html.
+        title="Download for iOS & MacOS", 
        description="Download Mycelium App from the Apple Store.", 
        icon="/images/icons/apple.svg",
        link="https://apps.apple.com/us/app/mycelium-network/id6504277565",
        link_name="Download Now"
 ) }}
 HOMEPAGE (static/templates/layouts/download.html) contains:
  1. Hero section: "templates/partials/download/download1.html
  2. faq section: "templates/partials/hero/myhero6.html"
 3. cta section: "templates/partials/hero/myhero7.html"
 {{ feature_card(
    title="Download for Windows
 ", 
    description="Download the Mycelium App for Windows directly from its Github repository.", 
    icon="/images/icons/windows.svg",
    link="https://github.com/threefoldtech/myceliumflut/releases",
    link_name="Download Now"
    ) }}
 {{ feature_card(
    title="Download for Android", 
    description="Download Mycelium from the Google Play Store.", 
    icon="/images/icons/android.svg",
    link="https://play.google.com/store/apps/details?id=tech.threefold.mycelium&pli=1",
    link_name="Download Now"
    ) }}
 {{ feature_card(
    title="Download for Linux", 
    description="Download the Mycelium binary for Linux directly from its Github repository.", 
    icon="/images/icons/linux.png",
    link="https://github.com/threefoldtech/mycelium/releases/tag/v0.6.1",
    link_name="Download Now"
    ) }}
 </div>
 </div>
 <!-- Section 7 -->
 <div class="lg:max-w-7xl container mx-auto lg:pb-24 pb-12">
 {{ left_header(
    subtitle="",
    title="Frequently Asked Questions",
    description="",
    description2=""
 ) }}
 <br>
 {{ accordion(
    id_accordion="accordion1"
    question="What is Mycelium?",
    description="Mycelium is an end-to-end encrypted IPv6 overlay network written in Rust. Each node joining the network receives an IP in the 400::/7 range, facilitating secure and private communications."
 ) }}
 {{ accordion(
    id_accordion="accordion2"
    question="Is mycelium ready to scale to the world?",
    description="No, Mycelium is not yet fully scalable to a global level. Currently, each network can support around 100,000 users, but multiple networks can be deployed to expand capacity. We anticipate resolving these scalability challenges by 2025."
 ) }}
 {{ accordion(
    id_accordion="accordion3"
    question="How do I install Mycelium?",
    description="The Mycelium app supports iOS, macOS, Android and Windows. For Linux, a binary is available. Installation guides are available for both local machines and virtual machines running on the TFGrid. Note that Windows users need to have wintun.dll in the same directory as the Mycelium executable."
 ) }}
 {{ accordion(
    id_accordion="accordion4"
    question="How can I find and use my Mycelium address?",
    description="Upon using the Mycelium app, you're assigned a unique Mycelium address. To copy this address, click the button located to the right of the displayed address in the app interface."
 ) }}
 {{ accordion(
    id_accordion="accordion5"
    question="Can I deploy workloads on the TFGrid using Mycelium?",
    description="Yes, after installing Mycelium, you can deploy workloads on the TFGrid and connect to them using the Mycelium network. Detailed deployment guides are available in the documentation."
 ) }}
 {{ accordion(
    id_accordion="accordion6"
    question="Is there an API available for Mycelium?",
    description="Yes, Mycelium offers an API for administrative operations, peer management, and message subsystem operations. Comprehensive API documentation can be found in the official Mycelium GitHub repository"
    )
    }}
 {{ accordion(
    id_accordion="accordion7"
    question="What should I do if I encounter issues during installation or usage?",
    description="If you face any challenges, refer to the troubleshooting section in the Mycelium documentation. Additionally, ensure that all prerequisites are met, such as having wintun.dll in the correct directory for Windows installations."
    )
    }}
 {{ accordion(
    id_accordion="accordion8"
    question="How does Mycelium handle routing within its network?",
    description="Mycelium incorporates core principles of the Babel routing protocol, enabling efficient and dynamic routing within its encrypted IPv6 overlay network."
    )
    }}
 </div>
 <!-- Section 8 -->
 {{ cta(
    image_src="/images/mycel3.png",
    image_alt="App screenshot",
    title="Get Mycelium Today",
    description="Join the Mycelium network and be a part of the decentralized movement.",
    button_text="Download Now",
    button_link="/download",
    button_text2="Read More",
    button_link2="https://threefold.info/mycelium/docs/"
 ) }}
--- a/content/footer/_index.md
+++ b/content/footer/_index.md
@ -10,11 +10,11 @@ extra:
 {% row(style="lean") %}
-##### <span class="text-black">TAKE ACTIONS</span>
+##### <span class="">TAKE ACTIONS</span>
 <br>
-###### [Manual](https://manual.grid.tf/)
+###### [Manual](https://threefold.info/mycelium/docs/)
 ###### [Dashboard](https://dashboard.grid.tf/)
@ -24,7 +24,7 @@ extra:
 |||
-##### <span class="text-black">ABOUT US</span>
+##### ABOUT US
 <br>
--- a/content/header/_index_copy.md
+++ b/content/header/_index_copy.md
@ -1,84 +0,0 @@
 ---
 title: "Header"
 description: "NEAR is on a mission to empower everyone to take back control of their money, their data, and their identity. Join us."
 insert_anchor_links: "left"
 template: "partials/header.html"
 extra:
  logoPath: "images/ourworld_logo2.png"
  imgPath: ""
 ---
 - Learn
 {% row(style="lean") %}
 ### PURPOSE
 <br>
 <br>
 #### [The Internot](/apage)
 Whats wrong with the [internet](/apage)
 <br>
 #### Our Internet
 Vision for the new internet
 |||
 ### ECOSYSTEM
 <br>
 <br>
 #### OurWorld DAO
 Be a part of governance
 <br>
 #### Communities
 Explore communities in OurWorld
 <br>
 #### DAOs
 Decentralized autonomous organizations
 |||
 ### APPLICATIONS
 <br>
 <br>
 #### DAPPs
 Decentralized applications
 <br>
 #### Projects
 Projects in OurWorld
 |||
 ### FEATURED
 <br>
 <br>
 #### OurWorld is Live
 Be a part of the new internet
 - [Join us]("/join-us")
 - [Blog]("/blog")
 {% end %}
--- a/content/header/index.md
+++ b/content/header/index.md
@ -3,11 +3,12 @@ title: "Header"
 insert_anchor_links: "left"
 template: "partials/header.html"
 extra:
-  logoPath: "images/new_logo_tft.png"
+  logoPathLight: "images/mycelium_white.png"
  logoPathDark: "images/mycelium_dark.png"
 ---
 - [About]("/about")
- [Docs]("https://manual.threefold.io/documentation/system_administrators/mycelium/mycelium_app.html")
+- [Docs]("https://threefold.info/mycelium/docs/")
--- a/content/home/index.md
+++ b/content/home/index.md
@ -3,25 +3,327 @@ title: "Mycelium"
 description: "Mycelium is a decentralized networking and storage solution designed to integrate seamlessly with AI workloads, content delivery, and messaging." 
 insert_anchor_links: "left"
 extra:
- author: ThreeFold
+ author: Mycelium
 imgPath: home/mycel2.png
 ---
-<!--
+<!-- Hero section 1 -->
  This page is made by combining different 'section' (partial html pages) together. 
  To edit the page content, please go to specific 'section' that you would like to edit (stored inside templates/partials folders).
  To see the list of the section blocks in this page, add or remove some of the partial pages, 
  go to: static/templates/layouts/index.html.
-HOMEPAGE (static/templates/layouts/index.html) contains:
+{{ hero(
    image_src="/images/mycel_1.png",
    image_alt="Mycelium Network Graphic",
    title="MYCELIUM",
    subtitle="Unleashing the Power of Decentralized Networks",
    description="Discover Mycelium, an end-to-end encrypted IPv6 overlay network. The future of secure, efficient, and scalable networking.",
    highlight="Coming Soon: New Decentralized Features",
    button_text="Get Mycelium",
    button_link="/download"
 ) }}
 <!-- section 2 -->
 {{ text_right_img(
    image_src="/images/mycel2.png",
    image_alt="Discover Mycelium",
    title="Discover Mycelium",
    subheader="ABOUT",
    description="Mycelium is an unbreakable network, always finding the shortest path and providing 100% secure, peer-to-peer communication. But this is just the beginning.",
    description_2="Our mission is to create a sustainable digital ecosystem where communication is seamless, data is secure, and scalability knows no bounds.",
    button_text="Learn more",
    button_link="/about"
 ) }}
 <!-- section 3 -->
 {{ hero_features(
    image_src="/images/feature6a.png",
    image_alt="How Mycelium Operates",
    subtitle_1="HOW IT WORKS",
    title="How Mycelium Operates",
    description="Mycelium, like its natural namesake, thrives on decentralization, efficiency, and security, making it a truly powerful force in the world of decentralized networks.",
    feature_1_title="Decentralized Nodes",
    feature_1_description="Mycelium operates through a network of decentralized nodes, similar to how nature's mycelium forms a decentralized network of threads. Each node acts as a connection point in the overall digital ecosystem.",
    feature_2_title="Efficient Data Routing",
    feature_2_description="Mycelium optimizes data routing by choosing the most efficient path for communication. Data travels along the shortest path in terms of latency, ensuring that information reaches its destination swiftly.",
    feature_3_title="End-to-End Encryption",
    feature_3_description="Each node in the system is identified by a unique key pair. Data between nodes is encrypted using secret keys derived from these pairs. This ensures that data remains confidential, enhancing the privacy of the network."
 ) }}
 <!-- Section 4 -->
 {{ left_header(
    subtitle="WHAT IT ENABLES",
    title="Powering Secure & Decentralized Connectivity",
    description="Mycelium, a key component of the ThreeFold Grid, can be installed on any computer (macOS, Linux, Windows) and smartphone (iOS, Android). With seamless integration, it enables secure and private communication across devices.",
    description2="The ThreeFold Dashboard offers dozens of applications with built-in Mycelium support, making it easy to deploy and utilize. Once installed, Mycelium provides a secure, encrypted network for a wide range of use cases, from private communication to decentralized infrastructure."
 ) }}
 <div class="lg:max-w-7xl container mx-auto py-12 lg:pb-24 px-4">
 <div class="mx-auto grid grid-cols-1 gap-x-6 gap-y-10 text-base sm:grid-cols-2 lg:mx-0 lg:max-w-none lg:grid-cols-2 lg:gap-x-8 lg:gap-y-8">
 <div class="relative my-4 ">
 ######  **PRODUCTIVITY & COMMUNICATION**
 <div class="mt-1">
 - Secure remote work collaboration.
 - Private file sharing between trusted nodes.
 - Encrypted voice/video calls.
 - Self-hosted messaging systems.
 - Secure document collaboration.
 </div>
 </div>
 <div class="relative my-4 ">
 ######  **INFRASTRUCTURE**
 <div class="mt-1">
 - Private cloud computing resources.
 - Secure IoT device networks.
 - Remote system administration..
 - Virtual private networks (VPNs).
 - Secure backup systems.
 </div>
 </div>
 <div class="relative my-4 ">
 ######  **SERVICES**
 <div class="mt-1">
 - Self-hosted web services.
 - Private file sharing between trusted nodes.
 - Private DNS systems.
 - Personal email servers.
 - Secure document collaboration.
 </div>
 </div>
 <div class="relative my-4">
 ###### **MEDIA & CONTENT**
 <div class="mt-1">
 - Private media streaming.
 - Personal cloud storage.
 - Protected content distribution.
 - Secure game servers.
 - Private git repositories.
 </div>
 </div>
 </div>
 <br>
 ---------------------------------------------
 <div class="mx-auto mt-10 px-6 lg:px-0 lg:max-w-6xl">
      <a href="/download" class=" rounded-2xl bg-black border border-gray-50 px-6 py-2 text-sm font-semibold text-white shadow-xs hover:bg-gray-900 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-200">Get Started</a>
 </div>
 </div>
 <!-- Section 5 -->
 {{ hero_bottom_img(
    image_src="/images/future.png",
    image_alt="Coming Soon: The Future of Mycelium",
    subtitle="WHAT'S NEW",
    title="Coming Soon: The Future of Mycelium",
    description="Mycelium is evolving to bring even more powerful decentralized features, designed to enhance your experience and expand possibilities. Be the first to explore what's coming next by staying connected with our latest updates."
 ) }}
 <div class="lg:max-w-7xl container mx-auto lg:pb-24 pb-12">
 <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 mt-10 my-12">
 {{ 
   feature_card(
    title="✓ Quantum Safe Storage Functionality", 
    description="Mycelium's quantum safe storage enables flexible, scalable, and efficient data distribution across a decentralized network, ensuring redundancy and security.", 
    icon="") }}
 {{ feature_card(
    title="✓ Entry and Exit Points for AI Workloads", 
    description="Seamlessly connect AI applications to Mycelium, providing optimized nd secured data pipelines for training, inference, and real-time processing.", 
    icon="") }}
 {{ feature_card(
    title="✓ Data Storage and Retrieval Mechanisms", 
    description="Users can choose between storing data locally for quick access or utilizing the distributed grid for enhanced scalability and resilience.", 
    icon="") }}
 {{ feature_card(
    title="✓ Integrated Name Services (DNS)", 
    description="The Integrated DNS system efficiently finds the shortest path between users and websites, automatically balancing loads and identifying alternative routes in case of internet issues.", 
    icon="") }}
 {{ feature_card(
    title="✓ Frontend/Backend Integration", 
    description="Mycelium provides seamless integration with existing applications, enabling developers to leverage decentralized storage across both frontend and backend architectures.", 
    icon="") }}
 {{ feature_card(
    title="✓ CDN (Content Delivery Network)", 
    description="Mycelium accelerates data distribution by acting as a decentralized CDN, ensuring fast, secure, and efficient content delivery across global nodes with minimal latency.", 
    icon="") }}
 </div>
 </div>
 <!-- Section 6 -->
 {{ left_header(
    subtitle="BENEFITS",
    title="Nature's Blueprint for Digital Connectivity",
    description="Just as nature's mycelium network serves as a critical component in the ecosystems of forests, connecting trees and plants underground, the Mycelium technology offers reliable connectivity in an efficient and resilient way.",
    description2=""
 ) }}
 <div class="lg:max-w-7xl container mx-auto lg:pb-24 pb-12">
 <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 mt-10 my-12">
 {{ 
    feature_card(
        title="Decentralization", 
        description="Designed to operate in a decentralized manner, it connects nodes and enables efficient data transfer and communication without relying on a single central authority.", 
        icon="/images/decentralization.svg",
        link="/about",
        link_name="Learn More"
 ) }}
 {{ feature_card(
    title="Efficiency", 
    description="Mycelium provides an efficient digital communication network where data travels along the most efficient paths, reducing latency and optimizing resource utilization.", 
    icon="/images/efficiency.svg",
    link="/about",
    link_name="Learn More"
    ) }}
 {{ feature_card(
    title="Resilience", 
    description="Inspired by nature's resilience, it creates a network that can adapt and continue to function even in the presence of challenges, ensuring uninterrupted communication.", 
    icon="/images/resilience.svg",
    link="/about",
    link_name="Learn More"
    ) }}
 </div>
 </div>
 <!-- Section 7 -->
 <div class="lg:max-w-7xl container mx-auto lg:pb-24 pb-12">
 {{ left_header(
    subtitle="",
    title="Frequently Asked Questions",
    description="",
    description2=""
 ) }}
 <br>
 {{ accordion(
    id_accordion="accordion1"
    question="What is Mycelium?",
    description="Mycelium is an end-to-end encrypted IPv6 overlay network written in Rust. Each node joining the network receives an IP in the 400::/7 range, facilitating secure and private communications."
 ) }}
 {{ accordion(
    id_accordion="accordion2"
    question="Is mycelium ready to scale to the world?",
    description="No, Mycelium is not yet fully scalable to a global level. Currently, each network can support around 100,000 users, but multiple networks can be deployed to expand capacity. We anticipate resolving these scalability challenges by 2025."
 ) }}
 {{ accordion(
    id_accordion="accordion3"
    question="How do I install Mycelium?",
    description="The Mycelium app supports iOS, macOS, Android and Windows. For Linux, a binary is available. Installation guides are available for both local machines and virtual machines running on the TFGrid. Note that Windows users need to have wintun.dll in the same directory as the Mycelium executable."
 ) }}
 {{ accordion(
    id_accordion="accordion4"
    question="How can I find and use my Mycelium address?",
    description="Upon using the Mycelium app, you're assigned a unique Mycelium address. To copy this address, click the button located to the right of the displayed address in the app interface."
 ) }}
 {{ accordion(
    id_accordion="accordion5"
    question="Can I deploy workloads on the TFGrid using Mycelium?",
    description="Yes, after installing Mycelium, you can deploy workloads on the TFGrid and connect to them using the Mycelium network. Detailed deployment guides are available in the documentation."
 ) }}
 {{ accordion(
    id_accordion="accordion6"
    question="Is there an API available for Mycelium?",
    description="Yes, Mycelium offers an API for administrative operations, peer management, and message subsystem operations. Comprehensive API documentation can be found in the official Mycelium GitHub repository"
    )
    }}
 {{ accordion(
    id_accordion="accordion7"
    question="What should I do if I encounter issues during installation or usage?",
    description="If you face any challenges, refer to the troubleshooting section in the Mycelium documentation. Additionally, ensure that all prerequisites are met, such as having wintun.dll in the correct directory for Windows installations."
    )
    }}
 {{ accordion(
    id_accordion="accordion8"
    question="How does Mycelium handle routing within its network?",
    description="Mycelium incorporates core principles of the Babel routing protocol, enabling efficient and dynamic routing within its encrypted IPv6 overlay network."
    )
    }}
 </div>
 <!-- Section 8 -->
 {{ cta(
    image_src="/images/mycel3.png",
    image_alt="App screenshot",
    title="Get Mycelium Today",
    description="Join the Mycelium network and be a part of the decentralized movement.",
    button_text="Download Now",
    button_link="/download",
    button_text2="Read More",
    button_link2="https://threefold.info/mycelium/docs/"
 ) }}
 <style scope>
  ul {
  list-style: circle;
  margin: 0;
  padding: 0;
 }
  </style>
  1. Hero section: "templates/partials/hero/myhero.html
  2. About section: "templates/partials/hero/myhero1.html"
  3. How it works section: "templates/partials/hero/myhero3.html"
  4. whats new section: "templates/partials/hero/myhero5.html
  5. benefits section: "templates/partials/hero/myhero2.html"
  6. faq section: "templates/partials/hero/myhero6.html"
  6. cta section: "templates/partials/hero/myhero7.html"
 -->
--- a/css/index.css
+++ b/css/index.css
@ -4,7 +4,7 @@
 /*! purgecss end ignore */
@import "tailwindcss/base";
-@import "layout.css";
+
@import "tailwindcss/components";
@import "admonition.css";
@import "tailwindcss/utilities";
@ -12,11 +12,90 @@
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
-.dashboard:hover {
+/* Defaul lightMode */
-
+body {
-  background: #74ddc3 !important;
+  background-color: #ffffff;
  color: #000000;
 }
 body .semigray {
  color: #424242 !important;
 }
 body .semigray2 {
  color: #424242 !important;
 }
 body .nav a {
  color: #333333 !important;
 }
 body .dropdown a{
  @apply
  px-0
  text-black
 }
 body .dropdown{
  background-color: rgb(255 255 255 / 100%);
  color: #121212;
 }
 body .d_menu {
  background-color: #e5e5e5;
 }
 body .icon {
  fill: #424242 !important;
 }
 /* Dark Mode */
 body.dark-mode {
  background-color: #121212;
  color: #ffffff;
 }
 body.dark-mode .nav a {
  color: #ffffff !important;
 }
 body.dark-mode .semigray {
  color: #e5e7eb !important;
 }
 body.dark-mode .semigray2 {
  color: #d1d5db !important;
 }
 body.dark-mode .icon {
  fill: #ffffff !important;
 }
 body.dark-mode .card {
  background-color: rgba(82, 82, 82, 50%) !important;
 }
 body.dark-mode .dropdown a{
  @apply
  px-0
  text-white
 }
 body.dark-mode .dropdown{
  background-color: rgb(0 0 0 / 50%);
  color: #fff;
 }
 body.dark-mode .d_menu {
  background-color: rgba(34 34 34);
 }
 /* Custom CSS for header partial */
 .backdrop-blur {
@ -31,20 +110,6 @@
  background-color: rgba(255, 255, 255, 0.75);
 }
 .bg-dark-gradient {
  background: rgba(16,16,16,1);
  background: radial-gradient(circle, rgba(16,16,16,1) 0%, rgb(24, 24, 24) 50%, rgba(16,16,16,1) 100%);
 }
 .bg-black1 {
  background-color: rgba(16,16,16,1);
 }
 .bg-transparent {
  background-color: transparent;
 }
 /* Custom css allowing image styling in markdown */
 img[src*="#mx-auto"] {
@ -137,73 +202,24 @@ a img:hover{
  text-white
 }
 .subtitle {
  background-color:#58CF77 !important;
  color: #fff !important;
  text-transform: uppercase;
  /* font-weight: 600 !important;  */
 }
 .green{
  background-color:#58CF77 !important;
  color: #fff !important;
 }
 .green:hover {
 background-color:#7ad993 !important;
 }
 .green a{
   color: #fff !important;
 }
 .green:hover {
 background-color:#7ad993 !important;
 }
 .green_text{
 color: #58CF77 ;
 }
  .blue_b{
  background-color:#2E83FF !important;
  color: #fff !important;
 }
 .blue_b a{
   color: #fff !important;
 }
 .blue_b:hover {
 background-color:#5596f5 !important;
 }
 .footer-cust a{
-  color: #999; 
+   
  cursor: pointer;
 }
 .footer-cust a:hover {
-  color: #c7c7c7; 
+  color: #a3a3a3; 
 }
-.footer-cust h6{
+/* .footer-cust h6{
  margin-bottom: 15px;
-}
+} */
 .logo_size{
  width:200px
 }
 .blue{
  color:#2E83FF
 }
 .nav p > a {
  display: flex;
  width: 100%;
@ -262,21 +278,18 @@ background-color:#5596f5 !important;
@layer components {
  h1 {
-    @apply text-4xl lg:text-6xl font-normal;
+    @apply text-4xl font-semibold tracking-tight lg:text-6xl;
    color: #ffffff;
    font-family: "Inter", sans-serif !important;
  }
  h2 {
-    @apply text-3xl lg:text-4xl my-4 font-normal leading-none;
+    @apply  lg:text-5xl text-4xl font-medium tracking-tight leading-none;
    color: #ffffff;
    font-family: "Inter", sans-serif !important;
  }
  h2 strong {
    @apply font-semibold;
  }
  h3 {
-    @apply text-2xl lg:text-3xl my-4 font-extralight;
+    @apply lg:text-4xl text-3xl font-normal tracking-tight;
    color: #ffffff;
    font-family: "Inter", sans-serif !important;
  }
  h3 strong {
@ -290,7 +303,7 @@ background-color:#5596f5 !important;
  h5 {
    @apply text-lg my-1 tracking-normal font-medium;
    font-family: "Inter", sans-serif !important;
-    color: #fff !important
+   
  }
  h6 {
    @apply text-md not-italic font-normal my-1;
@ -298,7 +311,7 @@ background-color:#5596f5 !important;
  }
  p {
    @apply text-lg;
-    color: #3d3d3d;
+   
    font-family: "Inter", sans-serif !important;
  }
  blockquote {
@ -393,11 +406,6 @@ background-color:#5596f5 !important;
    font-family: "Inter", sans-serif;
  }
 /* button:hover :is(:where(a)) {
  color: #5e5e5e;
 } */
 button :is(:where(p)) {
  color: #ddd;
  font-weight: 400;
@ -576,7 +584,6 @@ header {
 .post-content-text h2 {
  font-family: "Inter", sans-serif;
  line-height: 1.5;
  font-size: 2.25rem;
  font-weight: 700;
 }
 .container-fluid {
@ -590,12 +597,8 @@ header {
 .zola-anchor {
  display: none;
 }
@media (min-width: 1024px){
  h2 {
    font-size: 3.5rem;
  } 
-}
+
@media (max-width: 1024px) {
--- a/static/images/404_1.png
+++ b/static/images/404_1.png
--- a/static/images/about1.jpg
+++ b/static/images/about1.jpg
--- a/static/images/about2.jpg
+++ b/static/images/about2.jpg
--- a/static/images/about3.jpg
+++ b/static/images/about3.jpg
--- a/static/images/about4.jpg
+++ b/static/images/about4.jpg
--- a/static/images/ai.jpg
+++ b/static/images/ai.jpg
--- a/static/images/asset.jpg
+++ b/static/images/asset.jpg
--- a/static/images/bot2.jpg
+++ b/static/images/bot2.jpg
--- a/static/images/datacenter.jpg
+++ b/static/images/datacenter.jpg
--- a/static/images/dc.jpg
+++ b/static/images/dc.jpg
--- a/static/images/dc2.jpg
+++ b/static/images/dc2.jpg
--- a/static/images/decent.png
+++ b/static/images/decent.png
--- a/static/images/decentralization.svg
+++ b/static/images/decentralization.svg
@ -0,0 +1,76 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 50 50">
  <defs>
    <style>
      .cls-1 {
        fill: #000;
      }
      .cls-1, .cls-2, .cls-3 {
        stroke-width: 0px;
      }
      .cls-4 {
        clip-path: url(#clippath-2);
      }
      .cls-2 {
        fill: #a6a6a6;
      }
      .cls-3 {
        fill: none;
      }
      .cls-5 {
        clip-path: url(#clippath-1);
      }
      .cls-6 {
        clip-path: url(#clippath-4);
      }
      .cls-7 {
        clip-path: url(#clippath);
      }
      .cls-8 {
        clip-path: url(#clippath-3);
      }
    </style>
    <clipPath id="clippath">
      <rect class="cls-3" x="9.6" y="9.5" width="31.3" height="31.3"/>
    </clipPath>
    <clipPath id="clippath-1">
      <rect class="cls-3" x="21.1" y="4.7" width="8.3" height="8.6"/>
    </clipPath>
    <clipPath id="clippath-2">
      <rect class="cls-3" x="21.1" y="36.6" width="8.3" height="8.7"/>
    </clipPath>
    <clipPath id="clippath-3">
      <rect class="cls-3" x="37" y="27.4" width="7.7" height="9.2"/>
    </clipPath>
    <clipPath id="clippath-4">
      <rect class="cls-3" x="37" y="12.4" width="7.7" height="10"/>
    </clipPath>
  </defs>
  <g class="cls-7">
    <path class="cls-2" d="M40.5,24.9c0,1-.1,2-.3,3,0,.5-.2,1-.4,1.5-.1.5-.3,1-.5,1.4-.4.9-.9,1.8-1.4,2.7-.6.8-1.2,1.6-1.9,2.3-.4.4-.7.7-1.1,1-.4.3-.8.6-1.2.9-3,2-6.5,2.9-10.1,2.5-.5,0-1-.1-1.5-.2-.5-.1-1-.2-1.5-.4-.5-.1-1-.3-1.4-.5-.9-.4-1.8-.9-2.7-1.4-.4-.3-.8-.6-1.2-.9-.8-.6-1.5-1.4-2.1-2.1-.3-.4-.6-.8-.9-1.2-.6-.8-1-1.7-1.4-2.7-.2-.5-.4-.9-.5-1.4-.1-.5-.3-1-.4-1.5-.1-.5-.2-1-.2-1.5,0-.5,0-1,0-1.5s0-1,0-1.5c0-.5.1-1,.2-1.5,0-.5.2-1,.4-1.5.6-1.9,1.6-3.8,2.8-5.3.3-.4.7-.8,1-1.1.4-.4.7-.7,1.1-1,1.2-1,2.5-1.8,3.9-2.3.5-.2.9-.4,1.4-.5,1.5-.4,3-.7,4.5-.7,1,0,2,.1,3,.3.5.1,1,.2,1.5.4,1,.3,1.9.7,2.8,1.2.4.2.9.5,1.3.8.4.3.8.6,1.2.9.4.3.8.7,1.1,1,.4.4.7.7,1,1.1.3.4.6.8.9,1.2,1.7,2.5,2.6,5.5,2.6,8.6Z"/>
  </g>
  <path class="cls-1" d="M28.5,22.5l-3.2-1.8c-.2-.1-.4-.1-.6,0l-3.2,1.8c-.2.1-.3.3-.3.5v3.6c0,.2.1.4.3.5l3.2,1.8c0,0,.2,0,.3,0,.1,0,.2,0,.3,0l3.2-1.8c.2-.1.3-.3.3-.5v-3.6c0-.2-.1-.4-.3-.5ZM27.6,26.4l-2.5,1.5-2.5-1.5v-2.9l2.5-1.5,2.5,1.5v2.9Z"/>
  <g class="cls-5">
    <path class="cls-1" d="M28.5,6.6l-3.2-1.8c-.2-.1-.4-.1-.6,0l-3.1,1.8c-.2.1-.3.3-.3.5v3.6c0,.2.1.4.3.5l3.2,1.8c0,0,.2,0,.3,0,.1,0,.2,0,.3,0l3.2-1.8c.2-.1.3-.3.3-.5v-3.6c0-.2-.1-.4-.3-.5ZM27.6,10.5l-2.5,1.5-2.5-1.5v-2.9l2.5-1.5,2.5,1.5v2.9Z"/>
  </g>
  <g class="cls-4">
    <path class="cls-1" d="M28.5,38.6l-3.2-1.8c-.2-.1-.4-.1-.6,0l-3.2,1.8c-.2.1-.3.3-.3.5v3.6c0,.2.1.4.3.5l3.2,1.8c0,0,.2,0,.3,0,.1,0,.2,0,.3,0l3.2-1.8c.2-.1.3-.3.3-.5v-3.6c0-.2-.1-.4-.3-.5ZM27.6,42.4l-2.5,1.5-2.5-1.5v-2.9l2.5-1.5,2.5,1.5v2.9Z"/>
  </g>
  <path class="cls-1" d="M12.5,29.9l-3.2-1.8c-.2-.1-.4-.1-.6,0l-3.2,1.8c-.2.1-.3.3-.3.5v3.6c0,.2.1.4.3.5l3.2,1.8c.2.1.4.1.6,0l3.2-1.8c.2-.1.3-.3.3-.5v-3.6c0-.2-.1-.4-.3-.5ZM11.6,33.7l-2.5,1.5-2.5-1.5v-2.9l2.5-1.5,2.5,1.5v2.9Z"/>
  <g class="cls-8">
    <path class="cls-1" d="M44.5,29.9l-3.2-1.8c-.2-.1-.4-.1-.6,0l-3.2,1.8c-.2.1-.3.3-.3.5v3.6c0,.2.1.4.3.5l3.2,1.8c.2.1.4.1.6,0l3.2-1.8c.2-.1.3-.3.3-.5v-3.6c0-.2-.1-.4-.3-.5ZM43.6,33.7l-2.5,1.5-2.5-1.5v-2.9l2.5-1.5,2.5,1.5v2.9Z"/>
  </g>
  <path class="cls-1" d="M12.5,15.1l-3.2-1.8c-.2-.1-.4-.1-.6,0l-3.2,1.8c-.2.1-.3.3-.3.5v3.6c0,.2.1.4.3.5l3.2,1.8c.2.1.4.1.6,0l3.2-1.8c.2-.1.3-.3.3-.5v-3.6c0-.2-.1-.4-.3-.5h0ZM11.6,19l-2.5,1.5-2.5-1.5v-2.9l2.5-1.5,2.5,1.5v2.9Z"/>
  <g class="cls-6">
    <path class="cls-1" d="M44.5,15.1l-3.2-1.8c-.2-.1-.4-.1-.6,0l-3.2,1.8c-.2.1-.3.3-.3.5v3.6c0,.2.1.4.3.5l3.2,1.8c.2.1.4.1.6,0l3.2-1.8c.2-.1.3-.3.3-.5v-3.6c0-.2-.1-.4-.3-.5h0ZM43.6,19l-2.5,1.5-2.5-1.5v-2.9l2.5-1.5,2.5,1.5v2.9Z"/>
  </g>
  <path class="cls-1" d="M9.7,26.5v-3.1c0-.3-.3-.6-.6-.6s-.6.3-.6.6v3.1c0,.3.3.6.6.6s.6-.3.6-.6h0ZM25.7,34.4v-3.1c0-.3-.3-.6-.6-.6-.3,0-.6.3-.6.6h0v3.1c0,.3.3.6.6.6.3,0,.6-.3.6-.6,0,0,0,0,0,0ZM18.9,37.4l-3.7-2.3c-.3-.2-.7,0-.9.2s0,.7.2.9h0l3.7,2.3c.3.2.7,0,.9-.2.2-.3,0-.7-.2-.9ZM34.7,35.1l-3.7,2.3c-.3.2-.4.6-.2.9.1.2.3.3.5.3.1,0,.2,0,.3,0l3.7-2.3c.3-.2.4-.6.2-.9-.2-.3-.6-.4-.8-.2ZM31,12.5l3.7,2.3c0,0,.2,0,.3,0,.2,0,.4-.1.5-.3.2-.3,0-.7-.2-.9l-3.7-2.3c-.3-.2-.7,0-.9.2,0,0,0,0,0,0-.2.3,0,.7.2.9ZM15.1,14.8c.1,0,.2,0,.3,0l3.7-2.3c.3-.2.4-.6.2-.9-.2-.3-.6-.4-.9-.2l-3.7,2.3c-.3.2-.4.6-.2.9.1.2.3.3.5.3ZM25.7,18.5v-3.1c0-.3-.3-.6-.6-.6s-.6.3-.6.6v3.1c0,.3.3.6.6.6.3,0,.6-.3.6-.6,0,0,0,0,0,0ZM41.7,26.5v-3.1c0-.3-.3-.6-.6-.6s-.6.3-.6.6v3.1c0,.3.3.6.6.6s.6-.3.6-.6h0ZM19.2,21.6l-3.7-1.8c-.3-.1-.7,0-.8.3,0,0,0,0,0,0-.1.3,0,.7.3.8l3.7,1.8c0,0,.2,0,.3,0,.2,0,.5-.1.6-.4.1-.3,0-.7-.3-.8ZM31.3,22.8c0,0,.2,0,.3,0l3.7-1.8c.3-.1.5-.5.3-.8-.1-.3-.5-.5-.8-.3,0,0,0,0,0,0l-3.7,1.8c-.3.1-.4.5-.3.8.1.2.3.4.6.4ZM35.3,29.2l-3.7-1.8c-.3-.1-.7,0-.8.3,0,0,0,0,0,0-.1.3,0,.7.3.8h0s3.7,1.8,3.7,1.8c0,0,.2,0,.3,0,.3,0,.6-.3.6-.6,0-.2-.1-.5-.4-.6ZM18.6,27.4l-3.7,1.8c-.3.1-.4.5-.3.8.1.2.3.4.6.4,0,0,.2,0,.3,0l3.7-1.8c.3-.1.4-.5.3-.8-.1-.3-.5-.4-.8-.3,0,0,0,0,0,0Z"/>
 </svg>
--- a/static/images/digital.jpg
+++ b/static/images/digital.jpg
--- a/static/images/eco.jpg
+++ b/static/images/eco.jpg
--- a/static/images/eco2.jpg
+++ b/static/images/eco2.jpg
--- a/static/images/eco3.jpg
+++ b/static/images/eco3.jpg
--- a/static/images/effic.png
+++ b/static/images/effic.png
--- a/static/images/efficiency.svg
+++ b/static/images/efficiency.svg
@ -0,0 +1,36 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 50 50">
  <defs>
    <style>
      .cls-1 {
        fill: #000;
      }
      .cls-1, .cls-2, .cls-3 {
        stroke-width: 0px;
      }
      .cls-2 {
        fill: #a6a6a6;
      }
      .cls-3 {
        fill: none;
      }
      .cls-4 {
        clip-path: url(#clippath);
      }
    </style>
    <clipPath id="clippath">
      <rect class="cls-3" x="9.6" y="9.5" width="31.2" height="31.2"/>
    </clipPath>
  </defs>
  <g class="cls-4">
    <path class="cls-2" d="M40.5,25c0,1-.1,2-.3,3-.1.5-.2,1-.4,1.5-.1.5-.3,1-.5,1.4-.4.9-.9,1.8-1.4,2.7-.6.8-1.2,1.6-1.9,2.3-1.1,1.1-2.3,2-3.6,2.7-.4.2-.9.5-1.4.6-.5.2-.9.4-1.4.5-.5.1-1,.3-1.5.4-2,.4-4,.4-6,0-1-.2-2-.5-2.9-.9-1.4-.6-2.7-1.4-3.9-2.3-.4-.3-.8-.7-1.1-1-1.1-1.1-2-2.3-2.7-3.6-.2-.4-.5-.9-.6-1.4-.2-.5-.4-.9-.5-1.4-.4-1.5-.7-3-.7-4.5,0-1,.1-2,.3-3,.1-.5.2-1,.4-1.5.6-1.9,1.6-3.8,2.8-5.3.3-.4.7-.8,1-1.1.4-.4.7-.7,1.1-1,.4-.3.8-.6,1.2-.9,2.5-1.7,5.5-2.6,8.6-2.6,1,0,2,.1,3,.3.5.1,1,.2,1.5.4.5.1,1,.3,1.4.5.9.4,1.8.9,2.7,1.4.8.6,1.6,1.2,2.3,1.9.4.4.7.7,1,1.1.3.4.6.8.9,1.2,1.7,2.5,2.6,5.5,2.6,8.6Z"/>
  </g>
  <path class="cls-1" d="M24.4,22.7c.2-.5,0-1.1-.5-1.3,0,0,0,0,0,0-1.3-.6-2.8-1-4.3-1-1.3,0-2.6.3-3.9.8-1.2.5-2.3,1.2-3.2,2.1-.9.9-1.6,2-2.1,3.2-.5,1.2-.8,2.5-.8,3.9,0,1.3.3,2.6.8,3.9,1,2.4,2.9,4.3,5.3,5.3,1.2.5,2.5.8,3.9.8s2.6-.3,3.9-.8c2.4-1,4.3-2.9,5.3-5.3.5-1.2.8-2.5.8-3.9s-.3-2.9-.9-4.2c-.2-.5-.8-.7-1.3-.5-.5.2-.7.8-.5,1.3.5,1.1.8,2.2.8,3.4,0,2.1-.8,4.1-2.3,5.6-1.5,1.5-3.5,2.3-5.6,2.3-2.1,0-4.1-.8-5.6-2.3-1.5-1.5-2.3-3.5-2.3-5.6,0-2.1.8-4.1,2.3-5.6,1.5-1.5,3.5-2.3,5.6-2.3,1.2,0,2.4.3,3.4.8.5.2,1.1,0,1.3-.5h0Z"/>
  <path class="cls-1" d="M30.7,22.2c-.5.3-.6.9-.3,1.4,1.3,2,1.9,4.3,1.9,6.7,0,1.7-.3,3.4-1,4.9-.6,1.5-1.6,2.9-2.7,4-1.2,1.2-2.5,2.1-4,2.7-1.6.7-3.2,1-4.9,1-1.7,0-3.4-.3-4.9-1-1.5-.6-2.9-1.6-4-2.7-1.2-1.2-2.1-2.5-2.7-4-.7-1.6-1-3.2-1-4.9,0-5.3,3.2-10,8.2-11.8,1.4-.5,3-.8,4.5-.8,2.4,0,4.7.7,6.7,1.9.5.3,1.1.1,1.4-.4.3-.5.1-1-.3-1.3-2.3-1.4-5-2.2-7.7-2.2-1.8,0-3.5.3-5.2.9-5.7,2.2-9.5,7.6-9.5,13.7,0,3.9,1.5,7.6,4.3,10.4,1.3,1.3,2.9,2.4,4.7,3.1,1.8.8,3.7,1.2,5.7,1.2,3.9,0,7.6-1.5,10.4-4.3,2.8-2.7,4.3-6.5,4.3-10.4,0-2.8-.8-5.5-2.2-7.8-.3-.5-.9-.6-1.4-.3Z"/>
  <path class="cls-1" d="M44.9,12.9c-.1-.4-.4-.6-.8-.7l-5-.8c-.1-.2-.3-.4-.5-.5l-.8-5c0-.4-.3-.7-.7-.8-.4-.1-.8,0-1,.2l-6.4,6.4c-.2.2-.3.5-.3.9l.9,5.7-11,11c-.4.4-.4,1,0,1.4.2.2.4.3.7.3.3,0,.5,0,.7-.3l11-11,5.7.9c.3,0,.6,0,.9-.3l6.4-6.4c.3-.3.4-.7.2-1h0ZM36.1,8.1l.6,3.8-4.6,4.6-.6-3.8,4.6-4.6ZM37.2,18.5l-3.8-.6,4.6-4.6,3.8.6-4.6,4.6Z"/>
  <path class="cls-1" d="M19.7,27.7c.1,0,.2,0,.4,0,.5,0,1.1-.3,1.1-.9,0-.5-.3-1.1-.9-1.1h0c-.2,0-.4,0-.6,0-2.6,0-4.7,2.1-4.7,4.7,0,2.6,2.1,4.7,4.7,4.7,2.6,0,4.7-2.1,4.7-4.7,0-.2,0-.4,0-.6,0-.5-.6-.9-1.2-.8-.5,0-.9.6-.8,1.1,0,.1,0,.2,0,.4,0,1.5-1.2,2.7-2.7,2.7-1.5,0-2.7-1.2-2.7-2.7,0-1.5,1.2-2.7,2.7-2.7Z"/>
 </svg>
--- a/static/images/feature6.png
+++ b/static/images/feature6.png
--- a/static/images/freezone.jpg
+++ b/static/images/freezone.jpg
--- a/static/images/freezone2.jpg
+++ b/static/images/freezone2.jpg
--- a/static/images/fumba.jpg
+++ b/static/images/fumba.jpg
--- a/static/images/fumba.webp
+++ b/static/images/fumba.webp
--- a/static/images/hero.png
+++ b/static/images/hero.png
--- a/static/images/hero2.png
+++ b/static/images/hero2.png
--- a/static/images/hero3.png
+++ b/static/images/hero3.png
--- a/static/images/hero4.png
+++ b/static/images/hero4.png
--- a/static/images/hero5.png
+++ b/static/images/hero5.png
--- a/static/images/home.jpg
+++ b/static/images/home.jpg
--- a/static/images/home1.jpg
+++ b/static/images/home1.jpg
--- a/static/images/mycel5.png
+++ b/static/images/mycel5.png
--- a/static/images/mycel_1.png
+++ b/static/images/mycel_1.png
--- a/static/images/mycelium_dark.png
+++ b/static/images/mycelium_dark.png
--- a/static/images/mycelium_white.png
+++ b/static/images/mycelium_white.png
--- a/static/images/people_1.jpg
+++ b/static/images/people_1.jpg
--- a/static/images/people_2.jpg
+++ b/static/images/people_2.jpg
--- a/static/images/people_3.jpg
+++ b/static/images/people_3.jpg
--- a/static/images/people_4.jpg
+++ b/static/images/people_4.jpg
--- a/static/images/people_5.jpg
+++ b/static/images/people_5.jpg
--- a/static/images/resil.png
+++ b/static/images/resil.png
--- a/static/images/resilience.svg
+++ b/static/images/resilience.svg
@ -0,0 +1,42 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 50 50">
  <defs>
    <style>
      .cls-1 {
        fill: #000;
      }
      .cls-1, .cls-2, .cls-3 {
        stroke-width: 0px;
      }
      .cls-2 {
        fill: #a6a6a6;
      }
      .cls-3 {
        fill: none;
      }
      .cls-4 {
        clip-path: url(#clippath-1);
      }
      .cls-5 {
        clip-path: url(#clippath);
      }
    </style>
    <clipPath id="clippath">
      <rect class="cls-3" x="9.4" y="9.5" width="31.2" height="31.3"/>
    </clipPath>
    <clipPath id="clippath-1">
      <rect class="cls-3" x="8.4" y="5" width="33.1" height="40"/>
    </clipPath>
  </defs>
  <g class="cls-5">
    <path class="cls-2" d="M40.3,25c0,.5,0,1,0,1.5-.2,2-.8,4-1.8,5.8-.2.4-.5.9-.8,1.3-.3.4-.6.8-.9,1.2-.6.8-1.4,1.5-2.1,2.1-.4.3-.8.6-1.2.9-.4.3-.9.5-1.3.8-.9.5-1.8.9-2.8,1.2-.5.1-1,.3-1.5.4-1.5.3-3,.4-4.5.2-.5,0-1-.1-1.5-.2-.5-.1-1-.2-1.5-.4-.5-.1-1-.3-1.4-.5-.5-.2-.9-.4-1.4-.6-.4-.2-.9-.5-1.3-.8-.4-.3-.8-.6-1.2-.9-.8-.6-1.5-1.4-2.1-2.1-.3-.4-.6-.8-.9-1.2-.3-.4-.5-.9-.8-1.3-.5-.9-.9-1.8-1.2-2.8-.7-2.4-.9-5-.4-7.5,0-.5.2-1,.4-1.5.2-.5.3-1,.5-1.4.2-.5.4-.9.6-1.4.5-.9,1-1.7,1.7-2.5.6-.8,1.4-1.5,2.1-2.1.4-.3.8-.6,1.2-.9.4-.3.9-.5,1.3-.8.4-.2.9-.5,1.4-.6.5-.2.9-.4,1.4-.5,1.5-.4,3-.7,4.5-.7,1,0,2,0,3,.3.5,0,1,.2,1.5.4,1,.3,1.9.7,2.8,1.2.4.2.9.5,1.3.8.4.3.8.6,1.2.9.4.3.8.7,1.1,1s.7.7,1,1.1c.6.8,1.2,1.6,1.7,2.5.2.4.5.9.6,1.4.2.5.4.9.5,1.4.3,1,.5,2,.6,3,0,.5,0,1,0,1.5Z"/>
  </g>
  <g class="cls-4">
    <path class="cls-1" d="M40.8,10.4c-.3-.3-.7-.4-1-.3-.8,0-1.6.1-2.4.1-5.8,0-9.9-2.2-10.9-4.4-.2-.5-.7-.8-1.2-.8h-.8c-.5,0-1,.3-1.2.8-1,2.2-5.1,4.4-10.9,4.4s-1.6,0-2.4-.1c-.4,0-.8,0-1,.3-.3.3-.4.6-.4,1v8c0,10.9,6.1,20.6,15.8,25.4.4.2.8.2,1.2,0,9.8-4.8,15.8-14.6,15.8-25.4v-8c0-.4-.2-.7-.4-1h0ZM38.6,19.4c0,9.6-5.3,18.3-13.8,22.7-8.5-4.5-13.8-13.1-13.8-22.7v-6.6c.4,0,.8,0,1.2,0,5.5,0,10.3-1.8,12.5-4.7,2.2,2.8,7,4.7,12.5,4.7s.8,0,1.2,0v6.6ZM35.1,17.5c.5.5.5,1.4,0,1.9,0,0,0,0,0,0l-11.6,11.2c-.2.2-.6.4-.9.4h0c-.4,0-.7-.2-.9-.4l-4.2-4.7c-.5-.6-.4-1.4.1-1.9.5-.5,1.3-.4,1.8,0l3.3,3.7,10.6-10.2c.5-.5,1.4-.5,1.9,0,0,0,0,0,0,0h0Z"/>
  </g>
 </svg>
--- a/static/images/startup.jpg
+++ b/static/images/startup.jpg
--- a/static/images/startup1.jpg
+++ b/static/images/startup1.jpg
--- a/static/images/twin.jpg
+++ b/static/images/twin.jpg
--- a/static/images/znz.jpg
+++ b/static/images/znz.jpg
--- a/static/images/zone.jpg
+++ b/static/images/zone.jpg
--- a/static/images/zone1.jpg
+++ b/static/images/zone1.jpg
--- a/static/images/zone2.jpg
+++ b/static/images/zone2.jpg
--- a/static/js/custom.js
+++ b/static/js/custom.js
@ -164,30 +164,60 @@ function readingTime() {
  }
 }
-async function getStats() {
+// async function getStats() {
-  try {
+//   try {
-    const stats = await fetch(
+//     const stats = await fetch(
-      "https://stats.grid.tf/api/stats-summary"
+//       "https://stats.grid.tf/api/stats-summary"
-    ).then((res) => res.json());
+//     ).then((res) => res.json());
-    return formatStatsData(stats);
+//     return formatStatsData(stats);
-  } catch (error) {
+//   } catch (error) {
-    throw new Error(
+//     throw new Error(
-      `Failed to retrieve data from network statistics: ${error}`
+//       `Failed to retrieve data from network statistics: ${error}`
-    );
+//     );
 //   }
 // }
 // function formatStatsData(stats) {
 //   let items = document.querySelector(".items");
 //   items.classList.remove("animate-pulse");
 //   document.getElementById("ssd").innerHTML = stats.ssd;
 //   document.getElementById("nodes").innerHTML = stats.nodes;
 //   document.getElementById("countries").innerHTML = stats.countries;
 //   document.getElementById("cores").innerHTML = stats.cores
 //     .toString()
 //     .replace(/\B(?=(\d{3})+(?!\d))/g, ",");
 // }
 // readingTime();
 // getStats();
 // document.getElementById("year").innerHTML = new Date().getFullYear();
 // Get elements
 const toggleSwitch = document.getElementById('lightModeSwitch');
 const body = document.body;
 // Apply saved theme on load
 document.addEventListener('DOMContentLoaded', () => {
    const savedTheme = localStorage.getItem('theme') || 'light'; // Default is light mode
    if (savedTheme === 'dark') {
        body.classList.add('dark-mode');
        toggleSwitch.checked = true;
    } else {
        body.classList.remove('dark-mode');
        toggleSwitch.checked = false;
    }
-}
+});
-function formatStatsData(stats) {
+// Toggle between light and dark mode
-  let items = document.querySelector(".items");
+toggleSwitch.addEventListener('change', () => {
-  items.classList.remove("animate-pulse");
+    if (toggleSwitch.checked) {
-  document.getElementById("ssd").innerHTML = stats.ssd;
+        body.classList.add('dark-mode');
-  document.getElementById("nodes").innerHTML = stats.nodes;
+        localStorage.setItem('theme', 'dark');
-  document.getElementById("countries").innerHTML = stats.countries;
+    } else {
-  document.getElementById("cores").innerHTML = stats.cores
+        body.classList.remove('dark-mode');
-    .toString()
+        localStorage.setItem('theme', 'light');
-    .replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+    }
-}
+});
 readingTime();
 getStats();
 document.getElementById("year").innerHTML = new Date().getFullYear();
--- a/static/videos/cybercity_comp.mp4
+++ b/static/videos/cybercity_comp.mp4
--- a/tailwind.config.js
+++ b/tailwind.config.js
@ -1,30 +1,15 @@
 const colors = require('tailwindcss/colors')
 module.exports = {
  darkMode: 'class',
  content: [
      './templates/**/*.html'
  ],
  safelist: [
-    {
+    'lg:grid-cols-3',
-      pattern: /(-|)(ml|mr)-(4|8|12|16|20|24|28)/,
+  'md:grid-cols-2',
-      variants: [
+  'grid-cols-1',
-        'sm', 'md', 'lg', 
+],
        'first', 'first:sm', 'first:md', 'first:lg', 
        'last', 'last:sm', 'last:md', 'last:lg'
      ],
    },
    {
      pattern: /(pt|pb)-(0)/,
      variants: [
        '!', 'lg', 
        'first', 'first:sm', 'first:md', 'first:lg', 
        'last', 'last:sm', 'last:md', 'last:lg'
      ],
    },
    {
      pattern: /bg-teal-(50|100|200|300|400|500|600|700|800|900)/,  // Added teal color safelist
    }
  ],
  important: true,
  theme: {
--- a/templates/404.html
+++ b/templates/404.html
@ -10,7 +10,7 @@
    </div>
    <div class="max-w-5xl mx-auto">
     <h3 class="text-2xl md:text-4xl font-semibold">You seem to have ended up on a missing page!</h3>
-     <p class="font-normal text-gray-500">This could mean that you’ve entered the wrong URL or you’ve clicked on content which has moved locations or is no longer live. If you need assistance, click on the blue chat icon at the bottom of the screen to speak with real humans on our support team. Or go back to <a class="text-gray-50" href="/">home</a>.</p>
+     <p class="font-normal text-gray-500">This could mean that you’ve entered the wrong URL or you’ve clicked on content which has moved locations or is no longer live. If you need assistance, click on the blue chat icon at the bottom of the screen to speak with real humans on our support team. Or go back to <a class="font-bold" href="/">home</a>.</p>
    </div>
 </div>
--- a/templates/_default/base.html
+++ b/templates/_default/base.html
@ -3,7 +3,7 @@
 {% include "partials/head.html" %}
 {% include "partials/header.html" %}
-<body class="bg-white">
+<body class="">
  <!-- Google Tag Manager (noscript) -->
  <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-N7PNMFH" height="0" width="0"
--- a/templates/blogPage.html
+++ b/templates/blogPage.html
@ -1,103 +0,0 @@
 {% extends "_default/base.html" %}
 {% block content %}
 {% if page.taxonomies.people %}
 {% set people = get_section(path="people/_index.md") %}
 {% set pages_str = people.pages | json_encode() | as_str %}
 {% if pages_str is containing(page.taxonomies.people[0]) %}
 {% set author_path = 'people/' ~ page.taxonomies.people[0] ~ '/index.md' %}
 {% set author = get_page(path=author_path) %}
 {% endif %}
 {% endif %}
 <!-- Default page template for blog posts and basic informative markdown files -->
 {% set split = page.content | split(pat="threefold.io") %}
 {% if split | length < 2 %} {% set content=page.content %} {% else %} {% set content="" %} {% for part in split %} {% if
  part is starting_with("/blog") %} {% set split_part=part | split(pat='/">' ) %} {% set link=split_part[0] %} {% set
  link=link | replace(from="/blog/post" , to="/blog" ) %} {% set link=link | replace(from="_" , to="-" ) %} {% set
  rest_part=split_part | slice(start=1) | join(sep='/">' ) %} {% set part=link ~ '/">' ~ rest_part %} {% endif %} {% if
  loop.first %} {% set_global content=part%} {% else %} {% set_global content=content ~ "threefold.io" ~ part%} {% endif
  %} {% endfor %} {% endif %} <main>
  <div class="container mx-auto mt-16">
    <div>
      <article class="article lg:w-4/6 mx-auto">
        <section class="post-header px-0 mb-4 border-b border-gray-600">
        <h2 class="md:text-4xl text-3xl font-medium mb-2 leading-none  text-gray-100">
          {{ page.title }}
        </h2>
        <p class="md:text-lg mb-4 text-base text-gray-300">
          {{ page.description }}
        </p>
      </section>
        <section class="post-author-list mb-3 mt-2 mx-0">
          <div class="flex items-center">
            <div class="flex justify-between items-center">
              <ul class="list-none pl-0 flex author-list m-0">
                <li class="author-list-item">
                  {% if author %}
                  {% set author_img = get_url(path='/' ~ author.relative_path | replace(from='_', to='-') |
                  replace(from='index.md', to=author.extra.imgPath)) %}
                  <img src="{{author_img}}" alt="{{author.title}}" class="
                        h-8
                        w-8
                        sm:h-10
                        sm:w-10
                        rounded-full
                        bg-gray-200
                        border border-gray-600
                      " />
                </li>
                {% endif %}
              </ul>
            </div>
            <div class="pl-3 flex flex-col text-xs leading-none uppercase">
              {% if author %}
              <a href="{{author.permalink}}" class="text-gray-400 text-xs">{{ author.title }}</a>
              {% endif %}
              <p class="text-gray-400 text-xs">
                <time datetime="{{ page.date }}"> {{ page.date | date(format="%B %e, %Y", timezone="America/Chicago")
                  }}</time><br />
                  <span id="time"
                    class="time"></span>
              </p>
            </div>
          </div>
          <div class="my-2 sharethis-inline-share-buttons"></div>
        </section>
        {% set img_url = get_url(path='/' ~ page.relative_path | replace(from='_', to='-') | replace(from='index.md',
        to=page.extra.imgPath)) %}
        <img class="mb-8 mx-auto" src={{img_url}} alt="{{page.title ~ 'Picture'}}">
        <div>{{ content | safe }}</div>
        <section class="post-tags container relative py-10">
          {% for tag in page.taxonomies.tags %}
          {% set fullpath = "/tags/" ~ tag | replace(from='_', to='-' ) %}
          <button class="
          text-xs
          bg-transparent
          hover:text-gray-100
          py-2
          px-4
          mr-2
          border
          hover:border-gray-100
          border-gray-600
          text-gray-400
          rounded-full
        "><a href="{{fullpath}}">{{ tag }}</a></button>
          {% endfor %}
        </section>
      </article>
    </div>
  </div>
  </main>
  {% endblock content %}
--- a/templates/categories/list.html
+++ b/templates/categories/list.html
@ -1,4 +0,0 @@
 {% extends "index.html" %}
 {% block content %}
 {% endblock content %}
--- a/templates/categories/single.html
+++ b/templates/categories/single.html
@ -1,14 +0,0 @@
 {% extends "index.html" %}
 {% block content %}
 <main class="pt-12">
    <div class="flex flex-col md:flex-row container mx-auto">
        {% include "partials/blogPosts.html" %}
        {% include "partials/blogSidebar.html" %}
    </div>
 </main> 
 {% endblock content %}
--- a/templates/index.html
+++ b/templates/index.html
@ -1,12 +1,10 @@
 {% extends "_default/base.html" %}
 {% block content %}
-{% include "partials/hero/myhero.html" %}
+<!-- home page template, has a banner and rows of page summaries -->
-{% include "partials/hero/myhero1.html" %}
+<div>
-{% include "partials/hero/myhero3.html" %}
+    {% set page = get_page(path="home/index.md") %}
-{% include "partials/hero/myhero8.html" %}
+    {{page.content | safe}}
-{% include "partials/hero/myhero5.html" %}
+</div>
 {% include "partials/hero/myhero2.html" %}
 {% include "partials/hero/myhero6.html" %}
 {% include "partials/hero/myhero7.html" %}
 {% endblock content %}
--- a/templates/jobPage.html
+++ b/templates/jobPage.html
@ -1,40 +0,0 @@
 {% extends "_default/base.html" %}
 {% block content %}
 <div class="container sm:pxi-0 mx-auto min-h-screen pt-24 mt-5">
  <div class="flex flex-row flex-wrap items-center mx-4 sm:mx-0">
    <div class="w-full md:w-5/6 md:pl-8 lg:pl-0">
      <h3 class="
          uppercase
          leading-none
          text-bold
           text-gray-800
          font-black font-heading
        ">
        {{ page.title }}
      </h3>
    </div>
  </div>
  <section class="post-content mx-auto relative font-serif text-gray-700">
    <div class="mt-6 mb-8 text-gray-900">{{ page.content | safe }}</div>
    <button class="
        inline-block
        bg-green-500
        text-sm
        learn-button
        hover:bg-green-600
        px-8
        py-2
        mr-2
        my-0
        shadow
        rounded-full
        active--exact active
      ">
      <a href="{{page.extra.link}}" target="_blank" aria-current="page">
        {{ page.extra.button }}
      </a>
    </button>
  </section>
 </div>
 {% endblock content %}
--- a/templates/layouts/about.html
+++ b/templates/layouts/about.html
@ -1,12 +0,0 @@
 {% extends "_default/base.html" %}
 {% block content %}
 {% include "partials/about/about1.html" %}
 {% include "partials/about/about2.html" %}
 {% include "partials/about/about3.html" %}
 {% include "partials/about/about4.html" %}
 {% include "partials/about/about5.html" %}
 {% include "partials/about/about6.html" %}
 {% include "partials/hero/myhero7.html" %}
 {% endblock content %}
--- a/templates/layouts/blog.html
+++ b/templates/layouts/blog.html
@ -1,33 +0,0 @@
 {% extends "_default/base.html" %}
 <!-- blog template
 the template for displaying the blog page.
 consists of a featured blog row, 
 a paginated list of posts (sorted by date), 
 and a side nav for category and featured post navigation
 -->
 {% block content %}
 <main>
    <!--sets global featured variable as the most recent post with the isFeatured tag-->
    {%- set section = get_section(path="blog/_index.md") %}
    {% for page in section.pages %}
    {% if page.extra.isFeatured %}
        {%- set_global featured = page %}
        {% break %}
    {% endif %}
    {% if not featured %} 
        {%- set_global featured = section.pages[0] %}
    {% endif %}
    {% endfor %}
    {% include "partials/featuredBlog.html" %}
    <div class="flex flex-col md:flex-row container mx-auto my-6">
        {% include "partials/blogPosts.html" %}
        {% include "partials/blogSidebar.html" %}
    </div>
 </main> 
 {% endblock content %}
--- a/templates/layouts/download.html
+++ b/templates/layouts/download.html
@ -1,6 +0,0 @@
 {% extends "_default/base.html" %}
 {% block content %}
 {% include "partials/download/download1.html" %}
 {% include "partials/hero/myhero6.html" %}
 {% include "partials/hero/myhero7.html" %}
 {% endblock content %}
--- a/templates/layouts/faq.html
+++ b/templates/layouts/faq.html
@ -1,8 +0,0 @@
 {% extends "_default/base.html" %}
 {% block content %}
 <div class="container-fluid sm:pxi-0 mx-auto overflow-x-hidden">
    {% include "partials/accordion.html" %}
 </div>
 {% endblock content %}
--- a/templates/layouts/hero.html
+++ b/templates/layouts/hero.html
@ -1,80 +0,0 @@
 <div class="bg-white">
    <header class="absolute inset-x-0 top-0 z-50">
      <nav class="flex items-center justify-between p-6 lg:px-8" aria-label="Global">
        <div class="flex lg:hidden">
          <button type="button" class="-m-2.5 inline-flex items-center justify-center rounded-md p-2.5 text-gray-700">
            <span class="sr-only">Open main menu</span>
            <svg class="size-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
              <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" />
            </svg>
          </button>
        </div>
        <div class="hidden lg:flex lg:gap-x-12">
          <a href="#" class="text-sm/6 font-semibold text-gray-900">Product</a>
          <a href="#" class="text-sm/6 font-semibold text-gray-900">Features</a>
          <a href="#" class="text-sm/6 font-semibold text-gray-900">Marketplace</a>
          <a href="#" class="text-sm/6 font-semibold text-gray-900">Company</a>
        </div>
        <div class="hidden lg:flex lg:flex-1 lg:justify-end">
          <a href="#" class="text-sm/6 font-semibold text-gray-900">Log in <span aria-hidden="true">&rarr;</span></a>
        </div>
      </nav>
      <!-- Mobile menu, show/hide based on menu open state. -->
      <div class="lg:hidden" role="dialog" aria-modal="true">
        <!-- Background backdrop, show/hide based on slide-over state. -->
        <div class="fixed inset-0 z-50"></div>
        <div class="fixed inset-y-0 right-0 z-50 w-full overflow-y-auto bg-white px-6 py-6 sm:max-w-sm sm:ring-1 sm:ring-gray-900/10">
          <div class="flex items-center justify-between">
            <a href="#" class="-m-1.5 p-1.5">
              <span class="sr-only">Your Company</span>
              <img class="h-8 w-auto" src="https://tailwindui.com/plus/img/logos/mark.svg?color=indigo&shade=600" alt="">
            </a>
            <button type="button" class="-m-2.5 rounded-md p-2.5 text-gray-700">
              <span class="sr-only">Close menu</span>
              <svg class="size-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon">
                <path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12" />
              </svg>
            </button>
          </div>
          <div class="mt-6 flow-root">
            <div class="-my-6 divide-y divide-gray-500/10">
              <div class="space-y-2 py-6">
                <a href="#" class="-mx-3 block rounded-lg px-3 py-2 text-base/7 font-semibold text-gray-900 hover:bg-gray-50">Product</a>
                <a href="#" class="-mx-3 block rounded-lg px-3 py-2 text-base/7 font-semibold text-gray-900 hover:bg-gray-50">Features</a>
                <a href="#" class="-mx-3 block rounded-lg px-3 py-2 text-base/7 font-semibold text-gray-900 hover:bg-gray-50">Marketplace</a>
                <a href="#" class="-mx-3 block rounded-lg px-3 py-2 text-base/7 font-semibold text-gray-900 hover:bg-gray-50">Company</a>
              </div>
              <div class="py-6">
                <a href="#" class="-mx-3 block rounded-lg px-3 py-2.5 text-base/7 font-semibold text-gray-900 hover:bg-gray-50">Log in</a>
              </div>
            </div>
          </div>
        </div>
      </div>
    </header>
    <div class="relative isolate px-6 pt-14 lg:px-8">
      <div class="absolute inset-x-0 -top-40 -z-10 transform-gpu overflow-hidden blur-3xl sm:-top-80" aria-hidden="true">
        <div class="relative left-[calc(50%-11rem)] aspect-1155/678 w-[36.125rem] -translate-x-1/2 rotate-[30deg] bg-linear-to-tr from-[#ff80b5] to-[#9089fc] opacity-30 sm:left-[calc(50%-30rem)] sm:w-[72.1875rem]" style="clip-path: polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)"></div>
      </div>
      <div class="mx-auto max-w-2xl py-32 sm:py-48 lg:py-56">
        <div class="hidden sm:mb-8 sm:flex sm:justify-center">
          <div class="relative rounded-full px-3 py-1 text-sm/6 text-gray-600 ring-1 ring-gray-900/10 hover:ring-gray-900/20">
            Announcing our next round of funding. <a href="#" class="font-semibold text-indigo-600"><span class="absolute inset-0" aria-hidden="true"></span>Read more <span aria-hidden="true">&rarr;</span></a>
          </div>
        </div>
        <div class="text-center">
          <h1 class="text-5xl font-semibold tracking-tight text-balance text-gray-900 sm:text-7xl">Data to enrich your online business</h1>
          <p class="mt-8 text-lg font-medium text-pretty text-gray-500 sm:text-xl/8">Anim aute id magna aliqua ad ad non deserunt sunt. Qui irure qui lorem cupidatat commodo. Elit sunt amet fugiat veniam occaecat.</p>
          <div class="mt-10 flex items-center justify-center gap-x-6">
            <a href="#" class="rounded-md bg-indigo-600 px-3.5 py-2.5 text-sm font-semibold text-black shadow-xs hover:bg-indigo-500 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Get started</a>
            <a href="#" class="text-sm/6 font-semibold text-gray-900">Learn more <span aria-hidden="true">→</span></a>
          </div>
        </div>
      </div>
      <div class="absolute inset-x-0 top-[calc(100%-13rem)] -z-10 transform-gpu overflow-hidden blur-3xl sm:top-[calc(100%-30rem)]" aria-hidden="true">
        <div class="relative left-[calc(50%+3rem)] aspect-1155/678 w-[36.125rem] -translate-x-1/2 bg-linear-to-tr from-[#ff80b5] to-[#9089fc] opacity-30 sm:left-[calc(50%+36rem)] sm:w-[72.1875rem]" style="clip-path: polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)"></div>
      </div>
    </div>
  </div>
--- a/templates/layouts/newsroom.html
+++ b/templates/layouts/newsroom.html
@ -1,33 +0,0 @@
 {% extends "_default/base.html" %}
 <!-- News template
 the template for displaying the news page.
 consists of a featured news row, 
 a paginated list of posts (sorted by date), 
 and a side nav for category and featured post navigation
 -->
 {% block content %}
 <main>
    <!--sets global featured variable as the most recent post with the isFeatured tag-->
    {%- set section = get_section(path="newsroom/_index.md") %}
    {% for page in section.pages %}
    {% if page.extra.isFeatured %}
        {%- set_global featured = page %}
        {% break %}
    {% endif %}
    {% if not featured %} 
        {%- set_global featured = section.pages[0] %}
    {% endif %}
    {% endfor %}
    {% include "partials/featuredNews.html" %}
    <div class="flex flex-col md:flex-row container mx-auto my-6">
        {% include "partials/newsPosts.html" %}
        {% include "partials/newsSidebar.html" %}
    </div>
 </main> 
 {% endblock content %}
--- a/templates/layouts/partners.html
+++ b/templates/layouts/partners.html
@ -1,18 +0,0 @@
 {% extends "_default/base.html" %}
 <!-- partners template
 the template for displaying the partners page.
 consists of a featured partners row, 
 a paginated list of posts (sorted by date), 
 and a side nav for category and featured post navigation
 -->
 {% block content %}
 <main>
    <!--sets global featured variable as the most recent post with the isFeatured tag-->
    {%- set section = get_section(path="partners/_index.md") %}
    {% include "partials/intro.html" %}
    <div class="flex flex-col md:flex-row container mx-auto my-8">
        {% include "partials/partnersCards.html" %}
        {% include "partials/partnersSidebar.html" %}
    </div>
 </main>
 {% endblock content %}
--- a/templates/layouts/people.html
+++ b/templates/layouts/people.html
@ -1,83 +0,0 @@
 {% extends "_default/base.html" %}
 <!-- partners template
 the template for displaying the partners page.
 consists of a featured partners row, 
 a paginated list of posts (sorted by date), 
 and a side nav for category and featured post navigation
 -->
 {% block content %}
 <main>
    <!--sets global featured variable as the most recent post with the isFeatured tag-->
    {%- set section = get_section(path="people/_index.md") %}
    <div class="container mx-auto">
      {# {% include "partials/filter_bar.html" %} #}
      <div class="text-center main-title px-0 md:w-full">
        <h1
          class="tracking-tight text-5xl text-left sm:text-3xl md:text-4xl lg:text-5xl fw-500 leading-snug font-normal mb-10"
        >
        {% set path_array = current_path | split(pat="/") %}
        {% set taxonomy = path_array[1] %}
        {% set category = path_array[2] %}
          {{category | replace(from='-', to=' ' ) | title}}
        </h1>
        <div>
          <div class="mt-12 grid gap-5 max-w-lg mx-auto lg:grid-cols-2 xl:grid-cols-4 lg:max-w-none">
            {%- for page in paginator.pages %} 
            {% if "Engineering" == "Engineering"%}
                  {% include "partials/personCard.html" %} 
              {%endif%} {%- endfor %}
          </div>
          <hr class="mt-6" />
          <p class="text-center text-sm mt-2 mb-16">
            {% if paginator.previous %}
            <a
              class="border-transparent"
              aria-label="First page"
              href="{{ paginator.first }}"
              >{% include "partials/icons/svgPrevPageIcon.html" %}{% include
              "partials/icons/svgPrevPageIcon.html" %}</a
            >
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <a
              class="border-transparent"
              aria-label="Previous page"
              href="{{ paginator.previous }}"
              >{% include "partials/icons/svgPrevPageIcon.html" %}</a
            >
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {% else %} {%
            include "partials/icons/svgFirstPageIcon.html" %}{% include
            "partials/icons/svgFirstPageIcon.html" %}
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {% include
            "partials/icons/svgFirstPageIcon.html" %}
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {% endif %} {% if
            paginator.next %}
            <a
              class="border-transparent"
              aria-label="Next page"
              href="{{ paginator.next }}"
              >{% include "partials/icons/svgNextPageIcon.html" %}</a
            >
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <a
              class="border-transparent"
              aria-label="Last page"
              href="{{ paginator.last }}"
              >{% include "partials/icons/svgNextPageIcon.html" %}{% include
              "partials/icons/svgNextPageIcon.html" %}</a
            >
            {% else %} {% include "partials/icons/svgLastPageIcon.html" %}
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {% include
            "partials/icons/svgLastPageIcon.html" %}{% include
            "partials/icons/svgLastPageIcon.html" %} {% endif %}
          </p>
        </div>
      </div>
    </div>
 </main> 
 {% endblock content %}
--- a/templates/layouts/signup.html
+++ b/templates/layouts/signup.html
@ -1,6 +0,0 @@
 {% extends "_default/base.html" %}
 {% block content %}
 {% include "partials/form.html" %}
 {% endblock content %}
--- a/templates/layouts/solutions.html
+++ b/templates/layouts/solutions.html
@ -1,8 +0,0 @@
 {% extends "_default/base.html" %}
 {% block content %}
 {% include "partials/solutions/hero.html" %}
 {% include "partials/solutions/what.html" %}
 {% include "partials/solutions/portfolio.html" %}
 {% include "partials/home/cta.html" %}
 {% endblock content %}
--- a/templates/layouts/what.html
+++ b/templates/layouts/what.html
@ -1,32 +0,0 @@
 {% extends "_default/base.html" %}
 {% block content %}
 {% include "partials/feature/feature1.html" %}
 {% include "partials/feature/feature2.html" %}
 {% include "partials/feature/feature3.html" %}
 {% include "partials/feature/feature4.html" %}
 {% include "partials/feature/feature5.html" %}
 {% include "partials/feature/feature6.html" %}
 {% include "partials/home/cta.html" %}
 {% include "partials/action/video.html" %}
 {% include "partials/action/web4tools.html" %}
 {% include "partials/action/download.html" %}
 {% include "partials/about/about5.html" %}
 {% include "partials/home/cta.html" %}
 {% include "partials/about/about6.html" %}
 {% include "partials/hero/hero1.html" %}
 {% include "partials/hero/hero2.html" %}
 {% include "partials/hero/hero3.html" %}
 {% include "partials/hero/hero4.html" %}
 {% include "partials/hero/hero5.html" %}
 {% include "partials/hero/hero6.html" %}
 {% include "partials/hero/hero7.html" %}
 {% include "partials/hero/hero8.html" %}
 {% include "partials/hero/hero9.html" %}
 {% include "partials/why/hero.html" %}
 {% include "partials/why/reason.html" %}
 {% include "partials/why/timeline.html" %}
 {% include "partials/why/matters.html" %}
 {% include "partials/why/values.html" %}
 {% include "partials/why/team.html" %}
 {% include "partials/home/cta.html" %}
 {% endblock content %}
--- a/templates/memberships/list.html
+++ b/templates/memberships/list.html
@ -1,4 +0,0 @@
 {% extends "index.html" %}
 {% block content %}
 {% endblock content %}
--- a/templates/memberships/single.html
+++ b/templates/memberships/single.html
@ -1,88 +0,0 @@
 {% extends "index.html" %}
 {% block content %}
 {% if not paginator %} 
    {% set paginator = section %}
 {% endif %}
 {% set path_array = current_path | split(pat="/") %}
 {% set taxonomy = path_array[1] %}
 {% set category = path_array[2] %}
 {% if path_array | length < 3%}
 {% set category = "All" %}
 {% endif %}
 <div class="mt-16 mx-auto max-w-screen-lg px-6 lg:px-8">
    {% include "partials/filter_bar.html" %}
    <div class="text-center main-title px-0 md:w-full">
        <div class="my-4 flex flex-col items-start">
            <h2 class="tracking-tight text-left text-3xl lg:text-5xl fw-500 leading-snug font-normal">
            {{category | replace(from='-', to=' ' ) | title}}
            </h2>
            <div class="text-xl text-gray-800">
                {{ paginator.total_pages ~ " People"}}
            </div>
        </div>
        <hr/>
        <div>
            <div class="mx-auto mt-4 grid max-w-2xl grid-cols-1 gap-x-4 gap-y-8 sm:grid-cols-2 lg:mx-0 lg:max-w-none lg:grid-cols-3 xl:grid-cols-4">
                {%- for page in paginator.pages %} 
                    {% include "partials/person_card.html" %} 
                {%- endfor %}
            </div>
            <hr class="mt-6" />
            <p class="text-center text-sm mt-2 mb-16">
              {% if paginator.previous %}
              <a
                class="border-transparent"
                aria-label="First page"
                href="{{ paginator.first }}"
                >{% include "partials/icons/svgPrevPageIcon.html" %}{% include
                "partials/icons/svgPrevPageIcon.html" %}</a
              >
              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
              <a
                class="border-transparent"
                aria-label="Previous page"
                href="{{ paginator.previous }}"
                >{% include "partials/icons/svgPrevPageIcon.html" %}</a
              >
              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {% else %} {%
              include "partials/icons/svgFirstPageIcon.html" %}{% include
              "partials/icons/svgFirstPageIcon.html" %}
              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {% include
              "partials/icons/svgFirstPageIcon.html" %}
              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {% endif %} {% if
              paginator.next %}
              <a
                class="border-transparent"
                aria-label="Next page"
                href="{{ paginator.next }}"
                >{% include "partials/icons/svgNextPageIcon.html" %}</a
              >
              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
              <a
                class="border-transparent"
                aria-label="Last page"
                href="{{ paginator.last }}"
                >{% include "partials/icons/svgNextPageIcon.html" %}{% include
                "partials/icons/svgNextPageIcon.html" %}</a
              >
              {% else %} {% include "partials/icons/svgLastPageIcon.html" %}
              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {% include
              "partials/icons/svgLastPageIcon.html" %}{% include
              "partials/icons/svgLastPageIcon.html" %} {% endif %}
            </p>
        </div>
    </div>
 </div>
 {% endblock content %}
--- a/templates/news-category/list.html
+++ b/templates/news-category/list.html
@ -1,4 +0,0 @@
 {% extends "index.html" %}
 {% block content %}
 {% endblock content %}
--- a/templates/news-category/single.html
+++ b/templates/news-category/single.html
@ -1,14 +0,0 @@
 {% extends "index.html" %}
 {% block content %}
 <main class="pt-12">
    <div class="flex flex-col md:flex-row container mx-auto">
        {% include "partials/newsPosts.html" %}
        {% include "partials/newsSidebar.html" %}
    </div>
 </main> 
 {% endblock content %}
--- a/templates/newsPage.html
+++ b/templates/newsPage.html
@ -1,147 +0,0 @@
 {% extends "_default/base.html" %}
 {% block content %}
 {% set split = page.content | split(pat="threefold.io") %}
 {% if split | length < 2 %}
    {% set content = page.content %}
 {% else %}
    {% set content = "" %}
    {% for part in split %}
        {% if part is starting_with("/blog") %}
            {% set split_part = part | split(pat='/">') %}
            {% set link = split_part[0] %}
            {% set link = link | replace(from="/blog/post", to="/blog") %}
            {% set link = link | replace(from="_", to="-") %}
            {% set rest_part = split_part | slice(start=1) | join(sep='/">') %}
            {% set part = link ~ '/">' ~ rest_part %}
        {% endif %}
        {% if part is starting_with("/people") %}
            {% set split_part = part | split(pat='/">') %}
            {% set link = split_part[0] %}
            {% set link = link | replace(from="_", to="-") %}
            {% set rest_part = split_part | slice(start=1) | join(sep='/">') %}
            {% set part = link ~ '/">' ~ rest_part %}
        {% endif %}
        {% if loop.first %}
            {% set_global content = part %}
        {% else %}
            {% set_global content = content ~ "threefold.io" ~ part %}
        {% endif %}
    {% endfor %}
 {% endif %}
 <!-- Default page template for news posts and basic informative markdown files -->
 <main class="container mx-auto mt-16">
  <div class="article lg:w-4/6 mx-auto">
    <div>
      <section class="post-header px-0 mb-4 border-b border-gray-600">
        <h2 class="md:text-4xl text-3xl font-medium mb-2 leading-none  text-gray-100">
          {{ page.title }}
        </h2>
        <p class="md:text-lg mb-4 text-base text-gray-300">
          {{ page.description }}
        </p>
      </section>
      <section class="post-author-list mb-3 mt-2 mx-0">
        <div class="flex items-center">
          <div class="flex justify-between items-center">
            <ul class="list-none pl-0 flex author-list m-0">
            {% if page.taxonomies.people %}
                {% for person in page.taxonomies.people %}
                    {% set author_path = 'people/' ~ person ~ '/index.md' %}
                    {% set people = get_section(path="people/_index.md") %}           
                    {% set pages_str = people.pages | json_encode() | as_str %}
                    {% if pages_str is containing(person) %}
                        {% set author = get_page(path=author_path) %}
                        {% set author_img = get_url(path='/' ~ author.relative_path | replace(from='_', to='-') | replace(from='index.md', to=author.extra.imgPath)) %}
              <li class="author-list-item">
                <a href="{{author.permalink}}" tooltip="{{author.title}}">
                  <img src="{{author_img}}" alt="{{ author.title }}" class="
                    w-8
                    h-8
                    sm:h-10
                    sm:w-10
                    rounded-full
                    bg-gray-200
                    border border-gray-600
                  " />
                </a>
              </li>
              {% endif %}
              {% endfor %}
              {% endif %}
            </ul>
          </div>
          <div class="pl-3 flex flex-col text-xs leading-none uppercase">
            <p>
            {% if page.taxonomies.people %}
            {% for person in page.taxonomies.people %}
            {% set author_path = 'people/' ~ person ~ '/index.md' %}
            {% set people = get_section(path="people/_index.md") %}           
            {% set pages_str = people.pages | json_encode() | as_str %}
            {% if pages_str is containing(person) %}
                {% set author = get_page(path=author_path) %}
                {% set author_img = get_url(path='/' ~ author.relative_path | replace(from='_', to='-') | replace(from='index.md', to=author.extra.imgPath)) %}
              <span class="text-xs leading-none uppercase">
                <a href="{{author.permalink}}" tooltip="{{author.title}}" class="hover:underline text-gray-400">{{ author.title }}</a>
              </span>
              {% endif %}
                {% endfor %}
            {% endif %}
            </p>
            <p class="text-gray-400 text-xs leading-none uppercase">
              <time datetime="{{page.date}}">
                {{ page.date | date(format="%B %e, %Y", timezone="America/Chicago") }}
              </time>
              {# &nbsp;&middot;&nbsp; {{ page.news.timeToRead }} min read #}
            </p>
          </div>
          <div class="my-2 ml-auto sharethis-inline-share-buttons"></div>
        </div>
      </section>
    </div>
    <section class="post-image mx-auto w-full">
        {% if page.extra.imgPath %}
    {% set img_url = get_url(path='/' ~ page.relative_path | replace(from='_', to='-') | replace(from='index.md', to=page.extra.imgPath)) %}
    <img src="{{img_url}}" />
    {%endif%}
    </section>
    <div class="py-12">
      <section class="
          post-content
          container
          mx-auto
          relative
          font-serif
          text-gray-300
        ">
        <div class="post-content-text text-xl">{{ content | safe }}</div>
      </section>
      <section class="post-tags container mx-auto relative py-10">
        {% for tag in page.taxonomies.tags %}
        {% set fullpath = "/tags/" ~ tag | replace(from='_', to='-' ) %}
        <a href="{{fullpath}}" class="
        text-xs
        bg-transparent
        hover:text-gray-100
        py-2
        px-4
        mr-2
        border
        hover:border-gray-100
        border-gray-600
        text-gray-400
        rounded-full
          ">{{ tag }}</a>
        {% endfor %}
      </section>
    </div>
  </div>
 </main>
 {% endblock content %}
--- a/templates/oldheader.html
+++ b/templates/oldheader.html
@ -1,252 +0,0 @@
 <!--
  Tailwind UI components require Tailwind CSS v1.8 and the @tailwindcss/ui plugin.
  Read the documentation to get started: https://tailwindui.com/documentation
 -->
 <!-- This example requires Tailwind CSS v1.4.0+ -->
 <script type="text/javascript">
    var displayedMenu = "";
    var hamburgerShown = false;
    let width = screen.width;
    var isMobile = width < 1024;
    function toggleMenu(button) {
        if (displayedMenu === button.id.split("-")[0]) { 
            button.className = button.className.replace(" text-blue-500 bg-stone-200 sm:bg-transparent", " text-gray-900");
            hideMenu(button.id.split("-")[0]);
            button.lastElementChild.className = button.lastElementChild.className.replace("rotate-0", "-rotate-90")
            displayedMenu = "";
        }
        else { 
            showMenu(button.id.split("-")[0]);
            button.lastElementChild.className = button.lastElementChild.className.replace("-rotate-90", "rotate-0")
            button.className = button.className.replace(" text-gray-900", " text-blue-500 bg-stone-200 sm:bg-transparent");
            displayedMenu = button.id.split("-")[0]
        }
    }
    function handleClick(button) {
        if (button.id === "hamburger-btn" || button.id === "close-hamburger-btn") { toggleHamburger() }
        if (button.id.indexOf("menu") !== -1 ) { 
            toggleMenu(button) 
        }
    }
    function toggleHamburger() {
        if (hamburgerShown) { 
            hideHamburger();
            hamburgerShown = false;
        }
        else { 
            showHamburger();
            hamburgerShown = true;
        }
    }
    function showMenu(menuName) {
        var menuId = menuName + (isMobile ? '-mobile-menu' : '-menu');
        var menuBtnId = menuName + (isMobile ? '-mobile-menu' : '-menu');
        var menuElement = document.getElementById(menuId)
        menuElement.className = menuElement.className.replace(" hidden" , "");
        setTimeout(function() { menuElement.className = menuElement.className.replace("duration-200 ease-in opacity-0 -translate-y-1", "duration-150 ease-out opacity-1 -translate-y-0"); }, 10);
    }
    function hideMenu(menuName) {
        var menuId = menuName + (isMobile ? '-mobile-menu' : '-menu');
        var menuElement = document.getElementById(menuId)
        menuElement.className = menuElement.className.replace("duration-150 ease-out opacity-1 -translate-y-0", "duration-200 ease-in opacity-0 -translate-y-1");
        setTimeout(function() { menuElement.className = menuElement.className + " hidden" }, 300);
    }
    function showHamburger() {
        document.getElementById('header-container').className = "overflow-hidden";
        document.getElementById('hamburger').className = "fixed mt-16 z-20 top-0 inset-x-0 transition transform origin-top-right";
        document.getElementById('hamburger-btn').className = "hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
        document.getElementById('close-hamburger-btn').className = "inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
    }
    function hideHamburger() {
        document.getElementById('header-container').className = "";
        document.getElementById('hamburger').className = "hidden absolute z-20 top-0 inset-x-0 transition transform origin-top-right lg:hidden";
        document.getElementById('hamburger-btn').className = "inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
        document.getElementById('close-hamburger-btn').className = "hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
        if (displayedMenu !== "") { hideMenu(displayedMenu); }
    }
    window.onload = function(){
        let elements = document.getElementsByTagName("button");
        let buttons = [...elements]
        buttons.forEach((button) => {
            button.addEventListener( 'click', function() { handleClick(button) });
        })
        document.getElementById("mobile-learn-btn").addEventListener( 'click', toggleMenu);
    }
 </script>
 <!-- set variables used for header template -->
 {% set section = get_section(path="_index.md") %}
 {% set subsections_str = section.subsections | join(sep=" ") %}
 {% set logo_path = get_url(path=section.extra.logo_path | default(value='')) %}
 {% if "header/_index.md" in subsections_str %}
    {% set section = get_section(path="header/_index.md") %}
    {% set header_items = section.content | safe | split(pat="
 <li>
    ") %}
    {% include "partials/header_custom.html" %}
 {% else %}
    <header id="header-container">
        {% set header_class = config.extra.header_class | default(value='') %}
        <div class="{{'z-10 bg-white fixed w-screen ' ~ header_class}}">
            <div class="relative z-50 shadow">
                <div class="mx-auto flex z-50 shadow justify-between items-center pl-6 pr-2 md:pr-0 lg:py-5  md:px-12 py-2 lg:px-20 lg:justify-start lg:space-x-20">
                    <div>
                        <a href="/" class="flex">
                            <img class="w-48 h-auto sm:w-15" src="{{logo_path}}" alt="FreeFlow Logo">
                        </a>
                    </div>
                    <div class="-mr-2 -my-2 lg:hidden">
                        <button id="hamburger-btn" type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2">
                            <!-- Heroicon name: menu -->
                            <svg
                                class="h-6 w-6"
                                xmlns="http://www.w3.org/2000/svg"
                                fill="none"
                                viewBox="0 0 24 24"
                                stroke="currentColor"
                            >
                                <path
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                    stroke-width="2"
                                    d="M4 6h16M4 12h16M4 18h16"
                                />
                            </svg>
                        </button>
                        <button id="close-hamburger-btn" type="button" class="hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2">
                            <!-- Heroicon name: x -->
                            <svg
                                class="h-6 w-6"
                                xmlns="http://www.w3.org/2000/svg"
                                fill="none"
                                viewBox="0 0 24 24"
                                stroke="currentColor"
                            >
                                <path
                                    stroke-linecap="round"
                                    stroke-linejoin="round"
                                    stroke-width="2"
                                    d="M6 18L18 6M6 6l12 12"
                                />
                            </svg>
                        </button>
                    </div>
                    <div class="hidden lg:flex-1 lg:flex lg:items-center lg:justify-end lg:space-x-12">
                        <nav class="flex space-x-10">
                            {% for page in section.pages %}
                    {% if page.relative_path == "home/index.md" %} {% continue %} {% endif %}
                            <a href="{{page.permalink}}" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
                                {{page.title}}
                            </a>
                            <div class="relative"></div>
                            {% endfor %}
                    {% for subsection in section.subsections %}
                        {% if subsection == "footer/_index.md" %} {% continue %} {% endif %}                        
                        {% set button_id = subsection ~ "-menu-btn" | slugify %}
                            <div class="relative">
                                <button type="button" id="{{button_id}}" class="nav_btn text-gray-900 group inline-flex items-center space-x-2 text-lg leading-6 hover:text-blue-300 focus:outline-none transition ease-in-out duration-150">
                                    <span>{{ subsection }}</span>
                                    <div class="-rotate-90 transition-transform">
                                        <svg
                                            xmlns="http://www.w3.org/2000/svg"
                                            height="24px"
                                            viewBox="0 0 24 24"
                                            width="24px"
                                            fill="#000000"
                                        >
                                            <path d="M0 0h24v24H0z" fill="none"/>
                                            <path d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"/>
                                        </svg>
                                    </div>
                                </button>
                            </div>
                            {% endfor %}
                        </nav>
                    </div>
                </div>
            </div>
            {% for subsection in section.subsections %}
        {% if subsection == "footer/_index.md" %} {% continue %} {% endif %}        
        {% set submenu_id = subsection ~ "-menu" | slugify %}
            <nav>
                <div id="{{submenu_id}}" class="mt-16 sm:mt-0 md:mt-0 lg:mt-0 xl:mt-0 2xl:mt-0 z-30 absolute inset-x-0 transform shadow-lg lg:backdrop-blur xl:backdrop-blur transition duration-200 ease-in opacity-0 -translate-y-1 hidden">
                    <div class="bg-white lg:bg-semi-white md:bg-semi-white xl:bg-semi-white">
                        <div class="mx-8 lg:mx-20 xl:mx-20 px-6 py-4 sm:p-6 md:p-8 lg:p-12 xl:p-12">
                            {{subsection | safe }}
                        </div>
                    </div>
                </div>
            </nav>
            {% endfor %}
            <!--
            Mobile menu, show/hide based on mobile menu state.
            Entering: "duration-200 ease-out"
                From: "opacity-0 scale-95"
                To: "opacity-100 scale-100"
            Leaving: "duration-100 ease-in"
                From: "opacity-100 scale-100"
                To: "opacity-0 scale-95"
            -->
            <div id="hamburger" class="hidden fixed mt-16 z-20 top-0 inset-x-0 transition transform origin-top-right lg:hidden">
                <div>
                    <div class="shadow-xs h-screen bg-white divide-y-2 divide-gray-50">
                        <div class="pb-6 sm:px-12 md:px-16 lg:px-20 space-y-6 sm:space-y-8 sm:pb-8 max-h-screen overflow-y-auto">
                            <nav class="flex flex-col justify-around pb-12">
                                {% for page in section.pages %}
                            {% if page.relative_path == "home/index.md" %} {% continue %} {% endif %}
                                <a href="{{page.permalink}}" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
                                    {{page.title}}
                                </a>
                                <hr>
                                {% endfor %}
                        {% for subsection in section.subsections %}
                            {% if subsection == "footer/_index.md" %} {% continue %} {% endif %}
                            {% set button_id = subsection ~ "-mobile-menu-btn" | slugify %}
                            {% set menu_id = subsection ~ "-mobile-menu" | slugify %}
                                <button type="button" id="{{button_id}}" class="flex flex px-8 py-3 items-start text-left text-gray-900 group inline-flex space-x-2 text-lg leading-6 font-normal hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
                                    <span>{{ subsection }}</span>
                                    <div class="-rotate-90 transition-transform">
                                        <svg
                                            xmlns="http://www.w3.org/2000/svg"
                                            height="24px"
                                            viewBox="0 0 24 24"
                                            width="24px"
                                            fill="#000000"
                                        >
                                            <path d="M0 0h24v24H0z" fill="none"/>
                                            <path d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"/>
                                        </svg>
                                    </div>
                                </button>
                                <div id="{{menu_id}}" class="z-50 leading-3 pl-12 pt-6 pb-4 inset-x-0 text-sm transform duration-200 ease-in opacity-0 -translate-y-1 hidden">
                                    {{ subsection | safe }}
                                </div>
                                <hr>
                                {% endfor %}
                        {% if "footer/_index.md" in subsections_str %}
                        {% set section = get_section(path="footer/_index.md")%}
                                <div class="mx-8 mt-8">
                                    <div class="space-y-8 lg:max-w-lg xl:max-w-lg lg:mr-8 lg:mb-8 xl:col-span-1">
                                        <img class="w-48 h-auto" src="{{logo_path}}" alt="Company name">
                                        <p class="text-gray-500 text-base leading-6 ">
                                            {{section.description}}
                                        </p>
                                    </div>
                                    {% endif %}
                                </nav>
                            </div>
                        </div>
                    </div>
                </div>
            </header>
            {% endif %}
--- a/templates/partials/about/about1.html
+++ b/templates/partials/about/about1.html
@ -1,22 +0,0 @@
 <div class=" fade-in">
    <div class="relative isolate">
        <div class="mx-auto max-w-7xl px-6 lg:py-24 py-12 lg:flex lg:items-center lg:gap-x-20 lg:px-8">
            <div class="my-6 lg:my-16 sm:mt-24 lg:mt-0 lg:flex lg:justify-center lg:w-1/2 lg:order-2">
                <img class="w-full max-w-lg h-auto object-cover rounded-xl" src="/images/mycel5.jpg" 
                    alt="Mobile App Screenshot">
            </div>
            <div class="mx-auto max-w-xl lg:mx-0 lg:flex-auto lg:order-1">
                <h1 class="mt-2 text-4xl font-semibold tracking-tight text-black lg:text-6xl">
                    About Mycelium
                </h1>
                <h2 class="text-balance lg:text-4xl text-3xl font-normal tracking-tight text-black">Redefining Digital Communication</h2>
                <p class="mt-6 text-md font-light text-stone-800 lg:text-lg">
                    Mycelium is designed to improve how we connect and communicate in the digital world. Its goal is to create a secure, efficient, and scalable digital ecosystem where data flows seamlessly and remains protected. 
                <p class="mt-2 text-md font-light text-stone-800 lg:text-lg">
                    We aim to build a system that adapts to our growing digital needs while promoting sustainability and security.
                </p>
            </div>
        </div>
    </div>
 </div>
--- a/templates/partials/about/about2.html
+++ b/templates/partials/about/about2.html
@ -1,51 +0,0 @@
 <div class="relative bg-white isolate overflow-hidden py-12">
    <div class="mx-auto max-w-7xl px-4 lg:px-8">
        <div>
            <h1 class="fade-in text-balance text-4xl font-medium tracking-tight text-black lg:text-5xl">Our Technology
            </h1>
        </div>
        <div class="relative grid lg:grid-cols-12 lg:gap-8">
            <!-- Left Content -->
            <div class="lg:col-span-6">
                <div class="mx-auto max-w-2xl lg:mx-0">
                    <p class="fade-in mt-2 text-lg lg:text-xl font-light text-black">
                        Mycelium enables secure, efficient, and scalable data transfer between network nodes by optimizing data routing. It ensures that information takes the shortest path with the lowest latency, resulting in faster and more efficient communication.
                        <br><br>
                        The technology relies on end-to-end encryption, with each node uniquely identified by its own key pair, guaranteeing the security and privacy of data. This approach ensures that data remains confidential and authentic, strengthening the overall privacy and integrity of the network.
                        <br><br>
                    </p>
                </div>
            </div>
            <!-- Right Blockquote -->
            <div class="lg:col-span-6">
                <figure class=" mt-2 pl-8">
                    <blockquote class=" text-black fade-in px-6">
                        <p class="text-md leading-normal text-black font-normal">Mycelium was created to overcome the limitations of traditional networking protocols while promoting a more sustainable and eco-friendly digital ecosystem. Its goal is to transform digital communication, making it not only efficient and secure but also environmentally responsible.
                            <br><br>
                            The inspiration behind Mycelium comes from the need for a technology that can adapt to changing network conditions and continue to operate efficiently in a rapidly evolving digital landscape.</p>
                    </blockquote>
                    <br>
                    <div class="mx-4">
                    <p class="fade-in mx-auto text-xl font-semibold tracking-tight text-black lg:text-2xl opacity-0 transition-opacity duration-1000" data-observer>
                        Decentralized. Scalable. Intelligent.
                    </p>
                    </div>
                </figure>
            </div>
        </div>
    </div>
 </div>
 <style>
    .blockquote::before {
        content: open-quote;
        font-size: 4rem;
        position: absolute;
        top: -1rem;
        left: -1rem;
        color: #ffffff;
    }
 </style>
--- a/templates/partials/about/about3.html
+++ b/templates/partials/about/about3.html
@ -1,23 +0,0 @@
 <div class=" fade-in py-12">
    <div class="relative isolate">
        <div class="mx-auto max-w-7xl px-4 lg:flex lg:items-center lg:gap-x-20 lg:px-8">
            <div class="mb-6 lg:flex lg:justify-center lg:w-1/2 lg:order-2">
                <img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/efficient.jpeg" 
                alt="Mobile App Screenshot">
        </div>
            <div class="mx-auto max-w-xl lg:mx-0 lg:flex-auto lg:order-1">
                <p class="text-base/7 font-light text-black tracking-wide">BENEFITS</p>
                <h2 class="text-balance lg:text-5xl text-4xl font-medium tracking-tight text-black">Highly Efficient</h2>
                <h3 class="mt-6 font-light text-black lg:text-3xl text-xl">
                    Optimizing Data Routing
                </h3>
                <p class="mt-6 text-md font-light text-stone-800 lg:text-lg">
                    Mycelium's routing algorithms prioritize minimizing latency in data transfer. This ensures that data takes the most direct and efficient route, reducing the time it takes to travel from the source node to the destination node.
                </p>
            </div>
        </div>
    </div>
 </div>
--- a/templates/partials/about/about4.html
+++ b/templates/partials/about/about4.html
@ -1,26 +0,0 @@
 <div class=" fade-in py-12">
    <div class="relative isolate">
        <div class="mx-auto max-w-7xl px-4 lg:py-24 py-12 lg:flex lg:items-center lg:gap-x-20 lg:px-8">
            <div class="my-6 lg:flex lg:justify-center lg:w-1/2">
                {# <img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/about3.jpg" 
                    alt="Mobile App Screenshot"> #}
                    <img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/security.jpeg" 
                    alt="Mobile App Screenshot">
            </div>
            <div class="mx-auto max-w-xl lg:mx-0 lg:flex-auto">
                <p class="text-base/7 font-light text-black tracking-wide">BENEFITS</p>
                <h2 class="text-balance lg:text-5xl text-4xl font-medium tracking-tight text-black">
                    Enhancing Security
                </h2>
                <h3 class="mt-6 font-light text-black lg:text-3xl text-xl">
                    End-to-End Encryption
                </h3>
                <p class="mt-6 text-md font-light text-black lg:text-lg">
                    Each node in the Mycelium network is assigned a unique key pair, consisting of a public and private key. The public key is used to encrypt data intended for that node, while the private key decrypts the data upon receipt. This cryptographic system ensures that only the intended recipient can access the information.
                </p>
                <p class="mt-4 text-md font-light text-black lg:text-lg">
                    When one node sends data to another within the Mycelium network, the data is encrypted with the recipient's public key. This ensures that even if the data is intercepted during transmission, it remains secure and unreadable without the corresponding private key.</p>
            </div>
        </div>
    </div>
 </div>
--- a/templates/partials/about/about5.html
+++ b/templates/partials/about/about5.html
@ -1,23 +0,0 @@
 <div class=" fade-in py-12">
    <div class="relative isolate">
        <div class="mx-auto max-w-7xl px-4  lg:flex lg:items-center lg:gap-x-20 lg:px-8">
            <div class="my-6 lg:flex lg:justify-center lg:w-1/2 lg:order-2">
                <img class="w-full max-w-md h-auto object-cover rounded-xl" src="/images/scalability.jpeg" 
                alt="Mobile App Screenshot">
        </div>
            <div class="mx-auto max-w-xl lg:mx-0 lg:flex-auto lg:order-1">
                <p class="text-base/7 font-light text-black tracking-wide">BENEFITS</p>
                <h2 class="text-balance lg:text-5xl text-4xl font-medium tracking-tight text-black">Enhances Scalability</h2>
                <h3 class="mt-6 font-light text-black lg:text-3xl text-xl">
                    Designed to Adapt
                </h3>
                <p class="mt-6 text-md font-light text-stone-800 lg:text-lg">
                    Mycelium is an open-source project built to adapt dynamically to changing network conditions. As new nodes join or existing nodes leave, the system adjusts seamlessly, allowing Mycelium to scale and support more participants without sacrificing performance.
                <p class="mt-4 text-md font-light text-stone-800 lg:text-lg">
                    The system is designed to efficiently distribute network traffic. During periods of high demand or increased data transfer, Mycelium balances the load by routing data through multiple paths or nodes. This ensures the network can handle greater traffic and more users without becoming overloaded.
                </p>
            </div>        
        </div>
    </div>
 </div>
--- a/templates/partials/about/about6.html
+++ b/templates/partials/about/about6.html
@ -1,12 +0,0 @@
 <div class="fade-in py-12">
    <div class="relative isolate px-4 lg:px-8">
      <div class="mx-auto max-w-4xl">
        <div class="text-left lg:text-center">
          <h2 class="fade-in text-balance lg:text-5xl text-4xl font-medium tracking-tight text-black">A Part of ThreeFold Ecosystem</h2>
          <h3 class="fade-in text-balance lg:text-3xl text-2xl font-normal tracking-tight text-black">An Integral Component of Sustainable Decentralization</h3>
          <p class="mt-8 lg:text-lg font-light text-black sm:text-xl/8">Mycelium seamlessly integrates into the larger ThreeFold ecosystem, driving the shift toward sustainable and decentralized digital transformation. 
            As a core pillar, it enhances the ThreeFold Grid with efficient, secure, and scalable networking solutions, contributing to a future where digital connectivity is both eco-conscious and accessible to all.</p>
        </div>
    </div>
  </div>
 </div> 
--- a/templates/partials/accordion.html
+++ b/templates/partials/accordion.html
@ -1,48 +0,0 @@
 {% set tfFaq = get_section(path="faq/_index.md") %}
 {% set farmFaq = get_section(path="farmfaq/_index.md") %}
 {% set tftFaq = get_section(path="tftfaq/_index.md") %}
 {% if current_path == '/faq/' %}
 <h2 class="text-center mt-10">{{ tfFaq.title }}</h2>
 <div class="lg:max-w-5xl mx-auto px-8 space-y-2 mt-10">
    {% for page in tfFaq.pages %}
    <details class="p-4 rounded-lg">
        <summary class="font-semibold">{{ page.title }}</summary>
        <div class="mt-3">
            <p class="text-gray-600 text-sm leading-6">{{ page.content | safe }}</p>
        </div>
    </details>
    {% endfor %}
 </div>
 {% elif current_path == '/farmfaq/' %}
 <h2 class="text-center mt-10">{{ farmFaq.title }}</h2>
 <div class="lg:max-w-5xl mx-auto px-8 space-y-2 mt-10">
    {% for page in farmFaq.pages %}
    <details class="p-4 rounded-lg">
        <summary class="font-semibold">{{ page.title }}</summary>
        <div class="mt-3">
            <p class="text-gray-600 text-sm leading-6">{{ page.content | safe }}</p>
        </div>
    </details>
    {% endfor %}
 </div>
 {% elif current_path == '/tftfaq/' %}
 <h2 class="text-center mt-10">{{ tftFaq.title }}</h2>
 <div class="lg:max-w-5xl mx-auto px-8 space-y-2 mt-10">
    {% for page in tftFaq.pages %}
    <details class="p-4 rounded-lg">
        <summary class="font-semibold">{{ page.title }}</summary>
        <div class="mt-3">
            <p class="text-gray-600 text-sm leading-6">{{ page.content | safe }}</p>
        </div>
    </details>
    {% endfor %}
 </div>
 {% endif %}
 <style>
    a {
        color: #4ec48f
    }
 </style>
--- a/templates/partials/action/action.html
+++ b/templates/partials/action/action.html
@ -1,90 +0,0 @@
 <div class="relative isolate overflow-hidden bg-transparent text-black pt-12 pb-24">
    <div class="mx-auto max-w-7xl px-6 lg:px-8">
        <div class="relative grid lg:grid-cols-12 lg:gap-8">
            <!-- Left Content -->
            <div class="lg:col-span-7">
                <div class="mx-auto max-w-2xl lg:mx-0">
                    <h1 class="fade-in text-balance text-4xl font-normal tracking-tight text-black lg:text-5xl">When 3 Becomes 4</h1>
                    <p class="fade-in mt-6 text-lg lg:text-xl font-light text-black">
                      The internet is a trillion-dollar industry, and we believe it should be built and owned by everyone—an internet created by all, for all. <br><br>
                    Web4 represents the natural evolution of the internet, enabling humans and machines to collaborate in creating a new form of intelligence that respects both the planet and the people.<br><br>
                    For over a decade, ThreeFold has been dedicated to realizing this vision. Now is time for our next chapter.</span>
                    </p>
                </div>
            </div>
           <!-- Right Blockquote -->
           <div class="lg:col-span-5">
            <figure class=" mt-6 pl-8">
                <blockquote class=" text-2xl text-black fade-in font-semibold ">
                    <p class="lg:text-2xl text-xl leading-normal text-black font-semibold">We believe actions are more important than words. <br><br>
                        This page is in black & white, to let YOU be the <span style="color: red;">color</span> of the future of the internet.
                    </p>
                </blockquote>
                <br> 
                <a href="/signup" target="_blank" class="mt-4 border border-white px-6 py-2 fade-in lg:text-2xl text-xl rounded-2xl tracking-normal font-medium text-black hover:text-gray-400 blinking-effect"><span aria-hidden="true">→ </span>Take the Next Step</a>                               
            </figure>
        </div>
    </div>
 </div>
 </div>
 <style>
 /* Apply the blinking animation to the link */
 .blinking-effect {
  animation: blink 2s infinite; /* Adjust the speed here (1.5s for slow blinking) */
 }
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
 }
@keyframes blink {
 0% {
  opacity: 1;
 }
 50% {
  opacity: 0.4;
 }
 100% {
  opacity: 1;
 }
 }
 blockquote {
  border-left-width: 2px;
  padding-left: 1rem;
 }
 .blockquote::before {
    content: open-quote;
    font-size: 4rem;
    position: absolute;
    top: -1rem;
    left: -1rem;
    color: #ffffff;
 }
 .inline-flex {
 display: flex;
 align-items: center;
 }
 .items-center {
 justify-content: center;
 }
 .gap-2 {
 gap: 0.5rem; /* Adjust the gap size as needed */
 }
 </style>
--- a/templates/partials/action/announcements.html
+++ b/templates/partials/action/announcements.html
@ -1,57 +0,0 @@
 <div class="bg-transparent fade-in pb-24 flex items-center justify-center">
    <div class="mx-auto max-w-7xl px-6 lg:px-8">
        <div class="mx-auto max-w-2xl lg:max-w-7xl items-center text-center">
            <p class="fade-in mx-auto text-pretty lg:text-2xl leading-tight text-xl font-normal text-gray-200">Announcements</p>
           <p class="fade-in mx-auto text-pretty lg:text-5xl leading-tight text-4xl font-normal text-black">Coming Soon on 12.12.24</p> 
           <p class="max-w-4xl mt-4 fade-in mx-auto text-pretty lg:text-xl mb-12 leading-tight text-lg font-light text-gray-200"></p> 
        </div>
        <div class="-mx-6 grid grid-cols-2 gap-2 overflow-hidden sm:mx-0 sm:rounded-2xl md:grid-cols-2">
            <div class="grid-item bg-white/5 p-2 lg:p-12">
                <h2 class="text-black lg:text-3xl text-xl text-center font-semibold">A Roadmap to <br>Web4</h2>
            </div>
            <div class="grid-item bg-white/5 p-2 lg:p-12">
                <h2 class="text-black lg:text-3xl text-xl text-center font-semibold">Web4 <br>Phone</h2>
            </div>
            <div class="grid-item bg-white/5 p-2 lg:p-12">
                <h2 class="text-black lg:text-3xl text-xl text-center font-semibold">Web4 <br>Router</h2>
            </div>
            <div class="grid-item bg-white/5 p-2 lg:p-12">
                <h2 class="text-black lg:text-3xl text-xl text-center font-semibold">Web4 <br>Node</h2>
            </div>
            </div>
        </div>
    </div>
 </div>
 <script>
    // JavaScript to control the blinking effect
    const items = document.querySelectorAll('.grid-item');
    let currentIndex = 0;
    function blinkItem() {
        // Remove the 'blink' class from all items
        items.forEach(item => item.classList.remove('blink'));
        // Add the 'blink' class to the current item
        items[currentIndex].classList.add('blink');
        // Move to the next item in a clockwise manner
        currentIndex = (currentIndex + 1) % items.length;
    }
    // Start the blinking effect
    setInterval(blinkItem, 1000); // Change every second
 </script>
 <style>
    /* CSS for the blinking effect */
    .blink {
        animation: blink-animation 1s infinite;
    }
    @keyframes blink-animation {
        0%, 100% { background-color: rgba(255, 255, 255, 0.1); }
        50% { background-color: rgba(255, 255, 255, 0.5); }
    }
 </style>
--- a/templates/partials/action/banner.html
+++ b/templates/partials/action/banner.html
@ -1,8 +0,0 @@
 <div class="h-screen flex flex-col justify-center items-center">
    <div class="">
        <img 
        class="mx-auto" 
        src="/images/mycel2.gif" 
        alt="TF">
 </div>
 </div>
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
ehab-hassan	aa0914b765	remove github actions	2025-06-22 12:33:54 +03:00
ehab-hassan	4b4ccd7847	test content Some checks failed www2.mycelium.threefold.io/ / Deploy (push) Has been cancelled Details www2.mycelium.threefold.io/ / Wait for Website Update (push) Has been cancelled Details www2.mycelium.threefold.io/ / Check for Broken Links (push) Has been cancelled Details	2025-06-22 12:31:10 +03:00
ehab-hassan	abb1996c42	update Some checks are pending www2.mycelium.threefold.io/ / Deploy (push) Waiting to run Details www2.mycelium.threefold.io/ / Wait for Website Update (push) Blocked by required conditions Details www2.mycelium.threefold.io/ / Check for Broken Links (push) Blocked by required conditions Details	2025-06-18 13:19:50 +03:00
ehab-hassan	cadfb59772	add open graph Some checks failed www2.threefold_io / Deploy (push) Has been cancelled Details www2.threefold_io / Wait for Website Update (push) Has been cancelled Details www2.threefold_io / Check for Broken Links (push) Has been cancelled Details	2025-05-25 17:48:16 +03:00
ehab-hassan	bccf58f8a9	add open graph Some checks are pending www2.threefold_io / Deploy (push) Waiting to run Details www2.threefold_io / Wait for Website Update (push) Blocked by required conditions Details www2.threefold_io / Check for Broken Links (push) Blocked by required conditions Details	2025-05-25 17:47:06 +03:00
ehab-hassan	6948c25978	add 404	2025-05-25 17:34:15 +03:00
ehab-hassan	8c1da7a9ef	add 404	2025-05-25 17:24:23 +03:00
ehab-hassan	19c74d2f03	add 404	2025-05-25 17:21:06 +03:00
ehab-hassan	f88085e089	fix js	2025-05-25 16:52:17 +03:00
ehab-hassan	018e7cc082	fix tailwind cong	2025-05-25 16:39:48 +03:00
ehab-hassan	17a12bf583	update footer	2025-05-25 11:58:34 +03:00
ehab-hassan	8a3fb4800b	update sass	2025-05-25 11:43:04 +03:00
ehab-hassan	a81efb8d0b	add toggle	2025-05-24 21:15:38 +03:00
ehab-hassan	ee206e1241	update dropdown	2025-05-24 21:04:08 +03:00
ehab-hassan	59581304d0	update button at dark mode	2025-05-22 20:00:56 +03:00
ehab-hassan	53e2e08201	update button at dark mode	2025-05-22 19:34:24 +03:00
ehab-hassan	d2f583848b	fix footer	2025-05-22 18:41:48 +03:00
ehab-hassan	dd3580a92a	update cong	2025-05-22 18:40:08 +03:00
ehab-hassan	4d5bfa2d21	update cong	2025-05-22 17:02:08 +03:00
ehab-hassan	4e4b12b447	fix nav color link	2025-05-22 17:01:05 +03:00
ehab-hassan	f7ff263818	make lightmode default	2025-05-22 16:08:17 +03:00
ehab-hassan	417f1d0004	update dark light mode	2025-05-22 12:05:08 +03:00
ehab-hassan	ecfae1fa72	delete unused files	2025-05-21 19:17:28 +03:00
ehab-hassan	3ea0f6c544	update download page	2025-05-21 18:56:13 +03:00
ehab-hassan	d4af55f6ec	update home and about	2025-05-21 18:03:01 +03:00
ehab-hassan	34641b9870	update home and about	2025-05-21 17:50:46 +03:00
ehab-hassan	0be19f8c9b	update home and about	2025-05-21 15:40:28 +03:00
ehab-hassan	c2c021531c	update home and about	2025-05-21 15:37:35 +03:00
ehab-hassan	b3b9d41e8b	updated matomo Some checks failed www2.threefold_io / Deploy (push) Has been cancelled Details www2.threefold_io / Wait for Website Update (push) Has been cancelled Details www2.threefold_io / Check for Broken Links (push) Has been cancelled Details	2025-03-19 16:31:08 +02:00
sasha-astiadi	e8c39059f9	rm manual Some checks failed www2.threefold_io / Deploy (push) Has been cancelled Details www2.threefold_io / Wait for Website Update (push) Has been cancelled Details www2.threefold_io / Check for Broken Links (push) Has been cancelled Details	2025-02-28 18:41:03 +08:00
sasha-astiadi	6159740fd9	edit link Some checks are pending www2.threefold_io / Deploy (push) Waiting to run Details www2.threefold_io / Wait for Website Update (push) Blocked by required conditions Details www2.threefold_io / Check for Broken Links (push) Blocked by required conditions Details	2025-02-28 18:10:23 +08:00
sasha-astiadi	8e2fb27126	Merge branch 'development' of https://git.ourworld.tf/ourworld_web/www_mycelium into development Some checks are pending www2.threefold_io / Deploy (push) Waiting to run Details www2.threefold_io / Wait for Website Update (push) Blocked by required conditions Details www2.threefold_io / Check for Broken Links (push) Blocked by required conditions Details	2025-02-28 01:06:16 +08:00
sasha-astiadi	ff472392e9	replace links	2025-02-28 01:04:42 +08:00