ourworld_web/www_zola_template
20
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add all components

Browse Source
This commit is contained in:
Ehab Hassan 2025-08-10 14:30:51 +03:00
parent 45178a770c
commit a71faed5b3
20 changed files with 523 additions and 321 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

105
content/Page1/index.md
View File

@ -1,105 +0,0 @@
---
title: "Page1"
description: ""
draft: false
weight: 2
---
<!-- section 1 (hero) -->
{{ hero_BG_image(
image_BG="/images/hometech2.jpg",
title="A Cyber Pandemic Antidote",
description="We can help you “rethink“ your next project to achieve security, efficiency, and scale which was not possible before, essential for the evolving needs of emerging IT workloads."
) }}
<!-- --------------------------------------------------- -->
<!-- section 2 (Our History) -->
<div class="relative overflow-hidden lg:py-24 py-12">
<div class="mx-auto max-w-7xl px-6 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-gradient-to-tr from-[#ff80b5] to-[#9089fc] opacity-20 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>
## Our History
<br>
Our history is marked by multiple successful exits, world records, and a trail of groundbreaking inventions, from scalable content routing to Zeta-Byte storage systems. With a global impact that spans scaling websites during the internet's infancy to delivering cutting-edge data center solutions, we've consistently tackled complex challenges, leaving an indelible mark on the tech landscape for decades.
</div>
</div>
<!-- --------------------------------------------------- -->
<!-- section 3 (Our Track Records) -->
<div class="max-w-7xl mx-auto py-12 lg:py-24 px-6 lg:px-12">
<div class="mx-auto max-w-2xl lg:text-center">
## Our Track Records
<br>
Our team has consistently led the way in pioneering innovations, from setting world records in web hosting to creating quantum-resistant storage solutions. Each milestone showcases our commitment to pushing the boundaries of what's possible in the digital world.
</div>
<div class="py-10 grid grid-cols-1 gap-10 mt-6 lg:gap-x-16 lg:grid-cols-3">
{{ features(
svg="M9.315 7.584C12.195 3.883 16.695 1.5 21.75 1.5a.75.75 0 0 1 .75.75c0 5.056-2.383 9.555-6.084 12.436A6.75 6.75 0 0 1 9.75 22.5a.75.75 0 0 1-.75-.75v-4.131A15.838 15.838 0 0 1 6.382 15H2.25a.75.75 0 0 1-.75-.75 6.75 6.75 0 0 1 7.815-6.666ZM15 6.75a2.25 2.25 0 1 0 0 4.5 2.25 2.25 0 0 0 0-4.5Z",
svg2="M5.26 17.242a.75.75 0 1 0-.897-1.203 5.243 5.243 0 0 0-2.05 5.022.75.75 0 0 0 .625.627 5.243 5.243 0 0 0 5.022-2.051.75.75 0 1 0-1.202-.897 3.744 3.744 0 0 1-3.008 1.51c0-1.23.592-2.323 1.51-3.008Z",
title="World Records for Web Hosting (1997-2002)",
description="Our team started the Internet hosting and data center business in Europe. We hosted some of the largest websites in the world including UEFA, Nasa, World Cup."
) }}
{{ features(
svg="M9.315 7.584C12.195 3.883 16.695 1.5 21.75 1.5a.75.75 0 0 1 .75.75c0 5.056-2.383 9.555-6.084 12.436A6.75 6.75 0 0 1 9.75 22.5a.75.75 0 0 1-.75-.75v-4.131A15.838 15.838 0 0 1 6.382 15H2.25a.75.75 0 0 1-.75-.75 6.75 6.75 0 0 1 7.815-6.666ZM15 6.75a2.25 2.25 0 1 0 0 4.5 2.25 2.25 0 0 0 0-4.5Z",
svg2="M5.26 17.242a.75.75 0 1 0-.897-1.203 5.243 5.243 0 0 0-2.05 5.022.75.75 0 0 0 .625.627 5.243 5.243 0 0 0 5.022-2.051.75.75 0 1 0-1.202-.897 3.744 3.744 0 0 1-3.008 1.51c0-1.23.592-2.323 1.51-3.008Z",
title="The FIRST Backup Data Duplication system in the world (2005)",
description="Our advancements in this field brought up to 100x benefit compared to the status quo running in data centers at the time"
) }}
{{ features(
svg="M9.315 7.584C12.195 3.883 16.695 1.5 21.75 1.5a.75.75 0 0 1 .75.75c0 5.056-2.383 9.555-6.084 12.436A6.75 6.75 0 0 1 9.75 22.5a.75.75 0 0 1-.75-.75v-4.131A15.838 15.838 0 0 1 6.382 15H2.25a.75.75 0 0 1-.75-.75 6.75 6.75 0 0 1 7.815-6.666ZM15 6.75a2.25 2.25 0 1 0 0 4.5 2.25 2.25 0 0 0 0-4.5Z",
svg2="M5.26 17.242a.75.75 0 1 0-.897-1.203 5.243 5.243 0 0 0-2.05 5.022.75.75 0 0 0 .625.627 5.243 5.243 0 0 0 5.022-2.051.75.75 0 1 0-1.202-.897 3.744 3.744 0 0 1-3.008 1.51c0-1.23.592-2.323 1.51-3.008Z",
title="One of the FIRST Cloud Systems (2008)",
description="We were one of the pioneers of cloud computing in general. Terms like Virtual Private Data Center were invented by us."
) }}
{{ features(
svg="M9.315 7.584C12.195 3.883 16.695 1.5 21.75 1.5a.75.75 0 0 1 .75.75c0 5.056-2.383 9.555-6.084 12.436A6.75 6.75 0 0 1 9.75 22.5a.75.75 0 0 1-.75-.75v-4.131A15.838 15.838 0 0 1 6.382 15H2.25a.75.75 0 0 1-.75-.75 6.75 6.75 0 0 1 7.815-6.666ZM15 6.75a2.25 2.25 0 1 0 0 4.5 2.25 2.25 0 0 0 0-4.5Z",
svg2="M5.26 17.242a.75.75 0 1 0-.897-1.203 5.243 5.243 0 0 0-2.05 5.022.75.75 0 0 0 .625.627 5.243 5.243 0 0 0 5.022-2.051.75.75 0 1 0-1.202-.897 3.744 3.744 0 0 1-3.008 1.51c0-1.23.592-2.323 1.51-3.008Z",
title="The FIRST multi-site consistent database (2010)",
description="We invented a method to store data in a database over multiple sites in such a way data could never be lost, corrupted, or order of updates changed."
) }}
{{ features(
svg="M9.315 7.584C12.195 3.883 16.695 1.5 21.75 1.5a.75.75 0 0 1 .75.75c0 5.056-2.383 9.555-6.084 12.436A6.75 6.75 0 0 1 9.75 22.5a.75.75 0 0 1-.75-.75v-4.131A15.838 15.838 0 0 1 6.382 15H2.25a.75.75 0 0 1-.75-.75 6.75 6.75 0 0 1 7.815-6.666ZM15 6.75a2.25 2.25 0 1 0 0 4.5 2.25 2.25 0 0 0 0-4.5Z",
svg2="M5.26 17.242a.75.75 0 1 0-.897-1.203 5.243 5.243 0 0 0-2.05 5.022.75.75 0 0 0 .625.627 5.243 5.243 0 0 0 5.022-2.051.75.75 0 1 0-1.202-.897 3.744 3.744 0 0 1-3.008 1.51c0-1.23.592-2.323 1.51-3.008Z",
title="The FIRST unbreakable and distributed storage system (2012)",
description="Not only incorruptible, our system also boasts 10x energy efficiency compared to alternative solutions, marking a significant technological leap."
) }}
{{ features(
svg="M9.315 7.584C12.195 3.883 16.695 1.5 21.75 1.5a.75.75 0 0 1 .75.75c0 5.056-2.383 9.555-6.084 12.436A6.75 6.75 0 0 1 9.75 22.5a.75.75 0 0 1-.75-.75v-4.131A15.838 15.838 0 0 1 6.382 15H2.25a.75.75 0 0 1-.75-.75 6.75 6.75 0 0 1 7.815-6.666ZM15 6.75a2.25 2.25 0 1 0 0 4.5 2.25 2.25 0 0 0 0-4.5Z",
svg2="M5.26 17.242a.75.75 0 1 0-.897-1.203 5.243 5.243 0 0 0-2.05 5.022.75.75 0 0 0 .625.627 5.243 5.243 0 0 0 5.022-2.051.75.75 0 1 0-1.202-.897 3.744 3.744 0 0 1-3.008 1.51c0-1.23.592-2.323 1.51-3.008Z",
title="orizontal Scalability",
description="The network can automatically scale resources without needing to manually increase the capacity of individual components."
) }}
</div>
</div>

