1 * { 2 margin: 0; 3 padding: 0; 4 border: 0; 5 overflow-x: visible; 6 overflow-y: unset; 7 } 8 9 /* Avoid showing the background of the scrollbar when the content is small enough */ 10 html { 11 margin-left: calc(100vw - 100%); 12 margin-right: 0; 13 overflow-y: scroll; 14 } 15 16 body { 17 color: antiquewhite; 18 background: #141414; 19 margin-bottom: 15em; 20 margin-left: .5em; 21 margin-right: .5em; 22 font-size: 16px; 23 font-family: "inconsolata", monospace, "DejaVu Sans", sans, "Verdana", sans-serif, "Georgia", serif; 24 } 25 26 header { 27 color: crimson; 28 29 max-width: 39em; 30 31 margin-left: auto; 32 margin-right: auto; 33 margin-top: .5em; 34 margin-bottom: .25em; 35 36 text-align: center; 37 38 padding-top: .75em; 39 padding-bottom: .25em; 40 41 border-top: 1em; 42 } 43 44 .header_flex_div { 45 display: flex; 46 justify-content: center; 47 flex-wrap: wrap; 48 align-items: baseline; 49 } 50 51 .header_bottom_bar { 52 border: 0; 53 clear:both; 54 55 display:block; 56 57 width: 80%; 58 max-width: 35em; 59 height: 0px; 60 margin-left: auto; 61 margin-right: auto; 62 margin-top: .5em; 63 margin-bottom: .5em; 64 padding-top: 0; 65 padding-bottom: 0; 66 border-top: 1px dashed peru; 67 } 68 69 #header_link, #header_link_short { 70 text-decoration: none; 71 color: inherit; 72 transition: .75; 73 74 font-family: "inconsolata", monospace, "DejaVu Sans", sans, sans-serif; 75 } 76 77 #header_link:hover { 78 color: peru; 79 } 80 81 #header_title { 82 margin-bottom: .150em; 83 font-size: 2.25em; 84 width: 100%; 85 } 86 87 article { 88 color: antiquewhite; 89 90 max-width: 39em; 91 92 margin-left: auto; 93 margin-right: auto; 94 margin-bottom: .9em; 95 96 text-align: left; 97 98 padding-left: 0.5em; 99 padding-right: 0.5em; 100 padding-top: 1em; 101 padding-bottom: 1em; 102 103 border-radius: 1em; 104 } 105 106 .article_bottom_bar { 107 border: 0; 108 clear: both; 109 110 display: block; 111 112 width: 60%; 113 max-width: 20em; 114 height: 0px; 115 116 margin-left: auto; 117 margin-right: auto; 118 margin-top: 1em; 119 margin-bottom: 0; 120 121 padding-top: 0; 122 padding-bottom: 0; 123 /*! border-bottom: dashed; */ 124 border-top: 1px dashed peru; 125 } 126 127 footer { 128 text-align: center; 129 font-size: 0.75em; 130 a:hover { 131 text-decoration: none; 132 } 133 br { 134 margin-bottom: 3px; 135 } 136 } 137 138 #footer-buttons { 139 padding: 0; 140 margin: 0; 141 border-width: 0; 142 width: 80px; 143 opacity: 45%; 144 } 145 146 #footer-buttons:hover { 147 opacity: 100%; 148 } 149 150 .footer-div { 151 padding: 0em 2em 2.5em 2em; 152 margin-left: auto; 153 margin-right:auto; 154 } 155 156 #index-title, #blog-title { 157 text-align: center; 158 color: #DAA520; 159 padding-top: 0em; 160 padding-bottom: .5em; 161 animation: zoom-in-zoom-out 5s ease-in-out infinite; 162 } 163 164 #blog-title { 165 animation: none; 166 } 167 168 img { 169 overflow: hidden; 170 171 height: 100%; 172 width: 100%; 173 174 color: black; 175 background: transparent; 176 } 177 178 a:visited, a:active, a:link { 179 color: peru; 180 text-decoration: none; 181 } 182 183 a:hover { 184 color: crimson; 185 text-decoration: underline; 186 } 187 188 ol { 189 list-style-position: inside; 190 } 191 192 ul { 193 list-style-type: none; /* Remove bullets */ 194 list-style-position: inside; 195 list-style: inside; 196 padding: 0; 197 padding-bottom: .5em; 198 margin: 0; /* Remove margins */ 199 } 200 201 .header_buttons { 202 margin: 0 0 .100em 0; 203 padding-bottom: 0em; 204 font-size: 1.5em; 205 display: flex; 206 flex-wrap: wrap; 207 justify-content: center; 208 list-style-type: none; 209 } 210 211 h1 { font-size: 1.75em; } 212 213 h2 { 214 font-size: 1.25em; 215 216 padding-top: 1em; 217 padding-bottom: .5em; 218 } 219 220 h3 { 221 font-size: 1em; 222 text-align: left; 223 224 padding-top: .5em; 225 padding-bottom: .5em; 226 } 227 228 h4 { padding-top: .5em; text-align: left; } 229 230 h5 { 231 padding-bottom: .25em; 232 font-size: 1em; 233 } 234 235 p { padding-bottom: 1em; } 236 237 code { 238 font-size: 85%; 239 font-family: "Ubuntu Mono", monospace; 240 background-color: rgba(110,118,129,0.4); 241 padding: .1em .4em; 242 margin: 0; 243 border-radius: 6px; 244 white-space: nowrap; 245 } 246 247 pre { 248 text-align: left; 249 250 padding-top: .5em; 251 padding-bottom: .5em; 252 padding-left: .75em; 253 padding-right: .75em; 254 border-radius: .2em; 255 background-color: #111111; 256 width: auto; 257 display: block; 258 margin-left: auto; 259 margin-right: auto; 260 margin-top: .25em; 261 margin-bottom: 1.25em; 262 border-width: thin; 263 border-color: antiquewhite; 264 border-style: dashed; 265 /* box-shadow: 5px 5px 7px black; */ 266 overflow: auto; 267 } 268 269 pre code { 270 font-size: 1em; 271 background-color: inherit; 272 /* background: rgba(0,0,0,0.5); */ 273 padding: 0; 274 margin: 0; 275 border-radius: 0; 276 white-space: inherit; 277 } 278 279 #command { color: #33ff11; } 280 #command_sym { color: #ff1694; } 281 #command_red { color: gold; } 282 283 a.anchor{ 284 display:block; 285 position: relative; 286 top: 150px; 287 visibility: hidden; 288 } 289 290 hr { 291 border: 0; 292 clear:both; 293 294 display:block; 295 296 width: 90%; 297 height: .1em; 298 margin-left: auto; 299 margin-right: auto; 300 margin-top: 0; 301 margin-bottom: 0; 302 padding-top: 0; 303 padding-bottom: 0; 304 } 305 306 #go_top { 307 text-decoration: none; 308 color: peru; 309 } 310 311 #go_top:hover { 312 color: crimson; 313 } 314 315 #blog_entries { 316 list-style-type: none; /* Remove bullets */ 317 padding: 0; 318 padding-bottom: .5em; 319 text-align: left; 320 } 321 322 #latest-uploads { 323 display: flex; 324 align-items: center; 325 padding-top: 0em; 326 padding-bottom: .5em; 327 } 328 329 #urgent-announcement { 330 color: antiquewhite; 331 font-weight: bold; 332 padding: 0.5em 0em 1em 0em; 333 } 334 335 #urgent-announcement a { 336 color: orangered; 337 text-decoration: underline; 338 } 339 340 b-time { 341 font-family: "inconsolata", monospace; 342 } 343 344 @media (max-width: 800px) { 345 body { 346 margin-left: 0em; 347 margin-right: 0em; 348 } 349 header { 350 padding-top: .5em; 351 padding-bottom: 0; 352 } 353 article { 354 padding-top: .75em; 355 padding-bottom: .5em; 356 margin-bottom: .25em; 357 } 358 footer { 359 padding-top: .5em; 360 } 361 .header_flex_div{ 362 flex-direction: column; 363 align-items: center; 364 } 365 .header_buttons{ 366 margin-top: 0; 367 font-size: 1.75em; 368 align-self: center; 369 padding-top: 0em; 370 padding-bottom: .5em; 371 372 a:hover { 373 color: peru; 374 } 375 } 376 .header_bottom_bar{ 377 width: 55%; 378 } 379 .article_bottom_bar { 380 width: 40%; 381 padding-top: .5em; 382 margin-top: 1em; 383 } 384 #header_title { 385 font-size: 2.50em; 386 line-height: 1.10em; 387 padding-bottom: .10em; 388 } 389 #index-title { 390 padding-top: 0; 391 padding-bottom: .5em; 392 } 393 #latest-uploads { 394 padding-bottom: .25em; 395 } 396 #header_link { 397 display: none; 398 } 399 #header_link_short { 400 display: initial !important; 401 } 402 } 403 404 @media (max-width: 400px) { 405 body { 406 font-size: 14px; 407 } 408 header { 409 padding-top: 0em; 410 padding-bottom: 0; 411 margin-top: .25em; 412 } 413 article { 414 margin-bottom: .25em; 415 } 416 p { padding-bottom: .75em; } 417 #header_title { 418 font-size: 2.25em; 419 padding-bottom: 0; 420 } 421 .header_bottom_bar { 422 margin-top: 0; 423 margin-bottom: 0; 424 } 425 .header_buttons { 426 padding-bottom: .25em; 427 } 428 #index-title { 429 padding-top: .25em; 430 padding-bottom: .5em; 431 font-size: 1.5em; 432 } 433 #latest-uploads { 434 padding-bottom: 0; 435 } 436 .article_bottom_bar { 437 padding-top: .25em; 438 margin-top: .5em; 439 } 440 .footer-div { 441 padding: 0em 2em 1.75em 2em; 442 } 443 } 444 445 @media (prefers-color-scheme: light) { 446 body { 447 background: white; 448 color: #000000; 449 } 450 article { 451 color: #000000; 452 } 453 #header_link { 454 color: #CC2936; 455 } 456 #header_link:hover { 457 color: #a04a00; 458 } 459 .header_bottom_bar { 460 border-top: 1px dashed #141414; 461 } 462 .article_bottom_bar { 463 border-top: 1px dashed #141414; 464 } 465 a:visited { 466 color: #a04a00; 467 } 468 a:link { 469 color: #a04a00; 470 } 471 a:hover { 472 color: #CC2936; 473 } 474 #index-title { 475 color: inherit; 476 } 477 pre { 478 background-color: #eee; 479 border: 3px solid #aaa; 480 border-radius: 0px; 481 margin-top: 0; 482 box-shadow: 0px 0px 0px; 483 } 484 #command { color: inherit; } 485 #command_sym { color: inherit; } 486 #command_red { color: inherit; } 487 488 #go_top:hover { 489 color: #CC2936; 490 } 491 #go_top { 492 color: #a04a00; 493 } 494 #urgent-announcement { 495 color: #090909; 496 } 497 } 498 499 @keyframes zoom-in-zoom-out { 500 0% { 501 transform: scale(1, 1); 502 } 503 50% { 504 transform: scale(1.12, 1.12); 505 } 506 100% { 507 transform: scale(1, 1); 508 } 509 }
