header#top {
  background: url('/images/background-top.svg');
  background-position-x: center;
  background-repeat: no-repeat;
  font-family: kanit;
}
header#top .navbar {
  padding-left: 0px;
  padding-right: 0px;
}
header#top .logo-title,
header#top a.nav-link {
  /* color: #FFF; */
}
header#top a.navbar-brand .title-th,
header#top a.navbar-brand .title-en {
  color: var(--color-primary);
}
header#top .navbar-brand img { height: 80px; }
header#top .logo-title .title-th { font-size: 22px;font-weight: 400; }
header#top .logo-title .title-en { font-size: 16px;font-weight: 300; }

@media(max-width: 780px) {
  header#top {
    background-size: auto;
  }
  header#top .navbar {
    position: relative;
  }
  header#top .navbar .navbar-toggler {
    position: absolute;
    top: 20px;
    right: -10px;
  }
  header#top .navbar-brand img { height: 60px; }
  header#top .logo-title .title-th { font-size: 16px;font-weight: 400; }
  header#top .logo-title .title-en { font-size: 8px;font-weight: 300; }
}



@media(max-width: 780px) {
  header.header-mobile {
    background-size: auto;
  }
  header.header-mobile .navbar {
    position: relative;
  }
  header.header-mobile .navbar .navbar-toggler {
    position: absolute;
    top: 20px;
    right: -10px;
  }
  header.header-mobile .logo-title {
    color: var(--color-primary);
  }
  header.header-mobile .navbar-brand img { height: 60px; }
  header.header-mobile .logo-title .title-th {
    font-size: 12px;
    font-weight: 400;
    white-space: break-spaces;
    line-height: 12px;
  }
  header.header-mobile .logo-title .title-en { font-size: 7px;font-weight: 300; }
  section.section-search {
    display: none;
  }
  .header-menu-mobile {
    background-color: #f8f9fa!important;
  }
  .header-mobile {
    padding: 0px;
  }
}