/* Fonts
=================================== */
@font-face{
	font-family: 'JJannon-Display-Light';
	src: url('../fonts/JJannon-Display-Light.woff2') format('woff2');
	font-style: normal;
	font-weight: light;
	font-display: block;
	text-rendering: optimizeLegibility;
}
@font-face{
	font-family: 'JJannon-Display-Light-Italic';
	src: url('../fonts/JJannon-Display-Light-Italic.woff2') format('woff2');
	font-style: italic;
	font-weight: light;
	font-display: block;
	text-rendering: optimizeLegibility;
}

/* Texts
======================================== */
.txt-normal{
	font-family: var(--font);
	font-style: normal;
	font-size: var(--fs);
	line-height: var(--lh);
	letter-spacing: var(--ls);
}
.txt-large{
	font-size: var(--fs-l);
	line-height: var(--lh-l);
	letter-spacing: var(--ls-l);
}

/* Styles
======================================== */
i,
em,
.italic{
	font-family: 'JJannon-Display-Light-Italic', var(--font);
	font-style: italic;
}

/* Vars
======================================== */
:root{

	/* Base */
	--font: 'JJannon-Display-Light', Times, serif;

	/* Normal */
	/* --fs: 14px;
	--lh: calc(16/14); */
	--fs: calc(16/var(--global-scale)*100vw);
	--lh: calc(18/16);
	--ls: 0;

	/* Large */
	--fs-l: calc(28/var(--global-scale)*100vw);
	--lh-l: calc(32/28);
	--ls-l: 0;

}
@media (max-width: 1920px){
	:root{
		--fs: 16px;
		--fs-l: 28px;
	}
}
@media (max-width: 430px){
	:root{
		--fs-l: 21px;
		--lh-l: calc(24/21);
	}
}
@media (max-width: 360px){
	:root{
		--fs-l: 18px;
		--lh-l: calc(20/18);
	}
}
