1:root {
  2  --light: #f4f4f4;
  3  --cyan: #509c93;
  4  --light-gray: #eee;
  5  --medium-gray: #ddd;
  6  --gray: #6a6a6a;
  7  --dark: #444;
  8  --darker: #222;
  9}
 10
 11html {
 12  background: var(--light);
 13  -webkit-text-size-adjust: none;
 14  font-family: "InterVar", -apple-system, BlinkMacSystemFont, "Roboto", "Segoe UI", sans-serif;
 15}
 16
 17::selection {
 18  background: var(--medium-gray);
 19  opacity: 0.3;
 20}
 21
 22* {
 23  box-sizing: border-box;
 24  padding: 0;
 25  margin: 0;
 26}
 27
 28body {
 29  max-width: 750px;
 30  padding: 0 13px;
 31  margin: 40px auto;
 32}
 33
 34main, footer {
 35  font-size: 1rem;
 36  padding: 0;
 37  line-height: 160%;
 38}
 39
 40main h1, h2, h3, .small-heading {
 41  font-family: "InterDisplay", -apple-system, BlinkMacSystemFont, "Roboto", "Segoe UI", sans-serif;
 42  font-weight: 500;
 43}
 44
 45strong {
 46  font-weight: 500;
 47}
 48
 49main h1 {
 50  font-size: 20px;
 51  padding: 10px 0 10px 0;
 52}
 53
 54main h2 {
 55  font-size: 18px;
 56}
 57
 58main h2, h3 {
 59  padding: 20px 0 15px 0;
 60}
 61
 62nav {
 63  padding-top: 1rem;
 64}
 65
 66nav ul {
 67  padding: 0;
 68  margin: 0;
 69  list-style: none;
 70  padding-bottom: 20px;
 71}
 72
 73nav ul li {
 74  padding-right: 10px;
 75  display: inline-block;
 76}
 77
 78a {
 79  margin: 0;
 80  padding: 0;
 81  box-sizing: border-box;
 82  text-decoration: none;
 83  word-wrap: break-word;
 84}
 85
 86a {
 87  color: var(--darker);
 88  border-bottom: 1.5px solid var(--medium-gray);
 89}
 90
 91a:hover {
 92  border-bottom: 1.5px solid var(--gray);
 93}
 94
 95.repo-index {
 96  display: grid;
 97  grid-template-columns: 6em 1fr 7em;
 98  grid-row-gap: 0.5em;
 99}
100
101.repo-index-headings {
102  display: grid;
103  grid-template-columns: 6em 1fr 7em;
104  padding-bottom: 1.2em;
105  padding-top: 1.2em;
106}
107
108@media (max-width: 385px) {
109  .repo-index {
110    grid-row-gap: 0.8em;
111  }
112}