moj_template 0.15.0 → 0.16.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (14) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/stylesheets/govuk-template-ie6.css.erb +102 -106
  3. data/app/assets/stylesheets/govuk-template-ie7.css.erb +101 -103
  4. data/app/assets/stylesheets/govuk-template-ie8.css.erb +96 -97
  5. data/app/assets/stylesheets/govuk-template.css.erb +120 -141
  6. data/app/assets/stylesheets/moj-template-ie6.css.erb +1 -48
  7. data/app/assets/stylesheets/moj-template-ie7.css.erb +1 -48
  8. data/app/assets/stylesheets/moj-template-ie8.css.erb +1 -48
  9. data/app/assets/stylesheets/moj-template.css.erb +1 -48
  10. data/app/views/layouts/moj_template.html.erb +24 -29
  11. data/lib/moj_template/version.rb +1 -1
  12. metadata +4 -6
  13. data/app/assets/stylesheets/images/separator-2x.png +0 -0
  14. data/app/assets/stylesheets/images/separator.png +0 -0
data/app/assets/stylesheets/govuk-template-ie8.css.erb CHANGED
@@ -6,10 +6,6 @@
6
6
  @-o-viewport {
7
7
  width: device-width; }
8
8
 
9
- /* CSS 3 Mixins
10
-
11
- Add them as you need them. This should let us manage vendor prefixes in one place.
12
- */
13
9
  @font-face {
14
10
  font-family: GDS-Logo;
15
11
  src: local("HelveticaNeue"), local("Helvetica Neue"), local("Arial"), local("Helvetica"); }
@@ -20,66 +16,40 @@
20
16
  @-o-viewport {
21
17
  width: device-width; }
22
18
 
23
- /* Cross-browser shims
24
-
25
- Ways of normalising properties across browsers.
26
- */
27
19
  @-ms-viewport {
28
20
  width: device-width; }
29
21
 
30
22
  @-o-viewport {
31
23
  width: device-width; }
32
24
 
33
- /* Usage:
34
- @include inline-block
35
-
36
- or
37
-
38
- @include inline-block("250px")
39
-
40
- which gives a min-height to the inline-block elements.
41
- */
42
- /* Contain floats usage:
25
+ @-ms-viewport {
26
+ width: device-width; }
43
27
 
44
- .this-has-floated-children {
45
- @extend %contain-floats;
46
- }
28
+ @-o-viewport {
29
+ width: device-width; }
47
30
 
48
- */
49
- #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after {
31
+ #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
50
32
  content: "";
51
33
  display: block;
52
34
  clear: both; }
53
35
 
54
- /* CSS 3 Mixins
55
-
56
- Add them as you need them. This should let us manage vendor prefixes in one place.
57
- */
58
36
  @-ms-viewport {
59
37
  width: device-width; }
60
38
 
61
39
  @-o-viewport {
62
40
  width: device-width; }
63
41
 
64
- /*
65
-
66
- Mixin and defaults for making buttons on GOV.UK services.
67
-
68
- For guidance, see: https://www.gov.uk/service-manual/design-and-content/resources/buttons.html
42
+ #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
43
+ content: "";
44
+ display: block;
45
+ clear: both; }
69
46
 
70
- Example usage:
47
+ @-ms-viewport {
48
+ width: device-width; }
71
49
 
72
- .button{
73
- @include button;
74
- }
75
- .button-secondary{
76
- @include button($grey-3);
77
- }
78
- .button-warning{
79
- @include button($red);
80
- }
50
+ @-o-viewport {
51
+ width: device-width; }
81
52
 
82
- */
83
53
  /* local styleguide includes */
84
54
  /* Old depricated greys, new things should use the toolkit greys */
