@mixin calc-col-width($col-count) {
        .-cols-#{$col-count} & {
            width: calc( (100% - #{$main-nav-width}) / #{$col-count} ); // viewport - main nav
        }
        .drawer-is-open .-cols-#{$col-count} & {
            width: calc( (100% - #{$main-nav-width} - #{$drawer-width}) / #{$col-count} ); // (viewport - main-nav - drawer) / col-count
        }
        .actions-is-open .-cols-#{$col-count} & {
            width: calc( (100% - #{$main-nav-width} - #{$actions-width}) / #{$col-count} ); // (viewport - main-nav - actions) / col-count
        }
        .drawer-is-open.actions-is-open .-cols-#{$col-count} & {
            width: calc( (100% - #{$main-nav-width} - #{$drawer-width} - #{$actions-width}) / #{$col-count} ); // (viewport - main-nav - drawer - actions) / col-count
        }
    }

    @include calc-col-width(1);
    @include calc-col-width(2);
    @include calc-col-width(3);