1* { 2 box-sizing: border-box; } 3 4body { 5 padding: 0; 6 margin: 0; 7 font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; 8 font-size: 16px; 9 line-height: 1.5; 10 color: #606c71; } 11 12a { 13 color: #1e6bb8; 14 text-decoration: none; } 15 a:hover { 16 text-decoration: underline; } 17 18.btn { 19 display: inline-block; 20 margin-bottom: 1rem; 21 color: rgba(255, 255, 255, 0.7); 22 background-color: rgba(255, 255, 255, 0.08); 23 border-color: rgba(255, 255, 255, 0.2); 24 border-style: solid; 25 border-width: 1px; 26 border-radius: 0.3rem; 27 transition: color 0.2s, background-color 0.2s, border-color 0.2s; } 28 .btn + .btn { 29 margin-left: 1rem; } 30 31.btn:hover { 32 color: rgba(255, 255, 255, 0.8); 33 text-decoration: none; 34 background-color: rgba(255, 255, 255, 0.2); 35 border-color: rgba(255, 255, 255, 0.3); } 36 37@media screen and (min-width: 64em) { 38 .btn { 39 padding: 0.75rem 1rem; } } 40 41@media screen and (min-width: 42em) and (max-width: 64em) { 42 .btn { 43 padding: 0.6rem 0.9rem; 44 font-size: 0.9rem; } } 45 46@media screen and (max-width: 42em) { 47 .btn { 48 display: block; 49 width: 100%; 50 padding: 0.75rem; 51 font-size: 0.9rem; } 52 .btn + .btn { 53 margin-top: 1rem; 54 margin-left: 0; } } 55 56.page-header { 57 color: #fff; 58 text-align: center; 59 background-color: #159957; 60 background-image: linear-gradient(120deg, #155799, #159957); } 61 62@media screen and (min-width: 64em) { 63 .page-header { 64 padding: 5rem 6rem; } } 65 66@media screen and (min-width: 42em) and (max-width: 64em) { 67 .page-header { 68 padding: 3rem 4rem; } } 69 70@media screen and (max-width: 42em) { 71 .page-header { 72 padding: 2rem 1rem; } } 73 74.project-name { 75 margin-top: 0; 76 margin-bottom: 0.1rem; } 77 78@media screen and (min-width: 64em) { 79 .project-name { 80 font-size: 3.25rem; } } 81 82@media screen and (min-width: 42em) and (max-width: 64em) { 83 .project-name { 84 font-size: 2.25rem; } } 85 86@media screen and (max-width: 42em) { 87 .project-name { 88 font-size: 1.75rem; } } 89 90.project-tagline { 91 margin-bottom: 2rem; 92 font-weight: normal; 93 opacity: 0.7; } 94 95@media screen and (min-width: 64em) { 96 .project-tagline { 97 font-size: 1.25rem; } } 98 99@media screen and (min-width: 42em) and (max-width: 64em) { 100 .project-tagline { 101 font-size: 1.15rem; } } 102 103@media screen and (max-width: 42em) { 104 .project-tagline { 105 font-size: 1rem; } } 106 107.main-content :first-child { 108 margin-top: 0; } 109.main-content img { 110 max-width: 100%; } 111.main-content h1, .main-content h2, .main-content h3, .main-content h4, .main-content h5, .main-content h6 { 112 margin-top: 2rem; 113 margin-bottom: 1rem; 114 font-weight: normal; 115 color: #159957; } 116.main-content p { 117 margin-bottom: 1em; } 118.main-content code { 119 padding: 2px 4px; 120 font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace; 121 font-size: 0.9rem; 122 color: #383e41; 123 background-color: #f3f6fa; 124 border-radius: 0.3rem; } 125.main-content pre { 126 padding: 0.8rem; 127 margin-top: 0; 128 margin-bottom: 1rem; 129 font: 1rem Consolas, "Liberation Mono", Menlo, Courier, monospace; 130 color: #567482; 131 word-wrap: normal; 132 background-color: #f3f6fa; 133 border: solid 1px #dce6f0; 134 border-radius: 0.3rem; } 135 .main-content pre > code { 136 padding: 0; 137 margin: 0; 138 font-size: 0.9rem; 139 color: #567482; 140 word-break: normal; 141 white-space: pre; 142 background: transparent; 143 border: 0; } 144.main-content .highlight { 145 margin-bottom: 1rem; } 146 .main-content .highlight pre { 147 margin-bottom: 0; 148 word-break: normal; } 149.main-content .highlight pre, .main-content pre { 150 padding: 0.8rem; 151 overflow: auto; 152 font-size: 0.9rem; 153 line-height: 1.45; 154 border-radius: 0.3rem; } 155.main-content pre code, .main-content pre tt { 156 display: inline; 157 max-width: initial; 158 padding: 0; 159 margin: 0; 160 overflow: initial; 161 line-height: inherit; 162 word-wrap: normal; 163 background-color: transparent; 164 border: 0; } 165 .main-content pre code:before, .main-content pre code:after, .main-content pre tt:before, .main-content pre tt:after { 166 content: normal; } 167.main-content ul, .main-content ol { 168 margin-top: 0; } 169.main-content blockquote { 170 padding: 0 1rem; 171 margin-left: 0; 172 color: #819198; 173 border-left: 0.3rem solid #dce6f0; } 174 .main-content blockquote > :first-child { 175 margin-top: 0; } 176 .main-content blockquote > :last-child { 177 margin-bottom: 0; } 178.main-content table { 179 display: block; 180 width: 100%; 181 overflow: auto; 182 word-break: normal; 183 word-break: keep-all; } 184 .main-content table th { 185 font-weight: bold; } 186 .main-content table th, .main-content table td { 187 padding: 0.5rem 1rem; 188 border: 1px solid #e9ebec; } 189.main-content dl { 190 padding: 0; } 191 .main-content dl dt { 192 padding: 0; 193 margin-top: 1rem; 194 font-size: 1rem; 195 font-weight: bold; } 196 .main-content dl dd { 197 padding: 0; 198 margin-bottom: 1rem; } 199.main-content hr { 200 height: 2px; 201 padding: 0; 202 margin: 1rem 0; 203 background-color: #eff0f1; 204 border: 0; } 205 206@media screen and (min-width: 64em) { 207 .main-content { 208 max-width: 64rem; 209 padding: 2rem 6rem; 210 margin: 0 auto; 211 font-size: 1.1rem; } } 212 213@media screen and (min-width: 42em) and (max-width: 64em) { 214 .main-content { 215 padding: 2rem 4rem; 216 font-size: 1.1rem; } } 217 218@media screen and (max-width: 42em) { 219 .main-content { 220 padding: 2rem 1rem; 221 font-size: 1rem; } } 222 223.site-footer { 224 padding-top: 2rem; 225 margin-top: 2rem; 226 border-top: solid 1px #eff0f1; } 227 228.site-footer-owner { 229 display: block; 230 font-weight: bold; } 231 232.site-footer-credits { 233 color: #819198; } 234 235@media screen and (min-width: 64em) { 236 .site-footer { 237 font-size: 1rem; } } 238 239@media screen and (min-width: 42em) and (max-width: 64em) { 240 .site-footer { 241 font-size: 1rem; } } 242 243@media screen and (max-width: 42em) { 244 .site-footer { 245 font-size: 0.9rem; } } 246