title: Nest elements has different padding value
body: <p>I spent a couple hours to figure it out but no luck, so basically I've this configuration</p>
  
  <pre><code>$susy: (
      columns: 12,
      gutters: 54px/53px,
      container: 1230px
  );
  </code></pre>
  
  <p>In my layout file <code>_layout.scss</code>, I've this</p>
  
  <pre><code>@include layout( $susy inside );
  
  .content-area {
      padding-top: gutter( 6 );
  
      .layout-2c-l &amp; {
          @include span( 8 of 12 no-gutters );
          @include gutters(5); // 62.0625px
      }
  
      .archive.layout-2c-l &amp;,
      .search.layout-2c-l &amp; {
          padding-left: 0;
          padding-right: 0;
      }
  }
  </code></pre>
  
  <p>In my case, on archive and search page I've to remove the gutters then re-added it via it's child elements like so in <code>_archives.scss</code> file</p>
  
  <pre><code>.page-header {
      @include gutters(5); // 41.375px
  }
  </code></pre>
  
  <p>As you can see the code above beside the gutters I add the pixel value, the first gutters resulting <code>62.0625px</code> and the the second one <code>41.375px</code>. </p>
  
  <p>If this is how susy works, is there any way to get the same  result?</p>