85
55
  html, body, button, input, table, td, th {
@@ -311,46 +281,36 @@ button:focus,
311
281
  #global-header a:focus {
312
282
  color: #0b0c0c; }
313
283
 
314
- /* Cross-browser shims
315
-
316
- Ways of normalising properties across browsers.
317
- */
318
284
  @-ms-viewport {
319
285
  width: device-width; }
320
286
 
321
287
  @-o-viewport {
322
288
  width: device-width; }
323
289
 
324
- /* Usage:
325
- @include inline-block
326
-
327
- or
328
-
329
- @include inline-block("250px")
330
-
331
- which gives a min-height to the inline-block elements.
332
- */
333
- /* Contain floats usage:
334
-
335
- .this-has-floated-children {
336
- @extend %contain-floats;
337
- }
338
-
339
- */
340
- #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after {
290
+ #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
341
291
  content: "";
342
292
  display: block;
343
293
  clear: both; }
344
294
 
295
+ @-ms-viewport {
296
+ width: device-width; }
297
+
298
+ @-o-viewport {
299
+ width: device-width; }
300
+
345
301
  #global-header {
346
302
  background-color: #0b0c0c;
347
303
  width: 100%; }
348
304
  #global-header .header-wrapper {
305
+ background-color: #0b0c0c;
349
306
  max-width: 990px;
350
307
  margin: 0 auto;
351
- padding: 0.5em 15px; }
308
+ padding-top: 8px;
309
+ padding-bottom: 8px;
310
+ padding-left: 15px;
311
+ padding-right: 15px;
312
+ width: 990px; }
352
313
  #global-header .header-wrapper .header-global .header-logo {
353
- width: 49%;
354
314
  float: left;
355
315
  width: 33.33%; }
356
316
  @media screen and (max-width: 379px) {
@@ -448,6 +408,8 @@ button:focus,
448
408
  content: " \25B2"; }
449
409
  #global-header .header-proposition #proposition-menu {
450
410
  margin-top: 5px; }
411
+ #global-header .header-proposition #proposition-menu.no-proposition-name {
412
+ margin-top: 37px; }
451
413
  #global-header .header-proposition #proposition-links {
452
414
  clear: both;
453
415
  margin: 2px 0 0 0;
@@ -495,7 +457,25 @@ button:focus,
495
457
  #global-header .header-proposition #proposition-links li a:hover {
496
458
  text-decoration: underline; }
497
459
  #global-header .header-proposition #proposition-links li a.active {
498
- color: #28a197; }
460
+ color: #1d8feb; }
461
+ #global-header .header-proposition #proposition-links li a:focus {
462
+ color: #0b0c0c; }
463
+
464
+ /* Global header bar */
465
+ #global-header-bar {
466
+ margin: 0 auto;
467
+ width: auto;
468
+ max-width: 1020px;
469
+ width: 1020px; }
470
+ #global-header-bar .inner-block {
471
+ padding-left: 15px;
472
+ padding-right: 15px;
473
+ padding-left: 30px;
474
+ padding-right: 30px; }
475
+ #global-header-bar .header-bar {
476
+ height: 10px;
477
+ background-color: #005ea5;
478
+ font-size: 0; }
499
479
 
500
480
  /* Global cookie message */
501
481
  .js-enabled #global-cookie-message {
@@ -503,29 +483,44 @@ button:focus,
503
483
  /* shown with JS, always on for non-JS */ }
504
484
 
505
485
  #global-cookie-message {
506
- padding: 0.5em 2em;
507
- background-color: #d5e8f3; }
486
+ background-color: #d5e8f3;
487
+ padding-top: 10px;
488
+ padding-bottom: 10px; }
489
+ #global-cookie-message .outer-block {
490
+ margin: 0 auto;
491
+ width: auto;
492
+ max-width: 1020px;
493
+ width: 1020px; }
494
+ #global-cookie-message .inner-block {
495
+ padding-left: 15px;
496
+ padding-right: 15px;
497
+ padding-left: 30px;
498
+ padding-right: 30px; }
508
499
  #global-cookie-message p {
509
500
  font-family: "nta", Arial, sans-serif;
510
- font-size: 19px;
511
- line-height: 1.31579;
512
- font-weight: 400;
501
+ font-size: 16px;
502
+ line-height: 1.25;
503
+ font-weight: 300;
513
504
  text-transform: none;
