diff --git a/src/app/components/busqueda-productos/busqueda-productos.component.html b/src/app/components/busqueda-productos/busqueda-productos.component.html
index 6bae20d..8fbe9b2 100644
--- a/src/app/components/busqueda-productos/busqueda-productos.component.html
+++ b/src/app/components/busqueda-productos/busqueda-productos.component.html
@@ -52,7 +52,7 @@
       </div>      
 
       <!-- SEARCH INPUT -->
-      <div class="col-sm-10">
+      <div *ngIf="productos.length > 0" class="fade-in col-sm-10">
 
         <div class="form-group row search">
           <div class="col-sm-10">
@@ -102,6 +102,12 @@
         </div>
       </div>
 
+      <!-- SPINNER -->
+      <div *ngIf="productos.length === 0"  class="col-sm-10 align-self-center">
+          <div class="spinner-border spinner-lg text-secondary" role="status"></div>
+          <span class="text-secondary m-2 h5">Cargando información.</span>
+      </div>
+
     </div>
 
   </div>
diff --git a/src/app/components/busqueda-productos/busqueda-productos.component.scss b/src/app/components/busqueda-productos/busqueda-productos.component.scss
index 281547f..02a2591 100644
--- a/src/app/components/busqueda-productos/busqueda-productos.component.scss
+++ b/src/app/components/busqueda-productos/busqueda-productos.component.scss
@@ -12,3 +12,8 @@
   min-height: auto !important;
   max-height: 70vh !important;
 }
+
+.spinner-lg{
+  width: 3rem !important;
+  height: 3rem !important;
+}