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

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

  .flex-container > .flexryr > div{
    padding: 16px;
    min-height:480px;
  }

  #ryr_inicio_left{
    width:45%; 
    float: left; 
    text-align: center; 
    vertical-align: middle;
  } 

  #ryr_inicio_right{
    width:50%; 
    float: left;
  } 

  #ryr_facil{
    min-height: 630px;
  }

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

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

  .flexryr_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;
  }

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

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

  .flexryr_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: 1200px) {
    #ryr_facil {
      min-height: 730px;
    }
  }

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

  @media screen and (max-width: 1008px) {
    .flex-container > .flexryr > div {
      min-height: 580px;
    }
  }

  @media screen and (max-width: 968px) {
    #ryr_facil {
      min-height: 830px;
    }
  }

  
  @media screen and (max-width: 864px) {
    .flex-container > .flexryr > div {
      min-height: 680px;
    }

    #ryr_facil {
      min-height: 990px;
      font-size: 14px;
    }
  }

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

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

    .flex-container .flexryr_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;
    }
  }

  /* 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 .flexryr {
      flex: 0 100%;
      width: 100%;
      margin: 10px;
      text-align: center;
      padding: 0px;
    }
  
    .flex-container > .flexryr > div{
      padding: 16px;
      min-height:340px;
    }

    #ryr_inicio_left{
      width:100%; 
      float: none; 
    } 
  
    #ryr_inicio_right{
      width:100%; 
      float: none;
    } 

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

    .flex-container .flexryr_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;
    }

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

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

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