514
- margin: 0 auto;
515
- max-width: 960px; }
505
+ margin: 0; }
516
506
  @media (max-width: 640px) {
517
507
  #global-cookie-message p {
518
- font-size: 16px;
519
- line-height: 1.25; } }
508
+ font-size: 14px;
509
+ line-height: 1.14286; } }
520
510
 
521
511
  /* Global footer */
522
512
  #footer {
523
513
  background-color: #dee0e2;
524
514
  border-top: 1px solid #a1acb2; }
525
515
  #footer .footer-wrapper {
526
- max-width: 60em;
527
516
  margin: 0 auto;
528
- padding: 60px 1em 0 1em; }
517
+ width: auto;
518
+ max-width: 1020px;
519
+ width: 1020px;
520
+ padding-top: 20px;
521
+ padding-top: 60px;
522
+ background-color: #dee0e2;
523
+ margin: 0 auto; }
529
524
  #footer a {
530
525
  color: #454a4c; }
531
526
  #footer a:hover {
@@ -546,13 +541,18 @@ button:focus,
546
541
  #footer h2 a {
547
542
  color: inherit; }
548
543
  #footer .footer-meta {
544
+ padding-left: 15px;
545
+ padding-right: 15px;
546
+ padding-left: 30px;
547
+ padding-right: 30px;
548
+ padding-bottom: 60px;
549
549
  clear: both;
550
550
  font-size: 0;
551
- color: #454a4c;
552
- padding-bottom: 60px; }
551
+ color: #454a4c; }
553
552
  #footer .footer-meta .footer-meta-inner {
554
553
  display: inline-block;
555
554
  vertical-align: bottom;
555
+ width: 100%;
556
556
  width: 75%; }
557
557
  #footer .footer-meta .footer-meta-inner ul {
558
558
  font-family: "nta", Arial, sans-serif;
@@ -562,8 +562,9 @@ button:focus,
562
562
  text-transform: none;
563
563
  display: inline-block;
564
564
  list-style: none;
565
- margin: 0 0 1em;
566
- padding: 0; }
565
+ margin: 0 0 1.5em 0;
566
+ padding: 0;
567
+ margin: 0 0 1em 0; }
567
568
  @media (max-width: 640px) {
568
569
  #footer .footer-meta .footer-meta-inner ul {
569
570
  font-size: 14px;
@@ -576,6 +577,7 @@ button:focus,
576
577
  position: relative;
577
578
  padding-left: 53px; }
578
579
  #footer .footer-meta .footer-meta-inner .open-government-licence h2 {
580
+ margin-bottom: 1em;
579
581
  position: absolute;
580
582
  left: 0;
581
583
  top: 0;
@@ -604,37 +606,34 @@ button:focus,
604
606
  #footer .footer-meta .footer-meta-inner .open-government-licence p {
605
607
  font-size: 14px;
606
608
  line-height: 1.14286; } }
607
- #footer .footer-meta .footer-meta-inner .open-government-licence p a {
608
- font-family: "nta", Arial, sans-serif;
609
- font-size: 14px;
610
- line-height: 1.42857;
611
- font-weight: 400;
612
- text-transform: none; }
613
- @media (max-width: 640px) {
614
- #footer .footer-meta .footer-meta-inner .open-government-licence p a {
615
- font-size: 12px;
616
- line-height: 1.25; } }
617
609
  #footer .footer-meta .copyright {
618
610
  font-family: "nta", Arial, sans-serif;
619
611
  font-size: 16px;
620
612
  line-height: 1.25;
621
613
  font-weight: 300;
622
614
  text-transform: none;
615
+ margin: 30px 0 0 0;
616
+ width: 100%;
617
+ display: block;
623
618
  display: inline-block;
624
- float: none;
625
619
  text-align: inherit;
626
620
  width: 25%;
627
- padding-top: 15px; }
621
+ padding-top: 15px;
622
+ margin-top: 0; }
628
623
  @media (max-width: 640px) {
629
624
  #footer .footer-meta .copyright {
630
625
  font-size: 14px;
631
626
  line-height: 1.14286; } }