2
content/header/_index.md
View File

@ -8,9 +8,9 @@ extra:
imgPath: ""
---
- [Page1]("/page1")
- [Page2]("/page2")
- [Page3]("/page3")
- [Blog]("/blog")

77
content/home/index.md
View File

@ -182,10 +182,68 @@ Lorem Ipsum is simply dummy text of the printing and typesetting industry.
<!-- --------------------------------------------------- -->
<!-- section 9 (Faq) -->
<div class="lg:py-24 py-12 px-6">
<div class="lg:max-w-7xl container mx-auto">
## Frequently Asked Questions
<br>
{{ accordion(
id_accordion="accordion1"
question="question_1?",
description="Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus duis convallis tempus leo eu aenean. Urna tempor pulvinar vivamus fringilla lacus nec metus. Iaculis massa nisl malesuada lacinia integer nunc posuere. "
) }}
{{ accordion(
id_accordion="accordion2"
question="question_2?",
description="Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus duis convallis tempus leo eu aenean. Urna tempor pulvinar vivamus fringilla lacus nec metus. Iaculis massa nisl malesuada lacinia integer nunc posuere. "
) }}
{{ accordion(
id_accordion="accordion3"
question="question_3?",
description="Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus duis convallis tempus leo eu aenean. Urna tempor pulvinar vivamus fringilla lacus nec metus. Iaculis massa nisl malesuada lacinia integer nunc posuere. "
) }}
{{ accordion(
id_accordion="accordion4"
question="question_4?",
description="Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus duis convallis tempus leo eu aenean. Urna tempor pulvinar vivamus fringilla lacus nec metus. Iaculis massa nisl malesuada lacinia integer nunc posuere. ",
link="https://docs.threefold.io/docs/become-a-farmer/get_started/",
text_link="Click here to get V4 nodes."
) }}
{{ accordion(
id_accordion="accordion5"
question="question_5?",
description="Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus duis convallis tempus leo eu aenean. Urna tempor pulvinar vivamus fringilla lacus nec metus. Iaculis massa nisl malesuada lacinia integer nunc posuere. ",
link="https://docs.threefold.io/docs/category/how-to-use/",
text_link="our docs."
) }}
{{ accordion(
id_accordion="accordion6"
question="question_6?",
description="ThreeFold is designed to be secure and private by default. We use end-to-end encryption to protect your data and ensure that only you have access to your data."
)
}}
</div>
</div>
<!----------------------------------------------------------------------------------------->
<!-- section 5 (Call TO Action) -->
<div class="mx-auto max-w-7xl lg:py-4 sm:px-6 sm:py-12 lg:px-8 mb-12">
<div class="relative isolate overflow-hidden px-6 lg:py-12 py-8 text-center shadow-lg sm:px-8 border border-gray-100">
<div class="rounded-md relative isolate overflow-hidden px-6 lg:py-12 py-8 text-center shadow-lg sm:px-8 border border-gray-600">
## Call TO Action
@ -207,6 +265,21 @@ printer took a galley of type and scrambled it to make a type specimen book
<!-- --------------------------------------------------- -->
<!----------------------------------------------------------------------------------------->
<!-- section 10 Cta2 -->
{{ cta(
title_1="Lorem Ipsum",
title_2="is simply",
title_3="dummy text",
button_text_1="Button",
button_link_1="/signup",
button_text_2="Button",
button_link_2="https://t.me/threefoldnews",
button_text_3="Button",
button_link_3="https://t.me/threefoldnews"
) }}

