// Bricks 300SL content

src/app/content/bricks/Bricks.styl

@@ -1,10 +1,14 @@
 .bricks {
+
   width: calc(100% + var(--frame-title-size));
   height: calc(100% + var(--frame-close-button-size));
 
   margin-left: calc(-1 * var(--frame-title-size));
   margin-top: calc(-1 * var(--frame-close-button-size));
 
+  --actionColor: rgb(255, 29, 29);
+  --activeColor: rgb(255, 74, 74);
+
   section .bricks-content {
     padding-left: var(--frame-title-size);
   }

src/app/content/bricks/Bricks.tsx

@@ -59,7 +59,7 @@ export const Bricks = () => {
 
 
   sections[1].content = <>
-    <div style={{ position: 'absolute', top: '50vh' }}>
+    <div style={{ position: 'absolute', top: 0 }}>
       <Mb300slContent />
     </div>
     <div style={{ height: '100vh', position: 'sticky', top: 0, overflow: 'hidden', pointerEvents: 'none' }}>

src/app/content/bricks/loadingBrick/LoadingBrick.tsx

@@ -6,7 +6,7 @@ export const LoadingBrick = ({ studs = [2, 4], duration = 300 }: { studs?: [numb
   const [time, setTime] = useState(0);
   const elementRef = React.createRef<HTMLDivElement>();
   const dimension = useDimension(elementRef) ?? { width: 300, height: 300 };
-  const size = Math.min(dimension.width, dimension.height, 500);
+  const size = Math.min(dimension.width * 0.8, dimension.height * 0.8, 500);
 
   useEffect(() => {
     let animationFrameId: number;

src/app/content/bricks/mb300sl/Mb300slContent.styl

@@ -1,12 +1,27 @@
 .mb-300sl-content {
-  color: white; 
-  opacity: 0.9;
-  font-size: 15vw;
-  padding-top: 30px;
-  font-weight: 900;
-  height: 100%;
-  display: flex;
-  justify-content: left;
-  align-items: top;
-  mix-blend-mode: difference;
+  color: white;
+  width: clamp(200px, 50%, 500px);
+
+  .sticky-container {
+    .sticky-content {
+      top: 25vh;
+      position: sticky;
+      margin-bottom: 50px;
+    }
+    &::after {
+      content: '';
+      display: block;
+      height: 250px;
+    }
+  }
+
+  h1 {
+    opacity: 0.9;
+    font-size: 15vw;
+    font-weight: 900;
+    display: flex;
+    justify-content: left;
+    align-items: top;
+    mix-blend-mode: difference;
+  }
 }

src/app/content/bricks/mb300sl/Mb300slContent.tsx

@@ -1,12 +1,51 @@
 import './Mb300slContent.styl';
-import React from 'react';
+import React, { ReactNode } from 'react';
 
 export function Mb300slContent() {
 
+  const StickyContainer = ({ children }: { children: ReactNode }) => {
+    return (
+      <div className='sticky-container'>
+        <p className='sticky-content'>{children}</p>
+      </div>
+    );
+  };
 
   return (
     <div className='mb-300sl-content bricks-content'>
-      300SL
+      <StickyContainer>
+        <h1>300SL</h1>
+      </StickyContainer>
+      <StickyContainer>
+        <h2>Mercedes-Benz 300SL Coupé (1955)</h2>
+        Probably one of the most beautiful cars in history is now available in Creator Expert Car scale (1/13): the Mercedes-Benz 300SL Coupé from 1955.
+        Build it yourself and get the instructions for this 1443 piece set on <a href="https://rebrickable.com/mocs/MOC-59792/tmunz/mercedes-benz-300sl-gullwing-coupe-1955-300-sl">Rebrickable</a>.
+        Besides the openable hood and trunk, the model features the iconic gullwing doors of the original.
+      </StickyContainer>
+      <StickyContainer>
+        <h2>An Automotive Icon</h2>
+        The Mercedes-Benz 300SL Coupé, celebrated as the "Sports Car of the Century," is more than just the fastest production car of its era.
+        It represents a harmonious blend of engineering and artistry, turning heads wherever it goes.
+        Its striking design, highlighted by the iconic gullwing doors, became a symbol of innovation and luxury.
+        Revered by car enthusiasts and immortalized by artists like Andy Warhol, the 300SL continues to inspire with its timeless allure.
+      </StickyContainer>
+      <StickyContainer>
+        <h2>Dimensions</h2>
+        <ul>
+          <li>Width: 13cm / 16 studs</li>
+          <li>Length: 35cm / 44 studs</li>
+          <li>Height: 10cm / 10 bricks</li>
+        </ul>
+      </StickyContainer>
+      <StickyContainer>
+        <h2>Features</h2>
+        <ul>
+          <li>Rubber belt-loaded doors</li>
+          <li>Rubber belt-supported hood mechanism</li>
+          <li>Functional trunk</li>
+          <li>Detailed engine</li>
+        </ul>
+      </StickyContainer>
     </div>
   );
 };