diff --git a/404.css b/404.css
new file mode 100644
index 0000000..bbf36cc
--- /dev/null
+++ b/404.css
@@ -0,0 +1,35 @@
+.not-found-container {
+  width: 100%;
+  display: flex;
+  overflow: auto;
+  min-height: 100vh;
+  align-items: center;
+  flex-direction: column;
+  justify-content: center;
+}
+.not-found-container1 {
+  display: flex;
+  position: relative;
+  align-items: center;
+  flex-direction: column;
+  justify-content: center;
+}
+.not-found-text1 {
+  color: rgb(38, 38, 38);
+  font-size: 252px;
+  margin-top: -20px;
+  font-weight: 900;
+  margin-bottom: -20px;
+  letter-spacing: -20px;
+}
+.not-found-container2 {
+  width: 421px;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  justify-content: center;
+}
+.not-found-text2 {
+  text-align: center;
+  font-weight: 400;
+}
diff --git a/404.html b/404.html
new file mode 100644
index 0000000..5c24d3a
--- /dev/null
+++ b/404.html
@@ -0,0 +1,158 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>404 - Not Found</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta charset="utf-8" />
+    <meta property="twitter:card" content="summary_large_image" />
+
+    <style data-tag="reset-style-sheet">
+      html {  line-height: 1.15;}body {  margin: 0;}* {  box-sizing: border-box;  border-width: 0;  border-style: solid;}p,li,ul,pre,div,h1,h2,h3,h4,h5,h6,figure,blockquote,figcaption {  margin: 0;  padding: 0;}button {  background-color: transparent;}button,input,optgroup,select,textarea {  font-family: inherit;  font-size: 100%;  line-height: 1.15;  margin: 0;}button,select {  text-transform: none;}button,[type="button"],[type="reset"],[type="submit"] {  -webkit-appearance: button;}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {  border-style: none;  padding: 0;}button:-moz-focus,[type="button"]:-moz-focus,[type="reset"]:-moz-focus,[type="submit"]:-moz-focus {  outline: 1px dotted ButtonText;}a {  color: inherit;  text-decoration: inherit;}input {  padding: 2px 4px;}img {  display: block;}html { scroll-behavior: smooth  }
+    </style>
+    <style data-tag="default-style-sheet">
+      html {
+        font-family: Merriweather;
+        font-size: 16px;
+      }
+
+      body {
+        font-weight: 700;
+        font-style:normal;
+        text-decoration: none;
+        text-transform: uppercase;
+        letter-spacing: normal;
+        line-height: 1.3;
+        color: var(--dl-color-scheme-darkblue);
+        background-color: var(--dl-color-scheme-white);
+
+      }
+    </style>
+    <link
+      rel="shortcut icon"
+      href="public/ft_favicon.png"
+      type="icon/png"
+      sizes="32x32"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital,wght@0,400;1,400&amp;display=swap"
+      data-tag="font"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&amp;display=swap"
+      data-tag="font"
+    />
+    <style>
+      .services-card:hover > div{
+      background-color: #fff
+      }
+    </style>
+  </head>
+  <body>
+    <link rel="stylesheet" href="./style.css" />
+    <div>
+      <link href="./404.css" rel="stylesheet" />
+
+      <div class="not-found-container">
+        <h3>OOPS! PAGE NOT FOUND</h3>
+        <div class="not-found-container1">
+          <h1 class="not-found-text1">404</h1>
+        </div>
+        <div class="not-found-container2">
+          <h2 class="not-found-text2">
+            WE ARE SORRY, BUT THE PAGE YOU REQUESTED WAS NOT FOUND
+          </h2>
+        </div>
+      </div>
+    </div>
+    <script src="https://unpkg.com/@teleporthq/teleport-custom-scripts"></script>
+    <script>
+      window.onload = () => {
+        const runAllScripts = () => {
+          initializeAllSliders();
+        };
+
+        const listenForUrlChanges = () => {
+          let url = location.href;
+          document.body.addEventListener(
+            "click",
+            () => {
+              requestAnimationFrame(() => {
+                if (url !== location.href) {
+                  runAllScripts();
+                  url = location.href;
+                }
+              });
+            },
+            true
+          );
+        };
+
+        const initializeAllSliders = () => {
+          const allSliders = document.querySelectorAll('[data-type="slider"]');
+          allSliders.forEach((slider) => {
+            initializeSlider(slider);
+          });
+        };
+
+        const initializeSlider = (slider) => {
+          const slides = slider.querySelectorAll('[data-type="slide"]');
+          const middle = Math.ceil(slides.length / 2);
+          let currentSlide = middle;
+
+          const nextSlideBtns = document.querySelectorAll(
+            '[data-action="nextSlide"]'
+          );
+          const previousSlideBtns = document.querySelectorAll(
+            '[data-action="previousSlide"]'
+          );
+
+          const changeSlide = (slideIndex, action) => {
+            currentSlide = slideIndex;
+
+            switch (action) {
+              case "next":
+                slideIndex === slides.length
+                  ? (currentSlide = 1)
+                  : currentSlide++;
+                break;
+              case "previous":
+                slideIndex === 1
+                  ? (currentSlide = slides.length)
+                  : currentSlide--;
+            }
+
+            const slide = slides[0];
+            if (!slide) {
+              console.error("No slides present");
+              return;
+            }
+            const style = window.getComputedStyle(slide);
+            slideWidth =
+              parseInt(style.width) +
+              parseInt(style.marginLeft) +
+              parseInt(style.marginRight);
+            const transformValue = -slideWidth * (currentSlide - middle);
+
+            slider.style.transform = `translateX(${transformValue}px)`;
+          };
+
+          previousSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "previous")
+            );
+          });
+
+          nextSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "next")
+            );
+          });
+        };
+
+        runAllScripts();
+      };
+    </script>
+  </body>
+</html>
diff --git a/advertise.css b/advertise.css
new file mode 100644
index 0000000..c11ddea
--- /dev/null
+++ b/advertise.css
@@ -0,0 +1,323 @@
+.navigation-header {
+  top: 0;
+  width: 100%;
+  display: flex;
+  z-index: 100;
+  position: fixed;
+  align-items: center;
+  justify-content: flex-start;
+  background-color: #151679;
+}
+.navigation-nav {
+  flex: 0 0 auto;
+  display: flex;
+  align-items: center;
+  padding-left: var(--dl-space-space-oneandhalfunits);
+  flex-direction: row;
+}
+.navigation-navlink {
+  color: #ffffff;
+  cursor: pointer;
+  transition: 0.3s;
+  text-decoration: none;
+}
+.navigation-navlink:hover {
+  color: var(--dl-color-scheme-brown);
+}
+.navigation-navlink1 {
+  color: #ffffff;
+  cursor: pointer;
+  transition: 0.3s;
+  margin-left: 41px;
+  text-decoration: none;
+}
+.navigation-navlink1:hover {
+  color: var(--dl-color-scheme-brown);
+}
+.navigation-navlink2 {
+  color: #ffffff;
+  cursor: pointer;
+  transition: 0.3s;
+  margin-left: 41px;
+  text-decoration: none;
+}
+.navigation-navlink2:hover {
+  color: var(--dl-color-scheme-brown);
+}
+.navigation-navlink3 {
+  color: #ffffff;
+  cursor: pointer;
+  transition: 0.3s;
+  margin-left: 41px;
+  text-decoration: none;
+}
+.navigation-navlink3:hover {
+  color: var(--dl-color-scheme-brown);
+}
+.navigation-root-class-name {
+  background-color: #151679;
+}
+.navigation-root-class-name1 {
+  background-color: #151679;
+}
+.navigation-root-class-name2 {
+  background-color: #151679;
+}
+.navigation-root-class-name3 {
+  background-color: #151679;
+}
+@media(max-width: 991px) {
+  .navigation-header {
+    background-color: #151679;
+  }
+  .navigation-nav {
+    padding-left: var(--dl-space-space-oneandhalfunits);
+  }
+}
+@media(max-width: 767px) {
+  .navigation-header {
+    background-color: #151679;
+  }
+  .navigation-nav {
+    align-items: flex-start;
+    padding-left: var(--dl-space-space-oneandhalfunits);
+    flex-direction: column;
+  }
+  .navigation-navlink {
+    margin-bottom: var(--dl-space-space-unit);
+  }
+  .navigation-navlink1 {
+    margin-left: 0;
+    margin-bottom: var(--dl-space-space-unit);
+  }
+  .navigation-navlink2 {
+    margin-left: 0;
+    margin-bottom: var(--dl-space-space-unit);
+  }
+  .navigation-navlink3 {
+    margin-left: 0;
+    margin-bottom: var(--dl-space-space-unit);
+  }
+}
+@media(max-width: 479px) {
+  .navigation-header {
+    background-color: #151679;
+  }
+  .navigation-nav {
+    align-items: flex-start;
+    padding-left: var(--dl-space-space-oneandhalfunits);
+  }
+}
+
+.advertise-container {
+  width: 100%;
+  display: flex;
+  overflow: auto;
+  min-height: 100vh;
+  align-items: center;
+  flex-direction: column;
+  justify-content: center;
+  background-color: #151679;
+}
+.advertise-text {
+  color: rgb(0, 12, 255);
+  align-self: center;
+  text-align: center;
+}
+.advertise-container1 {
+  width: 952px;
+  height: 298px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: #151679;
+}
+.advertise-image {
+  width: 254px;
+  height: 229px;
+  align-self: center;
+  object-fit: cover;
+  margin-left: var(--dl-space-space-sixunits);
+}
+.advertise-form {
+  width: 761px;
+  height: 229px;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+}
+.advertise-textinput {
+  width: 100%;
+}
+.advertise-textinput1 {
+  width: 100%;
+}
+.advertise-textarea {
+  width: 100%;
+  height: 131px;
+}
+.advertise-button {
+  width: var(--dl-size-size-xlarge);
+  align-self: flex-start;
+}
+@media(max-width: 991px) {
+  .advertise-text {
+    color: rgb(0, 12, 255);
+    padding-left: var(--dl-space-space-twounits);
+    padding-right: var(--dl-space-space-twounits);
+    text-transform: lowercase;
+  }
+  .advertise-text01 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text02 {
+    color: var(--dl-color-scheme-white);
+    text-transform: capitalize;
+  }
+  .advertise-text03 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text04 {
+    color: var(--dl-color-scheme-white);
+    text-transform: capitalize;
+  }
+  .advertise-text05 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text06 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text07 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text08 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text09 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text10 {
+    color: var(--dl-color-scheme-white);
+    text-transform: capitalize;
+  }
+  .advertise-text11 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text12 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text13 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text14 {
+    color: var(--dl-color-scheme-white);
+    text-transform: capitalize;
+  }
+  .advertise-text15 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text16 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text17 {
+    color: var(--dl-color-scheme-white);
+    text-transform: uppercase;
+  }
+  .advertise-text18 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text19 {
+    color: var(--dl-color-scheme-white);
+    text-transform: capitalize;
+  }
+  .advertise-text20 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text21 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text22 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text23 {
+    color: var(--dl-color-scheme-white);
+    text-transform: capitalize;
+  }
+  .advertise-text24 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text25 {
+    color: var(--dl-color-scheme-white);
+    text-transform: capitalize;
+  }
+  .advertise-text26 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text27 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text28 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text29 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text30 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-text31 {
+    color: var(--dl-color-scheme-white);
+    text-transform: capitalize;
+  }
+  .advertise-text32 {
+    color: var(--dl-color-scheme-white);
+  }
+  .advertise-image {
+    margin-left: var(--dl-space-space-halfunit);
+    margin-right: var(--dl-space-space-halfunit);
+  }
+  .advertise-form {
+    width: 274px;
+    align-self: flex-start;
+    padding-top: var(--dl-space-space-fourunits);
+    padding-left: var(--dl-space-space-fourunits);
+  }
+  .advertise-textinput {
+    width: auto;
+    font-family: Times New Roman;
+  }
+  .advertise-textinput1 {
+    width: auto;
+    font-family: Times New Roman;
+  }
+  .advertise-textarea {
+    width: auto;
+    font-family: Times New Roman;
+  }
+  .advertise-button {
+    width: auto;
+  }
+}
+@media(max-width: 479px) {
+  .advertise-container1 {
+    width: auto;
+  }
+  .advertise-image {
+    width: auto;
+    height: var(--dl-size-size-xlarge);
+    margin-left: var(--dl-space-space-halfunit);
+    margin-right: var(--dl-space-space-halfunit);
+  }
+  .advertise-textinput {
+    width: auto;
+  }
+  .advertise-textinput1 {
+    width: auto;
+  }
+  .advertise-textarea {
+    width: auto;
+  }
+  .advertise-button {
+    width: auto;
+  }
+}
diff --git a/advertise.html b/advertise.html
new file mode 100644
index 0000000..066da72
--- /dev/null
+++ b/advertise.html
@@ -0,0 +1,256 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>Advertise - FT website</title>
+    <meta property="og:title" content="Advertise - FT website" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta charset="utf-8" />
+    <meta property="twitter:card" content="summary_large_image" />
+
+    <style data-tag="reset-style-sheet">
+      html {  line-height: 1.15;}body {  margin: 0;}* {  box-sizing: border-box;  border-width: 0;  border-style: solid;}p,li,ul,pre,div,h1,h2,h3,h4,h5,h6,figure,blockquote,figcaption {  margin: 0;  padding: 0;}button {  background-color: transparent;}button,input,optgroup,select,textarea {  font-family: inherit;  font-size: 100%;  line-height: 1.15;  margin: 0;}button,select {  text-transform: none;}button,[type="button"],[type="reset"],[type="submit"] {  -webkit-appearance: button;}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {  border-style: none;  padding: 0;}button:-moz-focus,[type="button"]:-moz-focus,[type="reset"]:-moz-focus,[type="submit"]:-moz-focus {  outline: 1px dotted ButtonText;}a {  color: inherit;  text-decoration: inherit;}input {  padding: 2px 4px;}img {  display: block;}html { scroll-behavior: smooth  }
+    </style>
+    <style data-tag="default-style-sheet">
+      html {
+        font-family: Merriweather;
+        font-size: 16px;
+      }
+
+      body {
+        font-weight: 700;
+        font-style:normal;
+        text-decoration: none;
+        text-transform: uppercase;
+        letter-spacing: normal;
+        line-height: 1.3;
+        color: var(--dl-color-scheme-darkblue);
+        background-color: var(--dl-color-scheme-white);
+
+      }
+    </style>
+    <link
+      rel="shortcut icon"
+      href="public/ft_favicon.png"
+      type="icon/png"
+      sizes="32x32"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital,wght@0,400;1,400&amp;display=swap"
+      data-tag="font"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&amp;display=swap"
+      data-tag="font"
+    />
+    <style>
+      .services-card:hover > div{
+      background-color: #fff
+      }
+    </style>
+  </head>
+  <body>
+    <link rel="stylesheet" href="./style.css" />
+    <div>
+      <link href="./advertise.css" rel="stylesheet" />
+
+      <div class="advertise-container">
+        <header
+          data-role="Header"
+          class="navigation-header navigation-root-class-name3"
+        >
+          <nav class="navigation-nav">
+            <a href="index.html" class="navigation-navlink Navigation-Link">
+              <span>HOME</span>
+            </a>
+            <a
+              href="get-a-copy.html"
+              class="navigation-navlink1 Navigation-Link"
+            >
+              <span>GET A COPY</span>
+            </a>
+            <a href="contact.html" class="navigation-navlink2 Navigation-Link">
+              <span>CONTACT</span>
+            </a>
+            <a
+              href="advertise.html"
+              class="navigation-navlink3 Navigation-Link"
+            >
+              <span>ADVERTISE</span>
+            </a>
+          </nav>
+        </header>
+        <span class="advertise-text">
+          <span class="advertise-text01">:)</span>
+          <span class="advertise-text02">Announcements</span>
+          <span class="advertise-text03">in</span>
+          <span class="advertise-text04">Fool Tide</span>
+          <span class="advertise-text05">:)</span>
+          <br class="advertise-text06" />
+          <br class="advertise-text07" />
+          <br class="advertise-text08" />
+          <br class="advertise-text09" />
+          <span class="advertise-text10">S</span>
+          <span class="advertise-text11">
+            end a message out to the world about an upcoming project, event,
+            your favorite outfit, attitude or recipe, your friend's upcoming
+            birthday, etc.
+          </span>
+          <br class="advertise-text12" />
+          <br class="advertise-text13" />
+          <span class="advertise-text14">P</span>
+          <span class="advertise-text15">ay what you want!</span>
+          <br class="advertise-text16" />
+          <span class="advertise-text17">FT</span>
+          <span class="advertise-text18">
+            operates entirely off of announcements (there is no other funding
+            involved).
+          </span>
+          <span class="advertise-text19">h</span>
+          <span class="advertise-text20">
+            elp us purchase paper and ink!&nbsp;
+          </span>
+          <br class="advertise-text21" />
+          <br class="advertise-text22" />
+          <span class="advertise-text23">St</span>
+          <span class="advertise-text24">
+            andard size is 60x33mm, single color (greyscale).
+          </span>
+          <span class="advertise-text25">Do</span>
+          <span class="advertise-text26">uble-size is 60x66.</span>
+          <br class="advertise-text27" />
+          <br class="advertise-text28" />
+          <br class="advertise-text29" />
+          <br class="advertise-text30" />
+          <span class="advertise-text31">S</span>
+          <span class="advertise-text32">
+            ubmit an image to tidefool @ gmail.com, or give us your description
+            and we'll help with layout.
+          </span>
+          <br />
+        </span>
+        <div class="advertise-container1">
+          <img
+            alt="image"
+            src="public/foxacid-300h.png"
+            class="advertise-image"
+          />
+          <form
+            action="https://formsubmit.co/tidefool@gmail.com"
+            method="POST"
+            enctype="application/x-www-form-urlencoded"
+            class="advertise-form"
+          >
+            <input
+              type="text"
+              name="name"
+              required=""
+              placeholder="name"
+              class="advertise-textinput input"
+            />
+            <input
+              type="text"
+              name="email"
+              placeholder="email"
+              class="advertise-textinput1 input"
+            />
+            <textarea
+              placeholder="message"
+              class="advertise-textarea textarea"
+            ></textarea>
+            <button type="submit" class="advertise-button button">SEND</button>
+          </form>
+        </div>
+      </div>
+    </div>
+    <script src="https://unpkg.com/@teleporthq/teleport-custom-scripts"></script>
+    <script>
+      window.onload = () => {
+        const runAllScripts = () => {
+          initializeAllSliders();
+        };
+
+        const listenForUrlChanges = () => {
+          let url = location.href;
+          document.body.addEventListener(
+            "click",
+            () => {
+              requestAnimationFrame(() => {
+                if (url !== location.href) {
+                  runAllScripts();
+                  url = location.href;
+                }
+              });
+            },
+            true
+          );
+        };
+
+        const initializeAllSliders = () => {
+          const allSliders = document.querySelectorAll('[data-type="slider"]');
+          allSliders.forEach((slider) => {
+            initializeSlider(slider);
+          });
+        };
+
+        const initializeSlider = (slider) => {
+          const slides = slider.querySelectorAll('[data-type="slide"]');
+          const middle = Math.ceil(slides.length / 2);
+          let currentSlide = middle;
+
+          const nextSlideBtns = document.querySelectorAll(
+            '[data-action="nextSlide"]'
+          );
+          const previousSlideBtns = document.querySelectorAll(
+            '[data-action="previousSlide"]'
+          );
+
+          const changeSlide = (slideIndex, action) => {
+            currentSlide = slideIndex;
+
+            switch (action) {
+              case "next":
+                slideIndex === slides.length
+                  ? (currentSlide = 1)
+                  : currentSlide++;
+                break;
+              case "previous":
+                slideIndex === 1
+                  ? (currentSlide = slides.length)
+                  : currentSlide--;
+            }
+
+            const slide = slides[0];
+            if (!slide) {
+              console.error("No slides present");
+              return;
+            }
+            const style = window.getComputedStyle(slide);
+            slideWidth =
+              parseInt(style.width) +
+              parseInt(style.marginLeft) +
+              parseInt(style.marginRight);
+            const transformValue = -slideWidth * (currentSlide - middle);
+
+            slider.style.transform = `translateX(${transformValue}px)`;
+          };
+
+          previousSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "previous")
+            );
+          });
+
+          nextSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "next")
+            );
+          });
+        };
+
+        runAllScripts();
+      };
+    </script>
+  </body>
+</html>
diff --git a/components/blog-card.html b/components/blog-card.html
index 51f39b5..452bb07 100644
--- a/components/blog-card.html
+++ b/components/blog-card.html
@@ -1,21 +1,164 @@
-<div>
-  <link href="./blog-card.css" rel="stylesheet" />
-  <div class="blog-card-blog-card">
-    <img
-      alt="image"
-      src="https://play.teleporthq.io/static/svg/placeholders/no-image.svg"
-      class="blog-card-image"
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>FT website</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta charset="utf-8" />
+    <meta property="twitter:card" content="summary_large_image" />
+
+    <style data-tag="reset-style-sheet">
+      html {  line-height: 1.15;}body {  margin: 0;}* {  box-sizing: border-box;  border-width: 0;  border-style: solid;}p,li,ul,pre,div,h1,h2,h3,h4,h5,h6,figure,blockquote,figcaption {  margin: 0;  padding: 0;}button {  background-color: transparent;}button,input,optgroup,select,textarea {  font-family: inherit;  font-size: 100%;  line-height: 1.15;  margin: 0;}button,select {  text-transform: none;}button,[type="button"],[type="reset"],[type="submit"] {  -webkit-appearance: button;}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {  border-style: none;  padding: 0;}button:-moz-focus,[type="button"]:-moz-focus,[type="reset"]:-moz-focus,[type="submit"]:-moz-focus {  outline: 1px dotted ButtonText;}a {  color: inherit;  text-decoration: inherit;}input {  padding: 2px 4px;}img {  display: block;}html { scroll-behavior: smooth  }
+    </style>
+    <style data-tag="default-style-sheet">
+      html {
+        font-family: Merriweather;
+        font-size: 16px;
+      }
+
+      body {
+        font-weight: 700;
+        font-style:normal;
+        text-decoration: none;
+        text-transform: uppercase;
+        letter-spacing: normal;
+        line-height: 1.3;
+        color: var(--dl-color-scheme-darkblue);
+        background-color: var(--dl-color-scheme-white);
+
+      }
+    </style>
+    <link
+      rel="shortcut icon"
+      href="public/ft_favicon.png"
+      type="icon/png"
+      sizes="32x32"
     />
