@mixin opacity($device: "") {
    %#{$device}translucent {
        opacity: 0;
    }

    @for $i from 1 through 99 {
        @if str_length("#{$i}") == 1 {
            $i: "0#{$i}";
        }

        %#{$device}opacity-#{$i} {
            opacity: unquote(".#{$i}");
        }
    }

    %#{$device}opaque {
        opacity: 1;
    }

    @if $classes {
        .#{$device}translucent {
            @extend %#{$device}translucent;
        }

        @for $i from 1 through 99 {
            @if str_length("#{$i}") == 1 {
                $i: "0#{$i}";
            }

            .#{$device}opacity-#{$i} {
                @extend %#{$device}opacity-#{$i};
            }
        }

        .#{$device}opaque {
            @extend %#{$device}opaque;
        }
    }
}

@include opacity;

@each $device, $pixels in $devices {
    @include media($device) {
        @include opacity($device + "-");
    }
}

@include mobile {
    @include opacity("mobile-");
}