main.css 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147
  1. /*
  2. . .
  3. ,-,-. ," . , , ,-. ,-. . . |-. ,-. ,-. ,-. . . ,-. | ,
  4. | | | |- |/|/ `-. -- | | | | | |-' | | | | | | | |<
  5. ' ' ' | ' ' `-' `-' `-| ^-' `-' ' |-' `-^ ' ' ' `
  6. ' /| |
  7. `-' '
  8. mfws-cyberpunk
  9. - Mobile first screen sizes.
  10. - Eighty column rule.
  11. - Upper-case for 3-char hex.
  12. - Lower-case for 6-char hex.
  13. - Space after semi-colon if preceding a letter.
  14. - Space after a colon.
  15. - Only define classes when necessary.
  16. - Media queries last.
  17. */
  18. body {
  19. margin: 1rem auto;
  20. padding: 0 3.2%;
  21. width: 93.6%;
  22. max-width: 1024px;
  23. font-family: sans-serif;
  24. line-height: 1.4;
  25. color: #efefef;
  26. background: #000;
  27. }
  28. a {
  29. color: #aaaaff;
  30. }
  31. a:visited {
  32. color: #ca8aff;
  33. }
  34. a:hover {
  35. color: #FCF;
  36. }
  37. a:active {
  38. color: #FFF;
  39. }
  40. :focus {
  41. border: 1px solid #ff00ff;
  42. }
  43. h1, h2, h3, h4, h5, h6, h7 {
  44. font-family: monospace;
  45. font-size: x-large;
  46. margin: 20px 0 10px 0;
  47. }
  48. h1, .title {
  49. color: #ff1100;
  50. }
  51. h2 {
  52. color: #40ff5c;
  53. }
  54. h3 {
  55. color: #ff4081;
  56. }
  57. h4 {
  58. color: #00beff;
  59. }
  60. h5 {
  61. color: #9c00ff;
  62. }
  63. h6 {
  64. color: #ff4c50;
  65. }
  66. h7 {
  67. color: #ff00be;
  68. }
  69. img {
  70. max-width: 100%;
  71. }
  72. pre {
  73. white-space: pre;
  74. }
  75. pre.src {
  76. background-color: #000;
  77. color: #0F0;
  78. font-family: monospace;
  79. }
  80. blockquote {
  81. background: #328;
  82. color: #CCC;
  83. font-family: serif;
  84. }
  85. table {
  86. background-color: #222;
  87. color: #40ff5c;
  88. margin: 10px 0 20px 0;
  89. }
  90. tr:nth-child(even) {
  91. background-color: #ff8c10;
  92. color: #222;
  93. }
  94. img.art {
  95. margin: 0px auto;
  96. display: block;
  97. max-height: 480px;
  98. }
  99. .hash {
  100. font-family: monospace;
  101. }
  102. .todo {
  103. color: #ff9c00;
  104. border: 1px solid #ff9c00;
  105. padding: 0 5px;
  106. }
  107. .done {
  108. color: violet;
  109. border: 1px solid violet;
  110. padding: 0 5px;
  111. }
  112. @media only screen and (min-width: 640px) {
  113. body {
  114. min-width: 600px;
  115. width: 80%;
  116. padding: 0 10px;
  117. }
  118. }
  119. /*# sourceMappingURL=main.css.map */