-    <div class="blog-card-container">
-      <button class="blog-card-button button-secondary button">
-        <span>Web Design</span>
-      </button>
-      <span class="blog-card-text"><span>Dec 8, 2022</span></span>
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital,wght@0,400;1,400&amp;display=swap"
+      data-tag="font"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&amp;display=swap"
+      data-tag="font"
+    />
+    <style>
+      .services-card:hover > div{
+      background-color: #fff
+      }
+    </style>
+  </head>
+  <body>
+    <link rel="stylesheet" href="../style.css" />
+    <div>
+      <link href="./blog-card.css" rel="stylesheet" />
+      <div class="blog-card-blog-card">
+        <img
+          alt="image"
+          src="https://play.teleporthq.io/static/svg/placeholders/no-image.svg"
+          class="blog-card-image"
+        />
+        <div class="blog-card-container">
+          <button class="blog-card-button button-secondary button">
+            <span>Web Design</span>
+          </button>
+          <span class="blog-card-text"><span>Dec 8, 2022</span></span>
+        </div>
+        <span class="blog-card-text1">
+          <span>Excepteur sint occaecat cupidatat non proident, sunt</span>
+          <span>in culpa qui and.</span>
+        </span>
+        <span class="blog-card-text4"><span>Learn more</span></span>
+      </div>
     </div>
-    <span class="blog-card-text1">
-      <span>Excepteur sint occaecat cupidatat non proident, sunt</span>
-      <span>in culpa qui and.</span>
-    </span>
-    <span class="blog-card-text4"><span>Learn more</span></span>
-  </div>
-</div>
+    <script src="https://unpkg.com/@teleporthq/teleport-custom-scripts"></script>
+    <script>
+      window.onload = () => {
+        const runAllScripts = () => {
+          initializeAllSliders();
+        };
+
+        const listenForUrlChanges = () => {
+          let url = location.href;
+          document.body.addEventListener(
+            "click",
+            () => {
+              requestAnimationFrame(() => {
+                if (url !== location.href) {
+                  runAllScripts();
+                  url = location.href;
+                }
+              });
+            },
+            true
+          );
+        };
+
+        const initializeAllSliders = () => {
+          const allSliders = document.querySelectorAll('[data-type="slider"]');
+          allSliders.forEach((slider) => {
+            initializeSlider(slider);
+          });
+        };
+
+        const initializeSlider = (slider) => {
+          const slides = slider.querySelectorAll('[data-type="slide"]');
+          const middle = Math.ceil(slides.length / 2);
+          let currentSlide = middle;
+
+          const nextSlideBtns = document.querySelectorAll(
+            '[data-action="nextSlide"]'
+          );
+          const previousSlideBtns = document.querySelectorAll(
+            '[data-action="previousSlide"]'
+          );
+
+          const changeSlide = (slideIndex, action) => {
+            currentSlide = slideIndex;
+
+            switch (action) {
+              case "next":
+                slideIndex === slides.length
+                  ? (currentSlide = 1)
+                  : currentSlide++;
+                break;
+              case "previous":
+                slideIndex === 1
+                  ? (currentSlide = slides.length)
+                  : currentSlide--;
+            }
+
+            const slide = slides[0];
+            if (!slide) {
+              console.error("No slides present");
+              return;
+            }
+            const style = window.getComputedStyle(slide);
+            slideWidth =
+              parseInt(style.width) +
+              parseInt(style.marginLeft) +
+              parseInt(style.marginRight);
+            const transformValue = -slideWidth * (currentSlide - middle);
+
+            slider.style.transform = `translateX(${transformValue}px)`;
+          };
+
+          previousSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "previous")
+            );
+          });
+
+          nextSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "next")
+            );
+          });
+        };
+
+        runAllScripts();
+      };
+    </script>
+  </body>
+</html>
diff --git a/components/copyright.html b/components/copyright.html
index 2513ae6..5fa8c10 100644
--- a/components/copyright.html
+++ b/components/copyright.html
@@ -1,43 +1,186 @@
-<div>
-  <link href="./copyright.css" rel="stylesheet" />
-  <div class="copyright-copyright">
-    <div class="copyright-max-width">
-      <span class="copyright-text">
-        <span class="copyright-text01">
-          <span>© All rights reserved</span>
-          <span></span>
-        </span>
-        <a
-          href="https://www.teleporthq.io"
-          target="_blank"
-          rel="noreferrer noopener"
-        >
-          <span class="copyright-text04">@TeleportHQ.</span>
-        </a>
-        <span class="copyright-text05">
-          <span>Powered by</span>
-          <span></span>
-        </span>
-        <a
-          href="https://www.vercel.com"
-          target="_blank"
-          rel="noreferrer noopener"
-        >
-          <span class="copyright-text08">Vercel</span>
-        </a>
-        <span class="copyright-text09">
-          <span>. Image source:</span>
-          <span></span>
-        </span>
-        <a
-          href="https://www.unsplash.com"
-          target="_blank"
-          rel="noreferrer noopener"
-        >
-          <span class="copyright-text12">Unsplash</span>
-        </a>
-        <span class="copyright-text13">.</span>
-      </span>
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>FT website</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta charset="utf-8" />
+    <meta property="twitter:card" content="summary_large_image" />
+
+    <style data-tag="reset-style-sheet">
+      html {  line-height: 1.15;}body {  margin: 0;}* {  box-sizing: border-box;  border-width: 0;  border-style: solid;}p,li,ul,pre,div,h1,h2,h3,h4,h5,h6,figure,blockquote,figcaption {  margin: 0;  padding: 0;}button {  background-color: transparent;}button,input,optgroup,select,textarea {  font-family: inherit;  font-size: 100%;  line-height: 1.15;  margin: 0;}button,select {  text-transform: none;}button,[type="button"],[type="reset"],[type="submit"] {  -webkit-appearance: button;}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {  border-style: none;  padding: 0;}button:-moz-focus,[type="button"]:-moz-focus,[type="reset"]:-moz-focus,[type="submit"]:-moz-focus {  outline: 1px dotted ButtonText;}a {  color: inherit;  text-decoration: inherit;}input {  padding: 2px 4px;}img {  display: block;}html { scroll-behavior: smooth  }
+    </style>
+    <style data-tag="default-style-sheet">
+      html {
+        font-family: Merriweather;
+        font-size: 16px;
+      }
+
+      body {
+        font-weight: 700;
+        font-style:normal;
+        text-decoration: none;
+        text-transform: uppercase;
+        letter-spacing: normal;
+        line-height: 1.3;
+        color: var(--dl-color-scheme-darkblue);
+        background-color: var(--dl-color-scheme-white);
+
+      }
+    </style>
+    <link
+      rel="shortcut icon"
+      href="public/ft_favicon.png"
+      type="icon/png"
+      sizes="32x32"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital,wght@0,400;1,400&amp;display=swap"
+      data-tag="font"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&amp;display=swap"
+      data-tag="font"
+    />
+    <style>
+      .services-card:hover > div{
+      background-color: #fff
+      }
+    </style>
+  </head>
+  <body>
+    <link rel="stylesheet" href="../style.css" />
+    <div>
+      <link href="./copyright.css" rel="stylesheet" />
+      <div class="copyright-copyright">
+        <div class="copyright-max-width">
+          <span class="copyright-text">
+            <span class="copyright-text01">
+              <span>© All rights reserved</span>
+              <span></span>
+            </span>
+            <a
+              href="https://www.teleporthq.io"
+              target="_blank"
+              rel="noreferrer noopener"
+            >
+              <span class="copyright-text04">@TeleportHQ.</span>
+            </a>
+            <span class="copyright-text05">
+              <span>Powered by</span>
+              <span></span>
+            </span>
+            <a
+              href="https://www.vercel.com"
+              target="_blank"
+              rel="noreferrer noopener"
+            >
+              <span class="copyright-text08">Vercel</span>
+            </a>
+            <span class="copyright-text09">
+              <span>. Image source:</span>
+              <span></span>
+            </span>
+            <a
+              href="https://www.unsplash.com"
+              target="_blank"
+              rel="noreferrer noopener"
+            >
+              <span class="copyright-text12">Unsplash</span>
+            </a>
+            <span class="copyright-text13">.</span>
+          </span>
+        </div>
+      </div>
     </div>
