diff --git a/.idea/.gitignore b/.idea/.gitignore
new file mode 100644
index 00000000..13566b81
--- /dev/null
+++ b/.idea/.gitignore
@@ -0,0 +1,8 @@
+# Default ignored files
+/shelf/
+/workspace.xml
+# Editor-based HTTP Client requests
+/httpRequests/
+# Datasource local storage ignored files
+/dataSources/
+/dataSources.local.xml
diff --git a/.idea/inspectionProfiles/Project_Default.xml b/.idea/inspectionProfiles/Project_Default.xml
new file mode 100644
index 00000000..03d9549e
--- /dev/null
+++ b/.idea/inspectionProfiles/Project_Default.xml
@@ -0,0 +1,6 @@
+<component name="InspectionProjectProfileManager">
+  <profile version="1.0">
+    <option name="myName" value="Project Default" />
+    <inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
+  </profile>
+</component>
\ No newline at end of file
diff --git a/.idea/learn-react.iml b/.idea/learn-react.iml
new file mode 100644
index 00000000..d6ebd480
--- /dev/null
+++ b/.idea/learn-react.iml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="JAVA_MODULE" version="4">
+  <component name="NewModuleRootManager" inherit-compiler-output="true">
+    <exclude-output />
+    <content url="file://$MODULE_DIR$" />
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>
\ No newline at end of file
diff --git a/.idea/misc.xml b/.idea/misc.xml
new file mode 100644
index 00000000..639900d1
--- /dev/null
+++ b/.idea/misc.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectRootManager">
+    <output url="file://$PROJECT_DIR$/out" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/.idea/modules.xml b/.idea/modules.xml
new file mode 100644
index 00000000..084c1429
--- /dev/null
+++ b/.idea/modules.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/learn-react.iml" filepath="$PROJECT_DIR$/.idea/learn-react.iml" />
+    </modules>
+  </component>
+</project>
\ No newline at end of file
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
new file mode 100644
index 00000000..35eb1ddf
--- /dev/null
+++ b/.idea/vcs.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="" vcs="Git" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/README.md b/README.md
index d5c74edf..10dd33ad 100644
--- a/README.md
+++ b/README.md
@@ -1,8 +1,8 @@
 ## Personal Information:
 
-Full Name: Enter Your Full Name
+Full Name: Prabhleenkaur Ramindersingh Bindra
 
-Northeastern ID: Enter your Northeastern ID
+Northeastern ID: 002781738
 
 ## Getting Started
 First, fork this repository and clone it to your local machine.
