/* Include all fonts & customized classes */
@font-face {
  font-family: "Sarabun";
  src: url(../fonts/Sarabun-Thin.ttf) format("truetype");
  font-weight: 100;
  font-style: normal; }
@font-face {
  font-family: "Sarabun";
  src: url(../fonts/Sarabun-ThinItalic.ttf) format("truetype");
  font-weight: 100;
  font-style: italic; }
.Sarabun-100 {
  font-family: "Sarabun";
  font-weight: 100;
  font-style: normal; }

.Sarabun-100i {
  font-family: "Sarabun";
  font-weight: 100;
  font-style: italic; }

@font-face {
  font-family: "Sarabun";
  src: url(../fonts/Sarabun-ExtraLight.ttf) format("truetype");
  font-weight: 200;
  font-style: normal; }
@font-face {
  font-family: "Sarabun";
  src: url(../fonts/Sarabun-ExtraLightItalic.ttf) format("truetype");
  font-weight: 200;
  font-style: italic; }
.Sarabun-200 {
  font-family: "Sarabun";
  font-weight: 200;
  font-style: normal; }

.Sarabun-200i {
  font-family: "Sarabun";
  font-weight: 200;
  font-style: italic; }

@font-face {
  font-family: "Sarabun";
  src: url(../fonts/Sarabun-Light.ttf) format("truetype");
  font-weight: 300;
  font-style: normal; }
@font-face {
  font-family: "Sarabun";
  src: url(../fonts/Sarabun-LightItalic.ttf) format("truetype");
  font-weight: 300;
  font-style: italic; }
.Sarabun-300 {
  font-family: "Sarabun";
  font-weight: 300;
  font-style: normal; }

.Sarabun-300i {
  font-family: "Sarabun";
  font-weight: 300;
  font-style: italic; }

@font-face {
  font-family: "Sarabun";
  src: url(../fonts/Sarabun-Regular.ttf) format("truetype");
  font-weight: 400;
  font-style: normal; }
@font-face {
  font-family: "Sarabun";
  src: url(../fonts/Sarabun-Italic.ttf) format("truetype");
  font-weight: 400;
  font-style: italic; }
.Sarabun-400 {
  font-family: "Sarabun";
  font-weight: 400;
  font-style: normal; }

.Sarabun-400i {
  font-family: "Sarabun";
  font-weight: 400;
  font-style: italic; }

@font-face {
  font-family: "Sarabun";
  src: url(../fonts/Sarabun-Medium.ttf) format("truetype");
  font-weight: 500;
  font-style: normal; }
@font-face {
  font-family: "Sarabun";
  src: url(../fonts/Sarabun-MediumItalic.ttf) format("truetype");
  font-weight: 500;
  font-style: italic; }
.Sarabun-500 {
  font-family: "Sarabun";
  font-weight: 500;
  font-style: normal; }

.Sarabun-500i {
  font-family: "Sarabun";
  font-weight: 500;
  font-style: italic; }

@font-face {
  font-family: "Sarabun";
  src: url(../fonts/Sarabun-SemiBold.ttf) format("truetype");
  font-weight: 600;
  font-style: normal; }
@font-face {
  font-family: "Sarabun";
  src: url(../fonts/Sarabun-SemiBoldItalic.ttf) format("truetype");
  font-weight: 600;
  font-style: italic; }
.Sarabun-600 {
  font-family: "Sarabun";
  font-weight: 600;
  font-style: normal; }

.Sarabun-600i {
  font-family: "Sarabun";
  font-weight: 600;
  font-style: italic; }

@font-face {
  font-family: "Sarabun";
  src: url(../fonts/Sarabun-Bold.ttf) format("truetype");
  font-weight: 700;
  font-style: normal; }
@font-face {
  font-family: "Sarabun";
  src: url(../fonts/Sarabun-BoldItalic.ttf) format("truetype");
  font-weight: 700;
  font-style: italic; }
.Sarabun-700 {
  font-family: "Sarabun";
  font-weight: 700;
  font-style: normal; }

.Sarabun-700i {
  font-family: "Sarabun";
  font-weight: 700;
  font-style: italic; }

@font-face {
  font-family: "Sarabun";
  src: url(../fonts/Sarabun-ExtraBold.ttf) format("truetype");
  font-weight: 800;
  font-style: normal; }
@font-face {
  font-family: "Sarabun";
  src: url(../fonts/Sarabun-ExtraBoldItalic.ttf) format("truetype");
  font-weight: 800;
  font-style: italic; }
.Sarabun-800 {
  font-family: "Sarabun";
  font-weight: 800;
  font-style: normal; }

.Sarabun-800i {
  font-family: "Sarabun";
  font-weight: 800;
  font-style: italic; }

 

body {
  font-family: "Sarabun";
  -webkit-font-feature-settings: "ccmp";
  -moz-font-feature-settings: "ccmp";
  -ms-font-feature-settings: "ccmp";
  font-feature-settings: "ccmp";
  -webkit-font-feature-settings: "locl";
  -moz-font-feature-settings: "locl";
  -ms-font-feature-settings: "locl";
  font-feature-settings: "locl";
  -webkit-font-kerning: normal;
  -moz-font-kerning: normal;
  -ms-font-kerning: normal;
  font-kerning: normal;
  -webkit-font-variant: common-ligatures;
  -moz-font-variant: common-ligatures;
  -ms-font-variant: common-ligatures;
  font-variant: common-ligatures; }
  body .test-text {
    font-size: 36px; }
  body .tnum {
    -webkit-font-feature-settings: "tnum";
    -moz-font-feature-settings: "tnum";
    -ms-font-feature-settings: "tnum";
    font-feature-settings: "tnum"; }
  body .pnum {
    -webkit-font-feature-settings: "pnum";
    -moz-font-feature-settings: "pnum";
    -ms-font-feature-settings: "pnum";
    font-feature-settings: "pnum"; }
  body sup, body .sups {
    -webkit-font-feature-settings: "sups";
    -moz-font-feature-settings: "sups";
    -ms-font-feature-settings: "sups";
    font-feature-settings: "sups";
    vertical-align: unset; }
  body sub, body .subs {
    -webkit-font-feature-settings: "subs";
    -moz-font-feature-settings: "subs";
    -ms-font-feature-settings: "subs";
    font-feature-settings: "subs";
    vertical-align: unset; }
  body .numr {
    -webkit-font-feature-settings: "numr";
    -moz-font-feature-settings: "numr";
    -ms-font-feature-settings: "numr";
    font-feature-settings: "numr";
    vertical-align: unset; }
  body .dnom {
    -webkit-font-feature-settings: "dnom";
    -moz-font-feature-settings: "dnom";
    -ms-font-feature-settings: "dnom";
    font-feature-settings: "dnom";
    vertical-align: unset; }
  body .frac {
    -webkit-font-feature-settings: "frac";
    -moz-font-feature-settings: "frac";
    -ms-font-feature-settings: "frac";
    font-feature-settings: "frac"; }
  body .ordn {
    -webkit-font-feature-settings: "ordn";
    -moz-font-feature-settings: "ordn";
    -ms-font-feature-settings: "ordn";
    font-feature-settings: "ordn"; }