.b {
  font-weight: bold;
}

.bg-dark-red {
  background: #b51700;
}

.bg-yellow {
  background: #ffe700;
}

.bg-blue {
  background: #6297db;
}

.bg-dark-blue {
  background: #1c548f;
}

.bg-gray {
  background: #646464;
}

.bg-green {
  background: #95b524;
}

.bg-purple {
  background: #8f58a8;
}

.gray {
  color: #777;
}

.f1 {
  font-size: 3rem;
}

.f2 {
  font-size: 2.25rem;
}

.f3 {
  font-size: 1.5rem;
}

.f4 {
  font-size: 1.25rem;
}

.f5 {
  font-size: 1rem;
}

.f6 {
  font-size: 0.875rem;
}

.f7 {
  font-size: 0.75rem;
}

.dn {
  display: none;
}

.di {
  display: inline;
}

.db {
  display: block;
}

.df {
  display: flex;
}

.tc {
  text-align: center;
}

.m-auto {
  margin-left: auto;
  margin-right: auto;
}

@media screen and (min-width: 30em) {
  .f-6-ns,
.f-headline-ns {
    font-size: 6rem;
  }

  .f-5-ns,
.f-subheadline-ns {
    font-size: 5rem;
  }

  .f1-ns {
    font-size: 3rem;
  }

  .f2-ns {
    font-size: 2.25rem;
  }

  .f3-ns {
    font-size: 1.5rem;
  }

  .f4-ns {
    font-size: 1.25rem;
  }

  .f5-ns {
    font-size: 1rem;
  }

  .f6-ns {
    font-size: 0.875rem;
  }

  .f7-ns {
    font-size: 0.75rem;
  }

  .dn-ns {
    display: none;
  }

  .di-ns {
    display: inline;
  }

  .db-ns {
    display: block;
  }
}
.pa0 {
  padding: 0;
}

.pa1 {
  padding: 0.25rem;
}

.pa2 {
  padding: 0.5rem;
}

.pa3 {
  padding: 1rem;
}

.pa4 {
  padding: 2rem;
}

.pa5 {
  padding: 4rem;
}

.pa6 {
  padding: 8rem;
}

.pa7 {
  padding: 16rem;
}

.pl0 {
  padding-left: 0;
}

.pl1 {
  padding-left: 0.25rem;
}

.pl2 {
  padding-left: 0.5rem;
}

.pl3 {
  padding-left: 1rem;
}

.pl4 {
  padding-left: 2rem;
}

.pl5 {
  padding-left: 4rem;
}

.pl6 {
  padding-left: 8rem;
}

.pl7 {
  padding-left: 16rem;
}

.pr0 {
  padding-right: 0;
}

.pr1 {
  padding-right: 0.25rem;
}

.pr2 {
  padding-right: 0.5rem;
}

.pr3 {
  padding-right: 1rem;
}

.pr4 {
  padding-right: 2rem;
}

.pr5 {
  padding-right: 4rem;
}

.pr6 {
  padding-right: 8rem;
}

.pr7 {
  padding-right: 16rem;
}

.pb0 {
  padding-bottom: 0;
}

.pb1 {
  padding-bottom: 0.25rem;
}

.pb2 {
  padding-bottom: 0.5rem;
}

.pb3 {
  padding-bottom: 1rem;
}

.pb4 {
  padding-bottom: 2rem;
}

.pb5 {
  padding-bottom: 4rem;
}

.pb6 {
  padding-bottom: 8rem;
}

.pb7 {
  padding-bottom: 16rem;
}

.pt0 {
  padding-top: 0;
}

.pt1 {
  padding-top: 0.25rem;
}

.pt2 {
  padding-top: 0.5rem;
}

.pt3 {
  padding-top: 1rem;
}

.pt4 {
  padding-top: 2rem;
}

.pt5 {
  padding-top: 4rem;
}

.pt6 {
  padding-top: 8rem;
}

.pt7 {
  padding-top: 16rem;
}

.ma0 {
  margin: 0;
}

.ma1 {
  margin: 0.25rem;
}

.ma2 {
  margin: 0.5rem;
}

.ma3 {
  margin: 1rem;
}

.ma4 {
  margin: 2rem;
}

.ma5 {
  margin: 4rem;
}

.ma6 {
  margin: 8rem;
}

.ma7 {
  margin: 16rem;
}

.ml0 {
  margin-left: 0;
}

.ml1 {
  margin-left: 0.25rem;
}

