theme.css 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227
  1. /* because standards */
  2. @viewport {
  3. width: device-width;
  4. }
  5. @-ms-viewport {
  6. width: device-width;
  7. }
  8. body {
  9. font-family: "Museo Sans", "museo-sans", sans-serif;
  10. font-size: 100%;
  11. color: #534741;
  12. line-height: 1.25;
  13. background: #F2EDE6;
  14. margin: 0;
  15. }
  16. @media (max-width: 600px) {
  17. body {
  18. font-size: 100%;
  19. }
  20. }
  21. /* force android webkit to use relative header size */
  22. body h1 {
  23. font-family: "Museo", "museo", sans-serif;
  24. font-weight: 500;
  25. }
  26. p {
  27. hyphens: auto;
  28. -moz-hyphens: auto;
  29. word-wrap: break-word;
  30. }
  31. hr {
  32. border-color: #D3D3D3;
  33. }
  34. a {
  35. color: #6495ED;
  36. text-decoration: none;
  37. }
  38. code, pre {
  39. font-family: Monaco, Menlo, Consolas, monospace;
  40. font-size: 75%;
  41. }
  42. code {
  43. background: #FFFFE0;
  44. padding: 0px 0.2em;
  45. border-radius: 0.25em;
  46. }
  47. .code {
  48. padding: 0em 0.5em;
  49. border-radius: 0.25em;
  50. }
  51. .code pre {
  52. padding: 0.25em 0em;
  53. overflow-x: auto;
  54. }
  55. table {
  56. border-collapse: collapse;
  57. }
  58. td {
  59. padding: 0px 0.5em;
  60. }
  61. thead tr {
  62. font-weight: bold;
  63. border-bottom: solid 1px #808080;
  64. }
  65. .clearfix:after {
  66. content: " ";
  67. display: block;
  68. height: 0;
  69. clear: both;
  70. }
  71. .header {
  72. background: #F0E5D8;
  73. text-align: center;
  74. padding: 20px 0;
  75. }
  76. /* TODO: Fix this shit. */
  77. .header h1 {
  78. /*float: left;*/
  79. /*display: inline-block;*/
  80. font-size: 1.75em;
  81. margin: 0.125em auto;
  82. text-transform: lowercase;
  83. font-weight: 300;
  84. }
  85. .header img {
  86. width: 128px;
  87. height: 128px;
  88. border: 2px solid #534741;
  89. border-radius: 50%;
  90. }
  91. .header > a {
  92. font-family: "Museo";
  93. color: #534741;
  94. display: inline-block;
  95. border-bottom: 1px solid transparent;
  96. transition: all 0.4s;
  97. }
  98. .header > a:hover {
  99. text-decoration: none;
  100. border-bottom: 1px solid black;
  101. }
  102. .header .twitter {
  103. font-size: 1.25em;
  104. font-weight: 100;
  105. }
  106. .nav {
  107. float: right;
  108. display: inline-block;
  109. padding: 0px;
  110. margin: 0px;
  111. }
  112. .nav li {
  113. list-style: none;
  114. margin: 0.5em 0.2em;
  115. display: inline;
  116. font-size: 80%;
  117. }
  118. @media (max-width: 800px) {
  119. .header {
  120. /*margin: 1em 0px;*/
  121. }
  122. .header > h1 {
  123. display: block;
  124. float: none;
  125. }
  126. .nav {
  127. display: block;
  128. float: none;
  129. }
  130. .nav li {
  131. display: block;
  132. font-size: 100%;
  133. }
  134. }
  135. .container {
  136. max-width: 800px;
  137. margin: 0 auto;
  138. }
  139. .footer {
  140. text-align: center;
  141. }
  142. .postbox {
  143. margin-top: 2em;
  144. font-weight: 300;
  145. font-size: 1.2em;
  146. line-height: 1.8;
  147. }
  148. .postbox img {
  149. max-width: 100%;
  150. }
  151. .postbox .title h1 {
  152. font-size: 1.9em;
  153. }
  154. .postbox .title h1 a {
  155. color: #534741;
  156. border-bottom: 0px solid transparent;
  157. -webkit-transition: all 0.2s;
  158. -moz-transition: all 0.2s;
  159. -ms-transition: all 0.2s;
  160. transition: all 0.2s;
  161. padding-bottom: 12px;
  162. }
  163. .postbox .title h1 a:hover {
  164. border-bottom: 2px solid #534741;
  165. padding-bottom: 0;
  166. }
  167. .postbox .title h1 small {
  168. float: right;
  169. font-size: 50%;
  170. font-weight: normal;
  171. color: #808080;
  172. line-height: 4.1;
  173. }
  174. .pager {
  175. list-style: none;
  176. text-align: center;
  177. padding: 0px;
  178. }
  179. .pager li > a {
  180. display: inline-block;
  181. }
  182. .pager .previous a {
  183. float: left;
  184. }
  185. .pager .next a {
  186. float: right;
  187. }