-  </div>
-</div>
+    <script src="https://unpkg.com/@teleporthq/teleport-custom-scripts"></script>
+    <script>
+      window.onload = () => {
+        const runAllScripts = () => {
+          initializeAllSliders();
+        };
+
+        const listenForUrlChanges = () => {
+          let url = location.href;
+          document.body.addEventListener(
+            "click",
+            () => {
+              requestAnimationFrame(() => {
+                if (url !== location.href) {
+                  runAllScripts();
+                  url = location.href;
+                }
+              });
+            },
+            true
+          );
+        };
+
+        const initializeAllSliders = () => {
+          const allSliders = document.querySelectorAll('[data-type="slider"]');
+          allSliders.forEach((slider) => {
+            initializeSlider(slider);
+          });
+        };
+
+        const initializeSlider = (slider) => {
+          const slides = slider.querySelectorAll('[data-type="slide"]');
+          const middle = Math.ceil(slides.length / 2);
+          let currentSlide = middle;
+
+          const nextSlideBtns = document.querySelectorAll(
+            '[data-action="nextSlide"]'
+          );
+          const previousSlideBtns = document.querySelectorAll(
+            '[data-action="previousSlide"]'
+          );
+
+          const changeSlide = (slideIndex, action) => {
+            currentSlide = slideIndex;
+
+            switch (action) {
+              case "next":
+                slideIndex === slides.length
+                  ? (currentSlide = 1)
+                  : currentSlide++;
+                break;
+              case "previous":
+                slideIndex === 1
+                  ? (currentSlide = slides.length)
+                  : currentSlide--;
+            }
+
+            const slide = slides[0];
+            if (!slide) {
+              console.error("No slides present");
+              return;
+            }
+            const style = window.getComputedStyle(slide);
+            slideWidth =
+              parseInt(style.width) +
+              parseInt(style.marginLeft) +
+              parseInt(style.marginRight);
+            const transformValue = -slideWidth * (currentSlide - middle);
+
+            slider.style.transform = `translateX(${transformValue}px)`;
+          };
+
+          previousSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "previous")
+            );
+          });
+
+          nextSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "next")
+            );
+          });
+        };
+
+        runAllScripts();
+      };
+    </script>
+  </body>
+</html>
diff --git a/components/event-card.html b/components/event-card.html
index a41ddca..da3387f 100644
--- a/components/event-card.html
+++ b/components/event-card.html
@@ -1,23 +1,166 @@
-<div>
-  <link href="./event-card.css" rel="stylesheet" />
-  <div class="event-card-event-card">
-    <img
-      alt="image"
-      src="https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDEwfHxwZW9wbGV8ZW58MHx8fHwxNjQzNzA1NTEx&ixlib=rb-1.2.1&w=200"
-      class="event-card-image"
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>FT website</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta charset="utf-8" />
+    <meta property="twitter:card" content="summary_large_image" />
+
+    <style data-tag="reset-style-sheet">
+      html {  line-height: 1.15;}body {  margin: 0;}* {  box-sizing: border-box;  border-width: 0;  border-style: solid;}p,li,ul,pre,div,h1,h2,h3,h4,h5,h6,figure,blockquote,figcaption {  margin: 0;  padding: 0;}button {  background-color: transparent;}button,input,optgroup,select,textarea {  font-family: inherit;  font-size: 100%;  line-height: 1.15;  margin: 0;}button,select {  text-transform: none;}button,[type="button"],[type="reset"],[type="submit"] {  -webkit-appearance: button;}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {  border-style: none;  padding: 0;}button:-moz-focus,[type="button"]:-moz-focus,[type="reset"]:-moz-focus,[type="submit"]:-moz-focus {  outline: 1px dotted ButtonText;}a {  color: inherit;  text-decoration: inherit;}input {  padding: 2px 4px;}img {  display: block;}html { scroll-behavior: smooth  }
+    </style>
+    <style data-tag="default-style-sheet">
+      html {
+        font-family: Merriweather;
+        font-size: 16px;
+      }
+
+      body {
+        font-weight: 700;
+        font-style:normal;
+        text-decoration: none;
+        text-transform: uppercase;
+        letter-spacing: normal;
+        line-height: 1.3;
+        color: var(--dl-color-scheme-darkblue);
+        background-color: var(--dl-color-scheme-white);
+
+      }
+    </style>
+    <link
+      rel="shortcut icon"
+      href="public/ft_favicon.png"
+      type="icon/png"
+      sizes="32x32"
     />
-    <div class="event-card-vertical-line"></div>
-    <div class="event-card-container">
-      <span class="event-card-title">
-        <span>Inbound Marketing Secrets</span>
-      </span>
-      <span class="event-card-text">
-        <span>
-          Amet minim mollit non deserunt ullamco est sit aliqua dolor do amet
-          sint. Velit officia consequat duis enim velit mollit. Exercitation
-          veniam consequat sunt nostrud amet.
-        </span>
-      </span>
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital,wght@0,400;1,400&amp;display=swap"
+      data-tag="font"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&amp;display=swap"
+      data-tag="font"
+    />
+    <style>
+      .services-card:hover > div{
+      background-color: #fff
+      }
+    </style>
+  </head>
+  <body>
+    <link rel="stylesheet" href="../style.css" />
+    <div>
+      <link href="./event-card.css" rel="stylesheet" />
+      <div class="event-card-event-card">
+        <img
+          alt="image"
+          src="https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDEwfHxwZW9wbGV8ZW58MHx8fHwxNjQzNzA1NTEx&amp;ixlib=rb-1.2.1&amp;w=200"
+          class="event-card-image"
+        />
+        <div class="event-card-vertical-line"></div>
+        <div class="event-card-container">
+          <span class="event-card-title">
+            <span>Inbound Marketing Secrets</span>
+          </span>
+          <span class="event-card-text">
+            <span>
+              Amet minim mollit non deserunt ullamco est sit aliqua dolor do
+              amet sint. Velit officia consequat duis enim velit mollit.
+              Exercitation veniam consequat sunt nostrud amet.
+            </span>
+          </span>
+        </div>
+      </div>
     </div>