.ml2 {
  margin-left: 0.5rem;
}

.ml3 {
  margin-left: 1rem;
}

.ml4 {
  margin-left: 2rem;
}

.ml5 {
  margin-left: 4rem;
}

.ml6 {
  margin-left: 8rem;
}

.ml7 {
  margin-left: 16rem;
}

.mr0 {
  margin-right: 0;
}

.mr1 {
  margin-right: 0.25rem;
}

.mr2 {
  margin-right: 0.5rem;
}

.mr3 {
  margin-right: 1rem;
}

.mr4 {
  margin-right: 2rem;
}

.mr5 {
  margin-right: 4rem;
}

.mr6 {
  margin-right: 8rem;
}

.mr7 {
  margin-right: 16rem;
}

.mb0 {
  margin-bottom: 0;
}

.mb1 {
  margin-bottom: 0.25rem;
}

.mb2 {
  margin-bottom: 0.5rem;
}

.mb3 {
  margin-bottom: 1rem;
}

.mb4 {
  margin-bottom: 2rem;
}

.mb5 {
  margin-bottom: 4rem;
}

.mb6 {
  margin-bottom: 8rem;
}

.mb7 {
  margin-bottom: 16rem;
}

.mt0 {
  margin-top: 0;
}

.mt1 {
  margin-top: 0.25rem;
}

.mt2 {
  margin-top: 0.5rem;
}

.mt3 {
  margin-top: 1rem;
}

.mt4 {
  margin-top: 2rem;
}

.mt5 {
  margin-top: 4rem;
}

.mt6 {
  margin-top: 8rem;
}

.mt7 {
  margin-top: 16rem;
}

.mw7 {
  max-width: 24rem;
}

.mw8 {
  max-width: 48rem;
}

.mw9 {
  max-width: 96rem;
}

:root {
  --body-color: #222;
}

@font-face {
  font-family: "Sanskrit 2003";
  font-display: swap;
  src: url(/static/fonts/Sanskrit2003.ttf);
}
.sa1, .dev {
  font-family: "Sanskrit 2003", sans-serif;
}

.sa2 {
  font-style: italic;
}

.sa-reset {
  font-style: normal;
}

:root {
  --body-color: #222;
}

html {
  font-family: Charter, Georgia, serif;
  font-size: 20px;
}

