/* elements generals */

  .btn-back {
      display: block;
      height: 50px;
      width: 50px;
      background-image: url(../img/svg/back-red.svg);
      background-repeat: no-repeat;
      background-size: 50px;
      margin-bottom: -4vh;
  }

  /* end elements generals */
  /* 20px * 20px */

  .add-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/add.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .add-grey-2-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/add-grey.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .add-product-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/add-products.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .edit-20 {
      /*  display: block; */
      width: 20px;
      height: 20px;
      background: url(../img/svg/edit.svg);
      background-size: 20px;
      background-repeat: no-repeat;
  }

  .ia-btn-20 {
      display: block;
      width: 20px;
      height: 20px;
      background: url("../../svg/ai-sc.svg");
      background-size: 20px;
      background-repeat: no-repeat;
  }

  .ia-icon-20 {
      display: block;
      width: 20px;
      height: 20px;
      background: url("../../svg/ia-icon.svg");
      background-size: 20px;
      background-repeat: no-repeat;
  }

  .ia-loading {
      display: block;
      height: 45px;
      width: 170px;
      background-image: url(../../responsive/img/gif/ai-loader.gif);
      background-repeat: no-repeat;
      background-size: 170px;
  }

  .information-20 {
      display: block;
      width: 20px;
      height: 20px;
      background: url("../../svg/information.svg");
      background-size: 20px;
      background-repeat: no-repeat;
  }

  .calculator-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/calculator.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .check-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/check.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .coach-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/coach.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .count-warning-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/counts-warning.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .filter-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/filters.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .hub-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/hub.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .historial-20 {
      display: block;
      width: 20px;
      height: 20px;
      background: url("../../svg/historial.svg");
      background-size: 20px;
      background-repeat: no-repeat;
  }

  .notifications-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/notifications.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .products-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/products.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .scan-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/scan-min.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .settings-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/settings.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .settings-option-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/settings-options.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .support-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/support.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .substract-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/subtract.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .swiftpick-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/swiftpick.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .upload-20 {
      display: block;
      width: 20px;
      height: 20px;
      background: url("../../svg/upload.svg");
      background-size: 20px;
      background-repeat: no-repeat;
  }

  .virtual-space-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/virtual-space.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .cancel-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/close-x.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .delete-20 {
      display: block;
      width: 20px;
      height: 20px;
      background: url(../img/svg/delete.svg);
      background-size: 20px;
      background-repeat: no-repeat;
  }

  .delete-30 {
      display: block;
      width: 30px;
      height: 30px;
      background: url(../img/svg/delete.svg);
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .details-20 {
      display: block;
      width: 20px;
      height: 20px;
      background: url(../img/svg/details.svg);
      background-size: 20px;
      background-repeat: no-repeat;
  }

  .loading-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/gif/loader-001.gif);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  /* 20px * 20px */
  /* 30px * 30px */

  .add-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/add.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .add-product-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/add-products.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .check-mark-30 {
      display: block;
      width: 30px;
      height: 30px;
      background: url("../../svg/check-mark.svg");
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .add-r-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/add-R.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .edit-30 {
      /*  display: block; */
      width: 30px;
      height: 30px;
      background: url(../img/svg/edit.svg);
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .details-30 {
      /*  display: block; */
      width: 30px;
      height: 30px;
      background: url(../img/svg/details.svg);
      background-size: 30px;
      background-repeat: no-repeat;
  }


  .information-30 {
      display: block;
      width: 30px;
      height: 30px;
      background: url("../../svg/information.svg");
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .ia-btn-30 {
      display: block;
      width: 30px;
      height: 30px;
      background: url("../../svg/ai-sc.svg");
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .ia-icon-30 {
      display: block;
      width: 30px;
      height: 30px;
      background: url("../../svg/icono-ai-sc.svg");
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .btn-settings-01 img {
      height: 5rem;
  }

  .box-20 {
      display: block;
      width: 20px;
      height: 20px;
      background: url("../../svg/box.svg");
      background-size: 20px;
      background-repeat: no-repeat;
  }

  .calculator-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/calculator.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .check-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/check.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .coach-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/coach.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .count-warning-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/counts-warning.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .filter-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/filters.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .hub-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/hub.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .historial-30 {
      display: block;
      width: 30px;
      height: 30px;
      background: url("../../svg/historial.svg");
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .notifications-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/notifications.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .products-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/products.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .requisition-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/requisition.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .scan-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/scan-min.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .settings-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/settings.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .settings-option-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/settings-options.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .support-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/support.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .print-30 {
      display: block;
      width: 30px;
      height: 30px;
      background: url("../../svg/print.svg");
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .substract-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/subtract.svg);
      background-repeat: no-repeat;
      background-size: 30px;

  }

  .substract-l-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/subtract-l.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .swiftpick-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/swiftpick.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .upload-30 {
      display: block;
      width: 30px;
      height: 30px;
      background: url("../../svg/upload.svg");
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .virtual-space-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/virtual-space.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  /* 30px * 30px */
  .add-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/add.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  /* 40px * 40px */

  .add-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/add.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .add-product-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/add-products.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .btn-back-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/back-red.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .box-40 {
      display: block;
      width: 40px;
      height: 40px;
      background: url("../../svg/box.svg");
      background-size: 40px;
      background-repeat: no-repeat;
  }


  .btn-back-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/back-red.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .box-30 {
      display: block;
      width: 30px;
      height: 30px;
      background: url("../../svg/box.svg");
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .btn-autoscan-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/btn-autoscan.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }


  .check-mark-40 {
      display: block;
      width: 40px;
      height: 40px;
      background: url("../../svg/check-mark.svg");
      background-size: 40px;
      background-repeat: no-repeat;
  }

  .change-grey-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/change-grey.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .change-red-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/change-red.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .details-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/details.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .serial-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/serial.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .serial-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/serial.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .calculator-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/calculator.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .coach-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/coach.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .count-warning-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/counts-warning.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .filter-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/filters.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .hub-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/hub.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .historial-40 {
      display: block;
      width: 40px;
      height: 40px;
      background: url("../../svg/historial.svg");
      background-size: 40px;
      background-repeat: no-repeat;
  }

  .ia-btn-40 {
      display: block;
      width: 40px;
      height: 40px;
      background: url("../../svg/ai-sc.svg");
      background-size: 40px;
      background-repeat: no-repeat;
  }

  .ia-icon-40 {
      display: block;
      width: 40px;
      height: 40px;
      background: url("../../svg/icono-ai-sc.svg");
      background-size: 40px;
      background-repeat: no-repeat;
  }

  .notifications-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/notifications.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .products-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/products.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .requisition-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/requisition.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .scan-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/scan.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .cam-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/cam.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .settings-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/settings.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .settings-option-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/settings-options.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .support-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/support.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .substract-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/subtract.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .swiftpick-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/swiftpick.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .upload-40 {
      display: block;
      width: 40px;
      height: 40px;
      background: url("../../svg/upload.svg");
      background-size: 40px;
      background-repeat: no-repeat;
  }

  .virtual-space-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/virtual-space.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .loading-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/gif/loader-001.gif);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .print-40 {
      display: block;
      width: 40px;
      height: 40px;
      background: url("../../svg/print.svg");
      background-size: 40px;
      background-repeat: no-repeat;
  }

  /* 40px * 40px */
  /* 60px * 60px */

  .add-60 {
      display: block;
      height: 60px;
      width: 60px;
      background-image: url(../img/svg/add.svg);
      background-repeat: no-repeat;
      background-size: 60px;
  }

  .add-product-60 {
      display: block;
      height: 60px;
      width: 60px;
      background-image: url(../img/svg/add-products.svg);
      background-repeat: no-repeat;
      background-size: 60px;
  }

  .calculator-60 {
      display: block;
      height: 60px;
      width: 60px;
      background-image: url(../img/svg/calculator.svg);
      background-repeat: no-repeat;
      background-size: 60px;
  }

  .coach-60 {
      display: block;
      height: 60px;
      width: 60px;
      background-image: url(../img/svg/coach.svg);
      background-repeat: no-repeat;
      background-size: 60px;
  }

  .count-warning-60 {
      display: block;
      height: 60px;
      width: 60px;
      background-image: url(../img/svg/counts-warning.svg);
      background-repeat: no-repeat;
      background-size: 60px;
  }

  .check-60 {
      display: block;
      height: 60px;
      width: 60px;
      background-image: url(../img/svg/check.svg);
      background-repeat: no-repeat;
      background-size: 60px;
  }

  .details-60 {
      display: block;
      height: 60px;
      width: 60px;
      background-image: url(../img/svg/details.svg);
      background-repeat: no-repeat;
      background-size: 60px;
  }

  .hub-60 {
      display: block;
      height: 60px;
      width: 60px;
      background-image: url(../img/svg/hub.svg);
      background-repeat: no-repeat;
      background-size: 60px;
  }

  .historial-60 {
      display: block;
      width: 60px;
      height: 60px;
      background: url("../../svg/historial.svg");
      background-size: 60px;
      background-repeat: no-repeat;
  }

  .notifications-60 {
      display: block;
      height: 60px;
      width: 60px;
      background-image: url(../img/svg/notifications.svg);
      background-repeat: no-repeat;
      background-size: 60px;
  }

  .products-60 {
      display: block;
      height: 60px;
      width: 60px;
      background-image: url(../img/svg/products.svg);
      background-repeat: no-repeat;
      background-size: 60px;
  }

  .requisition-60 {
      display: block;
      height: 60px;
      width: 60px;
      background-image: url(../img/svg/requisition.svg);
      background-repeat: no-repeat;
      background-size: 60px;
  }

  .scan-60 {
      display: block;
      height: 60px;
      width: 60px;
      background-image: url(../img/svg/scan-min.svg);
      background-repeat: no-repeat;
      background-size: 60px;
  }

  .settings-60 {
      display: block;
      height: 60px;
      width: 60px;
      background-image: url(../img/svg/settings.svg);
      background-repeat: no-repeat;
      background-size: 60px;
  }

  .settings-option-60 {
      display: block;
      height: 60px;
      width: 60px;
      background-image: url(../img/svg/settings-options.svg);
      background-repeat: no-repeat;
      background-size: 60px;
  }

  .support-60 {
      display: block;
      height: 60px;
      width: 60px;
      background-image: url(../img/svg/support.svg);
      background-repeat: no-repeat;
      background-size: 60px;
  }

  .substract-60 {
      display: block;
      height: 60px;
      width: 60px;
      background-image: url(../img/svg/subtract.svg);
      background-repeat: no-repeat;
      background-size: 60px;
  }

  .swiftpick-60 {
      display: block;
      height: 60px;
      width: 60px;
      background-image: url(../img/svg/swiftpick.svg);
      background-repeat: no-repeat;
      background-size: 60px;
  }

  .upload-60 {
      display: block;
      width: 60px;
      height: 60px;
      background: url("../../svg/upload.svg");
      background-size: 60px;
      background-repeat: no-repeat;
  }

  .virtual-space-60 {
      display: block;
      height: 60px;
      width: 60px;
      background-image: url(../img/svg/virtual-space.svg);
      background-repeat: no-repeat;
      background-size: 60px;
  }

  /* 60px * 60px */
  /* 70px * 70px */

  .add-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/add.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .add-product-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/add-products.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .calculator-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/calculator.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .coach-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/coach.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .count-warning-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/counts-warning.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .check-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/check.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .details-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/details.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .hub-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/hub.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .historial-70 {
      display: block;
      width: 70px;
      height: 70px;
      background: url("../../svg/historial.svg");
      background-size: 70px;
      background-repeat: no-repeat;
  }

  .ia-btn-70 {
      display: block;
      width: 70px;
      height: 70px;
      background: url("../../svg/ai-sc.svg");
      background-size: 70px;
      background-repeat: no-repeat;
  }

  .ia-icon-70 {
      display: block;
      width: 70px;
      height: 70px;
      background: url("../../svg/icono-ai-sc.svg");
      background-size: 70px;
      background-repeat: no-repeat;
  }

  .notifications-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/notifications.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .products-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/products.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .scan-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/scan-min.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .settings-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/settings.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .settings-option-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/settings-options.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .support-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/support.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .substract-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/subtract.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .swiftpick-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/swiftpick.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .upload-70 {
      display: block;
      width: 70px;
      height: 70px;
      background: url("../../svg/upload.svg");
      background-size: 70px;
      background-repeat: no-repeat;
  }

  .virtual-space-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/virtual-space.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  /* 70px * 70px */
  /* 100px * 100px */
  .add-product-100 {
      display: block;
      height: 100px;
      width: 100px;
      background-image: url(../img/svg/add-products.svg);
      background-repeat: no-repeat;
      background-size: 100px;
  }

  .calculator-100 {
      display: block;
      height: 100px;
      width: 100px;
      background-image: url(../img/svg/calculator.svg);
      background-repeat: no-repeat;
      background-size: 100px;
  }

  .coach-100 {
      display: block;
      height: 100px;
      width: 100px;
      background-image: url(../img/svg/coach.svg);
      background-repeat: no-repeat;
      background-size: 100px;
  }

  .count-warning-100 {
      display: block;
      height: 100px;
      width: 100px;
      background-image: url(../img/svg/counts-warning.svg);
      background-repeat: no-repeat;
      background-size: 100px;
  }

  .check-100 {
      display: block;
      height: 100px;
      width: 100px;
      background-image: url(../img/svg/check.svg);
      background-repeat: no-repeat;
      background-size: 100px;
  }

  .hub-100 {
      display: block;
      height: 100px;
      width: 100px;
      background-image: url(../img/svg/hub.svg);
      background-repeat: no-repeat;
      background-size: 100px;
  }

  .historial-100 {
      display: block;
      width: 100px;
      height: 100px;
      background: url("../../svg/historial.svg");
      background-size: 100px;
      background-repeat: no-repeat;
  }

  .ia-btn-100 {
      display: block;
      width: 100px;
      height: 100px;
      background: url("../../svg/ai-sc.svg");
      background-size: 100px;
      background-repeat: no-repeat;
  }

  .ia-icon-100 {
      display: block;
      width: 100px;
      height: 100px;
      background: url("../../svg/icono-ai-sc.svg");
      background-size: 100px;
      background-repeat: no-repeat;
  }

  .notifications-100 {
      display: block;
      height: 100px;
      width: 100px;
      background-image: url(../img/svg/notifications.svg);
      background-repeat: no-repeat;
      background-size: 100px;
  }

  .products-100 {
      display: block;
      height: 100px;
      width: 100px;
      background-image: url(../img/svg/products.svg);
      background-repeat: no-repeat;
      background-size: 100px;
  }

  .scan-100 {
      display: block;
      height: 100px;
      width: 100px;
      background-image: url(../img/svg/scan-min.svg);
      background-repeat: no-repeat;
      background-size: 100px;
  }

  .settings-100 {
      display: block;
      height: 100px;
      width: 100px;
      background-image: url(../img/svg/settings.svg);
      background-repeat: no-repeat;
      background-size: 100px;
  }

  .settings-option-100 {
      display: block;
      height: 100px;
      width: 100px;
      background-image: url(../img/svg/settings-options.svg);
      background-repeat: no-repeat;
      background-size: 100px;
  }

  .support-100 {
      display: block;
      height: 100px;
      width: 100px;
      background-image: url(../img/svg/support.svg);
      background-repeat: no-repeat;
      background-size: 100px;
  }

  .substract-100 {
      display: block;
      height: 100px;
      width: 100px;
      background-image: url(../img/svg/subtract.svg);
      background-repeat: no-repeat;
      background-size: 100px;
  }

  .swiftpick-100 {
      display: block;
      height: 100px;
      width: 100px;
      background-image: url(../img/svg/swiftpick.svg);
      background-repeat: no-repeat;
      background-size: 100px;
  }

  .upload-100 {
      display: block;
      width: 100px;
      height: 100px;
      background: url("../../svg/upload.svg");
      background-size: 100px;
      background-repeat: no-repeat;
  }

  .virtual-space-100 {
      display: block;
      height: 100px;
      width: 100px;
      background-image: url(../img/svg/virtual-space.svg);
      background-repeat: no-repeat;
      background-size: 100px;
  }

  /* 100px * 100px */

  @media (min-width: 1280px) {
      .logo {
          background-image: url(../img/svg/logotipo.svg);
          background-size: auto;
          background-repeat: no-repeat;
          height: 6vh;
          margin: 10px;
      }

      .logo-f {
          background-image: url(../img/svg/logotipo-fff.svg);
          background-size: auto;
          background-repeat: no-repeat;
          height: 6vh;
          margin: 10px;
      }
  }

  @media (min-width: 1024px) and (max-width: 1280px) {
      .logo {
          background-image: url(../img/svg/logotipo.svg);
          background-size: auto;
          background-repeat: no-repeat;
          height: 6vh;
          margin: 10px;
      }

      .logo-f {
          background-image: url(../img/svg/logotipo.svg);
          background-size: auto;
          background-repeat: no-repeat;
          height: 6vh;
          margin: 10px;
      }
  }

  @media (min-width: 768px) and (max-width: 1024px) {
      .logo {
          background-image: url(../img/svg/logotipo.svg);
          background-size: auto;
          background-repeat: no-repeat;
          height: 6vh;
          margin: 10px;
      }

      .logo-f {
          background-image: url(../img/svg/logotipo.svg);
          background-size: auto;
          background-repeat: no-repeat;
          height: 6vh;
          margin: 10px;
      }
  }

  @media (min-width: 280px)and (max-width: 767px) {
      .logo {
          background-image: url(../img/svg/logo-mobile.svg);
          background-position: center;
          background-size: auto;
          background-repeat: no-repeat;
          height: 15vh;
          width: 100%;
          margin-top: 8vh;
          margin-bottom: 1vh;
      }

      .logo-f {
          background-image: url(../img/svg/logo-mobile.svg);
          background-position: center;
          background-size: auto;
          background-repeat: no-repeat;
          height: 15vh;
          width: 100%;
          margin-top: 8vh;
          margin-bottom: 1vh;
      }

      .logo-none {
          display: none !important;
      }
  }


  .complete-sale-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/complete-sale.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .complete-sale-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/complete-sale.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .complete-sale-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/complete-sale.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .complete-sale-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/complete-sale.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .complete-sale-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/complete-sale.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .complete-sale-100 {
      display: block;
      height: 100px;
      width: 100px;
      background-image: url(../img/svg/complete-sale.svg);
      background-repeat: no-repeat;
      background-size: 100px;
  }

  .male-01-30 {
      display: block;
      width: 30px !important;
      height: 30px;
      background: url("../../svg/male-01.svg");
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .male-01-40 {
      display: block;
      width: 40px !important;
      height: 40px;
      background: url("../../svg/male-01.svg");
      background-size: 40px;
      background-repeat: no-repeat;
  }

  .warning-message-20 {
      display: block;
      width: 20px;
      height: 20px;
      background: url("../../svg/warning-messages.svg");
      background-size: 20px;
  }

  .warning-message-40 {
      display: block;
      width: 40px;
      height: 40px;
      background: url("../../svg/warning-messages.svg");
      background-size: 40px;
  }

  .sale-issue-40 {
      display: block;
      width: 40px;
      height: 40px;
      background: url("../../svg/sale-issue.svg");
      background-size: 40px;
      background-repeat: no-repeat;
  }

  .sale-issue-30 {
      display: block;
      width: 30px;
      height: 30px;
      background: url("../../svg/sale-issue.svg");
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .male-01-40 {
      display: block;
      width: 40px !important;
      height: 40px;
      background: url("../../svg/male-01.svg");
      background-size: 40px;
      background-repeat: no-repeat;
  }

  /* new icons 2023 */
  /* current-sales */
  .current-sales-20 {
      display: block;
      width: 20px;
      height: 20px;
      background: url("../../svg/current-sales.svg");
      background-size: 20px;
      background-repeat: no-repeat;
  }

  .current-sales-30 {
      display: block;
      width: 30px;
      height: 30px;
      background: url("../../svg/current-sales.svg");
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .current-sales-40 {
      display: block;
      width: 40px;
      height: 40px;
      background: url("../../svg/current-sales.svg");
      background-size: 40px;
      background-repeat: no-repeat;
  }

  .current-sales-70 {
      display: block;
      width: 70px;
      height: 70px;
      background: url("../../svg/current-sales.svg");
      background-size: 70px;
      background-repeat: no-repeat;
  }

  .current-sales-100 {
      display: block;
      width: 100px;
      height: 100px;
      background: url("../../svg/current-sales.svg");
      background-size: 100px;
      background-repeat: no-repeat;
  }

  /* current-sales */
  /* sales-magnament */
  .sales-magnament-20 {
      display: block;
      width: 20px;
      height: 20px;
      background: url("../../svg/sales-magnament.svg");
      background-size: 20px;
      background-repeat: no-repeat;
  }

  .sales-magnament-30 {
      display: block;
      width: 30px;
      height: 30px;
      background: url("../../svg/sales-magnament.svg");
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .sales-magnament-40 {
      display: block;
      width: 40px;
      height: 40px;
      background: url("../../svg/sales-magnament.svg");
      background-size: 40px;
      background-repeat: no-repeat;
  }

  .sales-magnament-70 {
      display: block;
      width: 70px;
      height: 70px;
      background: url("../../svg/sales-magnament.svg");
      background-size: 70px;
      background-repeat: no-repeat;
  }

  .sales-magnament-100 {
      display: block;
      width: 100px;
      height: 100px;
      background: url("../../svg/sales-magnament.svg");
      background-size: 100px;
      background-repeat: no-repeat;
  }

  /* sales-magnament */
  /* sales */
  .sales-20 {
      display: block;
      width: 20px;
      height: 20px;
      background: url("../../svg/sales.svg");
      background-size: 20px;
      background-repeat: no-repeat;
  }

  .sales-30 {
      display: block;
      width: 30px;
      height: 30px;
      background: url("../../svg/sales.svg");
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .sales-40 {
      display: block;
      width: 40px;
      height: 40px;
      background: url("../../svg/sales.svg");
      background-size: 40px;
      background-repeat: no-repeat;
  }

  .sales-70 {
      display: block;
      width: 70px;
      height: 70px;
      background: url("../../svg/sales.svg");
      background-size: 70px;
      background-repeat: no-repeat;
  }

  .sales-100 {
      display: block;
      width: 100px;
      height: 100px;
      background: url("../../svg/sales.svg");
      background-size: 100px;
      background-repeat: no-repeat;
  }

  /* sales */
  /* return-magnament */
  .returns-magnament-20 {
      display: block;
      width: 20px;
      height: 20px;
      background: url("../../svg/returns-magnament.svg");
      background-size: 20px;
      background-repeat: no-repeat;
  }

  .returns-magnament-30 {
      display: block;
      width: 30px;
      height: 30px;
      background: url("../../svg/returns-magnament.svg");
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .returns-magnament-40 {
      display: block;
      width: 40px;
      height: 40px;
      background: url("../../svg/returns-magnament.svg");
      background-size: 40px;
      background-repeat: no-repeat;
  }

  .returns-magnament-70 {
      display: block;
      width: 70px;
      height: 70px;
      background: url("../../svg/returns-magnament.svg");
      background-size: 70px;
      background-repeat: no-repeat;
  }

  .returns-magnament-100 {
      display: block;
      width: 100px;
      height: 100px;
      background: url("../../svg/returns-magnament.svg");
      background-size: 100px;
      background-repeat: no-repeat;
  }

  /* return-magnament */
  /* current-returns */
  .current-returns-20 {
      display: block;
      width: 20px;
      height: 20px;
      background: url("../../svg/current-returns.svg");
      background-size: 20px;
      background-repeat: no-repeat;
  }

  .current-returns-30 {
      display: block;
      width: 30px;
      height: 30px;
      background: url("../../svg/current-returns.svg");
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .current-returns-40 {
      display: block;
      width: 40px;
      height: 40px;
      background: url("../../svg/current-returns.svg");
      background-size: 40px;
      background-repeat: no-repeat;
  }

  .current-returns-70 {
      display: block;
      width: 70px;
      height: 70px;
      background: url("../../svg/current-returns.svg");
      background-size: 70px;
      background-repeat: no-repeat;
  }

  .current-returns-100 {
      display: block;
      width: 100px;
      height: 100px;
      background: url("../../svg/current-returns.svg");
      background-size: 100px;
      background-repeat: no-repeat;
  }

  /* current-returns */

  .observations-20 {
      display: block;
      width: 20px;
      height: 20px;
      background: url("../../svg/observations.svg");
      background-size: 20px;
      background-repeat: no-repeat;
  }

  .observations-30 {
      display: block;
      width: 30px;
      height: 30px;
      background: url("../../svg/observations.svg");
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .observations-40 {
      display: block;
      width: 40px;
      height: 40px;
      background: url("../../svg/observations.svg");
      background-size: 40px;
      background-repeat: no-repeat;
  }

  .observations-60 {
      display: block;
      width: 60px;
      height: 60px;
      background: url("../../svg/observations.svg");
      background-size: 60px;
      background-repeat: no-repeat;
  }

  .observations-70 {
      display: block;
      width: 70px;
      height: 70px;
      background: url("../../svg/observations.svg");
      background-size: 70px;
      background-repeat: no-repeat;
  }

  .observations-100 {
      display: block;
      width: 100px;
      height: 100px;
      background: url("../../svg/observations.svg");
      background-size: 100px;
      background-repeat: no-repeat;
  }

  .sdelivery-20 {
      display: block;
      width: 20px;
      height: 20px;
      background: url("../../svg/sdelivery.svg");
      background-size: 20px;
      background-repeat: no-repeat;
  }

  .sdelivery-30 {
      display: block;
      width: 30px;
      height: 30px;
      background: url("../../svg/sdelivery.svg");
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .sdelivery-40 {
      display: block;
      width: 40px;
      height: 40px;
      background: url("../../svg/sdelivery.svg");
      background-size: 40px;
      background-repeat: no-repeat;
  }

  .sdelivery-60 {
      display: block;
      width: 60px;
      height: 60px;
      background: url("../../svg/sdelivery.svg");
      background-size: 60px;
      background-repeat: no-repeat;
  }

  .sdelivery-70 {
      display: block;
      width: 70px;
      height: 70px;
      background: url("../../svg/sdelivery.svg");
      background-size: 70px;
      background-repeat: no-repeat;
  }

  .sdelivery-100 {
      display: block;
      width: 100px;
      height: 100px;
      background: url("../../svg/sdelivery.svg");
      background-size: 100px;
      background-repeat: no-repeat;
  }

  .state-merchandise-20 {
      display: block;
      width: 20px;
      height: 20px;
      background: url("../../svg/state-merchandise.svg");
      background-size: 20px;
      background-repeat: no-repeat;
  }

  .state-merchandise-30 {
      display: block;
      width: 30px;
      height: 30px;
      background: url("../../svg/state-merchandise.svg");
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .state-merchandise-40 {
      display: block;
      width: 40px;
      height: 40px;
      background: url("../../svg/state-merchandise.svg");
      background-size: 40px;
      background-repeat: no-repeat;
  }

  .state-merchandise-60 {
      display: block;
      width: 60px;
      height: 60px;
      background: url("../../svg/state-merchandise.svg");
      background-size: 60px;
      background-repeat: no-repeat;
  }

  .state-merchandise-70 {
      display: block;
      width: 70px;
      height: 70px;
      background: url("../../svg/state-merchandise.svg");
      background-size: 70px;
      background-repeat: no-repeat;
  }

  .state-merchandise-100 {
      display: block;
      width: 100px;
      height: 100px;
      background: url("../../svg/state-merchandise.svg");
      background-size: 100px;
      background-repeat: no-repeat;
  }

  .save-30 {
      display: block;
      width: 30px;
      height: 30px;
      background: url("../../svg/save.svg");
      background-size: 30px;
      background-repeat: no-repeat;
  }

  .save-20 {
      display: block;
      width: 20px;
      height: 20px;
      background: url("../../svg/save.svg");
      background-size: 20px;
      background-repeat: no-repeat;
  }

  /* return */
  .returns-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/returns.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  .returns-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/returns.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .returns-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/returns.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .returns-60 {
      display: block;
      height: 60px;
      width: 60px;
      background-image: url(../img/svg/returns.svg);
      background-repeat: no-repeat;
      background-size: 60px;
  }

  .returns-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/returns.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .returns-100 {
      display: block;
      height: 100px;
      width: 100px;
      background-image: url(../img/svg/returns.svg);
      background-repeat: no-repeat;
      background-size: 100px;
  }

  /* return */
  /* complete-form */
  .complete-form-100 {
      display: block;
      height: 100px;
      width: 100px;
      background-image: url(../img/svg/complete-form.svg);
      background-repeat: no-repeat;
      background-size: 100px;
  }

  .complete-form-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/complete-form.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .complete-form-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/complete-form.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .complete-form-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/complete-form.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .complete-form-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/complete-form.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  /* complete-form */
  /* fragmented-exits */
  .fragmented-exits-100 {
      display: block;
      height: 100px;
      width: 100px;
      background-image: url(../img/svg/fragmented-exits.svg);
      background-repeat: no-repeat;
      background-size: 100px;
  }

  .fragmented-exits-70 {
      display: block;
      height: 70px;
      width: 70px;
      background-image: url(../img/svg/fragmented-exits.svg);
      background-repeat: no-repeat;
      background-size: 70px;
  }

  .fragmented-exits-40 {
      display: block;
      height: 40px;
      width: 40px;
      background-image: url(../img/svg/fragmented-exits.svg);
      background-repeat: no-repeat;
      background-size: 40px;
  }

  .fragmented-exits-30 {
      display: block;
      height: 30px;
      width: 30px;
      background-image: url(../img/svg/fragmented-exits.svg);
      background-repeat: no-repeat;
      background-size: 30px;
  }

  .fragmented-exits-20 {
      display: block;
      height: 20px;
      width: 20px;
      background-image: url(../img/svg/fragmented-exits.svg);
      background-repeat: no-repeat;
      background-size: 20px;
  }

  /* fragmented-exits */

  .wifi-signal-full {
      background: url("../../svg/signal/full.svg");
      background-repeat: no-repeat;
      background-size: 3.5rem;
      display: block;
      height: 4.5rem;
      width: 4.5rem;

  }

  .wifi-signal-medium {
      background: url("../../svg/signal/medium.svg");
      background-repeat: no-repeat;
      background-size: 3.5rem;
      display: block;
      height: 4.5rem;
      width: 4.5rem;
  }

  .wifi-signal-low {
      background: url("../../svg/signal/low.svg");
      background-repeat: no-repeat;
      background-size: 3.5rem;
      display: block;
      height: 4.5rem;
      width: 4.5rem;
  }

  .wifi-signal-no {
      background: url("../../svg/signal/no-signal.svg");
      background-repeat: no-repeat;
      background-size: 3.5rem;
      display: block;
      height: 4.5rem;
      width: 4.5rem;
  }

  .step-one {
      display: block;
      width: 50px;
      height: 50px;
      background: url(../../css/phases/img/hub.svg);
      background-size: 50px;
      background-repeat: no-repeat;
  }

  .step-alert {
      display: block;
      width: 50px;
      height: 50px;
      background: url(../../css/phases/img/point-alert.svg);
      background-size: 50px;
      background-repeat: no-repeat;
  }

  .clock-alert {
      display: block;
      width: 50px;
      height: 50px;
      background: url(../../css/phases/img/clock-alert.svg);
      background-size: 50px;
      background-repeat: no-repeat;
  }

  .check-alert {
      display: block;
      width: 50px;
      height: 50px;
      background: url(../../css/phases/img/check-alert.svg);
      background-size: 50px;
      background-repeat: no-repeat;
  }

  .step-final {
      display: block;
      width: 50px;
      height: 50px;
      background: url(../../svg/pennat.svg);
      background-size: 50px;
      background-repeat: no-repeat;
  }

  .step-current {
      display: block;
      width: 50px;
      height: 50px;
      background: url(../../svg/walk-step.svg);
      background-size: 50px;
      background-repeat: no-repeat;
  }