/**
 * Data font stack
 *
 * @group typography
 */
/**
 * Serif font stack
 *
 * @group typography
 */
/**
 * Headline font stack
 *
 * @group typography
 */
/**
 * Sans serif text font stack
 *
 * @group typography
 */
/**
 * Sans serif headline font stack
 *
 * @group typography
 */
/**
 * Default font scale settings
 * See font-scale.html and font-scale.png for visual representations
 *
 * @group typography
 */
/**
 * Grab all levels of a font the font-scale
 *
 * @param {String} $name - Name of the font-scale matrix (eg: headline)
 * @param {Map} $font-scale ($font-scale)
 *
 * @example
 *  font-size: get-scale(header);
 *
 * @requires {variable} $font-scale
 *
 * @return {Map}
 *
 * @group typography
 */
/**
 * Grab info for a particular level of a font-scale
 *
 * @param {String} $name - Name of the font-scale in the matrix (eg: headline)
 * @param {Number} $level - Level in the matrix
 * @param {Map} $font-scale ($font-scale)
 *
 * @example
 *  font-size: get-scale-level(header, 1);
 *
 * @requires {variable} $font-scale
 * @requires {function} get-scale
 *
 * @return {Map}
 *
 * @group typography
 */
/**
 * Get a font-size for a level in the font-scale matrix
 *
 * @param {String} $name - Name of the font-scale in the matrix (eg: headline)
 * @param {Number} $level - Level in the matrix
 * @param {Map} $font-scale - Configuration
 *
 * @example
 *  font-size: get-font-size(header, 3);
 *
 * @requires {variable} $font-scale
 * @requires {function} convert-to-px
 * @requires {function} get-scale-level
 *
 * @return {Number}
 *
 * @group typography
 */
/**
 * Get a line-height for a level in the font-scale matrix
 *
 * @param {String} $name - Name of the font-scale in the matrix (eg: headline)
 * @param {Number} $level - Level in the matrix
 * @param {Map} $font-scale - Configuration
 *
 * @example
 *  font-size: get-line-height(header, 3);
 *
 * @requires {variable} $font-scale
 * @requires {function} convert-to-px
 * @requires {function} get-scale-level
 *
 * @return {Number}
 *
 * @group typography
 */
/**
 * Turn any value into pixels
 *
 * @param {Number} $value
 *
 * @example
 *  font-size: convert-to-px(14); // 14px
 *
 * @return {Number}
 *
 * @group typography
 */
/**
 * Default typography settings, to be included as soon as possible in the HTML
 * 1. Make type rendering look crisper
 * 2. Set relative line spacing to 1.5 (16px * 1.5 = 24px)
 *
 * @param {String} $font-family ($f-serif-text) - Default global font
 *
 * @requires {variable} $f-serif-text
 *
 * @group typography
 */
/**
 * Font-size and line-height shorthand
 *
 * @param {Number} $size
 * @param {Number} $line-height ($size)
 *
 * @example
 *  @include font-size(18, 24);
 *
 * @requires {function} convert-to-px
 *
 * @group typography
 */
/**
 * Font styling shorthand  
 * Note: prefer the usage of the font-scale mixins to stick to the font scale
 *
 * @param {String} $family
 * @param {String} $weight
 * @param {Number} $size
 * @param {Number} $line-height ($size)
 *
 * @example
 *  @include font(arial, bold, 18, 24);
 *
 * @requires {mixin} font-size
 *
 * @group typography
 */
/**
 * Header family and weight properties.
 *
 * @requires {variable} $f-serif-headline
 *
 * @group typography
 */
/**
 * Header typography settings.
 *
 * @param {Number} $level
 * @param {Boolean} $size-only
 *
 * @example
 *  // Output all properties (font-size, line-height, family, weight)
 *  @include fs-header(3);
 *  
 *  // Output font-size and line-height only
 *  @include fs-header(3, $size-only: true);
 *
 * @requires {function} get-font-size
 * @requires {function} get-line-height
 * @requires {mixin} font-size
 * @requires {mixin} f-header
 *
 * @group typography
 */
/**
 * Healdine family and weight properties.
 *
 * @requires {variable} $f-serif-headline
 *
 * @group typography
 */