-  </div>
-</div>
+    <script src="https://unpkg.com/@teleporthq/teleport-custom-scripts"></script>
+    <script>
+      window.onload = () => {
+        const runAllScripts = () => {
+          initializeAllSliders();
+        };
+
+        const listenForUrlChanges = () => {
+          let url = location.href;
+          document.body.addEventListener(
+            "click",
+            () => {
+              requestAnimationFrame(() => {
+                if (url !== location.href) {
+                  runAllScripts();
+                  url = location.href;
+                }
+              });
+            },
+            true
+          );
+        };
+
+        const initializeAllSliders = () => {
+          const allSliders = document.querySelectorAll('[data-type="slider"]');
+          allSliders.forEach((slider) => {
+            initializeSlider(slider);
+          });
+        };
+
+        const initializeSlider = (slider) => {
+          const slides = slider.querySelectorAll('[data-type="slide"]');
+          const middle = Math.ceil(slides.length / 2);
+          let currentSlide = middle;
+
+          const nextSlideBtns = document.querySelectorAll(
+            '[data-action="nextSlide"]'
+          );
+          const previousSlideBtns = document.querySelectorAll(
+            '[data-action="previousSlide"]'
+          );
+
+          const changeSlide = (slideIndex, action) => {
+            currentSlide = slideIndex;
+
+            switch (action) {
+              case "next":
+                slideIndex === slides.length
+                  ? (currentSlide = 1)
+                  : currentSlide++;
+                break;
+              case "previous":
+                slideIndex === 1
+                  ? (currentSlide = slides.length)
+                  : currentSlide--;
+            }
+
+            const slide = slides[0];
+            if (!slide) {
+              console.error("No slides present");
+              return;
+            }
+            const style = window.getComputedStyle(slide);
+            slideWidth =
+              parseInt(style.width) +
+              parseInt(style.marginLeft) +
+              parseInt(style.marginRight);
+            const transformValue = -slideWidth * (currentSlide - middle);
+
+            slider.style.transform = `translateX(${transformValue}px)`;
+          };
+
+          previousSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "previous")
+            );
+          });
+
+          nextSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "next")
+            );
+          });
+        };
+
+        runAllScripts();
+      };
+    </script>
+  </body>
+</html>
diff --git a/components/footer.html b/components/footer.html
index deccfad..de21d52 100644
--- a/components/footer.html
+++ b/components/footer.html
@@ -1,114 +1,257 @@
-<div>
-  <link href="./footer.css" rel="stylesheet" />
-  <footer class="footer-footer section-container">
-    <div class="footer-max-width max-content-container">
-      <div class="footer-bottom-container">
-        <div class="footer-left-side">
-          <img
-            alt="image"
-            src="https://play.teleporthq.io/static/svg/placeholders/no-image.svg"
-            class="footer-image"
-          />
-          <span class="footer-text">
-            Register for the most insightful marketing conference of Europe.
-            Over 30 speakers, 2 days full of digital marketing and social media
-            news, best practices and insights from all over the world.
-          </span>
-          <div class="footer-social-media">
-            <span class="footer-text01">Follow market1</span>
-            <div class="footer-container">
-              <svg viewBox="0 0 1024 1024" class="footer-icon">
-                <path
-                  d="M384 384h177.106v90.782h2.532c24.64-44.194 84.958-90.782 174.842-90.782 186.946 0 221.52 116.376 221.52 267.734v308.266h-184.61v-273.278c0-65.184-1.334-149.026-96.028-149.026-96.148 0-110.82 70.986-110.82 144.292v278.012h-184.542v-576z"
-                ></path>
-                <path d="M64 384h192v576h-192v-576z"></path>
-                <path
-                  d="M256 224c0 53.019-42.981 96-96 96s-96-42.981-96-96c0-53.019 42.981-96 96-96s96 42.981 96 96z"
-                ></path></svg
-              ><svg viewBox="0 0 1024 1024" class="footer-icon04">
-                <path
-                  d="M512 92.2c136.8 0 153 0.6 206.8 3 50 2.2 77 10.6 95 17.6 23.8 9.2 41 20.4 58.8 38.2 18 18 29 35 38.4 58.8 7 18 15.4 45.2 17.6 95 2.4 54 3 70.2 3 206.8s-0.6 153-3 206.8c-2.2 50-10.6 77-17.6 95-9.2 23.8-20.4 41-38.2 58.8-18 18-35 29-58.8 38.4-18 7-45.2 15.4-95 17.6-54 2.4-70.2 3-206.8 3s-153-0.6-206.8-3c-50-2.2-77-10.6-95-17.6-23.8-9.2-41-20.4-58.8-38.2-18-18-29-35-38.4-58.8-7-18-15.4-45.2-17.6-95-2.4-54-3-70.2-3-206.8s0.6-153 3-206.8c2.2-50 10.6-77 17.6-95 9.2-23.8 20.4-41 38.2-58.8 18-18 35-29 58.8-38.4 18-7 45.2-15.4 95-17.6 53.8-2.4 70-3 206.8-3zM512 0c-139 0-156.4 0.6-211 3-54.4 2.4-91.8 11.2-124.2 23.8-33.8 13.2-62.4 30.6-90.8 59.2-28.6 28.4-46 57-59.2 90.6-12.6 32.6-21.4 69.8-23.8 124.2-2.4 54.8-3 72.2-3 211.2s0.6 156.4 3 211c2.4 54.4 11.2 91.8 23.8 124.2 13.2 33.8 30.6 62.4 59.2 90.8 28.4 28.4 57 46 90.6 59 32.6 12.6 69.8 21.4 124.2 23.8 54.6 2.4 72 3 211 3s156.4-0.6 211-3c54.4-2.4 91.8-11.2 124.2-23.8 33.6-13 62.2-30.6 90.6-59s46-57 59-90.6c12.6-32.6 21.4-69.8 23.8-124.2 2.4-54.6 3-72 3-211s-0.6-156.4-3-211c-2.4-54.4-11.2-91.8-23.8-124.2-12.6-34-30-62.6-58.6-91-28.4-28.4-57-46-90.6-59-32.6-12.6-69.8-21.4-124.2-23.8-54.8-2.6-72.2-3.2-211.2-3.2v0z"
-                ></path>
-                <path
-                  d="M512 249c-145.2 0-263 117.8-263 263s117.8 263 263 263 263-117.8 263-263c0-145.2-117.8-263-263-263zM512 682.6c-94.2 0-170.6-76.4-170.6-170.6s76.4-170.6 170.6-170.6c94.2 0 170.6 76.4 170.6 170.6s-76.4 170.6-170.6 170.6z"
-                ></path>
-                <path
-                  d="M846.8 238.6c0 33.91-27.49 61.4-61.4 61.4s-61.4-27.49-61.4-61.4c0-33.91 27.49-61.4 61.4-61.4s61.4 27.49 61.4 61.4z"
-                ></path></svg
-              ><svg viewBox="0 0 1024 1024" class="footer-icon08">
-                <path
-                  d="M920.021 283.179c12.245 65.237 19.115 140.587 18.645 218.667 0.811 65.195-5.248 139.392-18.645 214.229-2.432 8.875-6.4 17.195-11.605 24.533-9.685 13.696-23.808 24.107-40.491 28.8-25.771 6.869-91.989 11.733-165.419 14.549-95.147 3.669-190.507 3.669-190.507 3.669s-95.36 0-190.507-3.627c-73.429-2.816-139.648-7.637-164.949-14.421-8.747-2.432-16.896-6.315-24.149-11.435-13.269-9.387-23.509-22.869-28.587-39.381-12.16-65.109-18.944-140.203-18.475-218.027-0.896-65.707 5.163-140.459 18.645-215.893 2.432-8.875 6.4-17.195 11.605-24.533 9.685-13.696 23.808-24.107 40.491-28.8 25.771-6.869 91.989-11.733 165.419-14.549 95.147-3.627 190.507-3.627 190.507-3.627s95.36 0 190.549 3.328c73.344 2.56 140.032 6.955 164.523 12.928 9.344 2.688 17.963 7.040 25.515 12.757 13.099 9.899 22.955 23.936 27.435 40.875zM1003.093 263.552c-9.259-36.949-30.635-67.84-59.008-89.301-15.915-12.032-33.963-21.077-53.291-26.667-38.315-9.387-115.029-13.781-185.259-16.213-96.725-3.371-193.536-3.371-193.536-3.371s-96.939 0-193.749 3.712c-70.059 2.688-147.2 7.467-184.192 17.365-37.291 10.539-67.456 32.853-88.064 61.867-11.52 16.256-20.011 34.603-25.045 54.101-0.256 1.024-0.469 2.091-0.64 3.029-14.635 80.981-21.291 161.835-20.309 233.856-0.512 82.091 6.869 163.456 20.352 234.752 0.256 1.323 0.555 2.645 0.896 3.755 10.453 36.693 32.853 66.859 61.909 87.381 15.232 10.752 32.299 18.859 50.389 23.936 37.504 10.027 114.603 14.805 184.661 17.493 96.853 3.712 193.792 3.712 193.792 3.712s96.939 0 193.749-3.712c70.059-2.688 147.157-7.467 184.192-17.365 37.248-10.539 67.456-32.853 88.021-61.867 11.52-16.256 20.053-34.603 25.045-54.059 0.256-1.067 0.512-2.133 0.64-3.029 14.507-80.384 21.163-160.64 20.309-232.107 0.512-82.133-6.869-163.541-20.352-234.837-0.171-0.853-0.341-1.707-0.512-2.432zM458.667 567.509v-132.352l116.352 66.176zM437.077 677.931l245.333-139.52c20.48-11.648 27.648-37.717 16-58.197-3.968-6.997-9.643-12.459-16-16l-245.333-139.52c-20.48-11.648-46.549-4.48-58.197 16-3.84 6.741-5.632 14.080-5.589 21.077v279.040c0 23.552 19.115 42.667 42.667 42.667 7.765 0 15.019-2.091 21.077-5.589z"
-                ></path></svg
-              ><svg viewBox="0 0 1024 1024" class="footer-icon10">
-                <path
-                  d="M1024 226.4c-37.6 16.8-78.2 28-120.6 33 43.4-26 76.6-67.2 92.4-116.2-40.6 24-85.6 41.6-133.4 51-38.4-40.8-93-66.2-153.4-66.2-116 0-210 94-210 210 0 16.4 1.8 32.4 5.4 47.8-174.6-8.8-329.4-92.4-433-219.6-18 31-28.4 67.2-28.4 105.6 0 72.8 37 137.2 93.4 174.8-34.4-1-66.8-10.6-95.2-26.2 0 0.8 0 1.8 0 2.6 0 101.8 72.4 186.8 168.6 206-17.6 4.8-36.2 7.4-55.4 7.4-13.6 0-26.6-1.4-39.6-3.8 26.8 83.4 104.4 144.2 196.2 146-72 56.4-162.4 90-261 90-17 0-33.6-1-50.2-3 93.2 59.8 203.6 94.4 322.2 94.4 386.4 0 597.8-320.2 597.8-597.8 0-9.2-0.2-18.2-0.6-27.2 41-29.4 76.6-66.4 104.8-108.6z"
-                ></path>
-              </svg>
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>FT website</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta charset="utf-8" />
+    <meta property="twitter:card" content="summary_large_image" />
+
+    <style data-tag="reset-style-sheet">
+      html {  line-height: 1.15;}body {  margin: 0;}* {  box-sizing: border-box;  border-width: 0;  border-style: solid;}p,li,ul,pre,div,h1,h2,h3,h4,h5,h6,figure,blockquote,figcaption {  margin: 0;  padding: 0;}button {  background-color: transparent;}button,input,optgroup,select,textarea {  font-family: inherit;  font-size: 100%;  line-height: 1.15;  margin: 0;}button,select {  text-transform: none;}button,[type="button"],[type="reset"],[type="submit"] {  -webkit-appearance: button;}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {  border-style: none;  padding: 0;}button:-moz-focus,[type="button"]:-moz-focus,[type="reset"]:-moz-focus,[type="submit"]:-moz-focus {  outline: 1px dotted ButtonText;}a {  color: inherit;  text-decoration: inherit;}input {  padding: 2px 4px;}img {  display: block;}html { scroll-behavior: smooth  }
+    </style>
+    <style data-tag="default-style-sheet">
+      html {
+        font-family: Merriweather;
+        font-size: 16px;
+      }
+
+      body {
+        font-weight: 700;
+        font-style:normal;
+        text-decoration: none;
+        text-transform: uppercase;
+        letter-spacing: normal;
+        line-height: 1.3;
+        color: var(--dl-color-scheme-darkblue);
+        background-color: var(--dl-color-scheme-white);
+
+      }
+    </style>
+    <link
+      rel="shortcut icon"
+      href="public/ft_favicon.png"
+      type="icon/png"
+      sizes="32x32"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital,wght@0,400;1,400&amp;display=swap"
+      data-tag="font"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&amp;display=swap"
+      data-tag="font"
+    />
+    <style>
+      .services-card:hover > div{
+      background-color: #fff
+      }
+    </style>
+  </head>
+  <body>
+    <link rel="stylesheet" href="../style.css" />
+    <div>
+      <link href="./footer.css" rel="stylesheet" />
+      <footer class="footer-footer section-container">
+        <div class="footer-max-width max-content-container">
+          <div class="footer-bottom-container">
+            <div class="footer-left-side">
+              <img
+                alt="image"
+                src="https://play.teleporthq.io/static/svg/placeholders/no-image.svg"
+                class="footer-image"
+              />
+              <span class="footer-text">
+                Register for the most insightful marketing conference of Europe.
+                Over 30 speakers, 2 days full of digital marketing and social
+                media news, best practices and insights from all over the world.
+              </span>
+              <div class="footer-social-media">
+                <span class="footer-text01">Follow market1</span>
+                <div class="footer-container">
+                  <svg viewBox="0 0 1024 1024" class="footer-icon">
+                    <path
+                      d="M384 384h177.106v90.782h2.532c24.64-44.194 84.958-90.782 174.842-90.782 186.946 0 221.52 116.376 221.52 267.734v308.266h-184.61v-273.278c0-65.184-1.334-149.026-96.028-149.026-96.148 0-110.82 70.986-110.82 144.292v278.012h-184.542v-576z"
+                    ></path>
+                    <path d="M64 384h192v576h-192v-576z"></path>
+                    <path
+                      d="M256 224c0 53.019-42.981 96-96 96s-96-42.981-96-96c0-53.019 42.981-96 96-96s96 42.981 96 96z"
+                    ></path></svg
+                  ><svg viewBox="0 0 1024 1024" class="footer-icon04">
+                    <path
+                      d="M512 92.2c136.8 0 153 0.6 206.8 3 50 2.2 77 10.6 95 17.6 23.8 9.2 41 20.4 58.8 38.2 18 18 29 35 38.4 58.8 7 18 15.4 45.2 17.6 95 2.4 54 3 70.2 3 206.8s-0.6 153-3 206.8c-2.2 50-10.6 77-17.6 95-9.2 23.8-20.4 41-38.2 58.8-18 18-35 29-58.8 38.4-18 7-45.2 15.4-95 17.6-54 2.4-70.2 3-206.8 3s-153-0.6-206.8-3c-50-2.2-77-10.6-95-17.6-23.8-9.2-41-20.4-58.8-38.2-18-18-29-35-38.4-58.8-7-18-15.4-45.2-17.6-95-2.4-54-3-70.2-3-206.8s0.6-153 3-206.8c2.2-50 10.6-77 17.6-95 9.2-23.8 20.4-41 38.2-58.8 18-18 35-29 58.8-38.4 18-7 45.2-15.4 95-17.6 53.8-2.4 70-3 206.8-3zM512 0c-139 0-156.4 0.6-211 3-54.4 2.4-91.8 11.2-124.2 23.8-33.8 13.2-62.4 30.6-90.8 59.2-28.6 28.4-46 57-59.2 90.6-12.6 32.6-21.4 69.8-23.8 124.2-2.4 54.8-3 72.2-3 211.2s0.6 156.4 3 211c2.4 54.4 11.2 91.8 23.8 124.2 13.2 33.8 30.6 62.4 59.2 90.8 28.4 28.4 57 46 90.6 59 32.6 12.6 69.8 21.4 124.2 23.8 54.6 2.4 72 3 211 3s156.4-0.6 211-3c54.4-2.4 91.8-11.2 124.2-23.8 33.6-13 62.2-30.6 90.6-59s46-57 59-90.6c12.6-32.6 21.4-69.8 23.8-124.2 2.4-54.6 3-72 3-211s-0.6-156.4-3-211c-2.4-54.4-11.2-91.8-23.8-124.2-12.6-34-30-62.6-58.6-91-28.4-28.4-57-46-90.6-59-32.6-12.6-69.8-21.4-124.2-23.8-54.8-2.6-72.2-3.2-211.2-3.2v0z"
+                    ></path>
+                    <path
+                      d="M512 249c-145.2 0-263 117.8-263 263s117.8 263 263 263 263-117.8 263-263c0-145.2-117.8-263-263-263zM512 682.6c-94.2 0-170.6-76.4-170.6-170.6s76.4-170.6 170.6-170.6c94.2 0 170.6 76.4 170.6 170.6s-76.4 170.6-170.6 170.6z"
+                    ></path>
+                    <path
+                      d="M846.8 238.6c0 33.91-27.49 61.4-61.4 61.4s-61.4-27.49-61.4-61.4c0-33.91 27.49-61.4 61.4-61.4s61.4 27.49 61.4 61.4z"
+                    ></path></svg
+                  ><svg viewBox="0 0 1024 1024" class="footer-icon08">
+                    <path
+                      d="M920.021 283.179c12.245 65.237 19.115 140.587 18.645 218.667 0.811 65.195-5.248 139.392-18.645 214.229-2.432 8.875-6.4 17.195-11.605 24.533-9.685 13.696-23.808 24.107-40.491 28.8-25.771 6.869-91.989 11.733-165.419 14.549-95.147 3.669-190.507 3.669-190.507 3.669s-95.36 0-190.507-3.627c-73.429-2.816-139.648-7.637-164.949-14.421-8.747-2.432-16.896-6.315-24.149-11.435-13.269-9.387-23.509-22.869-28.587-39.381-12.16-65.109-18.944-140.203-18.475-218.027-0.896-65.707 5.163-140.459 18.645-215.893 2.432-8.875 6.4-17.195 11.605-24.533 9.685-13.696 23.808-24.107 40.491-28.8 25.771-6.869 91.989-11.733 165.419-14.549 95.147-3.627 190.507-3.627 190.507-3.627s95.36 0 190.549 3.328c73.344 2.56 140.032 6.955 164.523 12.928 9.344 2.688 17.963 7.040 25.515 12.757 13.099 9.899 22.955 23.936 27.435 40.875zM1003.093 263.552c-9.259-36.949-30.635-67.84-59.008-89.301-15.915-12.032-33.963-21.077-53.291-26.667-38.315-9.387-115.029-13.781-185.259-16.213-96.725-3.371-193.536-3.371-193.536-3.371s-96.939 0-193.749 3.712c-70.059 2.688-147.2 7.467-184.192 17.365-37.291 10.539-67.456 32.853-88.064 61.867-11.52 16.256-20.011 34.603-25.045 54.101-0.256 1.024-0.469 2.091-0.64 3.029-14.635 80.981-21.291 161.835-20.309 233.856-0.512 82.091 6.869 163.456 20.352 234.752 0.256 1.323 0.555 2.645 0.896 3.755 10.453 36.693 32.853 66.859 61.909 87.381 15.232 10.752 32.299 18.859 50.389 23.936 37.504 10.027 114.603 14.805 184.661 17.493 96.853 3.712 193.792 3.712 193.792 3.712s96.939 0 193.749-3.712c70.059-2.688 147.157-7.467 184.192-17.365 37.248-10.539 67.456-32.853 88.021-61.867 11.52-16.256 20.053-34.603 25.045-54.059 0.256-1.067 0.512-2.133 0.64-3.029 14.507-80.384 21.163-160.64 20.309-232.107 0.512-82.133-6.869-163.541-20.352-234.837-0.171-0.853-0.341-1.707-0.512-2.432zM458.667 567.509v-132.352l116.352 66.176zM437.077 677.931l245.333-139.52c20.48-11.648 27.648-37.717 16-58.197-3.968-6.997-9.643-12.459-16-16l-245.333-139.52c-20.48-11.648-46.549-4.48-58.197 16-3.84 6.741-5.632 14.080-5.589 21.077v279.040c0 23.552 19.115 42.667 42.667 42.667 7.765 0 15.019-2.091 21.077-5.589z"
+                    ></path></svg
+                  ><svg viewBox="0 0 1024 1024" class="footer-icon10">
+                    <path
+                      d="M1024 226.4c-37.6 16.8-78.2 28-120.6 33 43.4-26 76.6-67.2 92.4-116.2-40.6 24-85.6 41.6-133.4 51-38.4-40.8-93-66.2-153.4-66.2-116 0-210 94-210 210 0 16.4 1.8 32.4 5.4 47.8-174.6-8.8-329.4-92.4-433-219.6-18 31-28.4 67.2-28.4 105.6 0 72.8 37 137.2 93.4 174.8-34.4-1-66.8-10.6-95.2-26.2 0 0.8 0 1.8 0 2.6 0 101.8 72.4 186.8 168.6 206-17.6 4.8-36.2 7.4-55.4 7.4-13.6 0-26.6-1.4-39.6-3.8 26.8 83.4 104.4 144.2 196.2 146-72 56.4-162.4 90-261 90-17 0-33.6-1-50.2-3 93.2 59.8 203.6 94.4 322.2 94.4 386.4 0 597.8-320.2 597.8-597.8 0-9.2-0.2-18.2-0.6-27.2 41-29.4 76.6-66.4 104.8-108.6z"
+                    ></path>
+                  </svg>
+                </div>
+              </div>
+            </div>
+            <div class="footer-links">
+              <div class="footer-container1">
+                <span class="footer-text02">Product</span>
+                <span class="footer-link">ABOUT</span>
+                <span class="footer-link">Agenda</span>
+                <span class="footer-link">Register</span>
+                <span class="footer-link">Speakers</span>
+                <span class="footer-link">Location</span>
+                <span class="footer-text08 footer-link">Workshops</span>
+              </div>
+              <div class="footer-container2">
+                <span class="footer-text09">
+                  <span>Contact</span>
+                  <br />
+                  <span></span>
+                </span>
+                <span class="footer-link">contact us</span>
+                <span class="footer-link">Sponsorship</span>
+                <span class="footer-link">become a speaker</span>
+                <span class="footer-link">partnerships</span>
+                <span class="footer-text16 footer-link">sales</span>
+              </div>
             </div>
           </div>
