.flex-container {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    margin: auto;
  }

  .flex-container .flexsupercep {
    flex: 0 33%;
    width: 33%;
    margin: 10px;
    text-align: center;
    padding: 16px;
  }

  .flex-container > .flexsupercep > div{
    padding: 16px;
    min-height:519px;
  }  

  .flex-container .flexsupercep_caracteristicas_left {
    flex: 0 35%;
    width: 35%;
    margin: 10px;
    text-align: center;
  }

  .flex-container .flexsupercep_caracteristicas_right {
    flex: 0 65%;
    width: 65%;
    margin: 10px;
    text-align: center;
    padding: 16px;
  }

  .flexsupercep_caracteristicas_left img{
    max-width: 420px; 
    width: 120%;
    padding-top: 50px;
  }

  .tableCaracteristicas tr{
    transition: all 1s;
    transform-origin: 50% 50%;
  }

  .tableCaracteristicas tr:hover{
    transform: scale(1.2);
  }

  .tableCaracteristicas img{
    width: 150px;
    transition: all 1s;
    transform-origin: 50% 50%;
  }

  .tableCaracteristicas tr:hover img{
    transform: scale(1.1);
  }

  .tablespace20{
    width: 20px;
  }

  .tablespace40{
    width: 40px;
  }

  #tableBeneficios{
    display: table;
  }

  #tableBeneficiosMobile{
    display: none;
  }

  .flex-container .flexsupercep_herramientas {
    flex: 0 40%;
    width: 40%;
    margin: 10px;
  }

  .flex-container .flexsupercep_herramientas_center {
    flex: 0 20%;
    width: 20%;
    margin: 10px;
    position:relative;
  }

  .flexsupercep_herramientas_center img{
    position: absolute;
    bottom: 10px;
    width: 100%;
  }

  .herramienta_container
  {
    display: flex; 
    flex-wrap: nowrap;
    transition: all 1s;
    transform-origin: 50% 50%;
  }

  .herramienta_container:hover{
    transform: scale(1.2);
  }

  .herramienta_flecha{
    width: 25%; 
    flex: 0 25%;
    margin: 5px;
  }

  .herramienta_descripcion{
    width: 75%; 
    flex: 0 75%; 
    padding-top: 10px; 
    padding-left: 10px; 
    text-align: left;
    margin: 5px;
  }

  /* CSS para responsivo */
  @media screen and (max-width: 1128px) {
    .flex-container > .flexsupercep > div {
      min-height: 619px;
    }
  }

  @media screen and (max-width: 1100px){
    .flexsupercep_caracteristicas_left img{
      padding-top: calc(400px - 100%);
    }
  }

  @media screen and (max-width: 984px) {
    .flex-container > .flexsupercep > div {
      min-height: 719px;
    }
  }

  @media screen and (max-width: 896px) {
    .flex-container > .flexsupercep > div {
      min-height: 819px;
      font-size: 14px;
    }
  }

  @media screen and (max-width: 800px) {
    .flex-container .flexsupercep_caracteristicas_left {
      flex: 0 100%;
      width: 100%;
      display: none;
    }

    .flex-container .flexsupercep_caracteristicas_right {
      flex: 0 100%;
      width: 100%;
      margin: 10px 0px 0px;
      text-align: center;
      padding: 16px 0px 0px;
    }

    .tableCaracteristicas{
      padding-bottom: 10px;
    }

    .tableCaracteristicas img{
      width: 100px;
      margin-right: 10px;
    }

    .tablespace20{
      width: 0px;
      display: none;
    }

    .tablespace40{
      width: 0px;
      display: none;
    }
  }

  @media screen and (max-width: 760px) {
    .flex-container > .flexsupercep > div {
      min-height: 919px;
    }
  }

  /* Seccion de estilos para dispositivos móviles */
  @media screen and (max-width: 720px) {
    .flex-container {
      display: block;
      flex-wrap: inherit;
      width: 100%;
      margin: auto;
    }
  
    .flex-container .flexsupercep {
      flex: 0 100%;
      width: 100%;
      margin: 10px;
      text-align: center;
      padding: 0px;
    }
  
    .flex-container > .flexsupercep > div{
      padding: 16px;
      min-height:433px;
      font-size: 16px;
    }

    .flex-container .flexsupercep_caracteristicas_left {
      flex: 0 100%;
      width: 100%;
      display: none;
    }

    .flex-container .flexsupercep_caracteristicas_right {
      flex: 0 100%;
      width: 100%;
      margin: 10px 0px 0px;
      text-align: center;
      padding: 16px 0px 0px;
    }

    .tableCaracteristicas{
      padding-bottom: 10px;
    }

    .tableCaracteristicas img{
      width: 100px;
      margin-right: 10px;
    }

    .tablespace20{
      width: 0px;
      display: none;
    }

    .tablespace40{
      width: 0px;
      display: none;
    }

    #caracteristicas_supercep_2 .titulo{
      display: none;
    }

    #tableBeneficios{
      display: none;
    }

    #tableBeneficiosMobile{
      display: table;
      text-align:left;
    }

    .flex-container .flexsupercep_herramientas {
      flex: 0 100%;
      width: 100%;
      margin: 10px;
    }

    .flex-container .flexsupercep_herramientas_center {
      flex: 0 100%;
      width: 100%;
      margin: 10px;
      position:static;
      text-align: center;
    }

    .flexsupercep_herramientas_center img{
      position: static;
      width: 50%;
    }
  }