/**
 * Headline typography settings.
 *
 * @param {Number} $level
 * @param {Boolean} $size-only
 *
 * @example
 *  // Output all properties (font-size, line-height, family, weight)
 *  @include fs-headline(3);
 *  
 *  // Output font-size and line-height only
 *  @include fs-headline(3, $size-only: true);
 *
 * @requires {function} get-font-size
 * @requires {function} get-line-height
 * @requires {mixin} font-size
 * @requires {mixin} f-headline
 *
 * @group typography
 */
/**
 * Body Heading family and weight properties.
 *
 * @requires {variable} $f-serif-text
 *
 * @group typography
 */
/**
 * Body Heading typography settings.
 *
 * @param {Number} $level
 * @param {Boolean} $size-only
 *
 * @example
 *  // Output all properties (font-size, line-height, family, weight)
 *  @include fs-bodyHeading(3);
 *  
 *  // Output font-size and line-height only
 *  @include fs-bodyHeading(3, $size-only: true);
 *
 * @requires {function} get-font-size
 * @requires {function} get-line-height
 * @requires {mixin} font-size
 * @requires {mixin} f-bodyHeading
 *
 * @group typography
 */
/**
 * Body Copy family property.
 *
 * @requires {variable} $f-serif-text
 *
 * @group typography
 */
/**
 * Body Copy typography settings.
 *
 * @param {Number} $level
 * @param {Boolean} $size-only
 *
 * @example
 *  // Output all properties (font-size, line-height, family)
 *  @include fs-bodyCopy(3);
 *  
 *  // Output font-size and line-height only
 *  @include fs-bodyCopy(3, $size-only: true);
 *
 * @requires {function} get-font-size
 * @requires {function} get-line-height
 * @requires {mixin} font-size
 * @requires {mixin} f-bodyCopy
 *
 * @group typography
 */
/**
 * Data family property.
 *
 * @requires {variable} $f-data
 *
 * @group typography
 */
/**
 * Data typography settings.
 *
 * @param {Number} $level
 * @param {Boolean} $size-only
 *
 * @example
 *  // Output all properties (font-size, line-height, family)
 *  @include fs-data(3);
 *  
 *  // Output font-size and line-height only
 *  @include fs-data(3, $size-only: true);
 *
 * @requires {function} get-font-size
 * @requires {function} get-line-height
 * @requires {mixin} font-size
 * @requires {mixin} f-data
 *
 * @group typography
 */
/**
 * Text Sans family property.
 *
 * @requires {variable} $f-sans-serif-text
 *
 * @group typography
 */
/**
 * Text Sans typography settings.
 *
 * @param {Number} $level
 * @param {Boolean} $size-only
 *
 * @example
 *  // Output all properties (font-size, line-height, family)
 *  @include fs-textSans(3);
 *  
 *  // Output font-size and line-height only
 *  @include fs-textSans(3, $size-only: true);
 *
 * @requires {function} get-font-size
 * @requires {function} get-line-height
 * @requires {mixin} font-size
 * @requires {mixin} f-textSans
 *
 * @group typography
 */
/**
 * Headline Sans family property.  
 * Is not currently integrated into our font scale matrix,
 * hence no `fs-` mixin; currently we're just using it as a
 * replacement font in a few places.
 *
 * @requires {variable} $f-sans-serif-headline
 *
 * @group typography
 */