-        </div>
-        <div class="footer-links">
-          <div class="footer-container1">
-            <span class="footer-text02">Product</span>
-            <span class="footer-link">ABOUT</span>
-            <span class="footer-link">Agenda</span>
-            <span class="footer-link">Register</span>
-            <span class="footer-link">Speakers</span>
-            <span class="footer-link">Location</span>
-            <span class="footer-text08 footer-link">Workshops</span>
-          </div>
-          <div class="footer-container2">
-            <span class="footer-text09">
-              <span>Contact</span>
-              <br />
-              <span></span>
+          <div class="footer-copyright">
+            <span class="footer-text17">
+              <span>
+                <span>© All rights reserved</span>
+                <span></span>
+              </span>
+              <a
+                href="https://www.teleporthq.io"
+                target="_blank"
+                rel="noreferrer noopener"
+              >
+                <span class="footer-text21">@TeleportHQ.</span>
+              </a>
+              <span>
+                <span>Powered by</span>
+                <span></span>
+              </span>
+              <a
+                href="https://www.vercel.com"
+                target="_blank"
+                rel="noreferrer noopener"
+              >
+                <span class="footer-text25">Vercel</span>
+              </a>
+              <span>
+                <span>. Image source:</span>
+                <span></span>
+              </span>
+              <a
+                href="https://www.unsplash.com"
+                target="_blank"
+                rel="noreferrer noopener"
+              >
+                <span class="footer-text29">Unsplash</span>
+              </a>
+              <span>.</span>
             </span>
-            <span class="footer-link">contact us</span>
-            <span class="footer-link">Sponsorship</span>
-            <span class="footer-link">become a speaker</span>
-            <span class="footer-link">partnerships</span>
-            <span class="footer-text16 footer-link">sales</span>
           </div>
         </div>
-      </div>
-      <div class="footer-copyright">
-        <span class="footer-text17">
-          <span>
-            <span>© All rights reserved</span>
-            <span></span>
-          </span>
-          <a
-            href="https://www.teleporthq.io"
-            target="_blank"
-            rel="noreferrer noopener"
-          >
-            <span class="footer-text21">@TeleportHQ.</span>
-          </a>
-          <span>
-            <span>Powered by</span>
-            <span></span>
-          </span>
-          <a
-            href="https://www.vercel.com"
-            target="_blank"
-            rel="noreferrer noopener"
-          >
-            <span class="footer-text25">Vercel</span>
-          </a>
-          <span>
-            <span>. Image source:</span>
-            <span></span>
-          </span>
-          <a
-            href="https://www.unsplash.com"
-            target="_blank"
-            rel="noreferrer noopener"
-          >
-            <span class="footer-text29">Unsplash</span>
-          </a>
-          <span>.</span>
-        </span>
-      </div>
+      </footer>
     </div>
-  </footer>
-</div>
+    <script src="https://unpkg.com/@teleporthq/teleport-custom-scripts"></script>
+    <script>
+      window.onload = () => {
+        const runAllScripts = () => {
+          initializeAllSliders();
+        };
+
+        const listenForUrlChanges = () => {
+          let url = location.href;
+          document.body.addEventListener(
+            "click",
+            () => {
+              requestAnimationFrame(() => {
+                if (url !== location.href) {
+                  runAllScripts();
+                  url = location.href;
+                }
+              });
+            },
+            true
+          );
+        };
+
+        const initializeAllSliders = () => {
+          const allSliders = document.querySelectorAll('[data-type="slider"]');
+          allSliders.forEach((slider) => {
+            initializeSlider(slider);
+          });
+        };
+
+        const initializeSlider = (slider) => {
+          const slides = slider.querySelectorAll('[data-type="slide"]');
+          const middle = Math.ceil(slides.length / 2);
+          let currentSlide = middle;
+
+          const nextSlideBtns = document.querySelectorAll(
+            '[data-action="nextSlide"]'
+          );
+          const previousSlideBtns = document.querySelectorAll(
+            '[data-action="previousSlide"]'
+          );
+
+          const changeSlide = (slideIndex, action) => {
+            currentSlide = slideIndex;
+
+            switch (action) {
+              case "next":
+                slideIndex === slides.length
+                  ? (currentSlide = 1)
+                  : currentSlide++;
+                break;
+              case "previous":
+                slideIndex === 1
+                  ? (currentSlide = slides.length)
+                  : currentSlide--;
+            }
+
+            const slide = slides[0];
+            if (!slide) {
+              console.error("No slides present");
+              return;
+            }
+            const style = window.getComputedStyle(slide);
+            slideWidth =
+              parseInt(style.width) +
+              parseInt(style.marginLeft) +
+              parseInt(style.marginRight);
+            const transformValue = -slideWidth * (currentSlide - middle);
+
+            slider.style.transform = `translateX(${transformValue}px)`;
+          };
+
+          previousSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "previous")
+            );
+          });
+
+          nextSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "next")
+            );
+          });
+        };
+
+        runAllScripts();
+      };
+    </script>
+  </body>
+</html>
diff --git a/components/navigation-links.html b/components/navigation-links.html
index 19c7d6b..00b1167 100644
--- a/components/navigation-links.html
+++ b/components/navigation-links.html
@@ -1,14 +1,163 @@
-<div>
-  <link href="./navigation-links.css" rel="stylesheet" />
-  <nav class="navigation-links-nav">
-    <a href="index.html" class="navigation-links-navlink Navigation-Link">
-      <span>HOME</span>
-    </a>
-    <a href="get-a-copy.html" class="navigation-links-navlink1 Navigation-Link">
-      <span>GET A COPY</span>
-    </a>
-    <a href="contact.html" class="navigation-links-navlink2 Navigation-Link">
-      <span>CONTACT</span>
-    </a>
-  </nav>
-</div>
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>FT website</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta charset="utf-8" />
+    <meta property="twitter:card" content="summary_large_image" />
+
+    <style data-tag="reset-style-sheet">
+      html {  line-height: 1.15;}body {  margin: 0;}* {  box-sizing: border-box;  border-width: 0;  border-style: solid;}p,li,ul,pre,div,h1,h2,h3,h4,h5,h6,figure,blockquote,figcaption {  margin: 0;  padding: 0;}button {  background-color: transparent;}button,input,optgroup,select,textarea {  font-family: inherit;  font-size: 100%;  line-height: 1.15;  margin: 0;}button,select {  text-transform: none;}button,[type="button"],[type="reset"],[type="submit"] {  -webkit-appearance: button;}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {  border-style: none;  padding: 0;}button:-moz-focus,[type="button"]:-moz-focus,[type="reset"]:-moz-focus,[type="submit"]:-moz-focus {  outline: 1px dotted ButtonText;}a {  color: inherit;  text-decoration: inherit;}input {  padding: 2px 4px;}img {  display: block;}html { scroll-behavior: smooth  }
+    </style>
+    <style data-tag="default-style-sheet">
+      html {
+        font-family: Merriweather;
+        font-size: 16px;
+      }
+
+      body {
+        font-weight: 700;
+        font-style:normal;
+        text-decoration: none;
+        text-transform: uppercase;
+        letter-spacing: normal;
+        line-height: 1.3;
+        color: var(--dl-color-scheme-darkblue);
+        background-color: var(--dl-color-scheme-white);
+
+      }
+    </style>
+    <link
+      rel="shortcut icon"
+      href="public/ft_favicon.png"
+      type="icon/png"
+      sizes="32x32"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital,wght@0,400;1,400&amp;display=swap"
+      data-tag="font"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&amp;display=swap"
+      data-tag="font"
+    />
+    <style>
+      .services-card:hover > div{
+      background-color: #fff
+      }
+    </style>
+  </head>
+  <body>
+    <link rel="stylesheet" href="../style.css" />
+    <div>
+      <link href="./navigation-links.css" rel="stylesheet" />
+      <nav class="navigation-links-nav">
+        <a href="index.html" class="navigation-links-navlink Navigation-Link">
+          <span>HOME</span>
+        </a>
+        <a
+          href="get-a-copy.html"
+          class="navigation-links-navlink1 Navigation-Link"
+        >
+          <span>GET A COPY</span>
+        </a>
+        <a
+          href="contact.html"
+          class="navigation-links-navlink2 Navigation-Link"
+        >
+          <span>CONTACT</span>
+        </a>
+      </nav>
+    </div>
+    <script src="https://unpkg.com/@teleporthq/teleport-custom-scripts"></script>
+    <script>
+      window.onload = () => {
+        const runAllScripts = () => {
+          initializeAllSliders();
+        };
+
+        const listenForUrlChanges = () => {
+          let url = location.href;
+          document.body.addEventListener(
+            "click",
+            () => {
+              requestAnimationFrame(() => {
+                if (url !== location.href) {
+                  runAllScripts();
+                  url = location.href;
+                }
+              });
+            },
+            true
+          );
+        };
+
+        const initializeAllSliders = () => {
+          const allSliders = document.querySelectorAll('[data-type="slider"]');
+          allSliders.forEach((slider) => {
+            initializeSlider(slider);
+          });
+        };
+
+        const initializeSlider = (slider) => {
+          const slides = slider.querySelectorAll('[data-type="slide"]');
+          const middle = Math.ceil(slides.length / 2);
+          let currentSlide = middle;
+
+          const nextSlideBtns = document.querySelectorAll(
+            '[data-action="nextSlide"]'
+          );
+          const previousSlideBtns = document.querySelectorAll(
+            '[data-action="previousSlide"]'
+          );
+
+          const changeSlide = (slideIndex, action) => {
+            currentSlide = slideIndex;
+
+            switch (action) {
+              case "next":
+                slideIndex === slides.length
+                  ? (currentSlide = 1)
+                  : currentSlide++;
+                break;
+              case "previous":
+                slideIndex === 1
+                  ? (currentSlide = slides.length)
+                  : currentSlide--;
+            }
+
+            const slide = slides[0];
+            if (!slide) {
+              console.error("No slides present");
+              return;
+            }
+            const style = window.getComputedStyle(slide);
+            slideWidth =
+              parseInt(style.width) +
+              parseInt(style.marginLeft) +
+              parseInt(style.marginRight);
+            const transformValue = -slideWidth * (currentSlide - middle);
+
+            slider.style.transform = `translateX(${transformValue}px)`;
+          };
+
+          previousSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "previous")
+            );
+          });
+
+          nextSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "next")
+            );
+          });
+        };
+
+        runAllScripts();
+      };
+    </script>
+  </body>
+</html>
diff --git a/components/navigation.css b/components/navigation.css
index 22ea5d9..c8c18c6 100644
--- a/components/navigation.css
+++ b/components/navigation.css
@@ -44,6 +44,16 @@
 .navigation-navlink2:hover {
   color: var(--dl-color-scheme-brown);
 }
+.navigation-navlink3 {
+  color: #ffffff;
+  cursor: pointer;
+  transition: 0.3s;
+  margin-left: 41px;
+  text-decoration: none;
+}
+.navigation-navlink3:hover {
+  color: var(--dl-color-scheme-brown);
+}
 .navigation-root-class-name {
   background-color: #151679;
 }
@@ -53,6 +63,9 @@
 .navigation-root-class-name2 {
   background-color: #151679;
 }
