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