/* basic */

:root {
  --font-family: 'Geist', 'Noto Sans TC', 'Noto Sans KR', Arial, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu,
    Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  --font-mono: 'Fira Mono', monospace;
  --element-primary-color: #000000;
  --element-secondary-color: #444444;
  --background-primary-color: #ffffff;
  --background-secondary-color: #ebebeb;
  --border-color: #999999;
  --column-width: 42rem;
  --column-margin-top: 4rem;
}
/*
@media (prefers-color-scheme: dark) {
  :root {
    --element-primary-color: #d7d3ce;
    --element-secondary-color: #c3c6d6;
    --background-primary-color: #101218;
    --background-secondary-color: #2e3139;
    --border-color: #4d5356;
  }
  .invert-on-dark {
    filter: invert(1) !important;
  }
}
*/

html {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

img, a {
  user-drag: none;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-drag: none;
  -webkit-user-select: none;
  -ms-user-select: none;
}

body {
  font-size: 1rem;
  line-height: 1.7;
  font-family: var(--font-family) !important;
  font-weight: 300;
  background-color: var(--background-primary-color) !important;
  color: var(--element-primary-color) !important;
}


footer {
  padding: 1rem 18rem 4rem 18rem !important;
}

p {
  font-size: .85rem;
  font-weight: 250;
  margin-bottom: .75rem !important;
  color: var(--element-primary-color) !important;
}

p:last-child {
  margin-bottom: 0 !important;
}

a {
  text-decoration: none !important;
  font-weight: 400;
  color: var(--element-secondary-color) !important;
}

a:hover {
  font-weight: 450 !important;
}

span {
  color: var(--element-secondary-color) !important;
}

h4 {
  font-size: 1.1rem !important;
  margin-bottom: 1.5rem;
}

/* container */

.main {
  padding: 1rem .5rem;
}

.container {
  margin-bottom: 2rem;
  max-width: none !important;
}

.container:last-of-type {
  margin-bottom: 0 !important;
}

.section-title {
  font-weight: 500 !important;
  text-transform: uppercase !important;
}
.subsection-title {
  font-weight: 350 !important;
}

@media screen and (min-width: 1601px) {
  main, header {
    max-width: 1500px !important;
    margin-left: auto;
    margin-right: auto;
  }

  footer {
    max-width: 1500px !important;
    padding: 2rem 0 5rem 0 !important;
    margin-left: auto;
    margin-right: auto;
  }
}


@media screen and (max-width: 1600px) {
  main, header {
    padding: 0 15rem !important;
  }

  footer {
    padding: 2rem 15rem !important;
  }
}

@media screen and (max-width: 1440px) {
  main, header {
    padding: 0 10rem !important;
  }

  footer {
    padding: 1rem 10rem !important;
  }
}

@media screen and (max-width: 1200px) {
  main, header {
    padding: 0 4rem !important;
  }

  footer {
    padding: 1rem 4rem !important;
  }
}

@media screen and (max-width: 991px) {
  main, header {
    padding: 0 1rem !important;
  }

  footer {
    padding: 1rem 1rem !important;
  }
}

@media screen and (max-width: 575px) {
  main, header {
    padding: 0 .3rem !important;
  }

  footer {
    padding: 1rem .3rem !important;
  }
}

/* nav bar */

.nav-link {
  text-transform: lowercase;
  letter-spacing: .75px;
  font-size: .9rem !important;
  font-weight: 350 !important;
}

.nav-link:hover {
  font-weight: 500 !important;
}

.navbar-nav>li {
  padding-left: 1.1rem;
}

.nav-item {
  padding-left: 0 !important;
}

.navbar-toggler {
  border: none !important;
  outline: none !important;
  padding: 0 !important
}

.active {
  text-decoration: underline !important;
}

/* footer */

.footer-text {
  font-size: .85rem !important;
  font-weight: 200 !important;
}

.footer-weather-icon {
  width: auto;
  height: 23px;
}

hr {
  color: var(--element-primary-color) !important;
  background-color: var(--element-primary-color) !important; 
}