198
content/page2/index.md
View File

@ -1,19 +1,19 @@
---
title: "Page2"
title: "page2"
description: ""
draft: false
weight: 3
weight: 2
---
<!-- section 1 (hero) -->
<!-- section 1 (hero_images) -->
{{ hero_BG_image(
image_BG="/images/hometech.jpg",
subtitle="THREEFOLD TECHNOLOGY",
title="A Revolutionary Approach",
description="Our technological framework provides global effectiveness emphasizing security, efficiency, and sustainability."
image_BG="/images/img_placeholder.jpg",
title="Hero With Image Background",
description="Lorem ipsum dolor sit amet consectetur adipiscing elit. Dolor sit amet consectetur adipiscing elit quisque faucibus"
) }}
@ -21,42 +21,66 @@ weight: 3
<!-- section 2 (Our Track Records) -->
<!-- section 2 (right text) -->
<div class="max-w-7xl mx-auto py-12 lg:py-24 px-6 lg:px-12">
<div class="relative overflow-hidden lg:py-24 py-12">
<div class="mx-auto max-w-7xl px-6 lg:px-8">
## Technology Architecture
## Lorem Ipsum
<br>
Our advanced architecture seamlessly integrates cutting-edge compute, storage, and network technologies to deliver unparalleled performance, scalability, and security. Designed for modern IT workloads, it supports everything from edge computing to large-scale data centers, ensuring efficiency and resilience at every level.
Lorem ipsum dolor sit amet consectetur adipiscing elit. Adipiscing elit quisque faucibus ex sapien vitae pellentesque. Vitae pellentesque sem placerat in id cursus mi. Cursus mi pretium tellus duis convallis tempus leo. Tempus leo eu aenean sed diam urna tempor. Urna tempor pulvinar vivamus fringilla lacus nec metus.
</div>
</div>
<!-- --------------------------------------------------- -->
<!-- section 2 (Feature Card) -->
<div class="max-w-7xl mx-auto py-12 lg:py-24 px-6 lg:px-12">
## Feature Card
<br>
Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus duis convallis tempus leo eu aenean.
<br>
<div class="grid grid-cols-1 gap-y-12 gap-x-6 lg:gap-x-16 lg:grid-cols-3 xl:gap-x-8">
<div class="mx-auto mt-10 grid max-w-2xl grid-cols-1 gap-x-8 gap-y-12 lg:mx-0 lg:max-w-none lg:grid-cols-4">
{{ image_content(
image="/images/image_placeholder.jpg",
title="Lorem ipsum dolor",
description_1="Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus duis convallis tempus leo eu aenean. Urna tempor pulvinar vivamus fringilla lacus nec metus.",
description_2="Iaculis massa nisl malesuada lacinia integer nunc posuere. Semper vel class aptent taciti sociosqu ad litora. Conubia nostra inceptos himenaeos orci varius natoque penatibus.",
{{ features_top_img(
svg="/images/0.svg",
title="Layer 0",
description="Interconnected nodes (Zero-OS) delivering compute (GPU, CPU), storage and network. Localized & More Secure."
description_3="Dis parturient montes nascetur ridiculus mus donec rhoncus. Nulla molestie mattis scelerisque maximus eget fermentum odio. Purus est efficitur laoreet mauris pharetra vestibulum fusce."
)}}
{{ features_top_img(
svg="/images/1.svg",
title="Layer 1",
description="Compatible with any Web 2 and Web 3 standard + ready for true peer-to-peer transactions at any scale."
{{ image_content(
image="/images/image_placeholder.jpg",
title="Lorem ipsum dolor",
description_1="Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus duis convallis tempus leo eu aenean. Urna tempor pulvinar vivamus fringilla lacus nec metus.",
description_2="Iaculis massa nisl malesuada lacinia integer nunc posuere. Semper vel class aptent taciti sociosqu ad litora. Conubia nostra inceptos himenaeos orci varius natoque penatibus.",
description_3="Dis parturient montes nascetur ridiculus mus donec rhoncus. Nulla molestie mattis scelerisque maximus eget fermentum odio. Purus est efficitur laoreet mauris pharetra vestibulum fusce."
)}}
{{ features_top_img(
svg="/images/2.svg",
title="Layer 2",
description="Always available shortest path end-to-end encrypted network layer. Digital Self-Tech allows self healing."
)}}
{{ image_content(
image="/images/image_placeholder.jpg",
title="Lorem ipsum dolor",
description_1="Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus duis convallis tempus leo eu aenean. Urna tempor pulvinar vivamus fringilla lacus nec metus.",
{{ features_top_img(
svg="/images/3.svg",
title="Layer 3",
description="Better security, data availability, performance at all times for all users. 100% private & Secure."
description_2="Iaculis massa nisl malesuada lacinia integer nunc posuere. Semper vel class aptent taciti sociosqu ad litora. Conubia nostra inceptos himenaeos orci varius natoque penatibus.",
description_3="Dis parturient montes nascetur ridiculus mus donec rhoncus. Nulla molestie mattis scelerisque maximus eget fermentum odio. Purus est efficitur laoreet mauris pharetra vestibulum fusce."
)}}
</div>
@ -65,63 +89,75 @@ Our advanced architecture seamlessly integrates cutting-edge compute, storage, a
<!-- --------------------------------------------------- -->
<!-- section 6 (Join the Movement) -->
<!-- section 3 (Technical Specifications) -->
<div class="lg:py-24 py-12 px-4">
<div class="container max-w-7xl mx-auto">
{{ tabs() }}
<!-- --------------------------------------------------- -->
<!-- section 4 (Technological Benefits) -->
<div class="max-w-7xl mx-auto py-12 lg:py-24 px-6 lg:px-12">
## Technological Benefits
## Cards Link
<br>
Discover Our Cutting-Edge Technological Benefits: Unleashing Unmatched Efficiency, Security, and Scalability.
<div class="max-w-4xl">
Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus duis convallis tempus leo eu aenean. Urna tempor pulvinar vivamus fringilla lacus nec metus.
<div class="mx-auto mt-10 grid max-w-2xl grid-cols-1 gap-x-8 gap-y-12 lg:mx-0 lg:max-w-none lg:grid-cols-3">
{{ features_top_img(
svg="/images/performance.svg",
title="Improved Performance",
description="Enhance compute and operational efficiency by achieving faster response times and minimizing latency."
)}}
{{ features_top_img(
svg="/images/security.svg",
title="Enhanced Security",
description="Encrypted, compressed, fragmented, and distributed data enhances security, efficiency, and resilience across interconnected nodes."
)}}
{{ features_top_img(
svg="/images/sovereignty.svg",
title="Data Sovereignty",
description="Empowering nations, businesses, and individuals with deliberate design, granting control and ownership over their data."
)}}
{{ features_top_img(
svg="/images/computing.svg",
title="Edge Computing",
description="Allow to distribute computing power closer to end-users or any devices."
)}}
{{ features_top_img(
svg="/images/decentralized.svg",
title="Decentralized",
description="Our solutions offer a range of governance options, from decentralized, federated to centralized models."
)}}
{{ features_top_img(
svg="/images/scalability.svg",
title="Horizontal Scalability",
description="The network can automatically scale resources without needing to manually increase the capacity of individual components."
)}}
</div>
</div>
<div class="max-w-7xl mx-4 md:mx-10 lg:mx-20 mt-16 xl:mx-auto">
<div class="flex lg:flex-row flex-col">
{{ image_card(
image_src="/images/image_placeholder.jpg",
image_alt="image",
title="Title_card_1",
tooltip="Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat id",
target="_blank",
card_link="#"
) }}
{{ image_card(
image_src="/images/image_placeholder.jpg",
image_alt="image",
title="Title_card_2",
tooltip="Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat id",
target="_blank",
card_link="#"
) }}
{{ image_card(
image_src="/images/image_placeholder.jpg",
image_alt="image",
title="Title_card_3",
tooltip="Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat id",
target="_blank",
card_link="#"
) }}
{{ image_card(
image_src="/images/image_placeholder.jpg",
image_alt="image",
title="Title_card_4",
tooltip="Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat id",
target="_blank",
card_link="#"
) }}
{{ image_card(
image_src="/images/image_placeholder.jpg",
image_alt="image",
title="Title_card_5",
tooltip="Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat id",
target="_blank",
card_link="#"
) }}
</div>
</div>
<div class="justify-center items-center flex">
<a href="/page3" class="bg-theme text-theme rounded-md text-sm px-4 py-2 font-semibold shadow-sm">Button</a>
</div>
</div>
</div>
<!---------------------------------------------------------------->

108
content/page3/index.md
View File

@ -1,96 +1,38 @@
---
title: "Page3"
title: "page3"
description: ""
draft: false
weight: 4
weight: 3
---
<!-- section 1 (hero) -->
<br>
<br>
<br>
<!-- section 1 (Hero With I Image) -->
{{ hero_side(
title="Hero With I Image",
description_1="Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus duis convallis tempus leo eu aenean.",
description_2="Urna tempor pulvinar vivamus fringilla lacus nec metus. Iaculis massa nisl malesuada lacinia integer nunc posuere. Semper vel class aptent taciti sociosqu ad litora.",
image_src="/images/image_placeholder.jpg",
image_alt="AIBox Specifications"
{{ hero_BG_image(
image_BG="/images/uscase_BG.png",
subtitle="REAL WORLD APPLICATIONS",
title="Bring Your Vision to Life",
description="Our stack's versatility allows deployment across various use cases, demonstrating our commitment to providing flexible and adaptable IT solutions for a wide range of industries and applications."
) }}
<!-- --------------------------------------------------- -->
<!-- section 3 (Multi Tabs) -->
<!-- To edit go to templates/shortcodes/tabs.html -->
{{ tabs() }}
<!-- --------------------------------------------------- -->
<!-- section 2 (Our Track Records) -->
<div class="max-w-7xl mx-auto py-12 lg:py-24 px-6 lg:px-12">
<div class="absolute -bottom-8 -left-96 -z-10 transform-gpu blur-3xl sm:-bottom-64 sm:-left-40 lg:-bottom-32 lg:left-8 xl:-left-10" aria-hidden="true">
<div class="aspect-[1266/975] w-[79.125rem] bg-gradient-to-tr from-[#ff4694] to-[#776fff] opacity-20" 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>
## Use Cases
<br>
Uncover how GeoMind's advanced technology is revolutionizing various industries and delivering exceptional results through our in-depth use cases.
<br>
<div class="grid grid-cols-1 gap-y-12 gap-x-6 lg:gap-x-16 lg:grid-cols-3 xl:gap-x-8">
{{ image_content(
image="/images/usecases_tiers.png",
title="Tier-S Data Center",
description_1="Over the last 30 years, data center construction has largely remained static. Contemporary data centers risk becoming obsolete if they continue to neglect evolving needs.",
description_2="The Tier S model is designed to exceed the capabilities of traditional Tier 3 and 4 Data Centers, addressing the increasing demand for infrastructure that can support emerging IT workloads with greater efficiency and resilience. Where “S” stands for “Self-Healing,” Tier S Data Centers present a new way forward, while remaining backward compatible.",
description_3="Key benefits include superior reliability, 100% redundancy, flexible configuration, disaster resilience, and self-healing capabilities."
)}}
{{ image_content(
image="/images/usecases_tfgrid.png",
title="ThreeFold Grid",
description_1="The ThreeFold Grid is one of the core use cases of our ecosystem, providing a decentralized, scalable, and secure infrastructure that redefines how digital resources are distributed and consumed.",
description_2="Built on a global network of independent, autonomous nodes, the ThreeFold Grid enables individuals and businesses to contribute to and benefit from a more open and participatory cloud and Internet model.",
description_3="By leveraging the ThreeFold Grid, users can access compute, storage, and networking resources in a decentralized manner, supporting edge computing, decentralized applications, and Web3 innovations."
)}}
{{ image_content(
image="/images/usecases_digital_zone.png",
title="Zanzibar Digital Free Zone",
description_1="Zanzibar Digital Free Zone is designed to offer a new paradigm for digital business, providing a unique jurisdiction for digital innovation and growth.",
description_2="It combines regulatory flexibility with decentralized infrastructure, empowering businesses to operate globally while maintaining compliance with local regulations.",
description_3="By participating in Zanzibar Digital FreeZone, businesses can scale faster, access global markets, and benefit from a sustainable, decentralized infrastructure that supports the next generation of digital applications and services."
)}}
{{ image_content(
image="/images/usecases_sovereign.png",
title="Sovereign Internet for Countries",
description_1="Most countries do not have their own Internet, rather they rely on other countries and large corporations to own and operate their Internet capacity.",
description_2="GeoMind brings a solution for countries to deploy their own sovereign Cloud & Internet, within their own borders – driving economic benefits, data sovereignty, and more.",
description_3="Today we are speaking with multiple governments about this possibility, with one already in plans to move forward."
)}}
{{ image_content(
image="/images/usecases_cyber.png",
title="Cyber Pandemic Solution",
description_1="The Cyber Pandemic solution is GeoMind’s answer to the growing threats of cyberattacks, providing a secure, decentralized infrastructure that is immune to large-scale breaches by decentralizing data storage and processing across a global network of independent nodes.",
description_2="With GeoMind solutions, organizations can safeguard critical data, minimize risks from cyber threats, and maintain business continuity in an increasingly connected and volatile digital world."
)}}
</div>
</div>
<!-- --------------------------------------------------- -->

4
css/index.css
View File

@ -149,9 +149,9 @@ body {
background: var(--color-bg);
color: var(--color-text);
}
a, a:visited {
/* a, a:visited {
color: var(--color-link);
}
} */
header, .header, .banner {
background: var(--color-header) !important;
}

BIN
static/images/geomind_logo.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 17 KiB

BIN
static/images/hometech.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 174 KiB

BIN
static/images/hometech2.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 108 KiB

BIN
static/images/image_placeholder.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 33 KiB

BIN
static/images/img_placeholder.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 16 KiB

BIN
static/images/mesh2.gif
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 592 KiB

4
templates/partials/intro.html
View File

@ -1,6 +1,6 @@
{% block content %}
<div class="lg:mt-24 mb-6 mt-6">
<h2 class="mb-4 text-center text-4xl lg:text-5xl text-gray-100 md:mb-6">{{ section.title }}</h2>
<div class="lg:mt-24 pt-24 mb-6 mt-6">
<h2 class="mb-4 text-center md:mb-6">{{ section.title }}</h2>
<p class="mx-auto max-w-5xl text-center text-gray-200 text-base md:text-lg">
{{ section.description }}
</p>

2
templates/partials/person_card.html
View File

@ -4,7 +4,7 @@
<img class="aspect-[14/13] w-full rounded-2xl object-cover" src="{{url}}" alt="{{page.title ~ ' Picture'}}" />
<div class="text-center mt-4">
<h2 class="text-xl">{{page.title}}</h2>
<div class="text-base text-gray-100 line-clamp-3 leading-5 text-ellipsis">
<div class="text-base text-gray-500 line-clamp-3 leading-5 text-ellipsis">
{% if page.description %}
{{page.description}}
{% else %}

50
templates/shortcodes/accordion.html Normal file
View File

@ -0,0 +1,50 @@
{% set question = question | default(value="") %}
{% set id_accordion = id_accordion | default(value="") %}
{% set description = description | default(value="") %}
{% set link = link | default(value="") %}
{% set text_link = text_link | default(value="") %}
<div class="rounded-lg overflow-hidden my-2 border border-gray-500">
<input type="checkbox" id="{{ id_accordion }}" class="peer hidden">
<label for="{{ id_accordion }}" class="accordion flex items-center justify-between p-4 cursor-pointer transition-colors">
<span class="text-lg font-medium ">{{ question }}</span>
<svg class="w-6 h-6 transition-transform peer-checked:rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path>
</svg>
</label>
<div class="max-h-0 overflow-hidden transition-all duration-300 peer-checked:max-h-screen">
<div class="p-4 flex">
{% if description %}
<p class="text-lg">{{ description }}
{% if link %}
<a class="ml-1 font-semibold"href="{{ link }}" target="_blank">{{ text_link }}</a> </p>
{% endif %}
{% endif %}
</div>
</div>
</div>
<style>
.accordion:hover {
background-color: rgb(255 255 255 / 5%) !important;
}
</style>

34
templates/shortcodes/cta.html Normal file
View File

@ -0,0 +1,34 @@
{% set title_1 = title_1 | default(value="") %}
{% set title_2 = title_2 | default(value="") %}
{% set title_3 = title_3 | default(value="") %}
{% set button_text_1 = button_text_1 | default(value="") %}
{% set button_link_1 = button_link_1 | default(value="") %}
{% set button_text_2 = button_text_2 | default(value="") %}
{% set button_link_2 = button_link_2 | default(value="") %}
{% set button_text_3 = button_text_3 | default(value="") %}
{% set button_link_3 = button_link_3 | default(value="") %}
{% set button_text_4 = button_text_4 | default(value="") %}
{% set button_link_4 = button_link_4 | default(value="") %}
<div class="bg-transparent pt-12 pb-12">
<div class="border border-gray-600 mx-auto rounded-md bg-black/5 max-w-7xl px-6 py-12 lg:flex lg:items-center lg:justify-between lg:px-20">
<h2 class="lg:text-balance max-w-xl leading-tight items-start lg:text-left text-center fade-in">
{{ title_1 }} <br>{{ title_2 }}<br> {{ title_3 }}
</h2>
<div class="mt-10 flex items-center 0 gap-x-6 lg:mt-0 lg:shrink-0 flex-wrap justify-center lg:justify-start">
<a href="{{ button_link_1 }}" target="_blank" class="bg-theme text-theme rounded-md text-sm px-4 py-2 font-semibold shadow-sm">
{{ button_text_1 }}
</a>
<a href="{{ button_link_2 }}" target="_blank" class="bg-theme text-theme rounded-md text-sm px-4 py-2 font-semibold shadow-sm">
{{ button_text_2 }}
</a>
<a href="{{ button_link_3 }}" target="_blank" class="bg-theme text-theme rounded-md text-sm px-4 py-2 font-semibold shadow-sm">
{{ button_text_3 }}
</a>
{% if button_link_4 %}
<a href="{{ button_link_4 }}" class="fade-in text-sm/6 font-semibold text-white">{{ button_text_4 }}<span aria-hidden="true">→</span></a>
{% endif%}
</div>
</div>
</div>

8
templates/shortcodes/hero_BG_image.html
View File

@ -6,9 +6,9 @@
<div class="relative isolate overflow-hidden px-6 py-24 sm:py-32 lg:px-8">
<img src="{{ image_BG }}" alt="" class="absolute inset-0 -z-10 h-full w-full object-cover">
<div class="absolute -bottom-8 -left-96 -z-10 transform-gpu blur-3xl sm:-bottom-64 sm:-left-40 lg:-bottom-32 lg:left-8 xl:-left-10" aria-hidden="true">
{# <div class="absolute -bottom-8 -left-96 -z-10 transform-gpu blur-3xl sm:-bottom-64 sm:-left-40 lg:-bottom-32 lg:left-8 xl:-left-10" aria-hidden="true">
<div class="aspect-[1266/975] w-[79.125rem] bg-gradient-to-tr from-[#ff4694] to-[#776fff] opacity-20" 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 class="mx-auto max-w-2xl text-center">
<br>
<br>
@ -17,7 +17,7 @@
{% if subtitle %}
<h5>{{ subtitle }}</h5>
{% endif %}
<h1 class="pt-30">{{ title }}</h1>
<p class="mt-6 text-lg leading-8 text-gray-300">{{ description }}</p>
<h1 class="text-white pt-30">{{ title }}</h1>
<p class="mt-6 text-lg leading-8 text-white">{{ description }}</p>
</div>
</div>

60
templates/shortcodes/hero_side.html Normal file
View File

@ -0,0 +1,60 @@
{% set title = title | default(value="") %}
{% set image_src = image_src | default(value="") %}
{% set image_alt = image_alt | default(value="") %}
{% set description_1 = description_1 | default(value="") %}
{% set description_2 = description_2 | default(value="") %}
<section class="flex items-center justify-center isolate overflow-hidden py-24 lg:py-24">
<div class="mt-10 lg:mt-1 max-w-7xl mx-auto px-6 lg:px-16 flex flex-col-reverse lg:flex-row items-center ">
<!-- Left Content -->
<div class="w-full lg:w-1/2 lg:text-left">
<h1 class="fade-in">{{ title }}</h1>
<p class="mx-auto mt-6 fade-in">{{ description_1 }}
<br><br>{{ description_2 }}</p>
</div>
<!-- Right Image -->
<div class="w-full lg:w-1/2 flex justify-center">
<img src="{{ image_src }}" alt="{{ image_alt }}" class="blinking-effect w-full max-w-md lg:max-w-lg h-auto">
</div>
</div>
</section>
<style>
/* Apply the blinking animation to the link */
.blinking-effect {
animation: blink 2s infinite; /* Adjust the speed here (1.5s for slow blinking) */
}
/* Define the fade-in animation */
@keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
/* Apply the fade-in animation to elements with the 'fade-in' class */
.fade-in {
animation: fadeIn 4s ease-in-out forwards; /* Adjust the duration (2s) to make it slower or faster */
}
/* Optional: Delay the animation for a more staggered effect */
h2 {
animation-delay: 0.5s; /* Delay for header */
}
p {
animation-delay: 1s; /* Delay for paragraphs */
}
</style>

113
templates/shortcodes/image_card.html Normal file
View File

@ -0,0 +1,113 @@
{% set image_src = image_src | default(value="") %}
{% set image_alt = image_alt | default(value="") %}
{% set title = title | default(value="") %}
{% set card_link = card_link | default(value="") %}
{% set tooltip = tooltip | default(value="") %}
{% set target = target | default(value="") %}
{% set header = header | default(value="") %}
<a href="{{ card_link }}" class="flex-1 mx-2 mb-8" target="{{ target }}">
<div class="tooltip">
{% if tooltip %}
<span class="tooltiptext">{{ tooltip }}</span>
{% endif %}
<div class="fade-in-box flex flex-col p-6 rounded-2xl border border-gray-100 bg-black/5">
{% if header %}
<h2 class="text-2xl text-center flex justify-center items-center">{{ header }}</h2>
{% endif %}
{% if image_src %}
<img class="fade-in blinking-effect relative mx-auto mb-4" width="60%" src="{{ image_src }}" alt="{{ image_alt }}">
{% endif %}
</div>
</div>
{% if title %}
<div class="flex justify-center my-4 items-center gap-x-3 lg:text-xl text-lg font-semibold">
{{ title }}
</div>
{% endif %}
</a>
<style>
/* Fade-in animation for the grid items */
.fade-in-box {
opacity: 0;
animation: fadeIn 0.6s ease-in-out forwards;
}
/* Fading in each grid item with a slight delay */
.fade-in-box:nth-child(1) { animation-delay: 0s; }
.fade-in-box:nth-child(2) { animation-delay: 0.2s; }
.fade-in-box:nth-child(3) { animation-delay: 0.4s; }
.fade-in-box:nth-child(4) { animation-delay: 0.6s; }
.fade-in-box:nth-child(5) { animation-delay: 0.8s; }
.fade-in-box:nth-child(6) { animation-delay: 1s; }
.fade-in-box:nth-child(7) { animation-delay: 1.2s; }
.fade-in-box:nth-child(8) { animation-delay: 1.4s; }
.fade-in-box:nth-child(9) { animation-delay: 1.6s; }
.fade-in-box:nth-child(10) { animation-delay: 1.8s; }
.fade-in-box:nth-child(11) { animation-delay: 2s; }
.fade-in-box:nth-child(12) { animation-delay: 2.2s; }
@keyframes fadeIn {
to {
opacity: 1;
}
}
/* Tooltip container */
.tooltip {
position: relative;
display: inline-block;
width: 100%;
}
/* Tooltip text */
.tooltip .tooltiptext {
font-size: 12px;
visibility: hidden;
background-color: rgb(26 26 26 / 70%);
color: #fff;
text-align: center;
padding: 5px 10px;
border-radius: 4px;
/* Position the tooltip text - see examples below! */
position: absolute;
z-index: 1;
bottom: 0px;
top: 0px;
left: 0px;
right: 0px;
display: flex;
align-items: center;
justify-content: center;
}
/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
visibility: visible;
}
@media (max-width: 480px) {
.tooltip .tooltiptext {
position: absolute;
z-index: 1;
bottom: -7px !important;
right: 0px !important;
top: 0px !important;
left: 0px !important;
}
}
</style>

79
templates/shortcodes/tabs.html
View File

@ -2,19 +2,18 @@
<section aria-labelledby="features-heading" class="mx-auto max-w-7xl py-12 lg:py-24 sm:px-2 lg:px-8">
<div class="mx-auto max-w-2xl px-4 lg:max-w-none lg:px-0">
<div class="max-w-3xl">
<h2 id="features-heading">Technical Specifications</h2>
<p class="mt-4">Dive into the technical details that empower our revolutionary cloud platform, Offering Compute (GPU, CPU), Storage and Network.</p>
<h2 id="features-heading">Multi Tabs</h2>
<p class="mt-4">Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus duis convallis tempus leo eu aenean.</p>
</div>
<div class="mt-4">
<div class="-mx-4 flex overflow-x-auto sm:mx-0">
<div class="flex-auto border-b border-gray-200 px-4 sm:px-0">
<div class="-mb-px flex space-x-2 lg:space-x-10" aria-orientation="horizontal" role="tablist">
<!-- Current: "border-indigo-400 text-indigo-400", Default: "border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700" -->
<button id="features-tab-1" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-50 hover:text-gray-300" aria-controls="features-panel-1" role="tab" type="button">3Nodes</button>
<button id="features-tab-2" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-50 hover:text-gray-300" aria-controls="features-panel-2" role="tab" type="button">Zero-OS</button>
<button id="features-tab-3" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-50 hover:text-gray-300" aria-controls="features-panel-3" role="tab" type="button">Mycelium</button>
<button id="features-tab-4" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-50 hover:text-gray-300" aria-controls="features-panel-4" role="tab" type="button">QSS</button>
<button id="features-tab-1" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-400 hover:text-gray-300" aria-controls="features-panel-1" role="tab" type="button">Tab1</button>
<button id="features-tab-2" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-400 hover:text-gray-300" aria-controls="features-panel-2" role="tab" type="button">Tab2</button>
<button id="features-tab-3" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-400 hover:text-gray-300" aria-controls="features-panel-3" role="tab" type="button">Tab3</button>
<button id="features-tab-4" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-400 hover:text-gray-300" aria-controls="features-panel-4" role="tab" type="button">Tab4</button>
</div>
</div>
</div>
@ -22,21 +21,21 @@
<div id="features-panel-1" class="space-y-6 pt-4" aria-labelledby="features-tab-1" role="tabpanel" tabindex="0">
<div class="flex flex-col-reverse lg:grid lg:grid-cols-12 lg:gap-x-8">
<div class="mt-6 lg:col-span-7 lg:mt-0">
<h3 class="">3Nodes</h3>
<p class="mt-2 ">3Nodes are the hardware building blocks of our stack and are installed in data centres, offices or homes.
<h3 class="">Tab1</h3>
<p class="mt-2 ">Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus
</p>
<dl class="mt-6 space-y-4">
<div>
<h5 class="text-lg mb-0">&#8226; Plug & Play</h5>
<p class="text-base">Simply connect your certified node to the internet.</p>
<h5 class="text-lg mb-0">&#8226; Title1</h5>
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
</div>
<div>
<h5 class="text-lg mb-0">&#8226; Peer-to-peer</h5>
<p class="text-base">Consumes up to 10x less energy for certain workloads.</p>
<h5 class="text-lg mb-0">&#8226; Title2</h5>
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
</div>
<div>
<h5 class="text-lg mb-0">&#8226; Scalable</h5>
<p class="text-base">Nodes can be deployed on any level providing unlimited scalability.</p>
<h5 class="text-lg mb-0">&#8226; Title3</h5>
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
</div>
</dl>
</div>
@ -50,20 +49,21 @@
<div id="features-panel-2" class="space-y-6 pt-4" aria-labelledby="features-tab-2" role="tabpanel" tabindex="0">
<div class="flex flex-col-reverse lg:grid lg:grid-cols-12 lg:gap-x-8">
<div class="mt-6 lg:col-span-7 lg:mt-0">
<h3>Zero-OS</h3>
<p class="mt-2 text-base text-gray-50">Zero-OS is a bare-metal, stateless, and efficient operating system designed to host AI, Web2, and Web3 workloads in a more sovereign manner, without compromising on security, control, and monitoring.</p>
<h3 class="">Tab2</h3>
<p class="mt-2 ">Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus
</p>
<dl class="mt-6 space-y-4">
<div>
<h5 class="text-lg mb-0">&#8226; CORE-0</h5>
<p class="mt-2 text-base text-gray-100">First process launched on the Zero-OS. This process kicks off all activities on the node and allows the full OS to be booted over the network maintening full integrity and hacking surfaces </p>
<h5 class="text-lg mb-0">&#8226; Title1</h5>
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
</div>
<div>
<h5 class="text-lg mb-0">&#8226; Hardware Support</h5>
<p class="mt-2 text-base text-gray-100">Support for INTEL, AMD or ARM Based CPUs. Support any amount of GPU/CPU/Memory</p>
<h5 class="text-lg mb-0">&#8226; Title2</h5>
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
</div>
<div>
<h5 class="text-lg mb-0">&#8226; Kernel</h5>
<p class="mt-2 text-base text-gray-100">Zero-OS uses the well known Linux Kernel because it has device drivers for almost any hardware that exists.</p>
<h5 class="text-lg mb-0">&#8226; Title3</h5>
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
</div>
</dl>
</div>
@ -77,22 +77,21 @@
<div id="features-panel-3" class="space-y-6 pt-4" aria-labelledby="features-tab-3" role="tabpanel" tabindex="0">
<div class="flex flex-col-reverse lg:grid lg:grid-cols-12 lg:gap-x-8">
<div class="mt-6 lg:col-span-7 lg:mt-0">
<h3>Mycelium</h3>
<p class="mt-2 text-base text-gray-50">
Mycelium is the culmination of a decade-long quest for a more efficient network system, enabling faster and more reliable communication between machines and people.
<h3 class="">Tab3</h3>
<p class="mt-2 ">Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus
</p>
<dl class="mt-6 space-y-4">
<div>
<h5 class="text-lg mb-0">&#8226; Shortest Path Route</h5>
<dd class="mt-2 text-base text-gray-100">Mycelium optimizes data transmission by identifying and utilizing the fastest and most direct routes.</dd>
<h5 class="text-lg mb-0">&#8226; Title1</h5>
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
</div>
<div>
<h5 class="text-lg mb-0">&#8226; End-to-End Encrypted</h5>
<dd class="mt-2 text-base text-gray-100">All data is secured with end-to-end encryption, ensuring protection against interception.</dd>
<h5 class="text-lg mb-0">&#8226; Title2</h5>
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
</div>
<div>
<h5 class="text-lg mb-0">&#8226; Ultra Compatible</h5>
<dd class="mt-2 text-base text-gray-100">Mycelium seamlessly integrates with any existing internet connection, including peer-to-peer networks.</dd>
<h5 class="text-lg mb-0">&#8226; Title3</h5>
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
</div>
</dl>
</div>
@ -106,21 +105,21 @@
<div id="features-panel-4" class="space-y-6 pt-4" aria-labelledby="features-tab-4" role="tabpanel" tabindex="0">
<div class="flex flex-col-reverse lg:grid lg:grid-cols-12 lg:gap-x-8">
<div class="mt-6 lg:col-span-7 lg:mt-0">
<h3>QSS</h3>
<p class="mt-2 text-base text-gray-100">A decentralized, globally distributed data storage system that is up to 10 times more efficient in terms of power and hardware usage. It is highly reliable, ensuring that data cannot be lost or corrupted. Additionally, it is safe, private, and scalable.
<h3 class="">Tab4</h3>
<p class="mt-2 ">Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus
</p>
<dl class="mt-6 space-y-4">
<div>
<h5 class="text-lg mb-0">&#8226; Always Consistent</h5>
<dd class="mt-2 text-base text-gray-100">It employs advanced storage algorithms that fragment files into multiple pieces distributed across numerous nodes and sites.</dd>
<h5 class="text-lg mb-0">&#8226; Title1</h5>
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
</div>
<div>
<h5 class="text-lg mb-0">&#8226; Self-healing</h5>
<dd class="mt-2 text-base text-gray-100">The storage layer is equipped with automatic data integrity checks that promptly detect and correct any corruption, ensuring continuous data health..</dd>
<h5 class="text-lg mb-0">&#8226; Title2</h5>
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
</div>
<div>
<h5 class="text-lg mb-0">&#8226; Ultra Secure</h5>
<dd class="mt-2 text-base text-gray-100">With its sophisticated encryption and redundancy protocols, data remains secure, protected from loss, and impervious to corruption.</dd>
<h5 class="text-lg mb-0">&#8226; Title3</h5>
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
</div>
</dl>
</div>