root / drupal7 / sites / all / themes / adaptivetheme / at_subtheme / css / global.base.css @ 74f6bef0
1 | 85ad3d82 | Assos Assos | /*
|
---|---|---|---|
2 | * @file
|
||
3 | * global.base
|
||
4 | *
|
||
5 | * - normalize with small modifications for Drupal and AT: http://necolas.github.com/normalize.css/
|
||
6 | * - Gutter widths, see $gutter-width in _custom.scss
|
||
7 | * - Default container alignment.
|
||
8 | * - Flexible images and media declarations.
|
||
9 | * - Copies of the SCSS mixins for reference, which includes an improved
|
||
10 | * element-invisible and focusable styles.
|
||
11 | */
|
||
12 | /* =============================================================================
|
||
13 | HTML5 display definitions
|
||
14 | ========================================================================== */
|
||
15 | /*
|
||
16 | * Corrects block display not defined in IE6/7/8/9 & FF3
|
||
17 | */
|
||
18 | article,
|
||
19 | aside,
|
||
20 | details,
|
||
21 | figcaption,
|
||
22 | figure,
|
||
23 | footer,
|
||
24 | header,
|
||
25 | hgroup,
|
||
26 | 74f6bef0 | Assos Assos | main,
|
27 | 85ad3d82 | Assos Assos | nav,
|
28 | section,
|
||
29 | summary {
|
||
30 | display: block; |
||
31 | } |
||
32 | |||
33 | /*
|
||
34 | * Corrects inline-block display not defined in IE6/7/8/9 & FF3
|
||
35 | */
|
||
36 | audio,
|
||
37 | canvas,
|
||
38 | video {
|
||
39 | display: inline-block; |
||
40 | *display: inline; |
||
41 | *zoom: 1; |
||
42 | } |
||
43 | |||
44 | /*
|
||
45 | * Prevents modern browsers from displaying 'audio' without controls
|
||
46 | * Remove excess height in iOS5 devices
|
||
47 | */
|
||
48 | audio:not([controls]) { |
||
49 | display: none; |
||
50 | height: 0; |
||
51 | } |
||
52 | |||
53 | /*
|
||
54 | * Addresses styling for 'hidden' attribute not present in IE7/8/9, FF3, S4
|
||
55 | * Known issue: no IE6 support
|
||
56 | */
|
||
57 | [hidden] {
|
||
58 | display: none; |
||
59 | } |
||
60 | |||
61 | /* =============================================================================
|
||
62 | Base
|
||
63 | ========================================================================== */
|
||
64 | /*
|
||
65 | * If you are using the themes Responsive JS feature (media_queries.js) do not
|
||
66 | * set a font-family on the html element, use body.
|
||
67 | *
|
||
68 | * 1. Corrects text resizing oddly in IE6/7 when body font-size is set using em units
|
||
69 | * http://clagnut.com/blog/348/#c790
|
||
70 | * 2. Prevents iOS text size adjust after orientation change, without disabling user zoom
|
||
71 | * www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/
|
||
72 | */
|
||
73 | html {
|
||
74 | font-size: 100%; |
||
75 | -webkit-text-size-adjust: 100%; |
||
76 | line-height: 1.5; |
||
77 | height: 100%; |
||
78 | overflow-y: scroll; |
||
79 | } |
||
80 | |||
81 | /*
|
||
82 | * 1 . Addresses margins handled incorrectly in IE6/7
|
||
83 | */
|
||
84 | body {
|
||
85 | min-height: 100%; |
||
86 | margin: 0; |
||
87 | padding: 0; |
||
88 | -webkit-font-smoothing: antialiased; |
||
89 | font-smoothing: antialiased; |
||
90 | text-rendering: optimizeLegibility\9; |
||
91 | /* Only IE, can mess with Android */
|
||
92 | } |
||
93 | |||
94 | /*
|
||
95 | * Addresses font-family inconsistency between 'textarea' and other form elements.
|
||
96 | */
|
||
97 | button,
|
||
98 | input,
|
||
99 | select,
|
||
100 | textarea {
|
||
101 | font-family: sans-serif; |
||
102 | } |
||
103 | |||
104 | /* =============================================================================
|
||
105 | Links
|
||
106 | ========================================================================== */
|
||
107 | /*
|
||
108 | * Addresses outline displayed oddly in Chrome
|
||
109 | */
|
||
110 | a:focus { |
||
111 | outline: thin dotted; |
||
112 | } |
||
113 | |||
114 | /*
|
||
115 | * Improves readability when focused and also mouse hovered in all browsers
|
||
116 | * people.opera.com/patrickl/experiments/keyboard/test
|
||
117 | */
|
||
118 | a:hover, |
||
119 | a:active { |
||
120 | outline: 0; |
||
121 | } |
||
122 | |||
123 | /* =============================================================================
|
||
124 | Typography
|
||
125 | ========================================================================== */
|
||
126 | /*
|
||
127 | * Headings
|
||
128 | *
|
||
129 | * Addresses font sizes and margins set differently in IE6/7
|
||
130 | * Addresses font sizes within 'section' and 'article' in FF4+, Chrome, S5
|
||
131 | */
|
||
132 | h1 {
|
||
133 | font-size: 2em; |
||
134 | margin: 0.67em 0; |
||
135 | } |
||
136 | |||
137 | h2 {
|
||
138 | font-size: 1.5em; |
||
139 | margin: 0.83em 0; |
||
140 | } |
||
141 | |||
142 | h3 {
|
||
143 | font-size: 1.17em; |
||
144 | margin: 1em 0; |
||
145 | } |
||
146 | |||
147 | h4 {
|
||
148 | font-size: 1em; |
||
149 | margin: 1.33em 0; |
||
150 | } |
||
151 | |||
152 | h5 {
|
||
153 | font-size: 0.83em; |
||
154 | margin: 1.67em 0; |
||
155 | } |
||
156 | |||
157 | h6 {
|
||
158 | font-size: 0.75em; |
||
159 | margin: 2.33em 0; |
||
160 | } |
||
161 | |||
162 | /*
|
||
163 | * Addresses styling not present in IE7/8/9, S5, Chrome
|
||
164 | */
|
||
165 | abbr[title] { |
||
166 | border-bottom: 1px dotted; |
||
167 | } |
||
168 | |||
169 | /*
|
||
170 | * Addresses style set to 'bolder' in FF3+, S4/5, Chrome
|
||
171 | */
|
||
172 | b,
|
||
173 | strong {
|
||
174 | font-weight: 700; |
||
175 | } |
||
176 | |||
177 | blockquote {
|
||
178 | margin: 1em 40px; |
||
179 | } |
||
180 | |||
181 | /*
|
||
182 | * Addresses styling not present in S5, Chrome
|
||
183 | */
|
||
184 | dfn {
|
||
185 | font-style: italic; |
||
186 | } |
||
187 | |||
188 | /*
|
||
189 | * Addresses styling not present in IE6/7/8/9
|
||
190 | */
|
||
191 | mark {
|
||
192 | background: #ff0; |
||
193 | color: #000; |
||
194 | } |
||
195 | |||
196 | /*
|
||
197 | * Addresses margins set differently in IE6/7
|
||
198 | */
|
||
199 | p,
|
||
200 | pre {
|
||
201 | margin: 0 0 1.5em; |
||
202 | } |
||
203 | |||
204 | /*
|
||
205 | * Corrects font family set oddly in IE6, S4/5, Chrome
|
||
206 | * en.wikipedia.org/wiki/User:Davidgothberg/Test59
|
||
207 | */
|
||
208 | pre,
|
||
209 | code,
|
||
210 | kbd,
|
||
211 | samp {
|
||
212 | font-family: monospace, serif; |
||
213 | _font-family: 'courier new', monospace; |
||
214 | font-size: 1em; |
||
215 | } |
||
216 | |||
217 | /*
|
||
218 | * Improves readability of pre-formatted text in all browsers
|
||
219 | */
|
||
220 | pre {
|
||
221 | white-space: pre; |
||
222 | white-space: pre-wrap; |
||
223 | word-wrap: break-word; |
||
224 | } |
||
225 | |||
226 | /*
|
||
227 | * 1. Addresses CSS quotes not supported in IE6/7
|
||
228 | * 2. Addresses quote property not supported in S4
|
||
229 | */
|
||
230 | q {
|
||
231 | quotes: none; |
||
232 | } |
||
233 | |||
234 | q:before, |
||
235 | q:after { |
||
236 | content: ''; |
||
237 | content: none; |
||
238 | } |
||
239 | |||
240 | small {
|
||
241 | font-size: 75%; |
||
242 | } |
||
243 | |||
244 | /*
|
||
245 | * Prevents sub and sup affecting line-height in all browsers
|
||
246 | * gist.github.com/413930
|
||
247 | */
|
||
248 | sub,
|
||
249 | sup {
|
||
250 | font-size: 75%; |
||
251 | line-height: 0; |
||
252 | position: relative; |
||
253 | vertical-align: baseline; |
||
254 | } |
||
255 | |||
256 | sup {
|
||
257 | top: -0.5em; |
||
258 | } |
||
259 | |||
260 | sub {
|
||
261 | bottom: -0.25em; |
||
262 | } |
||
263 | |||
264 | /* =============================================================================
|
||
265 | Lists
|
||
266 | ========================================================================== */
|
||
267 | /*
|
||
268 | * Addresses margins set differently in IE6/7
|
||
269 | */
|
||
270 | dl,
|
||
271 | menu,
|
||
272 | ol,
|
||
273 | ul {
|
||
274 | margin: 1em 0; |
||
275 | } |
||
276 | |||
277 | dd {
|
||
278 | margin: 0 0 0 40px; |
||
279 | } |
||
280 | |||
281 | /*
|
||
282 | * Addresses paddings set differently in IE6/7
|
||
283 | */
|
||
284 | menu,
|
||
285 | ol,
|
||
286 | ul {
|
||
287 | padding: 0 0 0 40px; |
||
288 | } |
||
289 | |||
290 | /*
|
||
291 | * Corrects list images handled incorrectly in IE7
|
||
292 | */
|
||
293 | nav ul, |
||
294 | nav ol { |
||
295 | list-style: none; |
||
296 | list-style-image: none; |
||
297 | } |
||
298 | |||
299 | /* =============================================================================
|
||
300 | Embedded content
|
||
301 | ========================================================================== */
|
||
302 | /*
|
||
303 | * 1. Remove border when inside 'a' element in IE6/7/8/9, FF3
|
||
304 | * 2. Improves image quality when scaled in IE7
|
||
305 | * code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/
|
||
306 | */
|
||
307 | img {
|
||
308 | /* border: 0; */
|
||
309 | /* Drupal core already does this, uncomment if you need it */
|
||
310 | -ms-interpolation-mode: bicubic; |
||
311 | } |
||
312 | |||
313 | /*
|
||
314 | * Corrects overflow displayed oddly in IE9
|
||
315 | */
|
||
316 | svg:not(:root) { |
||
317 | overflow: hidden; |
||
318 | } |
||
319 | |||
320 | /* =============================================================================
|
||
321 | Figures
|
||
322 | ========================================================================== */
|
||
323 | /*
|
||
324 | * Addresses margin not present in IE6/7/8/9, S5, O11
|
||
325 | */
|
||
326 | figure {
|
||
327 | margin: 0; |
||
328 | } |
||
329 | |||
330 | /* =============================================================================
|
||
331 | Forms
|
||
332 | ========================================================================== */
|
||
333 | /*
|
||
334 | * Corrects margin displayed oddly in IE6/7
|
||
335 | */
|
||
336 | form {
|
||
337 | margin: 0; |
||
338 | } |
||
339 | |||
340 | /*
|
||
341 | * Define consistent border, margin, and padding
|
||
342 | */
|
||
343 | fieldset {
|
||
344 | margin: 0 2px; |
||
345 | padding: 0.35em 0.625em 0.75em; |
||
346 | } |
||
347 | |||
348 | /*
|
||
349 | * 1. Corrects color not being inherited in IE6/7/8/9
|
||
350 | * 2. Corrects text not wrapping in FF3
|
||
351 | * 3. Corrects alignment displayed oddly in IE6/7
|
||
352 | */
|
||
353 | legend {
|
||
354 | border: 0; |
||
355 | padding: 0; |
||
356 | white-space: normal; |
||
357 | *margin-left: -7px; |
||
358 | } |
||
359 | |||
360 | /*
|
||
361 | * 1. Corrects font size not being inherited in all browsers
|
||
362 | * 2. Addresses margins set differently in IE6/7, FF3+, S5, Chrome
|
||
363 | * 3. Improves appearance and consistency in all browsers
|
||
364 | */
|
||
365 | button,
|
||
366 | input,
|
||
367 | select,
|
||
368 | textarea {
|
||
369 | font-size: 100%; |
||
370 | margin: 0; |
||
371 | vertical-align: baseline; |
||
372 | *vertical-align: middle; |
||
373 | } |
||
374 | |||
375 | /*
|
||
376 | * Addresses FF3/4 setting line-height on 'input' using !important in the UA stylesheet
|
||
377 | */
|
||
378 | button,
|
||
379 | input {
|
||
380 | line-height: normal; |
||
381 | } |
||
382 | |||
383 | /*
|
||
384 | * 1. Improves usability and consistency of cursor style between image-type 'input' and others
|
||
385 | * 2. Corrects inability to style clickable 'input' types in iOS
|
||
386 | * 3. Removes inner spacing in IE7 without affecting normal text inputs
|
||
387 | * Known issue: inner spacing remains in IE6
|
||
388 | */
|
||
389 | button,
|
||
390 | input[type="button"], |
||
391 | input[type="reset"], |
||
392 | input[type="submit"] { |
||
393 | cursor: pointer; |
||
394 | -webkit-appearance: button; |
||
395 | *overflow: visible; |
||
396 | } |
||
397 | |||
398 | /*
|
||
399 | * Re-set default cursor for disabled elements
|
||
400 | */
|
||
401 | button[disabled], |
||
402 | input[disabled] { |
||
403 | cursor: default; |
||
404 | } |
||
405 | |||
406 | /*
|
||
407 | * 1. Addresses box sizing set to content-box in IE8/9
|
||
408 | * 2. Removes excess padding in IE8/9
|
||
409 | * 3. Removes excess padding in IE7
|
||
410 | * Known issue: excess padding remains in IE6
|
||
411 | */
|
||
412 | input[type="checkbox"], |
||
413 | input[type="radio"] { |
||
414 | box-sizing: border-box; |
||
415 | padding: 0; |
||
416 | *height: 13px; |
||
417 | *width: 13px; |
||
418 | } |
||
419 | |||
420 | /*
|
||
421 | * 1. Addresses appearance set to searchfield in S5, Chrome
|
||
422 | * 2. Addresses box-sizing set to border-box in S5, Chrome (include -moz to future-proof)
|
||
423 | */
|
||
424 | input[type="search"] { |
||
425 | -webkit-appearance: textfield; |
||
426 | -moz-box-sizing: content-box; |
||
427 | -webkit-box-sizing: content-box; |
||
428 | box-sizing: content-box; |
||
429 | } |
||
430 | |||
431 | /*
|
||
432 | * Removes inner padding and search cancel button in S5, Chrome on OS X
|
||
433 | */
|
||
434 | input[type="search"]::-webkit-search-decoration, |
||
435 | input[type="search"]::-webkit-search-cancel-button { |
||
436 | -webkit-appearance: none; |
||
437 | } |
||
438 | |||
439 | /*
|
||
440 | * Removes inner padding and border in FF3+
|
||
441 | * www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/
|
||
442 | */
|
||
443 | button::-moz-focus-inner, |
||
444 | input::-moz-focus-inner { |
||
445 | border: 0; |
||
446 | padding: 0; |
||
447 | } |
||
448 | |||
449 | /*
|
||
450 | * 1. Removes default vertical scrollbar in IE6/7/8/9
|
||
451 | * 2. Improves readability and alignment in all browsers
|
||
452 | */
|
||
453 | textarea {
|
||
454 | overflow: auto; |
||
455 | vertical-align: top; |
||
456 | } |
||
457 | |||
458 | /* =============================================================================
|
||
459 | Tables
|
||
460 | ========================================================================== */
|
||
461 | /*
|
||
462 | * 1. Remove most spacing between table cells
|
||
463 | */
|
||
464 | table {
|
||
465 | border: 1px solid; |
||
466 | border-spacing: 0; |
||
467 | border-collapse: collapse; |
||
468 | font-size: inherit; |
||
469 | font: 100%; |
||
470 | } |
||
471 | |||
472 | /* =============================================================================
|
||
473 | Gutters
|
||
474 | ========================================================================== */
|
||
475 | /*
|
||
476 | * If gutters are set in theme settings they will override these values,
|
||
477 | * see Extensions > Modify Output > Design
|
||
478 | * $gutter-width is set in _base.scss
|
||
479 | */
|
||
480 | #main-content,
|
||
481 | .block-inner,
|
||
482 | .pane-inner,
|
||
483 | .menu-wrapper,
|
||
484 | .branding-elements,
|
||
485 | .breadcrumb-wrapper,
|
||
486 | .attribution,
|
||
487 | .at-panel .rounded-corner, |
||
488 | .block-panels-mini > .block-title, |
||
489 | 74f6bef0 | Assos Assos | .rendered-by-ds .panel-display .region-inner, |
490 | 85ad3d82 | Assos Assos | div.messages { |
491 | margin-left: 10px; |
||
492 | margin-right: 10px; |
||
493 | } |
||
494 | |||
495 | /*
|
||
496 | * Panel pages need negative margin equal to the gutter width applied to #content,
|
||
497 | * this is taken care of in theme settings as per above for normal gutters
|
||
498 | */
|
||
499 | #content .panel-display, |
||
500 | #content .panel-flexible { |
||
501 | margin-left: -10px; |
||
502 | margin-right: -10px; |
||
503 | } |
||
504 | |||
505 | /* =============================================================================
|
||
506 | Flexible Media and Cross browser improvements
|
||
507 | ========================================================================== */
|
||
508 | /*
|
||
509 | * - This can cause issues in table cells where no width is set on the column,
|
||
510 | * only in some versions of webkit and IE 7/8.
|
||
511 | * - declaring the width attribute on image elements and using max-width causes
|
||
512 | * the "dissappering images" bug in IE8.
|
||
513 | * - Mapping services such as Google Maps may break also, see below for fixes.
|
||
514 | */
|
||
515 | img {
|
||
516 | height: auto; |
||
517 | -ms-interpolation-mode: bicubic; |
||
518 | } |
||
519 | |||
520 | /* Ethan Marcotte - http://front.ie/l8rJaA */
|
||
521 | img,
|
||
522 | embed,
|
||
523 | object,
|
||
524 | video {
|
||
525 | max-width: 100%; |
||
526 | } |
||
527 | |||
528 | /* Disable flexiblity for IE8 and below */
|
||
529 | .lt-ie9 img, |
||
530 | .lt-ie9 object, |
||
531 | .lt-ie9 embed, |
||
532 | .lt-ie9 video { |
||
533 | max-width: none; |
||
534 | } |
||
535 | |||
536 | /* Override max-width 100% for map displays */
|
||
537 | #map img, |
||
538 | .gmap img, |
||
539 | .view-gmap img, |
||
540 | .openlayers-map img, |
||
541 | #getlocations_map_canvas img, |
||
542 | #locationmap_map img, |
||
543 | .geofieldMap img, |
||
544 | 74f6bef0 | Assos Assos | .views_horizontal_slider img, |
545 | .geolocation-map img, |
||
546 | .geolocation-views-map img { |
||
547 | 85ad3d82 | Assos Assos | max-width: none !important; |
548 | } |
||
549 | |||
550 | /* =============================================================================
|
||
551 | Misc helpers, Accessibility classes etc
|
||
552 | ========================================================================== */
|
||
553 | /* Prevent overflowing content */
|
||
554 | header[role=banner], |
||
555 | .content-inner,
|
||
556 | .nav,
|
||
557 | .region-sidebar-first,
|
||
558 | .region-sidebar-second,
|
||
559 | .region-secondary-content,
|
||
560 | .region-tertiary-content,
|
||
561 | .region-footer {
|
||
562 | overflow: visible; |
||
563 | word-wrap: break-word; |
||
564 | } |
||
565 | |||
566 | /**
|
||
567 | * General classes for hiding content. These are all included as SASS mixins.
|
||
568 | * @SEE: sass/_custom.scss
|
||
569 | */
|
||
570 | /**
|
||
571 | * Image replacement
|
||
572 | * Kellum Method: http://www.zeldman.com/2012/03/01/replacing-the-9999px-hack-new-image-replacement
|
||
573 | * Additional helpers from http://html5boilerplate.com/docs/css/
|
||
574 | */
|
||
575 | .ir {
|
||
576 | /* Kellum Method */
|
||
577 | display: block !important; |
||
578 | text-indent: 100%; |
||
579 | white-space: nowrap; |
||
580 | overflow: hidden; |
||
581 | /* Remove the default border from elements like button */
|
||
582 | border: 0; |
||
583 | /* Crush the text down to take up no space */
|
||
584 | font: 0/0 a; |
||
585 | /* Remove any text shadows */
|
||
586 | text-shadow: none; |
||
587 | /* Hide any residual text in Safari 4 and any mobile devices that may need it */
|
||
588 | color: transparent; |
||
589 | /* Hide the default background color on elements like button */
|
||
590 | background-color: transparent; |
||
591 | } |
||
592 | |||
593 | /* More robust element-invisible and element-focuable classes */
|
||
594 | .element-invisible {
|
||
595 | border: 0; |
||
596 | clip: rect(1px 1px 1px 1px); |
||
597 | /* IE6, IE7 */
|
||
598 | clip: rect(1px, 1px, 1px, 1px); |
||
599 | height: 1px; |
||
600 | overflow: hidden; |
||
601 | padding: 0; |
||
602 | position: absolute; |
||
603 | width: 1px; |
||
604 | } |
||
605 | |||
606 | .element-invisible.element-focusable:active, |
||
607 | .element-invisible.element-focusable:focus { |
||
608 | clip: auto; |
||
609 | height: auto; |
||
610 | overflow: visible; |
||
611 | position: static; |
||
612 | width: auto; |
||
613 | } |
||
614 | |||
615 | /* Shift content offscreen, can be usefull when you reall need to do this */
|
||
616 | .offscreen {
|
||
617 | position: absolute; |
||
618 | top: -99999em; |
||
619 | width: 1px; |
||
620 | height: 1px; |
||
621 | overflow: hidden; |
||
622 | outline: 0; |
||
623 | } |
||
624 | |||
625 | /* Hide content from all users */
|
||
626 | .element-hidden {
|
||
627 | display: none; |
||
628 | } |