diff --git a/bellissima/css/bellissima.css b/bellissima/css/bellissima.css
index 4f06e9f..00c114e 100644
--- a/bellissima/css/bellissima.css
+++ b/bellissima/css/bellissima.css
@@ -18,17 +18,17 @@ html {
 }
 
 :root {
-  --main-color: #266FF1;
+  --main-color: #266ff1;
   --white-color: #fffbfe;
   --background-color: #edf1fa;
   --secondary-color: #000000;
 
   /* Product Details Colors */
   --primary-color: #90e0ef;
-    --second-color: #00b4d5;
-    --tertiary-color: #0077b6;
-    --yellow-color: #ffb900;
-    --gray-color: #808080;
+  --second-color: #00b4d5;
+  --tertiary-color: #0077b6;
+  --yellow-color: #ffb900;
+  --gray-color: #808080;
 
   /*------- Font and typography -------*/
   --biggest-font-size: 4rem;
@@ -168,7 +168,12 @@ h3 {
 .hero__section {
   height: 100vh;
   z-index: 1;
-  background-image: linear-gradient(45deg, rgba(17, 17, 17, 0.301), rgba(0, 0, 0, 0.5)),url(../images/nature.jpg);
+  background-image: linear-gradient(
+      45deg,
+      rgba(17, 17, 17, 0.301),
+      rgba(0, 0, 0, 0.5)
+    ),
+    url(../images/nature.jpg);
   background-size: cover;
   background-position: 50% 50%;
   display: flex;
@@ -267,7 +272,7 @@ h3 {
   background: linear-gradient(to top, transparent, var(--white-color));
 }
 
-.about__contact{
+.about__contact {
   display: flex;
   flex-direction: column;
   flex-wrap: wrap;
@@ -315,7 +320,6 @@ h3 {
   border-radius: 12px;
   margin-bottom: 40px;
   overflow: hidden;
-  
 }
 
 /* This container is needed to position the front and back side */
@@ -351,7 +355,7 @@ h3 {
 
 /* Style the back side */
 .flip-card-back {
-  background: url(../images/hill-cover.png) no-repeat;
+  background: url(.https://cdn.traleor.com/hill-cover.png) no-repeat;
   /* background-color: var(--main-color); */
   background-size: cover;
   color: var(--white-color);
@@ -375,7 +379,7 @@ h3 {
   margin: 0;
   padding: 5%;
 }
-.view__more__button .btn{
+.view__more__button .btn {
   margin-top: 0;
 }
 .view__more__button h3 {
@@ -521,8 +525,8 @@ footer ul li a:hover {
   .responsive__nav {
     display: flex;
     flex-direction: column;
-     top: -600%;
-    right: 0; 
+    top: -600%;
+    right: 0;
     z-index: 1;
     width: 100%;
     height: 500%;
@@ -545,14 +549,12 @@ footer ul li a:hover {
     align-items: center;
   }
 
-
   .responsive__nav li a {
     font-size: 1.5rem;
     padding: 8px 16px;
     font-weight: bolder;
     /* border-bottom: 0.5px solid var(--main-color); */
     transition: all 0.2s ease-out;
-    
   }
 
   .responsive__nav li {
@@ -583,38 +585,35 @@ footer ul li a:hover {
     line-height: 45px;
     font-size: var(--h3-font-size);
   }
-/* ************************ABOUT SECTION****************** */
-.about__me h1{
-  font-size: var(--h3-font-size);
-}
-.about__info__inner{
-  padding-bottom: 10%;
-}
-.about__info__inner .img img{
-  width: 100%;
-  /* padding: 5%; */
- }
-.about__info__inner .text {
+  /* ************************ABOUT SECTION****************** */
+  .about__me h1 {
+    font-size: var(--h3-font-size);
+  }
+  .about__info__inner {
+    padding-bottom: 10%;
+  }
+  .about__info__inner .img img {
+    width: 100%;
+    /* padding: 5%; */
+  }
+  .about__info__inner .text {
     margin: 0;
     width: 100%;
-    
   }
   .about__info__inner .text h2 {
     text-align: right;
     margin-bottom: 5%;
     font-size: var(--h4-font-size);
-
   }
-  .about__info__inner
-  .text .text__inner h3 {
+  .about__info__inner .text .text__inner h3 {
     text-align: left;
     margin: 5% 0;
     font-size: var(--normal-font-size);
   }
-  .about__info{
+  .about__info {
     padding: 0;
   }
-  .about__info p{
+  .about__info p {
     text-align: left;
   }
   .about__info__inner img {
@@ -635,13 +634,13 @@ footer ul li a:hover {
     left: 0;
     right: 0;
   }
-  .about__contact{
+  .about__contact {
     text-align: center;
   }
-  .about__contact .btn{
+  .about__contact .btn {
     margin-top: 0;
   }
-  .about__contact .footer__socials{
+  .about__contact .footer__socials {
     margin-left: -13%;
   }
   /* *********************** CATALOG ******************* */
@@ -654,7 +653,6 @@ footer ul li a:hover {
     height: 25%;
   }
 
-
   /* ************************** CATALOG ENDS HERE ************* */
 
   /* **********************************FOOTER ********************************** */
@@ -688,11 +686,11 @@ footer ul li a:hover {
     justify-content: center;
   }
 }
-@media screen and (min-width: 700px) and (max-width:950px){
+@media screen and (min-width: 700px) and (max-width: 950px) {
   .view__more__button {
     margin-top: 15%;
   }
-  .about__contact .footer__socials{
+  .about__contact .footer__socials {
     margin-left: 0;
   }
 }
@@ -708,16 +706,16 @@ footer ul li a:hover {
     z-index: 1;
   }
 
-  .logo h1{
+  .logo h1 {
     font-size: var(--normal-font-size);
   }
-  .responsive__nav{
+  .responsive__nav {
     height: 590%;
   }
-  .responsive__nav ul{
+  .responsive__nav ul {
     padding: 0;
   }
-  .responsive__nav li{
+  .responsive__nav li {
     font-size: var(--normal-font-size);
   }
   /* **********************HERO SECTION************************ */
@@ -740,7 +738,7 @@ footer ul li a:hover {
   }
 
   /* ***********ABOUT ME ************ */
-  .about__me h1{
+  .about__me h1 {
     font-size: var(--normal-font-size);
   }
   /* **********************SECTION1************************ */
@@ -771,39 +769,39 @@ footer ul li a:hover {
     text-align: center;
   }
 
-   /* ************ FOOTER ************ */
-   .footer__container {
+  /* ************ FOOTER ************ */
+  .footer__container {
     grid-template-columns: 1fr;
     text-align: center;
     /* gap: 2rem; */
   }
 
   /* ****************CATALOG**************** */
-  .cards h2{
+  .cards h2 {
     font-size: var(--normal-font-size);
   }
-  .view__more__button h3{
+  .view__more__button h3 {
     font-size: var(--normal-font-size);
   }
   .flip-card-back .btn {
     margin-top: 40%;
     height: 25%;
   }
-  .flip-card{
+  .flip-card {
     width: 80%;
     margin-left: 10%;
   }
-  .flip-card-back h3{
+  .flip-card-back h3 {
     margin-top: 30%;
   }
-  .view__more__button .btn{
-   margin-top: 0;
-   width: 75%;
+  .view__more__button .btn {
+    margin-top: 0;
+    width: 75%;
   }
 }
 
 @media screen and (max-width: 360px) {
-  /**********************SECTION1************************ */ 
+  /**********************SECTION1************************ */
   .sec1__inner {
     flex-direction: column;
     width: 90%;
@@ -831,12 +829,11 @@ footer ul li a:hover {
   }
 }
 @media screen and (max-width: 428px) {
-
   /* *********CATALOG******* */
   .flip-card-back .btn {
     margin-top: 20%;
   }
-  /**********************SECTION1************************ */ 
+  /**********************SECTION1************************ */
   .sec1__inner {
     flex-direction: column;
     width: 90%;
@@ -877,12 +874,12 @@ footer ul li a:hover {
   .navbar .logo img {
     padding: 2% 13% 4% 12%;
   }
-   /* *********CATALOG******* */
-   .flip-card-back .btn {
+  /* *********CATALOG******* */
+  .flip-card-back .btn {
     margin-top: 45%;
   }
 
-  .cards{
+  .cards {
     padding: 0;
   }
   /* ******************************FOOTER******************** */
@@ -891,12 +888,11 @@ footer ul li a:hover {
   }
 }
 
-
 /* **********************PRODUCT DETAILS PAGE ******* */
 
 .main {
   background-color: var(--primary-color);
-  min-height:100vh;
+  min-height: 100vh;
   display: flex;
   padding: 3% 0;
   color: var(--secondary-color);
@@ -916,9 +912,9 @@ footer ul li a:hover {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   grid-template-rows: auto 1fr;
-  grid-template-areas: 
-  "images info"
-  "images description";
+  grid-template-areas:
+    "images info"
+    "images description";
   grid-gap: 35px;
 }
 
@@ -927,9 +923,9 @@ footer ul li a:hover {
   display: grid;
   grid-template-columns: repeat(3, auto);
   grid-template-rows: auto 1fr;
-  grid-template-areas: 
-  "active active active"
-  "idle idle idle";
+  grid-template-areas:
+    "active active active"
+    "idle idle idle";
   grid-gap: 5px;
 }
 
@@ -1030,53 +1026,53 @@ footer ul li a:hover {
 
 @media (max-width: 991px) {
   .box {
-      width: 750px;
-      grid-template-areas: 
+    width: 750px;
+    grid-template-areas:
       "info info"
       "images description";
   }
   .box .basic-info .options a {
-      padding: 8.5px 12px;
+    padding: 8.5px 12px;
   }
 }
 
 @media screen and (max-width: 991px) and (min-width: 769px) {
   .box .basic-info span {
-      position: absolute;
-      align-self: flex-end;
+    position: absolute;
+    align-self: flex-end;
   }
   .box .basic-info .options {
-      position: absolute;
-      align-self: flex-end;
-      margin-top: 40px;
+    position: absolute;
+    align-self: flex-end;
+    margin-top: 40px;
   }
 }
 
 @media (max-width: 768px) {
   .box {
-      width: 600px;
-      grid-template-areas: 
+    width: 600px;
+    grid-template-areas:
       "images info"
       "description description";
   }
   .box .images {
-      gap: 3px;
+    gap: 3px;
   }
   .box .images .img-holder img {
-      border-radius: 5px;
+    border-radius: 5px;
   }
 }
 
 @media (max-width: 640px) {
   .box {
-      width: 100%;
-      min-height: 100vh;
-      border-radius: 0;
-      padding: 35px;
-      margin: 0;
-      grid-template-columns: 1fr;
-      grid-template-rows: repeat(3, auto);
-      grid-template-areas: 
+    width: 100%;
+    min-height: 100vh;
+    border-radius: 0;
+    padding: 35px;
+    margin: 0;
+    grid-template-columns: 1fr;
+    grid-template-rows: repeat(3, auto);
+    grid-template-areas:
       "images"
       "info"
       "description";
diff --git a/dior/blog_index.html b/dior/blog_index.html
index 9f22e58..f341319 100644
--- a/dior/blog_index.html
+++ b/dior/blog_index.html
@@ -79,7 +79,10 @@ <h2>
         class="featured__article__wrapper flex a-j-center default-padding"
       >
         <div class="featured__article__content flex-one">
-          <img src="../media/yellow-cover.png" alt="yellow-cover" />
+          <img
+            src="https://cdn.traleor.com/yellow-cover.png"
+            alt="yellow-cover"
+          />
         </div>
         <div class="flex-one">
           <div class="featured__article__content flex flex-column">
@@ -103,7 +106,10 @@ <h2>
         <div class="blog__cards">
           <div class="blog__card">
             <a href="./blog_post.html">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </a>
             <div class="blog__card__content my-1">
               <span>Tuesday 25, 2022</span>
@@ -121,7 +127,10 @@ <h2 class="my-1">
           </div>
           <div class="blog__card">
             <a href="./blog_post.html">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </a>
             <div class="blog__card__content my-1">
               <span>Tuesday 25, 2022</span>
@@ -139,7 +148,10 @@ <h2 class="my-1">
           </div>
           <div class="blog__card">
             <a href="./blog_post.html">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </a>
             <div class="blog__card__content my-1">
               <span>Tuesday 25, 2022</span>
@@ -157,7 +169,10 @@ <h2 class="my-1">
           </div>
           <div class="blog__card">
             <a href="./blog_post.html">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </a>
             <div class="blog__card__content my-1">
               <span>Tuesday 25, 2022</span>
diff --git a/dior/blog_post.html b/dior/blog_post.html
index 278a907..6f11037 100644
--- a/dior/blog_post.html
+++ b/dior/blog_post.html
@@ -1,28 +1,36 @@
 <!DOCTYPE html>
 <html lang="en">
-
-<head>
+  <head>
     <meta charset="UTF-8" />
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Nova - Traleor Default Template</title>
-    <meta name="description"
-        content="Traleor Template Nova is derived from the Latin word `New` and is the starter template for traleor websites" />
+    <meta
+      name="description"
+      content="Traleor Template Nova is derived from the Latin word `New` and is the starter template for traleor websites"
+    />
 
     <!-- Canonical -->
-    <link rel="canonical" href="https://traleor.github.io/templates/nova/index.html" />
+    <link
+      rel="canonical"
+      href="https://traleor.github.io/templates/nova/index.html"
+    />
 
     <link rel="stylesheet" href="css/nova.css" />
     <!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.27.0/themes/prism-tomorrow.min.css" integrity="sha512-vswe+cgvic/XBoF1OcM/TeJ2FW0OofqAVdCZiEYkd6dwGXthvkSFWOoGGJgS2CW70VK5dQM5Oh+7ne47s74VTg==" crossorigin="anonymous" referrerpolicy="no-referrer" /> -->
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.27.0/themes/prism-okaidia.min.css"
-        integrity="sha512-mIs9kKbaw6JZFfSuo+MovjU+Ntggfoj8RwAmJbVXQ5mkAX5LlgETQEweFPI18humSPHymTb5iikEOKWF7I8ncQ=="
-        crossorigin="anonymous" referrerpolicy="no-referrer" />
-</head>
-
-<body>
+    <link
+      rel="stylesheet"
+      href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.27.0/themes/prism-okaidia.min.css"
+      integrity="sha512-mIs9kKbaw6JZFfSuo+MovjU+Ntggfoj8RwAmJbVXQ5mkAX5LlgETQEweFPI18humSPHymTb5iikEOKWF7I8ncQ=="
+      crossorigin="anonymous"
+      referrerpolicy="no-referrer"
+    />
+  </head>
+
+  <body>
     <div class="container">
-        <!-- NAVBAR -------------------------------------------------->
-        <nav
+      <!-- NAVBAR -------------------------------------------------->
+      <nav
         class="navbar flex fixed full-width a-j-space-between"
         role="navigation"
       >
@@ -63,68 +71,68 @@
         </ul>
       </nav>
 
-        <!-- Blog Post Wrapper --------------------------------------------->
-        <section class="blog__post__wrapper">
-            <h1 class="headline default-padding">
-                Traleor helps you create Modern and Powerful websites.
-            </h1>
-            <span class="default-padding">Tuesday 25, 2022</span>
-            <figure class="default-padding">
-                <img src="../media/yellow-cover.png" alt="hill-cover" />
-                <figcaption>Hill Cover - By <a href="">Traleor</a></figcaption>
-            </figure>
-            <div class="authors__wrapper flex default-padding">
-                <div class="author">
-                    <img src="../media/dark-cover.png" alt="author">
-                    <span><a href="#" target="_blank">John Doe</a></span>
-                </div>
-                <div class="author">
-                    <img src="../media/dark-cover.png" alt="author">
-                    <span><a href="#" target="_blank">John Doe</a></span>
-                </div>
-                <div class="author">
-                    <img src="../media/dark-cover.png" alt="author">
-                    <span><a href="#" target="_blank">John Doe</a></span>
-                </div>
-            </div>
+      <!-- Blog Post Wrapper --------------------------------------------->
+      <section class="blog__post__wrapper">
+        <h1 class="headline default-padding">
+          Traleor helps you create Modern and Powerful websites.
+        </h1>
+        <span class="default-padding">Tuesday 25, 2022</span>
+        <figure class="default-padding">
+          <img
+            src="https://cdn.traleor.com/yellow-cover.png"
+            alt="hill-cover"
+          />
+          <figcaption>Hill Cover - By <a href="">Traleor</a></figcaption>
+        </figure>
+        <div class="authors__wrapper flex default-padding">
+          <div class="author">
+            <img src="https://cdn.traleor.com/dark-cover.png" alt="author" />
+            <span><a href="#" target="_blank">John Doe</a></span>
+          </div>
+          <div class="author">
+            <img src="https://cdn.traleor.com/dark-cover.png" alt="author" />
+            <span><a href="#" target="_blank">John Doe</a></span>
+          </div>
+          <div class="author">
+            <img src="https://cdn.traleor.com/dark-cover.png" alt="author" />
+            <span><a href="#" target="_blank">John Doe</a></span>
+          </div>
+        </div>
 
+        <!------------------------------------------------------->
+        <div class="default__LR__padding">
+          <h1>Traleor templates are crafted with love to help you to build</h1>
+        </div>
+        <div class="default__LR__padding">
+          <h2>Traleor templates are crafted with love to help you to build</h2>
+        </div>
+        <div class="default__LR__padding">
+          <h3>Traleor templates are crafted with love to help you to build</h3>
+        </div>
+        <div class="default__LR__padding">
+          <h4>Traleor templates are crafted with love to help you to build</h4>
+        </div>
 
-            <!------------------------------------------------------->
-            <div class="default__LR__padding">
-                <h1>Traleor templates are crafted with love to help you to build</h1>
-            </div>
-            <div class="default__LR__padding">
-                <h2>Traleor templates are crafted with love to help you to build</h2>
-            </div>
-            <div class="default__LR__padding">
-                <h3>Traleor templates are crafted with love to help you to build</h3>
-            </div>
-            <div class="default__LR__padding">
-                <h4>Traleor templates are crafted with love to help you to build</h4>
+        <section class="text__component default-padding full-width">
+          <div class="list__block__item">
+            <div class="rich__text">
+              <h2>No Time to Waste</h2>
+              <p>
+                Sed ut perspiciatis unde omnis iste natus error sit
+                <a href="">voluptatemaccusantium</a> doloremque laudantium,
+                totam rem aperiam inventore Veritatis. Sed ut perspiciatis unde
+                omnis iste natus error sit voluptatemaccusantium doloremque
+                laudantium, totam rem aperiam inventore Veritatis. Sed ut
+                perspiciatis unde omnis iste natus error sit
+                voluptatemaccusantium doloremque laudantium, totam rem aperiam
+                inventore Veritatis.
+              </p>
             </div>
+          </div>
+        </section>
 
-            <section class="text__component default-padding full-width">
-                <div class="list__block__item">
-                    <div class="rich__text">
-                        <h2>No Time to Waste</h2>
-                        <p>
-                            Sed ut perspiciatis unde omnis iste natus error sit
-                            <a href="">voluptatemaccusantium</a> doloremque laudantium, totam
-                            rem aperiam inventore Veritatis.
-                            Sed ut perspiciatis unde omnis iste natus error sit
-                            voluptatemaccusantium doloremque laudantium, totam rem aperiam
-                            inventore Veritatis.
-                            Sed ut perspiciatis unde omnis iste natus error sit
-                            voluptatemaccusantium doloremque laudantium, totam rem aperiam
-                            inventore Veritatis.
-                        </p>
-
-                    </div>
-                </div>
-            </section>
-
-            <section class="default-padding full-width">
-                <pre>
+        <section class="default-padding full-width">
+          <pre>
                     <code class="language-css">
                         
     <!-- css -->
@@ -141,19 +149,19 @@ <h2>No Time to Waste</h2>
     }
                     </code>
                 </pre>
-            </section>
+        </section>
 
-            <section class="default-padding full-width">
-                <pre>
+        <section class="default-padding full-width">
+          <pre>
                     <code class="language-html">
     <!-- html -->
     &ltsection class="blog__cards"&gt
         &ltdiv class="list__block__item"&gt
             &ltfigure&gt
-                &ltimg src="./images/hill-cover.png" alt="hill-cover" style="width: 100%" /&gt
+                &ltimg src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover" style="width: 100%" /&gt
                 &ltfigcaption&gt
                     &lta href=""&gt
-                        &ltimg src="./images/hill-cover.png" alt="hill-cover" style="width: 100%" /&gt
+                        &ltimg src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover" style="width: 100%" /&gt
                     &lt/a&gt
                 &lt/figcaption&gt
             &lt/figure&gt
@@ -161,10 +169,10 @@ <h2>No Time to Waste</h2>
     &lt/section&gt
                     </code>
                 </pre>
-            </section>
+        </section>
 
-            <section class="default-padding full-width">
-                <pre>
+        <section class="default-padding full-width">
+          <pre>
                     <code  class="language-python">
     <!-- python -->
     class CodeBlockAdapter(StructBlockAdapter):
@@ -181,10 +189,10 @@ <h2>No Time to Waste</h2>
     register(CodeBlockAdapter(), CodeBlock)
                     </code>
                 </pre>
-            </section>
+        </section>
 
-            <section class="default-padding full-width">
-                <pre>
+        <section class="default-padding full-width">
+          <pre>
                     <code  class="language-javascript">
     <!-- js -->
     function copyLink() {
@@ -199,176 +207,197 @@ <h2>No Time to Waste</h2>
     }
                     </code>
                 </pre>
-            </section>
-
-
-            <section class="text__component default-padding full-width">
-                <div class="list__block__item">
-                    <div class="rich__text">
-                        <p>
-                            Sed ut perspiciatis unde omnis iste natus error sit
-                            <a href="">voluptatemaccusantium</a> doloremque laudantium, totam
-                            rem aperiam inventore Veritatis.
-                            Sed ut perspiciatis unde omnis iste natus error sit
-                            voluptatemaccusantium doloremque laudantium, totam rem aperiam
-                            inventore Veritatis.
-                            Sed ut perspiciatis unde omnis iste natus error sit
-                            voluptatemaccusantium doloremque laudantium, totam rem aperiam
-                            inventore Veritatis.
-                        </p>
-
-                        <!-- <img src="./images/hill-cover.png" alt="hill-cover"> -->
-                        <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/EKe8MA4K5Zk" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
-                        <h3>
-                            Sed ut perspiciatis unde omnis iste natus error sit
-                            voluptatemaccusantium doloremque laudantium, totam rem aperiam
-                            inventore Veritatis.
-                        </h3>
-                        <ul>
-                            <li>Sed ut perspiciatis unde omnis iste natus error sit
-                                voluptatemaccusantium doloremque laudantium, totam rem aperiam
-                                inventore Veritatis.
-                            </li>
-                            <li>Sed ut perspiciatis unde omnis iste natus error sit
-                                voluptatemaccusantium doloremque laudantium, totam rem aperiam
-                                inventore Veritatis.
-                            </li>
-                        </ul>
-                    </div>
-                </div>
-            </section>
-
-
-            <!-- TITLE & TEXT --------------------------------------------->
-            <section class="title__text__wrapper full-width">
-                <div class="title__text__content flex flex-column a-j-center">
-                    <h2>Sed ut perspiciatis unde omnis iste natus</h2>
-                    <h3>
-                        Sed ut perspiciatis unde omnis iste natus error sit voluptatem
-                        accusantium doloremque laudantium.
-                    </h3>
-                </div>
-            </section>
+        </section>
 
+        <section class="text__component default-padding full-width">
+          <div class="list__block__item">
+            <div class="rich__text">
+              <p>
+                Sed ut perspiciatis unde omnis iste natus error sit
+                <a href="">voluptatemaccusantium</a> doloremque laudantium,
+                totam rem aperiam inventore Veritatis. Sed ut perspiciatis unde
+                omnis iste natus error sit voluptatemaccusantium doloremque
+                laudantium, totam rem aperiam inventore Veritatis. Sed ut
+                perspiciatis unde omnis iste natus error sit
+                voluptatemaccusantium doloremque laudantium, totam rem aperiam
+                inventore Veritatis.
+              </p>
+
+              <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
+              <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/EKe8MA4K5Zk" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
+              <h3>
+                Sed ut perspiciatis unde omnis iste natus error sit
+                voluptatemaccusantium doloremque laudantium, totam rem aperiam
+                inventore Veritatis.
+              </h3>
+              <ul>
+                <li>
+                  Sed ut perspiciatis unde omnis iste natus error sit
+                  voluptatemaccusantium doloremque laudantium, totam rem aperiam
+                  inventore Veritatis.
+                </li>
+                <li>
+                  Sed ut perspiciatis unde omnis iste natus error sit
+                  voluptatemaccusantium doloremque laudantium, totam rem aperiam
+                  inventore Veritatis.
+                </li>
+              </ul>
+            </div>
+          </div>
+        </section>
 
-            <section class="default-padding full-width">
-                <div class="list__block__item">
-                    <figure>
-                        <img src="./images/hill-cover.png" alt="hill-cover" style="width: 100%" />
-                        <figcaption>Hill Cover - By <a href="">Traleor</a></figcaption>
-                    </figure>
-                </div>
-            </section>
+        <!-- TITLE & TEXT --------------------------------------------->
+        <section class="title__text__wrapper full-width">
+          <div class="title__text__content flex flex-column a-j-center">
+            <h2>Sed ut perspiciatis unde omnis iste natus</h2>
+            <h3>
+              Sed ut perspiciatis unde omnis iste natus error sit voluptatem
+              accusantium doloremque laudantium.
+            </h3>
+          </div>
+        </section>
 
+        <section class="default-padding full-width">
+          <div class="list__block__item">
+            <figure>
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="hill-cover"
+                style="width: 100%"
+              />
+              <figcaption>Hill Cover - By <a href="">Traleor</a></figcaption>
+            </figure>
+          </div>
+        </section>
 
-            <!-- BANNER --------------------------------------------->
-            <section class="banner flex a-j-center full-width default-padding">
-                <div class="banner__content flex a-j-center flex-column">
-                    <h2>Sed ut perspiciatis unde omnis iste</h2>
-                    <h3>
-                        Sed ut perspiciatis unde omnis iste natus error sit voluptatem
-                        accusantium doloremque laudantium.
-                    </h3>
-                    <a href="">
-                        <button class="secondary">Start Building</button>
-                    </a>
-                </div>
-            </section>
+        <!-- BANNER --------------------------------------------->
+        <section class="banner flex a-j-center full-width default-padding">
+          <div class="banner__content flex a-j-center flex-column">
+            <h2>Sed ut perspiciatis unde omnis iste</h2>
+            <h3>
+              Sed ut perspiciatis unde omnis iste natus error sit voluptatem
+              accusantium doloremque laudantium.
+            </h3>
+            <a href="">
+              <button class="secondary">Start Building</button>
+            </a>
+          </div>
+        </section>
 
-            <section class="text__component default-padding full-width">
-                <div class="list__block__item">
-                    <div class="rich__text">
-                        <ul>
-                            <li>Sed ut perspiciatis unde omnis iste natus error sit
-                                voluptatemaccusantium doloremque laudantium, totam rem aperiam
-                                inventore Veritatis.
-                            </li>
-                            <li>Sed ut perspiciatis unde omnis iste natus error sit
-                                voluptatemaccusantium doloremque laudantium, totam rem aperiam
-                                inventore Veritatis.
-                            </li>
-                        </ul>
-                    </div>
-                </div>
-            </section>
+        <section class="text__component default-padding full-width">
+          <div class="list__block__item">
+            <div class="rich__text">
+              <ul>
+                <li>
+                  Sed ut perspiciatis unde omnis iste natus error sit
+                  voluptatemaccusantium doloremque laudantium, totam rem aperiam
+                  inventore Veritatis.
+                </li>
+                <li>
+                  Sed ut perspiciatis unde omnis iste natus error sit
+                  voluptatemaccusantium doloremque laudantium, totam rem aperiam
+                  inventore Veritatis.
+                </li>
+              </ul>
+            </div>
+          </div>
+        </section>
 
-            <section class="default-padding full-width">
-                <div class="list__block__item">
-                    <figure>
-                        <img src="./images/hill-cover.png" alt="hill-cover" style="width: 100%" />
-                        <figcaption>Hill Cover - By <a href="">Traleor</a></figcaption>
-                    </figure>
-                </div>
-            </section>
+        <section class="default-padding full-width">
+          <div class="list__block__item">
+            <figure>
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="hill-cover"
+                style="width: 100%"
+              />
+              <figcaption>Hill Cover - By <a href="">Traleor</a></figcaption>
+            </figure>
+          </div>
+        </section>
 
-            <section class="text__component default-padding full-width">
-                <div class="list__block__item">
-                    <div class="rich__text">
-                        <iframe width="560" height="315" src="https://www.youtube.com/embed/EKe8MA4K5Zk" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
-                    </div>
-                </div>
-            </section>
+        <section class="text__component default-padding full-width">
+          <div class="list__block__item">
+            <div class="rich__text">
+              <iframe
+                width="560"
+                height="315"
+                src="https://www.youtube.com/embed/EKe8MA4K5Zk"
+                title="YouTube video player"
+                frameborder="0"
+                allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+                allowfullscreen
+              ></iframe>
+            </div>
+          </div>
+        </section>
 
-            <section class="text__component default-padding full-width">
-                <div class="list__block__item">
-                    <div class="rich__text">
-                        <h2>No Time to Waste</h2>
-                        <h3><b>Sed</b> ut perspiciatis unde omnis iste natus.</h3>
-                        <h3>
-                            Sed ut perspiciatis unde omnis iste natus error sit
-                            <a href="">voluptatemaccusantium</a> doloremque laudantium, totam
-                            rem aperiam inventore Veritatis
-                        </h3>
-                        <!-- <img src="./images/hill-cover.png" alt="hill-cover"> -->
-                        <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/nyg5Lpl6AiM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
-                        <h3>
-                            Sed ut perspiciatis unde omnis iste natus error sit
-                            voluptatemaccusantium doloremque laudantium, totam rem aperiam
-                            inventore Veritatis.
-                        </h3>
-                    </div>
-                </div>
-            </section>
+        <section class="text__component default-padding full-width">
+          <div class="list__block__item">
+            <div class="rich__text">
+              <h2>No Time to Waste</h2>
+              <h3><b>Sed</b> ut perspiciatis unde omnis iste natus.</h3>
+              <h3>
+                Sed ut perspiciatis unde omnis iste natus error sit
+                <a href="">voluptatemaccusantium</a> doloremque laudantium,
+                totam rem aperiam inventore Veritatis
+              </h3>
+              <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
+              <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/nyg5Lpl6AiM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
+              <h3>
+                Sed ut perspiciatis unde omnis iste natus error sit
+                voluptatemaccusantium doloremque laudantium, totam rem aperiam
+                inventore Veritatis.
+              </h3>
+            </div>
+          </div>
+        </section>
 
-            <section class="full-width flex a-j-center default-padding">
-                <button class="primary">Start Building</button>
-            </section>
+        <section class="full-width flex a-j-center default-padding">
+          <button class="primary">Start Building</button>
+        </section>
 
-            <!-- comments  -->
-            <section class="full-width default-padding">
-            <div id="remark42"></div>
-            </section>
+        <!-- comments  -->
+        <section class="full-width default-padding">
+          <div id="remark42"></div>
         </section>
+      </section>
     </div>
 
     <footer class="footer">
-        <div class="title__text__wrapper full-width">
-            <div class="title__text__content flex flex-column a-j-center">
-                <h2>Sed ut perspiciatis unde omnis iste natus</h2>
-                <h3>
-                    Sed ut perspiciatis unde omnis iste natus error sit voluptatem
-                    accusantium doloremque laudantium.
-                </h3>
-            </div>
-        </div>
-        <div class="footer__mark">
-            <h4>Nova Template - Made By Traleor</h4>
+      <div class="title__text__wrapper full-width">
+        <div class="title__text__content flex flex-column a-j-center">
+          <h2>Sed ut perspiciatis unde omnis iste natus</h2>
+          <h3>
+            Sed ut perspiciatis unde omnis iste natus error sit voluptatem
+            accusantium doloremque laudantium.
+          </h3>
         </div>
+      </div>
+      <div class="footer__mark">
+        <h4>Nova Template - Made By Traleor</h4>
+      </div>
     </footer>
     <!-- Placed made__mark here for SEO purposes -->
     <div class="fixed made__mark">
-        <a href="https://traleor.com">
-            <h3>Made With Traleor</h3>
-        </a>
+      <a href="https://traleor.com">
+        <h3>Made With Traleor</h3>
+      </a>
     </div>
 
     <script src="js/nova.js"></script>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.27.0/components/prism-core.min.js"
-        integrity="sha512-LCKPTo0gtJ74zCNMbWw04ltmujpzSR4oW+fgN+Y1YclhM5ZrHCZQAJE4quEodcI/G122sRhSGU2BsSRUZ2Gu3w=="
-        crossorigin="anonymous" referrerpolicy="no-referrer"></script>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.27.0/plugins/autoloader/prism-autoloader.min.js"
-        integrity="sha512-GP4x8UWxWyh4BMbyJGOGneiTbkrWEF5izsVJByzVLodP8CuJH/n936+yQDMJJrOPUHLgyPbLiGw2rXmdvGdXHA=="
-        crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+    <script
+      src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.27.0/components/prism-core.min.js"
+      integrity="sha512-LCKPTo0gtJ74zCNMbWw04ltmujpzSR4oW+fgN+Y1YclhM5ZrHCZQAJE4quEodcI/G122sRhSGU2BsSRUZ2Gu3w=="
+      crossorigin="anonymous"
+      referrerpolicy="no-referrer"
+    ></script>
+    <script
+      src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.27.0/plugins/autoloader/prism-autoloader.min.js"
+      integrity="sha512-GP4x8UWxWyh4BMbyJGOGneiTbkrWEF5izsVJByzVLodP8CuJH/n936+yQDMJJrOPUHLgyPbLiGw2rXmdvGdXHA=="
+      crossorigin="anonymous"
+      referrerpolicy="no-referrer"
+    ></script>
 
     <!-- Traleor comments -->
     <script>
@@ -376,16 +405,28 @@ <h3>Made With Traleor</h3>
         host: "https://comments.traleor.com",
         site_id: "traleor",
         ccomponents: ["embed", "counter"],
-        max_shown_comments: 10, 
-        theme: 'light',
+        max_shown_comments: 10,
+        theme: "light",
         locale: "en",
         show_email_subscription: true,
         simple_view: false,
       };
     </script>
-    <script>!function(e,n){for(var o=0;o<e.length;o++){var r=n.createElement("script"),c=".js",d=n.head||n.body;"noModule"in r?(r.type="module",c=".mjs"):r.async=!0,r.defer=!0,r.src=remark_config.host+"/web/"+e[o]+c,d.appendChild(r)}}(remark_config.components||["embed"],document);</script>
+    <script>
+      !(function (e, n) {
+        for (var o = 0; o < e.length; o++) {
+          var r = n.createElement("script"),
+            c = ".js",
+            d = n.head || n.body;
+          "noModule" in r
+            ? ((r.type = "module"), (c = ".mjs"))
+            : (r.async = !0),
+            (r.defer = !0),
+            (r.src = remark_config.host + "/web/" + e[o] + c),
+            d.appendChild(r);
+        }
+      })(remark_config.components || ["embed"], document);
+    </script>
     <!-- Traleor comments -->
-
-</body>
-
-</html>
\ No newline at end of file
+  </body>
+</html>
diff --git a/dior/css/nova.css b/dior/css/nova.css
index 68a201c..105fdd1 100644
--- a/dior/css/nova.css
+++ b/dior/css/nova.css
@@ -357,7 +357,7 @@ ul {
   justify-content: center;
 }
 
-.list__block .list__block__item{
+.list__block .list__block__item {
   width: 30%;
   flex: 30% 0 0;
   margin: 0.5rem;
@@ -425,7 +425,7 @@ ul {
 
 .banner {
   background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
-    url("../../media/dark-cover.png");
+    url("https://cdn.traleor.com/dark-cover.png");
   background-size: cover;
   background-position: center;
   padding: 3rem 4vw;
@@ -476,7 +476,7 @@ ul {
   border-radius: 10px;
   box-shadow: 0 0 10px 1px #d3d3d3;
 }
-.cards__flex .card .card__image{
+.cards__flex .card .card__image {
   width: 100%;
   height: 15vw;
   object-fit: cover;
@@ -843,10 +843,10 @@ footer {
   /*---- list__block ----*/
   /* .list__block {
     /* Fixing grid on smaller screen */
-    /* grid-template-columns: repeat(auto-fit, minmax(100%, 1fr)); */
+  /* grid-template-columns: repeat(auto-fit, minmax(100%, 1fr)); */
   /* }  */
 
-  .list__block .list__block__item{
+  .list__block .list__block__item {
     width: 100%;
     flex: 100% 0 0;
     /* box-shadow: 0 0 10px 1px #d3d3d3; */
@@ -858,7 +858,7 @@ footer {
     height: fit-content;
   }
 
-  .cards__flex .card .card__image{
+  .cards__flex .card .card__image {
     width: 100%;
     height: 50%;
     object-fit: cover;
diff --git a/dior/flex_page.html b/dior/flex_page.html
index 3c559f7..f4f62de 100644
--- a/dior/flex_page.html
+++ b/dior/flex_page.html
@@ -113,7 +113,7 @@ <h4>Traleor templates are crafted with love to help you to build</h4>
             <div class="list__block__item">
               <figure>
                 <img
-                  src="./images/hill-cover.png"
+                  src="https://cdn.traleor.com/hill-cover.png"
                   alt="hill-cover"
                   style="width: 100%"
                 />
@@ -134,7 +134,7 @@ <h3><b>Sed</b> ut perspiciatis unde omnis iste natus.</h3>
                   <a href="">voluptatemaccusantium</a> doloremque laudantium,
                   totam rem aperiam inventore Veritatis
                 </p>
-                <!-- <img src="./images/hill-cover.png" alt="hill-cover"> -->
+                <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
                 <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/nyg5Lpl6AiM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
                 <p>
                   Sed ut perspiciatis unde omnis iste natus error sit
@@ -229,7 +229,7 @@ <h3>
         <div class="list__block__item">
           <figure>
             <img
-              src="./images/hill-cover.png"
+              src="https://cdn.traleor.com/hill-cover.png"
               alt="hill-cover"
               style="width: 100%"
             />
@@ -248,7 +248,7 @@ <h3><b>Sed</b> ut perspiciatis unde omnis iste natus.</h3>
               <a href="">voluptatemaccusantium</a> doloremque laudantium, totam
               rem aperiam inventore Veritatis
             </p>
-            <!-- <img src="./images/hill-cover.png" alt="hill-cover"> -->
+            <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
             <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/nyg5Lpl6AiM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
             <p>
               Sed ut perspiciatis unde omnis iste natus error sit
@@ -272,7 +272,10 @@ <h2>Cards Title Here</h2>
         <div class="cards__flex">
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -287,7 +290,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -302,7 +308,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -317,7 +326,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -332,7 +344,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -347,7 +362,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
diff --git a/dior/index.html b/dior/index.html
index cfe9091..841fc5c 100644
--- a/dior/index.html
+++ b/dior/index.html
@@ -79,7 +79,7 @@ <h2>
           </div>
         </div>
         <div class="hero__image flex-one">
-          <img src="./images/hill-cover.png" alt="hero-pic" />
+          <img src="https://cdn.traleor.com/hill-cover.png" alt="hero-pic" />
         </div>
       </div>
 
@@ -96,7 +96,6 @@ <h3>
 
       <!------------------------- LIST BLOCK ----------------------------------------------->
       <section class="list__block default-padding">
-
         <div class="list__block__item">
           <section class="title__text__wrapper full-width">
             <div class="title__text__content flex flex-column a-j-center">
@@ -179,7 +178,7 @@ <h3>
         <div class="list__block__item">
           <figure>
             <img
-              src="./images/hill-cover.png"
+              src="https://cdn.traleor.com/hill-cover.png"
               alt="hill-cover"
               style="width: 100%"
             />
@@ -211,7 +210,7 @@ <h4><b>Sed</b> ut perspiciatis unde omnis iste natus.</h4>
               <a href="">voluptatemaccusantium</a> doloremque laudantium, totam
               rem aperiam inventore Veritatis
             </p>
-            <!-- <img src="./images/hill-cover.png" alt="hill-cover"> -->
+            <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
             <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/nyg5Lpl6AiM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
             <h3>
               Sed ut perspiciatis unde omnis iste natus error sit
@@ -235,7 +234,10 @@ <h2>Cards Title Here</h2>
         <div class="cards__flex">
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -250,7 +252,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -265,7 +270,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -280,7 +288,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -295,7 +306,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -310,7 +324,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -399,9 +416,7 @@ <h4>Address</h4>
           </p>
           <p>
             Powered by
-            <a href="https://www.traleor.com"
-              >Traleor</a
-            >
+            <a href="https://www.traleor.com">Traleor</a>
           </p>
           <p>&copy 2023 Dior Moscow. All rights reserved</p>
         </div>
diff --git a/nova/blog_index.html b/nova/blog_index.html
index c7e6e30..b987cbd 100755
--- a/nova/blog_index.html
+++ b/nova/blog_index.html
@@ -87,7 +87,10 @@ <h2>
         class="featured__article__wrapper flex a-j-center default-padding"
       >
         <div class="featured__article__content flex-one">
-          <img src="../media/yellow-cover.png" alt="yellow-cover" />
+          <img
+            src="https://cdn.traleor.com/yellow-cover.png"
+            alt="yellow-cover"
+          />
         </div>
         <div class="flex-one">
           <div class="featured__article__content flex flex-column">
@@ -111,7 +114,10 @@ <h2>
         <div class="blog__cards">
           <div class="blog__card">
             <a href="./blog_post.html">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </a>
             <div class="blog__card__content my-1">
               <span>Tuesday 25, 2022</span>
@@ -129,7 +135,10 @@ <h2 class="my-1">
           </div>
           <div class="blog__card">
             <a href="./blog_post.html">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </a>
             <div class="blog__card__content my-1">
               <span>Tuesday 25, 2022</span>
@@ -147,7 +156,10 @@ <h2 class="my-1">
           </div>
           <div class="blog__card">
             <a href="./blog_post.html">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </a>
             <div class="blog__card__content my-1">
               <span>Tuesday 25, 2022</span>
@@ -165,7 +177,10 @@ <h2 class="my-1">
           </div>
           <div class="blog__card">
             <a href="./blog_post.html">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </a>
             <div class="blog__card__content my-1">
               <span>Tuesday 25, 2022</span>
diff --git a/nova/blog_post.html b/nova/blog_post.html
index a881995..cebf7ce 100755
--- a/nova/blog_post.html
+++ b/nova/blog_post.html
@@ -86,20 +86,23 @@ <h1 class="headline default-padding">
         </h1>
         <span class="default-padding">Tuesday 25, 2022</span>
         <figure class="default-padding">
-          <img src="../media/yellow-cover.png" alt="hill-cover" />
+          <img
+            src="https://cdn.traleor.com/yellow-cover.png"
+            alt="hill-cover"
+          />
           <figcaption>Hill Cover - By <a href="">Traleor</a></figcaption>
         </figure>
         <div class="authors__wrapper flex default-padding">
           <div class="author">
-            <img src="../media/dark-cover.png" alt="author" />
+            <img src="https://cdn.traleor.com/dark-cover.png" alt="author" />
             <span><a href="#" target="_blank">John Doe</a></span>
           </div>
           <div class="author">
-            <img src="../media/dark-cover.png" alt="author" />
+            <img src="https://cdn.traleor.com/dark-cover.png" alt="author" />
             <span><a href="#" target="_blank">John Doe</a></span>
           </div>
           <div class="author">
-            <img src="../media/dark-cover.png" alt="author" />
+            <img src="https://cdn.traleor.com/dark-cover.png" alt="author" />
             <span><a href="#" target="_blank">John Doe</a></span>
           </div>
         </div>
@@ -163,10 +166,10 @@ <h2>No Time to Waste</h2>
     &ltsection class="blog__cards"&gt
         &ltdiv class="list__block__item"&gt
             &ltfigure&gt
-                &ltimg src="./images/hill-cover.png" alt="hill-cover" style="width: 100%" /&gt
+                &ltimg src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover" style="width: 100%" /&gt
                 &ltfigcaption&gt
                     &lta href=""&gt
-                        &ltimg src="./images/hill-cover.png" alt="hill-cover" style="width: 100%" /&gt
+                        &ltimg src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover" style="width: 100%" /&gt
                     &lt/a&gt
                 &lt/figcaption&gt
             &lt/figure&gt
@@ -228,7 +231,7 @@ <h2>No Time to Waste</h2>
                 inventore Veritatis.
               </p>
 
-              <!-- <img src="./images/hill-cover.png" alt="hill-cover"> -->
+              <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
               <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/EKe8MA4K5Zk" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
               <h3>
                 Sed ut perspiciatis unde omnis iste natus error sit
@@ -266,7 +269,7 @@ <h3>
           <div class="list__block__item">
             <figure>
               <img
-                src="./images/hill-cover.png"
+                src="https://cdn.traleor.com/hill-cover.png"
                 alt="hill-cover"
                 style="width: 100%"
               />
@@ -312,7 +315,7 @@ <h3>
           <div class="list__block__item">
             <figure>
               <img
-                src="./images/hill-cover.png"
+                src="https://cdn.traleor.com/hill-cover.png"
                 alt="hill-cover"
                 style="width: 100%"
               />
@@ -347,7 +350,7 @@ <h3>
                 <a href="">voluptatemaccusantium</a> doloremque laudantium,
                 totam rem aperiam inventore Veritatis
               </h3>
-              <!-- <img src="./images/hill-cover.png" alt="hill-cover"> -->
+              <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
               <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/nyg5Lpl6AiM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
               <h3>
                 Sed ut perspiciatis unde omnis iste natus error sit
diff --git a/nova/css/nova.css b/nova/css/nova.css
index c7e16b7..b44bf4e 100755
--- a/nova/css/nova.css
+++ b/nova/css/nova.css
@@ -393,7 +393,7 @@ ul {
 
 .banner {
   background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
-    url("../../media/dark-cover.png");
+    url("https://cdn.traleor.com/dark-cover.png");
   background-size: cover;
   background-position: center;
   padding: 5rem 8vw;
diff --git a/nova/flex_page.html b/nova/flex_page.html
index 72a782f..7df0419 100755
--- a/nova/flex_page.html
+++ b/nova/flex_page.html
@@ -120,7 +120,7 @@ <h4>Traleor templates are crafted with love to help you to build</h4>
             <div class="list__block__item">
               <figure>
                 <img
-                  src="./images/hill-cover.png"
+                  src="https://cdn.traleor.com/hill-cover.png"
                   alt="hill-cover"
                   style="width: 100%"
                 />
@@ -141,7 +141,7 @@ <h3><b>Sed</b> ut perspiciatis unde omnis iste natus.</h3>
                   <a href="">voluptatemaccusantium</a> doloremque laudantium,
                   totam rem aperiam inventore Veritatis
                 </p>
-                <!-- <img src="./images/hill-cover.png" alt="hill-cover"> -->
+                <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
                 <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/nyg5Lpl6AiM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
                 <p>
                   Sed ut perspiciatis unde omnis iste natus error sit
@@ -236,7 +236,7 @@ <h3>
         <div class="list__block__item">
           <figure>
             <img
-              src="./images/hill-cover.png"
+              src="https://cdn.traleor.com/hill-cover.png"
               alt="hill-cover"
               style="width: 100%"
             />
@@ -255,7 +255,7 @@ <h3><b>Sed</b> ut perspiciatis unde omnis iste natus.</h3>
               <a href="">voluptatemaccusantium</a> doloremque laudantium, totam
               rem aperiam inventore Veritatis
             </p>
-            <!-- <img src="./images/hill-cover.png" alt="hill-cover"> -->
+            <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
             <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/nyg5Lpl6AiM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
             <p>
               Sed ut perspiciatis unde omnis iste natus error sit
@@ -279,7 +279,10 @@ <h2>Cards Title Here</h2>
         <div class="cards__flex">
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -294,7 +297,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -309,7 +315,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -324,7 +333,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -339,7 +351,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -354,7 +369,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
diff --git a/nova/index.html b/nova/index.html
index 02d79ed..869afbc 100755
--- a/nova/index.html
+++ b/nova/index.html
@@ -112,7 +112,7 @@ <h2>
           </div>
         </div>
         <div class="hero__image flex-one" data-aos="zoom-out-left">
-          <img src="./images/hill-cover.png" alt="hero-pic" />
+          <img src="https://cdn.traleor.com/hill-cover.png" alt="hero-pic" />
         </div>
       </div>
 
@@ -137,7 +137,7 @@ <h3>
             <div class="list__block__item">
               <figure>
                 <img
-                  src="./images/hill-cover.png"
+                  src="https://cdn.traleor.com/hill-cover.png"
                   alt="hill-cover"
                   style="width: 100%"
                 />
@@ -157,7 +157,7 @@ <h4>
                   <a href="">voluptatemaccusantium</a> doloremque laudantium,
                   totam rem aperiam inventore Veritatis
                 </h4>
-                <!-- <img src="./images/hill-cover.png" alt="hill-cover"> -->
+                <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
                 <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/nyg5Lpl6AiM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
                 <p>
                   Sed ut perspiciatis unde omnis iste natus error sit
@@ -233,7 +233,7 @@ <h3>
         <div class="list__block__item" data-aos="zoom-out-up">
           <figure>
             <img
-              src="./images/hill-cover.png"
+              src="https://cdn.traleor.com/hill-cover.png"
               alt="hill-cover"
               style="width: 100%"
             />
@@ -273,7 +273,7 @@ <h4><b>Sed</b> ut perspiciatis unde omnis iste natus.</h4>
               <a href="">voluptatemaccusantium</a> doloremque laudantium, totam
               rem aperiam inventore Veritatis
             </p>
-            <!-- <img src="./images/hill-cover.png" alt="hill-cover"> -->
+            <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
             <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/nyg5Lpl6AiM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
             <h3>
               Sed ut perspiciatis unde omnis iste natus error sit
@@ -297,7 +297,10 @@ <h2>Cards Title Here</h2>
         <div class="cards__flex">
           <div class="card" data-aos="zoom-out-down" data-aos-delay="1000">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -312,7 +315,10 @@ <h3>
 
           <div class="card" data-aos="zoom-out-down" data-aos-delay="1000">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -327,7 +333,10 @@ <h3>
 
           <div class="card" data-aos="zoom-out-down" data-aos-delay="1000">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -341,7 +350,10 @@ <h3>
           </div>
           <div class="card" data-aos="zoom-out-up" data-aos-delay="1000">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -356,7 +368,10 @@ <h3>
 
           <div class="card" data-aos="zoom-out-up" data-aos-delay="1000">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -371,7 +386,10 @@ <h3>
 
           <div class="card" data-aos="zoom-out-up" data-aos-delay="1000">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
diff --git a/rolly/index.html b/rolly/index.html
index 111903a..7c4aaf5 100644
--- a/rolly/index.html
+++ b/rolly/index.html
@@ -57,7 +57,7 @@ <h1>Rolly's <span>Blog</span></h1>
                 </div>
             </div>
             <div class="gridChild">
-                <img src="../media/yellow-cover.png" alt="Cover image" class="welcomeImage" />
+                <img src="https://cdn.traleor.com/yellow-cover.png" alt="Cover image" class="welcomeImage" />
             </div>
         </div>
     </section>
diff --git a/techa/blog_index.html b/techa/blog_index.html
index 6a8f0ba..f90ad11 100644
--- a/techa/blog_index.html
+++ b/techa/blog_index.html
@@ -79,7 +79,10 @@ <h2>
         class="featured__article__wrapper flex a-j-center default-padding"
       >
         <div class="featured__article__content flex-one">
-          <img src="../media/yellow-cover.png" alt="yellow-cover" />
+          <img
+            src="https://cdn.traleor.com/yellow-cover.png"
+            alt="yellow-cover"
+          />
         </div>
         <div class="flex-one">
           <div class="featured__article__content flex flex-column">
@@ -104,7 +107,10 @@ <h1>Lorem Ipsum</h1>
         <div class="blog__cards">
           <div class="blog__card">
             <a href="./blog_post.html">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </a>
             <div class="blog__card__content my-1">
               <span>Tuesday 25, 2022</span>
@@ -122,7 +128,10 @@ <h2 class="my-1">
           </div>
           <div class="blog__card">
             <a href="./blog_post.html">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </a>
             <div class="blog__card__content my-1">
               <span>Tuesday 25, 2022</span>
@@ -140,7 +149,10 @@ <h2 class="my-1">
           </div>
           <div class="blog__card">
             <a href="./blog_post.html">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </a>
             <div class="blog__card__content my-1">
               <span>Tuesday 25, 2022</span>
@@ -158,7 +170,10 @@ <h2 class="my-1">
           </div>
           <div class="blog__card">
             <a href="./blog_post.html">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </a>
             <div class="blog__card__content my-1">
               <span>Tuesday 25, 2022</span>
diff --git a/techa/blog_post.html b/techa/blog_post.html
index d68a3ec..2a9d15e 100644
--- a/techa/blog_post.html
+++ b/techa/blog_post.html
@@ -78,20 +78,23 @@ <h1 class="headline default-padding">
         </h1>
         <span class="default-padding">Tuesday 25, 2022</span>
         <figure class="default-padding">
-          <img src="../media/yellow-cover.png" alt="hill-cover" />
+          <img
+            src="https://cdn.traleor.com/yellow-cover.png"
+            alt="hill-cover"
+          />
           <figcaption>Hill Cover - By <a href="">Traleor</a></figcaption>
         </figure>
         <div class="authors__wrapper flex default-padding">
           <div class="author">
-            <img src="../media/dark-cover.png" alt="author" />
+            <img src="https://cdn.traleor.com/dark-cover.png" alt="author" />
             <span><a href="#" target="_blank">John Doe</a></span>
           </div>
           <div class="author">
-            <img src="../media/dark-cover.png" alt="author" />
+            <img src="https://cdn.traleor.com/dark-cover.png" alt="author" />
             <span><a href="#" target="_blank">John Doe</a></span>
           </div>
           <div class="author">
-            <img src="../media/dark-cover.png" alt="author" />
+            <img src="https://cdn.traleor.com/dark-cover.png" alt="author" />
             <span><a href="#" target="_blank">John Doe</a></span>
           </div>
         </div>
@@ -155,10 +158,10 @@ <h2>No Time to Waste</h2>
     &ltsection class="blog__cards"&gt
         &ltdiv class="list__block__item"&gt
             &ltfigure&gt
-                &ltimg src="./images/hill-cover.png" alt="hill-cover" style="width: 100%" /&gt
+                &ltimg src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover" style="width: 100%" /&gt
                 &ltfigcaption&gt
                     &lta href=""&gt
-                        &ltimg src="./images/hill-cover.png" alt="hill-cover" style="width: 100%" /&gt
+                        &ltimg src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover" style="width: 100%" /&gt
                     &lt/a&gt
                 &lt/figcaption&gt
             &lt/figure&gt
@@ -220,7 +223,7 @@ <h2>No Time to Waste</h2>
                 inventore Veritatis.
               </p>
 
-              <!-- <img src="./images/hill-cover.png" alt="hill-cover"> -->
+              <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
               <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/EKe8MA4K5Zk" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
               <h3>
                 Sed ut perspiciatis unde omnis iste natus error sit
@@ -258,7 +261,7 @@ <h3>
           <div class="list__block__item">
             <figure>
               <img
-                src="./images/hill-cover.png"
+                src="https://cdn.traleor.com/hill-cover.png"
                 alt="hill-cover"
                 style="width: 100%"
               />
@@ -304,7 +307,7 @@ <h3>
           <div class="list__block__item">
             <figure>
               <img
-                src="./images/hill-cover.png"
+                src="https://cdn.traleor.com/hill-cover.png"
                 alt="hill-cover"
                 style="width: 100%"
               />
@@ -339,7 +342,7 @@ <h3>
                 <a href="">voluptatemaccusantium</a> doloremque laudantium,
                 totam rem aperiam inventore Veritatis
               </h3>
-              <!-- <img src="./images/hill-cover.png" alt="hill-cover"> -->
+              <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
               <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/nyg5Lpl6AiM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
               <h3>
                 Sed ut perspiciatis unde omnis iste natus error sit
@@ -403,14 +406,28 @@ <h3>Made With Traleor</h3>
         host: "https://comments.traleor.com",
         site_id: "traleor",
         ccomponents: ["embed", "counter"],
-        max_shown_comments: 10, 
-        theme: 'light',
+        max_shown_comments: 10,
+        theme: "light",
         locale: "en",
         show_email_subscription: true,
         simple_view: false,
       };
     </script>
-    <script>!function(e,n){for(var o=0;o<e.length;o++){var r=n.createElement("script"),c=".js",d=n.head||n.body;"noModule"in r?(r.type="module",c=".mjs"):r.async=!0,r.defer=!0,r.src=remark_config.host+"/web/"+e[o]+c,d.appendChild(r)}}(remark_config.components||["embed"],document);</script>
+    <script>
+      !(function (e, n) {
+        for (var o = 0; o < e.length; o++) {
+          var r = n.createElement("script"),
+            c = ".js",
+            d = n.head || n.body;
+          "noModule" in r
+            ? ((r.type = "module"), (c = ".mjs"))
+            : (r.async = !0),
+            (r.defer = !0),
+            (r.src = remark_config.host + "/web/" + e[o] + c),
+            d.appendChild(r);
+        }
+      })(remark_config.components || ["embed"], document);
+    </script>
     <!-- Traleor comments -->
   </body>
 </html>
diff --git a/techa/css/techa.css b/techa/css/techa.css
index 448c3f1..8d7eb86 100644
--- a/techa/css/techa.css
+++ b/techa/css/techa.css
@@ -319,7 +319,7 @@ ul {
   height: 100vh;
   /* background: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.9)); */
   background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
-    url("../../media/dark-cover.png");
+    url("https://cdn.traleor.com/dark-cover.png");
   background-position: center;
   background-repeat: no-repeat;
   background-size: cover;
@@ -438,7 +438,7 @@ ul {
 
 .banner {
   background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
-    url("../../media/dark-cover.png");
+    url("https://cdn.traleor.com/dark-cover.png");
   background-size: cover;
   background-position: center;
   padding: 5rem 8vw;
diff --git a/techa/flex_page.html b/techa/flex_page.html
index d50619f..f9398d4 100644
--- a/techa/flex_page.html
+++ b/techa/flex_page.html
@@ -113,7 +113,7 @@ <h4>Traleor templates are crafted with love to help you to build</h4>
             <div class="list__block__item">
               <figure>
                 <img
-                  src="./images/hill-cover.png"
+                  src="https://cdn.traleor.com/hill-cover.png"
                   alt="hill-cover"
                   style="width: 100%"
                 />
@@ -134,7 +134,7 @@ <h3><b>Sed</b> ut perspiciatis unde omnis iste natus.</h3>
                   <a href="">voluptatemaccusantium</a> doloremque laudantium,
                   totam rem aperiam inventore Veritatis
                 </p>
-                <!-- <img src="./images/hill-cover.png" alt="hill-cover"> -->
+                <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
                 <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/nyg5Lpl6AiM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
                 <p>
                   Sed ut perspiciatis unde omnis iste natus error sit
@@ -229,7 +229,7 @@ <h3>
         <div class="list__block__item">
           <figure>
             <img
-              src="./images/hill-cover.png"
+              src="https://cdn.traleor.com/hill-cover.png"
               alt="hill-cover"
               style="width: 100%"
             />
@@ -248,7 +248,7 @@ <h3><b>Sed</b> ut perspiciatis unde omnis iste natus.</h3>
               <a href="">voluptatemaccusantium</a> doloremque laudantium, totam
               rem aperiam inventore Veritatis
             </p>
-            <!-- <img src="./images/hill-cover.png" alt="hill-cover"> -->
+            <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
             <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/nyg5Lpl6AiM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
             <p>
               Sed ut perspiciatis unde omnis iste natus error sit
@@ -272,7 +272,10 @@ <h2>Cards Title Here</h2>
         <div class="cards__flex">
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -287,7 +290,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -302,7 +308,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -317,7 +326,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -332,7 +344,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -347,7 +362,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
diff --git a/techa/index.html b/techa/index.html
index 06d49bc..dcc4fc4 100644
--- a/techa/index.html
+++ b/techa/index.html
@@ -63,12 +63,8 @@
           <li class="navbar__menu__list language_select">
             <select onchange="location = this.value;">
               <!-- current language selected -->
-              <option value="/" selected>
-                EN
-              </option>
-              <option value="/">
-                FR
-              </option>
+              <option value="/" selected>EN</option>
+              <option value="/">FR</option>
             </select>
           </li>
         </ul>
@@ -95,7 +91,7 @@ <h2>
           </div>
         </div>
         <!-- <div class="hero__image flex-one">
-          <img src="./images/hill-cover.png" alt="hero-pic" />
+          <img src="https://cdn.traleor.com/hill-cover.png" alt="hero-pic" />
         </div> -->
       </div>
 
@@ -117,7 +113,7 @@ <h3>
             <div class="list__block__item">
               <figure>
                 <img
-                  src="./images/hill-cover.png"
+                  src="https://cdn.traleor.com/hill-cover.png"
                   alt="hill-cover"
                   style="width: 100%"
                 />
@@ -137,7 +133,7 @@ <h4>
                   <a href="">voluptatemaccusantium</a> doloremque laudantium,
                   totam rem aperiam inventore Veritatis
                 </h4>
-                <!-- <img src="./images/hill-cover.png" alt="hill-cover"> -->
+                <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
                 <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/nyg5Lpl6AiM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
                 <p>
                   Sed ut perspiciatis unde omnis iste natus error sit
@@ -207,7 +203,7 @@ <h3>
         <div class="list__block__item">
           <figure>
             <img
-              src="./images/hill-cover.png"
+              src="https://cdn.traleor.com/hill-cover.png"
               alt="hill-cover"
               style="width: 100%"
             />
@@ -239,7 +235,7 @@ <h4><b>Sed</b> ut perspiciatis unde omnis iste natus.</h4>
               <a href="">voluptatemaccusantium</a> doloremque laudantium, totam
               rem aperiam inventore Veritatis
             </p>
-            <!-- <img src="./images/hill-cover.png" alt="hill-cover"> -->
+            <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
             <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/nyg5Lpl6AiM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
             <h3>
               Sed ut perspiciatis unde omnis iste natus error sit
@@ -263,7 +259,10 @@ <h2>Cards Title Here</h2>
         <div class="cards__flex">
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -278,7 +277,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -293,7 +295,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -308,7 +313,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -323,7 +331,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
@@ -338,7 +349,10 @@ <h3>
 
           <div class="card">
             <div class="card__image">
-              <img src="./images/hill-cover.png" alt="alt-text" />
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
             </div>
             <div class="card__body">
               <p>sub title</p>
diff --git a/zion/about.html b/zion/about.html
index 33f355a..0dabc97 100644
--- a/zion/about.html
+++ b/zion/about.html
@@ -36,7 +36,7 @@
             <ul>
               <li><a href="./index.html">Home</a></li>
               <li><a href="./about.html">About Us</a></li>
-              <li><a>Blog</a></li>
+              <li><a href="./blog_index.html">Blog</a></li>
               <button><a href="./contact.html">Contact Us</a></button>
             </ul>
           </div>
diff --git a/zion/blog_index.html b/zion/blog_index.html
new file mode 100755
index 0000000..3bc6d44
--- /dev/null
+++ b/zion/blog_index.html
@@ -0,0 +1,174 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Nova - Traleor Default Template</title>
+    <meta
+      name="description"
+      content="Traleor Template Nova is derived from the Latin word `New` and is the starter template for traleor websites"
+    />
+
+    <link rel="preconnect" href="https://cdn.traleor.com" />
+    <link rel="preconnect" href="https://api.fonts.coollabs.io" crossorigin />
+    <link
+      rel="preload"
+      href="https://cdn.traleor.com/statics/reset.min.css"
+      as="style"
+      onload="this.onload=null;this.rel='stylesheet'"
+    />
+    <link
+      rel="preload"
+      href="https://api.fonts.coollabs.io/css2?family=Inter:wght@300;500;600;700&display=swap"
+      as="style"
+      onload="this.onload=null;this.rel='stylesheet'"
+    />
+    <link rel="stylesheet" href="css/style.css" />
+  </head>
+
+  <body>
+    <div class="container">
+      <!-- NAVBAR -------------------------------------------------->
+      <header>
+        <nav>
+          <div id="nav" class="container">
+            <a href="./index.html" class="logo_box">
+              <img src="./images/logo.png" alt="zion_logo" />
+            </a>
+            <div class="menu_links">
+              <ul>
+                <li><a href="./index.html">Home</a></li>
+                <li><a href="./about.html">About Us</a></li>
+                <li><a href="./blog_index.html">Blog</a></li>
+                <button><a href="./contact.html">Contact Us</a></button>
+              </ul>
+            </div>
+            <div class="toggle-menu">
+              <div class="menu_line line1"></div>
+              <div class="menu_line line2"></div>
+              <div class="menu_line line3"></div>
+            </div>
+          </div>
+          <div class="line container"></div>
+        </nav>
+      </header>
+
+      <!-- Blog Index Hero --------------------------------------------->
+      <div
+        class="blog_head default-padding full-width flex a-j-center flex-column"
+      >
+        <h1>Zion Blog</h1>
+        <h2>
+          Lorem ipsum dolor sit amet consectetur adipisicing elit. Provident sit
+          minima tempora odio praesentium quod est? Consequatur cumque, qui, ab
+          at nemo excepturi, hic quo voluptatibus non blanditiis laborum aut!
+        </h2>
+      </div>
+
+      <!-- BLOG CARDS --------------------------------------------->
+      <section class="card__block full-width default-padding">
+        <div class="blog__cards">
+          <div class="blog__card">
+            <a href="./blog_post.html">
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
+            </a>
+            <div class="blog__card__content my-1">
+              <span>Tuesday 25, 2022</span>
+              <a href="./blog_post.html">
+                <h2 class="my-1">
+                  This Article Headline is So Cool and Catchy, Click and Read
+                  Now
+                </h2>
+              </a>
+              <p>
+                Lorem ipsum dolor sit amet consectetur adipisicing elit. Id,
+                labore. Lorem ipsum consectetur adipisicing. dolor sit amet.
+              </p>
+            </div>
+          </div>
+          <div class="blog__card">
+            <a href="./blog_post.html">
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
+            </a>
+            <div class="blog__card__content my-1">
+              <span>Tuesday 25, 2022</span>
+              <a href="./blog_post.html">
+                <h2 class="my-1">
+                  This Article Headline is So Cool and Catchy, Click and Read
+                  Now
+                </h2>
+              </a>
+              <p>
+                Lorem ipsum dolor sit amet consectetur adipisicing elit. Id,
+                labore. Lorem ipsum consectetur adipisicing. dolor sit amet.
+              </p>
+            </div>
+          </div>
+          <div class="blog__card">
+            <a href="./blog_post.html">
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
+            </a>
+            <div class="blog__card__content my-1">
+              <span>Tuesday 25, 2022</span>
+              <a href="./blog_post.html">
+                <h2 class="my-1">
+                  This Article Headline is So Cool and Catchy, Click and Read
+                  Now
+                </h2>
+              </a>
+              <p>
+                Lorem ipsum dolor sit amet consectetur adipisicing elit. Id,
+                labore. Lorem ipsum consectetur adipisicing. dolor sit amet.
+              </p>
+            </div>
+          </div>
+          <div class="blog__card">
+            <a href="./blog_post.html">
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="alt-text"
+              />
+            </a>
+            <div class="blog__card__content my-1">
+              <span>Tuesday 25, 2022</span>
+              <a href="./blog_post.html">
+                <h2 class="my-1">
+                  This Article Headline is So Cool and Catchy, Click and Read
+                  Now
+                </h2>
+              </a>
+              <p>
+                Lorem ipsum dolor sit amet consectetur adipisicing elit. Id,
+                labore. Lorem ipsum consectetur adipisicing. dolor sit amet.
+              </p>
+            </div>
+          </div>
+        </div>
+      </section>
+
+      <footer>
+        <div class="footer__mark">
+          <h4>Zion Template - Made By Traleor</h4>
+        </div>
+      </footer>
+    </div>
+    <!-- Placed made__mark here for SEO purposes -->
+    <div class="fixed made__mark">
+      <a href="https://traleor.com">
+        <h3>Made With Traleor</h3>
+      </a>
+    </div>
+
+    <script src="js/nova.js"></script>
+  </body>
+</html>
diff --git a/zion/blog_post.html b/zion/blog_post.html
new file mode 100755
index 0000000..0c084ff
--- /dev/null
+++ b/zion/blog_post.html
@@ -0,0 +1,414 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Nova - Traleor Default Template</title>
+    <meta
+      name="description"
+      content="Traleor Template Nova is derived from the Latin word `New` and is the starter template for traleor websites"
+    />
+
+    <link rel="preconnect" href="https://cdn.traleor.com" />
+    <link rel="preconnect" href="https://api.fonts.coollabs.io" crossorigin />
+    <link
+      rel="preload"
+      href="https://cdn.traleor.com/statics/reset.min.css"
+      as="style"
+      onload="this.onload=null;this.rel='stylesheet'"
+    />
+    <link
+      rel="preload"
+      href="https://api.fonts.coollabs.io/css2?family=Inter:wght@300;500;600;700&display=swap"
+      as="style"
+      onload="this.onload=null;this.rel='stylesheet'"
+    />
+    <link rel="stylesheet" href="css/style.css" />
+    <!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.27.0/themes/prism-tomorrow.min.css" integrity="sha512-vswe+cgvic/XBoF1OcM/TeJ2FW0OofqAVdCZiEYkd6dwGXthvkSFWOoGGJgS2CW70VK5dQM5Oh+7ne47s74VTg==" crossorigin="anonymous" referrerpolicy="no-referrer" /> -->
+    <link
+      rel="stylesheet"
+      href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.27.0/themes/prism-okaidia.min.css"
+      integrity="sha512-mIs9kKbaw6JZFfSuo+MovjU+Ntggfoj8RwAmJbVXQ5mkAX5LlgETQEweFPI18humSPHymTb5iikEOKWF7I8ncQ=="
+      crossorigin="anonymous"
+      referrerpolicy="no-referrer"
+    />
+  </head>
+
+  <body>
+    <div class="container">
+      <!-- NAVBAR -------------------------------------------------->
+      <header>
+        <nav>
+          <div id="nav" class="container">
+            <a href="./index.html" class="logo_box">
+              <img src="./images/logo.png" alt="zion_logo" />
+            </a>
+            <div class="menu_links">
+              <ul>
+                <li><a href="./index.html">Home</a></li>
+                <li><a href="./about.html">About Us</a></li>
+                <li><a href="./blog_index.html">Blog</a></li>
+                <button><a href="./contact.html">Contact Us</a></button>
+              </ul>
+            </div>
+            <div class="toggle-menu">
+              <div class="menu_line line1"></div>
+              <div class="menu_line line2"></div>
+              <div class="menu_line line3"></div>
+            </div>
+          </div>
+          <div class="line container"></div>
+        </nav>
+      </header>
+
+      <!-- Blog Post Wrapper --------------------------------------------->
+      <section class="blog__post__wrapper">
+        <h1 class="headline default-padding">
+          Traleor helps you create Modern and Powerful websites.
+        </h1>
+        <span class="default-padding">Tuesday 25, 2022</span>
+        <figure class="default-padding">
+          <img
+            src="https://cdn.traleor.com/yellow-cover.png"
+            alt="hill-cover"
+          />
+          <figcaption>Hill Cover - By <a href="">Traleor</a></figcaption>
+        </figure>
+        <div class="authors__wrapper flex default-padding">
+          <div class="author">
+            <img src="https://cdn.traleor.com/dark-cover.png" alt="author" />
+            <span><a href="#" target="_blank">John Doe</a></span>
+          </div>
+          <div class="author">
+            <img src="https://cdn.traleor.com/dark-cover.png" alt="author" />
+            <span><a href="#" target="_blank">John Doe</a></span>
+          </div>
+          <div class="author">
+            <img src="https://cdn.traleor.com/dark-cover.png" alt="author" />
+            <span><a href="#" target="_blank">John Doe</a></span>
+          </div>
+        </div>
+
+        <!------------------------------------------------------->
+        <div class="default__LR__padding">
+          <h1>Traleor templates are crafted with love to help you to build</h1>
+        </div>
+        <div class="default__LR__padding">
+          <h2>Traleor templates are crafted with love to help you to build</h2>
+        </div>
+        <div class="default__LR__padding">
+          <h3>Traleor templates are crafted with love to help you to build</h3>
+        </div>
+        <div class="default__LR__padding">
+          <h4>Traleor templates are crafted with love to help you to build</h4>
+        </div>
+
+        <section class="text__component default-padding full-width">
+          <div class="list__block__item">
+            <div class="rich__text">
+              <h2>No Time to Waste</h2>
+              <p>
+                Sed ut perspiciatis unde omnis iste natus error sit
+                <a href="">voluptatemaccusantium</a> doloremque laudantium,
+                totam rem aperiam inventore Veritatis. Sed ut perspiciatis unde
+                omnis iste natus error sit voluptatemaccusantium doloremque
+                laudantium, totam rem aperiam inventore Veritatis. Sed ut
+                perspiciatis unde omnis iste natus error sit
+                voluptatemaccusantium doloremque laudantium, totam rem aperiam
+                inventore Veritatis.
+              </p>
+            </div>
+          </div>
+        </section>
+
+        <section class="default-padding full-width">
+          <pre>
+                    <code class="language-css">
+                        
+    <!-- css -->
+    .blog__card {
+        width: 30%;
+        flex: 30% 0 0;
+        margin: 0.5rem;
+        border-radius: 10px;
+    }
+    .blog__card a img {
+        object-fit: cover;
+        -o-object-fit: cover;
+        border-radius: 10px;
+    }
+                    </code>
+                </pre>
+        </section>
+
+        <section class="default-padding full-width">
+          <pre>
+                    <code class="language-html">
+    <!-- html -->
+    &ltsection class="blog__cards"&gt
+        &ltdiv class="list__block__item"&gt
+            &ltfigure&gt
+                &ltimg src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover" style="width: 100%" /&gt
+                &ltfigcaption&gt
+                    &lta href=""&gt
+                        &ltimg src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover" style="width: 100%" /&gt
+                    &lt/a&gt
+                &lt/figcaption&gt
+            &lt/figure&gt
+        &lt/div&gt
+    &lt/section&gt
+                    </code>
+                </pre>
+        </section>
+
+        <section class="default-padding full-width">
+          <pre>
+                    <code  class="language-python">
+    <!-- python -->
+    class CodeBlockAdapter(StructBlockAdapter):
+        js_constructor = "codeblock.blocks.CodeBlock"
+
+        @cached_property
+        def media(self):
+            structblock_media = super().media
+            return Media(
+                js=structblock_media._js + ["codeblock/js/codeblock.js"],
+                css=structblock_media._css,
+            )
+
+    register(CodeBlockAdapter(), CodeBlock)
+                    </code>
+                </pre>
+        </section>
+
+        <section class="default-padding full-width">
+          <pre>
+                    <code  class="language-javascript">
+    <!-- js -->
+    function copyLink() {
+        var dummy = document.createElement("input"),
+        text = window.location.href;
+        document.body.appendChild(dummy);
+        dummy.value = text;
+        dummy.select();
+        document.execCommand("copy");
+        document.body.removeChild(dummy);
+        alert("Link copied to clipboard");
+    }
+                    </code>
+                </pre>
+        </section>
+
+        <section class="text__component default-padding full-width">
+          <div class="list__block__item">
+            <div class="rich__text">
+              <p>
+                Sed ut perspiciatis unde omnis iste natus error sit
+                <a href="">voluptatemaccusantium</a> doloremque laudantium,
+                totam rem aperiam inventore Veritatis. Sed ut perspiciatis unde
+                omnis iste natus error sit voluptatemaccusantium doloremque
+                laudantium, totam rem aperiam inventore Veritatis. Sed ut
+                perspiciatis unde omnis iste natus error sit
+                voluptatemaccusantium doloremque laudantium, totam rem aperiam
+                inventore Veritatis.
+              </p>
+
+              <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
+              <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/EKe8MA4K5Zk" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
+              <h3>
+                Sed ut perspiciatis unde omnis iste natus error sit
+                voluptatemaccusantium doloremque laudantium, totam rem aperiam
+                inventore Veritatis.
+              </h3>
+              <ul>
+                <li>
+                  Sed ut perspiciatis unde omnis iste natus error sit
+                  voluptatemaccusantium doloremque laudantium, totam rem aperiam
+                  inventore Veritatis.
+                </li>
+                <li>
+                  Sed ut perspiciatis unde omnis iste natus error sit
+                  voluptatemaccusantium doloremque laudantium, totam rem aperiam
+                  inventore Veritatis.
+                </li>
+              </ul>
+            </div>
+          </div>
+        </section>
+
+        <!-- TITLE & TEXT --------------------------------------------->
+        <section class="title__text__wrapper full-width">
+          <div class="title__text__content flex flex-column a-j-center">
+            <h2>Sed ut perspiciatis unde omnis iste natus</h2>
+            <h3>
+              Sed ut perspiciatis unde omnis iste natus error sit voluptatem
+              accusantium doloremque laudantium.
+            </h3>
+          </div>
+        </section>
+
+        <section class="default-padding full-width">
+          <div class="list__block__item">
+            <figure>
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="hill-cover"
+                style="width: 100%"
+              />
+              <figcaption>Hill Cover - By <a href="">Traleor</a></figcaption>
+            </figure>
+          </div>
+        </section>
+
+        <!-- BANNER --------------------------------------------->
+        <section class="banner flex a-j-center full-width default-padding">
+          <div class="banner__content flex a-j-center flex-column">
+            <h2>Sed ut perspiciatis unde omnis iste</h2>
+            <h3>
+              Sed ut perspiciatis unde omnis iste natus error sit voluptatem
+              accusantium doloremque laudantium.
+            </h3>
+            <a href="">
+              <button class="secondary">Start Building</button>
+            </a>
+          </div>
+        </section>
+
+        <section class="text__component default-padding full-width">
+          <div class="list__block__item">
+            <div class="rich__text">
+              <ul>
+                <li>
+                  Sed ut perspiciatis unde omnis iste natus error sit
+                  voluptatemaccusantium doloremque laudantium, totam rem aperiam
+                  inventore Veritatis.
+                </li>
+                <li>
+                  Sed ut perspiciatis unde omnis iste natus error sit
+                  voluptatemaccusantium doloremque laudantium, totam rem aperiam
+                  inventore Veritatis.
+                </li>
+              </ul>
+            </div>
+          </div>
+        </section>
+
+        <section class="default-padding full-width">
+          <div class="list__block__item">
+            <figure>
+              <img
+                src="https://cdn.traleor.com/hill-cover.png"
+                alt="hill-cover"
+                style="width: 100%"
+              />
+              <figcaption>Hill Cover - By <a href="">Traleor</a></figcaption>
+            </figure>
+          </div>
+        </section>
+
+        <section class="text__component default-padding full-width">
+          <div class="list__block__item">
+            <div class="rich__text">
+              <iframe
+                width="560"
+                height="315"
+                src="https://www.youtube.com/embed/EKe8MA4K5Zk"
+                title="YouTube video player"
+                frameborder="0"
+                allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+                allowfullscreen
+              ></iframe>
+            </div>
+          </div>
+        </section>
+
+        <section class="text__component default-padding full-width">
+          <div class="list__block__item">
+            <div class="rich__text">
+              <h2>No Time to Waste</h2>
+              <h3><b>Sed</b> ut perspiciatis unde omnis iste natus.</h3>
+              <h3>
+                Sed ut perspiciatis unde omnis iste natus error sit
+                <a href="">voluptatemaccusantium</a> doloremque laudantium,
+                totam rem aperiam inventore Veritatis
+              </h3>
+              <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
+              <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/nyg5Lpl6AiM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
+              <h3>
+                Sed ut perspiciatis unde omnis iste natus error sit
+                voluptatemaccusantium doloremque laudantium, totam rem aperiam
+                inventore Veritatis.
+              </h3>
+            </div>
+          </div>
+        </section>
+
+        <section class="full-width flex a-j-center default-padding">
+          <button class="primary"><a href="#">Start Building</a></button>
+        </section>
+
+        <!-- comments  -->
+        <section class="full-width default-padding">
+          <div id="remark42"></div>
+        </section>
+      </section>
+    </div>
+
+    <footer>
+      <div class="footer__mark">
+        <h4>Zion Template - Made By Traleor</h4>
+      </div>
+    </footer>
+    <!-- Placed made__mark here for SEO purposes -->
+    <div class="fixed made__mark">
+      <a href="https://traleor.com">
+        <h3>Made With Traleor</h3>
+      </a>
+    </div>
+
+    <script src="js/nova.js"></script>
+    <script
+      src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.27.0/components/prism-core.min.js"
+      integrity="sha512-LCKPTo0gtJ74zCNMbWw04ltmujpzSR4oW+fgN+Y1YclhM5ZrHCZQAJE4quEodcI/G122sRhSGU2BsSRUZ2Gu3w=="
+      crossorigin="anonymous"
+      referrerpolicy="no-referrer"
+    ></script>
+    <script
+      src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.27.0/plugins/autoloader/prism-autoloader.min.js"
+      integrity="sha512-GP4x8UWxWyh4BMbyJGOGneiTbkrWEF5izsVJByzVLodP8CuJH/n936+yQDMJJrOPUHLgyPbLiGw2rXmdvGdXHA=="
+      crossorigin="anonymous"
+      referrerpolicy="no-referrer"
+    ></script>
+
+    <!-- Traleor comments -->
+    <script>
+      var remark_config = {
+        host: "https://comments.traleor.com",
+        site_id: "traleor",
+        ccomponents: ["embed", "counter"],
+        max_shown_comments: 10,
+        theme: "light",
+        locale: "en",
+        show_email_subscription: true,
+        simple_view: false,
+      };
+    </script>
+    <script>
+      !(function (e, n) {
+        for (var o = 0; o < e.length; o++) {
+          var r = n.createElement("script"),
+            c = ".js",
+            d = n.head || n.body;
+          "noModule" in r
+            ? ((r.type = "module"), (c = ".mjs"))
+            : (r.async = !0),
+            (r.defer = !0),
+            (r.src = remark_config.host + "/web/" + e[o] + c),
+            d.appendChild(r);
+        }
+      })(remark_config.components || ["embed"], document);
+    </script>
+    <!-- Traleor comments -->
+  </body>
+</html>
diff --git a/zion/contact.html b/zion/contact.html
index 7cae421..e7c396b 100644
--- a/zion/contact.html
+++ b/zion/contact.html
@@ -36,7 +36,7 @@
             <ul>
               <li><a href="./index.html">Home</a></li>
               <li><a href="./about.html">About Us</a></li>
-              <li><a>Blog</a></li>
+              <li><a href="./blog_index.html">Blog</a></li>
               <button><a href="./contact.html">Contact Us</a></button>
             </ul>
           </div>
diff --git a/zion/css/style.css b/zion/css/style.css
index c01a016..ec71da0 100644
--- a/zion/css/style.css
+++ b/zion/css/style.css
@@ -1,8 +1,8 @@
 :root {
-  --main-color: #018489;
+  --main-color: #0a2b25;
   --white-color: #fffbfe;
   --background-color: #e4ddd3;
-  --secondary-color: #1b364c;
+  --secondary-color: #0a2b25;
 
   --inter-font: "Inter", sans-serif;
 
@@ -40,6 +40,7 @@ body {
   font-family: var(--inter-font), -apple-system, BlinkMacSystemFont, Segoe UI,
     Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue,
     sans-serif;
+  background-color: var(--background-color);
 }
 
 h1 {
@@ -99,10 +100,289 @@ img {
   /* Aspect ratio of 1920x1080 (16:9) (Full HD) is default  */
   /* aspect-ratio: auto 9 / 16; */
 }
+
+img,
 iframe,
 video {
   width: 100%;
 }
+iframe {
+  min-height: 50vh;
+}
+
+pre {
+  color: white;
+  border-radius: 10px;
+  background-color: #0a2b25;
+}
+
+pre,
+code {
+  /* font-family: monospace, monospace; */
+  background-color: #0a2b25 !important;
+}
+pre {
+  overflow: auto;
+}
+pre > code {
+  word-wrap: normal;
+}
+
+.default-padding {
+  padding: 2rem var(--content-margin);
+}
+.default__LR__padding {
+  padding: 0 var(--content-margin);
+}
+
+.full-width {
+  width: 100%;
+}
+
+ul {
+  list-style-type: none;
+}
+
+.flex {
+  display: flex;
+  display: -ms-flexbox;
+}
+
+.flex-one {
+  flex: 1;
+  -ms-flex: 1;
+}
+
+.flex-one-half {
+  flex: 1.5;
+  -ms-flex: 1.5;
+}
+
+.a-j-center {
+  align-items: center;
+  justify-content: center;
+}
+
+.a-j-space-between {
+  align-items: center;
+  justify-content: space-between;
+}
+
+.flex-column {
+  flex-direction: column;
+  -ms-flex-direction: column;
+}
+
+.relative {
+  position: relative;
+}
+
+.absolute {
+  position: absolute;
+}
+
+.fixed {
+  position: fixed;
+}
+
+.py-1 {
+  padding: 1rem 0;
+}
+
+.py-2 {
+  padding: 2rem 0;
+}
+
+.my-1 {
+  margin: 1rem 0;
+}
+
+.my-2 {
+  margin: 2rem 0;
+}
+
+.made__mark {
+  left: 1rem;
+  bottom: 15rem;
+  transform-origin: left;
+  border: 1px solid rgba(0, 0, 0, 0.1);
+  transform: rotate(90deg);
+  -webkit-transform: rotate(90deg);
+  padding: 0.5rem;
+  background: var(--background-color);
+  display: block;
+}
+
+.made__mark h3 {
+  margin: 0;
+  color: var(--main-color);
+  font-weight: 500;
+  font-size: 14px;
+}
+
+/* NOVA STYLES */
+
+button {
+  background: #0a2b25;
+  box-shadow: -5px 4px 4px 0px rgba(0, 0, 0, 0.25);
+  outline: none;
+  border: none;
+  line-height: 55px;
+  text-align: center;
+  font-size: var(--font-size-body);
+  font-style: normal;
+  font-weight: 700;
+  width: 14rem;
+  height: auto;
+}
+
+button a {
+  color: white;
+  text-align: center;
+  font-size: var(--font-size-body);
+  font-style: normal;
+  font-weight: 500;
+  color: var(--background-color);
+  line-height: normal;
+  display: block;
+  width: 100%;
+  height: 100%;
+  line-height: 55px;
+}
+
+.title__text__wrapper {
+  background: var(--secondary-color);
+  padding: 6rem var(--content-margin);
+}
+
+.title__text__content h2 {
+  color: #fff;
+  font-size: var(--font-size-2);
+  margin: 0;
+  margin-bottom: 2rem;
+  text-align: center;
+}
+
+.title__text__content h3 {
+  color: #f3f3f3;
+  font-size: var(--font-size-3);
+  font-weight: 400;
+  text-align: center;
+}
+
+.list__block {
+  display: grid;
+  display: -ms-grid;
+  grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
+  gap: 1rem;
+}
+
+.list__block__item a,
+.list__block__item span {
+  color: var(--secondary-color);
+  /* font-style: italic; */
+}
+
+.list__block__item .rich__text img {
+  margin: 0.5rem 0;
+}
+
+.list__block__item figcaption {
+  text-align: center;
+  margin-top: 0.5rem;
+}
+
+.list__block__item section {
+  padding: 2rem;
+  min-height: 50vh;
+  display: flex;
+  display: -ms-flexbox;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+  -ms-flex-direction: column;
+}
+
+.list__block__item .title__text__content h2 {
+  font-size: var(--font-size-2);
+  text-align: center;
+}
+
+.list__block__item .title__text__content h3 {
+  font-size: var(--font-size-3);
+  text-align: center;
+  width: 100%;
+}
+
+.rich__text a {
+  color: var(--main-color);
+  /* font-style: italic; */
+}
+.rich__text ul {
+  list-style-type: disc;
+  padding: 1rem 0;
+}
+.rich__text ul li {
+  padding: 0.5rem 0;
+}
+
+.banner {
+  background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
+    url("https://cdn.traleor.com/dark-cover.png");
+  background-size: cover;
+  background-position: center;
+  padding: 5rem var(--content-margin);
+}
+
+.banner__content h2 {
+  color: #fff;
+  font-size: var(--font-size-2);
+  margin: 0;
+  margin-bottom: 2rem;
+  text-align: center;
+}
+
+.banner__content h3 {
+  color: #f3f3f3;
+  font-weight: 400;
+  width: 90%;
+  margin: 0;
+  text-align: center;
+  margin-bottom: 2rem;
+}
+
+.list__block__item .banner__content h2 {
+  font-size: var(--font-size-2);
+  text-align: center;
+}
+
+.list__block__item .banner__content h3 {
+  font-size: var(--font-size-3);
+  text-align: center;
+  width: 100%;
+}
+
+.banner__content button {
+  background: #fff;
+  color: var(--main-color);
+}
+
+.authors__wrapper {
+  margin-bottom: 4rem;
+}
+.author {
+  display: flex;
+  align-items: center;
+  gap: 1rem;
+  margin-right: 2%;
+}
+.author img {
+  width: 5rem;
+  height: 5rem;
+  border-radius: 50%;
+}
+
+/* END NOVA STYLES */
 
 /* START */
 
@@ -477,6 +757,27 @@ ul {
   list-style: none;
 }
 
+/* BLOG HEAD */
+.blog_head {
+  padding-top: 6rem;
+}
+.blog_head h2 {
+  font-size: var(--font-size-4);
+}
+
+/* END BLOG HEAD */
+
+.footer__mark {
+  /* text-align: center; */
+  background-color: var(--secondary-color);
+}
+.footer__mark h4 {
+  margin: auto;
+  text-align: center;
+  color: white;
+  padding: 1rem 2rem;
+}
+
 .footer-col {
   width: 25%;
   padding: 0 1rem;
diff --git a/zion/flex_page.html b/zion/flex_page.html
new file mode 100755
index 0000000..76b38e9
--- /dev/null
+++ b/zion/flex_page.html
@@ -0,0 +1,245 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Nova - Traleor Default Template</title>
+    <meta
+      name="description"
+      content="Traleor Template Nova is derived from the Latin word `New` and is the starter template for traleor websites"
+    />
+
+    <link rel="preconnect" href="https://cdn.traleor.com" />
+    <link rel="preconnect" href="https://api.fonts.coollabs.io" crossorigin />
+    <link
+      rel="preload"
+      href="https://cdn.traleor.com/statics/reset.min.css"
+      as="style"
+      onload="this.onload=null;this.rel='stylesheet'"
+    />
+    <link
+      rel="preload"
+      href="https://api.fonts.coollabs.io/css2?family=Inter:wght@300;500;600;700&display=swap"
+      as="style"
+      onload="this.onload=null;this.rel='stylesheet'"
+    />
+    <link rel="stylesheet" href="css/style.css" />
+  </head>
+
+  <body>
+    <div class="">
+      <!-- NAVBAR -------------------------------------------------->
+      <header>
+        <nav>
+          <div id="nav" class="container">
+            <a href="./index.html" class="logo_box">
+              <img src="./images/logo.png" alt="zion_logo" />
+            </a>
+            <div class="menu_links">
+              <ul>
+                <li><a href="./index.html">Home</a></li>
+                <li><a href="./about.html">About Us</a></li>
+                <li><a href="./blog_index.html">Blog</a></li>
+                <button><a href="./contact.html">Contact Us</a></button>
+              </ul>
+            </div>
+            <div class="toggle-menu">
+              <div class="menu_line line1"></div>
+              <div class="menu_line line2"></div>
+              <div class="menu_line line3"></div>
+            </div>
+          </div>
+          <div class="line container"></div>
+        </nav>
+      </header>
+
+      <!------------------------------------------------------->
+      <div
+        class="default-padding full-width flex a-j-center"
+        style="padding-top: 6rem"
+      >
+        <h1>Traleor templates are crafted with love to help you to build</h1>
+      </div>
+
+      <!-- TITLE & TEXT --------------------------------------------->
+      <section class="title__text__wrapper full-width">
+        <div class="title__text__content flex flex-column a-j-center">
+          <h2>Sed ut perspiciatis unde omnis iste natus</h2>
+          <h3>
+            Sed ut perspiciatis unde omnis iste natus error sit voluptatem
+            accusantium doloremque laudantium.
+          </h3>
+        </div>
+      </section>
+
+      <div class="default__LR__padding">
+        <h1>Traleor templates are crafted with love to help you to build</h1>
+      </div>
+      <div class="default__LR__padding">
+        <h2>Traleor templates are crafted with love to help you to build</h2>
+      </div>
+      <div class="default__LR__padding">
+        <h3>Traleor templates are crafted with love to help you to build</h3>
+      </div>
+      <div class="default__LR__padding">
+        <h4>Traleor templates are crafted with love to help you to build</h4>
+      </div>
+
+      <section class="default-padding full-width">
+        <iframe
+          src="https://www.youtube.com/embed/EKe8MA4K5Zk"
+          title="YouTube video player"
+          frameborder="0"
+          allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+          allowfullscreen
+        >
+        </iframe>
+      </section>
+
+      <!-- LIST BLOCK ----------------------------------------------->
+      <section class="list__block default-padding">
+        <!-- <div class="list__block__item">
+          <section class="default-padding full-width">
+            <div class="list__block__item">
+              <figure>
+                <img
+                  src="https://cdn.traleor.com/hill-cover.png"
+                  alt="hill-cover"
+                  style="width: 100%"
+                />
+                <figcaption>Hill Cover - By <a href="">Traleor</a></figcaption>
+              </figure>
+            </div>
+          </section>
+        </div> -->
+
+        <div class="list__block__item">
+          <section class="text__component default-padding full-width">
+            <div class="list__block__item">
+              <div class="rich__text">
+                <h2>No Time to Waste</h2>
+                <h3><b>Sed</b> ut perspiciatis unde omnis iste natus.</h3>
+                <p>
+                  Sed ut perspiciatis unde omnis iste natus error sit
+                  <a href="">voluptatemaccusantium</a> doloremque laudantium,
+                  totam rem aperiam inventore Veritatis
+                </p>
+                <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
+                <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/nyg5Lpl6AiM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
+                <p>
+                  Sed ut perspiciatis unde omnis iste natus error sit
+                  voluptatemaccusantium doloremque laudantium, totam rem aperiam
+                  inventore Veritatis.
+                </p>
+                <ul>
+                  <li>
+                    Sed ut perspiciatis unde omnis iste natus error sit
+                    voluptatemaccusantium doloremque laudantium, totam rem
+                    aperiam inventore Veritatis.
+                  </li>
+                  <li>
+                    Sed ut perspiciatis unde omnis iste natus error sit
+                    voluptatemaccusantium doloremque laudantium, totam rem
+                    aperiam inventore Veritatis.
+                  </li>
+                </ul>
+              </div>
+            </div>
+          </section>
+        </div>
+
+        <!-- <div class="list__block__item">
+          <section class="default-padding full-width">
+            <iframe
+              src="https://www.youtube.com/embed/EKe8MA4K5Zk"
+              title="YouTube video player"
+              frameborder="0"
+              allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+              allowfullscreen
+            >
+            </iframe>
+          </section>
+        </div> -->
+
+        <div class="list__block__item">
+          <section class="title__text__wrapper full-width">
+            <div class="title__text__content flex flex-column a-j-center">
+              <h2>Sed ut perspiciatis unde omnis iste natus</h2>
+              <h3>
+                Sed ut perspiciatis unde omnis iste natus error sit voluptatem
+                accusantium doloremque laudantium.
+              </h3>
+            </div>
+          </section>
+        </div>
+      </section>
+
+      <!-- BANNER --------------------------------------------->
+      <section class="banner flex a-j-center full-width default-padding">
+        <div class="banner__content flex a-j-center flex-column">
+          <h2>Sed ut perspiciatis unde omnis iste</h2>
+          <h3>
+            Sed ut perspiciatis unde omnis iste natus error sit voluptatem
+            accusantium doloremque laudantium.
+          </h3>
+          <a href="">
+            <button class="secondary">Start Building</button>
+          </a>
+        </div>
+      </section>
+
+      <section class="default-padding full-width">
+        <div class="list__block__item">
+          <figure>
+            <img
+              src="../media/hill-cover.png"
+              alt="hill-cover"
+              style="width: 100%"
+            />
+            <figcaption>Hill Cover - By <a href="">Traleor</a></figcaption>
+          </figure>
+        </div>
+      </section>
+
+      <section class="text__component default-padding full-width">
+        <div class="list__block__item">
+          <div class="rich__text">
+            <h2>No Time to Waste</h2>
+            <h3><b>Sed</b> ut perspiciatis unde omnis iste natus.</h3>
+            <p>
+              Sed ut perspiciatis unde omnis iste natus error sit
+              <a href="">voluptatemaccusantium</a> doloremque laudantium, totam
+              rem aperiam inventore Veritatis
+            </p>
+            <!-- <img src="https://cdn.traleor.com/hill-cover.png" alt="hill-cover"> -->
+            <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/nyg5Lpl6AiM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> -->
+            <p>
+              Sed ut perspiciatis unde omnis iste natus error sit
+              voluptatemaccusantium doloremque laudantium, totam rem aperiam
+              inventore Veritatis.
+            </p>
+          </div>
+        </div>
+      </section>
+
+      <section class="full-width flex a-j-center default-padding">
+        <button class="primary"><a href="#">Start Building</a></button>
+      </section>
+      <footer>
+        <div class="footer__mark">
+          <h4>Zion Template - Made By Traleor</h4>
+        </div>
+      </footer>
+    </div>
+
+    <!-- Placed made__mark here for SEO purposes -->
+    <div class="fixed made__mark">
+      <a href="https://traleor.com">
+        <h3>Made With Traleor</h3>
+      </a>
+    </div>
+
+    <script src="js/nova.js"></script>
+  </body>
+</html>
diff --git a/zion/index.html b/zion/index.html
index 5b8ca72..d9bf58e 100644
--- a/zion/index.html
+++ b/zion/index.html
@@ -36,7 +36,7 @@
             <ul>
               <li><a href="./index.html">Home</a></li>
               <li><a href="./about.html">About Us</a></li>
-              <li><a>Blog</a></li>
+              <li><a href="./blog_index.html">Blog</a></li>
               <button><a href="./contact.html">Contact Us</a></button>
             </ul>
           </div>