cmp.js
diff --git a/Components/NavBar.js b/Components/NavBar.js
index b153f8c..f7ef4e1 100644
--- a/Components/NavBar.js
+++ b/Components/NavBar.js
@@ -54,11 +54,11 @@
             <>
                 <div ref={this.hoverSensor} className={this.isTouchDevice ? (Styles.container + " " + (this.state.isOpen ? Styles.containerOpen : null)) : Styles.containerDesktop + " " + Styles.container}>
                     <div className={Styles.group}>
-                        <img alt="CMP" className={Styles.headerIcon} src="https://assets.clicksminuteper.net/company/logo/normal.svg" onClick={() => {this.onClick()}}/>
+                        <img alt="CMP" className={Styles.headerIcon} src="https://assets.clicksminuteper.net/company/logo/circle.svg" onClick={() => {this.onClick()}}/>
                         <a href="/#"><img alt="Home" className={Styles.icon} src="https://assets.clicksminuteper.net/web/icons/home.svg"/></a>
-                        <a href="/gps#"><img alt="GPS" className={Styles.icon} src="https://assets.clicksminuteper.net/bots/gps/normal.svg"/></a>
-                        <a href="/rsm#"><img alt="RSM" className={Styles.icon} src="https://assets.clicksminuteper.net/bots/rsm/normal.svg"/></a>
-                        <a href="/clicksforms#"><img alt="ClicksForms" className={Styles.icon} src="https://assets.clicksminuteper.net/bots/clicksforms/normal.svg"/></a>
+                        <a href="/gps#"><img alt="GPS" className={Styles.icon} src="https://assets.clicksminuteper.net/bots/gps/circle.svg"/></a>
+                        <a href="/rsm#"><img alt="RSM" className={Styles.icon} src="https://assets.clicksminuteper.net/bots/rsm/circle.svg"/></a>
+                        <a href="/clicksforms#"><img alt="ClicksForms" className={Styles.icon} src="https://assets.clicksminuteper.net/bots/clicksforms/circle.svg"/></a>
                         {/* <a href="/castaway#"><img className={Styles.icon} src="/Icons/CA.svg"/></a> */}
                         {/* <a href="https://clcks.dev"><img className={Styles.icon} src="/Icons/CL.svg"/></a> */}
                     </div>
diff --git a/pages/api/rsmv/complete.js b/pages/api/rsmv/complete.js
index b9a8919..bc64d8a 100644
--- a/pages/api/rsmv/complete.js
+++ b/pages/api/rsmv/complete.js
@@ -8,7 +8,7 @@
     if (code.data.user  != req.body.uid) return res.send(401)
     if (code.data.guild != req.body.gid) return res.send(401)
     if (code.data.role  != req.body.rid) return res.send(401)
