Results Page + Contacts

src/Components/Pages/Hero/Hero.tsx

@@ -0,0 +1,47 @@
+import HeroImg from "../../../assets/HeroImg.svg";
+import Stars from "../../../assets/Stars.svg";
+
+const Hero = () => {
+  return (
+    <div className="flex flex-col lg:mt-20 lg:flex-row 1920:padding-calc items-center">
+      <div className="lg:w-1/2 w-full xl:w-1/2 hidden lg:flex transform origin-left">
+        <img className="items-center" src={HeroImg} alt="hero"></img>
+      </div>
+      <div className="justify-center items-center lg:w-1/2 xl:w-1/2">
+        <div className="flex flex-col text-center lg:pt-10 lg:pr-20 lg:text-right 2xl:pr-40">
+          <img
+            src={Stars}
+            alt="hero"
+            className="md:px-0 ml-auto mr-auto lg:mr-0 lg:text-right"
+          ></img>
+          <div>
+            <h1 className="hero-text">GROW YOUR</h1>
+            <h1 className="hero-text">BUSINESS</h1>
+            <div>
+              <img
+                src={HeroImg}
+                alt="heroSm"
+                className="flex mt-6 lg:hidden"
+              ></img>
+            </div>
+          </div>
+          <h2 className="italic text-lg md:text-2xl 2xl:text-3xl mt-4 md:mt-10">
+            We do all the digital footprint for you,
+          </h2>
+          <h2 className="italic text-lg md:text-2xl 2xl:text-3xl">
+            so you can focus on what's important!
+          </h2>
+          <div className="flex mt-5 lg:mt-12 mx-20 lg:mx-0 lg:ml-auto rounded-xl bg-gradient-to-br from-gold-light to-gold-dark p-0.5 shadow-lg">
+            <a className="flex w-full" href="#Contact">
+              <button className="flex-1 font-medium md:px-8 py-3 text-2xl md:text-3xl bg-gradient-to-br from-custom-bglight to-custom-bgdark rounded-xl hover:bg-transparent hover:from-transparent hover:to-transparent transition duration-500">
+                Yes, I want that!
+              </button>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default Hero;