misconstruedⓂ️monologues https://blog.bemoe.online
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

172 lines
2.1KB

  1. html {
  2. font-family: monospace;
  3. font-size: 82.5%;
  4. color: #eee;
  5. background-color: #4a525a;
  6. }
  7. body {
  8. font-size: 1.6rem;
  9. color: #fff;
  10. text-align: justify;
  11. }
  12. img {
  13. max-width: 100%;
  14. margin: 0 auto;
  15. }
  16. blockquote {
  17. padding: 0 1em;
  18. color: #2ecc40;
  19. border-left: 0.25em solid #dfe2e5;
  20. }
  21. header {
  22. border-bottom: 0.2rem solid #eee;
  23. }
  24. nav {
  25. text-align: right;
  26. }
  27. nav a, nav a:visited {
  28. font-size: 1.8rem;
  29. font-weight: bold;
  30. color: #ddd;
  31. text-decoration: none;
  32. text-transform: lowercase;
  33. }
  34. a {
  35. text-decoration: none;
  36. }
  37. a:link {
  38. color: #499cd4;
  39. }
  40. a:visited {
  41. color: #CA49D4;
  42. }
  43. footer {
  44. margin-top: 3rem;
  45. padding: 1.2rem 0;
  46. border-top: 0.2rem solid #eee;
  47. font-size: 1.2rem;
  48. color: #555;
  49. }
  50. h1 {
  51. font-size: 2.4rem;
  52. }
  53. h2 {
  54. font-size: 2rem;
  55. }
  56. article .header {
  57. font-size: 1.4rem;
  58. font-style: italic;
  59. color: #555;
  60. }
  61. .logo a {
  62. font-weight: bold;
  63. color: #ccc;
  64. text-decoration: none;
  65. }
  66. @media (max-width: 319px) {
  67. body {
  68. width: 90%;
  69. margin: 0;
  70. padding: 0 5%;
  71. }
  72. header {
  73. margin: 4.2rem 0;
  74. }
  75. nav {
  76. margin: 0 auto 3rem;
  77. text-align: center;
  78. }
  79. footer {
  80. text-align: center;
  81. }
  82. .logo {
  83. text-align: center;
  84. margin: 1rem auto 3rem;
  85. }
  86. .logo a {
  87. font-size: 2.4rem;
  88. }
  89. nav a {
  90. display: block;
  91. line-height: 1.6;
  92. }
  93. }
  94. @media (min-width: 320px) {
  95. body {
  96. width: 90%;
  97. margin: 0;
  98. padding: 0 5%;
  99. /* text-align: center;
  100. */
  101. }
  102. header {
  103. margin: 4.2rem 0;
  104. }
  105. nav {
  106. margin: 0 auto 3rem;
  107. text-align: center;
  108. }
  109. footer {
  110. text-align: center;
  111. }
  112. .logo {
  113. text-align: center;
  114. margin: 1rem auto 3rem;
  115. }
  116. .logo a {
  117. font-size: 2.4rem;
  118. }
  119. nav a {
  120. display: inline;
  121. margin: 0 0.6rem;
  122. }
  123. }
  124. @media (min-width: 640px) {
  125. body {
  126. width: 72rem;
  127. margin: 0 auto;
  128. padding: 0;
  129. }
  130. header {
  131. margin: 0 0 3rem;
  132. padding: 1.2rem 0;
  133. }
  134. nav {
  135. margin: 0;
  136. text-align: right;
  137. }
  138. nav a {
  139. margin: 0 0 0 1.2rem;
  140. display: inline;
  141. }
  142. footer {
  143. text-align: right;
  144. }
  145. .logo {
  146. margin: 0;
  147. text-align: left;
  148. }
  149. .logo a {
  150. float: left;
  151. font-size: 1.8rem;
  152. }
  153. }