body {
  color: var(--body-color);
  margin: 0;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

article {
  flex: 1;
}

main {
  flex: 1;
  display: flex;
  flex-direction: column;
}

footer {
  border-top: 3px #ccc double;
  background: #fafafa;
}

h1, h2 {
  font-weight: bold;
  margin-bottom: 0;
}

h2 {
  font-size: 1.25em;
}

h1 + * {
  margin-top: 1.25rem;
}

h2 + * {
  margin-top: 1rem;
}

hr {
  width: 50%;
  height: 2px;
  border: 0;
  background: #a00;
}

li, p {
  line-height: 1.6em;
}

li p {
  margin: 0.2em 0;
}

a {
  color: #0435ca;
}

a:visited {
  color: #657bbd;
}

a:hover {
  color: #c00;
}

code {
  font-size: 0.8em;
}

dfn {
  font-style: normal;
  font-weight: bold;
}

mark {
  color: #b93434;
  background: transparent;
}

input[type=text] {
  border: 1px #dddddd solid;
  font: inherit;
}

input[type=submit] {
  font: inherit;
  border: 0;
  display: inline-block;
  border-radius: 5px;
  background: #999999;
  color: #ffffff;
}

.note {
  padding: 1rem;
  background: #fff1ba;
}

.note p {
  margin: 0;
}

.true-aside {
  background: #d5e6ff;
  padding: 1em;
}

.true-aside :first-child {
  margin-top: 0;
}

.true-aside :last-child {
  margin-bottom: 0;
}

.examples {
  background: #f7f7f7;
  padding: 1em;
  list-style: none;
}

.examples li + li {
  margin-top: 1em;
}

.examples .sa1 {
  font-size: 1.5em;
}

.examples.vyakarana {
  background: #f0eae8;
}

.paradigm {
  background: #f7f7f7;
  width: 100%;
  border-collapse: collapse;
  text-align: center;
}

.paradigm .sa1 {
  font-size: 1.5em;
}

.paradigm th {
  padding: 1em 0;
  color: rgba(0, 0, 0, 0.5);
  font-weight: normal;
}

.paradigm tr th:first-child {
  width: 16%;
}

.paradigm td {
  padding: 0.5em;
  width: 28%;
}

.paradigm .s {
  color: #b93434;
}

.prakriya {
  display: table;
  table-layout: fixed;
  background: #f0eae8;
  width: 100%;
  margin: 0;
  padding: 1em;
}
.prakriya a {
  color: inherit;
  font-style: italic;
}
.prakriya a:hover {
  color: #000;
}
.prakriya li {
  display: table-row;
}
.prakriya .sa1 {
  font-size: 1.25em;
}
.prakriya .result, .prakriya .rule {
  display: table-cell;
}
.prakriya .result {
  width: 30%;
}
.prakriya .rule {
  color: rgba(0, 0, 0, 0.5);
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sounds {
  list-style: none;
  padding: 0;
  margin: 2em 0;
  display: flex;
}

.sa-iso {
  font-family: sans-serif;
}

.sounds li {
  text-align: center;
  flex: 1;
}

.sounds .sa1 {
  font-size: 3rem;
}

.sounds .sa2 {
  font-size: 1.25rem;
}

.sth-1 {
  color: #c00;
}

.sth-2 {
  color: #ec9e05;
}

.sth-3 {
  color: #5bb310;
}

.sth-4 {
  color: #007cff;
}

.sth-5 {
  color: #8359a7;
}

.call-to-action {
  display: inline-block;
  margin: auto;
  background: #51d385;
  text-decoration: none;
  font-family: inherit;
  border-radius: 5px;
  color: #fff;
  border: 0;
}
.call-to-action:visited {
  color: #fff;
}
.call-to-action:hover {
  color: #fff;
  background: #a2e8be;
  cursor: pointer;
}

.print-only {
  display: none;
}

.readable {
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.part2 {
  background: #f7f7f7;
}

.index {
  color: #fff;
}
.index .logo {
  font-size: 6rem;
  line-height: 1em;
}

.default .main {
  background: #f7f7f7;
  border-bottom: 3px #ddd double;
}

.main ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: center;
  line-height: 1rem;
}

.main a {
  text-decoration: none;
  display: block;
  padding: 1rem;
  transition: 0.2s;
}
.main a:hover {
  color: #222;
  text-decoration: underline;
}

.index a {
  color: #fff;
}

.default a {
  color: #666;
}

.breadcrumbs {
  padding: 1em;
  background: #f7f7f7;
}
.breadcrumbs a, .breadcrumbs a:visited {
  color: inherit;
  text-decoration: none;
}
.breadcrumbs a:hover {
  text-decoration: underline;
}
.breadcrumbs .cur {
  font-weight: bold;
}

.breadcrumbs {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  border-bottom: 3px #ddd double;
}

.scroll-list, .unit {
  line-height: 1.6em;
}

.contact {
  padding: 1rem;
  background: #f7f7f7;
}
.contact input[type=email] {
  font-family: inherit;
  width: 100%;
  line-height: 1.5rem;
}
.contact textarea {
  font-family: inherit;
  width: 100%;
  min-height: 200px;
}
.contact button {
  background: #06b;
  font-family: inherit;
  color: #fff;
  border: 0;
  border-radius: 5px;
}

.faq dt {
  font-style: italic;
}

.default, .sandhi {
  width: 100%;
  border-collapse: collapse;
  text-align: center;
}
.default th, .sandhi th {
  background: #e2ecf9;
  color: #00418e;
}
.default tr:nth-of-type(even), .sandhi tr:nth-of-type(even) {
  background: #f4f9ff;
}

.sandhi {
  border-bottom: 1px #d0e6ff solid;
}
.sandhi td, .sandhi th {
  padding: 0.5em;
  border: 1px #d0e6ff solid;
  border-width: 1px 1px 0 0;
}
.sandhi tr > :first-child {
  border-left: 1px #d0e6ff solid;
}
.sandhi tr:first-child th {
  border-bottom: 3px #d0e6ff solid;
}
.sandhi td + th {
  text-align: left;
  border-left: 3px #d0e6ff solid;
}

.default th {
  padding: 0.5rem;
}

.default td {
  padding: 0.25em;
}

.default .sa1 {
  font-size: 1.5em;
}

@media screen and (max-width: 30em) {
  html {
    font-size: 16px;
  }

  h1 {
    font-size: 1.25em;
  }

  .examples .sa1 {
    font-size: 1.25em;
  }

  .sounds .sa1 {
    font-size: 2.25rem;
  }
}