cabin

0 input, textarea, button, select, a {

1 --webkit-tap-highlight-color: rgba(0,0,0,0);

2 }

3

4 html, body {

5 margin: 0;

6 padding: 0;

7

8 border: 0;

9 font: inherit;

10 vertical-align: baseline;

11 }

12

13 body {

14 font-family: monospace;

15 font-size: 1.2em;

16 }

17

18 #content {

19 background-color: var(--theme_bg0);

20 color: var(--theme_fg0);

21

22 min-width: 100vw;

23 min-height: 100vh;

24

25 padding-top: 2em;

26 padding-bottom: 2em;

27

28 position: relative;

29 display: table;

30 box-sizing: border-box;

31

32 padding-left: 5vw;

33 padding-right: 5vw;

34 }

35

36 hr {

37 color: var(--theme_fgt0_hard);

38 width: 100%;

39 margin-left: auto;

40 margin-right: auto;

41 }

42

43 header, footer {

44 width: 100%;

45

46 display: flex;

47 flex-direction: column;

48 justify-content: center;

49 align-items: center;

50 }

51

52 header nav,

53 footer nav {

54 display: flex;

55 justify-content: space-between;

56

57 width: 100%;

58

59 margin-left: auto;

60 margin-right: auto;

61 /* padding-right: 40px; */

62 }

63

64 .back {

65 cursor:pointer;

66 }

67

68 main {

69 min-height: 100% ;

70

71 margin-bottom: auto;

72

73 position: relative;

74 display: flex;

75 flex-direction: column;

76 justify-content: center;

77 box-sizing: border-box;

78 }

79

80 p {

81 text-overflow: ellipsis;

82 overflow: hidden;

83 max-width: 80vw;

84 }

85

86 img {

87 width: 100%;

88 height: 100%;

89 }

90

91 pre, code

92 {

93 background-color: var(--theme_bg1);

94 color: var(--theme_fg1);

95 white-space: pre-wrap;

96 white-space: -moz-pre-wrap !important;

97 white-space: -pre-wrap;

98 white-space: -o-pre-wrap;

99 word-wrap: break-word;

100 }

101

102 pre

103 {

104 padding: 0.5em;

105 border-radius: 5px;

106 border: 1px solid var(--theme_fg4);

107 margin-left: 0.5em;

108 margin-right: 0.5em;

109 }

110

111 a {

112 color:var(--theme_blue);

113 text-decoration: none;

114 }

115

116 table

117 {

118 border-collapse: collapse;

119 border-spacing: 0; /* IE 6 */

120

121 border-bottom: 2pt solid var(--theme_bg3);

122 border-top: 2pt solid var(--theme_bg3); /* The caption on top will not have a bottom-border */

123 background-color: var(--theme_bg1); /* Does this BG print well? */

124

125 /* Center */

126 margin-left: auto;

127 margin-right: auto;

128 }

129

130 thead /* Entire table header */

131 {

132 border-bottom: 1pt solid var(--theme_bg3);

133 background-color: var(--theme_bg2); /* Does this BG print well? */

134 }

135

136 tr.header /* Each header row */

137 {

138 }

139

140 tbody /* Entire table body */

141 {

142 }

143

144 /* Table body rows */

145

146 tr {

147 }

148 tr.odd:hover, tr.even:hover /* Use .odd and .even classes to avoid styling rows in other tables */

149 {

150 background-color: var(--theme_bg0);

151 }

152

153 /* Odd and even rows */

154 tr.odd {}

155 tr.even {}

156

157 td, th /* Table cells and table header cells */

158 {

159 vertical-align: top; /* Word */

160 vertical-align: baseline; /* Others */

161 padding-left: 0.5em;

162 padding-right: 0.5em;

163 padding-top: 0.2em;

164 padding-bottom: 0.2em;

165 }

166

167

168 th /* Table header cells */

169 {

170 font-weight: bold;

171 }

172

173 tfoot /* Table footer (what appears here if caption is on top?) */

174 {

175 }

176

177 caption /* This is for a table caption tag, not the p.caption Pandoc uses in a div.figure */

178 {

179 caption-side: top;

180 border: none;

181 font-size: 0.9em;

182 font-style: italic;

183 text-align: center;

184 margin-bottom: 0.3em; /* Good for when on top */

185 padding-bottom: 0.2em;

186 }

187

188

189

190 pre,blockquote{

191 page-break-inside:avoid;

192 }

193

194 blockquote{

195 padding:10px 20px;

196 margin:0 0 1em;

197 font-size: 0.9em;

198 border-left:5px solid var(--theme_fg4);

199 }

200

201 blockquote p:last-child{

202 margin-bottom:0;

203 }

204

205 blockquote:before,

206 blockquote:after {

207 content:"";

208 }

209

210

211 li

212 {

213 margin-top: 0.5em; /* IE: lack of space above a <li> when the item is inside a <p> */

214 }

215

216 :not(blockquote) > p,

217 ol,

218 ul {

219 margin-left: 1em;

220 }

221

222 .categories{

223 display: flex;

224 align-items: baseline;

225 }

226

227 .categories h3{

228 display: inline-block;

229 }

230

231 .categories p {

232 flex: 1;

233 margin: 0.5em;

234 display: flex;

235 flex-direction: row;

236 flex-flow: wrap;

237

238 }

239

240 .categories a{

241 color: var(--theme_orange);

242 background-color: var(--theme_bg1);

243 display: inline-block;

244 padding: 0.2em 0.5em 0.2em 0.5em;

245 border-radius: 5px;

246 min-width: 2em;

247 text-align: center;

248 margin: 0.15em;

249 }

250

251 .bottom {

252 margin-top: auto;

253 }

254

255 .index {

256 padding: 0;

257 }

258

259 .index li {

260 display: flex;

261 }

262

263 .index li div:first-child {

264 flex-shrink: 0;

265 margin-right: 0.5em;

266 }

267

268 .small {

269 display: flex;

270 align-items: center;

271 }

272

273 .small img {

274 width: 20px;

275 height: 20px;

276 margin: 5px;

277 }

278

279 img {

280 width: 10em;

281 height: 10em;

282 margin: 5px;

283 }

284

285 h1 {

286 margin-bottom: 0;

287 color: var(--theme_aqua);

288 }

289

290 h2 {

291 margin-bottom: 0;

292 color: var(--theme_purple);

293 }

294

295 h3 {

296 margin-bottom: 0;

297 color: var(--theme_orange);

298 }

299

300 h4 {

301 margin-bottom: 0;

302 color: var(--theme_yellow);

303 }

304

305 h5 {

306 margin-bottom: 0;

307 color: var(--theme_green);

308 }

309

310 h6 {

311 margin-bottom: 0;

312 color: var(--theme_gray);

313 }