@import "reset.css";
@import "general.css";

@import "header.css";
@import "footer.css";

@import "home/hero.css";
@import "home/about.css";
@import "home/rates.css";
@import "home/advantages.css";
@import "home/banner.css";

:root {
  --primary: #64a726;
  --primary-rgb: 100, 167, 38;
  --secondary: #0e253a;
  --white: #fff;
  --mp-blue: #004487;
}

/* Mobile */
body {
  font-family: "Kanit", "Open Sans", sans-serif;
  font-size: 16px;
  color: var(--secondary);
  line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  line-height: 1.2;
}

h1 {
  font-size: 37px;
  font-weight: 500;
}

h2 {
  font-size: 24px;
}

a {
  cursor: pointer;
}

a:hover {
  text-decoration: underline;
}
p.copy {
  font-size: 0.8em;
  margin: 2em 0 0 0;
}
p.ymark {
  font-size: 0.8em;
  margin: 0 0 2em 0;
}

@media only screen and (min-width: 336px) {
}
@media only screen and (min-width: 400px) {
}
@media only screen and (min-width: 496px) {
}
@media only screen and (min-width: 768px) {
}
@media only screen and (min-width: 1024px) {
  h1 {
    font-size: 58px;
  }

  h2 {
    font-size: 37px;
  }

  p.copy {
    display: inline-block;
    width: 49%;
    margin: 0;
  }
  p.ymark {
    display: inline-block;
    width: 49%;
    margin: 0;
    text-align: right;
  }
}

@media only screen and (min-width: 1536px) {
}

@media only print {
  h1,
  h2,
  h3,
  h4,
  p,
  a,
  li {
    color: #000 !important;
  }
  nav {
    display: none;
  }
}