$tabs: five, six, seven, eight, nine, ten, eleven, twelve, thirteen, fourteen, fifteen, sixteen, seventeen, eighteen, nineteen, twenty;

.tabs {
  &.one {
    > .row {
      width: 100%;
      left: 0;
    }

    > input:nth-of-type(1):checked ~ .row {
      margin-left: 0;
    }
    
    > label img {
      display: none;
    }
  }
  
  // This is probably really stupid, but whatever. I need more than the 4 built-in tabs that Picnic provides
  @for $tab-index from 1 through length($tabs) {
    $number: $tab-index + 4;
    $tab: nth($tabs, $tab-index);

    &.#{$tab} {
      > .row {
        width: 100% * $number;
        left: -100% * ($number - 1);
      }

      @for $item from 1 through ($number - 1) {
        > input:nth-of-type(#{$item}):checked ~ .row {
          margin-left: (100% * ($number - 1)) - (100% * ($item - 1));// 400%;
        }
      }
        
      > label img {
        width: floor(100% / $number) - 2%;
        margin: 4% 0 4% 4%;
      }
    }
  }
}