Merge pull request 'development' (#1) from development into main

Reviewed-on: projectmycelium/www_hero_project#1

content/contact/archive.md

@@ -0,0 +1,264 @@
+---
+title: "OurZone"
+description: ""
+date: 2018-09-14
+updated: 2021-02-20
+draft: false
+weight: 1
+---
+
+<!-- section 1 (header) -->
+
+{% row(style="left" margin="none" reverse="rightreserve" padding="bottom") %}
+
+<div class="px-4 md:px-16 lg:px-28">
+
+# **Welcome to** OurZone&trade;  
+
+### Realize Your Ultimate Entrepreneurial Dreams with the World’s First Neo Freezone
+
+<button>[Start Your Journey](/signup)</button>
+
+</div>
+
+<br>
+
+|||
+
+![placeholder](./img/oz_home22.png#mx-auto)
+
+{% end %}
+
+<!-- section 2 (header) -->
+
+<div class="container mx-auto"> 
+
+{% row(style="center" margin="withContainer" padding="none") %}
+
+## **Dreams Begin in** Paradise
+
+### Embrace the Thriving Business Landscape
+ 
+Discover why Zanzibar is an ideal investment destinations for your business. <br>With a booming economy and favorable business climate, the region offers a host of advantages to drive your entrepreneurial success.
+
+{% end %}
+
+{% row(style="center" margin="narrow" padding="bottom") %}
+
+<div class="mx-4 my-4">
+
+![Image](./img/tz3.png#md#mx-auto)
+
+#### Strategic Location
+Strategically positioned at the crossroads of Africa and the Indian Ocean, Zanzibar offer unrivaled access to regional and international markets.
+
+</div>
+
+|||
+
+<div class="mx-4 my-4">
+
+![Image](./img/tz4.png#md#mx-auto)
+
+#### Rapid Economic Growth
+ In recent years, Tanzania's GDP has been growing at an average rate of around 6-7% per year, showcasing the country's strong economic performance.
+</div>
+
+|||
+
+<div class="mx-4 my-4">
+
+![Image](./img/tz1.png#md#mx-auto)
+
+#### Business-Friendly Policies
+World Bank's report ranked Tanzania as one of the top 10 most improved economies globally in 2020, highlighting efforts to simplify business regulations.
+
+</div>
+
+{% end %}
+
+<!-- section 2 security -->
+
+{% row(style="left" margin="withContainer" padding="bottom") %}
+
+![placeholder](./img/freezone2.png#mx-auto)
+
+|||
+
+## **World's First** <br>Neo Digital Freezone
+
+### Empowering Your Business with Seamless Solutions
+ 
+ Embrace the future with ease as we provide a revolutionary platform where you can obtain a digital trade license, a bank account supporting both fiat and cryptocurrencies, and handle your legal requirements and taxes, all within a single, streamlined platform. <br>
+ <br>Say goodbye to complexities and hello to a new era of simplicity and efficiency, empowering your business to thrive like never before.<br><br>
+
+<button>[Sign Up Now](/signup)</button>
+
+{% end %}
+
+<!-- section 3 features title -->
+
+{% row(style="center" margin="narrow" padding="none") %}
+
+## **OurZone&trade;** Benefits
+### Where Freedom Meets Efficiency
+
+With **OurZone**, you can embark on your business journey with ease, <br>leveraging our cutting-edge technology to streamline every step of the process.
+
+<br>
+
+{% end %}
+
+{% row(style="center" margin="narrow" padding="none") %}
+
+<div class="mx-4 my-4">
+
+![Image](./img/automation.png#sm#mx-auto)
+
+#### Fully Automated Onboarding 
+Our automated onboarding process, will ensure compliance with KYC and AML regulations at ease and efficiency.
+
+</div>
+
+|||
+
+<div class="mx-4 my-4">
+
+![Image](./img/banking.png#sm#mx-auto)
+
+#### Banking & Web3 Compatible
+Seamlessly manage both fiat and digital currencies with our comprehensive banking solutions compatible with Web3 technologies.
+
+</div>
+
+|||
+
+<div class="mx-4 my-4">
+
+![Image](./img/jurisdiction.png#sm#mx-auto)
+#### Built-in Legal & Tax Settlement
+ Experience hassle-free business operations, as we provide built-in legal and tax settlement services, simplifying legal obligations.
+
+</div>
+
+{% end %}
+
+<br>
+
+{% row(style="center" margin="narrow" padding="none") %}
+
+<div class="mx-4 my-4">
+
+![Image](./img/license.png#sm#mx-auto)
+#### Affordable & Flexible Trade Licenses
+OurZone™ offers cost-effective and flexible commercial trade licenses, making it easier to kickstart your entrepreneurial journey.
+
+</div>
+
+|||
+
+<div class="mx-4 my-4">
+
+![Image](./img/fe.png#sm#mx-auto)
+#### Sovereign Economic Jurisdiction 
+OurZone™ empowers businesses to operate within an independent economic environment, fostering growth and prosperity.
+
+</div>
+
+|||
+
+<div class="mx-4 my-4">
+
+![Image](./img/secure1.png#sm#mx-auto)
+### Powered by Data Sovereign Tech
+Your Privacy, Your Data, Your Security. Our Quantum Safe Storage will empower you to safeguard your digital information.
+
+</div>
+
+{% end %}
+
+<!-- section 5 subscription -->
+
+{% row(style="center" margin="narrow" padding="top") %}
+
+## **OurZone&trade;** <br>Subscription Packages
+### Tailored Solutions for Your Entrepreneurial Growth
+
+ Explore our diverse range of subscription packages, carefully crafted to cater to your business needs. 
+
+<br>
+
+{% end %}
+
+{% row(style="center" margin="narrow" padding="none") %}
+
+<div class="mx-4 my-4">
+
+![Image](./img/1a.png#sm#mx-auto)
+
+#### Individual Licensing
+ Purchase a single trade license valid for 3 years at the price of 1,000 USD.
+
+<button>[Get License](/signup)</button>
+
+</div>
+
+|||
+
+<div class="mx-4 my-4">
+
+![Image](./img/2a.png#sm#mx-auto)
+
+#### Bulk Licensing
+
+50% for purchase of 10+ licenses with the option to commercially resale.
+
+<button>[Get License](/signup)</button>
+
+</div>
+
+|||
+
+
+<div class="mx-4 my-4">
+
+![Image](./img/3a.png#sm#mx-auto)
+
+#### Custom Licensing
+
+Please contact us for tailored provisions for your community or organization.
+
+<button>[Get License](/signup)</button>
+
+{% end %}
+
+</div>
+
+</div>
+
+
+<!-- section 6 Buy -->
+
+{% row(style="left" margin="none" reverse="rightreserve" padding="top") %}
+
+<div class="px-4 md:px-16 lg:px-28">
+
+## Referral Program
+
+### Earn Rewards for Sharing the Future of Neo Freezone
+
+Be a part of our referral program and unlock exciting rewards by sharing the revolutionary OurZone™ platform with others. <br>
+<br>Spread the word about the world's first Neo Freezone and earn a 10% commission for every successful referral made through your unique affiliate code. 
+
+<br>
+
+<button>[Become an Affiliate Today](/signup)</button>
+
+</div>
+
+|||
+
+
+![Image](./img/referral4.png#lg#mx-auto)
+
+{% end %}

content/contact/index.md

@@ -0,0 +1,10 @@
+---
+title: "Contact"
+description: ""
+date: 2018-09-14
+updated: 2021-02-20
+draft: false
+weight: 6
+template: "layouts/contact.html"
+---
+

content/footer/_index.md

@@ -36,7 +36,7 @@ extra:
 
 <a onclick="window.open('https://ourparadise.ourworld.tf/', '_blank')"><h6>OurParadise</h6></a>
 
-<a onclick="window.open('https://ournomads.ourworld.tf/', '_blank')"><h6>OurNomads</h6></a>
+
 
 
 |||
@@ -45,9 +45,8 @@ extra:
 
 <br>
 
-<a onclick="window.open('https://ourworldfreezone.github.io/info_freezone/', '_blank')"><h6>Knowledgebase</h6></a>
+<a onclick="window.open('https://ourworldfreezone.github.io/info_freezone/', '_blank')"><h6>Manual</h6></a>
 
-###### [Blog](/blog)
 
 <a onclick="window.open('https://t.me/threefoldnews', '_blank')"><h6>Telegram</h6></a>
 

content/header/_index.md

@@ -12,4 +12,4 @@ extra:
 - [Hero]("/hero")
 - [Nodes]("/nodes")
 - [Xperiences]("/xperiences")
-- [Contact]("mailto:info@ourworld.tf")
+- [Contact]("/contact")

content/hero/index.md

@@ -27,7 +27,7 @@ template: "layouts/hero.html"
 <p>Hero is your unique, singular digital avatar, streamlining your online interactions by eliminating the need to duplicate identities across various platforms. With Hero, manage every aspect of your digital life through one secure, efficient identity.</p>
 
 <br>
-<button onclick="yourlink">
+<button onclick="/hero">
   Learn More
 </button>
 

content/home/index.md

@@ -26,7 +26,7 @@ weight: 1
 <p>Meet <b>Hero</b>: your unique digital avatar, streamlining your online presence by eliminating the need for duplicate identities across platforms.</p>
 
 <br>
-<button onclick="yourlink">
+<button onclick="/hero.md">
   Learn More
 </button>
 
@@ -37,23 +37,23 @@ weight: 1
 
 {% row(style="center" padding="top") %}
 
-[![logo1](img/brand1.png#sm)](yourlink)
+[![logo1](img/brand1.png#sm)](https://ourworld.tf)
 
 |||
 
-[![logo2](img/brand2.png#sm)](yourlink)
+[![logo2](img/brand2.png#sm)](https://ourworld.tf)
 
 |||
 
-[![logo3](img/brand3.png#sm)](yourlink)
+[![logo3](img/brand3.png#sm)](https://www.sikana.tv/)
 
 |||
 
-[![logo3](img/brand5.png#sm)](yourlink)
+[![logo3](img/brand5.png#sm)](https://www.threefold.io)
 
 |||
 
-[![logo4](img/brand2.png#sm)](yourlink)
+[![logo4](img/brand4.png#sm)](https://www.vverse.co/)
 
 {% end %}
 
@@ -62,7 +62,7 @@ weight: 1
 <!-- section 2 WHAT -->
 
 
-{% row(style="right" margin="hero" reverse="rightreserve" padding="bottom") %}
+{% row(style="right" margin="hero" reverse="rightreserve" padding="both") %}
 
 
 ## Everyone Can be a Hero
@@ -86,7 +86,11 @@ weight: 1
 
 <br>
 
-<a href onclick="hero.md"><h5>→ <u>Learn More about Hero</u></h5></a>
+<div class="border-t border-gray-200 dark:border-gray-700 ml-auto w-3/4"></div>
+
+<br>
+
+<a href onclick="/hero"><h5>→ <u>Learn More about Hero</u></h5></a>
 
 |||
 
@@ -123,7 +127,7 @@ weight: 1
 
 <br>
 
-<button onclick="yourlink">
+<button onclick="/mycelium">
   Learn More
 </button>
 
@@ -168,7 +172,7 @@ weight: 1
 
 <br>
 
-<a href onclick="hero.md"><h5>→ <u>Learn More about Mycelium Nodes</u></h5></a>
+<a href onclick="/nodes"><h5>→ <u>Learn More about Mycelium Nodes</u></h5></a>
 
 {% end %}
 
@@ -259,11 +263,9 @@ weight: 1
 
 <br>
 
-<a href onclick="hero.md"><h5>→ <u>Explore Hero Xperiences</u></h5></a>
+<a href onclick="/experiences"><h5>→ <u>Explore Hero Xperiences</u></h5></a>
 
 {% end %}
 
-<br><br>
-
 <div class="border-t border-gray-200 dark:border-gray-700">
 </div>

content/mycelium/farmer/index.md

@@ -25,7 +25,7 @@ id: farmer
 
 <br>
 
-<a href onclick="hero.md"><h5>→ <u>Become a Mycelium Farmer</u></h5></a>
+<a href onclick="#"><h5>→ <u>Become a Mycelium Farmer</u></h5></a>
 
 |||
 

content/mycelium/hero/index.md

@@ -21,7 +21,7 @@ id: hero
 
 <br>
 
-<button onclick="yourlink">
+<button onclick="/nodes">
   Learn More
 </button>
 

content/nodes/archive.md

@@ -0,0 +1,264 @@
+---
+title: "OurZone"
+description: ""
+date: 2018-09-14
+updated: 2021-02-20
+draft: false
+weight: 1
+---
+
+<!-- section 1 (header) -->
+
+{% row(style="left" margin="none" reverse="rightreserve" padding="bottom") %}
+
+<div class="px-4 md:px-16 lg:px-28">
+
+# **Welcome to** OurZone&trade;  
+
+### Realize Your Ultimate Entrepreneurial Dreams with the World’s First Neo Freezone
+
+<button>[Start Your Journey](/signup)</button>
+
+</div>
+
+<br>
+
+|||
+
+![placeholder](./img/oz_home22.png#mx-auto)
+
+{% end %}
+
+<!-- section 2 (header) -->
+
+<div class="container mx-auto"> 
+
+{% row(style="center" margin="withContainer" padding="none") %}
+
+## **Dreams Begin in** Paradise
+
+### Embrace the Thriving Business Landscape
+ 
+Discover why Zanzibar is an ideal investment destinations for your business. <br>With a booming economy and favorable business climate, the region offers a host of advantages to drive your entrepreneurial success.
+
+{% end %}
+
+{% row(style="center" margin="narrow" padding="bottom") %}
+
+<div class="mx-4 my-4">
+
+![Image](./img/tz3.png#md#mx-auto)
+
+#### Strategic Location
+Strategically positioned at the crossroads of Africa and the Indian Ocean, Zanzibar offer unrivaled access to regional and international markets.
+
+</div>
+
+|||
+
+<div class="mx-4 my-4">
+
+![Image](./img/tz4.png#md#mx-auto)
+
+#### Rapid Economic Growth
+ In recent years, Tanzania's GDP has been growing at an average rate of around 6-7% per year, showcasing the country's strong economic performance.
+</div>
+
+|||
+
+<div class="mx-4 my-4">
+
+![Image](./img/tz1.png#md#mx-auto)
+
+#### Business-Friendly Policies
+World Bank's report ranked Tanzania as one of the top 10 most improved economies globally in 2020, highlighting efforts to simplify business regulations.
+
+</div>
+
+{% end %}
+
+<!-- section 2 security -->
+
+{% row(style="left" margin="withContainer" padding="bottom") %}
+
+![placeholder](./img/freezone2.png#mx-auto)
+
+|||
+
+## **World's First** <br>Neo Digital Freezone
+
+### Empowering Your Business with Seamless Solutions
+ 
+ Embrace the future with ease as we provide a revolutionary platform where you can obtain a digital trade license, a bank account supporting both fiat and cryptocurrencies, and handle your legal requirements and taxes, all within a single, streamlined platform. <br>
+ <br>Say goodbye to complexities and hello to a new era of simplicity and efficiency, empowering your business to thrive like never before.<br><br>
+
+<button>[Sign Up Now](/signup)</button>
+
+{% end %}
+
+<!-- section 3 features title -->
+
+{% row(style="center" margin="narrow" padding="none") %}
+
+## **OurZone&trade;** Benefits
+### Where Freedom Meets Efficiency
+
+With **OurZone**, you can embark on your business journey with ease, <br>leveraging our cutting-edge technology to streamline every step of the process.
+
+<br>
+
+{% end %}
+
+{% row(style="center" margin="narrow" padding="none") %}
+
+<div class="mx-4 my-4">
+
+![Image](./img/automation.png#sm#mx-auto)
+
+#### Fully Automated Onboarding 
+Our automated onboarding process, will ensure compliance with KYC and AML regulations at ease and efficiency.
+
+</div>
+
+|||
+
+<div class="mx-4 my-4">
+
+![Image](./img/banking.png#sm#mx-auto)
+
+#### Banking & Web3 Compatible
+Seamlessly manage both fiat and digital currencies with our comprehensive banking solutions compatible with Web3 technologies.
+
+</div>
+
+|||
+
+<div class="mx-4 my-4">
+
+![Image](./img/jurisdiction.png#sm#mx-auto)
+#### Built-in Legal & Tax Settlement
+ Experience hassle-free business operations, as we provide built-in legal and tax settlement services, simplifying legal obligations.
+
+</div>
+
+{% end %}
+
+<br>
+
+{% row(style="center" margin="narrow" padding="none") %}
+
+<div class="mx-4 my-4">
+
+![Image](./img/license.png#sm#mx-auto)
+#### Affordable & Flexible Trade Licenses
+OurZone™ offers cost-effective and flexible commercial trade licenses, making it easier to kickstart your entrepreneurial journey.
+
+</div>
+
+|||
+
+<div class="mx-4 my-4">
+
+![Image](./img/fe.png#sm#mx-auto)
+#### Sovereign Economic Jurisdiction 
+OurZone™ empowers businesses to operate within an independent economic environment, fostering growth and prosperity.
+
+</div>
+
+|||
+
+<div class="mx-4 my-4">
+
+![Image](./img/secure1.png#sm#mx-auto)
+### Powered by Data Sovereign Tech
+Your Privacy, Your Data, Your Security. Our Quantum Safe Storage will empower you to safeguard your digital information.
+
+</div>
+
+{% end %}
+
+<!-- section 5 subscription -->
+
+{% row(style="center" margin="narrow" padding="top") %}
+
+## **OurZone&trade;** <br>Subscription Packages
+### Tailored Solutions for Your Entrepreneurial Growth
+
+ Explore our diverse range of subscription packages, carefully crafted to cater to your business needs. 
+
+<br>
+
+{% end %}
+
+{% row(style="center" margin="narrow" padding="none") %}
+
+<div class="mx-4 my-4">
+
+![Image](./img/1a.png#sm#mx-auto)
+
+#### Individual Licensing
+ Purchase a single trade license valid for 3 years at the price of 1,000 USD.
+
+<button>[Get License](/signup)</button>
+
+</div>
+
+|||
+
+<div class="mx-4 my-4">
+
+![Image](./img/2a.png#sm#mx-auto)
+
+#### Bulk Licensing
+
+50% for purchase of 10+ licenses with the option to commercially resale.
+
+<button>[Get License](/signup)</button>
+
+</div>
+
+|||
+
+
+<div class="mx-4 my-4">
+
+![Image](./img/3a.png#sm#mx-auto)
+
+#### Custom Licensing
+
+Please contact us for tailored provisions for your community or organization.
+
+<button>[Get License](/signup)</button>
+
+{% end %}
+
+</div>
+
+</div>
+
+
+<!-- section 6 Buy -->
+
+{% row(style="left" margin="none" reverse="rightreserve" padding="top") %}
+
+<div class="px-4 md:px-16 lg:px-28">
+
+## Referral Program
+
+### Earn Rewards for Sharing the Future of Neo Freezone
+
+Be a part of our referral program and unlock exciting rewards by sharing the revolutionary OurZone™ platform with others. <br>
+<br>Spread the word about the world's first Neo Freezone and earn a 10% commission for every successful referral made through your unique affiliate code. 
+
+<br>
+
+<button>[Become an Affiliate Today](/signup)</button>
+
+</div>
+
+|||
+
+
+![Image](./img/referral4.png#lg#mx-auto)
+
+{% end %}

content/nodes/index.md

@@ -0,0 +1,204 @@
+---
+title: "Nodes"
+description: ""
+date: 2018-09-14
+updated: 2021-02-20
+draft: false
+weight: 4
+template: "layouts/nodes.html"
+---
+
+<!-- section 1 (header) -->
+
+{% row(style="left" margin="hero" padding="both") %}
+
+<br>
+<br>
+
+
+# Powering the Network: <br>Mycelium Nodes
+
+
+<p>Explore how each Mycelium Node contributes to the robust, decentralized architecture of the Mycelium Network, ensuring security, scalability, and resilience.</p>
+
+<br>
+<button onclick="#how">
+  Learn More
+</button>
+
+|||
+
+![placeholder](img/node.png#mx-auto)
+
+
+
+{% end %}
+
+
+
+<!-- section 4 (header) -->
+
+<div class="container mx-auto" id="how"> 
+
+{% row(style="center" margin="hero" padding="bottom") %}
+
+## How Mycelium Nodes works
+
+<p>Unraveling the Core Functions of the Mycelium Nodes.</p>
+
+{% end %}
+
+{% row(style="center" margin="wide" padding="bottom") %}
+
+<div class="border border-gray-300 rounded-lg mx-4 my-4 pt-5 pb-6 px-6 py-6  shadow-md">
+
+![Image](img/node3.png#mx-auto)
+
+#### Connection
+<h6>Nodes connect to Mycelium Network, automatically discovering and communicating with nearby nodes to form a resilient, decentralized network.</h6>
+
+</div>
+
+|||
+
+<div class="border border-gray-300 rounded-lg mx-4 my-4 pt-5 pb-6 px-6 py-6 shadow-md">
+
+![Image](img/node2.png#mx-auto)
+
+#### Data Processing
+<h6>Each node processes and stores data independently, contributing to the network's collective data management without relying on a central servers.</h6>
+</div>
+
+|||
+
+<div class="border border-gray-300 rounded-lg mx-4 my-4 pt-5 pb-6 px-6 py-6 shadow-md">
+
+![Image](img/node1.png#mx-auto)
+
+#### Maintenance
+<h6>Nodes continuously maintain themselves and the network using automated protocols to ensure optimal performance and security for all users.</h6>
+
+</div>
+
+{% end %}
+
+<!-- section 2 WHAT -->
+
+
+{% row(style="left" margin="wide" padding="both") %}
+
+
+## Unlock the Power of Decentralization with Mycelium Nodes
+
+<p>Mycelium Nodes offer a secure and scalable platform for decentralized applications that aim to provide individuals with robust, user-controlled networking solutions.</p>
+
+<br>
+
+<div class="border-t border-gray-200 dark:border-gray-700 ml-auto"></div>
+
+
+<br>
+
+  <h6>   ✓ Enhanced Security</h6>
+  <h6> ✓ Decentralized Control</h6>
+  <h6> ✓ Cost Efficiency</h6>
+  <h6> ✓ Scalable Infrastructure</h6>
+
+
+<br>
+<p>Join the forefront of technological innovation by integrating Mycelium Nodes into your digital life.</p>
+
+<br>
+
+<div class="border-t border-gray-200 dark:border-gray-700 ml-auto"></div>
+<br>
+
+<a href onclick="hero.md"><h5>→ <u>Learn More about Hero</u></h5></a>
+
+|||
+
+
+
+![placeholder](./img/benefit.png#mx-auto)
+
+
+
+{% end %}
+
+{% row(style="left" margin="hero" padding="bottom") %}
+
+![](./img/plug.png#mx-auto)
+
+|||
+
+
+
+
+## Be the Internet.
+
+<p>By simply plugging in a FreeFlow Node, you can provide the services that the world’s largest tech companies provide to billions of users.</p>
+
+<br>
+
+<div class="border-t border-gray-200 dark:border-gray-700">
+</div>
+
+<br>
+
+<a href onclick="hero.md"><h5>→ <u>Get a Node</u></h5></a>
+
+
+
+{% end %}
+
+<!-- section 4 (header) -->
+
+<div class="container mx-auto"> 
+
+{% row(style="center" margin="hero" padding="bottom") %}
+
+## Join The Movement
+### A New Era of Digital Sovereignty
+
+<p>Embark on a journey towards digital sovereignty with Hero, <br>where you take a full control of your online identity and data, starting with these 3 easy steps:</p>
+
+{% end %}
+
+{% row(style="center" margin="narrow" padding="bottom") %}
+
+<div class="border border-gray-300 rounded-lg mx-4 my-4 pt-5 pb-6 px-6 py-6  shadow-md">
+
+![Image](img/item1.png#3col)
+
+#### __Get A Node & Earn__
+<h5>Get a Mycelium Node and add capacity to the <b>Mycelium Network</b>.</h5>
+
+</div>
+
+|||
+
+<div class="border border-gray-300 rounded-lg mx-4 my-4 pt-5 pb-6 px-6 py-6 shadow-md">
+
+![Image](img/item1.png#3col)
+
+#### __Activate Your Hero__
+<h5>Reserve and activate your own <b>Hero</b> - your sovereign digital identity.</h5>
+</div>
+
+|||
+
+<div class="border border-gray-300 rounded-lg mx-4 my-4 pt-5 pb-6 px-6 py-6 shadow-md">
+
+![Image](img/item3.png#3col)
+
+#### __Acquire INCA Tokens__
+<h5>Purchase INCA Tokens- The digital currency of the <b>Mycelium Network</b>.</h5>
+
+</div>
+
+{% end %}
+
+<br>
+
+<div class="border-t border-gray-200 dark:border-gray-700">
+</div>

content/xperiences/developers/index.md

@@ -0,0 +1,42 @@
+---
+id: developers
+---
+
+{% row(style="left" margin="hero" padding="bottom") %}
+
+![](./img/build.png#mx-auto)
+
+|||
+
+## Build Xperiences on Mycelium
+
+<p>Harness the power of open-source technology and seamless integration with Mycelium, enabling you to develop innovative Xperiences and services that push the boundaries of digital possibilities.</p>
+
+<br>
+
+<div class="border-t border-gray-200 dark:border-gray-700">
+</div>
+
+
+<br>
+
+
+  <h6>✓   Open Source Freedom</h6>
+  <h6>✓   Seamless Web3 Integration</h6>
+  <h6>✓   Flexible Dev Environment</h6>
+  <h6>✓   Community Support</h6>
+
+<br>
+
+<p>With Mycelium, the only limit is your imagination—build unique digital experiences and empower your Hero to new heights.</p>
+
+<br>
+
+<div class="border-t border-gray-200 dark:border-gray-700">
+</div>
+
+<br>
+
+<a href onclick="hero.md"><h5>→ <u>Build on Mycelium</u></h5></a>
+
+{% end %}

content/xperiences/index.md

@@ -4,263 +4,33 @@ description: ""
 date: 2018-09-14
 updated: 2021-02-20
 draft: false
-weight: 1
+weight: 5
+template: "layouts/xperiences.html"
 ---
 
 <!-- section 1 (header) -->
 
-{% row(style="left" margin="hero" padding="top") %}
+{% row(style="right" margin="hero" reverse="rightreverse" padding="top") %}
+
+
+# Xperiences: <br>Enhance Your Digital Life
+
+
+<p>Dive into a suite of secure and integrated applications designed for the Hero identity, enhancing your connectivity, creativity, and control across the digital space.</p>
 
 <br>
-<br>
-
-
-![placeholder](./img/hero2.png#mx-auto)
-
-|||
-
-# Start Owning Your Data <br>and Digital Life
-### With **Hero**, We Can Build a Conscious Collective Intelligence Together.
-
-
-<p>Meet <b>Hero</b>: your unique digital avatar, streamlining your online presence by eliminating the need for duplicate identities across platforms.</p>
-
-<br>
-<button onclick="yourlink">
+<button onclick="#">
   Learn More
 </button>
 
-{% end %}
-
-
-<!-- section 6 in the news -->
-
-{% row(style="center" padding="top") %}
-
-[![logo1](img/brand1.png#sm)](yourlink)
-
 |||
 
-[![logo2](img/brand2.png#sm)](yourlink)
-
-|||
-
-[![logo3](img/brand3.png#sm)](yourlink)
-
-|||
-
-[![logo3](img/brand5.png#sm)](yourlink)
-
-|||
-
-[![logo4](img/brand2.png#sm)](yourlink)
-
-{% end %}
-
-
-
-<!-- section 2 WHAT -->
-
-
-{% row(style="right" margin="hero" reverse="rightreserve" padding="bottom") %}
-
-
-## Everyone Can be a Hero
-
-### Discover how Hero empowers <br>everyone to become digital pioneers. 
-
-<p><b>Heroes</b> were designed with technologies<br> that promote universal accessibility,<br> freedom, equality, and personal growth for all.</p>
-
 <br>
-
-<div class="border-t border-gray-200 dark:border-gray-700 ml-auto w-3/4"></div>
-
-
+<br>
 <br>
 
-<ul>
-  <li>Decentralized Identity (DID) for <b>Digital Sovereignty</b>   ✓</li>
-  <li>Blockchain Encryption for <b>Enhanced Security</b>   ✓</li>
-  <li>dApps Interoperability for <b>Global Scalability</b>  ✓</li>
-  <li>Community Governance Model for <b>True Equality</b> ✓</li>
-</ul>
-
-<br>
-
-<a href onclick="hero.md"><h5>→ <u>Learn More about Hero</u></h5></a>
-
-|||
-
-
-
-![placeholder](./img/img_section.png#mx-auto)
-
+![placeholder](./img/hero.png#mx-auto)
 
 
 {% end %}
 
-
-
-
-
-
-
-<!-- section 3 (myc) -->
-
-<div class="container mx-auto"> 
-
-{% row(style="center" margin="withContainer" padding="none") %}
-
-## Hero: The Digital Identity Within the Mycelium Network
-### Your Gateway to True Decentralized Internet
-![](img/mycelium.png#mx-auto)
-
-{% end %}
-
-
-{% row(style="center" margin="hero" padding="bottom") %}
-
-<p>Discover how <b>Mycelium Network</b> is revolutionizing internet access with a community-powered connectivity approach. We aim to empower individuals worldwide by enabling them to own and manage internet resources collectively.</p>
-
-<br>
-
-<button onclick="yourlink">
-  Learn More
-</button>
-
-{% end %}
-
-
-<!-- section 5 subscription -->
-
-{% row(style="left" margin="hero" padding="bottom") %}
-
-![](./img/nodes.png#mx-auto)
-
-|||
-
-## Powered by Mycelium Nodes
-### The Fundamental Building Blocks of Decentralized Internet
-
-<p><b>Mycelium Network</b> and <b>Heroes</b> exist thanks to a vast network of cloud capacity deployed by ‘<b>Farmers</b>’- who deploy Mycelium Nodes in supporting locations worldwide.</p>
-
-<br>
-
-<div class="border-t border-gray-200 dark:border-gray-700">
-</div>
-
-
-<br>
-
-<ul>
-  <li>✓   Decentralized and globally distributed.</li>
-  <li>✓   Fully Autonomous Operations</li>
-  <li>✓   Peer-to-Peer Technologies</li>
-</ul>
-
-<br>
-
-<p>Together, we can create a globally distributed AI and internet infrastructure and earn an income.</p>
-
-<br>
-
-<div class="border-t border-gray-200 dark:border-gray-700">
-</div>
-
-<br>
-
-<a href onclick="hero.md"><h5>→ <u>Learn More about Mycelium Nodes</u></h5></a>
-
-{% end %}
-
-
-
-
-
-<!-- section 4 (header) -->
-
-<div class="container mx-auto"> 
-
-{% row(style="center" margin="hero" padding="bottom") %}
-
-## Join The Movement
-### A New Era of Digital Sovereignty
-
-<p>Embark on a journey towards digital sovereignty with Hero, where you take a full control of your online identity and data, starting with these 3 easy steps:</p>
-
-{% end %}
-
-{% row(style="center" margin="narrow" padding="bottom") %}
-
-<div class="border border-gray-300 rounded-lg mx-4 my-4 pt-5 pb-6 px-6 py-6  shadow-md">
-
-![Image](img/item1.png#3col)
-
-#### __Get A Node & Earn__
-<p>Get a Mycelium Node and add capacity to the <b>Mycelium Network</b>.</p>
-
-</div>
-
-|||
-
-<div class="border border-gray-300 rounded-lg mx-4 my-4 pt-5 pb-6 px-6 py-6 shadow-md">
-
-![Image](img/item1.png#3col)
-
-#### __Activate Your Hero__
-<p>Reserve and activate your own <b>Hero</b> - your sovereign digital identity.<p>
-</div>
-
-|||
-
-<div class="border border-gray-300 rounded-lg mx-4 my-4 pt-5 pb-6 px-6 py-6 shadow-md">
-
-![Image](img/item3.png#3col)
-
-#### __Acquire INCA Tokens__
-<p>Purchase INCA Tokens- The digital currency of the <b>Mycelium Network</b>.</p>
-
-</div>
-
-{% end %}
-
-
-
-
-<!-- section5 xp -->
-
-{% row(style="left" margin="hero"  padding="bottom") %}
-
-![placeholder](./img/experiences.png#mx-auto)
-
-|||
-
-## Hero Xperiences
-
-<p>Dive into a world of fully decentralized and completely secure applications on the <b>Mycelium Network</b>, built to empower and enable our Heroes with innovative digital Xperiences.</p>
-
-<br>
-
-<div class="border-t border-gray-200 dark:border-gray-700">
-</div>
-
-<br>
-
-<ul>
-  <li>◉   <b>Chat App</b>: Stay connected with secure, private messaging.</li>
-  <li>◉   <b>Wallet</b>: Manage your assets with our integrated digital wallet.</li>
-  <li>◉   <b>Browser</b>: Browse the internet securely and privately.</li>
-  <li>◉   <b>Cloud</b>: Store and access your files securely from anywhere.</li>
-</ul>
-
-<br>
-
-<div class="border-t border-gray-200 dark:border-gray-700">
-</div>
-
-<br>
-
-<a href onclick="hero.md"><h5>→ <u>Explore Hero Xperiences</u></h5></a>
-
-{% end %}
-

css/code.css

@@ -78,3 +78,4 @@ pre code {
     padding: 0 0.9rem 0 0.25rem;
   }
 }
+

css/index.css

@@ -29,9 +29,13 @@
   background-color: rgba(255, 255, 255, 0.75);
 }
 
+.bg-purple {
+  background-color: #4207ab ;
+}
+
 /* Image styling in markdown */
 img[src*="#mx-auto"] { margin: auto; }
-img[src*="#small"] { width: 68px; }
+img[src*="#small"] { width: 68px; margin: auto; }
 img[src*="#sm"] { width: 200px; }
 img[src*="#md"] { width: 300px; }
 img[src*="#medium"] { width: 500px; }
@@ -59,10 +63,9 @@ img[src*="#3col"] { width: 100px; margin-left: auto; margin-right: auto; }
   blockquote { @apply border-l-4 border-gray-400 mx-2 my-2 p-2; font-family: "Reddit Sans", sans-serif; font-weight: 300;  }
   li { @apply text-sm lg:text-sm font-light my-2; font-family: "Reddit Sans", sans-serif; font-weight: 200;  }
   li li { @apply text-sm lg:text-sm font-light;font-family: "Reddit Sans", sans-serif; font-weight: 200;  }
-  button { @apply inline-block text-base lg:text-lg px-8 py-1 my-3 border-2 shadow;font-family: "Reddit Sans", sans-serif; font-weight: 400;  }
+  button { @apply inline-block text-base lg:text-lg px-8 py-1 my-3 border-1 shadow;font-family: "Reddit Sans", sans-serif; font-weight: 400;  }
   article h2 { @apply text-xl lg:text-3xl font-medium; font-family: "Reddit Sans", sans-serif; font-weight: 500;  }
   article { @apply text-base lg:text-lg; font-family: "Reddit Sans", sans-serif; font-weight: 400;  }
-  li { @apply text-sm lg:text-base; font-family: "Reddit Sans", sans-serif; font-weight: 300;  }
 }
 
 

templates/_default/base.html

@@ -8,6 +8,7 @@
         <div id="content" class="p-4 pt-24 lg:pt-0 sm:p-12 lg:p-0 overflow-hidden">
             {% block content %}{% endblock %}    
         </div>
+        {% include "partials/banner.html" %}
         {% include "partials/footer.html" %}
         <script type="text/javascript" src="{{ get_url(path='js/custom.js')}}"></script>
     </body>

templates/layouts/contact.html

@@ -0,0 +1,13 @@
+{% extends "_default/base.html" %}
+{% block content %}
+
+<div>
+    {% set page = get_page(path="contact/index.md") %}
+    {{page.content | safe}}
+</div>
+
+{% include "partials/contact.html" %}
+
+{% include "partials/faq.html" %}
+
+{% endblock content %}

templates/layouts/nodes.html

@@ -0,0 +1,11 @@
+{% extends "_default/base.html" %}
+{% block content %}
+<!-- mycelium.md page template, has a banner and rows of page summaries -->
+<div>
+    {% set page = get_page(path="nodes/index.md") %}
+    {{page.content | safe}}
+</div>
+
+{% include "partials/quote.html" %}
+
+{% endblock content %}

templates/layouts/xperiences.html

@@ -0,0 +1,16 @@
+{% extends "_default/base.html" %}
+{% block content %}
+<!-- mycelium.md page template, has a banner and rows of page summaries -->
+<div>
+    {% set page = get_page(path="xperiences/index.md") %}
+    {{page.content | safe}}
+</div>
+
+{% include "partials/apps.html" %}
+
+<div>
+    {% set page = get_page(path="xperiences/developers/index.md") %}
+    {{page.content | safe}}
+</div>
+
+{% endblock content %}

templates/partials/apps.html

@@ -0,0 +1,66 @@
+<!-- Start block -->
+    <div class="max-w-screen-xl px-4 py-8 mx-auto lg:py-8 lg:px-6">
+        <div class="max-w-screen-md mx-auto mb-8 text-center lg:mb-12">
+            <h2 class="mb-4 text-5xl font-extrabold tracking-tight text-gray-900 dark:text-white"><br><br>Core Xperiences</h2>
+            <p class="mb-5 font-light text-gray-500 sm:text-xl dark:text-gray-400">Explore key Hero Xperiences that enhance the flexibility and security of your digital life.</p>
+        </div>
+        <div class="space-y-8 lg:grid lg:grid-cols-4 sm:gap-6 xl:gap-10 lg:space-y-0 mx-auto mb-8 text-center lg:mb-12">
+            <!-- Pricing Card -->
+            <div class="flex flex-col max-w-lg p-6 mx-auto text-center text-gray-900 bg-white border border-gray-100 rounded-lg shadow dark:border-gray-600 xl:p-8 dark:bg-gray-800 dark:text-white">
+                <img src="images/xp4.svg" alt="Icon representing Node & Earn" class="mx-auto mb-4 h-20 w-auto">
+                <h3 class="mb-4 text-2xl font-semibold">Hero Whisper</h3>
+                <p class="font-light text-gray-500 sm:text-lg dark:text-gray-400">Stay connected with other heroes with our secure, private messaging.</p>
+            </div>
+            <!-- Pricing Card -->
+            <div class="flex flex-col max-w-lg p-6 mx-auto text-center text-gray-900 bg-white border border-gray-100 rounded-lg shadow dark:border-gray-600 xl:p-8 dark:bg-gray-800 dark:text-white">
+                <img src="images/xp3.svg" alt="Icon representing Get Your Hero" class="mx-auto mb-4 h-20 w-auto">
+                <h3 class="mb-4 text-2xl font-semibold">Hero Wallet</h3>
+                <p class="font-light text-gray-500 sm:text-lg dark:text-gray-400">Manage your assets with our integrated encrypted digital wallet.</p>
+            </div>
+            <!-- Pricing Card -->
+            <div class="flex flex-col max-w-lg p-6 mx-auto text-center text-gray-900 bg-white border border-gray-100 rounded-lg shadow dark:border-gray-600 xl:p-8 dark:bg-gray-800 dark:text-white">
+                <img src="images/glass.svg" alt="Icon representing Acquire INCA Token" class="mx-auto mb-4 h-20 w-auto">
+                <h3 class="mb-4 text-2xl font-semibold">Hero Glass</h3>
+                <p class="font-light text-gray-500 sm:text-lg dark:text-gray-400">Browse the internet securely without compromising your privacy.</p>
+            </div>
+            <!-- Pricing Card -->
+            <div class="flex flex-col max-w-lg p-6 mx-auto text-center text-gray-900 bg-white border border-gray-100 rounded-lg shadow dark:border-gray-600 xl:p-8 dark:bg-gray-800 dark:text-white">
+                <img src="images/xp1.svg" alt="Icon representing Explore Services" class="mx-auto mb-4 h-20 w-auto">
+                <h3 class="mb-4 text-2xl font-semibold">Hero Quantum</h3>
+                <p class="font-light text-gray-500 sm:text-lg dark:text-gray-400">Store, access, and share your files securely from anywhere.</p>
+            </div>
+        </div>
+        <div class="space-y-8 lg:grid lg:grid-cols-4 sm:gap-6 xl:gap-10 lg:space-y-0">
+            <!-- Pricing Card -->
+            <div class="flex flex-col max-w-lg p-6 mx-auto text-center text-gray-900 bg-white border border-gray-100 rounded-lg shadow dark:border-gray-600 xl:p-8 dark:bg-gray-800 dark:text-white">
+                <img src="images/glass2.svg" alt="Icon representing Node & Earn" class="mx-auto mb-4 h-20 w-auto">
+                <h3 class="mb-4 text-2xl font-semibold">Hero Kutana</h3>
+                <p class="font-light text-gray-500 sm:text-lg dark:text-gray-400">A Peer2Peer Secure Video Meeting Platform.</p>
+            </div>
+            <!-- Pricing Card -->
+            <div class="flex flex-col max-w-lg p-6 mx-auto text-center text-gray-900 bg-white border border-gray-100 rounded-lg shadow dark:border-gray-600 xl:p-8 dark:bg-gray-800 dark:text-white">
+                <img src="images/river.svg" alt="Icon representing Get Your Hero" class="mx-auto mb-4 h-20 w-auto">
+                <h3 class="mb-4 text-2xl font-semibold">Hero River</h3>
+                <p class="font-light text-gray-500 sm:text-lg dark:text-gray-400">A Safe, Truly Decentralized and compatible Social Media Platfrom.</p>
+            </div>
+            <!-- Pricing Card -->
+            <div class="flex flex-col max-w-lg p-6 mx-auto text-center text-gray-900 bg-white border border-gray-100 rounded-lg shadow dark:border-gray-600 xl:p-8 dark:bg-gray-800 dark:text-white">
+                <img src="images/kutana.svg" alt="Icon representing Acquire INCA Token" class="mx-auto mb-4 h-20 w-auto">
+                <h3 class="mb-4 text-2xl font-semibold">Hero Sikana</h3>
+                <p class="font-light text-gray-500 sm:text-lg dark:text-gray-400">Free Education and Learning Platform from everyone to everyone.</p>
+            </div>
+            <!-- Pricing Card -->
+            <div class="flex flex-col max-w-lg p-6 mx-auto text-center text-gray-900 bg-white border border-gray-100 rounded-lg shadow dark:border-gray-600 xl:p-8 dark:bg-gray-800 dark:text-white">
+                <img src="images/builder.svg" alt="Icon representing Explore Services" class="mx-auto mb-4 h-20 w-auto">
+                <h3 class="mb-4 text-2xl font-semibold">Hero Builder</h3>
+                <p class="font-light text-gray-500 sm:text-lg dark:text-gray-400">Easily integrated and compatible website and book builder.</p>
+            </div>
+        </div>
+        <div class="max-w-screen-xl px-4 py-6 mx-auto lg:pt-16 lg:px-6">
+            <div class="max-w-screen-md mx-auto mb-8 text-center lg:mb-12">
+                <button>Explore Xperiences</button>
+            </div>
+        </div>       
+    </div>
+
+<!-- End block -->

templates/partials/banner.html

@@ -0,0 +1,16 @@
+<!-- Start block -->
+<section class="py-4">
+    <div class="max-w-screen-xl px-4 py-0 mx-auto lg:py-0 lg:px-6 flex flex-col lg:flex-row items-center border-2">
+        <div class="max-w-screen-sm lg:flex-1 text-center lg:text-left">
+            <h2 class="mb-4 text-3xl font-extrabold leading-tight tracking-tight text-gray-900 dark:text-white">Be a part of the New Internet</h2>
+            <p class="mb-6 font-light text-gray-500 dark:text-gray-400 md:text-lg"> Start Owning Your Data and Digital Life.</p>
+            <button><a href="#">Be a Hero</a> </button>
+        </div>
+        <div class="flex-1">
+            <img src="images/banner.png" alt="Free Trial Image" class="w-full h-auto">
+        </div>
+    </div>
+</section>
+    <br>
+    <br>
+<!-- End block -->

templates/partials/contact.html

@@ -0,0 +1,49 @@
+<!-- Start block -->
+<div class="grid max-w-screen-xl px-4 pt-4 pb-8 mx-auto lg:gap-8 xl:gap-0 lg:py-16 lg:grid-cols-12 lg:pt-28">
+    <div class="mr-auto place-self-center lg:col-span-7">
+        <h4>About Us</h4>
+        <h2 class="mb-4 text-4xl font-extrabold tracking-tight text-gray-900 dark:text-white">Hero Labs</h1>
+        <p class="max-w-2xl mb-6">Hero Labs provides a decentralized autonomous cloud technologies that allows anyone to become a cloud service provider.</p>
+        <p class="max-w-2xl mb-8">We aims to create a cloud where people and organizations can buy, sell, and use cloud resources autonomously,enable individuals to earn by providing compute, network, and storage capacity​.</p>
+        
+        <a href onclick="hero.md"><h5><u><b>Contact Hero Labs</b></u></h5></a>
+        
+        
+        <div class="space-y-4 sm:flex sm:space-y-0 sm:space-x-4 border-t border-gray-200 my-7 dark:border-gray-700">
+            <div class="pt-8">
+                <div class="mb-2 text-center">
+                    <img src="/images/manual.svg#3col"/>
+                    <a href="#"><h5 class="font-semibold dark:text-white"><u>Manual</u></h5></a>
+                    <h6 class="text-gray-500 dark:text-gray-400">Read the Manual</h6>
+                </div>
+            </div>
+            <div class="pt-8">
+                <div class="mb-2 text-center">
+                    <img src="/images/Support.svg#3col"/>
+                    <a href="#"><h5 class="font-semibold  dark:text-white"><u>Support</u></h5></a>
+                    <h6 class="text-gray-500 dark:text-gray-400">Talk to an Expert</h6>
+                </div>
+            </div>
+            <div class="pt-8">
+                <div class="mb-2 text-center">
+                    <img src="/images/forum.svg#3col"/>
+                    <a href="#"><h5 class=" font-semibold dark:text-white"><u>Forum</u></h5></a>
+                    <h6 class="text-gray-500 dark:text-gray-400">Join the Conversation</h6>
+                </div>
+            </div>
+            <div class="pt-8">
+                <div class="mb-2 text-center">
+                    <img src="/images/Telegram.svg#3col"/>
+                    <a href="#"><h5 class="font-semibold  dark:text-white"><u>Telegram</u></h5></a>
+                    <h6 class="text-gray-500 dark:text-gray-400">Meet the Community</h6>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="hidden lg:mt-0 lg:col-span-5 lg:flex">
+        <img src="images/hero2.png#mx-auto" alt="hero image">
+    </div>            
+</div>
+<div class="border-t border-gray-200 dark:border-gray-700">
+</div>  
+<!-- End block -->

templates/partials/faq.html

@@ -1,23 +1,20 @@
 
 <!-- Start block -->
 
-
-<br>
-<br>
-    <div class="max-w-screen-xl px-4 pb-8 mx-auto lg:pb-16">
+    <div class="max-w-screen-xl px-4 py-12 mx-auto lg:pb-16">
         <h2 class="mb-4 text-3xl font-bold tracking-tight text-gray-900 lg:mb-8 lg:text-3xl dark:text-white">Frequently Asked Questions</h2>
-        <!-- Start block -->
+        <div class="grid divide-y divide-neutral-200 max-w-xl mx-auto mt-8 shadow">
             <div class="py-5">
-                <details class="group px-4 pb-4">
+                <details class="group px-4 py-4">
                     <summary class="flex justify-between items-center font-medium cursor-pointer list-none">
                         <p> What is Hero and how does it work within the Mycelium network?</p>
                         <span class="transition group-open:rotate-180">
                     <svg fill="none" height="24" shape-rendering="geometricPrecision" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" viewBox="0 0 24 24" width="24"><path d="M6 9l6 6 6-6"></path></svg></span>
                     </summary>
-                    <p class="mt-3 group-open:animate-fadeIn ">
+                    <h6 class="mt-3 group-open:animate-fadeIn ">
                         Hero is your personalized digital identity within the Mycelium network. It serves as your unique avatar, enabling you to securely interact with various applications and services while maintaining control over your data. The Mycelium network provides the decentralized infrastructure that powers Hero, ensuring a secure and private digital experience.
                         Check out this guide to learn how to get started and start using Hero on Mycelium Network.
-                    </p>
+                    </h6>
                 </details>
             </div>
             <div class="py-5">
@@ -28,22 +25,22 @@
                     <svg fill="none" height="24" shape-rendering="geometricPrecision" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" viewBox="0 0 24 24" width="24"><path d="M6 9l6 6 6-6"></path></svg>
                   </span>
                     </summary>
-                    <p class="mt-3 group-open:animate-fadeIn">
+                    <h6 class="mt-3 group-open:animate-fadeIn">
                         The Mycelium network enhances security for Hero users by leveraging a decentralized infrastructure. This means there’s no single point of failure or centralized control, reducing the risk of data breaches and ensuring that users have full control over their information.
-                    </p>
+                    </h6>
                 </details>
             </div>
             <div class="py-5">
                 <details class="group px-4 pb-4">
                     <summary class="flex justify-between items-center font-medium cursor-pointer list-none ">
-                        <p>What kinds of experiences can I build on the Mycelium network using Hero??</p>
+                        <p>What kinds of experiences can I build on the Mycelium network using Hero?</p>
                         <span class="transition group-open:rotate-180">
                     <svg fill="none" height="24" shape-rendering="geometricPrecision" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" viewBox="0 0 24 24" width="24"><path d="M6 9l6 6 6-6"></path></svg>
                   </span>
                     </summary>
-                    <p class="mt-3 group-open:animate-fadeIn">
+                    <h6 class="mt-3 group-open:animate-fadeIn">
                         The Mycelium network offers a flexible platform for developing a wide range of digital experiences using Hero, including secure file sharing, communication tools, financial services, and collaborative workspaces. You can also develop custom applications and services tailored to your needs, leveraging the scalability and security of the network.
-                    </p>
+                    </h6>
                 </details>
             </div>
             <div class="py-5">
@@ -54,12 +51,13 @@
                     <svg fill="none" height="24" shape-rendering="geometricPrecision" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" viewBox="0 0 24 24" width="24"><path d="M6 9l6 6 6-6"></path></svg>
                   </span>
                     </summary>
-                    <p class="mt-3 group-open:animate-fadeIn">
+                    <h6 class="mt-3 group-open:animate-fadeIn">
                         The Mycelium network is built on the principles of inclusivity and equality, providing equal access to its decentralized infrastructure. This ensures that all users, regardless of their background or location, have the opportunity to participate, earn, and contribute to the network, thereby fostering a community that values diversity and equal opportunity. Learn more about these technologies: Mycelium Project Manual
-                    </p>
+                    </h6>
                 </details>
             </div>      
         </div>      
+    </div>
 <!-- End block -->
 
 <script>

templates/partials/footer.html

@@ -6,28 +6,26 @@
 {%- set section = get_section(path="footer/_index.md") %}
 {%- set logoPath = section.extra.logoPath %}
 
-<html>
-    <head /><body>
-        <div class="mt-6 border-t border-gray-200 pt-2"></div>
-        <footer class="bg-white">
-          <div class="max-w-screen-2xl mx-auto py-12 px-4 sm:px-6 lg:py-16 lg:px-8">
+        <div class="border-t border-gray-200"></div>
+        <footer>
+          <div class="max-w-screen-2xl mx-auto sm:py-8 sm:px-6 lg:py-8 lg:px-8">
             <div class="xl:flex xl:gap-4 items-center">
               <div class="space-y-8 lg:max-w-sm xl:max-w-sm lg:mr-8 lg:mb-8 xl:col-span-1">
-                <img class="w-40 h-auto sm:w-15 mx-auto" src="{{ get_url(path=logoPath)}}" alt="Ourworld Freezone Logo" />
+                <img class="w-40 h-auto sm:w-15 mx-auto" src="{{ get_url(path=logoPath)}}" alt="Hero Logo" />
                 <p class="text-gray-500 text-base leading-6 ">
                   {{section.description}}
                 </p>
                 {% include "partials/socialLinks.html" %}
             </div>
 
-            <div class="mt-6 lg:mt-0 w-full px-8 sm:px-12 md:px-16 lg:px-20 footer-cust">
+            <div class="mt-3 lg:mt-0 w-full px-8 sm:px-12 md:px-16 lg:px-20 footer-cust">
                 {{ section.content | safe }}
             </div>
               
               </div>
-              <div  class="mt-12 mx-auto border-t border-gray-200 pt-8">
+              <div  class="mt-12 mx-auto border-t border-gray-200 pt-8 pb-8">
                 <p data-v-14efe4a7="" class="text-base leading-6 text-gray-400 text-center">
-                © 2023 OurWorld FreeZone, All rights reserved.
+                © 2024 Mycelium Project, All rights reserved.
                 <a target="_blank" href="https://library.threefold.me/info/legal/#/legal__terms_conditions_websites" class="leading-6 text-gray-500 hover:text-gray-900">Terms &amp; Conditions |
                 </a><a target="_blank" href="https://library.threefold.me/info/legal/#/legal__privacypolicy" class="leading-6 text-gray-500 hover:text-gray-900">Privacy Policy |
                 </a><a href="/tfLabs" class="leading-6 text-gray-500 hover:text-gray-900">ThreeFold Labs IT</a></p>
@@ -40,6 +38,6 @@
 
           
         </footer>
-        </body>
-        </html>
+      </div>
+
         

templates/partials/quote.html

@@ -0,0 +1,17 @@
+ <!-- Start block -->
+    <div class="max-w-screen-xl px-4 py-8 mx-auto text-center lg:py-24 lg:px-6">
+        <figure class="max-w-screen-md mx-auto">
+            <svg class="h-12 mx-auto mb-3 text-gray-400 dark:text-gray-600" viewBox="0 0 24 27" fill="none" xmlns="http://www.w3.org/2000/svg">
+                <path d="M14.017 18L14.017 10.609C14.017 4.905 17.748 1.039 23 0L23.995 2.151C21.563 3.068 20 5.789 20 8H24V18H14.017ZM0 18V10.609C0 4.905 3.748 1.038 9 0L9.996 2.151C7.563 3.068 6 5.789 6 8H9.983L9.983 18L0 18Z" fill="currentColor"/>
+            </svg> 
+                <h3 class="text-gray-900"><i>We need a new Internet which is not owned by a few centralized companies. We need an Internet co-owned by all of us, where everyone is equal, where everyone owns their own data. An Internet which is much more green, which is available everywhere in the world.</i></h3>
+            <figcaption class="flex items-center justify-center mt-6 space-x-3">
+                <img class="w-6 h-6 rounded-full" src="images/kds.png" alt="profile picture">
+                <div class="flex items-center divide-x-2 divide-gray-500 dark:divide-gray-700">
+                    <div class="pr-3 font-medium text-gray-900 dark:text-white">Kristof De Spiegeleer</div>
+                    <div class="pl-3 text-sm font-light text-gray-500 dark:text-gray-400">CEO at Mycelium Project</div>
+                </div>
+            </figcaption>
+        </figure>
+    </div>
+<!-- End block -->