+.navigation-root-class-name3 {
+  background-color: #151679;
+}
 @media(max-width: 991px) {
   .navigation-header {
     background-color: #151679;
@@ -81,6 +94,10 @@
     margin-left: 0;
     margin-bottom: var(--dl-space-space-unit);
   }
+  .navigation-navlink3 {
+    margin-left: 0;
+    margin-bottom: var(--dl-space-space-unit);
+  }
 }
 @media(max-width: 479px) {
   .navigation-header {
diff --git a/components/navigation.html b/components/navigation.html
index 3dd0c0f..023ae7f 100644
--- a/components/navigation.html
+++ b/components/navigation.html
@@ -1,16 +1,162 @@
-<div>
-  <link href="./navigation.css" rel="stylesheet" />
-  <header data-role="Header" class="navigation-header">
-    <nav class="navigation-nav">
-      <a href="index.html" class="navigation-navlink Navigation-Link">
-        <span>HOME</span>
-      </a>
-      <a href="get-a-copy.html" class="navigation-navlink1 Navigation-Link">
-        <span>GET A COPY</span>
-      </a>
-      <a href="contact.html" class="navigation-navlink2 Navigation-Link">
-        <span>CONTACT</span>
-      </a>
-    </nav>
-  </header>
-</div>
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>FT website</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta charset="utf-8" />
+    <meta property="twitter:card" content="summary_large_image" />
+
+    <style data-tag="reset-style-sheet">
+      html {  line-height: 1.15;}body {  margin: 0;}* {  box-sizing: border-box;  border-width: 0;  border-style: solid;}p,li,ul,pre,div,h1,h2,h3,h4,h5,h6,figure,blockquote,figcaption {  margin: 0;  padding: 0;}button {  background-color: transparent;}button,input,optgroup,select,textarea {  font-family: inherit;  font-size: 100%;  line-height: 1.15;  margin: 0;}button,select {  text-transform: none;}button,[type="button"],[type="reset"],[type="submit"] {  -webkit-appearance: button;}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {  border-style: none;  padding: 0;}button:-moz-focus,[type="button"]:-moz-focus,[type="reset"]:-moz-focus,[type="submit"]:-moz-focus {  outline: 1px dotted ButtonText;}a {  color: inherit;  text-decoration: inherit;}input {  padding: 2px 4px;}img {  display: block;}html { scroll-behavior: smooth  }
+    </style>
+    <style data-tag="default-style-sheet">
+      html {
+        font-family: Merriweather;
+        font-size: 16px;
+      }
+
+      body {
+        font-weight: 700;
+        font-style:normal;
+        text-decoration: none;
+        text-transform: uppercase;
+        letter-spacing: normal;
+        line-height: 1.3;
+        color: var(--dl-color-scheme-darkblue);
+        background-color: var(--dl-color-scheme-white);
+
+      }
+    </style>
+    <link
+      rel="shortcut icon"
+      href="public/ft_favicon.png"
+      type="icon/png"
+      sizes="32x32"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital,wght@0,400;1,400&amp;display=swap"
+      data-tag="font"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&amp;display=swap"
+      data-tag="font"
+    />
+    <style>
+      .services-card:hover > div{
+      background-color: #fff
+      }
+    </style>
+  </head>
+  <body>
+    <link rel="stylesheet" href="../style.css" />
+    <div>
+      <link href="./navigation.css" rel="stylesheet" />
+      <header data-role="Header" class="navigation-header">
+        <nav class="navigation-nav">
+          <a href="index.html" class="navigation-navlink Navigation-Link">
+            <span>HOME</span>
+          </a>
+          <a href="get-a-copy.html" class="navigation-navlink1 Navigation-Link">
+            <span>GET A COPY</span>
+          </a>
+          <a href="contact.html" class="navigation-navlink2 Navigation-Link">
+            <span>CONTACT</span>
+          </a>
+          <a href="advertise.html" class="navigation-navlink3 Navigation-Link">
+            <span>ADVERTISE</span>
+          </a>
+        </nav>
+      </header>
+    </div>
+    <script src="https://unpkg.com/@teleporthq/teleport-custom-scripts"></script>
+    <script>
+      window.onload = () => {
+        const runAllScripts = () => {
+          initializeAllSliders();
+        };
+
+        const listenForUrlChanges = () => {
+          let url = location.href;
+          document.body.addEventListener(
+            "click",
+            () => {
+              requestAnimationFrame(() => {
+                if (url !== location.href) {
+                  runAllScripts();
+                  url = location.href;
+                }
+              });
+            },
+            true
+          );
+        };
+
+        const initializeAllSliders = () => {
+          const allSliders = document.querySelectorAll('[data-type="slider"]');
+          allSliders.forEach((slider) => {
+            initializeSlider(slider);
+          });
+        };
+
+        const initializeSlider = (slider) => {
+          const slides = slider.querySelectorAll('[data-type="slide"]');
+          const middle = Math.ceil(slides.length / 2);
+          let currentSlide = middle;
+
+          const nextSlideBtns = document.querySelectorAll(
+            '[data-action="nextSlide"]'
+          );
+          const previousSlideBtns = document.querySelectorAll(
+            '[data-action="previousSlide"]'
+          );
+
+          const changeSlide = (slideIndex, action) => {
+            currentSlide = slideIndex;
+
+            switch (action) {
+              case "next":
+                slideIndex === slides.length
+                  ? (currentSlide = 1)
+                  : currentSlide++;
+                break;
+              case "previous":
+                slideIndex === 1
+                  ? (currentSlide = slides.length)
+                  : currentSlide--;
+            }
+
+            const slide = slides[0];
+            if (!slide) {
+              console.error("No slides present");
+              return;
+            }
+            const style = window.getComputedStyle(slide);
+            slideWidth =
+              parseInt(style.width) +
+              parseInt(style.marginLeft) +
+              parseInt(style.marginRight);
+            const transformValue = -slideWidth * (currentSlide - middle);
+
+            slider.style.transform = `translateX(${transformValue}px)`;
+          };
+
+          previousSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "previous")
+            );
+          });
+
+          nextSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "next")
+            );
+          });
+        };
+
+        runAllScripts();
+      };
+    </script>
+  </body>
+</html>
diff --git a/components/portofolio-card.css b/components/portofolio-card.css
index 5306f04..a11f825 100644
--- a/components/portofolio-card.css
+++ b/components/portofolio-card.css
@@ -33,7 +33,7 @@
   display: flex;
   opacity: 0;
   z-index: 1;
-  background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(.jpg);
+  background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),url(.jpg);
   transition: 0.3s;
   align-items: center;
   border-radius: var(--dl-radius-radius-radius8);
diff --git a/components/portofolio-card.html b/components/portofolio-card.html
index 86cb7a7..88f79e3 100644
--- a/components/portofolio-card.html
+++ b/components/portofolio-card.html
@@ -1,20 +1,163 @@
-<div>
-  <link href="./portofolio-card.css" rel="stylesheet" />
-  <div class="portofolio-card-speaker-card">
-    <div class="portofolio-card-image-container">
-      <img
-        alt="image"
-        src="https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDEwfHxwZW9wbGV8ZW58MHx8fHwxNjQzNzA1NTEx&ixlib=rb-1.2.1&w=300"
-        class="portofolio-card-image"
-      />
-      <div class="portofolio-card-see-project-container">
-        <button class="button-secondary-white button button-md">
-          See project
-        </button>
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>FT website</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta charset="utf-8" />
+    <meta property="twitter:card" content="summary_large_image" />
+
+    <style data-tag="reset-style-sheet">
+      html {  line-height: 1.15;}body {  margin: 0;}* {  box-sizing: border-box;  border-width: 0;  border-style: solid;}p,li,ul,pre,div,h1,h2,h3,h4,h5,h6,figure,blockquote,figcaption {  margin: 0;  padding: 0;}button {  background-color: transparent;}button,input,optgroup,select,textarea {  font-family: inherit;  font-size: 100%;  line-height: 1.15;  margin: 0;}button,select {  text-transform: none;}button,[type="button"],[type="reset"],[type="submit"] {  -webkit-appearance: button;}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {  border-style: none;  padding: 0;}button:-moz-focus,[type="button"]:-moz-focus,[type="reset"]:-moz-focus,[type="submit"]:-moz-focus {  outline: 1px dotted ButtonText;}a {  color: inherit;  text-decoration: inherit;}input {  padding: 2px 4px;}img {  display: block;}html { scroll-behavior: smooth  }
+    </style>
+    <style data-tag="default-style-sheet">
+      html {
+        font-family: Merriweather;
+        font-size: 16px;
+      }
+
+      body {
+        font-weight: 700;
+        font-style:normal;
+        text-decoration: none;
+        text-transform: uppercase;
+        letter-spacing: normal;
+        line-height: 1.3;
+        color: var(--dl-color-scheme-darkblue);
+        background-color: var(--dl-color-scheme-white);
+
+      }
+    </style>
+    <link
+      rel="shortcut icon"
+      href="public/ft_favicon.png"
+      type="icon/png"
+      sizes="32x32"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital,wght@0,400;1,400&amp;display=swap"
+      data-tag="font"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&amp;display=swap"
+      data-tag="font"
+    />
+    <style>
+      .services-card:hover > div{
+      background-color: #fff
+      }
+    </style>
+  </head>
+  <body>
+    <link rel="stylesheet" href="../style.css" />
+    <div>
+      <link href="./portofolio-card.css" rel="stylesheet" />
+      <div class="portofolio-card-speaker-card">
+        <div class="portofolio-card-image-container">
+          <img
+            alt="image"
+            src="https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDEwfHxwZW9wbGV8ZW58MHx8fHwxNjQzNzA1NTEx&amp;ixlib=rb-1.2.1&amp;w=300"
+            class="portofolio-card-image"
+          />
+          <div class="portofolio-card-see-project-container">
+            <button class="button-secondary-white button button-md">
+              See project
+            </button>
+          </div>
+        </div>
+        <span class="portofolio-card-first-name">
+          <span>Office Life Campaign - Boost your creativity</span>
+        </span>
       </div>
     </div>
-    <span class="portofolio-card-first-name">
-      <span>Office Life Campaign - Boost your creativity</span>
-    </span>
-  </div>
-</div>
+    <script src="https://unpkg.com/@teleporthq/teleport-custom-scripts"></script>
+    <script>
+      window.onload = () => {
+        const runAllScripts = () => {
+          initializeAllSliders();
+        };
+
+        const listenForUrlChanges = () => {
+          let url = location.href;
+          document.body.addEventListener(
+            "click",
+            () => {
+              requestAnimationFrame(() => {
+                if (url !== location.href) {
+                  runAllScripts();
+                  url = location.href;
+                }
+              });
+            },
+            true
+          );
+        };
+
+        const initializeAllSliders = () => {
+          const allSliders = document.querySelectorAll('[data-type="slider"]');
+          allSliders.forEach((slider) => {
+            initializeSlider(slider);
+          });
+        };
+
+        const initializeSlider = (slider) => {
+          const slides = slider.querySelectorAll('[data-type="slide"]');
+          const middle = Math.ceil(slides.length / 2);
+          let currentSlide = middle;
+
+          const nextSlideBtns = document.querySelectorAll(
+            '[data-action="nextSlide"]'
+          );
+          const previousSlideBtns = document.querySelectorAll(
+            '[data-action="previousSlide"]'
+          );
+
+          const changeSlide = (slideIndex, action) => {
+            currentSlide = slideIndex;
+
+            switch (action) {
+              case "next":
+                slideIndex === slides.length
+                  ? (currentSlide = 1)
+                  : currentSlide++;
+                break;
+              case "previous":
+                slideIndex === 1
+                  ? (currentSlide = slides.length)
+                  : currentSlide--;
+            }
+
+            const slide = slides[0];
+            if (!slide) {
+              console.error("No slides present");
+              return;
+            }
+            const style = window.getComputedStyle(slide);
+            slideWidth =
+              parseInt(style.width) +
+              parseInt(style.marginLeft) +
+              parseInt(style.marginRight);
+            const transformValue = -slideWidth * (currentSlide - middle);
+
+            slider.style.transform = `translateX(${transformValue}px)`;
+          };
+
+          previousSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "previous")
+            );
+          });
+
+          nextSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "next")
+            );
+          });
+        };
+
+        runAllScripts();
+      };
+    </script>
+  </body>
+</html>
diff --git a/components/services-card.html b/components/services-card.html
index 9037413..2ece48f 100644
--- a/components/services-card.html
+++ b/components/services-card.html
@@ -1,20 +1,163 @@
-<div>
-  <link href="./services-card.css" rel="stylesheet" />
-  <div class="services-card">
-    <div class="services-card-container">
-      <img
-        alt="image"
-        src="https://play.teleporthq.io/static/svg/placeholders/no-image.svg"
-        class="services-card-image"
-      />
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>FT website</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta charset="utf-8" />
+    <meta property="twitter:card" content="summary_large_image" />
+
+    <style data-tag="reset-style-sheet">
+      html {  line-height: 1.15;}body {  margin: 0;}* {  box-sizing: border-box;  border-width: 0;  border-style: solid;}p,li,ul,pre,div,h1,h2,h3,h4,h5,h6,figure,blockquote,figcaption {  margin: 0;  padding: 0;}button {  background-color: transparent;}button,input,optgroup,select,textarea {  font-family: inherit;  font-size: 100%;  line-height: 1.15;  margin: 0;}button,select {  text-transform: none;}button,[type="button"],[type="reset"],[type="submit"] {  -webkit-appearance: button;}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {  border-style: none;  padding: 0;}button:-moz-focus,[type="button"]:-moz-focus,[type="reset"]:-moz-focus,[type="submit"]:-moz-focus {  outline: 1px dotted ButtonText;}a {  color: inherit;  text-decoration: inherit;}input {  padding: 2px 4px;}img {  display: block;}html { scroll-behavior: smooth  }
+    </style>
+    <style data-tag="default-style-sheet">
+      html {
+        font-family: Merriweather;
+        font-size: 16px;
+      }
+
+      body {
+        font-weight: 700;
+        font-style:normal;
+        text-decoration: none;
+        text-transform: uppercase;
+        letter-spacing: normal;
+        line-height: 1.3;
+        color: var(--dl-color-scheme-darkblue);
+        background-color: var(--dl-color-scheme-white);
+
+      }
+    </style>
+    <link
+      rel="shortcut icon"
+      href="public/ft_favicon.png"
+      type="icon/png"
+      sizes="32x32"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital,wght@0,400;1,400&amp;display=swap"
+      data-tag="font"
+    />
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&amp;display=swap"
+      data-tag="font"
+    />
+    <style>
+      .services-card:hover > div{
+      background-color: #fff
+      }
+    </style>
+  </head>
+  <body>
+    <link rel="stylesheet" href="../style.css" />
+    <div>
+      <link href="./services-card.css" rel="stylesheet" />
+      <div class="services-card">
+        <div class="services-card-container">
+          <img
+            alt="image"
+            src="https://play.teleporthq.io/static/svg/placeholders/no-image.svg"
+            class="services-card-image"
+          />
+        </div>
+        <span class="services-card-text"><span>Website design</span></span>
+        <span class="services-card-text1">
+          <span>
+            Create your ubest unique App development, crafted for your business
+            needs.
+          </span>
+        </span>
+        <span class="services-card-text2"><span>Learn more</span></span>
+      </div>
     </div>
