1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
|
@import _reset.sass
@import _mixins.sass
// grid = 988 with 9 cols at 92px plus 20px gutters (via http://gridulator.com/)
// font-sizes:
// base: 16px = 1em
// 10px = .625em
// 12px = .75em
// 14px = .875em
// 16px = 1em
// 17px = 1.0625em (body text in articles)
// 18px = 1.125em
// 24px = 1.5em
// 30px = 1.875em
// 32px = 2em
html
height: 100%
body
font: normal 100% unquote("Hoefler Text"), Georgia, unquote("Times New Roman"), Times, serif
color: $brown
margin: 0 1.125em
min-height: 100%
position: relative
padding: 0
//max-width: 61.75em /* 988px / 16px = 61.75em */
max-width = 20.9375em /* 3 cols @ 92px + 20px gutter -- 335px / 16px = */
background: white /* url('../img/988px-9col-92w-20gut.png') 217px 0 repeat-y */
/* ###################Typography############# */
p
font-size: 1.0625em /* 17px / 16px */
line-height: 1.5em /* 24px / 16px */
footer p
font-size: .625em
text-align: center
a
text-decoration: none
color: $brown
&:hover
color: $orange
ul li
display: inline
margin: 0 .125em
.dateline, nav li, .breadcrumbs li, .meta p
text-transform: uppercase
font-size: .75em
letter-spacing: .0625em
.meta p
text-align: center
img
border: 10px $brown solid
#featured-image img
width = 95% /* 315 / 520 */
h1
font: normal 1.875em Helvetica, Verdana, sans-serif
letter-spacing: 0.5px
text-align: center
#archive article h1
font: normal 1.5em Helvetica, Verdana, sans-serif
letter-spacing: 0.5px
text-align: center
text-transform: none
margin: 1.875em 0 .875em 0
#archive h1
font-weight: 700
font-size: .75em
text-transform: uppercase
text-align: left
.footnote
font-size: .875em
#post-metadata
margin-top: 0
border-top: 1px $brown dotted
p
font-size: .875em
text-align: left
/* ######### layout small ################*/
header
margin: 0 auto 1em auto
text-align: center
#logo h1
background: url('../img/tree.png') 0 0 no-repeat
text-indent: -9999px
width: 151px
height: 84px
margin: 0 auto
#logo h2
background: url('../img/text.png') 0 0 no-repeat
text-indent: -9999px
width: 184px
height: 54px
margin: 0 auto
nav
margin: 1em auto 2em auto
text-align: center
border-top: 1px $brown dotted
border-bottom: 1px $brown dotted
width: 100%
padding: .25em 0
nav:after, footer:before
content: "."
display: block
height: 0
clear: both
visibility: hidden
footer
margin-top: 2em
.dateline
text-align: center
time
display: block
.postpic, .post-image
float: left
margin: 0 .625em .625em 0
.postpic, .postpicright
width: auto
article img
width: 95%
article object, article embed
width: 100%
/* misc classes */
.hide
display: none
//.formatted
// column-count: 3
// column-gap: 1.125em
// -moz-column-count: 3
// -moz-column-gap: 18px
// -webkit-column-count: 3
// -webkit-column-gap: 1.125em
|