diff --git a/Frontend/src/codepen/Codepen.jsx b/Frontend/src/codepen/Codepen.jsx
deleted file mode 100644
index 64f6421a299c206000a626ff2b74aba6a96650ff..0000000000000000000000000000000000000000
--- a/Frontend/src/codepen/Codepen.jsx
+++ /dev/null
@@ -1,21 +0,0 @@
-import React from "react";
-
-const Codepen = () => {
-  return (
-    <div>
-        <div class="container">
-            <div class="box">
-                <div class="spin-container">
-                  <div class="shape">
-                      <div class="bd">
-                        
-                      </div>
-                  </div>
-                </div>
-            </div>
-        </div>
-    </div>
-  );
-};
-
-export default Codepen;
diff --git a/Frontend/src/codepen/css/codePenStyling.css b/Frontend/src/codepen/css/codePenStyling.css
deleted file mode 100644
index 96cc48907e93b4b4f7f35c4a9da2dae07bda433e..0000000000000000000000000000000000000000
--- a/Frontend/src/codepen/css/codePenStyling.css
+++ /dev/null
@@ -1,103 +0,0 @@
-* {
-  box-sizing: border-box;
-}
-
-body {
-  background: #003;
-}
-
-.container {
-  height: 100vh;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  overflow: hidden;
-}
-
-.box {
-  width: 60vmin;
-  height: 60vmin;
-  border: 1px dashed rgba(255, 255, 255, 0.4);
-  position: relative;
-}
-.box::before {
-  content: "";
-  position: absolute;
-  top: 0;
-  left: 0;
-  bottom: 0;
-  right: 0;
-  border-radius: 50%;
-  border: 1px dashed rgba(255, 255, 255, 0.4);
-  transform: scale(1.42);
-}
-
-.spin-container {
-  width: 100%;
-  height: 100%;
-  -webkit-animation: spin 12s linear infinite;
-          animation: spin 12s linear infinite;
-  position: relative;
-}
-
-.shape {
-  width: 100%;
-  height: 100%;
-  transition: border-radius 1s ease-out;
-  border-radius: 60% 40% 30% 70%/60% 30% 70% 40%;
-  -webkit-animation: morph 8s ease-in-out infinite both alternate;
-          animation: morph 8s ease-in-out infinite both alternate;
-  position: absolute;
-  overflow: hidden;
-  z-index: 5;
-}
-
-.bd {
-  width: 142%;
-  height: 142%;
-  position: absolute;
-  left: -21%;
-  top: -21%;
-  background: url(https://images.unsplash.com/photo-1519345182560-3f2917c472ef?ixlib=rb-0.3.5&q=85&fm=jpg&crop=entropy&cs=srgb&ixid=eyJhcHBfaWQiOjE0NTg5fQ&s=2868fd5c3f30697d38732224e0ef51ed);
-  background-size: 100%;
-  background-position: center center;
-  display: flex;
-  color: #003;
-  font-size: 5vw;
-  font-weight: bold;
-  align-items: center;
-  justify-content: center;
-  text-align: center;
-  text-transform: uppercase;
-  animation: spin 12s linear infinite reverse;
-  opacity: 1;
-  z-index: 2;
-}
-
-@-webkit-keyframes morph {
-  0% {
-    border-radius: 40% 60% 60% 40%/60% 30% 70% 40%;
-  }
-  100% {
-    border-radius: 40% 60%;
-  }
-}
-
-@keyframes morph {
-  0% {
-    border-radius: 40% 60% 60% 40%/60% 30% 70% 40%;
-  }
-  100% {
-    border-radius: 40% 60%;
-  }
-}
-@-webkit-keyframes spin {
-  to {
-    transform: rotate(1turn);
-  }
-}
-@keyframes spin {
-  to {
-    transform: rotate(1turn);
-  }
-}
\ No newline at end of file
diff --git a/Frontend/src/pages/LandingPage.jsx b/Frontend/src/pages/LandingPage.jsx
index 1105a23b8e911aee3ca59ef7c41f836426257d20..ad257d80fdc8002a894cfab1236f2e1a1bfbbcd9 100644
--- a/Frontend/src/pages/LandingPage.jsx
+++ b/Frontend/src/pages/LandingPage.jsx
@@ -8,7 +8,6 @@ import {
 } from "@heroicons/react/outline";
 import { Popover, Transition } from "@headlessui/react";
 
-import CodePen from "../codepen/Codepen";
 import EasyTrans from "../components/bundel/EasyTrans";
 import { Fragment } from "react";
 import Gallery from "../components/Gallery";
@@ -19,11 +18,6 @@ import { XIcon } from "@heroicons/react/outline";
 import ccheartlogo from "./../assets/cc/heart.black.png";
 import { useNavigate } from "react-router-dom";
 
-//TODO überarbeiten des Designs und https://codepen.io/enbee81/pen/LBMKqV
-//TODO<CodePen></CodePen> CSS IMPORT
-//TODO features aufschlüsseln
-//TODO Farben übernehmen und bereden
-
 const features = [
   {
     name: <EasyTrans>Landingpage.LandingpageFeature1Header</EasyTrans>,
@@ -191,7 +185,6 @@ const LandingPage = () => {
               <EasyTrans>Landingpage.LandingpageFeatureHeaderCaption</EasyTrans>
             </p>
           </div>
-          <CodePen></CodePen>
           <div className="mt-10">
             <dl className="space-y-10 md:space-y-0 md:grid md:grid-cols-2 md:gap-x-8 md:gap-y-10">
               {features.map((feature) => (
@@ -251,7 +244,7 @@ const LandingPage = () => {
           </span>
         </h2>
       </div>
-      <div className="bg-fairbrightgreen">
+      {/* <div className="bg-fairbrightgreen">
         <div className="max-w-7xl mx-auto flex flex-col items-center justify-between py-12 px-4 sm:px-6 lg:py-16 lg:px-8 lg:flex-row">
           <PriceCard
             price="0"
@@ -344,7 +337,7 @@ const LandingPage = () => {
             ]}
           ></PriceCard>
         </div>
-      </div>
+      </div> */}
     </div>
   );
   //#endregion