/* Variable Css Start Here */
/* Font cdn starts here */
@font-face {
	font-family: "sora-Regular";
	src: url("../fonts/sora/Sora-Regular.ttf");
}
@font-face {
	font-family: "sora-light";
	src: url("../fonts/sora/Sora-Light.ttf");
}
@font-face {
	font-family: "sora-medium";
	src: url("../fonts/sora/Sora-Medium.ttf");
}
@font-face {
	font-family: "sora-semibold";
	src: url("../fonts/sora/Sora-SemiBold.ttf");
}
@font-face {
	font-family: "sora-bold";
	src: url("../fonts/sora/Sora-Bold.ttf");
}
@font-face {
	font-family: "michroma-regular";
	src: url("../fonts/michroma/Michroma-Regular.ttf");
}
/* Font cdn ends here */

:root {
	/* Typography starts here */
	--secondary-regular-font: "sora-bold";
	--primary-regular-font: "sora-regular";
	--primary-light-font: "sora-light";
	--primary-medium-font: "sora-medium";
	--primary-semibold-font: "sora-semibold";
	--michroma-font: "michroma-regular";
	/* Typography ends here */
}

.secondary-regular-font,
.heading-font {
	font-family: var(--secondary-regular-font);
}

.primary-regular-font {
	font-family: var(--primary-regular-font);
}

.primary-light-font {
	font-family: var(--primary-light-font);
}

.primary-medium-font {
	font-family: var(--primary-medium-font);
}

.primary-semibold-font {
	font-family: var(--primary-semibold-font);
}

.sub-font {
	font-family: var(--michroma-font);
}

/* Font Sizes Here */
.level-1-lg {
	font-size: 100px;
}

.level-1 {
	font-size: 58px;
	/* My Own Styling  */
	line-height: 85%;
}

.level-2 {
	font-size: 56px;
}

.level-2-sm {
	font-size: 44px;
}

.level-3 {
	font-size: 35px;
}	

.level-3-sm {
	font-size: 28px;
}

.level-4-lg {
	font-size: 25px;
}

.level-4 {
	font-size: 22px;
}

.level-5 {
	font-size: 20px;
}

.level-6 {
	font-size: 18px;
}

.level-7 {
	font-size: 16px;
}

.level-8 {
	font-size: 15px;
}

.level-9 {
	font-size: 13px;
}

.level-10 {
	font-size: 10px;
}