@mixin titles($device: "") {
    @each $class, $size in $titles {
        %#{$device}#{$class} {
            font-size: $size;
        }

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

@include titles;

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

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