JSFiddle - React, Tailwind, and code Playground

HTML

<div class="test">
		Hello, world!
	</div>

CSS

@font-face {
		font-family: 'Indie Flower';
		font-style: normal;
		font-weight: 400;
		src: local('Indie Flower'), local('IndieFlower'), url(http://fonts.gstatic.com/s/indieflower/v7/10JVD_humAd5zP2yrFqw6ugdm0LZdjqr5-oayXSOefg.woff2) format('woff2');
		unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
	}
	.test {
		font-family: 'Indie Flower';
	}

	@media screen and (max-width: 1000px) {
		.test {
			font-family: Arial;
		}
	}