-    <span class="services-card-text"><span>Website design</span></span>
-    <span class="services-card-text1">
-      <span>
-        Create your ubest unique App development, crafted for your business
-        needs.
-      </span>
-    </span>
-    <span class="services-card-text2"><span>Learn more</span></span>
-  </div>
-</div>
+    <script src="https://unpkg.com/@teleporthq/teleport-custom-scripts"></script>
+    <script>
+      window.onload = () => {
+        const runAllScripts = () => {
+          initializeAllSliders();
+        };
+
+        const listenForUrlChanges = () => {
+          let url = location.href;
+          document.body.addEventListener(
+            "click",
+            () => {
+              requestAnimationFrame(() => {
+                if (url !== location.href) {
+                  runAllScripts();
+                  url = location.href;
+                }
+              });
+            },
+            true
+          );
+        };
+
+        const initializeAllSliders = () => {
+          const allSliders = document.querySelectorAll('[data-type="slider"]');
+          allSliders.forEach((slider) => {
+            initializeSlider(slider);
+          });
+        };
+
+        const initializeSlider = (slider) => {
+          const slides = slider.querySelectorAll('[data-type="slide"]');
+          const middle = Math.ceil(slides.length / 2);
+          let currentSlide = middle;
+
+          const nextSlideBtns = document.querySelectorAll(
+            '[data-action="nextSlide"]'
+          );
+          const previousSlideBtns = document.querySelectorAll(
+            '[data-action="previousSlide"]'
+          );
+
+          const changeSlide = (slideIndex, action) => {
+            currentSlide = slideIndex;
+
+            switch (action) {
+              case "next":
+                slideIndex === slides.length
+                  ? (currentSlide = 1)
+                  : currentSlide++;
+                break;
+              case "previous":
+                slideIndex === 1
+                  ? (currentSlide = slides.length)
+                  : currentSlide--;
+            }
+
+            const slide = slides[0];
+            if (!slide) {
+              console.error("No slides present");
+              return;
+            }
+            const style = window.getComputedStyle(slide);
+            slideWidth =
+              parseInt(style.width) +
+              parseInt(style.marginLeft) +
+              parseInt(style.marginRight);
+            const transformValue = -slideWidth * (currentSlide - middle);
+
+            slider.style.transform = `translateX(${transformValue}px)`;
+          };
+
+          previousSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "previous")
+            );
+          });
+
+          nextSlideBtns.forEach((btn) => {
+            btn.addEventListener("click", () =>
+              changeSlide(currentSlide, "next")
+            );
+          });
+        };
+
+        runAllScripts();
+      };
+    </script>
+  </body>
+</html>
diff --git a/contact.css b/contact.css
index ba94bc9..a86e3f1 100644
--- a/contact.css
+++ b/contact.css
@@ -44,6 +44,16 @@
 .navigation-navlink2:hover {
   color: var(--dl-color-scheme-brown);
 }
+.navigation-navlink3 {
+  color: #ffffff;
+  cursor: pointer;
+  transition: 0.3s;
+  margin-left: 41px;
+  text-decoration: none;
+}
+.navigation-navlink3:hover {
+  color: var(--dl-color-scheme-brown);
+}
 .navigation-root-class-name {
   background-color: #151679;
 }
@@ -53,6 +63,9 @@
 .navigation-root-class-name2 {
   background-color: #151679;
 }
+.navigation-root-class-name3 {
+  background-color: #151679;
+}
 @media(max-width: 991px) {
   .navigation-header {
     background-color: #151679;
@@ -81,6 +94,10 @@
     margin-left: 0;
     margin-bottom: var(--dl-space-space-unit);
   }
+  .navigation-navlink3 {
+    margin-left: 0;
+    margin-bottom: var(--dl-space-space-unit);
+  }
 }
 @media(max-width: 479px) {
   .navigation-header {
diff --git a/contact.html b/contact.html
index ab0f088..57f1d89 100644
--- a/contact.html
+++ b/contact.html
@@ -30,7 +30,7 @@
     </style>
     <link
       rel="shortcut icon"
-      href="public/playground_assets/ft_favicon.png"
+      href="public/ft_favicon.png"
       type="icon/png"
       sizes="32x32"
     />
@@ -49,9 +49,9 @@
       background-color: #fff
       }
     </style>
-    <link rel="stylesheet" href="./style.css" />
   </head>
   <body>
+    <link rel="stylesheet" href="./style.css" />
     <div>
       <link href="./contact.css" rel="stylesheet" />
 
@@ -73,6 +73,12 @@
             <a href="contact.html" class="navigation-navlink2 Navigation-Link">
               <span>CONTACT</span>
             </a>
+            <a
+              href="advertise.html"
+              class="navigation-navlink3 Navigation-Link"
+            >
+              <span>ADVERTISE</span>
+            </a>
           </nav>
         </header>
         <main class="contact-main">
@@ -134,7 +140,7 @@
           </span>
           <img
             alt="image"
-            src="public/playground_assets/foxacid-300h.png"
+            src="public/foxacid-300h.png"
             class="contact-image"
           />
         </div>
@@ -234,6 +240,5 @@
         runAllScripts();
       };
     </script>
-    <script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
   </body>
 </html>
diff --git a/index.css b/index.css
new file mode 100644
index 0000000..fa5ba34
--- /dev/null
+++ b/index.css
@@ -0,0 +1,204 @@
+.navigation-header {
+  top: 0;
+  width: 100%;
+  display: flex;
+  z-index: 100;
+  position: fixed;
+  align-items: center;
+  justify-content: flex-start;
+  background-color: #151679;
+}
+.navigation-nav {
+  flex: 0 0 auto;
+  display: flex;
+  align-items: center;
+  padding-left: var(--dl-space-space-oneandhalfunits);
+  flex-direction: row;
+}
+.navigation-navlink {
+  color: #ffffff;
+  cursor: pointer;
+  transition: 0.3s;
+  text-decoration: none;
+}
+.navigation-navlink:hover {
+  color: var(--dl-color-scheme-brown);
+}
+.navigation-navlink1 {
+  color: #ffffff;
+  cursor: pointer;
+  transition: 0.3s;
+  margin-left: 41px;
+  text-decoration: none;
+}
+.navigation-navlink1:hover {
+  color: var(--dl-color-scheme-brown);
+}
+.navigation-navlink2 {
+  color: #ffffff;
+  cursor: pointer;
+  transition: 0.3s;
+  margin-left: 41px;
+  text-decoration: none;
+}
+.navigation-navlink2:hover {
+  color: var(--dl-color-scheme-brown);
+}
+.navigation-navlink3 {
+  color: #ffffff;
+  cursor: pointer;
+  transition: 0.3s;
+  margin-left: 41px;
+  text-decoration: none;
+}
+.navigation-navlink3:hover {
+  color: var(--dl-color-scheme-brown);
+}
+.navigation-root-class-name {
+  background-color: #151679;
+}
+.navigation-root-class-name1 {
+  background-color: #151679;
+}
+.navigation-root-class-name2 {
+  background-color: #151679;
+}
+.navigation-root-class-name3 {
+  background-color: #151679;
+}
+@media(max-width: 991px) {
+  .navigation-header {
+    background-color: #151679;
+  }
+  .navigation-nav {
+    padding-left: var(--dl-space-space-oneandhalfunits);
+  }
+}
+@media(max-width: 767px) {
+  .navigation-header {
+    background-color: #151679;
+  }
+  .navigation-nav {
+    align-items: flex-start;
+    padding-left: var(--dl-space-space-oneandhalfunits);
+    flex-direction: column;
+  }
+  .navigation-navlink {
+    margin-bottom: var(--dl-space-space-unit);
+  }
+  .navigation-navlink1 {
+    margin-left: 0;
+    margin-bottom: var(--dl-space-space-unit);
+  }
+  .navigation-navlink2 {
+    margin-left: 0;
+    margin-bottom: var(--dl-space-space-unit);
+  }
+  .navigation-navlink3 {
+    margin-left: 0;
+    margin-bottom: var(--dl-space-space-unit);
+  }
+}
+@media(max-width: 479px) {
+  .navigation-header {
+    background-color: #151679;
+  }
+  .navigation-nav {
+    align-items: flex-start;
+    padding-left: var(--dl-space-space-oneandhalfunits);
+  }
+}
+
+.home-container {
+  width: 100%;
+  display: flex;
+  position: relative;
+  min-height: 100vh;
+  overflow-x: hidden;
+  align-items: center;
+  flex-direction: column;
+  background-color: #151679;
+}
+.home-main {
+  flex: 0 0 auto;
+  width: 100%;
+  border: 2px dashed rgba(120, 120, 120, 0.4);
+  height: 100px;
+  display: flex;
+  align-items: flex-start;
+  border-color: var(--dl-color-scheme-white);
+  border-width: 0px;
+  flex-direction: column;
+  justify-content: center;
+}
+.home-image {
+  width: 448px;
+  height: 406px;
+  object-fit: cover;
+}
+.home-container1 {
+  flex: 0 0 auto;
+  width: 100%;
+  height: auto;
+  display: flex;
+  align-items: flex-start;
+  padding-top: var(--dl-space-space-sixunits);
+  justify-content: center;
+}
+.home-container2 {
+  flex: 0 0 auto;
+  width: 464px;
+  height: auto;
+  display: flex;
+  align-items: flex-end;
+  border-color: rgba(120, 120, 120, 0.4);
+  border-style: dashed;
+  border-width: 0px;
+  flex-direction: column;
+}
+.home-container3 {
+  flex: 0 0 auto;
+  width: 464px;
+  height: auto;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+}
+.home-text {
+  color: rgb(255, 255, 255);
+  align-self: flex-start;
+  padding-left: var(--dl-space-space-oneandhalfunits);
+}
+.home-container4 {
+  width: 464px;
+  align-self: flex-end;
+  margin-left: var(--dl-space-space-sixunits);
+}
+.home-container5 {
+  display: contents;
+}
+@media(max-width: 991px) {
+  .home-image {
+    width: auto;
+    height: auto;
+  }
+}
+@media(max-width: 767px) {
+  .home-image {
+    margin-top: 0px;
+  }
+}
+@media(max-width: 479px) {
+  .home-container1 {
+    width: 100%;
+  }
+  .home-container3 {
+    width: 100%;
+  }
+  .home-container4 {
+    width: auto;
+    align-self: flex-end;
+    padding-left: var(--dl-space-space-unit);
+    padding-right: var(--dl-space-space-unit);
+  }
+}
diff --git a/index.html b/index.html
index 5e25e08..b4b299c 100644
--- a/index.html
+++ b/index.html
@@ -30,7 +30,7 @@
     </style>
     <link
       rel="shortcut icon"
-      href="public/playground_assets/ft_favicon.png"
+      href="public/ft_favicon.png"
       type="icon/png"
       sizes="32x32"
     />
@@ -49,15 +49,11 @@
       background-color: #fff
       }
     </style>
-    <link rel="stylesheet" href="./style.css" />
   </head>
   <body>
+    <link rel="stylesheet" href="./style.css" />
     <div>
-      <link href="./home.css" rel="stylesheet" />
-      <script
-        type="text/javascript"
-        src="https://unpkg.com/dangerous-html@0.1.11/dist/default/lib.umd.js"
-      ></script>
+      <link href="./index.css" rel="stylesheet" />
 
       <div class="home-container">
         <header
@@ -77,61 +73,111 @@
             <a href="contact.html" class="navigation-navlink2 Navigation-Link">
               <span>CONTACT</span>
             </a>
+            <a
+              href="advertise.html"
+              class="navigation-navlink3 Navigation-Link"
+            >
+              <span>ADVERTISE</span>
+            </a>
           </nav>
         </header>
         <main class="home-main"></main>
         <img
           alt="image"
-          src="public/playground_assets/4lqb1xar8kvqci1ighcjoyxc9fhkrij3nigcxbon-500h.png"
+          src="public/4lqb1xar8kvqci1ighcjoyxc9fhkrij3nigcxbon-500h.png"
           class="home-image"
         />
         <div class="home-container1">
           <div class="home-container2"></div>
           <div class="home-container3">
             <span class="home-text">FOOL TIDE NEWSLETTER&nbsp;</span>