632
627
  #footer .footer-meta .copyright a {
633
628
  display: block;
634
- padding: 115px 0 0 0;
635
- background: transparent url(<%= asset_path 'images/govuk-crest.png' %>) no-repeat 100% 0;
629
+ background-image: url(<%= asset_path 'images/govuk-crest.png' %>);
630
+ background-repeat: no-repeat;
631
+ background-position: 50% 0%;
632
+ background-position: 100% 0%;
633
+ text-align: center;
634
+ text-decoration: none;
636
635
  text-align: right;
637
- text-decoration: none; }
636
+ padding: 115px 0 0 0; }
638
637
  @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 20 / 10), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
639
638
  #footer .footer-meta .copyright a {
640
639
  background-image: url(<%= asset_path 'images/govuk-crest-2x.png' %>);
data/app/assets/stylesheets/govuk-template.css.erb CHANGED
@@ -6,10 +6,6 @@
6
6
  @-o-viewport {
7
7
  width: device-width; }
8
8
 
9
- /* CSS 3 Mixins
10
-
11
- Add them as you need them. This should let us manage vendor prefixes in one place.
12
- */
13
9
  @font-face {
14
10
  font-family: GDS-Logo;
15
11
  src: local("HelveticaNeue"), local("Helvetica Neue"), local("Arial"), local("Helvetica"); }
@@ -20,66 +16,40 @@
20
16
  @-o-viewport {
21
17
  width: device-width; }
22
18
 
23
- /* Cross-browser shims
24
-
25
- Ways of normalising properties across browsers.
26
- */
27
19
  @-ms-viewport {
28
20
  width: device-width; }
29
21
 
30
22
  @-o-viewport {
31
23
  width: device-width; }
32
24
 
33
- /* Usage:
34
- @include inline-block
35
-
36
- or
37
-
38
- @include inline-block("250px")
39
-
40
- which gives a min-height to the inline-block elements.
41
- */
42
- /* Contain floats usage:
25
+ @-ms-viewport {
26
+ width: device-width; }
43
27
 
44
- .this-has-floated-children {
45
- @extend %contain-floats;
46
- }
28
+ @-o-viewport {
29
+ width: device-width; }
47
30
 
48
- */
49
- #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after {
31
+ #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
50
32
  content: "";
51
33
  display: block;
52
34
  clear: both; }
53
35
 
54
- /* CSS 3 Mixins
55
-
56
- Add them as you need them. This should let us manage vendor prefixes in one place.
57
- */
58
36
  @-ms-viewport {
59
37
  width: device-width; }
60
38
 
61
39
  @-o-viewport {
62
40
  width: device-width; }
63
41
 
64
- /*
65
-
66
- Mixin and defaults for making buttons on GOV.UK services.
67
-
68
- For guidance, see: https://www.gov.uk/service-manual/design-and-content/resources/buttons.html
42
+ #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
43
+ content: "";
44
+ display: block;
45
+ clear: both; }
69
46
 
70
- Example usage:
47
+ @-ms-viewport {
48
+ width: device-width; }
71
49
 
72
- .button{
73
- @include button;
74
- }
75
- .button-secondary{
76
- @include button($grey-3);
77
- }
78
- .button-warning{
79
- @include button($red);
80
- }
50
+ @-o-viewport {
51
+ width: device-width; }
81
52
 
82
- */
83
53
  /* local styleguide includes */
84
54
  /* Old depricated greys, new things should use the toolkit greys */
85
55
  html, body, button, input, table, td, th {
@@ -317,49 +287,37 @@ button:focus,
317
287
  #global-header a:focus {
318
288
  color: #0b0c0c; }
319
289
 
320
- /* Cross-browser shims
321
-
322
- Ways of normalising properties across browsers.
323
- */
324
290
  @-ms-viewport {
325
291
  width: device-width; }
326
292
 
327
293
  @-o-viewport {
328
294
  width: device-width; }
329
295
 
330
- /* Usage:
331
- @include inline-block
332
-
333
- or
334
-
335
- @include inline-block("250px")
336
-
337
- which gives a min-height to the inline-block elements.
338
- */
339
- /* Contain floats usage:
340
-
341
- .this-has-floated-children {
342
- @extend %contain-floats;
343
- }
344
-
345
- */
346
- #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after {
296
+ #global-header .header-wrapper:after, #global-header .header-wrapper .header-global:after, #global-header .header-wrapper .header-global .header-logo:after, #global-header .header-proposition #proposition-links:after, #global-header-bar:after, #global-cookie-message .outer-block:after, #footer .footer-wrapper:after, #footer .footer-meta:after {
347
297
  content: "";
348
298
  display: block;
349
299
  clear: both; }
