.d-inline {
    display: inline;
}

.d-none {
    display: none;
}

.d-block {
    display: block;
}

.d-iblock {
    display: inline-block;
}

@media (min-width: $desktop-breakpoint) {
    .desktop {
        &-d-none {
            display: none;
        }
    
        &-d-block {
            display: block;
        }
    
        &-d-inline {
            display: inline;
        }
    
        &-d-iblock {
            display: inline-block;
        }
    }
}

.mobile-only {
    @media (min-width: $desktop-breakpoint) {
        display: none !important;
    }
}

.desktop-only {
    @media (max-width: $desktop-breakpoint) {
        display: none !important;
    }
}

.z {
    @for $i from 1 through 10 {
        &-#{$i} {
            z-index: #{$i};
        }
    }
}

.z-max {
    z-index: 100;
}

.z-least {
    z-index: -100;
}