CSS cleanup

Author: kristoferlund

components/Navigation.js

@@ -21,7 +21,7 @@ const Navigation = () => {
   };
 
   return (
-    <nav className="tec-bg-gradient-1">
+    <nav className="tec-nav-bg-gradient">
       <div className="px-2 py-4 mx-auto max-w-7xl sm:px-6 lg:px-8 sm:py-6 lg:py-8">
         <div className="relative flex items-center justify-between">
           <div className="absolute inset-y-0 left-0 flex items-center sm:hidden">

components/Workgroup.css

@@ -0,0 +1,8 @@
+@layer components {
+  .tec-wg-hero-body p {
+    @apply pb-5 lg:pb-10;
+  }
+  .tec-wg-desc:hover ~ div {
+    @apply opacity-0;
+  }
+}

components/Workgroup.js

@@ -28,7 +28,7 @@ const Workgroup = ({ wg }) => {
     };
 
     return (
-      <div className="absolute top-0 left-0 w-full h-48 p-2 text-sm text-center transition duration-500 ease-in-out pointer-events-none wg-title tec-text-bg-unicorn-1">
+      <div className="absolute top-0 left-0 w-full h-48 p-2 text-sm text-center transition duration-500 ease-in-out pointer-events-none wg-title tec-bg-unicorn-1">
         <div className="flex flex-row items-center justify-start h-full space-x-5 bg-black">
           <img src={wg.wgImg} className="inline-block w-24 h-24 ml-5" />
           <div
@@ -43,7 +43,7 @@ const Workgroup = ({ wg }) => {
 
   const Description = () => {
     return (
-      <div className="flex flex-col justify-between w-full p-5 text-sm h-60 lg:h-48 tec-text-bg-unicorn-2">
+      <div className="flex flex-col justify-between w-full p-5 text-sm h-60 lg:h-48 tec-bg-unicorn-2">
         <div className="mb-2">{wg.description}</div>
         <div className="flex flex-row items-center justify-between space-x-4">
           <div className="">