forked from eddiemachado-zz/bones
/
style.css
executable file
·395 lines (313 loc) · 16.9 KB
/
style.css
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
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
/******************************************************************
Bones Master Stylesheet
Designed by Eddie Machado
http://themble.com/bones
eddie@themble.com
Design Copyright 2010. All Rights Reserved.
XHTML/CSS released under a Creative Commons Attribution 2.5 licence.
Special Thanks to:
Paul Irish & the HTML5 Boilerplate
Yoast for some WP functions & optimization ideas
Andrew Rogers for code optimization
David Dellanave for speed & code optimization
and several other developers. :)
I ADVISE AGAINST EDITING THESE FILES. USE THE STYLE.CSS FILE IN THE ROOT.
******************************************************************/
/******************************************************************
RESET STYLES
******************************************************************/
/* general reset */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, footer, header, hgroup,
menu, nav, section, summary, time, mark, audio, video { margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent; }
html { overflow-y: scroll; }
/* html 5 reset */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block; }
/* ul & li resets */
ol, ul { list-style: none; }
/* blockquote reset */
blockquote, q { quotes:none; }
blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; }
/* link style resets */
a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
a:hover, a:active { outline: none; }
/* table resets */
table { border-collapse:collapse; border-spacing:0; }
td, td img { vertical-align: top; }
/* type & header styles */
body { font:13px/1.223 sans-serif; *font-size:small; }
p { hyphenate:auto; hyphenate-before:2; hyphenate-after:3; hyphenate-lines:3; orphans:4; }
select, input, textarea, button { font:99% sans-serif; }
body, select, input, textarea { color: #444; }
small, .small { font-size:0.75em; letter-spacing:.05em; font-style:italic; line-height:1.75em; }
strong, th, .strong { font-weight: bold; }
em, .em { font-style: italic; }
.text-left {text-align: left;}
.text-center {text-align: center;}
.text-right {text-align: right;}
ins, .ins { background-color:#ff9; color:#000; text-decoration:none; }
mark, .mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }
del, .del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; }
sub { vertical-align: sub; font-size: smaller; }
sup { vertical-align: super; font-size: smaller; }
/* code & pre box resets */
pre { padding: 15px; white-space: pre; white-space: pre-wrap; white-space: pre-line; word-wrap: break-word; }
/* form & input resets */
pre, code, kbd, samp { font-family: monospace, sans-serif; margin: 1.5em; }
input, select { vertical-align:middle; }
textarea { overflow: auto; }
.ie6 legend, .ie7 legend { margin-left: -7px; }
input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; }
.ie7 input[type="checkbox"] { vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }
label, input[type=button], input[type=submit], button { cursor: pointer; }
button, input, select, textarea { margin: 0; }
input:valid, textarea:valid { }
input:invalid, textarea:invalid { border-radius: 1px; -moz-box-shadow: 0px 0px 5px red; -webkit-box-shadow: 0px 0px 5px red; box-shadow: 0px 0px 5px red; }
.no-boxshadow input:invalid,
.no-boxshadow textarea:invalid { background-color: #f0dddd; }
button { width: auto; overflow: visible; }
/* text highlight reset */
::-moz-selection{ background: #6fc2f6; color:#fff; text-shadow: none; }
::selection { background:#6fc2f6; color:#fff; text-shadow: none; }
/* image resets */
.ie7 img { -ms-interpolation-mode: bicubic; }
/* hidden elements */
.hidden { display: none; visibility: hidden; }
.visuallyhidden { position: absolute !important; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px); }
/* clearfixes */
.clear:after, .menu:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.clear { display: inline-block; }
* html .clear { height: 1%; }
.clear { display: block; }
/******************************************************************
COMMON & REUSABLE STYLES
******************************************************************/
/* floats */
.left { float: left; }
.right { float: right; }
/* highlighting search term on search page */
mark, .search-term { background: #EBE16F; }
/* alerts & notices */
.help, .info, .error, .success { margin: 10px; padding: 10px; border: 1px solid #cecece; }
.help { border-color: #E0C618; background: #EBE16F; }
.info { border-color: #92cae4; background: #d5edf8; }
.error { border-color: #fbc2c4; background: #fbe3e4; }
.success { border-color: #c6d880; background: #e6efc2; }
/******************************************************************
GENERAL STYLES
******************************************************************/
body { font-size: 14px; line-height: 1.5em; font-family: Georgia, Cambria, "New Century Schoolbook", "Century Schoolbook L", "Times New Roman", serif; background-color: #efefef; }
#container, .wrap {}
/******************************************************************
LINK STYLES
******************************************************************/
a, a:visited { color: #1a90db; text-decoration: underline; }
a:hover { color: #f01d4f; text-decoration: none; }
a:active { color: #71e81c; }
a:link {-webkit-tap-highlight-color: #f01d4f; }
/******************************************************************
H1, H2, H3, H4, H5 STYLES
******************************************************************/
h1 a, .h1 a, h2 a, .h2 a, h3 a, .h3 a, h4 a, .h4 a, h5 a, .h5 a { text-decoration: none; font-weight: 500; }
h1, .h1 { font-size:2.5em; line-height: 1.333em; }
h2, .h2 { font-size: 1.75em; line-height: 1.1em; }
h3, .h3 { font-size: 1.125em; }
h4, .h4 { font-size: 1.1em; font-weight: 700; }
h5, .h5 { font-size: 0.846em; line-height: 2.09em; text-transform: uppercase; letter-spacing: 2px; }
/******************************************************************
HEADER STYLES
******************************************************************/
header[role=banner] {}
#logo { margin: 1.1em 0; }
/******************************************************************
NAVIGATION STYLES
******************************************************************/
.nav { clear: both; margin: 1.1em 0; }
.nav ul { background: #215ea3; }
.nav ul li { list-style-type: none; float: left; }
.nav ul li a { display: block; text-decoration: none; padding: 5px 10px; color: #fff; font-weight: 700; }
.nav ul li:last-child a {}
.nav ul li a:hover { background: #036; color: #fff; }
.nav ul li.current-menu-item a, .nav ul li.current_page_item a {}
.nav ul li ul.sub-menu { position: absolute; left: -9999em; z-index: 9999; background: #215ea3; width: 200px; }
.nav ul li ul li a { width: 180px; }
.nav ul li ul li a:hover { background-color: #036; }
.nav ul li ul li:last-child a {}
.nav ul li:hover ul { left: auto; }
/******************************************************************
POST STYLES
******************************************************************/
#content {}
#main {}
article[id*=post-] { padding: 2.2em 20px; }
/* archive title */
.archive_title { padding: 0 20px; margin: 1.1em 0 0.75em; }
/* post meta information */
.meta { font-size:.75em; letter-spacing:.05em; font-style:italic; line-height:1.75em; color: #999; margin: 0.875em 0; }
.post_content {}
/* typographical styles */
.post_content p { margin:1.5em 0 0; }
.post_content ul, .post_content ol, .post_content table, .post_content dl { margin: 1.5em 0; }
.post_content ul, .post_content ol { list-style-position:outside; line-height:1.5; margin-left: 2.2em; margin-right: 2.2em; }
.post_content li { margin-bottom: 0.75em; }
.post_content ul li { list-style-type: disc; }
.post_content ol li { list-style-type: decimal; }
.post_content blockquote { font-style:italic; line-height:1.6em; margin: 1.5em 2.2em; }
.post_content blockquote:before { font-family:Georgia, serif; content: "“"; font-size:2.75em; text-indent:-.8em; margin-top:.1em; float:left; opacity:.3; }
.post_content dl { margin:1.75em 0 1.75em; }
.post_content dt { font-style:italic; margin-top:1.25em; font-size:1.13em; font-weight:700; border-bottom:1px solid #999; background:#DDD; }
.post_content dd { font-style:italic; font-size:.85em; margin-top:1em; line-height:1.6em; }
.post_content video { margin: 1.5em 0; max-width: 100%; display: block; }
.post_content object { display: block; margin: 1.5em 0; max-width: 100%; }
/* image alignment & styles */
.post_content img { margin: 0 0 1.5em 0; }
.alignleft, img.alignleft { margin-right: 1.5em; display: inline; float: left; }
.alignright, img.alignright { margin-left: 1.5em; display: inline; float: right; }
.aligncenter, img.aligncenter { margin-right: auto; margin-left: auto; display: block; clear: both; }
.alignnone, img.alignnone {} /* i'm unsure of this style */
/* wp caption styles */
.wp-caption { margin-bottom: 1.5em; text-align: center; padding-top: 5px; }
.wp-caption img { border: 0 none; padding: 0; margin: 0; }
.wp-caption p.wp-caption-text { font-size:.8em; font-style:italic; margin:.6em 0 -.2em; }
/* misc styles */
.wp-smiley { margin: 0 !important; max-height: 1em; }
article[id*=post-] footer { clear: both; margin: 1.5em 0 0; padding-bottom: 2.2em; }
/* page navigation */
.page-navigation, .wp-prev-next { margin: 1.1em 0 2.2em; }
.bones_page_navi, .wp-prev-next ul { padding: 0 20px; }
.bones_page_navi li { float: left; margin-left: 10px; } /* regular links */
.bones_page_navi li a { display: block; padding: 3px 6px;text-decoration: none; position: relative; }
.bones_page_navi li a:hover { color: #f01d4f; text-decoration: underline; }
.bones_page_navi li.bpn-current { padding: 3px 6px; position: relative; border-bottom: 2px solid #f01d4f; } /* current page link */
.bones_page_navi li.bpn-current:hover {}
.bones_page_navi li.bpn-prev-link { font-weight: 700; } /* previous link */
.bones_page_navi li.bpn-prev-link a { padding: 0; }
.bones_page_navi li.bpn-prev-link a:hover { background: none; }
.bones_page_navi li.bpn-next-link { font-weight: 700; } /* next page link */
.bones_page_navi li.bpn-next-link a { padding: 0; }
.bones_page_navi li.bpn-next-link a:hover { background: none; }
.bones_page_navi li.bpn-last-page-link {} /* last page link */
.bones_page_navi li.bpn-last-page-link a {}
.bones_page_navi li.bpn-last-page-link a:hover { background: none; }
.bones_page_navi li.bpn-first-page-link {} /* first page link */
.bones_page_navi li.bpn-first-page-link a {}
.bones_page_navi li.bpn-first-page-link a:hover { background: none; }
.wp-prev-next .prev-link { float: left; }
.wp-prev-next .next-link { float: right; }
/******************************************************************
SIDEBAR STYLES
******************************************************************/
#sidebar1 { float: right; }
.widget { margin: 2.2em 0; }
.widget li { line-height: 1.5em; margin-bottom: 0.75em; font-size: 13px; }
.widgettitle { border-bottom: 2px solid #444; margin-bottom: 0.75em; }
/******************************************************************
COMMENT STYLES
******************************************************************/
#comments { margin: 0 20px; } /* h3 comment title */
#comments span {} /* number of comments span */
.comment-nav {}
.comment-nav ul {}
.comment-nav ul li {}
.commentlist { margin: 0 20px; }
.commentlist li { position: relative; margin-bottom: 1.5em; padding: 0.7335em 10px; clear: both; overflow: hidden; }
.commentlist li[class*=depth-] { margin-left: 2.2em; margin-top: 1.1em; border-top: 1px solid #cecece; }
.commentlist li.depth-1 { margin-left: 0; margin-top: 0; }
.commentlist li.depth-2 {}
.commentlist li.depth-3 {}
.commentlist li.depth-4 {}
.commentlist li.depth-5 {}
.commentlist li ul.children li {}
.commentlist li ul.children li.alt {}
.commentlist li ul.children li.byuser {}
.commentlist li ul.children li.comment {}
.commentlist li ul.children li.depth-{id} {}
.commentlist li ul.children li.bypostauthor {}
.commentlist li ul.children li.comment-author-admin {}
.commentlist li ul.children .alt {}
.commentlist li ul.children .odd {}
.commentlist li ul.children .even {}
.commentlist .alt {}
.commentlist .odd {}
.commentlist .even {}
.commentlist .parent {}
.commentlist .comment {}
.commentlist .children {}
.commentlist .pingback {}
.commentlist .bypostauthor {}
.commentlist .comment-author {}
.commentlist .comment-author-admin {}
.commentlist .thread-alt {}
.commentlist .thread-odd {}
.commentlist .thread-even {}
.commentlist .vcard { margin-left: 55px; }
.commentlist .vcard cite.fn { font-weight: 700; font-style: normal; }
.commentlist .vcard time { float: right; }
.commentlist .vcard time a { text-decoration: none; color: #999; }
.commentlist .vcard time a:hover { text-decoration: underline; }
.commentlist .vcard img.photo {}
.commentlist .vcard img.avatar { position: absolute; left: 5px; top: 0.7335em; padding: 2px; border: 1px solid #cecece; background: #fff; }
.commentlist .vcard cite.fn a.url {}
.commentlist .comment-meta {}
.commentlist .comment-meta a {}
.commentlist .commentmetadata {}
.commentlist .commentmetadata a {}
.commentlist li .comment_content { margin-left: 55px; }
.commentlist li .comment_content p { font-size: 1em; line-height: 1.5em; margin: 0.7335em 0 1.5em; }
.commentlist li ul { padding-top: 1.1em; }
.commentlist .comment-reply-link { text-decoration: none; float: right; font-size: 0.846em; line-height: 1.5em; background: #036; padding: 3px 5px; color: #fff; opacity: 0.55; }
.commentlist a.comment-reply-link:hover { opacity: 1; }
/* comment form styles */
#respond { margin: 0 20px; padding-bottom: 2.2em; }
#comment-form-title { margin: 0 0 1.1em; }
#cancel-comment-reply {}
#cancel-comment-reply a {}
#commentform {}
.comments-logged-in-as {}
#comment-form-elements { margin: 0.75em 0; }
#comment-form-elements li { overflow: hidden; margin-bottom: 0.7335em; }
#comment-form-elements label { display: none; }
#comment-form-elements small { display: none; }
#author, #email, #url, #comment { background: #efefef; border: 2px solid #cecece; font-size: 1em; line-height: 1.5em; }
#author:focus, #email:focus, #url:focus, #comment:focus { outline: none; background: #fff; border-color: #036; }
#author, #email, #url { padding: 3px 6px; max-width: 400px; min-width: 250px; }
#allowed_tags { font-size: 0.846em; line-height: 1.5em; margin: 1.5em 10px 0.7335em 0; }
#comment { resize: none; padding: 3px 6px; width: 97.3%; height: 150px; }
/* form validation */
#commentform input:invalid, #commentform textarea:invalid { border-color: red; outline: none; box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none; background-color: #f6e7eb; }
#commentform input:valid {}
/******************************************************************
FOOTER STYLES
******************************************************************/
footer[role=contentinfo] { border-top: 2px solid #cecece; padding: 1.1em 0 3.3em; margin-top: 2.2em; }
.footer-links { float: left; }
/* bottom nav links */
.footer-links ul { clear: both; }
.footer-links ul li { list-style-type: none; float: left; font-size: 0.9em; }
.footer-links ul li a { margin-right: 10px; text-decoration: underline; }
.footer-links ul li:last-child a { margin-right: 0; }
.footer-links ul li a:hover, .nav ul li.current-menu-item a, .nav ul li.current_page_item a {}
.footer-links ul li ul.sub-menu { display: none; } /* you shouldn't have that many links in the footer anyway ;P */
.attribution { float: right; color: #999; font-size: 0.9em; }
/******************************************************************
PRINT STYLES
******************************************************************/
@media print {
* { background: transparent !important; color: #444 !important; text-shadow: none !important; }
a, a:visited { color: #444 !important; text-decoration: underline; }
a:after { content: " (" attr(href) ")"; }
abbr:after { content: " (" attr(title) ")"; }
.ir a:after { content: ""; }
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
thead { display: table-header-group; }
tr, img { page-break-inside: avoid; }
@page { margin: 0.5cm; }
p, h2, h3 { orphans: 3; widows: 3; }
h2, h3{ page-break-after: avoid; }
}