@font-face {
  font-family: "Guardian Agate Sans 1 Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-Regular.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-Regular.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-Regular.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-Regular.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-Regular.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-Regular.svg#GuardianAgateSans1Web-Regular") format("svg");
  font-weight: 400;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Agate Sans 1 Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-RegularItalic.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-RegularItalic.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-RegularItalic.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-RegularItalic.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-RegularItalic.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-RegularItalic.svg#GuardianAgateSans1Web-RegularItalic") format("svg");
  font-weight: 400;
  font-style: italic;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Agate Sans 1 Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-Bold.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-Bold.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-Bold.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-Bold.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-Bold.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-Bold.svg#GuardianAgateSans1Web-Bold") format("svg");
  font-weight: 700;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Agate Sans 1 Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-BoldItalic.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-BoldItalic.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-BoldItalic.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-BoldItalic.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-BoldItalic.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianAgateSans1Web/GuardianAgateSans1Web-BoldItalic.svg#GuardianAgateSans1Web-BoldItalic") format("svg");
  font-weight: 700;
  font-style: italic;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Egyptian Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Light.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Light.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Light.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Light.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Light.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Light.svg#GuardianEgyptianWeb-Light") format("svg");
  font-weight: 200;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Egyptian Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Regular.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Regular.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Regular.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Regular.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Regular.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Regular.svg#GuardianEgyptianWeb-Regular") format("svg");
  font-weight: 400;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Egyptian Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-RegularItalic.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-RegularItalic.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-RegularItalic.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-RegularItalic.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-RegularItalic.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-RegularItalic.svg#GuardianEgyptianWeb-RegularItalic") format("svg");
  font-weight: 400;
  font-style: italic;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Egyptian Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Semibold.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Semibold.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Semibold.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Semibold.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Semibold.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Semibold.svg#GuardianEgyptianWeb-Semibold") format("svg");
  font-weight: 600;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Egyptian Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-SemiboldItalic.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-SemiboldItalic.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-SemiboldItalic.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-SemiboldItalic.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-SemiboldItalic.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-SemiboldItalic.svg#GuardianEgyptianWeb-SemiboldItalic") format("svg");
  font-weight: 600;
  font-style: italic;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Egyptian Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Medium.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Medium.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Medium.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Medium.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Medium.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Medium.svg#GuardianEgyptianWeb-Medium") format("svg");
  font-weight: 500;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Egyptian Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Bold.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Bold.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Bold.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Bold.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Bold.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Bold.svg#GuardianEgyptianWeb-Bold") format("svg");
  font-weight: 700;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Egyptian Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-BoldItalic.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-BoldItalic.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-BoldItalic.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-BoldItalic.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-BoldItalic.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-BoldItalic.svg#GuardianEgyptianWeb-BoldItalic") format("svg");
  font-weight: 700;
  font-style: italic;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Egyptian Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-BoldItalic.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-BoldItalic.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-BoldItalic.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-BoldItalic.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-BoldItalic.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-BoldItalic.svg#GuardianEgyptianWeb-BoldItalic") format("svg");
  font-weight: 900;
  font-style: italic;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Egyptian Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Bold.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Bold.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Bold.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Bold.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Bold.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianEgyptianWeb/GuardianEgyptianWeb-Bold.svg#GuardianEgyptianWeb-Bold") format("svg");
  font-weight: 900;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Sans Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianSansWeb/GuardianSansWeb-Light.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianSansWeb/GuardianSansWeb-Light.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianSansWeb/GuardianSansWeb-Light.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianSansWeb/GuardianSansWeb-Light.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianSansWeb/GuardianSansWeb-Light.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianSansWeb/GuardianSansWeb-Light.svg#GuardianSansWeb-Light") format("svg");
  font-weight: 200;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Sans Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianSansWeb/GuardianSansWeb-Regular.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianSansWeb/GuardianSansWeb-Regular.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianSansWeb/GuardianSansWeb-Regular.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianSansWeb/GuardianSansWeb-Regular.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianSansWeb/GuardianSansWeb-Regular.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianSansWeb/GuardianSansWeb-Regular.svg#GuardianSansWeb-Regular") format("svg");
  font-weight: 400;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Sans Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianSansWeb/GuardianSansWeb-Semibold.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianSansWeb/GuardianSansWeb-Semibold.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianSansWeb/GuardianSansWeb-Semibold.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianSansWeb/GuardianSansWeb-Semibold.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianSansWeb/GuardianSansWeb-Semibold.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianSansWeb/GuardianSansWeb-Semibold.svg#GuardianSansWeb-Semibold") format("svg");
  font-weight: 600;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Text Egyptian Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Regular.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Regular.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Regular.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Regular.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Regular.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Regular.svg#GuardianTextEgyptianWeb-Regular") format("svg");
  font-weight: 400;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Text Egyptian Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-RegularItalic.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-RegularItalic.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-RegularItalic.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-RegularItalic.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-RegularItalic.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-RegularItalic.svg#GuardianTextEgyptianWeb-RegularItalic") format("svg");
  font-weight: 400;
  font-style: italic;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Text Egyptian Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Medium.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Medium.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Medium.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Medium.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Medium.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Medium.svg#GuardianTextEgyptianWeb-Medium") format("svg");
  font-weight: 500;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Text Egyptian Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-MediumItalic.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-MediumItalic.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-MediumItalic.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-MediumItalic.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-MediumItalic.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-MediumItalic.svg#GuardianTextEgyptianWeb-MediumItalic") format("svg");
  font-weight: 500;
  font-style: italic;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Text Egyptian Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Bold.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Bold.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Bold.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Bold.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Bold.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Bold.svg#GuardianTextEgyptianWeb-Bold") format("svg");
  font-weight: 700;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Text Egyptian Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-BoldItalic.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-BoldItalic.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-BoldItalic.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-BoldItalic.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-BoldItalic.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-BoldItalic.svg#GuardianTextEgyptianWeb-BoldItalic") format("svg");
  font-weight: 700;
  font-style: italic;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Text Egyptian Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Black.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Black.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Black.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Black.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Black.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-Black.svg#GuardianTextEgyptianWeb-Black") format("svg");
  font-weight: 800;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Text Egyptian Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-BlackItalic.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-BlackItalic.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-BlackItalic.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-BlackItalic.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-BlackItalic.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextEgyptianWeb/GuardianTextEgyptianWeb-BlackItalic.svg#GuardianTextEgyptianWeb-BlackItalic") format("svg");
  font-weight: 800;
  font-style: italic;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Text Sans Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Regular.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Regular.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Regular.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Regular.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Regular.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Regular.svg#GuardianTextSansWeb-Regular") format("svg");
  font-weight: 400;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Text Sans Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-RegularItalic.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-RegularItalic.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-RegularItalic.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-RegularItalic.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-RegularItalic.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-RegularItalic.svg#GuardianTextSansWeb-RegularItalic") format("svg");
  font-weight: 400;
  font-style: italic;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Text Sans Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Medium.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Medium.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Medium.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Medium.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Medium.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Medium.svg#GuardianTextSansWeb-Medium") format("svg");
  font-weight: 500;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Text Sans Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-MediumItalic.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-MediumItalic.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-MediumItalic.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-MediumItalic.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-MediumItalic.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-MediumItalic.svg#GuardianTextSansWeb-MediumItalic") format("svg");
  font-weight: 500;
  font-style: italic;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Text Sans Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Bold.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Bold.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Bold.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Bold.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Bold.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Bold.svg#GuardianTextSansWeb-Bold") format("svg");
  font-weight: 700;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Text Sans Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-BoldItalic.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-BoldItalic.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-BoldItalic.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-BoldItalic.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-BoldItalic.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-BoldItalic.svg#GuardianTextSansWeb-BoldItalic") format("svg");
  font-weight: 700;
  font-style: italic;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Text Sans Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Black.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Black.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Black.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Black.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Black.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-Black.svg#GuardianTextSansWeb-Black") format("svg");
  font-weight: 800;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Text Sans Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-BlackItalic.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-BlackItalic.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-BlackItalic.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-BlackItalic.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-BlackItalic.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianTextSansWeb/GuardianTextSansWeb-BlackItalic.svg#GuardianTextSansWeb-BlackItalic") format("svg");
  font-weight: 800;
  font-style: italic;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Compact Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianExtrasWeb/GuardianCompactWeb-Black.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianExtrasWeb/GuardianCompactWeb-Black.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianExtrasWeb/GuardianCompactWeb-Black.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianExtrasWeb/GuardianCompactWeb-Black.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianExtrasWeb/GuardianCompactWeb-Black.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianExtrasWeb/GuardianCompactWeb-Black.svg#GuardianCompactWeb-Black") format("svg");
  font-weight: 800;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Titlepiece Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianExtrasWeb/GuardianTitlepieceWeb-Regular.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianExtrasWeb/GuardianTitlepieceWeb-Regular.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianExtrasWeb/GuardianTitlepieceWeb-Regular.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianExtrasWeb/GuardianTitlepieceWeb-Regular.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianExtrasWeb/GuardianTitlepieceWeb-Regular.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianExtrasWeb/GuardianTitlepieceWeb-Regular.svg#GuardianTitlepieceWeb-Regular") format("svg");
  font-weight: 400;
  font-style: normal;
  font-stretch: normal; }

