root / htmltest / sites / all / themes / sky / css / html-elements.css @ 6c38d829
1 |
/* html elements */
|
---|---|
2 |
html {
|
3 |
font-size: 100%; |
4 |
word-wrap: break-word; |
5 |
-webkit-text-size-adjust: 100%; |
6 |
line-height: 1.5; |
7 |
height: 100%; |
8 |
overflow-y: scroll; |
9 |
} |
10 |
|
11 |
body {
|
12 |
font-family: "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif; |
13 |
line-height: 1.5; /* Unit-less line-height means line height can scale. */ |
14 |
min-height: 100%; |
15 |
margin: 0; |
16 |
padding: 0; |
17 |
-webkit-font-smoothing: antialiased; |
18 |
font-smoothing: antialiased; |
19 |
text-rendering: optimizeLegibility\9; /* Only IE, can mess with Android */ |
20 |
} |
21 |
|
22 |
/* Sizes match proper font scaling. */
|
23 |
h1, h2, h3, h4, h5, h6 { |
24 |
font-weight: 400; |
25 |
line-height: 1em; |
26 |
padding: 0; |
27 |
margin: 24px 0 12px 0; |
28 |
} |
29 |
|
30 |
h1 { font-size: 2.153em; } /* 28px */ |
31 |
h2 { font-size: 1.692em; } /* 22px */ |
32 |
h3 { font-size: 1.385em; } /* 18px */ |
33 |
h4 { font-size: 1.231em; } /* 16px */ |
34 |
h5 { font-size: 1.077em; } /* 14px */ |
35 |
h6 { font-size: 1em; } |
36 |
|
37 |
img,
|
38 |
a img { |
39 |
border: none; |
40 |
} |
41 |
|
42 |
img {
|
43 |
max-width: 100%; |
44 |
height: auto; |
45 |
} |
46 |
|
47 |
p {
|
48 |
margin: 0 0 1.5em; |
49 |
padding: 0; |
50 |
} |
51 |
|
52 |
em,
|
53 |
dfn {
|
54 |
font-style: italic; |
55 |
} |
56 |
|
57 |
ins {
|
58 |
border-bottom: none; |
59 |
text-decoration: none; |
60 |
} |
61 |
|
62 |
abbr, acronym { |
63 |
border-bottom: 1px dotted; |
64 |
cursor: help; |
65 |
white-space: nowrap; |
66 |
} |
67 |
|
68 |
pre,
|
69 |
code,
|
70 |
tt,
|
71 |
samp,
|
72 |
kbd,
|
73 |
var {
|
74 |
font-size: 0.846em; |
75 |
font-family: Monaco, "DejaVu Sans Mono", monospace, sans-serif; /* Safari hack */ |
76 |
} |
77 |
|
78 |
blockquote,
|
79 |
q {
|
80 |
font-style:italic; |
81 |
quotes:"" ""; |
82 |
} |
83 |
|
84 |
blockquote,
|
85 |
p {
|
86 |
margin: 1.5em 0; |
87 |
} |
88 |
|
89 |
p:first-child, |
90 |
p.first-child { |
91 |
margin-top: 0; |
92 |
} |
93 |
|
94 |
blockquote:before, |
95 |
blockquote:after, |
96 |
q:before, |
97 |
q:after { |
98 |
content:""; |
99 |
} |
100 |
|
101 |
strong,
|
102 |
dfn,
|
103 |
caption,
|
104 |
th {
|
105 |
font-weight: 700; |
106 |
} |
107 |
|
108 |
pre,
|
109 |
div.codeblock { |
110 |
background-color: #f5f5f5; |
111 |
border: solid 1px #ddd; |
112 |
border-bottom-color: #ccc; |
113 |
border-right-color: #ccc; |
114 |
padding: 1em; |
115 |
white-space: pre-wrap; |
116 |
-webkit-border-radius: 4px; |
117 |
-moz-border-radius: 4px; |
118 |
border-radius: 4px; |
119 |
} |
120 |
|
121 |
/* Lists */
|
122 |
ul,
|
123 |
ol {
|
124 |
margin: 0 0 1.5em 1em; |
125 |
padding:0; |
126 |
} |
127 |
|
128 |
.item-list ul, |
129 |
.item-list ol { |
130 |
margin: 0 0 0 1em; |
131 |
padding: 0; |
132 |
} |
133 |
|
134 |
ul ul, |
135 |
ul ol, |
136 |
ol ol, |
137 |
ol ul, |
138 |
.block ul ul, |
139 |
.block ul ol, |
140 |
.block ol ol, |
141 |
.block ol ul, |
142 |
.item-list ul ul, |
143 |
.item-list ul ol, |
144 |
.item-list ol ol, |
145 |
.item-list ol ul { |
146 |
margin-bottom: 0; |
147 |
} |
148 |
|
149 |
ul {
|
150 |
list-style-type: disc; |
151 |
} |
152 |
|
153 |
ul ul ul { |
154 |
list-style-type: square; |
155 |
} |
156 |
|
157 |
ol {
|
158 |
list-style-type: decimal; |
159 |
} |
160 |
|
161 |
ol ol { |
162 |
list-style-type: lower-alpha; |
163 |
} |
164 |
|
165 |
ol ol ol { |
166 |
list-style-type: lower-roman; |
167 |
} |
168 |
|
169 |
ul ul, |
170 |
ul ul ul ul { |
171 |
list-style-type: circle; |
172 |
} |
173 |
|
174 |
dl {
|
175 |
margin: 1em 0; |
176 |
padding: 0; |
177 |
} |
178 |
|
179 |
dt {
|
180 |
font-size: 1.231em; |
181 |
} |
182 |
|
183 |
dd {
|
184 |
margin: 0 0 0.4em 0; |
185 |
padding: 0 0 0 2em; |
186 |
} |
187 |
|
188 |
dd:last-child { |
189 |
border-bottom: 0; |
190 |
} |
191 |
|
192 |
dl dl { |
193 |
margin-left: 1em; |
194 |
} |
195 |
|
196 |
/**
|
197 |
* Flexible Media and Cross browser improvements
|
198 |
* - This can cause issues in table cells where no width is set on the column,
|
199 |
* only in some versions of webkit and IE 7/8.
|
200 |
* - declaring the width attribute on image elements and using max-width causes
|
201 |
* the "dissappering images" bug in IE8.
|
202 |
* - Google maps break also, see below for fixes.
|
203 |
*/
|
204 |
img {
|
205 |
max-width: 100%; |
206 |
height: auto; |
207 |
-ms-interpolation-mode: bicubic; |
208 |
} |
209 |
|
210 |
/* /ht Ethan Marcotte - http://front.ie/l8rJaA */
|
211 |
img,
|
212 |
embed,
|
213 |
object,
|
214 |
video {
|
215 |
max-width: 100%; |
216 |
} |
217 |
|
218 |
/* Disable flexiblity for IE8 and below */
|
219 |
.lt-ie9 img, |
220 |
.lt-ie9 object, |
221 |
.lt-ie9 embed, |
222 |
.lt-ie9 video { |
223 |
max-width: none; |
224 |
} |
225 |
|
226 |
/* Override max-width 100% for map displays and widgets */
|
227 |
#map img, |
228 |
.gmap img, |
229 |
.view-gmap img, |
230 |
.openlayers-map img, |
231 |
#getlocations_map_canvas img, |
232 |
#locationmap_map img, |
233 |
.geofieldMap img, |
234 |
.views_horizontal_slider img, |
235 |
.field-widget-imagefield-crop-widget img { |
236 |
max-width: none !important; |
237 |
} |
238 |
|
239 |
/* Improve IE's resizing of images */
|
240 |
svg:not(:root) { |
241 |
overflow: hidden; |
242 |
} |
243 |
|
244 |
/* Corrects inline-block display not defined in IE6/7/8/9 & FF3 */
|
245 |
audio,
|
246 |
canvas,
|
247 |
video {
|
248 |
display: inline-block; |
249 |
*display: inline; |
250 |
*zoom: 1; |
251 |
} |
252 |
|
253 |
/* Prevents modern browsers from displaying 'audio' without controls */
|
254 |
audio:not([controls]) { |
255 |
display: none; |
256 |
} |