diff --git a/src/pages/components/state.js b/src/pages/components/state.js
index 7a1be3d6..12d54a4d 100644
--- a/src/pages/components/state.js
+++ b/src/pages/components/state.js
@@ -2,6 +2,7 @@ import { useState } from 'react';
 import { sculptureList } from '../../data/data.js';
 
 export default function Gallery() {
+    // useState is the hook - var or att is idx and initial val is 0 - setIdx update state
   const [index, setIndex] = useState(0);
 
   function handleClick() {
diff --git a/src/pages/index.js b/src/pages/index.js
index 4c720243..bc14c720 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -2,12 +2,40 @@ import Head from 'next/head'
 import Image from 'next/image'
 import { Inter } from 'next/font/google'
 import styles from '@/styles/Home.module.css'
-import Profile from './components/profile.js'
+// import Profile from './components/profile.js'
+// import Gallery from "./components/gallery.js";
+// import Profile from './qcomps/profile_mistake.js'
+import Firstcomp from './qcomps/firstcomp.js'
+import Bios from './qcomps/bios.js';
+import Profile from './components/profile_props.js'
+import TodoList from "./qcomps/todos.js";
+import Gallery from './qcomps/state.js'
+import List from "./qcomps/list_keys_id.js";
+import RecipeList from "./qcomps/recipes.js";
+import MenuBar from "./qcomps/menuBar.js";
+import Counter from "./components/queueUpdates.js";
+import React from "react";
+import Form from "@/pages/components/snapshot2";
+import RequestTracker from "@/pages/qcomps/shoppingCart";
+import Scoreboard from "@/pages/qcomps/updObjectsForm";
 
 export default function Home() {
   return (
     <div className={styles.main}>
-        <Profile />
+        {/*<Gallery />*/}
+        {/*<Profile />*/}
+        {/*<Firstcomp />*/}
+        {/*<Bios />*/}
+        {/*<TodoList />*/}
+        {/*<Profile />*/}
+        {/*<Gallery />*/}
+        {/*<List />*/}
+        {/*<RecipeList />*/}
+        {/*<MenuBar />*/}
+        {/*<Counter />*/}
+        {/*<Form />*/}
+        {/*<RequestTracker />*/}
+        <Scoreboard />
     </div>
   )
 }
diff --git a/src/pages/qcomps/bios.js b/src/pages/qcomps/bios.js
index cc9350fd..52f270a5 100644
--- a/src/pages/qcomps/bios.js
+++ b/src/pages/qcomps/bios.js
@@ -1,12 +1,18 @@
 export default function Bio() {
   return (
-    <div class="intro">
-      <h1>Welcome to my website!</h1>
-    </div>
-    <p class="summary">
+      <div>
+        <div className="intro">
+          <h1>Welcome to my website!</h1>
+          <Code/>
+        </div>
+      </div>
+  );
+}
+
+  function Code() {
+    return (<p className="summary">
       You can find my thoughts here.
       <br/><br/>
       <b>And <i>pictures</i></b> of people!
-    </p>
-  );
-}
\ No newline at end of file
+    </p>)
+  }
\ No newline at end of file
diff --git a/src/pages/qcomps/firstcomp.js b/src/pages/qcomps/firstcomp.js
new file mode 100644
index 00000000..fa44c801
--- /dev/null
+++ b/src/pages/qcomps/firstcomp.js
@@ -0,0 +1,10 @@
+export default function Firstcomp() {
+    return (
+        <div>
+            <h1> My first component </h1>
+            <ol>
+                <li> Components: UI Building Block</li> <li> Defining a Component </li>
+                <li> Using a component </li>
+            </ol> </div>
+    )
+}
\ No newline at end of file
diff --git a/src/pages/qcomps/gallery_props.js b/src/pages/qcomps/gallery_props.js
index fc118123..e7d2c5d9 100644
--- a/src/pages/qcomps/gallery_props.js
+++ b/src/pages/qcomps/gallery_props.js
@@ -1,55 +1,59 @@
-export default function Gallery() {
+const baseUrl = 'https://i.imgur.com/';
+
+function Profile(props) {
   return (
-    <div>
-      <h1>Notable Scientists</h1>
-      <section className="profile">
-        <h2>Maria Skłodowska-Curie</h2>
-        <img
-          className="avatar"
-          src='https://i.imgur.com/szV5sdGs.jpg'
-          alt="Maria Skłodowska-Curie"
-          width={70}
-          height={70}
-        />
-        <ul>
-          <li>
-            <b>Profession: </b>
-            physicist and chemist
-          </li>
-          <li>
-            <b>Awards: 4 </b>
-            (Nobel Prize in Physics, Nobel Prize in Chemistry, Davy Medal, Matteucci Medal)
-          </li>
-          <li>
-            <b>Discovered: </b>
-            polonium (element)
-          </li>
-        </ul>
-      </section>
       <section className="profile">
-        <h2>Katsuko Saruhashi</h2>
+        <h2>{props.name}</h2>
         <img
-          className="avatar"
-          src='https://i.imgur.com/YfeOqp2s.jpg'
-          alt="Katsuko Saruhashi"
-          width={70}
-          height={70}
+            className="avatar"
+            src={baseUrl + props.imageID + 's.jpg'}
+            alt={props.name}
+            width={70}
+            height={70}
         />
         <ul>
           <li>
             <b>Profession: </b>
-            geochemist
+            {props.profession}
           </li>
           <li>
-            <b>Awards: 2 </b>
-            (Miyake Prize for geochemistry, Tanaka Prize)
+            <b>Awards: {props.awards.length} </b>
+            {props.awards.map((award, index) => (
+                <span key={index}>{award}</span>
+            ))}
           </li>
           <li>
             <b>Discovered: </b>
-            a method for measuring carbon dioxide in seawater
+            {props.discovered}
           </li>
         </ul>
       </section>
-    </div>
   );
 }
+
+export default function Gallery() {
+  return (
+      <div>
+        <h1>Notable Scientists</h1>
+        <Profile
+            name="Maria Skłodowska-Curie"
+            imageID=  'szV5sdG'
+            profession="physicist and chemist"
+            awards={[
+              "Nobel Prize in Physics",
+              "Nobel Prize in Chemistry",
+              "Davy Medal",
+              "Matteucci Medal"
+            ]}
+            discovered="polonium (element)"
+        />
+        <Profile
+            name="Katsuko Saruhashi"
+            imageID='YfeOqp2'
+            profession="geochemist"
+            awards={["Miyake Prize for geochemistry", "Tanaka Prize"]}
+            discovered="a method for measuring carbon dioxide in seawater"
+        />
+      </div>
+  );
+}
\ No newline at end of file
diff --git a/src/pages/qcomps/list_keys_id.js b/src/pages/qcomps/list_keys_id.js
index f10c9b88..18c109d3 100644
--- a/src/pages/qcomps/list_keys_id.js
+++ b/src/pages/qcomps/list_keys_id.js
@@ -17,7 +17,8 @@ function getImageUrl(imageId) {
 }
 export default function List() {
   const listItems = people.map(person =>
-    <li>
+    <li key = {person.imageId}>
+      {person.name};
     </li>
   );
   return <ul>{listItems}</ul>;
diff --git a/src/pages/qcomps/menuBar.js b/src/pages/qcomps/menuBar.js
index 340044e5..65ddbb7f 100644
--- a/src/pages/qcomps/menuBar.js
+++ b/src/pages/qcomps/menuBar.js
@@ -1,10 +1,10 @@
 export default function MenuBar() {
   return (
     <div>
-      <AButton>
+      <AButton id='btn1' color="blue" size="16px">
         Button 1
       </AButton>
-      <AButton>
+      <AButton id='btn2' color="red" size="18px">
         Button 2
       </AButton>
     </div>
diff --git a/src/pages/qcomps/profile_mistake.js b/src/pages/qcomps/profile_mistake.js
index ac318d70..b62eaba6 100644
--- a/src/pages/qcomps/profile_mistake.js
+++ b/src/pages/qcomps/profile_mistake.js
@@ -1,4 +1,9 @@
 export default function profile() {
-    return
-        <img src="https://i.imgur.com/jA8hHMpm.jpg" alt="Katsuko Saruhashi" />;
+    return (
+        <img
+            src="https://i.imgur.com/jA8hHMpm.jpg"
+            alt="Katsuko Saruhashi"
+        />
+    )
+
 }
diff --git a/src/pages/qcomps/recipes.js b/src/pages/qcomps/recipes.js
index 37803925..962da118 100644
--- a/src/pages/qcomps/recipes.js
+++ b/src/pages/qcomps/recipes.js
@@ -16,7 +16,18 @@ export default function RecipeList() {
   return (
     <div>
       <h1>Recipes</h1>
-      {}
+      {
+        recipes.map(recipe => (
+            <div key={recipe.id}>
+              <h2>{recipe.name}</h2>
+              <ul>
+                {Array.from(recipe.ingredients).map((ing, ind) => (
+                <li key={ind}>{ing}</li>
+                ))}
+              </ul>
+            </div>
+        ))
+      }
     </div>
   );
 }
\ No newline at end of file
diff --git a/src/pages/qcomps/shoppingCart.js b/src/pages/qcomps/shoppingCart.js
index d26decf8..dfb16e25 100644
--- a/src/pages/qcomps/shoppingCart.js
+++ b/src/pages/qcomps/shoppingCart.js
@@ -5,10 +5,10 @@ export default function RequestTracker() {
   const [completed, setCompleted] = useState(0);
 
   async function handleClick() {
-    setPending(pending + 1);
+    setPending(pending => pending + 1);
     await delay(3000);
-    setPending(pending - 1);
-    setCompleted(completed + 1);
+    setPending(pending => pending - 1);
+    setCompleted(completed => completed + 1);
   }
 
   return (
diff --git a/src/pages/qcomps/state.js b/src/pages/qcomps/state.js
index 35953a6a..9e3797fe 100644
--- a/src/pages/qcomps/state.js
+++ b/src/pages/qcomps/state.js
@@ -6,7 +6,8 @@ export default function Gallery() {
   const [showMore, setShowMore] = useState(false);
 
   function handleNextClick() {
-    setIndex(index + 1);
+      setIndex((index + 1) % sculptureList.length);
+      // setIndex(index + 1);
   }
 
   function handleMoreClick() {
diff --git a/src/pages/qcomps/todos.js b/src/pages/qcomps/todos.js
index be9faf29..28fa7782 100644
--- a/src/pages/qcomps/todos.js
+++ b/src/pages/qcomps/todos.js
@@ -12,10 +12,10 @@ const person = {
 export default function TodoList() {
   return (
     <div style={person.theme}>
-      <h1>Person Name's Todos</h1>
+      <h1>{person.name}'s Todos</h1>
       <img className="avatar"
-      src="URL"
-      alt="Person's Name"
+      src= {baseUrl + person.imageId + 's.jpg'}
+      alt={person.name}
       />
     </div>
   );
diff --git a/src/pages/qcomps/updObjectsForm.js b/src/pages/qcomps/updObjectsForm.js
index 3541a284..a0a2d5ea 100644
--- a/src/pages/qcomps/updObjectsForm.js
+++ b/src/pages/qcomps/updObjectsForm.js
@@ -8,7 +8,11 @@ export default function Scoreboard() {
   });
 
   function handlePlusClick() {
-    player.score++;
+    setPlayer({
+                ...player,
+                score: player.score+1,
+              });
+
   }
 
   function handleFirstNameChange(e) {
diff --git a/src/styles/Home.module.css b/src/styles/Home.module.css
index 7b8e4f94..87a7f4c2 100644
--- a/src/styles/Home.module.css
+++ b/src/styles/Home.module.css
@@ -1,229 +1,229 @@
-.main {
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-  align-items: center;
-  padding: 6rem;
-  min-height: 100vh;
-}
-
-.description {
-  display: inherit;
-  justify-content: inherit;
-  align-items: inherit;
-  font-size: 0.85rem;
-  max-width: var(--max-width);
-  width: 100%;
-  z-index: 2;
-  font-family: var(--font-mono);
-}
-
-.description a {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  gap: 0.5rem;
-}
-
-.description p {
-  position: relative;
-  margin: 0;
-  padding: 1rem;
-  background-color: rgba(var(--callout-rgb), 0.5);
-  border: 1px solid rgba(var(--callout-border-rgb), 0.3);
-  border-radius: var(--border-radius);
-}
-
-.code {
-  font-weight: 700;
-  font-family: var(--font-mono);
-}
-
-.grid {
-  display: grid;
-  grid-template-columns: repeat(4, minmax(25%, auto));
-  max-width: var(--max-width);
-  width: 100%;
-}
-
-.card {
-  padding: 1rem 1.2rem;
-  border-radius: var(--border-radius);
-  background: rgba(var(--card-rgb), 0);
-  border: 1px solid rgba(var(--card-border-rgb), 0);
-  transition: background 200ms, border 200ms;
-}
-
-.card span {
-  display: inline-block;
-  transition: transform 200ms;
-}
-
-.card h2 {
-  font-weight: 600;
-  margin-bottom: 0.7rem;
-}
-
-.card p {
-  margin: 0;
-  opacity: 0.6;
-  font-size: 0.9rem;
-  line-height: 1.5;
-  max-width: 30ch;
-}
-
-.center {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  position: relative;
-  padding: 4rem 0;
-}
-
-.center::before {
-  background: var(--secondary-glow);
-  border-radius: 50%;
-  width: 480px;
-  height: 360px;
-  margin-left: -400px;
-}
-
-.center::after {
-  background: var(--primary-glow);
-  width: 240px;
-  height: 180px;
-  z-index: -1;
-}
-
-.center::before,
-.center::after {
-  content: '';
-  left: 50%;
-  position: absolute;
-  filter: blur(45px);
-  transform: translateZ(0);
-}
-
-.logo {
-  position: relative;
-}
-/* Enable hover only on non-touch devices */
-@media (hover: hover) and (pointer: fine) {
-  .card:hover {
-    background: rgba(var(--card-rgb), 0.1);
-    border: 1px solid rgba(var(--card-border-rgb), 0.15);
-  }
-
-  .card:hover span {
-    transform: translateX(4px);
-  }
-}
-
-@media (prefers-reduced-motion) {
-  .card:hover span {
-    transform: none;
-  }
-}
-
-/* Mobile */
-@media (max-width: 700px) {
-  .content {
-    padding: 4rem;
-  }
-
-  .grid {
-    grid-template-columns: 1fr;
-    margin-bottom: 120px;
-    max-width: 320px;
-    text-align: center;
-  }
-
-  .card {
-    padding: 1rem 2.5rem;
-  }
-
-  .card h2 {
-    margin-bottom: 0.5rem;
-  }
-
-  .center {
-    padding: 8rem 0 6rem;
-  }
-
-  .center::before {
-    transform: none;
-    height: 300px;
-  }
-
-  .description {
-    font-size: 0.8rem;
-  }
-
-  .description a {
-    padding: 1rem;
-  }
-
-  .description p,
-  .description div {
-    display: flex;
-    justify-content: center;
-    position: fixed;
-    width: 100%;
-  }
-
-  .description p {
-    align-items: center;
-    inset: 0 0 auto;
-    padding: 2rem 1rem 1.4rem;
-    border-radius: 0;
-    border: none;
-    border-bottom: 1px solid rgba(var(--callout-border-rgb), 0.25);
-    background: linear-gradient(
-      to bottom,
-      rgba(var(--background-start-rgb), 1),
-      rgba(var(--callout-rgb), 0.5)
-    );
-    background-clip: padding-box;
-    backdrop-filter: blur(24px);
-  }
-
-  .description div {
-    align-items: flex-end;
-    pointer-events: none;
-    inset: auto 0 0;
-    padding: 2rem;
-    height: 200px;
-    background: linear-gradient(
-      to bottom,
-      transparent 0%,
-      rgb(var(--background-end-rgb)) 40%
-    );
-    z-index: 1;
-  }
-}
-
-/* Tablet and Smaller Desktop */
-@media (min-width: 701px) and (max-width: 1120px) {
-  .grid {
-    grid-template-columns: repeat(2, 50%);
-  }
-}
-
-@media (prefers-color-scheme: dark) {
-  .vercelLogo {
-    filter: invert(1);
-  }
-
-  .logo {
-    filter: invert(1) drop-shadow(0 0 0.3rem #ffffff70);
-  }
-}
-
-@keyframes rotate {
-  from {
-    transform: rotate(360deg);
-  }
-  to {
-    transform: rotate(0deg);
-  }
-}
+/*.main {*/
+/*  display: flex;*/
+/*  flex-direction: column;*/
+/*  justify-content: space-between;*/
+/*  align-items: center;*/
+/*  padding: 6rem;*/
+/*  min-height: 100vh;*/
+/*}*/
+
+/*.description {*/
+/*  display: inherit;*/
+/*  justify-content: inherit;*/
+/*  align-items: inherit;*/
+/*  font-size: 0.85rem;*/
+/*  max-width: var(--max-width);*/
+/*  width: 100%;*/
+/*  z-index: 2;*/
+/*  font-family: var(--font-mono);*/
+/*}*/
+
+/*.description a {*/
+/*  display: flex;*/
+/*  justify-content: center;*/
+/*  align-items: center;*/
+/*  gap: 0.5rem;*/
+/*}*/
+
+/*.description p {*/
+/*  position: relative;*/
+/*  margin: 0;*/
+/*  padding: 1rem;*/
+/*  background-color: rgba(var(--callout-rgb), 0.5);*/
+/*  border: 1px solid rgba(var(--callout-border-rgb), 0.3);*/
+/*  border-radius: var(--border-radius);*/
+/*}*/
+
+/*.code {*/
+/*  font-weight: 700;*/
+/*  font-family: var(--font-mono);*/
+/*}*/
+
+/*.grid {*/
+/*  display: grid;*/
+/*  grid-template-columns: repeat(4, minmax(25%, auto));*/
+/*  max-width: var(--max-width);*/
+/*  width: 100%;*/
+/*}*/
+
+/*.card {*/
+/*  padding: 1rem 1.2rem;*/
+/*  border-radius: var(--border-radius);*/
+/*  background: rgba(var(--card-rgb), 0);*/
+/*  border: 1px solid rgba(var(--card-border-rgb), 0);*/
+/*  transition: background 200ms, border 200ms;*/
+/*}*/
+
+/*.card span {*/
+/*  display: inline-block;*/
+/*  transition: transform 200ms;*/
+/*}*/
+
+/*.card h2 {*/
+/*  font-weight: 600;*/
+/*  margin-bottom: 0.7rem;*/
+/*}*/
+
+/*.card p {*/
+/*  margin: 0;*/
+/*  opacity: 0.6;*/
+/*  font-size: 0.9rem;*/
+/*  line-height: 1.5;*/
+/*  max-width: 30ch;*/
+/*}*/
+
+/*.center {*/
+/*  display: flex;*/
+/*  justify-content: center;*/
+/*  align-items: center;*/
+/*  position: relative;*/
+/*  padding: 4rem 0;*/
+/*}*/
+
+/*.center::before {*/
+/*  background: var(--secondary-glow);*/
+/*  border-radius: 50%;*/
+/*  width: 480px;*/
+/*  height: 360px;*/
+/*  margin-left: -400px;*/
+/*}*/
+
+/*.center::after {*/
+/*  background: var(--primary-glow);*/
+/*  width: 240px;*/
+/*  height: 180px;*/
+/*  z-index: -1;*/
+/*}*/
+
+/*.center::before,*/
+/*.center::after {*/
+/*  content: '';*/
+/*  left: 50%;*/
+/*  position: absolute;*/
+/*  filter: blur(45px);*/
+/*  transform: translateZ(0);*/
+/*}*/
+
+/*.logo {*/
+/*  position: relative;*/
+/*}*/
+/*!* Enable hover only on non-touch devices *!*/
+/*@media (hover: hover) and (pointer: fine) {*/
+/*  .card:hover {*/
+/*    background: rgba(var(--card-rgb), 0.1);*/
+/*    border: 1px solid rgba(var(--card-border-rgb), 0.15);*/
+/*  }*/
+
+/*  .card:hover span {*/
+/*    transform: translateX(4px);*/
+/*  }*/
+/*}*/
+
+/*@media (prefers-reduced-motion) {*/
+/*  .card:hover span {*/
+/*    transform: none;*/
+/*  }*/
+/*}*/
+
+/*!* Mobile *!*/
+/*@media (max-width: 700px) {*/
+/*  .content {*/
+/*    padding: 4rem;*/
+/*  }*/
+
+/*  .grid {*/
+/*    grid-template-columns: 1fr;*/
+/*    margin-bottom: 120px;*/
+/*    max-width: 320px;*/
+/*    text-align: center;*/
+/*  }*/
+
+/*  .card {*/
+/*    padding: 1rem 2.5rem;*/
+/*  }*/
+
+/*  .card h2 {*/
+/*    margin-bottom: 0.5rem;*/
+/*  }*/
+
+/*  .center {*/
+/*    padding: 8rem 0 6rem;*/
+/*  }*/
+
+/*  .center::before {*/
+/*    transform: none;*/
+/*    height: 300px;*/
+/*  }*/
+
+/*  .description {*/
+/*    font-size: 0.8rem;*/
+/*  }*/
+
+/*  .description a {*/
+/*    padding: 1rem;*/
+/*  }*/
+
+/*  .description p,*/
+/*  .description div {*/
+/*    display: flex;*/
+/*    justify-content: center;*/
+/*    position: fixed;*/
+/*    width: 100%;*/
+/*  }*/
+
+/*  .description p {*/
+/*    align-items: center;*/
+/*    inset: 0 0 auto;*/
+/*    padding: 2rem 1rem 1.4rem;*/
+/*    border-radius: 0;*/
+/*    border: none;*/
+/*    border-bottom: 1px solid rgba(var(--callout-border-rgb), 0.25);*/
+/*    background: linear-gradient(*/
+/*      to bottom,*/
+/*      rgba(var(--background-start-rgb), 1),*/
+/*      rgba(var(--callout-rgb), 0.5)*/
+/*    );*/
+/*    background-clip: padding-box;*/
+/*    backdrop-filter: blur(24px);*/
+/*  }*/
+
+/*  .description div {*/
+/*    align-items: flex-end;*/
+/*    pointer-events: none;*/
+/*    inset: auto 0 0;*/
+/*    padding: 2rem;*/
+/*    height: 200px;*/
+/*    background: linear-gradient(*/
+/*      to bottom,*/
+/*      transparent 0%,*/
+/*      rgb(var(--background-end-rgb)) 40%*/
+/*    );*/
+/*    z-index: 1;*/
+/*  }*/
+/*}*/
+
+/*!* Tablet and Smaller Desktop *!*/
+/*@media (min-width: 701px) and (max-width: 1120px) {*/
+/*  .grid {*/
+/*    grid-template-columns: repeat(2, 50%);*/
+/*  }*/
+/*}*/
+
+/*@media (prefers-color-scheme: dark) {*/
+/*  .vercelLogo {*/
+/*    filter: invert(1);*/
+/*  }*/
+
+/*  .logo {*/
+/*    filter: invert(1) drop-shadow(0 0 0.3rem #ffffff70);*/
+/*  }*/
+/*}*/
+
+/*@keyframes rotate {*/
+/*  from {*/
+/*    transform: rotate(360deg);*/
+/*  }*/
+/*  to {*/
+/*    transform: rotate(0deg);*/
+/*  }*/
+/*}*/