How can this  be set up to maximize inheritance if additional classes will be passed in from a JSON file?
Some quick notes:


You can use list-style: none; instead of list-style-type: none; &ndash; Just a bit shorter
You mention in a comment /* only for tablet */, but there are no media queries in sight.

@media screen and (max-width: 480px) {
    .international {
        max-width: 240px;
    }
}

It's common practise to use dash-delimited class names in CSS, not CamelCase. This completely personal and you can do whatever you want.
Omit the units on zero values: background-position: 0 0; instead of background-position: 0px 0px;
I recommend writing single-line CSS: Every property declaration on a new line. There is no reason to write rule declarations with only one property declaration on one line. Also I don't find it helpful writing top, right, bottom and left on one line.

If you want to save file size and improve performance, you should minimize your CSS. That's so much more efficient plus you keep the legibility and maintainability in your CSS file.


That's it for the moment. Feel free to add a comment to discuss something or visit our great chat.