/* Import Google Fonts: Roboto */
@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@300;400;700&display=swap');

/* Global Reset and Box-Sizing */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Global Body Styles */
body {

  padding: 60 ;
  font-family: 'Kanit', sans-serif;
  font-size: 1rem; /* 16px */
  background-color: #fff;
  color: #333;
}

/* Link Styles */
a {
  font-family: 'Kanit', sans-serif;
  color: #333;
  text-decoration: none;
  transition: color 0.3s ease;
}
a:hover {
            text-decoration: none;
            color: #ff6600;
    }

/* Table Styles */
table {
  width: 100%;
  border-collapse: collapse;
  font-family: inherit;
  font-size: 1rem;
}

/* Navigation and Header Styles */
.bluenav {
  font-size: 1.083rem; /* approx 13px */
  color: #fff;
  background-color: #3366FF;
  padding: 0.5rem 1rem;
}

.FontBigHead {
  font-size: 1.125rem; /* approx 18px */
  font-weight: 700;
  margin-bottom: 0.5rem;
}

.FontBigSub {
  font-size: 1rem; /* approx 16px */
  font-weight: 500;
  margin-bottom: 0.5rem;
}

/* Small Text Styles */
.FontSmall {
  font-size: 0.625rem; /* approx 10px */
}

.fontnormalwhite {
  font-size: 1rem;
  color: #fff;
}

/* White Link Styles */
.linkwhite {
  font-size: 1rem;
  color: #fff;
  text-decoration: underline;
  transition: color 0.3s ease;
}

a.linkwhite:hover {
  color: #ff6600;
}

/* Button Styles */
.button {
  font-family: inherit;
  font-size: 1rem;
  color: #000;
  background-color: #f0f0f0;
  border: none;
  padding: 0.5rem 1rem;
  border-radius: 4px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.button:hover {
  background-color: #e0e0e0;
}

/* Textbox Styles */
.txtbox {
  font-family: inherit;
  font-size: 1rem;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 0.5rem;
}

/* Blue Border Style */
.BorderBlue {
  border: 1px solid #425e89;
  padding: 0.5rem;
}