diff --git a/src/components/Banner/Banner.js b/src/components/Banner/Banner.js
index 23091149..a3902d11 100644
--- a/src/components/Banner/Banner.js
+++ b/src/components/Banner/Banner.js
@@ -59,20 +59,20 @@ const Banner = ({ data }) => {
           } `}
       >
         {/* <img src={image?.url} alt={title} /> */}
-        <div className="cont-image">
-          {image?.url && <img
+
+        {image?.url ?
+          <img
             src={theme === "dark" && imageDark ? imageDark?.url : image?.url}
             alt={title}
-          />}
-
-          {animation && <Lottie options={{
-            ...defaultOptions,
-            animationData: animation,
-          }}
-          />}
-        </div>
-
-
+          /> :
+          <div className="cont-lottie">
+            {animation && <Lottie options={{
+              ...defaultOptions,
+              animationData: animation,
+            }}
+            />}
+          </div>
+        }
       </div>
     </div>
   )
diff --git a/src/components/Banner/Banner.scss b/src/components/Banner/Banner.scss
index 1eebd106..5ad2d3de 100644
--- a/src/components/Banner/Banner.scss
+++ b/src/components/Banner/Banner.scss
@@ -19,14 +19,14 @@
       padding: 1rem;
       display: flex;
       justify-content: center;
-      .cont-image {
-        width: 300px;
-        height: 300px;
-      }
       img {
         width: 100%;
         max-width: 540px;
       }
+      .cont-lottie {
+        width: 300px;
+        height: 300px;
+      }
     }
     .title {
       h1 {
@@ -230,7 +230,7 @@
     &.hero {
       .imagen {
         justify-content: flex-end;
-        .cont-image {
+        .cont-lottie {
           width: 600px;
           height: 600px;
         }
@@ -378,7 +378,7 @@
         max-height: 600px;
         overflow: hidden;
         padding: 0;
-        .cont-image {
+        .cont-lottie {
           width: 650px;
           height: 650px;
         }