@font-face {
  font-family: "Guardian Weekend Cond Web";
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianExtrasWeb/GuardianWeekendCondWeb-Black.eot");
  src: url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianExtrasWeb/GuardianWeekendCondWeb-Black.eot?#iefix") format("embedded-opentype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianExtrasWeb/GuardianWeekendCondWeb-Black.woff2") format("woff2"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianExtrasWeb/GuardianWeekendCondWeb-Black.woff") format("woff"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianExtrasWeb/GuardianWeekendCondWeb-Black.ttf") format("truetype"), url("https://interactive.guim.co.uk/fonts/guss-webfonts/GuardianExtrasWeb/GuardianWeekendCondWeb-Black.svg#GuardianWeekendCondWeb-Black") format("svg");
  font-weight: 800;
  font-style: normal;
  font-stretch: normal; }

html, body {
  text-rendering: optimizeLegibility;
  -webkit-font-feature-settings: 'kern';
  -moz-font-feature-settings: 'kern';
  font-feature-settings: 'kern';
  -webkit-font-kerning: normal;
  -moz-font-kerning: normal;
  font-kerning: normal;
  -webkit-font-variant-ligatures: common-ligatures;
  -moz-font-variant-ligatures: common-ligatures;
  font-variant-ligatures: common-ligatures; }

