Different platform css for each class

What should I do if I want to have different css for some specific classes.
What can I do to achieve something like this (below no working)

 .fixed-content {
    .ios {
      background-color: red;
    .md {
      background-color: blue;
    .wp {
      background-color: green;

I think you can do

if (this.platform.is('ios')) { // else android, wp
     //than set css variable here

and then use that variable for templating

Hi, thanks for replying. I think I found a solution, I was searching a way to have a uniform appearance for my app. So in app.module.ts, I set the config mode to ‘md’. now the design look consistent. :), I will mark this as correct since this answer my question