From 50213a4de37f2ec272a80f01421929a34268b402 Mon Sep 17 00:00:00 2001
From: ehab-hassan <hassane@codescalers.com>
Date: Mon, 23 Jun 2025 15:34:17 +0300
Subject: [PATCH] tileline at home

---
 content/home/index.md | 43 ++++++++++++++++++++++++++++++++++---------
 css/index.css         |  2 +-
 2 files changed, 35 insertions(+), 10 deletions(-)

diff --git a/content/home/index.md b/content/home/index.md
index 94091e8..a951549 100644
--- a/content/home/index.md
+++ b/content/home/index.md
@@ -118,7 +118,7 @@ extra:
 <!-- Section 34 (Push the Limits) -->
 
 <div class="mx-auto max-w-7xl px-4 lg:px-8 lg:py-24 py-12">
-<div class="mx-auto mb-8 " style="width:60%">
+<div class="product mx-auto mb-8 " style="width:60%">
 
 ![aibox](/images/aibox8.jpg)
     
@@ -135,39 +135,53 @@ extra:
 </div>
 
 
-<div class="mx-auto mt-16 grid max-w-2xl grid-cols-1 gap-x-6 gap-y-10 sm:grid-cols-2 sm:gap-y-16 lg:max-w-none lg:grid-cols-3 lg:gap-x-8">
-<div class="border-t border-gray-200 pt-4">
+<div class="mx-auto mt-10 grid max-w-2xl grid-cols-1 gap-x-6 gap-y-10 lg:max-w-none lg:grid-cols-3 lg:gap-x-10">
+
+
+<div class="p-2 lg:p-6">
 
 #### For Developers & Hackers
 
+<div class="border-t  border-gray-300 pt-4">
+
 - Direct GPU programming with ROCm
 - Custom containerization support
 - Full Linux kernel access
 - Next-gen P2P networking
 
-</div>    
-<div class="border-t  border-gray-200 pt-4">
+</div> 
+</div>
+
+<div class="p-2 lg:p-6">
 
 #### For AI Researchers
 
+<div class="border-t  border-gray-300 pt-4">
+
 - Support for popular ML frameworks (PyTorch, TensorFlow)
 - Large model training capability (up to 48GB VRAM)
 - Distributed training support
 - Dataset management tools
-</div> 
 
-<div class="border-t border-gray-200 pt-4">
+</div> 
+</div>
+
+<div class="p-2 lg:p-6">
 
 #### For Tech Enthusiasts
 
+<div class="border-t border-gray-300 pt-4">
+
 - Water cooling management interface
 - Power consumption monitoring
 - Performance benchmarking tools
-- Resource allocation controls          
+- Resource allocation controls 
+        
 </div>       
 </div>
 </div>
 </div>
+</div>
 
 
 
@@ -250,4 +264,15 @@ extra:
     button_link_2="",
     button_text_3="Learn More",
     button_link_3="https://threefold.info/aibox/docs/"
-) }}
\ No newline at end of file
+) }}
+
+
+<style>
+
+@media (max-width: 480px) {
+  
+  .product {
+    width: 100% !important;
+  }
+
+</style>
\ No newline at end of file
diff --git a/css/index.css b/css/index.css
index f483d89..2b0ecd1 100644
--- a/css/index.css
+++ b/css/index.css
@@ -270,7 +270,7 @@ background-color:#5596f5 !important;
     @apply font-normal;
   }
   h4 {
-    @apply text-xl font-semibold my-4 tracking-wider;
+    @apply text-xl font-semibold my-2 tracking-wider;
     font-family: "Inter", sans-serif !important;
     
   }