350
300
 
301
+ @-ms-viewport {
302
+ width: device-width; }
303
+
304
+ @-o-viewport {
305
+ width: device-width; }
306
+
351
307
  #global-header {
352
308
  background-color: #0b0c0c;
353
309
  width: 100%; }
354
310
  #global-header .header-wrapper {
311
+ background-color: #0b0c0c;
355
312
  max-width: 990px;
356
313
  margin: 0 auto;
357
- padding: 0.5em 15px; }
358
- @media (max-width: 640px) {
314
+ padding-top: 8px;
315
+ padding-bottom: 8px; }
316
+ @media (min-width: 641px) {
359
317
  #global-header .header-wrapper {
360
- padding: 0.5em 0; } }
318
+ padding-left: 15px;
319
+ padding-right: 15px; } }
361
320
  #global-header .header-wrapper .header-global .header-logo {
362
- width: 49%;
363
321
  float: left; }
364
322
  @media (min-width: 769px) {
365
323
  #global-header .header-wrapper .header-global .header-logo {
@@ -465,6 +423,9 @@ button:focus,
465
423
  content: " \25B2"; }
466
424
  #global-header .header-proposition #proposition-menu {
467
425
  margin-top: 5px; }
426
+ @media (min-width: 769px) {
427
+ #global-header .header-proposition #proposition-menu.no-proposition-name {
428
+ margin-top: 37px; } }
468
429
  #global-header .header-proposition #proposition-links {
469
430
  clear: both;
470
431
  margin: 2px 0 0 0;
@@ -518,7 +479,25 @@ button:focus,
518
479
  #global-header .header-proposition #proposition-links li a:hover {
519
480
  text-decoration: underline; }
520
481
  #global-header .header-proposition #proposition-links li a.active {
521
- color: #28a197; }
482
+ color: #1d8feb; }
483
+ #global-header .header-proposition #proposition-links li a:focus {
484
+ color: #0b0c0c; }
485
+
486
+ /* Global header bar */
487
+ #global-header-bar {
488
+ margin: 0 auto;
489
+ width: auto;
490
+ max-width: 1020px; }
491
+ #global-header-bar .inner-block {
492
+ padding-left: 15px;
493
+ padding-right: 15px; }
494
+ @media (min-width: 641px) {
495
+ #global-header-bar .inner-block {
496
+ padding-left: 30px;
497
+ padding-right: 30px; } }
498
+ #global-header-bar .header-bar {
499
+ height: 10px;
500
+ background-color: #005ea5; }
522
501
 
523
502
  /* Global cookie message */
524
503
  .js-enabled #global-cookie-message {
@@ -526,35 +505,46 @@ button:focus,
526
505
  /* shown with JS, always on for non-JS */ }
527
506
 
528
507
  #global-cookie-message {
529
- padding: 0.5em 2em;
530
- background-color: #d5e8f3; }
508
+ background-color: #d5e8f3;
509
+ padding-top: 10px;
510
+ padding-bottom: 10px; }
511
+ #global-cookie-message .outer-block {
512
+ margin: 0 auto;
513
+ width: auto;
514
+ max-width: 1020px; }
515
+ #global-cookie-message .inner-block {
516
+ padding-left: 15px;
517
+ padding-right: 15px; }
518
+ @media (min-width: 641px) {
519
+ #global-cookie-message .inner-block {
520
+ padding-left: 30px;
521
+ padding-right: 30px; } }
531
522
  #global-cookie-message p {
