/* css document */

@import url('https://fonts.googleapis.com/css?family=Wire+One');
@import url('https://fonts.googleapis.com/css?family=Lobster');
@import url('https://fonts.googleapis.com/css?family=Raleway');
@import url('https://fonts.googleapis.com/css?family=Dosis:200,300,400,500,600,700,800');
@import url('https://fonts.googleapis.com/css?family=Rubik:300,300i,400,400i,500,500i,700,700i,900,900i');
@import url('https://fonts.googleapis.com/css?family=Cutive+Mono');
@import url('https://fonts.googleapis.com/css?family=Roboto+Mono:100,100i,300,300i,400,400i,500,500i,700,700i&display=swap&subset=latin-ext');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i');
@import url('https://fonts.googleapis.com/css?family=Lobster+Two:400,400i,700,700i');
@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i');
@import url('https://fonts.googleapis.com/css?family=Nanum+Gothic:400,700,800');
@import url('https://fonts.googleapis.com/css?family=Bangers');
@import url('https://fonts.googleapis.com/css?family=Fredericka+the+Great');
@import url('https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Russo+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200;300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Do+Hyeon&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Spartan:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Spartan:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Mitr:wght@200;300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Candal&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Syncopate:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Krona+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Jockey+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Palanquin+Dark:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Doppio+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Denk+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Farro:wght@300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Chau+Philomene+One:ital@0;1&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Audiowide&display=swap');





/* sans serif */
.wireone { font-family: 'Wire One', sans-serif; }
.dosis { font-family: 'Dosis', sans-serif; font-weight: 500; }
.dosis-light { font-family: 'Dosis', sans-serif; font-weight: 300; }
.rubik { font-family: 'Rubik', sans-serif; }
.rubik700 { font-family: 'Roboto', sans-serif; font-weight: 700; }
.raleway { font-family: 'Raleway', sans-serif; }
.opensans { font-family: 'Open Sans', sans-serif; }
.roboto { font-family: 'Roboto', sans-serif; font-weight: 400; }
.nanumgothic { font-family: 'Nanum Gothic', sans-serif; }
.monserratb { font-family: 'Montserrat', sans-serif; font-weight: 600; }
.monserrat { font-family: 'Montserrat', sans-serif; }
.russoone { font-family: 'Russo One', sans-serif; }
.oswald { font-family: 'Oswald', sans-serif; }
.dohyeon { font-family: 'Do Hyeon', sans-serif; }
.archivoblack { font-family: 'Archivo Black', sans-serif; }
.spartan { font-family: 'Spartan', sans-serif; }
.mitr { font-family: 'Mitr', sans-serif; }
.candal { font-family: 'Candal', sans-serif; }
.syncopate { font-family: 'Syncopate', sans-serif; }
.kronaone { font-family: 'Krona One', sans-serif; }
.jockeyone { font-family: 'Jockey One', sans-serif; }
.palanquindark { font-family: 'Palanquin Dark', sans-serif; }
.doppioone { font-family: 'Doppio One', sans-serif; }
.denkone { font-family: 'Denk One', sans-serif; }
.farro { font-family: 'Farro', sans-serif; }
.chauphilomeneone { font-family: 'Chau Philomene One', sans-serif; }


/* monospace */
.cutive-mono { font-family: 'Cutive Mono', monospace; }
.roboto-mono { font-family: 'Roboto Mono', monospace; }

/* display */
.lobster { font-family: 'Lobster', cursive; }
.lobster2 { font-family: 'Lobster Two', cursive; }
.bangers { font-family: 'Bangers', cursive; }
.frederika { font-family: 'Fredericka the Great', cursive; }
.audiowide { font-family: 'Audiowide', cursive; }


/******** this is a demo
	
	<!-- ***sans serif*** -->

	<div class="wireone"><h4>wireone</h4></div>
	<div class="dosis"><h4>dosis</h4></div>
	<div class="dosis-light"><h4>dosis-light</h4></div>
	<div class="rubik"><h4>rubik</h4></div>
	<div class="raleway"><h4>raleway</h4></div>
	<div class="opensans"><h4>opensans</h4></div>
	<div class="roboto"><h4>roboto</h4></div>
	<div class="nanumgothic"><h4>nanumgothic</h4></div>
	<div class="monserratb"><h4>monserratb</h4></div>
	<div class="monserrat"><h4>monserrat</h4></div>
	<div class="russoone"><h4>russoone</h4></div>
	<div class="oswald"><h4>oswald</h4></div>
	<div class="dohyeon"><h4>dohyeon</h4></div>
	<div class="archivoblack"><h4>archivoblack</h4></div>
	<div class="spartan"><h4>spartan</h4></div>
	<div class="mitr"><h4>mitr</h4></div>
	<div class="candal"><h4>candal</h4></div>
	<div class="syncopate"><h4>syncopate</h4></div>
	<div class="kronaone"><h4>kronaone</h4></div>
	<div class="jockeyone"><h4>jockeyone</h4></div>
	<div class="palanquindark"><h4>palanquindark</h4></div>
	<div class="doppioone"><h4>doppioone</h4></div>
	<div class="denkone"><h4>denkone</h4></div>
	<div class="farro"><h4>farro</h4></div>
	<div class="chauphilomeneone"><h4>chauphilomeneone</h4></div> 
	
	<!-- ***monospace*** -->
	
	<div class="cutive-mono"><h4>cutive-mono</h4></div>
	<div class="roboto-mono"><h4>roboto-mono</h4></div>
	
	<!-- ***display*** -->

	<div class="lobster"><h4>lobster</h4></div>
	<div class="lobster2"><h4>lobster2</h4></div>
	<div class="bangers"><h4>bangers</h4></div>
	<div class="frederika"><h4>frederika</h4></div>
	<div class="audiowide"><h4>audiowide</h4></div>

*/