/* Montserrat Font */
/* @import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap'); */

/* FC Iconic Font */
@font-face {
   font-family: 'FC Iconic';
   src: url('../fonts/FC-Iconic/fc_iconic_bold.woff2') format('woff2'),
      url('../fonts/FC-Iconic/fc_iconic_bold.woff') format('woff');
   font-weight: 700;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'FC Iconic';
   src: url('../fonts/FC-Iconic/fc_iconic_semibold.woff2') format('woff2'),
      url('../fonts/FC-Iconic/fc_iconic_semibold.woff') format('woff');
   font-weight: 600;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'FC Iconic';
   src: url('../fonts/FC-Iconic/fc_iconic_medium.woff2') format('woff2'),
      url('../fonts/FC-Iconic/fc_iconic_medium.woff') format('woff');
   font-weight: 500;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'FC Iconic';
   src: url('../fonts/FC-Iconic/fc_iconic_regular.woff2') format('woff2'),
      url('../fonts/FC-Iconic/fc_iconic_regular.woff') format('woff');
   font-weight: 400;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'FC Iconic';
   src: url('../fonts/FC-Iconic/fc_iconic_light.woff2') format('woff2'),
      url('../fonts/FC-Iconic/fc_iconic_light.woff') format('woff');
   font-weight: 300;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'FC Iconic';
   src: url('../fonts/FC-Iconic/fc_iconic_extralight.woff2') format('woff2'),
      url('../fonts/FC-Iconic/fc_iconic_extralight.woff') format('woff');
   font-weight: 200;
   font-style: normal;
   font-display: swap;
}

/* Headlines Font */
@font-face {
   font-family: 'headlines';
   src: url('../fonts/headlines/headlines-bold.woff2') format('woff2'),
      url('../fonts/headlines/headlines-bold.woff') format('woff');
   font-weight: 700;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'headlines';
   src: url('../fonts/headlines/headlines-semibold.woff2') format('woff2'),
      url('../fonts/headlines/headlines-semibold.woff') format('woff');
   font-weight: 600;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'headlines';
   src: url('../fonts/headlines/headlines-medium.woff2') format('woff2'),
      url('../fonts/headlines/headlines-medium.woff') format('woff');
   font-weight: 500;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'headlines';
   src: url('../fonts/headlines/headlines-regular.woff2') format('woff2'),
      url('../fonts/headlines/headlines-regular.woff') format('woff');
   font-weight: 400;
   font-style: normal;
   font-display: swap;

}

@font-face {
   font-family: 'headlines';
   src: url('../fonts/headlines/headlines-light.woff2') format('woff2'),
      url('../fonts/headlines/headlines-light.woff') format('woff');
   font-weight: 300;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'headlines';
   src: url('headlines-semilight.woff2') format('woff2'),
      url('headlines-semilight.woff') format('woff');
   font-weight: 200;
   font-style: normal;
   font-display: swap;
}

/* Chulalongkorn */
@font-face {
   font-family: 'chulacharas-new';
   src: url('../fonts/chulalongkorn/chulacharasnew_bold.woff2') format('woff2'),
      url('../fonts/chulalongkorn/chulacharasnew_bold.woff') format('woff');
   font-weight: 700;
   font-style: normal;
}

@font-face {
   font-family: 'chulacharas-new';
   src: url('../fonts/chulalongkorn/chulacharasnew_bold-ita.woff2') format('woff2'),
      url('../fonts/chulalongkorn/chulacharasnew_bold-ita.woff') format('woff');
   font-weight: 700;
   font-style: italic;
}

@font-face {
   font-family: 'chulacharas-new';
   src: url('../fonts/chulalongkorn/chulacharasnew_ita.woff2') format('woff2'),
      url('../fonts/chulalongkorn/chulacharasnew_ita.woff') format('woff');
   font-weight: 400;
   font-style: italic;
}

@font-face {
   font-family: 'chulacharas-new';
   src: url('../fonts/chulalongkorn/chulacharasnew_reg.woff2') format('woff2'),
      url('../fonts/chulalongkorn/chulacharasnew_reg.woff') format('woff');
   font-weight: 400;
   font-style: normal;
}

@font-face {
   font-family: 'chulalongkorn';
   src: url('../fonts/chulalongkorn/chulalongkorn_bold.woff2') format('woff2'),
      url('../fonts/chulalongkorn/chulalongkorn_bold.woff') format('woff');
   font-weight: 700;
   font-style: normal;
}

@font-face {
   font-family: 'chulalongkorn';
   src: url('../fonts/chulalongkorn/chulalongkorn_reg.woff2') format('woff2'),
      url('../fonts/chulalongkorn/chulalongkorn_reg.woff') format('woff');
   font-weight: 400;
   font-style: normal;
}

:root {
   --theme-font-family: "FC Iconic", sans-serif;
}

html,
body {
   font-family: var(--theme-font-family);
   font-optical-sizing: auto;
   font-weight: 400;
   font-style: normal;
}

/* Font Family */
.font-headlines {
   font-family: "headlines", sans-serif;
}

.font-fc-iconic {
   font-family: "FC Iconic", sans-serif;
}

.font-chulalongkorn {
   font-family: "chulalongkorn", sans-serif;
}

.font-chulacharas-new {
   font-family: "chulacharas-new", sans-serif;
}

/* Font Weight */
.extra-light {
   font-weight: 200;
}

.light {
   font-weight: 300;
}

.regular {
   font-weight: 400;
}

.medium {
   font-weight: 500;
}

.semi-bold {
   font-weight: 600;
}

.bold {
   font-weight: 700;
}

/* Font Size */
.smaller {
   font-size: 0.675rem;
}

.small {
   font-size: 0.875rem;
}

.normal {
   font-size: 1.125rem;
}

.large {
   font-size: 1.6rem;
}

.larger {
   font-size: 2rem;
}