html {
  font-family: "Guardian Text Egyptian Web",Georgia,serif;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased; }

html,
body {
  font-size: 12px;
  line-height: 16px;
  font-family: "Guardian Text Sans Web", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-weight: bold;
  color: #121212;
  margin: 0;
  padding: 0;
  min-height: 102px;
  min-width: 100%; }

.interactive-embed {
  overflow: hidden;
  padding: 0;
  margin: 0; }

#slider-heading-before,
#slider-heading-after,
#duo-heading-before,
#duo-heading-after {
  display: none; }

.photo-container {
  position: relative;
  width: 100%;
  margin: 0;
  overflow: hidden; }

.gv-hide {
  display: none !important; }

.interactive-now-and-then-container {
  -webkit-font-smoothing: antialiased;
  position: relative; }
  .interactive-now-and-then-container.fader .image-heading {
    display: none; }
  .interactive-now-and-then-container.fader .noUi-origin.origin-smooth {
    transition: left 0.2s linear; }
  .interactive-now-and-then-container.fader .view-container:nth-of-type(2) .photo-container {
    position: absolute;
    transition: opacity 0.2s; }
  .interactive-now-and-then-container.fader #fade-metadata {
    position: relative;
    padding-bottom: 4px;
    padding-top: 4px;
    border: 1px solid #dcdcdc;
    border-bottom: 0; }
    .interactive-now-and-then-container.fader #fade-metadata:after {
      clear: both;
      display: block;
      content: ''; }
  .interactive-now-and-then-container.duo #second-photo.gv-hide {
    display: block !important; }
  .interactive-now-and-then-container.slider #slider-heading-before,
  .interactive-now-and-then-container.slider #slider-heading-after {
    display: inline-block; }
  .interactive-now-and-then-container.slider #control-slider-container {
    display: none; }
  .interactive-now-and-then-container.slider .image-heading {
    display: block;
    position: absolute;
    transition: opacity .25s ease-in-out;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
    font-size: 13px;
    line-height: 18px;
    font-family: "Guardian Text Sans Web", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
    font-size: 14px;
    font-weight: bold;
    background: #121212;
    color: white;
    display: inline-block;
    float: left;
    padding: 2px 6px;
    margin: 0;
    margin-top: 6px;
    opacity: 0; }
    .interactive-now-and-then-container.slider .image-heading#slider-heading-before {
      left: 0; }
    .interactive-now-and-then-container.slider .image-heading#slider-heading-after {
      right: 0; }
  .interactive-now-and-then-container.slider #second-photo {
    width: 100%; }
    .interactive-now-and-then-container.slider #second-photo.gv-hide {
      display: none; }
  .interactive-now-and-then-container.slider .view-container:nth-of-type(2) .photo-container {
    position: absolute;
    overflow: hidden;
    height: 100%; }
    .interactive-now-and-then-container.slider .view-container:nth-of-type(2) .photo-container.slider-transition {
      transition: width 0.3s; }
    .interactive-now-and-then-container.slider .view-container:nth-of-type(2) .photo-container.slider-transition-initial {
      animation: cd-bounce-in 0.7s; }
    .interactive-now-and-then-container.slider .view-container:nth-of-type(2) .photo-container img {
      width: auto;
      height: 100%; }

