diff --git a/Components/Card.js b/Components/Card.js
index a5c23ce..0673883 100644
--- a/Components/Card.js
+++ b/Components/Card.js
@@ -1,23 +1,27 @@
 import { Component } from "react";
 import Styles from '../styles/Components/card.module.css';
+import react from 'react'
 
 class Card extends Component {
 	constructor(props) {
 		super(props);
+        this.state = {
+            clicked: false,
+        }
     }
 
 	render() {
 		return (
-            <div className={Styles.card} style={{
+            <div className={Styles.card + " " + (this.state.clicked ? Styles.clicked : "")} style={{
                 margin: "0"
-            }}>
-                <div className={Styles.backgroundGradient} style={{
+            }} onClick={() => { this.setState({clicked: !this.state.clicked}) }}>
+                <div className={Styles.backgroundGradient + " " + (this.state.clicked ? Styles.clicked : "")} style={{
                     backgroundImage: `linear-gradient(69.44deg, #${this.props.gradient[0]} 0%, #${this.props.gradient[1]} 100%)`
                 }} />
                 <img alt="" className={Styles.backgroundImage} src={`https://assets.clicksminuteper.net/web/waves/card/${this.props.wave}.svg`} draggable={false} />
                 <div className={Styles.panel}>
                     <div className={Styles.titleContainer}>
-                        <img alt="Project icon" className={Styles.image} src={"https://assets.clicksminuteper.net/" + (this.props.icon ? this.props.icon : this.props.wave) + ".svg"} />
+                        <img alt="Project icon" className={Styles.image + " " + (this.state.clicked ? Styles.clicked : "")} src={"https://assets.clicksminuteper.net/" + (this.props.icon ? this.props.icon : this.props.wave) + ".svg"} />
                         <h1 className={Styles.title}>{this.props.title}</h1>
                     </div>
                     <p className={Styles.subtext}>{this.props.subtext}</p>
@@ -41,4 +45,23 @@
 	}
 }
 
-export default Card;
\ No newline at end of file
+class CardRow extends Component {
+	constructor(props) {
+		super(props);
+	}
+
+
+	render() {
+		return (
+            <div className={Styles.container}>
+				{
+					react.Children.toArray(this.props.children).map((item, index) => {
+						return <div className={Styles.item} key={index}>{item}</div>
+					})
+				}
+			</div>
+        )
+	}
+}
+
+export { Card, CardRow };
\ No newline at end of file
diff --git a/Components/CardRow.js b/Components/CardRow.js
deleted file mode 100644
index 7421f19..0000000
--- a/Components/CardRow.js
+++ /dev/null
@@ -1,23 +0,0 @@
-import react, { Component } from "react";
-import Styles from '../styles/Components/cardrow.module.css';
-
-class CardRow extends Component {
-	constructor(props) {
-		super(props);
-	}
-
-
-	render() {
-		return (
-            <div className={Styles.container}>
-				{
-					react.Children.toArray(this.props.children).map((item, index) => {
-						return <div className={Styles.item} key={index}>{item}</div>
-					})
-				}
-			</div>
-        )
-	}
-}
-
-export default CardRow;
\ No newline at end of file
diff --git a/Components/Docs.js b/Components/Docs.js
index 5e6b623..c15b1d3 100644
--- a/Components/Docs.js
+++ b/Components/Docs.js
@@ -1,6 +1,3 @@
-import react, { Component } from "react";
-import Styles from '../styles/Components/cardrow.module.css';
-
 class Docs extends Component {
     /*
         Properties:
@@ -29,7 +26,3 @@
         return "a"
     }
 }
-
-
-
-export default CardRow;
\ No newline at end of file
diff --git a/pages/404.js b/pages/404.js
index 996d01c..fc521ec 100644
--- a/pages/404.js
+++ b/pages/404.js
@@ -1,5 +1,5 @@
 import Header from '../Components/Header'
-import {Component} from 'react'
+import { Component } from 'react'
 
 export default class Home extends Component {
 	constructor(props) {
diff --git a/pages/clicksforms.js b/pages/clicksforms.js
index 3bce7b7..35f55fb 100644
--- a/pages/clicksforms.js
+++ b/pages/clicksforms.js
@@ -1,5 +1,4 @@
-import Card from '../Components/Card'
-import CardRow from '../Components/CardRow';
+import { Card, CardRow } from '../Components/Card';
 import Header from '../Components/Header'
 import { AutoLayout, Panel, Title, Subtitle, Text, Divider } from '../Components/Panels';
 import { List, ListItem, Code } from '../Components/Texttools';
diff --git a/pages/cpm.js b/pages/cpm.js
index 22b3a68..e3cf768 100644
--- a/pages/cpm.js
+++ b/pages/cpm.js
@@ -1,5 +1,4 @@
-import Card from '../Components/Card';
-import CardRow from '../Components/CardRow';
+import { Card, CardRow } from '../Components/Card';
 import Header from '../Components/Header';
 import { AutoLayout, Panel, Title, Subtitle, Text, Divider } from '../Components/Panels';
 
diff --git a/pages/gps.js b/pages/gps.js
index aeb9dd8..971c419 100644
--- a/pages/gps.js
+++ b/pages/gps.js
@@ -1,5 +1,4 @@
-import Card from '../Components/Card'
-import CardRow from '../Components/CardRow';
+import { Card, CardRow } from '../Components/Card';
 import Header from '../Components/Header'
 import { AutoLayout, Panel, Title, Subtitle, Text, Divider } from '../Components/Panels';
 import { List, ListItem, Code } from '../Components/Texttools';
diff --git a/pages/hooky.js b/pages/hooky.js
index 50573c9..f8fe17f 100644
--- a/pages/hooky.js
+++ b/pages/hooky.js
@@ -1,5 +1,4 @@
-import Card from '../Components/Card'
-import CardRow from '../Components/CardRow';
+import { Card, CardRow } from '../Components/Card';
 import Header from '../Components/Header'
 import { AutoLayout, Panel, Title, Subtitle, Text, Divider } from '../Components/Panels';
 
diff --git a/pages/index.js b/pages/index.js
index 80ee8a0..a72d401 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -1,5 +1,4 @@
-import Card from '../Components/Card';
-import CardRow from '../Components/CardRow';
+import { Card, CardRow } from '../Components/Card';
 import Header from '../Components/Header';
 import { AutoLayout, Panel, Title, Subtitle, Text, Divider } from '../Components/Panels';
 
@@ -24,7 +23,6 @@
               icon="bots/gps/circle"
               buttons={[
                 {color: "6576CC", link: "https://discordapp.com/oauth2/authorize?client_id=679361555732627476&scope=bot&permissions=130048", text: "Invite"},
-                {color: "6576CC", link: "/gps", text: "About"}
               ]}
               buttonText={"FFFFFF"} gradient={["78ECF2", "71AFE5"]}
             />
@@ -33,7 +31,6 @@
               icon="bots/rsm/circle"
               buttons={[
                 {color: "424242", link: "https://discord.com/api/oauth2/authorize?client_id=715989276382462053&permissions=121295465718&scope=bot%20applications.commands",text:"Invite"},
-                {color: "424242", link: "/rsm", text:"About"}
               ]}
               buttonText={"FFFFFF"} gradient={["F27878", "D96B6B"]}
             />
@@ -41,9 +38,7 @@
               wave="clicksforms" title="ClicksForms" subtext="Create custom forms for Discord"
               icon="bots/clicksforms/circle"
               buttons={[
-                {color: "775EBF", link: "https://clicksminuteper.github.io/docs/clicksforms", text:"API", newTab: true},
                 {color: "775EBF", link: "https://discord.com/api/oauth2/authorize?client_id=805392054678192169&permissions=2416307200&scope=bot%20applications.commands",text:"Invite"},
-                {color: "775EBF", link: "/clicksforms", text: "About"}
               ]}
               buttonText={"FFFFFF"} gradient={["71AFE5", "6576CC"]}
             />
@@ -51,7 +46,6 @@
               wave="castaway" title="Castaway" subtext="Stranded on Discord"
               icon="bots/castaway/circle"
               buttons={[
-                {color: "F2D478", link: "/castaway", text: "About"}
               ]}
               buttonText={"000000"} gradient={["71AFE5", "78ECF2"]}
             />
@@ -60,7 +54,6 @@
               icon="bots/hooky/circle"
               buttons={[
                 {color: "EDC575", link: "https://discord.com/oauth2/authorize?client_id=752188923505279037&scope=bot&permissions=536882176", text: "Invite"},
-                {color: "EDC575", link: "/hooky", text: "About"}
               ]}
               buttonText={"000000"} gradient={["424242", "8D8D8D"]}
             />
@@ -68,8 +61,7 @@
               wave="clcks" title="Clcks" subtext="Clicks Minute Per web apps"
               icon="web/icons/clcks"
               buttons={[
-                {color: "78ECF2", link: "https://clcks.dev", text: "View Apps"
-              }]}
+              ]}
               buttonText={"000000"} gradient={["C4C4C4", "8D8D8D"]}
             />
           </CardRow>
diff --git a/pages/rsm.js b/pages/rsm.js
index 1aa96da..8f63c30 100644
--- a/pages/rsm.js
+++ b/pages/rsm.js
@@ -1,8 +1,7 @@
-import Card from '../Components/Card'
+import { Card, CardRow } from '../Components/Card';
 import Header from '../Components/Header'
 import { AutoLayout, Panel, Title, Subtitle, Text, Divider } from '../Components/Panels';
 import { List, ListItem, Code } from '../Components/Texttools';
-import CardRow from '../Components/CardRow'
 
 // import FeatureImages from '../public/Features/RSM/Images.svg';
 // import FeatureAutomate from '../public/Features/RSM/Automate.svg';
diff --git a/styles/Components/card.module.css b/styles/Components/card.module.css
index 52544a4..775be5c 100644
--- a/styles/Components/card.module.css
+++ b/styles/Components/card.module.css
@@ -32,6 +32,13 @@
 	overflow: hidden;
 	margin: 100px;
 	transition: filter 0.3s ease-in-out;
+	transition: transform 0.15s ease-in-out;
+
+	transition: all 10s ease-in-out;
+}
+.card:hover {
+	transform: scale(1.025);
+	cursor: pointer;
 }
 
 
@@ -117,4 +124,36 @@
 	.card {
 		height: 254px;
 	}
+}
+
+
+.card.clicked {
+	transform: scale(1) !important;
+	z-index: 9999;
+    width: 100%;
+    height: 100%;
+    position: fixed;
+    top: 0;
+    left: 0;
+}
+
+.backgroundGradient.clicked {
+	background-image: red;
+}
+
+/* .image.clicked {
+	width: 1000px !important;
+} */
+
+.container {
+    width: calc(100% - 20px);
+    height: 100%;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: center;
+    gap: 20px;
+}
+
+.item {
+    width: min(428px, 90%);
 }
\ No newline at end of file
diff --git a/styles/Components/cardrow.module.css b/styles/Components/cardrow.module.css
deleted file mode 100644
index dde471f..0000000
--- a/styles/Components/cardrow.module.css
+++ /dev/null
@@ -1,12 +0,0 @@
-.container {
-    width: calc(100% - 20px);
-    height: 100%;
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: center;
-    gap: 20px;
-}
-
-.item {
-    width: min(428px, 90%);
-}
\ No newline at end of file