liser/src/modules/font-style.css

functional css help to optimizing design work and building responsive websites

.i {
  font-style: italic;
}
.fs-normal {
  font-style: normal;
}

@media screen and (min-width: 30em) {
  .i-ns {
    font-style: italic;
  }
  .fs-normal-ns {
    font-style: normal;
  }
}

@media screen and (min-width: 30em) and (max-width: 60em) {
  .i-m {
    font-style: italic;
  }
  .fs-normal-m {
    font-style: normal;
  }
}

@media screen and (max-width: 60em) and (orientation: landscape) {
  .i-ml {
    font-style: italic;
  }
  .fs-normal-ml {
    font-style: normal;
  }
}

@media screen and (min-width: 60em) {
  .i-l {
    font-style: italic;
  }
  .fs-normal-l {
    font-style: normal;
  }
}