@keyframes cd-bounce-in {
  0% {
    width: 0; }
  60% {
    width: 55%; }
  100% {
    width: 50%; } }
  .interactive-now-and-then-container.slider #fade-metadata {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100%;
    padding: 0;
    margin: 0;
    z-index: 500;
    pointer-events: none; }
    .interactive-now-and-then-container.slider #fade-metadata:after {
      display: none; }
  .interactive-now-and-then-container.slider #img-slider-container {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    cursor: -webkit-grab;
    cursor: -moz-grab; }
    .interactive-now-and-then-container.slider #img-slider-container #slider-2 {
      width: 100%;
      height: 100%;
      background: transparent;
      border-radius: 0;
      box-shadow: none;
      display: block;
      border: none; }
      .interactive-now-and-then-container.slider #img-slider-container #slider-2.fade-in .noUi-handle {
        opacity: 1;
        animation: cd-fade-in 0.9s; }
      .interactive-now-and-then-container.slider #img-slider-container #slider-2.no-fade-in .noUi-handle {
        opacity: 1; }
      .interactive-now-and-then-container.slider #img-slider-container #slider-2 .noUi-base {
        overflow: hidden; }
      .interactive-now-and-then-container.slider #img-slider-container #slider-2 .noUi-handle {
        top: 0;
        height: 100%;
        border-radius: 0;
        background: transparent;
        margin-left: -15px;
        opacity: 0;
        top: 0; }
        .interactive-now-and-then-container.slider #img-slider-container #slider-2 .noUi-handle:before {
          position: absolute;
          display: block;
          content: "";
          border-left: 1px solid #fff;
          height: 100%;
          top: 0; }