532
523
  font-family: "nta", Arial, sans-serif;
533
- font-size: 19px;
534
- line-height: 1.31579;
535
- font-weight: 400;
524
+ font-size: 16px;
525
+ line-height: 1.25;
526
+ font-weight: 300;
536
527
  text-transform: none;
537
- margin: 0 auto;
538
- max-width: 960px; }
528
+ margin: 0; }
539
529
  @media (max-width: 640px) {
540
530
  #global-cookie-message p {
541
- font-size: 16px;
542
- line-height: 1.25; } }
543
- @media (max-width: 640px) {
544
- #global-cookie-message {
545
- padding: 0.5em 1em; } }
531
+ font-size: 14px;
532
+ line-height: 1.14286; } }
546
533
 
547
534
  /* Global footer */
548
535
  #footer {
549
536
  background-color: #dee0e2;
550
537
  border-top: 1px solid #a1acb2; }
551
538
  #footer .footer-wrapper {
552
- max-width: 60em;
553
539
  margin: 0 auto;
554
- padding: 60px 1em 0 1em; }
555
- @media (max-width: 640px) {
540
+ width: auto;
541
+ max-width: 1020px;
542
+ padding-top: 20px;
543
+ background-color: #dee0e2;
544
+ margin: 0 auto; }
545
+ @media (min-width: 641px) {
556
546
  #footer .footer-wrapper {
557
- padding-top: 20px; } }
547
+ padding-top: 60px; } }
558
548
  #footer a {
559
549
  color: #454a4c; }
560
550
  #footer a:hover {
@@ -575,21 +565,23 @@ button:focus,
575
565
  #footer h2 a {
576
566
  color: inherit; }
577
567
  #footer .footer-meta {
568
+ padding-left: 15px;
569
+ padding-right: 15px;
570
+ padding-bottom: 60px;
578
571
  clear: both;
579
572
  font-size: 0;
580
- color: #454a4c;
581
- padding-bottom: 60px; }
582
- @media (max-width: 640px) {
573
+ color: #454a4c; }
574
+ @media (min-width: 641px) {
583
575
  #footer .footer-meta {
584
- margin: 0; } }
576
+ padding-left: 30px;
577
+ padding-right: 30px; } }
585
578
  #footer .footer-meta .footer-meta-inner {
586
579
  display: inline-block;
587
580
  vertical-align: bottom;
588
- width: 75%; }
589
- @media (max-width: 640px) {
581
+ width: 100%; }
582
+ @media (min-width: 641px) {
590
583
  #footer .footer-meta .footer-meta-inner {
591
- display: block;
592
- width: 100%; } }
584
+ width: 75%; } }
593
585
  #footer .footer-meta .footer-meta-inner ul {
594
586
  font-family: "nta", Arial, sans-serif;
595
587
  font-size: 16px;
@@ -598,37 +590,33 @@ button:focus,
598
590
  text-transform: none;
599
591
  display: inline-block;
600
592
  list-style: none;
601
- margin: 0 0 1em;
593
+ margin: 0 0 1.5em 0;
602
594
  padding: 0; }
603
595
  @media (max-width: 640px) {
604
596
  #footer .footer-meta .footer-meta-inner ul {
605
597
  font-size: 14px;
606
598
  line-height: 1.5; } }
599
+ @media (min-width: 641px) {
600
+ #footer .footer-meta .footer-meta-inner ul {
601
+ margin: 0 0 1em 0; } }
607
602
  #footer .footer-meta .footer-meta-inner ul li {
608
603
  display: inline-block;
609
604
  margin: 0 15px 0 0; }
610
- @media (max-width: 640px) {
611
- #footer .footer-meta .footer-meta-inner ul {
612
- width: auto;
613
- margin: 0 0 1.5em 0; } }
614
605
  #footer .footer-meta .footer-meta-inner .open-government-licence {
615
606
  clear: left;
