Test out Carbon Ads

assets/css/carbon.css

@@ -0,0 +1,62 @@
+/* Hidden on mobile for now */
+#carbonads {
+    @apply hidden;
+
+    /* avoid layout shift on mobile */
+    /* min-height: 105.38px;  */
+}
+
+
+/* Immediate wrapper */
+#carbonads > span {
+    @apply flex;
+    @apply flex-col;
+
+    @apply justify-center;
+
+    @apply gap-2;
+}
+
+#carbonads .carbon-wrap {
+    @apply flex;
+    @apply flex-col;
+
+    @apply justify-center;
+
+    @apply gap-2;
+}
+
+
+@media only screen and (min-width: 1350px) {
+    #carbonads {
+        @apply block;
+
+        @apply text-gray-300;
+        font-size: 0.65rem;
+
+        @apply bg-black-1;
+        @apply rounded;
+
+        @apply fixed;
+        right: 15px;
+        bottom: 15px;
+
+        z-index: 100;
+
+        max-width: 160px;
+
+        @apply p-3
+    }
+}
+
+#carbonads .carbon-text {
+    @apply opacity-50;
+}
+
+#carbonads .carbon-poweredby {
+    @apply uppercase;
+    @apply text-center;
+    @apply opacity-25;
+
+    font-size: 0.5rem;
+}

assets/css/tailwind.css

@@ -1,3 +1,4 @@
+
 /**
  * This injects Tailwind's base styles, which is a combination of
  * Normalize.css and some additional base styles.
@@ -9,7 +10,8 @@
  *
  * @import "tailwindcss/base";
  */
-@tailwind base;
+/* @tailwind base; */
+@import "tailwindcss/base";
 
 /**
  * This injects any component classes registered by plugins.
@@ -18,7 +20,8 @@
  *
  * @import "tailwindcss/components";
  */
-@tailwind components;
+/* @tailwind components; */
+@import "tailwindcss/components";
 
 /**
  * Here you would add any of your custom component classes; stuff that you'd
@@ -44,7 +47,11 @@
  *
  * @import "tailwindcss/utilities";
  */
-@tailwind utilities;
+/* @tailwind utilities; */
+@import "tailwindcss/utilities";
+
+/* Carbon ads */
+@import "./carbon.css";
 
 
 
@@ -89,7 +96,7 @@ html {
  */
 
  .container {
-    max-width: 1140px;
+    max-width: 1040px;
  }
 
 .ease {