moj_template 0.15.0 → 0.16.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
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; } }