616
- position: relative;
617
- padding-left: 53px; }
618
- @media (max-width: 640px) {
607
+ position: relative; }
608
+ @media (min-width: 641px) {
619
609
  #footer .footer-meta .footer-meta-inner .open-government-licence {
620
- padding-left: 0; } }
610
+ padding-left: 53px; } }
621
611
  #footer .footer-meta .footer-meta-inner .open-government-licence h2 {
622
- position: absolute;
623
- left: 0;
624
- top: 0;
625
- width: 41px;
626
- height: 100%; }
627
- @media (max-width: 640px) {
612
+ margin-bottom: 1em; }
613
+ @media (min-width: 641px) {
628
614
  #footer .footer-meta .footer-meta-inner .open-government-licence h2 {
629
- position: static;
630
- width: auto;
631
- margin-bottom: 1em; } }
615
+ position: absolute;
616
+ left: 0;
617
+ top: 0;
618
+ width: 41px;
619
+ height: 100%; } }
632
620
  #footer .footer-meta .footer-meta-inner .open-government-licence h2 a {
633
621
  display: block;
634
622
  width: 41px;
@@ -652,50 +640,41 @@ button:focus,
652
640
  #footer .footer-meta .footer-meta-inner .open-government-licence p {
653
641
  font-size: 14px;
654
642
  line-height: 1.14286; } }
655
- #footer .footer-meta .footer-meta-inner .open-government-licence p a {
656
- font-family: "nta", Arial, sans-serif;
657
- font-size: 14px;
658
- line-height: 1.42857;
659
- font-weight: 400;
660
- text-transform: none; }
661
- @media (max-width: 640px) {
662
- #footer .footer-meta .footer-meta-inner .open-government-licence p a {
663
- font-size: 12px;
664
- line-height: 1.25; } }
665
- @media (max-width: 640px) {
666
- #footer .footer-meta .footer-meta-inner .open-government-licence p a {
667
- font-size: 1em; } }
668
643
  #footer .footer-meta .copyright {
669
644
  font-family: "nta", Arial, sans-serif;
670
645
  font-size: 16px;
671
646
  line-height: 1.25;
672
647
  font-weight: 300;
673
648
  text-transform: none;
674
- display: inline-block;
675
- float: none;
676
- text-align: inherit;
677
- width: 25%;
678
- padding-top: 15px; }
649
+ margin: 30px 0 0 0;
650
+ width: 100%;
651
+ display: block; }
679
652
  @media (max-width: 640px) {
680
653
  #footer .footer-meta .copyright {
681
654
  font-size: 14px;
682
655
  line-height: 1.14286; } }
656
+ @media (min-width: 641px) {
657
+ #footer .footer-meta .copyright {
658
+ display: inline-block;
659
+ text-align: inherit;
660
+ width: 25%;
661
+ padding-top: 15px;
662
+ margin-top: 0; } }
683
663
  #footer .footer-meta .copyright a {
684
664
  display: block;
685
- padding: 115px 0 0 0;
686
- background: transparent url(<%= asset_path 'images/govuk-crest.png' %>) no-repeat 100% 0;
687
- text-align: right;
688
- text-decoration: none; }
665
+ background-image: url(<%= asset_path 'images/govuk-crest.png' %>);
666
+ background-repeat: no-repeat;
667
+ background-position: 50% 0%;
668
+ text-align: center;
669
+ text-decoration: none;
670
+ padding: 115px 0 0 0; }
671
+ @media (min-width: 641px) {
672
+ #footer .footer-meta .copyright a {
673
+ background-position: 100% 0%; } }
689
674
  @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 20 / 10), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
690
675
  #footer .footer-meta .copyright a {
691
676
  background-image: url(<%= asset_path 'images/govuk-crest-2x.png' %>);
692
677
  background-size: 125px 102px; } }
693
- @media (max-width: 640px) {
694
- #footer .footer-meta .copyright {
695
- width: 100%;
696
- display: block;
697
- padding: 0;
698
- margin: 30px 0 0 0; }
678
+ @media (min-width: 641px) {
699
679
  #footer .footer-meta .copyright a {
700
- text-align: center;
701
- background-position: 50% 0%; } }
680
+ text-align: right; } }