-            <div class="home-div">
-              <dangerous-html
-                html="<!-- Begin Mailchimp Signup Form -->
-<link href='//cdn-images.mailchimp.com/embedcode/classic-071822.css' rel='stylesheet' type='text/css'>
-<style type='text/css'>
-	/* Add your own Mailchimp form style overrides in your site stylesheet or in this style block.
-	   We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
-    
-    #mc-embedded-subscribe { background-color: #3333ff !important; }
-    #mc-embedded-subscribe:hover { background-color: #000066 !important; }
-</style>
-<div id='mc_embed_signup'>
-
-    <form action='https://gmail.us21.list-manage.com/subscribe/post?u=91d63f6b4854567175146bb7a&amp;id=c833c9da06&amp;f_id=0079d5e1f0' method='post' id='mc-embedded-subscribe-form' name='mc-embedded-subscribe-form' class='validate' target='_blank' novalidate>
-        <div id='mc_embed_signup_scroll'>
-
-
-              
-              
-              
-
-<div class='mc-field-group'>
-
-	<input type='email' value='email @ email' name='EMAIL' class='required email' id='mce-EMAIL' required>
-	<span id='mce-EMAIL-HELPERTEXT' class='helper_text'></span>
-</div>
-	<div id='mce-responses' class='clear foot'>
-		<div class='response' id='mce-error-response' style='display:none'></div>
-		<div class='response' id='mce-success-response' style='display:none'></div>
-        
-	</div>    <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
-    <div style='position: absolute; left: -5000px;' aria-hidden='true'><input type='text' name='b_91d63f6b4854567175146bb7a_c833c9da06' tabindex='-1' value=''></div>
-        <div class='optionalParent'>
-            <div class='clear foot'>
-                <input type='submit' value='SUBSCRIBE' name='subscribe' id='mc-embedded-subscribe' class='button'>
-            </div>
-        </div>
-    </div>
-</form>
-</div>
-<script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script><script type='text/javascript'>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';fnames[3]='ADDRESS';ftypes[3]='address';fnames[4]='PHONE';ftypes[4]='phone';fnames[5]='BIRTHDAY';ftypes[5]='birthday';}(jQuery));var $mcj = jQuery.noConflict(true);</script>
-<!--End mc_embed_signup-->"
-              ></dangerous-html>
+            <div class="home-container4">
+              <div class="home-container5">
+                <!-- Begin Mailchimp Signup Form -->
+                <link
+                  href="//cdn-images.mailchimp.com/embedcode/classic-071822.css"
+                  rel="stylesheet"
+                  type="text/css"
+                />
+                <style type="text/css">
+                  /* Add your own Mailchimp form style overrides in your site stylesheet or in this style block.
+                     We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
+
+                     #mc-embedded-subscribe { background-color: #3333ff !important; }
+                     #mc-embedded-subscribe:hover { background-color: #000066 !important; }
+                </style>
+                <div id="mc_embed_signup">
+                  <form
+                    action="https://gmail.us21.list-manage.com/subscribe/post?u=91d63f6b4854567175146bb7a&amp;id=c833c9da06&amp;f_id=0079d5e1f0"
+                    method="post"
+                    id="mc-embedded-subscribe-form"
+                    name="mc-embedded-subscribe-form"
+                    class="validate"
+                    target="_blank"
+                    novalidate=""
+                  >
+                    <div id="mc_embed_signup_scroll">
+                      <div class="mc-field-group">
+                        <input
+                          type="email"
+                          value="email @ email"
+                          name="EMAIL"
+                          class="required email"
+                          id="mce-EMAIL"
+                          required=""
+                        />
+                        <span
+                          id="mce-EMAIL-HELPERTEXT"
+                          class="helper_text"
+                        ></span>
+                      </div>
+                      <div id="mce-responses" class="clear foot">
+                        <div
+                          class="response"
+                          id="mce-error-response"
+                          style="display:none"
+                        ></div>
+                        <div
+                          class="response"
+                          id="mce-success-response"
+                          style="display:none"
+                        ></div>
+                      </div>
+                      <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
+                      <div
+                        style="position: absolute; left: -5000px;"
+                        aria-hidden="true"
+                      >
+                        <input
+                          type="text"
+                          name="b_91d63f6b4854567175146bb7a_c833c9da06"
+                          tabindex="-1"
+                          value=""
+                        />
+                      </div>
+                      <div class="optionalParent">
+                        <div class="clear foot">
+                          <input
+                            type="submit"
+                            value="SUBSCRIBE"
+                            name="subscribe"
+                            id="mc-embedded-subscribe"
+                            class="button"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </form>
+                </div>
+                <script
+                  type="text/javascript"
+                  src="//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js"
+                ></script>
+                <script type="text/javascript">
+                  (function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';fnames[3]='ADDRESS';ftypes[3]='address';fnames[4]='PHONE';ftypes[4]='phone';fnames[5]='BIRTHDAY';ftypes[5]='birthday';}(jQuery));var $mcj = jQuery.noConflict(true);
+                </script>
+                <!--End mc_embed_signup-->
+              </div>
             </div>
           </div>
         </div>
@@ -225,6 +271,5 @@
         runAllScripts();
       };
     </script>
-    <script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
   </body>
 </html>
diff --git a/package.json b/package.json
index 798face..cbec27d 100644
--- a/package.json
+++ b/package.json
@@ -3,8 +3,7 @@
   "version": "1.0.0",
   "private": true,
   "dependencies": {
-    "parcel-bundler": "^1.6.1",
-    "dangerous-html": "0.1.11"
+    "parcel-bundler": "^1.6.1"
   },
   "scripts": {},
   "devDependencies": {}
diff --git a/page.css b/page.css
index db77913..e691976 100644
--- a/page.css
+++ b/page.css
@@ -6,3 +6,6 @@
   align-items: center;
   flex-direction: column;
 }
+.page-container2 {
+  display: contents;
+}
diff --git a/page.html b/page.html
index d5cca59..15bc7f9 100644
--- a/page.html
+++ b/page.html
@@ -30,7 +30,7 @@
     </style>
     <link
       rel="shortcut icon"
-      href="public/playground_assets/ft_favicon.png"
+      href="public/ft_favicon.png"
       type="icon/png"
       sizes="32x32"
     />
@@ -49,133 +49,139 @@
       background-color: #fff
       }
     </style>
-    <link rel="stylesheet" href="./style.css" />
   </head>
   <body>
+    <link rel="stylesheet" href="./style.css" />
     <div>
-      <script
-        type="text/javascript"
-        src="https://unpkg.com/dangerous-html@0.1.11/dist/default/lib.umd.js"
-      ></script>
       <link href="./page.css" rel="stylesheet" />
 
       <div class="page-container">
         <div>
-          <dangerous-html
-            html="<div id='smart-button-container'>
-  <div style='text-align: center;'>
-    <div style='margin-bottom: 1.25rem;'>
-      <p>Number of copies:</p>
-      <select id='item-options'>
-        <option value='1 copy' price='0'>1 copy - 0 DKK</option>
-        <option value='2 copies' price='15'>2 copies - 15 DKK</option>
-        <option value='3 copies' price='30'>3 copies - 30 DKK</option>
-        <option value='4 copies' price='45'>4 copies - 45 DKK</option>
-        <option value='5 copies' price='60'>5 copies - 60 DKK</option>
-      </select>
-      <select style='visibility: hidden' id='quantitySelect'></select>
-    </div>
-    <div id='paypal-button-container'></div>
-  </div>
-</div>
-<script
-  src='https://www.paypal.com/sdk/js?client-id=AfobipCYQS_LpA-Zlzvyc7S8d3ioerY5jTtamcpCAo3Snim9o_bNWsyVvF5p7denzUDMFE6Xkw5nNy_d&amp;enable-funding=venmo&amp;currency=DKK'
-  data-sdk-integration-source='button-factory'
-></script>
+          <div class="page-container2">
+            <div id="smart-button-container">
+              <div style="text-align: center;">
+                <div style="margin-bottom: 1.25rem;">
+                  <p>Number of copies:</p>
+                  <select id="item-options">
+                    <option value="1 copy" price="0">1 copy - 0 DKK</option>
+                    <option value="2 copies" price="15">
+                      2 copies - 15 DKK
+                    </option>
+                    <option value="3 copies" price="30">
+                      3 copies - 30 DKK
+                    </option>
+                    <option value="4 copies" price="45">
+                      4 copies - 45 DKK
+                    </option>
+                    <option value="5 copies" price="60">
+                      5 copies - 60 DKK
+                    </option>
+                  </select>
+                  <select
+                    style="visibility: hidden"
+                    id="quantitySelect"
+                  ></select>
+                </div>
+                <div id="paypal-button-container"></div>
+              </div>
+            </div>
+            <script
+              src="https://www.paypal.com/sdk/js?client-id=AfobipCYQS_LpA-Zlzvyc7S8d3ioerY5jTtamcpCAo3Snim9o_bNWsyVvF5p7denzUDMFE6Xkw5nNy_d&amp;enable-funding=venmo&amp;currency=DKK"
+              data-sdk-integration-source="button-factory"
+            ></script>
 
-<script>
-      function initPayPalButton() {
-        var shipping = 35;
-        var itemOptions = document.querySelector('#smart-button-container #item-options');
-    var quantity = parseInt();
-    var quantitySelect = document.querySelector('#smart-button-container #quantitySelect');
-    if (!isNaN(quantity)) {
-      quantitySelect.style.visibility = 'visible';
-    }
-    var orderDescription = 'Number of copies:';
-    if(orderDescription === '') {
-      orderDescription = 'Item';
-    }
-    paypal.Buttons({
-      style: {
-        shape: 'rect',
-        color: 'blue',
-        layout: 'vertical',
-        label: 'buynow',
+            <script>
+                  function initPayPalButton() {
+                    var shipping = 35;
+                    var itemOptions = document.querySelector('#smart-button-container #item-options');
+                var quantity = parseInt();
+                var quantitySelect = document.querySelector('#smart-button-container #quantitySelect');
+                if (!isNaN(quantity)) {
+                  quantitySelect.style.visibility = 'visible';
+                }
+                var orderDescription = 'Number of copies:';
+                if(orderDescription === '') {
+                  orderDescription = 'Item';
+                }
+                paypal.Buttons({
+                  style: {
+                    shape: 'rect',
+                    color: 'blue',
+                    layout: 'vertical',
+                    label: 'buynow',
 
-      },
-      createOrder: function(data, actions) {
-        var selectedItemDescription = itemOptions.options[itemOptions.selectedIndex].value;
-        var selectedItemPrice = parseFloat(itemOptions.options[itemOptions.selectedIndex].getAttribute('price'));
-        var tax = (35 === 0 || false) ? 0 : (selectedItemPrice * (parseFloat(35)/100));
-        if(quantitySelect.options.length > 0) {
-          quantity = parseInt(quantitySelect.options[quantitySelect.selectedIndex].value);
-        } else {
-          quantity = 1;
-        }
+                  },
+                  createOrder: function(data, actions) {
+                    var selectedItemDescription = itemOptions.options[itemOptions.selectedIndex].value;
+                    var selectedItemPrice = parseFloat(itemOptions.options[itemOptions.selectedIndex].getAttribute('price'));
+                    var tax = (35 === 0 || false) ? 0 : (selectedItemPrice * (parseFloat(35)/100));
+                    if(quantitySelect.options.length > 0) {
+                      quantity = parseInt(quantitySelect.options[quantitySelect.selectedIndex].value);
+                    } else {
+                      quantity = 1;
+                    }
 
-        tax *= quantity;
-        tax = Math.round(tax * 100) / 100;
-        var priceTotal = quantity * selectedItemPrice + parseFloat(shipping) + tax;
-        priceTotal = Math.round(priceTotal * 100) / 100;
-        var itemTotalValue = Math.round((selectedItemPrice * quantity) * 100) / 100;
+                    tax *= quantity;
+                    tax = Math.round(tax * 100) / 100;
+                    var priceTotal = quantity * selectedItemPrice + parseFloat(shipping) + tax;
+                    priceTotal = Math.round(priceTotal * 100) / 100;
+                    var itemTotalValue = Math.round((selectedItemPrice * quantity) * 100) / 100;
 
-        return actions.order.create({
-          purchase_units: [{
-            description: orderDescription,
-            amount: {
-              currency_code: 'DKK',
-              value: priceTotal,
-              breakdown: {
-                item_total: {
-                  currency_code: 'DKK',
-                  value: itemTotalValue,
-                },
-                shipping: {
-                  currency_code: 'DKK',
-                  value: shipping,
-                },
-                tax_total: {
-                  currency_code: 'DKK',
-                  value: tax,
-                }
-              }
-            },
-            items: [{
-              name: selectedItemDescription,
-              unit_amount: {
-                currency_code: 'DKK',
-                value: selectedItemPrice,
-              },
-              quantity: quantity
-            }]
-          }]
-        });
-      },
-      onApprove: function(data, actions) {
-        return actions.order.capture().then(function(orderData) {
+                    return actions.order.create({
+                      purchase_units: [{
+                        description: orderDescription,
+                        amount: {
+                          currency_code: 'DKK',
+                          value: priceTotal,
+                          breakdown: {
+                            item_total: {
+                              currency_code: 'DKK',
+                              value: itemTotalValue,
+                            },
+                            shipping: {
+                              currency_code: 'DKK',
+                              value: shipping,
+                            },
+                            tax_total: {
+                              currency_code: 'DKK',
+                              value: tax,
+                            }
+                          }
+                        },
+                        items: [{
+                          name: selectedItemDescription,
+                          unit_amount: {
+                            currency_code: 'DKK',
+                            value: selectedItemPrice,
+                          },
+                          quantity: quantity
+                        }]
+                      }]
+                    });
+                  },
+                  onApprove: function(data, actions) {
+                    return actions.order.capture().then(function(orderData) {
 
-          // Full available details
-          console.log('Capture result', orderData, JSON.stringify(orderData, null, 2));
+                      // Full available details
+                      console.log('Capture result', orderData, JSON.stringify(orderData, null, 2));
 
-          // Show a success message within this page, e.g.
-          const element = document.getElementById('paypal-button-container');
-          element.innerHTML = '';
-          element.innerHTML = '<h3>Thank you for your payment!</h3>';
+                      // Show a success message within this page, e.g.
+                      const element = document.getElementById('paypal-button-container');
+                      element.innerHTML = '';
+                      element.innerHTML = '<h3>Thank you for your payment!</h3>';
 
-          // Or go to another URL:  actions.redirect('thank_you.html');
+                      // Or go to another URL:  actions.redirect('thank_you.html');
 
-        });
-      },
-      onError: function(err) {
-        console.log(err);
-      },
-    }).render('#paypal-button-container');
-  }
-  initPayPalButton();
-</script>
-"
-          ></dangerous-html>
+                    });
+                  },
+                  onError: function(err) {
+                    console.log(err);
+                  },
+                }).render('#paypal-button-container');
+              }
+              initPayPalButton();
+            </script>
+          </div>
         </div>
       </div>
     </div>
@@ -267,6 +273,5 @@
         runAllScripts();
       };
     </script>
-    <script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
   </body>
 </html>
diff --git a/public/4lqb1xar8kvqci1ighcjoyxc9fhkrij3nigcxbon-500h.png b/public/4lqb1xar8kvqci1ighcjoyxc9fhkrij3nigcxbon-500h.png
new file mode 100644
index 0000000..c8ebcb5
Binary files /dev/null and b/public/4lqb1xar8kvqci1ighcjoyxc9fhkrij3nigcxbon-500h.png differ
diff --git a/public/foxacid-300h.png b/public/foxacid-300h.png
new file mode 100644
index 0000000..7ae5468
Binary files /dev/null and b/public/foxacid-300h.png differ
diff --git a/public/ft_favicon.png b/public/ft_favicon.png
new file mode 100644
index 0000000..c7cf2d1
Binary files /dev/null and b/public/ft_favicon.png differ
