
    .translate-10-pct{
      transform: translate(10%,10%);
    }
  
      .translate--10-pct{
        transform: translate(-10%,-10%);
      }
    
    .translate-1{
      transform: translate(calc(1px * 1),calc(1px * 1));
    }
  
    .translate-1m{
      transform: translate(calc(var(--px-min-unit) * 1),calc(var(--px-min-unit) * 1));
    }
  
    .translate-1x{
      transform: translate(calc(1px * 1 * 10),calc(1px * 1 * 10));
    }
  
    .translate-1mx{
      transform: translate(calc(var(--px-min-unit) * 1 * 10),calc(var(--px-min-unit) * 1 * 10));
    }
  
    .translate-1mxx{
      transform: translate(calc(var(--px-min-unit) * 1 * 100),calc(var(--px-min-unit) * 1 * 100));
    }
  
    .translate--1{
      transform: translate(calc(1px * 1 * -1),calc(1px * 1 * -1));
    }
  
    .translate--1m{
      transform: translate(calc(var(--px-min-unit) * 1 * -1),calc(var(--px-min-unit) * 1 * -1));
    }
  
    .translate--1x{
      transform: translate(calc(1px * 1 * 10 * -1),calc(1px * 1 * 10 * -1));
    }
  
    .translate--1mx{
      transform: translate(calc(var(--px-min-unit) * 1 * 10 * -1),calc(var(--px-min-unit) * 1 * 10 * -1));
    }
  
    .translate--1mxx{
      transform: translate(calc(var(--px-min-unit) * 1 * 100 * -1),calc(var(--px-min-unit) * 1 * 100 * -1));
    }
  
    .translate-20-pct{
      transform: translate(20%,20%);
    }
  
      .translate--20-pct{
        transform: translate(-20%,-20%);
      }
    
    .translate-2{
      transform: translate(calc(1px * 2),calc(1px * 2));
    }
  
    .translate-2m{
      transform: translate(calc(var(--px-min-unit) * 2),calc(var(--px-min-unit) * 2));
    }
  
    .translate-2x{
      transform: translate(calc(1px * 2 * 10),calc(1px * 2 * 10));
    }
  
    .translate-2mx{
      transform: translate(calc(var(--px-min-unit) * 2 * 10),calc(var(--px-min-unit) * 2 * 10));
    }
  
    .translate-2mxx{
      transform: translate(calc(var(--px-min-unit) * 2 * 100),calc(var(--px-min-unit) * 2 * 100));
    }
  
    .translate--2{
      transform: translate(calc(1px * 2 * -1),calc(1px * 2 * -1));
    }
  
    .translate--2m{
      transform: translate(calc(var(--px-min-unit) * 2 * -1),calc(var(--px-min-unit) * 2 * -1));
    }
  
    .translate--2x{
      transform: translate(calc(1px * 2 * 10 * -1),calc(1px * 2 * 10 * -1));
    }
  
    .translate--2mx{
      transform: translate(calc(var(--px-min-unit) * 2 * 10 * -1),calc(var(--px-min-unit) * 2 * 10 * -1));
    }
  
    .translate--2mxx{
      transform: translate(calc(var(--px-min-unit) * 2 * 100 * -1),calc(var(--px-min-unit) * 2 * 100 * -1));
    }
  
    .translate-30-pct{
      transform: translate(30%,30%);
    }
  
      .translate--30-pct{
        transform: translate(-30%,-30%);
      }
    
    .translate-3{
      transform: translate(calc(1px * 3),calc(1px * 3));
    }
  
    .translate-3m{
      transform: translate(calc(var(--px-min-unit) * 3),calc(var(--px-min-unit) * 3));
    }
  
    .translate-3x{
      transform: translate(calc(1px * 3 * 10),calc(1px * 3 * 10));
    }
  
    .translate-3mx{
      transform: translate(calc(var(--px-min-unit) * 3 * 10),calc(var(--px-min-unit) * 3 * 10));
    }
  
    .translate-3mxx{
      transform: translate(calc(var(--px-min-unit) * 3 * 100),calc(var(--px-min-unit) * 3 * 100));
    }
  
    .translate--3{
      transform: translate(calc(1px * 3 * -1),calc(1px * 3 * -1));
    }
  
    .translate--3m{
      transform: translate(calc(var(--px-min-unit) * 3 * -1),calc(var(--px-min-unit) * 3 * -1));
    }
  
    .translate--3x{
      transform: translate(calc(1px * 3 * 10 * -1),calc(1px * 3 * 10 * -1));
    }
  
    .translate--3mx{
      transform: translate(calc(var(--px-min-unit) * 3 * 10 * -1),calc(var(--px-min-unit) * 3 * 10 * -1));
    }
  
    .translate--3mxx{
      transform: translate(calc(var(--px-min-unit) * 3 * 100 * -1),calc(var(--px-min-unit) * 3 * 100 * -1));
    }
  
    .translate-40-pct{
      transform: translate(40%,40%);
    }
  
      .translate--40-pct{
        transform: translate(-40%,-40%);
      }
    
    .translate-4{
      transform: translate(calc(1px * 4),calc(1px * 4));
    }
  
    .translate-4m{
      transform: translate(calc(var(--px-min-unit) * 4),calc(var(--px-min-unit) * 4));
    }
  
    .translate-4x{
      transform: translate(calc(1px * 4 * 10),calc(1px * 4 * 10));
    }
  
    .translate-4mx{
      transform: translate(calc(var(--px-min-unit) * 4 * 10),calc(var(--px-min-unit) * 4 * 10));
    }
  
    .translate-4mxx{
      transform: translate(calc(var(--px-min-unit) * 4 * 100),calc(var(--px-min-unit) * 4 * 100));
    }
  
    .translate--4{
      transform: translate(calc(1px * 4 * -1),calc(1px * 4 * -1));
    }
  
    .translate--4m{
      transform: translate(calc(var(--px-min-unit) * 4 * -1),calc(var(--px-min-unit) * 4 * -1));
    }
  
    .translate--4x{
      transform: translate(calc(1px * 4 * 10 * -1),calc(1px * 4 * 10 * -1));
    }
  
    .translate--4mx{
      transform: translate(calc(var(--px-min-unit) * 4 * 10 * -1),calc(var(--px-min-unit) * 4 * 10 * -1));
    }
  
    .translate--4mxx{
      transform: translate(calc(var(--px-min-unit) * 4 * 100 * -1),calc(var(--px-min-unit) * 4 * 100 * -1));
    }
  
    .translate-50-pct{
      transform: translate(50%,50%);
    }
  
      .translate--50-pct{
        transform: translate(-50%,-50%);
      }
    
    .translate-5{
      transform: translate(calc(1px * 5),calc(1px * 5));
    }
  
    .translate-5m{
      transform: translate(calc(var(--px-min-unit) * 5),calc(var(--px-min-unit) * 5));
    }
  
    .translate-5x{
      transform: translate(calc(1px * 5 * 10),calc(1px * 5 * 10));
    }
  
    .translate-5mx{
      transform: translate(calc(var(--px-min-unit) * 5 * 10),calc(var(--px-min-unit) * 5 * 10));
    }
  
    .translate-5mxx{
      transform: translate(calc(var(--px-min-unit) * 5 * 100),calc(var(--px-min-unit) * 5 * 100));
    }
  
    .translate--5{
      transform: translate(calc(1px * 5 * -1),calc(1px * 5 * -1));
    }
  
    .translate--5m{
      transform: translate(calc(var(--px-min-unit) * 5 * -1),calc(var(--px-min-unit) * 5 * -1));
    }
  
    .translate--5x{
      transform: translate(calc(1px * 5 * 10 * -1),calc(1px * 5 * 10 * -1));
    }
  
    .translate--5mx{
      transform: translate(calc(var(--px-min-unit) * 5 * 10 * -1),calc(var(--px-min-unit) * 5 * 10 * -1));
    }
  
    .translate--5mxx{
      transform: translate(calc(var(--px-min-unit) * 5 * 100 * -1),calc(var(--px-min-unit) * 5 * 100 * -1));
    }
  
    .translate-60-pct{
      transform: translate(60%,60%);
    }
  
      .translate--60-pct{
        transform: translate(-60%,-60%);
      }
    
    .translate-6{
      transform: translate(calc(1px * 6),calc(1px * 6));
    }
  
    .translate-6m{
      transform: translate(calc(var(--px-min-unit) * 6),calc(var(--px-min-unit) * 6));
    }
  
    .translate-6x{
      transform: translate(calc(1px * 6 * 10),calc(1px * 6 * 10));
    }
  
    .translate-6mx{
      transform: translate(calc(var(--px-min-unit) * 6 * 10),calc(var(--px-min-unit) * 6 * 10));
    }
  
    .translate-6mxx{
      transform: translate(calc(var(--px-min-unit) * 6 * 100),calc(var(--px-min-unit) * 6 * 100));
    }
  
    .translate--6{
      transform: translate(calc(1px * 6 * -1),calc(1px * 6 * -1));
    }
  
    .translate--6m{
      transform: translate(calc(var(--px-min-unit) * 6 * -1),calc(var(--px-min-unit) * 6 * -1));
    }
  
    .translate--6x{
      transform: translate(calc(1px * 6 * 10 * -1),calc(1px * 6 * 10 * -1));
    }
  
    .translate--6mx{
      transform: translate(calc(var(--px-min-unit) * 6 * 10 * -1),calc(var(--px-min-unit) * 6 * 10 * -1));
    }
  
    .translate--6mxx{
      transform: translate(calc(var(--px-min-unit) * 6 * 100 * -1),calc(var(--px-min-unit) * 6 * 100 * -1));
    }
  
    .translate-70-pct{
      transform: translate(70%,70%);
    }
  
      .translate--70-pct{
        transform: translate(-70%,-70%);
      }
    
    .translate-7{
      transform: translate(calc(1px * 7),calc(1px * 7));
    }
  
    .translate-7m{
      transform: translate(calc(var(--px-min-unit) * 7),calc(var(--px-min-unit) * 7));
    }
  
    .translate-7x{
      transform: translate(calc(1px * 7 * 10),calc(1px * 7 * 10));
    }
  
    .translate-7mx{
      transform: translate(calc(var(--px-min-unit) * 7 * 10),calc(var(--px-min-unit) * 7 * 10));
    }
  
    .translate-7mxx{
      transform: translate(calc(var(--px-min-unit) * 7 * 100),calc(var(--px-min-unit) * 7 * 100));
    }
  
    .translate--7{
      transform: translate(calc(1px * 7 * -1),calc(1px * 7 * -1));
    }
  
    .translate--7m{
      transform: translate(calc(var(--px-min-unit) * 7 * -1),calc(var(--px-min-unit) * 7 * -1));
    }
  
    .translate--7x{
      transform: translate(calc(1px * 7 * 10 * -1),calc(1px * 7 * 10 * -1));
    }
  
    .translate--7mx{
      transform: translate(calc(var(--px-min-unit) * 7 * 10 * -1),calc(var(--px-min-unit) * 7 * 10 * -1));
    }
  
    .translate--7mxx{
      transform: translate(calc(var(--px-min-unit) * 7 * 100 * -1),calc(var(--px-min-unit) * 7 * 100 * -1));
    }
  
    .translate-80-pct{
      transform: translate(80%,80%);
    }
  
      .translate--80-pct{
        transform: translate(-80%,-80%);
      }
    
    .translate-8{
      transform: translate(calc(1px * 8),calc(1px * 8));
    }
  
    .translate-8m{
      transform: translate(calc(var(--px-min-unit) * 8),calc(var(--px-min-unit) * 8));
    }
  
    .translate-8x{
      transform: translate(calc(1px * 8 * 10),calc(1px * 8 * 10));
    }
  
    .translate-8mx{
      transform: translate(calc(var(--px-min-unit) * 8 * 10),calc(var(--px-min-unit) * 8 * 10));
    }
  
    .translate-8mxx{
      transform: translate(calc(var(--px-min-unit) * 8 * 100),calc(var(--px-min-unit) * 8 * 100));
    }
  
    .translate--8{
      transform: translate(calc(1px * 8 * -1),calc(1px * 8 * -1));
    }
  
    .translate--8m{
      transform: translate(calc(var(--px-min-unit) * 8 * -1),calc(var(--px-min-unit) * 8 * -1));
    }
  
    .translate--8x{
      transform: translate(calc(1px * 8 * 10 * -1),calc(1px * 8 * 10 * -1));
    }
  
    .translate--8mx{
      transform: translate(calc(var(--px-min-unit) * 8 * 10 * -1),calc(var(--px-min-unit) * 8 * 10 * -1));
    }
  
    .translate--8mxx{
      transform: translate(calc(var(--px-min-unit) * 8 * 100 * -1),calc(var(--px-min-unit) * 8 * 100 * -1));
    }
  
    .translate-90-pct{
      transform: translate(90%,90%);
    }
  
      .translate--90-pct{
        transform: translate(-90%,-90%);
      }
    
    .translate-9{
      transform: translate(calc(1px * 9),calc(1px * 9));
    }
  
    .translate-9m{
      transform: translate(calc(var(--px-min-unit) * 9),calc(var(--px-min-unit) * 9));
    }
  
    .translate-9x{
      transform: translate(calc(1px * 9 * 10),calc(1px * 9 * 10));
    }
  
    .translate-9mx{
      transform: translate(calc(var(--px-min-unit) * 9 * 10),calc(var(--px-min-unit) * 9 * 10));
    }
  
    .translate-9mxx{
      transform: translate(calc(var(--px-min-unit) * 9 * 100),calc(var(--px-min-unit) * 9 * 100));
    }
  
    .translate--9{
      transform: translate(calc(1px * 9 * -1),calc(1px * 9 * -1));
    }
  
    .translate--9m{
      transform: translate(calc(var(--px-min-unit) * 9 * -1),calc(var(--px-min-unit) * 9 * -1));
    }
  
    .translate--9x{
      transform: translate(calc(1px * 9 * 10 * -1),calc(1px * 9 * 10 * -1));
    }
  
    .translate--9mx{
      transform: translate(calc(var(--px-min-unit) * 9 * 10 * -1),calc(var(--px-min-unit) * 9 * 10 * -1));
    }
  
    .translate--9mxx{
      transform: translate(calc(var(--px-min-unit) * 9 * 100 * -1),calc(var(--px-min-unit) * 9 * 100 * -1));
    }
  
    .translate-100-pct{
      transform: translate(100%,100%);
    }
  
      .translate--100-pct{
        transform: translate(-100%,-100%);
      }
    
    .translate-10{
      transform: translate(calc(1px * 10),calc(1px * 10));
    }
  
    .translate-10m{
      transform: translate(calc(var(--px-min-unit) * 10),calc(var(--px-min-unit) * 10));
    }
  
    .translate-10x{
      transform: translate(calc(1px * 10 * 10),calc(1px * 10 * 10));
    }
  
    .translate-10mx{
      transform: translate(calc(var(--px-min-unit) * 10 * 10),calc(var(--px-min-unit) * 10 * 10));
    }
  
    .translate-10mxx{
      transform: translate(calc(var(--px-min-unit) * 10 * 100),calc(var(--px-min-unit) * 10 * 100));
    }
  
    .translate--10{
      transform: translate(calc(1px * 10 * -1),calc(1px * 10 * -1));
    }
  
    .translate--10m{
      transform: translate(calc(var(--px-min-unit) * 10 * -1),calc(var(--px-min-unit) * 10 * -1));
    }
  
    .translate--10x{
      transform: translate(calc(1px * 10 * 10 * -1),calc(1px * 10 * 10 * -1));
    }
  
    .translate--10mx{
      transform: translate(calc(var(--px-min-unit) * 10 * 10 * -1),calc(var(--px-min-unit) * 10 * 10 * -1));
    }
  
    .translate--10mxx{
      transform: translate(calc(var(--px-min-unit) * 10 * 100 * -1),calc(var(--px-min-unit) * 10 * 100 * -1));
    }
  
     .translate-0{
       transform: translate(0,0);
     }
   
     .translate-auto{
       transform: translate(auto,auto);
     }
   