@keyframes cd-fade-in {
  0% {
    opacity: 0;
    transform: scale(0.1);
    -webkit-transform: scale(0.1); }
  60% {
    opacity: 0;
    transform: scale(0.1);
    -webkit-transform: scale(0.1); }
  100% {
    opacity: 1;
    transform: scale(1);
    -webkit-transform: scale(1); } }
        .interactive-now-and-then-container.slider #img-slider-container #slider-2 .noUi-handle::after {
          content: "";
          display: block;
          width: 44px;
          height: 44px;
          border-radius: 50%;
          border: none;
          box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);
          color: #121212;
          background: #ffe500;
          background-image: url("./assets/imgs/slider-arrows.svg");
          background-repeat: no-repeat;
          background-position: 50% 50%;
          background-size: 28px 12px;
          position: absolute;
          left: -7px;
          top: 0;
          bottom: 0;
          margin: auto;
          cursor: col-resize; }
          .interactive-now-and-then-container.slider #img-slider-container #slider-2 .noUi-handle::after:active {
            cursor: col-resize; }
  .interactive-now-and-then-container.duo #duo-heading-before,
  .interactive-now-and-then-container.duo #duo-heading-after {
    display: block;
    z-index: 999; }
    .interactive-now-and-then-container.duo #duo-heading-before.gv-hide,
    .interactive-now-and-then-container.duo #duo-heading-after.gv-hide {
      display: none; }
  .interactive-now-and-then-container.duo .image-heading {
    display: block;
    position: absolute;
    font-size: 13px;
    line-height: 18px;
    font-family: "Guardian Text Sans Web", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
    font-size: 14px;
    font-weight: bold;
    background: #121212;
    color: white;
    display: inline-block;
    float: left;
    padding: 2px 6px;
    margin: 0;
    margin-top: 6px; }
  .interactive-now-and-then-container.duo .view-container:nth-of-type(1) {
    padding-bottom: 5px;
    border-bottom: 1px solid #dcdcdc;
    margin-bottom: 5px; }
  .interactive-now-and-then-container.duo #control-slider-container {
    display: none; }
  .interactive-now-and-then-container.duo.use-html-imagery .gu-artboard {
    display: none !important; }
    .interactive-now-and-then-container.duo.use-html-imagery .gu-artboard:first-of-type {
      display: block !important; }
  @media (min-width: 575px) {
    .interactive-now-and-then-container.duo .view-container {
      display: inline-block;
      width: calc(50% - 6px);
      margin-right: 5px;
      padding-right: 5px;
      border-right: 1px solid #dcdcdc; }
      .interactive-now-and-then-container.duo .view-container:nth-of-type(1) {
        padding-bottom: 0px;
        border-bottom: none;
        margin-bottom: 0px; }
      .interactive-now-and-then-container.duo .view-container:nth-of-type(2) {
        margin-right: 0;
        padding-right: 0;
        border-right: none; } }
  .interactive-now-and-then-container .photos-wrapper-container {
    position: relative;
    line-height: 0;
    font-size: 0;
    display: block; }
  .interactive-now-and-then-container .photo-container {
    width: 100%;
    top: 0;
    left: 0;
    cursor: pointer; }
    .interactive-now-and-then-container .photo-container img {
      width: 100%;
      height: auto; }
  .interactive-now-and-then-container #control-slider-container {
    display: grid;
    grid-template-columns: 40px auto 40px;
    grid-template-rows: 16px 16px 16px;
    margin-left: 10px;
    margin-right: 10px; }
  .interactive-now-and-then-container #fader-control-1 {
    grid-column: 1 / span 1;
    grid-row: 2; }
  .interactive-now-and-then-container #fader-control-2 {
    grid-column: 3 / span 1;
    grid-row: 2; }
  .interactive-now-and-then-container .slider-state {
    font-size: 14px;
    font-family: "Guardian Text Sans Web", Arial;
    display: block;
    position: relative; }
  .interactive-now-and-then-container #slider-before {
    text-align: left; }
  .interactive-now-and-then-container #slider-after {
    text-align: right; }
  .interactive-now-and-then-container #slider-1 {
    grid-column: 2 / span 1;
    grid-row: 2;
    align-self: center;
    height: 32px;
    background: none;
    border-radius: 1000px;
    box-shadow: none;
    display: inline-block;
    padding-right: 36px;
    border: none; }
    .interactive-now-and-then-container #slider-1::before {
      content: '';
      display: block;
      position: absolute;
      top: 50%;
      height: 2px;
      background: #121212;
      border-radius: 1000px;
      width: 100%; }
    .interactive-now-and-then-container #slider-1 .noUi-origin {
      right: -30px; }
  .interactive-now-and-then-container .noUi-handle {
    height: 36px;
    width: 36px;
    border-radius: 50%;
    top: -2px;
    border: none;
    box-shadow: none;
    background: #ffe500;
    background-image: url("./assets/imgs/slider-arrows.svg");
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: 24px 10px;
    position: absolute;
    margin: auto;
    cursor: -webkit-grab;
    cursor: -moz-grab;
    outline: none !important; }
    .interactive-now-and-then-container .noUi-handle:active {
      cursor: -webkit-grabbing;
      cursor: -moz-grabbing; }
  .interactive-now-and-then-container .noUi-handle:before,
  .interactive-now-and-then-container .noUi-handle:after {
    display: none; }
  .interactive-now-and-then-container p.credit {
    margin: 0; }
    .interactive-now-and-then-container p.credit span {
      display: inline-block;
      margin-top: 6px; }
  @media (min-width: 480px) {
    .interactive-now-and-then-container h1 {
      font-size: 22px;
      padding-right: 124px; }
    .interactive-now-and-then-container #fade-metadata {
      width: 320px; }
    .interactive-now-and-then-container #fader-control {
      margin-right: 10px; } }
  @media (min-width: 780px) {
    .interactive-now-and-then-container #fade-metadata {
      left: 150px; }
    .interactive-now-and-then-container.fader #fade-metadata {
      border-left: 4px solid #121212; } }
  @media (min-width: 860px) {
    .interactive-now-and-then-container #fade-metadata {
      left: 230px; } }
  @media (min-width: 880px) {
    .interactive-now-and-then-container #fade-metadata {
      left: 250px; } }
  @media (min-width: 1140px) {
    .interactive-now-and-then-container #fade-metadata {
      left: 170px; } }
  @media (min-width: 1300px) {
    .interactive-now-and-then-container #fade-metadata {
      left: 250px; } }