-    
+
     let secret = "slwu0rZV5W6WdmGtgI16du8Ar2tQGMr3Q9dE6u3poKiVODNV9SweaA3buawgkTmTuITXDWOUpBcTFA0qWrUvoshi1JB180WOFwA7"
     let resp = await Axios.get(
         `http://192.168.102.7:10000/role/gid/${req.body.gid}/rid/${req.body.rid}/user/${req.body.uid}/secret/${secret}/code/${req.body.code}`
diff --git a/pages/api/rsmv/validate.js b/pages/api/rsmv/validate.js
index c71f3c4..0133405 100644
--- a/pages/api/rsmv/validate.js
+++ b/pages/api/rsmv/validate.js
@@ -9,10 +9,10 @@
     return new Promise((resolve, reject) => {
         MongoClient.connect(url, async function(err, client) {
             let db_response = await client.db(db).collection(collection).findOne({code: req.body.code});
-            
+
             if (!db_response) return resolve(res.status(404).end());
             if (db_response.timestamp + (1800) >= Date.now()) return resolve(res.status(410));
-            
+
             let props = {
                 user: db_response.user,
                 role: db_response.role,
diff --git a/pages/clicksforms.js b/pages/clicksforms.js
index 491e7da..f124d71 100644
--- a/pages/clicksforms.js
+++ b/pages/clicksforms.js
@@ -49,7 +49,7 @@
           <CardRow>
           <Card
             wave="clicksforms"
-            icon="bots/clicksforms/normal"
+            icon="bots/clicksforms/circle"
             buttonText={"FFFFFF"} gradient={["71AFE5", "6576CC"]}
             title="Invite"
             subtext="Invite ClicksForms to your server"
diff --git a/pages/clicksforms/error/deleted.js b/pages/clicksforms/error/deleted.js
new file mode 100644
index 0000000..26b61dd
--- /dev/null
+++ b/pages/clicksforms/error/deleted.js
@@ -0,0 +1,24 @@
+import { Component } from 'react'
+import Header from '../../../Components/Header'
+
+class Failed extends Component {
+    constructor(props) {
+        super(props)
+    }
+
+    render() {
+        return (
+            <Header
+                name="Form not found"
+                subtext={<p>We could not find that form. Please let the server owners know if you believe this is an mistake.</p>}
+                gradient={["F27878", "D96B6B"]}
+                wave="web/waves/header/rsm"
+                buttons={[]}
+                hideArrow={true}
+            />
+        )
+    }
+
+}
+
+export default Failed;
\ No newline at end of file
diff --git a/pages/clicksforms/error/nocode.js b/pages/clicksforms/error/nocode.js
new file mode 100644
index 0000000..5beec09
--- /dev/null
+++ b/pages/clicksforms/error/nocode.js
@@ -0,0 +1,24 @@
+import { Component } from 'react'
+import Header from '../../../Components/Header'
+
+class Failed extends Component {
+    constructor(props) {
+        super(props)
+    }
+
+    render() {
+        return (
+            <Header
+                name="No code given"
+                subtext={<p>Please enter a form code in the URL</p>}
+                gradient={["F27878", "D96B6B"]}
+                wave="web/waves/header/rsm"
+                buttons={[]}
+                hideArrow={true}
+            />
+        )
+    }
+
+}
+
+export default Failed;
\ No newline at end of file
diff --git a/pages/clicksforms/error/unknown.js b/pages/clicksforms/error/unknown.js
new file mode 100644
index 0000000..3512d86
--- /dev/null
+++ b/pages/clicksforms/error/unknown.js
@@ -0,0 +1,24 @@
+import { Component } from 'react'
+import Header from '../../../Components/Header'
+
+class Failed extends Component {
+    constructor(props) {
+        super(props)
+    }
+
+    render() {
+        return (
+            <Header
+                name="An error occurred"
+                subtext={<p>An unknown error has occurred.<br />Let the server owners know if you believe this is a mistake.</p>}
+                gradient={["F27878", "D96B6B"]}
+                wave="web/waves/header/rsm"
+                buttons={[]}
+                hideArrow={true}
+            />
+        )
+    }
+
+}
+
+export default Failed;
\ No newline at end of file
diff --git a/pages/clicksforms/form.js b/pages/clicksforms/form.js
index 3912ca2..661fccc 100644
--- a/pages/clicksforms/form.js
+++ b/pages/clicksforms/form.js
@@ -7,44 +7,15 @@
 export default class Form extends Component {
 	constructor(props) {
 		super(props);
-        this.form = {
-            'id': '1629451712.871201',
-            'active': true, 'anonymous': false, 'guild': 684492926528651336, 'created_by': 438733159748599813,
-            'name': 'Example form', 'description': 'The default form',
-            'required_roles': [], 'disallowed_roles': [], 'given_roles': [], 'removed_roles': [],
-            'auto_accept': false,
-            'questions': [
-                {
-                    'type': 'text', 'title': 'Text answer', 'description': 'some description',
-                    'colour': 'red', 'options': {'min': 1, 'max': 2000}, 'required': true, 'question': true, 'id': '1630426754.449609'
-                }, {
-                    'type': 'number', 'title': 'Number', 'description': 'Type something over 2 to trigger response validation',
-                    'colour': 'orange', 'options': {'min': 0, 'max': 2}, 'required': true, 'question': true, 'id': '1630426754.449615'
-                }, {
-                    'type': 'multichoice', 'title': 'Multiple choice!', 'description': '', 'colour': 'yellow', 'options': {
-                        'min': 1, 'max': 2, 'options': {'0': ['circl', false], '1': ['skware', false], '3': ['no', false]}
-                    },
-                    'required': false, 'question': true, 'id': '1630426754.449619'
-                }, {
-                    'type': 'fileupload', 'title': 'Files', 'description': '',
-                    'colour': 'green', 'options': {}, 'required': false, 'question': true, 'id': '1630426754.449629'
-                }, {
-                    'type': 'time', 'title': 'Enter a time', 'description': '',
-                    'colour': 'blue', 'options': {}, 'required': true, 'question': true, 'id': '1630426754.449632'
-                }, {
-                    'type': 'date', 'title': 'when', 'description': '',
-                    'colour': 'purple', 'options': {}, 'required': true, 'question': true, 'id': '1630426754.449635'
-                }
-            ]
-        }
-    }
+}
 
 	render() {
+        console.log(this.props)
 		return (
 			<>
                 <Header
-                    name={this.form.name}
-                    subtext={this.form.description + (this.form.active ? '' : <><br />This form is not accepting responses. Please check back later</>)}
+                    name={this.props.name}
+                    subtext={this.props.description + (this.props.active ? '' : <><br />this.props is not accepting responses. Please check back later</>)}
                     gradient={["71AFE5", "6576CC"]}
                     wave="web/waves/header/clicksforms"
                     buttons={[]}
@@ -52,12 +23,12 @@
                 <div id="start" />
                 <div className={Styles.form}>
                     <div className={Styles.header}>
-                        Once completing this form, your response will be recorded
-                        {this.form.anonymous ? " and your name will not be shown" : " and your username will be visible"}
+                        Once completing this.props, your response will be recorded
+                        {this.props.anonymous ? " and your name will not be shown" : " and your username will be visible"}
                     </div>
                     <div className={Styles.body}>
                         {
-                            this.form.questions.map((question, index) => {
+                            this.props.questions.map((question, index) => {
                                 return (
                                     <>
                                         <Question
@@ -79,3 +50,43 @@
 		)
 	}
 }
+
+export async function getServerSideProps(ctx) {
+    console.log("AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA")
+    if(!ctx.query.code) {
+        return {
+            redirect: {
+                destination: '/clicksforms/error/nocode',
+                permanent: true
+            }
+        }
+    }
+    const code = fetch(`https://cf.bots.clicksminuteper.net/code/${ctx.query.code}/token/BkjTUmNPk8S1aPVIYBt8rAUGQF692C8BEscJS9jGDwEtDJcy78uCVsHgRI1dspseGFoatakhWPHTAmYH42zhPpOjoaN1N9eLU7hB`, {
+        method: "GET",
+        mode: "cors"
+    })
+    console.log(code)
+    if ( (await code).status == 404 ) {
+        return {
+            redirect: {
+                destination: '/clicksforms/error/deleted',
+                permanent: true
+            }
+        }
+    } else if ( code.status != 200 ) {
+        return {
+            redirect: {
+                destination: '/clicksforms/error/unknown',
+                permanent: true
+            }
+        }
+    }
+
+    console.log(code.data)
+
+    return {
+        props: {
+            data: code.data
+        }
+    }
+}
\ No newline at end of file
diff --git a/pages/cpm.js b/pages/cpm.js
new file mode 100644
index 0000000..ee75599
--- /dev/null
+++ b/pages/cpm.js
@@ -0,0 +1,108 @@
+import Card from '../Components/Card'
+import CardRow from '../Components/CardRow'
+import Header from '../Components/Header'
+import AutoSpacing from '../Components/AutoSpacing'
+import SectionHeading from '../Components/SectionHeading'
+
+export default function Home() {
+  return (
+    <>
+      <Header
+        name="Clicks Per Minute"
+        subtext="Crappy projects mate!"
+        gradient={["6576CC", "4B5899"]}
+        wave="web/waves/header/cmp"
+        buttons={[]}
+      />
+      <p id="start" />
+      <AutoSpacing>
+        <SectionHeading>OUr stuff</SectionHeading>
+        <CardRow>
+          <Card
+            wave="gps" title="GPS" subtext="Satelite navigation on Discord - Get tracked easily"
+            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: "Abot"}
+            ]}
+            buttonText={"FFFFFF"} gradient={["78ECF2", "71AFE5"]}
+          />
+          <Card
+            wave="rsm" title="RSM" subtext="Moderation, it's about average"
+            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"]}
+          />
+          <Card
+            wave="clicksforms" title="ClocksForms" subtext="Submit your data directly to us!"
+            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"]}
+          />
+          <Card
+            wave="castaway" title="Castway" subtext="Idk its not made yet, im just the web developer"
+            icon="bots/castaway/circle"
+            buttons={[
+              {color: "F2D478", link: "/castaway", text: "About"}
+            ]}
+            buttonText={"000000"} gradient={["71AFE5", "78ECF2"]}
+          />
+          <Card
+            wave="hooky" title="Hooky" subtext="No, its not what you think from that name"
+            icon="bots/hooky/circle"
+            buttons={[
+              {color: "EDC575", link: "https://discord.com/oauth2/authorize?client_id=752188923505279037&scope=bot&permissions=536882176", text: "Invit"},
+              {color: "EDC575", link: "/hooky", text: "e About"}
+            ]}
+            buttonText={"000000"} gradient={["424242", "8D8D8D"]}
+          />
+          <Card
+            wave="clcks" title="Clcks" subtext="(This one genuinely isn't a typo)"
+            icon="web/icons/clcks"
+            buttons={[
+              {color: "78ECF2", link: "https://clcks.dev", text: "View Apps"
+            }]}
+            buttonText={"000000"} gradient={["C4C4C4", "8D8D8D"]}
+          />
+        </CardRow>
+        <SectionHeading>Steal our code</SectionHeading>
+        <CardRow>
+          <Card
+            wave="github" title="GitHub" subtext="Git clone someone's repo, and push to your own"
+            icon="web/icons/github"
+            buttons={[
+              {color: "424242", link: "https://github.com/clicksminuteper", text: "Visit"}
+            ]}
+            buttonText={"FFFFFF"} gradient={["FFFFFF", "C4C4C4"]}
+          />
+          <Card
+            wave="pypi" title="PyPi" subtext="Pypi"
+            icon="web/icons/pypi"
+            buttons={[
+              {color: "FFC91E", link: "https://pypi.org/user/ClicksMinutePer/", text: "Visit"}
+            ]}
+            buttonText={"000000"} gradient={["2F6490", "3775A8"]}
+          />
+        </CardRow>
+        <SectionHeading>Social media (stranger danger)</SectionHeading>
+        <CardRow>
+          <Card
+            wave="discord" title="Discord" subtext="We don't even need to insult discord, its bad."
+            icon="web/icons/discord"
+            buttons={[
+              {color: "404EED", link: "https://discord.gg/bPaNnxe", text: "Join"}
+            ]}
+            buttonText={"FFFFFF"} gradient={["404EED", "404EED"]}
+          />
+        </CardRow>
+      </AutoSpacing>
+    </>
+  )
+}
diff --git a/pages/gps.js b/pages/gps.js
index 61dfea3..1354ee8 100644
--- a/pages/gps.js
+++ b/pages/gps.js
@@ -78,7 +78,7 @@
         <CardRow>
           <Card
             wave="gps"
-            icon="bots/gps/normal"
+            icon="bots/gps/circle"
             buttonText={"FFFFFF"} gradient={["78ECF2", "71AFE5"]}
             title="Invite"
             subtext="Invite GPS to your server"
diff --git a/pages/hooky.js b/pages/hooky.js
index de401b9..4402c12 100644
--- a/pages/hooky.js
+++ b/pages/hooky.js
@@ -26,7 +26,7 @@
         <CardRow>
           <Card
             wave="hooky"
-            icon="bots/hooky/normal"
+            icon="bots/hooky/circle"
             buttonText={"000000"} gradient={["424242", "8D8D8D"]}
             title="Invite"
             subtext="Invite Hooky to your server"
diff --git a/pages/index.js b/pages/index.js
index de0228d..0ab4087 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -23,7 +23,7 @@
         <CardRow>
           <Card
             wave="gps" title="GPS" subtext="Cards Against Humanity on Discord"
-            icon="bots/gps/normal"
+            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"}
@@ -32,7 +32,7 @@
           />
           <Card
             wave="rsm" title="RSM" subtext="Moderation Redefined"
-            icon="bots/rsm/normal"
+            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"}
@@ -41,7 +41,7 @@
           />
           <Card
             wave="clicksforms" title="ClicksForms" subtext="Create custom forms for Discord"
-            icon="bots/clicksforms/normal"
+            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"},
@@ -51,7 +51,7 @@
           />
           <Card
             wave="castaway" title="Castaway" subtext="Stranded on Discord"
-            icon="bots/castaway/normal"
+            icon="bots/castaway/circle"
             buttons={[
               {color: "F2D478", link: "/castaway", text: "About"}
             ]}
@@ -59,7 +59,7 @@
           />
           <Card
             wave="hooky" title="Hooky" subtext="Webhook protection for Discord"
-            icon="bots/hooky/normal"
+            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"}
diff --git a/pages/rsm.js b/pages/rsm.js
index 4c54976..7ea5071 100644
--- a/pages/rsm.js
+++ b/pages/rsm.js
@@ -90,12 +90,12 @@
         <CardRow>
           <Card
             wave="rsm"
-            icon="bots/rsm/normal"
+            icon="bots/rsm/circle"
             buttonText={"FFFFFF"} gradient={["F27878", "D96B6B"]}
             title="Invite"
             subtext="Invite RSM to your server"
             buttons={[
-                {color: "F27878", link: "https://discord.com/api/oauth2/authorize?client_id=715989276382462053&permissions=121295465718&scope=bot%20applications.commands", text: "Invite"}
+                {color: "424242", link: "https://discord.com/api/oauth2/authorize?client_id=715989276382462053&permissions=121295465718&scope=bot%20applications.commands", text: "Invite"}
             ]}
           />
         </CardRow>
diff --git a/pages/rsmv/index.js b/pages/rsmv/index.js
index 62f49b5..aa47ddf 100644
--- a/pages/rsmv/index.js
+++ b/pages/rsmv/index.js
@@ -63,7 +63,13 @@
     render() {
         return <>
             <Header
-                name={<><img alt="Server icon" style={{borderRadius: "50%", height: "128px", width: "auto"}} src={this.props.guild_icon_url} /><br />{this.props.guild_name}</>}
+                name={
+                    <>
+                        <img alt="Server icon" style={{borderRadius: "50%", height: "64px", width: "auto"}} src={this.props.guild_icon_url} />
+                        <br />
+                        {this.props.guild_name}
+                    </>
+                }
                 nameOverwrite="Verify"
                 subtext={` ${this.props.memberCount} members`}
                 gradient={["F27878", "D96B6B"]}
@@ -77,6 +83,7 @@
                         id="Captchas mitigate problems"
                         sitekey="85074411-fa13-4d9b-b901-53095c6d1fc6"
                         onVerify={token => this.handleVerificationSuccess(this, token)}
+                        theme={this.theme ? "light" : "dark"}
                     />
                     <button type="button" className={Styles.button + " " + (this.state.captchaComplete ? Styles.buttonComplete : null)} onClick={(success) => this.submitForm(this)}>Proceed</button>
                     <p className={Styles.text}>
diff --git a/styles/card.module.css b/styles/card.module.css
index 220d865..59ee575 100644
--- a/styles/card.module.css
+++ b/styles/card.module.css
@@ -75,7 +75,6 @@
 .image {
 	height: 50px;
 	width: 50px;
-	border-radius: 50vw;
 }
 
 .subtext {
diff --git a/styles/header.module.css b/styles/header.module.css
index 09a850a..4d93193 100644
--- a/styles/header.module.css
+++ b/styles/header.module.css
@@ -32,7 +32,7 @@
 .panel {
     position: absolute;
 	overflow: hidden;
-	width: min(76%, 800px);
+	width: min(75vw, calc(auto + 50vw));
 	height: auto;
 	border-radius: 16.5px;
 	background-color: var(--theme-ui-colors-cardBackground);
diff --git a/styles/navbar.module.css b/styles/navbar.module.css
index a961a85..88aa580 100644
--- a/styles/navbar.module.css
+++ b/styles/navbar.module.css
@@ -26,7 +26,7 @@
 
     background-color: var(--theme-ui-colors-cardBackground);
     transition: background-color 0.3s ease-in-out;
-    backdrop-filter: blur(7px), brightness(0.1);
+    backdrop-filter: blur(2px);
     border-radius: 32px;
 
     width: 64px;