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