/* Functional styling;
 * These styles are required for noUiSlider to function.
 * You don't need to change these rules to apply your design.
 */
.noUi-target,
.noUi-target * {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -ms-touch-action: none;
  touch-action: none;
  -ms-user-select: none;
  -moz-user-select: none;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

.noUi-target {
  position: relative;
  direction: ltr; }

.noUi-base {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 1;
  /* Fix 401 */ }

.noUi-origin {
  position: absolute;
  right: 0;
  top: 0;
  left: 0;
  bottom: 0; }

.noUi-handle {
  position: relative;
  z-index: 1; }

.noUi-stacking .noUi-handle {
  /* This class is applied to the lower origin when
   its values is > 50%. */
  z-index: 10; }

.noUi-state-tap .noUi-origin {
  -webkit-transition: left 0.3s, top 0.3s;
  transition: left 0.3s, top 0.3s; }

.noUi-state-drag * {
  cursor: inherit !important; }

/* Painting and performance;
 * Browsers can paint handles in their own layer.
 */
.noUi-base {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0); }

/* Slider size and handle placement;
 */
.noUi-horizontal {
  height: 18px; }

.noUi-vertical {
  width: 18px; }

.noUi-vertical .noUi-handle {
  width: 28px;
  height: 34px;
  left: -6px;
  top: -17px; }

/* Styling;
 */
.noUi-background {
  background: #FAFAFA;
  box-shadow: inset 0 1px 1px #f0f0f0; }

.noUi-connect {
  background: #3FB8AF;
  box-shadow: inset 0 0 3px rgba(51, 51, 51, 0.45);
  -webkit-transition: background 450ms;
  transition: background 450ms; }

.noUi-origin {
  border-radius: 2px; }

.noUi-target {
  border-radius: 4px;
  border: 1px solid #D3D3D3;
  box-shadow: inset 0 1px 1px #F0F0F0, 0 3px 6px -5px #BBB; }

.noUi-target.noUi-connect {
  box-shadow: inset 0 0 3px rgba(51, 51, 51, 0.45), 0 3px 6px -5px #BBB; }

/* Handles and cursors;
 */
.noUi-draggable {
  cursor: w-resize; }

.noUi-vertical .noUi-draggable {
  cursor: n-resize; }

.noUi-handle {
  border: 1px solid #D9D9D9;
  border-radius: 3px;
  background: #FFF;
  cursor: default;
  box-shadow: inset 0 0 1px #FFF, inset 0 1px 7px #EBEBEB, 0 3px 6px -3px #BBB; }

.noUi-active {
  box-shadow: inset 0 0 1px #FFF, inset 0 1px 7px #DDD, 0 3px 6px -3px #BBB; }

/* Handle stripes;
 */
.noUi-handle:before,
.noUi-handle:after {
  content: "";
  display: block;
  position: absolute;
  height: 14px;
  width: 1px;
  background: #E8E7E6;
  left: 14px;
  top: 6px; }

.noUi-handle:after {
  left: 17px; }

.noUi-vertical .noUi-handle:before,
.noUi-vertical .noUi-handle:after {
  width: 14px;
  height: 1px;
  left: 6px;
  top: 14px; }

.noUi-vertical .noUi-handle:after {
  top: 17px; }

/* Disabled state;
 */
[disabled].noUi-connect,
[disabled] .noUi-connect {
  background: #B8B8B8; }

[disabled].noUi-origin,
[disabled] .noUi-handle {
  cursor: not-allowed; }

/*# sourceMappingURL=embed.css.map */