February 21, 2021 at 6:51:55 PM UTC
VERIFY
Websites
Runtime: 4.3s
On February 21, 2021 at 6:51:55 PM UTC, http://www.u4.no/ was accessible when tested on AS14813 in Barbados.
Failures
HTTP Experiment
null
DNS Experiment
null
Control
null
DNS Queries
Resolver:
108.162.213.64
Query:
IN A www.u4.no
Engine:
system
Name
Class
TTL
Type
DATA
Answer IP Info
@
IN
A
3.248.160.195
AS16509 (Amazon.com, Inc.)
@
IN
A
34.240.46.18
AS16509 (Amazon.com, Inc.)
@
IN
A
34.240.162.206
AS16509 (Amazon.com, Inc.)
@
IN
A
52.17.74.215
AS16509 (Amazon.com, Inc.)
@
IN
A
52.208.185.150
AS16509 (Amazon.com, Inc.)
@
IN
A
52.208.242.79
AS16509 (Amazon.com, Inc.)
@
IN
A
52.214.32.247
AS16509 (Amazon.com, Inc.)
@
IN
A
46.137.146.55
AS16509 (Amazon.com, Inc.)
TCP Connections
34.240.46.18:80: succeeded
3.248.160.195:80: succeeded
34.240.162.206:80: succeeded
52.208.185.150:80: succeeded
46.137.146.55:80: succeeded
52.17.74.215:80: succeeded
52.208.242.79:80: succeeded
52.214.32.247:80: succeeded
HTTP Requests
URL
GET https://www.u4.no/
Response Headers
Connection:keep-aliveContent-Length:715422Content-Type:text/htmlDate:Sun, 21 Feb 2021 18:51:51 GMTEtag:"aea9e-Vt5qDInDNRSjwflBwmUlLNJOeXs"Server:CowboyVia:1.1 vegurX-Powered-By:Next.js 4.2.3
Response Body
<!DOCTYPE html><html><head><meta charSet="utf-8" class="next-head"/><meta http-equiv="x-ua-compatible" content="ie=edge" class="next-head"/><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" class="next-head"/><title class="next-head">U4 Anti-Corruption Resource Centre</title><meta name="description" content="U4 translates anti-corruption research into practical advice for international development actors. We offer publications, training, workshops, helpdesk, and policy advice to government agencies and the global anti-corruption community." class="next-head"/><meta property="og:url" content="https://www.u4.no" class="next-head"/><meta property="og:type" content="article" class="next-head"/><meta property="og:title" content="U4 Anti-Corruption Resource Centre" class="next-head"/><meta property="og:image" content="https://cdn.sanity.io/images/1f1lcoov/production/3e59eddc41cd02132774902dd229b24e55dbfcb5-1000x207.png" class="next-head"/><meta property="og:description" content="U4 translates anti-corruption research into practical advice for international development actors. We offer publications, training, workshops, helpdesk, and policy advice to government agencies and the global anti-corruption community." class="next-head"/><meta property="og:site_name" content="U4 Anti-Corruption Resource Centre" class="next-head"/><meta property="og:locale" content="en_US" class="next-head"/><meta name="google-site-verification" content="IuEUdfNVUT1nJ-DJUcrg99bbRIha348aLY0tC4tOIk0" class="next-head"/><meta name="twitter:card" content="summary" class="next-head"/><meta name="twitter:site" content="@U4_ACRC" class="next-head"/><link rel="icon" type="image/png" href="/static/favicon.png" class="next-head"/><style class="next-head"> @import url("https://fonts.googleapis.com/css?family=Lato:300,300i,400,400i,700,700i,900"); @charset "UTF-8"; /* ========================================================================== INUITCSS ========================================================================== */ /** * inuitcss, by @csswizardry * * github.com/inuitcss | inuitcss.com */ /** * This is an example inuitcss manifest file. DO NOT MODIFY THIS FILE DIRECTLY. * Instead, copy and paste it into your own CSS directory and make additions, * extensions, and modifications there. */ /** * CONTENTS * * SETTINGS * Config...............Project-level configuration and feature switches. * Core.................inuitcss’ core and setup settings. * Global...............Project-wide variables and settings. * * TOOLS * Font-size............A mixin which guarantees baseline-friendly line-heights. * Clearfix.............Micro clearfix mixin. * Hidden...............Mixin for hiding elements. * Sass MQ..............inuitcss’ default media query manager. * * GENERIC * Box-sizing...........Better default `box-sizing`. * Normalize.css........A level playing field using @necolas’ Normalize.css. * Reset................A tiny reset to complement Normalize.css. * Shared...............Sensibly and tersely share some global commonalities * (particularly useful when managing vertical rhythm). * * ELEMENTS * Page.................Set up our document’s default `font-size` and * `line-height`. * Headings.............Very minimal (i.e. only font-size information) for * headings 1 through 6. * Images...............Base image styles. * Tables...............Simple table styles. * * OBJECTS * Wrapper..............Page constraint object. * Layout...............Generic layout module. * Media................Image- and text-like content side by side. The * poster-child of OOCSS. * Flag.................Table-layout-based advancement on the Media object. * List-bare............Lists with no bullets or indents. * List-inline..........A list whose items all site in a line. * Box..................Simple boxing abstraction. * Block................Image-on-top-of-text object. * Ratio................A container for maintaining aspect ratio of content. * Crop.................Provide a cropping context for media (images, etc.). * Table................Classes for manipulating `table`s. * Pack.................Pack items into available horizontal space. * * COMPONENTS * Buttons..............An example button component, and how it fits into the * inuitcss framework. * * UTILITIES * Clearfix.............Bind our clearfix onto a utility class. * Widths...............Simple width helper classes. * Headings.............Reassigning our heading styles to helper classes. * Spacings.............Nudge bits of the DOM around with these spacing * classes. * Responsive-Spacings..Enhances the function of normal spacings for * responsive usage. * Print................Reset-like styles taken from the HTML5 Boilerplate. * Hide.................Helper classes to hide content */ /** * This is a configuration file that inuitcss uses to handle the state, * location, or environment of your project. This handles very high-level settings * that don’t necessarily affect the CSS itself, but can be used to manipulate things * depending on where you are running things (e.g. turning a debugging mode on, * or telling your CI sever that you’re compiling for production). */ /* ========================================================================== #BOX-SIZING ========================================================================== */ /** * More sensible default box-sizing: * css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice */ html { -webkit-box-sizing: border-box; box-sizing: border-box; } *, *:before, *:after { -webkit-box-sizing: inherit; box-sizing: inherit; } /*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */ /* Document ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in * IE on Windows Phone and in iOS. */ html { line-height: 1.15; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ } /* Sections ========================================================================== */ /** * Remove the margin in all browsers (opinionated). */ body { margin: 0; } /** * Add the correct display in IE 9-. */ article, aside, footer, header, nav, section { display: block; } /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Firefox, and Safari. */ h1 { font-size: 2em; margin: 0.67em 0; } /* Grouping content ========================================================================== */ /** * Add the correct display in IE 9-. * 1. Add the correct display in IE. */ figcaption, figure, main { /* 1 */ display: block; } /** * Add the correct margin in IE 8. */ figure { margin: 1em 40px; } /** * 1. Add the correct box sizing in Firefox. * 2. Show the overflow in Edge and IE. */ hr { -webkit-box-sizing: content-box; box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ pre { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /* Text-level semantics ========================================================================== */ /** * 1. Remove the gray background on active links in IE 10. * 2. Remove gaps in links underline in iOS 8+ and Safari 8+. */ a { background-color: transparent; /* 1 */ -webkit-text-decoration-skip: objects; /* 2 */ } /** * 1. Remove the bottom border in Chrome 57- and Firefox 39-. * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */ abbr[title] { border-bottom: none; /* 1 */ text-decoration: underline; /* 2 */ -webkit-text-decoration: underline dotted; text-decoration: underline dotted; /* 2 */ } /** * Prevent the duplicate application of `bolder` by the next rule in Safari 6. */ b, strong { font-weight: inherit; } /** * Add the correct font weight in Chrome, Edge, and Safari. */ b, strong { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ code, kbd, samp { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font style in Android 4.3-. */ dfn { font-style: italic; } /** * Add the correct background and color in IE 9-. */ mark { background-color: #ff0; color: #000; } /** * Add the correct font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` elements from affecting the line height in * all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } /* Embedded content ========================================================================== */ /** * Add the correct display in IE 9-. */ audio, video { display: inline-block; } /** * Add the correct display in iOS 4-7. */ audio:not([controls]) { display: none; height: 0; } /** * Remove the border on images inside links in IE 10-. */ img { border-style: none; } /** * Hide the overflow in IE. */ svg:not(:root) { overflow: hidden; } /* Forms ========================================================================== */ /** * 1. Change the font styles in all browsers (opinionated). * 2. Remove the margin in Firefox and Safari. */ button, input, optgroup, select, textarea { font-family: sans-serif; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 1 */ margin: 0; /* 2 */ } /** * Show the overflow in IE. * 1. Show the overflow in Edge. */ button, input { /* 1 */ overflow: visible; } /** * Remove the inheritance of text transform in Edge, Firefox, and IE. * 1. Remove the inheritance of text transform in Firefox. */ button, select { /* 1 */ text-transform: none; } /** * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video` * controls in Android 4. * 2. Correct the inability to style clickable types in iOS and Safari. */ button, html [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; /* 2 */ } /** * Remove the inner border and padding in Firefox. */ button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus styles unset by the previous rule. */ button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } /** * Correct the padding in Firefox. */ fieldset { padding: 0.35em 0.75em 0.625em; } /** * 1. Correct the text wrapping in Edge and IE. * 2. Correct the color inheritance from `fieldset` elements in IE. * 3. Remove the padding so developers are not caught out when they zero out * `fieldset` elements in all browsers. */ legend { -webkit-box-sizing: border-box; box-sizing: border-box; /* 1 */ color: inherit; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 3 */ white-space: normal; /* 1 */ } /** * 1. Add the correct display in IE 9-. * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera. */ progress { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ } /** * Remove the default vertical scrollbar in IE. */ textarea { overflow: auto; } /** * 1. Add the correct box sizing in IE 10-. * 2. Remove the padding in IE 10-. */ [type="checkbox"], [type="radio"] { -webkit-box-sizing: border-box; box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Chrome. */ [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } /** * 1. Correct the odd appearance in Chrome and Safari. * 2. Correct the outline style in Safari. */ [type="search"] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Remove the inner padding and cancel buttons in Chrome and Safari on macOS. */ [type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style clickable types in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Interactive ========================================================================== */ /* * Add the correct display in IE 9-. * 1. Add the correct display in Edge, IE, and Firefox. */ details, menu { display: block; } /* * Add the correct display in all browsers. */ summary { display: list-item; } /* Scripting ========================================================================== */ /** * Add the correct display in IE 9-. */ canvas { display: inline-block; } /** * Add the correct display in IE. */ template { display: none; } /* Hidden ========================================================================== */ /** * Add the correct display in IE 10-. */ [hidden] { display: none; } /* ========================================================================== #SHARED ========================================================================== */ /** * Shared declarations for certain elements. */ /** * Always declare margins in the same direction: * csswizardry.com/2012/06/single-direction-margin-declarations */ address, h1, h2, h3, h4, h5, h6, blockquote, p, pre, dl, ol, ul, figure, hr, table, fieldset { margin-bottom: 24px; } /** * Consistent indentation for lists. */ dd, ol, ul { margin-left: 24px; } /* ========================================================================== #PAGE ========================================================================== */ /** * Simple page-level setup. * * 1. Set the default `font-size` and `line-height` for the entire project, * sourced from our default variables. The `font-size` is calculated to exist * in ems, the `line-height` is calculated to exist unitlessly. * 2. Force scrollbars to always be visible to prevent awkward ‘jumps’ when * navigating between pages that do/do not have enough content to produce * scrollbars naturally. * 3. Ensure the page always fills at least the entire height of the viewport. */ html { font-size: 1em; /* [1] */ line-height: 1.5; /* [1] */ overflow-y: scroll; /* [2] */ min-height: 100%; /* [3] */ } /* ========================================================================== #HEADINGS ========================================================================== */ /** * Simple default styles for headings 1 through 6. Anything more opinionated * than simple font-size changes should likely be applied via classes (see: * http://csswizardry.com/2016/02/managing-typography-on-large-apps/). */ h1 { font-size: 36px; font-size: 2.25rem; line-height: 1.16667; } h2 { font-size: 28px; font-size: 1.75rem; line-height: 1.28571; } h3 { font-size: 24px; font-size: 1.5rem; line-height: 1.25; } h4 { font-size: 20px; font-size: 1.25rem; line-height: 1.5; } h5 { font-size: 18px; font-size: 1.125rem; line-height: 1.33333; } h6 { font-size: 16px; font-size: 1rem; line-height: 1.5; } html { overflow-y: initial; } body { color: #4a4a4a; padding: 0; margin: 0; overflow-x: hidden; } figure { position: relative; page-break-inside: avoid; } figure img { display: block; max-width: 100%; } h1, h2, h3 { font-family: "Lato", Helvetica, Arial, sans-serif; font-weight: normal; margin-top: 48px; margin-bottom: 0; } @media (min-width: 68.75em) { h2 { font-size: 36px; font-size: 2.25rem; line-height: 47px; } } @media (min-width: 68.75em) { h3 { font-size: 28px; font-size: 1.75rem; line-height: 36px; } } h4 { font-size: 25px; font-size: 1.5625rem; line-height: 28px; margin-top: 48px; margin-bottom: 0; font-weight: bold; } @media (min-width: 68.75em) { h4 { font-size: 28px; font-size: 1.75rem; line-height: 36px; } } h5 { font-size: 22px; font-size: 1.375rem; line-height: 1.6; margin-top: 12px; margin-bottom: 0; font-weight: bold; } @media (min-width: 68.75em) { h5 { font-size: 22px; font-size: 1.375rem; line-height: 1.6; } } h5 + p.c-longform-grid__standard { margin-top: 0; } a { color: #0079cf; text-decoration: none; padding-bottom: 0.05em; cursor: pointer; border-bottom: 1px solid transparent; overflow-wrap: break-word; /* word-wrap: break-word; -ms-word-break: break-all; // This is the dangerous one in WebKit, as it breaks things wherever word-break: break-all; // Instead use this non-standard one: word-break: break-word; // Adds a hyphen where the word breaks, if supported (No Blink) -ms-hyphens: auto; -moz-hyphens: auto; -webkit-hyphens: auto; hyphens: auto; */ } /* a:visited used to be $brand-medium, robert changed this */ a:visited { color: #0079cf; } a:visited:hover { color: #0079cf; border-bottom: 1px solid currentColor; } a:hover { border-bottom: 1px solid currentColor; } a:focus { border-bottom: 1px solid currentColor; } a:active { border-bottom: 1px solid rcurrentColor; } .links-wrapper-dark-background a { color: #00c2ff; } .links-wrapper-dark-background a:visited { color: #00c2ff; border-bottom: 1px solid #00c2ff; } .links-wrapper-dark-background a:visited:hover { color: #00c2ff; border-bottom: 1px solid #00c2ff; } .links-wrapper-dark-background a:hover { border-bottom: 1px solid currentColor; } a.u-no-underline { text-decoration: none; border: none; } a.u-no-underline:hover { text-decoration: none; border: none; } input:not([type="radio"]):not([type="checkbox"]) { border-radius: 0; -webkit-appearance: none; } footnotes, .footnotes { margin: 0; } footnotes ol, footnotes ul, .footnotes ol, .footnotes ul { margin-left: 0; padding-left: 0; margin-bottom: 24px; } /* ========================================================================== #LAYOUT ========================================================================== */ /** * Grid-like layout system. * * The layout object provides us with a column-style layout system. This file * contains the basic structural elements, but classes should be complemented * with width utilities, for example: * * <div class="o-layout"> * <div class="o-layout__item u-1/2"> * </div> * <div class="o-layout__item u-1/2"> * </div> * </div> * * The above will create a two-column structure in which each column will * fluidly fill half of the width of the parent. We can have more complex * systems: * * <div class="o-layout"> * <div class="o-layout__item u-1/1 u-1/3@medium"> * </div> * <div class="o-layout__item u-1/2 u-1/3@medium"> * </div> * <div class="o-layout__item u-1/2 u-1/3@medium"> * </div> * </div> * * The above will create a system in which the first item will be 100% width * until we enter our medium breakpoint, when it will become 33.333% width. The * second and third items will be 50% of their parent, until they also become * 33.333% width at the medium breakpoint. * * We can also manipulate entire layout systems by adding a series of modifiers * to the `.o-layout` block. For example: * * <div class="o-layout o-layout--reverse"> * * This will reverse the displayed order of the system so that it runs in the * opposite order to our source, effectively flipping the system over. * * <div class="o-layout o-layout--[right|center]"> * * This will cause the system to fill up from either the centre or the right * hand side. Default behaviour is to fill up the layout system from the left. * * There are plenty more options available to us: explore them below. */ /* Default/mandatory classes ========================================================================== */ /** * 1. Allows us to use the layout object on any type of element. * 2. We need to defensively reset any box-model properties. * 3. Use the negative margin trick for multi-row grids: * http://csswizardry.com/2011/08/building-better-grid-systems/ */ .o-layout { display: block; /* [1] */ margin: 0; /* [2] */ padding: 0; /* [2] */ list-style: none; /* [1] */ margin-left: -24px; /* [3] */ font-size: 0; } /** * 1. Required in order to combine fluid widths with fixed gutters. * 2. Allows us to manipulate grids vertically, with text-level properties, * etc. * 3. Default item alignment is with the tops of each other, like most * traditional grid/layout systems. * 4. By default, all layout items are full-width (mobile first). * 5. Gutters provided by left padding: * http://csswizardry.com/2011/08/building-better-grid-systems/ * 6. Fallback for old IEs not supporting `rem` values. */ .o-layout__item { -webkit-box-sizing: border-box; box-sizing: border-box; /* [1] */ display: inline-block; /* [2] */ vertical-align: top; /* [3] */ width: 100%; /* [4] */ padding-left: 24px; /* [5] */ font-size: 16px; /* [6] */ font-size: 1rem; } /* Gutter size modifiers ========================================================================== */ .o-layout--flush { margin-left: 0; } .o-layout--flush > .o-layout__item { padding-left: 0; } .o-layout--tiny { margin-left: -6px; } .o-layout--tiny > .o-layout__item { padding-left: 6px; } .o-layout--small { margin-left: -12px; } .o-layout--small > .o-layout__item { padding-left: 12px; } .o-layout--large { margin-left: -48px; } .o-layout--large > .o-layout__item { padding-left: 48px; } .o-layout--huge { margin-left: -96px; } .o-layout--huge > .o-layout__item { padding-left: 96px; } /* Vertical alignment modifiers ========================================================================== */ /** * Align all grid items to the middles of each other. */ .o-layout--middle > .o-layout__item { vertical-align: middle; } /** * Align all grid items to the bottoms of each other. */ .o-layout--bottom > .o-layout__item { vertical-align: bottom; } /** * Stretch all grid items of each row to have an equal-height. * Please be aware that this modifier class doesn’t take any effect in IE9 and * below and other older browsers due to the lack of `display: flex` support. */ .o-layout--stretch { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .o-layout--stretch > .o-layout__item { display: -webkit-box; display: -ms-flexbox; display: flex; } .o-layout--stretch.o-layout--center { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .o-layout--stretch.o-layout--right { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .o-layout--stretch.o-layout--left { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } /* Fill order modifiers ========================================================================== */ /** * Fill up the layout system from the centre. */ .o-layout--center { text-align: center; } .o-layout--center > .o-layout__item { text-align: left; } /** * Fill up the layout system from the right-hand side. */ .o-layout--right { text-align: right; } .o-layout--right > .o-layout__item { text-align: left; } /** * Fill up the layout system from the left-hand side. This will likely only be * needed when using in conjunction with `.o-layout--reverse`. */ .o-layout--left { text-align: left; } .o-layout--left > .o-layout__item { text-align: left; } /** * Reverse the rendered order of the grid system. */ .o-layout--reverse { direction: rtl; } .o-layout--reverse > .o-layout__item { direction: ltr; } /* Auto-widths modifier ========================================================================== */ /** * Cause layout items to take up a non-explicit amount of width. */ .o-layout--auto > .o-layout__item { width: auto; } /* ========================================================================== #MEDIA ========================================================================== */ /** * Place any image- and text-like content side-by-side, as per: * http://www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code */ .o-media { display: block; } .o-media:after { content: "" !important; display: block !important; clear: both !important; } .o-media__img { float: left; margin-right: 24px; } .o-media__img > img { display: block; } .o-media__body { overflow: hidden; display: block; } .o-media__body, .o-media__body > :last-child { margin-bottom: 0; } /* Size variants ========================================================================== */ /** * Modify the amount of space between our image and our text. We also have * reversible options for all available sizes. */ .o-media--flush > .o-media__img { margin-right: 0; margin-left: 0; } .o-media--tiny > .o-media__img { margin-right: 6px; } .o-media--tiny.o-media--reverse > .o-media__img { margin-right: 0; margin-left: 6px; } .o-media--small > .o-media__img { margin-right: 12px; } .o-media--small.o-media--reverse > .o-media__img { margin-right: 0; margin-left: 12px; } .o-media--large > .o-media__img { margin-right: 48px; } .o-media--large.o-media--reverse > .o-media__img { margin-right: 0; margin-left: 48px; } .o-media--huge > .o-media__img { margin-right: 96px; } .o-media--huge.o-media--reverse > .o-media__img { margin-right: 0; margin-left: 96px; } /* Reversed media objects ========================================================================== */ .o-media--reverse > .o-media__img { float: right; margin-right: 0; margin-left: 24px; } /* ========================================================================== #FLAG ========================================================================== */ /** * The flag object is a design pattern similar to the media object, however it * utilises `display: table[-cell];` to give us control over the vertical * alignments of the text and image. * * http://csswizardry.com/2013/05/the-flag-object/ * * 1. Allows us to control vertical alignments. * 2. Force the object to be the full width of its parent. Combined with [1], * this makes the object behave in a quasi-`display: block;` manner. * 3. Reset inherited `border-spacing` declarations. */ .o-flag { display: table; /* [1] */ width: 100%; /* [2] */ border-spacing: 0; /* [3] */ } /** * Items within a flag object. There should only ever be one of each. * * 1. Default to aligning content to their middles. */ .o-flag__img, .o-flag__body { display: table-cell; vertical-align: middle; /* [1] */ } /** * Flag images have a space between them and the body of the object. * * 1. Force `.flag__img` to take up as little space as possible: * https://pixelsvsbytes.com/2012/02/this-css-layout-grid-is-no-holy-grail/ */ .o-flag__img { width: 1px; /* [1] */ padding-right: 24px; /** * 1. Fixes problem with images disappearing. * * The direct child selector '>' needs to remain in order for nested flag * objects to not inherit their parent’s formatting. In case the image tag * is wrapped into another tag, e.g. an anchor for linking reasons, it will * disappear. In that case try wrapping the whole o-flag__img object into * an anchor tag. * * E.g.: * * <a href="/"> * <div class="o-flag__img"> * <img src="./link/to/image.jpg" alt="image alt text"> * </div> * </a> */ } .o-flag__img > img { max-width: none; /* [1] */ } /** * The container for the main content of the flag object. * * 1. Forces the `.flag__body` to take up all remaining space. */ .o-flag__body { width: auto; /* [1] */ } .o-flag__body, .o-flag__body > :last-child { margin-bottom: 0; } /* Size variants ========================================================================== */ .o-flag--flush > .o-flag__img { padding-right: 0; padding-left: 0; } .o-flag--tiny > .o-flag__img { padding-right: 6px; } .o-flag--tiny.o-flag--reverse > .o-flag__img { padding-right: 0; padding-left: 6px; } .o-flag--small > .o-flag__img { padding-right: 12px; } .o-flag--small.o-flag--reverse > .o-flag__img { padding-right: 0; padding-left: 12px; } .o-flag--large > .o-flag__img { padding-right: 48px; } .o-flag--large.o-flag--reverse > .o-flag__img { padding-right: 0; padding-left: 48px; } .o-flag--huge > .o-flag__img { padding-right: 96px; } .o-flag--huge.o-flag--reverse > .o-flag__img { padding-right: 0; padding-left: 96px; } /* Reversed flag ========================================================================== */ /** * 1. Swap the rendered direction of the object… * 2. …and reset it. * 3. Reassign margins to the correct sides. */ .o-flag--reverse { direction: rtl; /* [1] */ } .o-flag--reverse > .o-flag__img, .o-flag--reverse > .o-flag__body { direction: ltr; /* [2] */ } .o-flag--reverse > .o-flag__img { padding-right: 0; /* [3] */ padding-left: 24px; /* [3] */ } /* Alignment variants ========================================================================== */ /** * Vertically align the image- and body-content differently. Defaults to middle. */ .o-flag--top > .o-flag__img, .o-flag--top > .o-flag__body { vertical-align: top; } .o-flag--bottom > .o-flag__img, .o-flag--bottom > .o-flag__body { vertical-align: bottom; } /* ========================================================================== #LIST-BARE ========================================================================== */ /** * Strip list-like appearance from lists by removing their bullets and any * indentation. * * Note: Declaring the item class might not be necessary everywhere, * but is for example in <dl> lists for the <dd> children. */ .o-list-bare { list-style: none; margin-left: 0; } .o-list-bare__item { margin-left: 0; } /* ========================================================================== #LIST-INLINE ========================================================================== */ /** * The list-inline object simply displays a list of items in one line. */ .o-list-inline { margin-left: 0; list-style: none; } .o-list-inline__item { display: inline-block; } /* ========================================================================== #BOX ========================================================================== */ /** * The box object simply boxes off content. Extend with cosmetic styles in the * Components layer. * * 1. So we can apply the `.o-box` class to naturally-inline elements. */ .o-box { display: block; /* [1] */ padding: 24px; } .o-box:after { content: "" !important; display: block !important; clear: both !important; } .o-box > :last-child { margin-bottom: 0; } /* Size variants ========================================================================== */ .o-box--flush { padding: 0; } .o-box--tiny { padding: 6px; } .o-box--small { padding: 12px; } .o-box--large { padding: 48px; } .o-box--huge { padding: 96px; } /* ========================================================================== #BLOCK ========================================================================== */ /** * Stacked image-with-text object. A simple abstraction to cover a very commonly * occurring design pattern. */ .o-block { display: block; text-align: center; } .o-block__img { margin-bottom: 24px; /* Size variants ====================================================================== */ } .o-block--flush > .o-block__img { margin-bottom: 0; } .o-block--tiny > .o-block__img { margin-bottom: 6px; } .o-block--small > .o-block__img { margin-bottom: 12px; } .o-block--large > .o-block__img { margin-bottom: 48px; } .o-block--huge > .o-block__img { margin-bottom: 96px; } .o-block__body { display: block; } /* Alignment variants ========================================================================== */ .o-block--right { text-align: right; } .o-block--left { text-align: left; } .o-grid-container { display: grid; grid-template-columns: repeat(12, 1fr); grid-template-rows: auto; height: 100%; grid-column-gap: 2%; } .o-grid-container-sub-div > div { display: grid; grid-template-columns: repeat(12, 1fr); grid-template-rows: auto; height: 100%; grid-column-gap: 2%; } .o-grid-container__item-standard { grid-row: auto; grid-column: 2/12; } @media (min-width: 68.75em) { .o-grid-container__item-standard { grid-column: 3/11; } } .o-grid-container__item-standard-full-right { grid-row: auto; grid-column: 2/13; } @media (min-width: 68.75em) { .o-grid-container__item-standard-full-right { grid-column: 3/13; } } .o-grid-container__item-standard-left { grid-row: auto; grid-column: 4/10; } @media (min-width: 68.75em) { .o-grid-container__item-standard-left { grid-column: 1/4; } } .o-grid-container__item-standard-right { grid-row: auto; grid-column: 4/10; } @media (min-width: 68.75em) { .o-grid-container__item-standard-right { grid-column: 10/13; } } .o-grid-container__item-wider { grid-column: 3/11; grid-row: auto; } .o-grid-container__item-full { grid-column: 1/13; grid-row: auto; } .o-grid-container__offset-right { grid-row: auto; grid-column: 2/12; } @media (min-width: 68.75em) { .o-grid-container__offset-right { grid-column: 4/13; } } .o-wrapper-page { max-width: 1900px; margin-left: auto; margin-right: auto; } .o-wrapper-fixed-header { max-width: 100%; padding-top: 130px; } @media (min-width: 46.25em) { .o-wrapper-fixed-header { padding-top: 115px; } } .o-wrapper { margin-right: auto; margin-left: auto; max-width: 1570px; } .o-wrapper:after { content: "" !important; display: block !important; clear: both !important; } @media (min-width: 46.25em) { .o-wrapper { padding-right: 24px; padding-left: 24px; } } .o-wrapper--padded { padding-right: 24px; padding-left: 24px; } .o-wrapper--padded-large { padding-left: 24px; padding-right: 24px; } @media (min-width: 46.25em) { .o-wrapper--padded-large { padding-left: 96px; padding-right: 96px; } } .o-wrapper-section { max-width: 1264px; margin-right: auto; margin-left: auto; } .o-wrapper-inner { margin-right: auto; margin-left: auto; max-width: 940px; } .o-wrapper-inner:after { content: "" !important; display: block !important; clear: both !important; } .o-wrapper-medium { margin-right: auto; margin-left: auto; max-width: 1100px; } @media (min-width: 46.25em) { .o-wrapper--no-padding { padding-right: 0; padding-left: 0; } } .o-wrapper-full-width { width: 100vw; position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; } @media (min-width: 81.25em) { .c-accordion-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } } .c-accordion > button { padding: 48px; background-color: #0079cf; text-align: left; color: #ffffff; } .c-accordion > button:hover, .c-accordion > button:focus { -webkit-transform: scale(1.01); transform: scale(1.01); } .c-accordion:nth-of-type(3) > button { background-color: #0954a7; } .c-accordion:nth-of-type(4) > button { background-color: #1e2051; } @media (min-width: 81.25em) { .c-accordion { max-width: 50%; -ms-flex-preferred-size: 50%; flex-basis: 50%; -webkit-transition: all 400ms ease-in-out; transition: all 400ms ease-in-out; } } .c-accordion--expanded { max-width: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; } .c-accordion__toggle { width: 100%; border: none; } .c-accordion__body { background: #ffffff; } @-webkit-keyframes appear { 0% { background: none; } 100% { background: white; } } @keyframes appear { 0% { background: none; } 100% { background: white; } } .c-article-header__title { margin: 12px 0 0 0; font-family: Georgia, serif; font-weight: 100; letter-spacing: 1px; font-size: 28px; font-size: 1.75rem; line-height: 1.4; } @media (min-width: 46.25em) { .c-article-header__title { font-size: 47px; font-size: 2.9375rem; line-height: 1.4; } } .c-article-header__subtitle { margin-top: 0; font-family: "Lato", Helvetica, Arial, sans-serif; font-weight: lighter; font-size: 22px; font-size: 1.375rem; line-height: 1.4; } @media (min-width: 46.25em) { .c-article-header__subtitle { font-size: 28px; font-size: 1.75rem; line-height: 1.4; } } .c-article-header__meta { font-family: "Lato", Helvetica, Arial, sans-serif; font-weight: 300; font-size: 16px; font-size: 1rem; line-height: 1.5; padding-bottom: 12px; } .c-article-header__meta-uppercase { text-transform: uppercase; } .c-article-header__link-item { margin-right: 6px; } .c-article-header__link-item:after { content: ','; display: inline-block; } .c-article-header__link-item:last-child:after { display: none; } .c-article-header__button { text-transform: uppercase; font-family: "Lato", Helvetica, Arial, sans-serif; font-weight: 100; padding: 24px 0; color: #ffffff; padding: 16.8px 24px; margin-bottom: 24px; background-color: #0079cf; border-bottom: 0; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .c-article-header__button:hover { background-color: #0954a7; } .c-article-header__button-text { color: #ffffff; } .c-article-header__download { display: block; margin-bottom: 48px; padding-left: 0; padding-bottom: 0; } .c-article-header__download:hover .c-article-header__download-text { border: none; } .c-article-header__download:hover .c-article-header__download-icon { -webkit-transform: translateY(3px); transform: translateY(3px); } .c-article-header__download-text { font-family: "Lato", Helvetica, Arial, sans-serif; border: none; } .c-article-header__download-text span { padding-bottom: 0.05em; border-bottom: 1px solid rgba(0, 121, 207, 0.5); } .c-article-header__download-text:hover { border: none; } .c-article-header__download-text:hover .c-article-header__download-icon { -webkit-transform: translateY(3px); transform: translateY(3px); } .c-article-header__download-icon { width: 20px; height: 20px; fill: #ffffff; margin-bottom: -4px; margin-left: 24px; -webkit-transition: -webkit-transform 0.2s ease-out; transition: -webkit-transform 0.2s ease-out; transition: transform 0.2s ease-out; transition: transform 0.2s ease-out, -webkit-transform 0.2s ease-out; } a.c-article-header__button, a.c-article-header__button:hover, a.c-article-header__button:visited, a.c-article-header__button:active { border-bottom: 0; } .c-article-header__button-icon { padding-left: 24px; } .c-article-header__button-icon svg { width: 14px; } .c-article-header__button-icon path { fill: #ffffff; } .c-article-header__institution .c-logo { margin-top: 12px; margin-bottom: 12px; } .c-article { /* word-wrap: break-word; */ font-size: 19px; font-size: 1.1875rem; line-height: 1.6; } @media (min-width: 46.25em) { .c-article { font-size: 22px; font-size: 1.375rem; line-height: 1.6; } } @media print { .c-article { width: 20cm; margin: 0 auto; } } .c-article__lead { color: #1e2051; max-width: 950px; margin-top: 0; margin-bottom: 24px; font-size: 22px; font-size: 1.375rem; line-height: 1.6; padding-left: 24px; padding-right: 24px; } @media (min-width: 46.25em) { .c-article__lead { padding-left: 96px; } } @media (min-width: 46.25em) { .c-article__lead { font-size: 28px; font-size: 1.75rem; line-height: 1.6; } } .c-article__lead--center { text-align: center; font-family: "Lato", Helvetica, Arial, sans-serif; margin: auto auto 96px auto; padding: 0; max-width: 840px; } .c-article__lead--big-light { color: #ffffff; font-weight: 300; margin: 48px auto; padding: 0 12px; } @media (min-width: 46.25em) { .c-article__lead--big-light { font-size: 36px; font-size: 2.25rem; line-height: 1.6; margin: 96px auto; } } .c-article__title { color: #1e2051; margin-bottom: 24px; padding-left: 24px; padding-right: 24px; } @media (min-width: 46.25em) { .c-article__title { padding-left: 96px; font-size: 47px; font-size: 2.9375rem; line-height: 1.6; } } .c-article__title--center { padding: 0; text-align: center; } .c-article_mainPoints { margin-top: 24px; font-family: "Lato", Helvetica, Arial, sans-serif; font-weight: 300; } .c-article_mainPoints li { margin-bottom: 24px; } .c-article_mainPoints-firstWords { font-weight: normal; } .c-article_mainPoints-list { list-style: none; margin-left: 0; margin-top: 24px; margin-bottom: 48px; } .c-article_mainPoints-item { position: relative; } .c-article_mainPoints-item:before { content: ''; height: 1px; width: 30px; background: #4a4a4a; display: inline-block; position: absolute; top: 12px; left: -40px; } .c-article__figure { margin-left: 0; margin-right: 0; } .c-article__figure-img { width: 100%; -o-object-fit: cover; object-fit: cover; } @media (min-width: 46.25em) { .c-article__figure-img { height: 50vh; } } .c-article__figure-figcaption { font-family: "Lato", Helvetica, Arial, sans-serif; font-size: 18px; font-size: 1.125rem; line-height: 1.33333; color: #4a4a4a; margin-left: 20px; } .c-article__nugget { border: 1.5px solid #0954a7; color: #0954a7; padding: 24px; font-family: "Lato", Helvetica, Arial, sans-serif; font-size: 0.8em; line-height: 1.5em; } .c-article__nugget-title { font-family: "Lato", Helvetica, Arial, sans-serif; font-size: 22px; font-size: 1.375rem; line-height: 1.36364; margin: 24px 0; font-weight: bold; } .c-article__pullQuote { font-size: 22px; font-size: 1.375rem; line-height: 1.4; font-family: "Lato", Helvetica, Arial, sans-serif; font-weight: 300; color: #4a4a4a; font-style: italic; text-align: left; letter-spacing: 0.02em; padding: 0 48px; margin-bottom: 12px; margin-top: 12px; } @media (min-width: 46.25em) { .c-article__pullQuote { font-size: 28px; font-size: 1.75rem; line-height: 1.4; } } @media (min-width: 46.25em) { .c-article__pullQuote { padding: 0 48px; } } blockquote { border-left: #4a4a4a solid 1px; font-style: italic; letter-spacing: 0.02em; font-weight: 300; padding-left: 24px; } .c-article-nav-list { margin: 0; padding: 24px 12px 0 24px; font-size: 16px; font-size: 1rem; line-height: 22px; font-family: "Lato", Helvetica, Arial, sans-serif; -webkit-transition: all 1s linear; transition: all 1s linear; list-style: none; } .c-article-nav-list .c-article-nav-list__item:first-child { padding-top: 24px; } .c-article-nav-list .c-article-nav-list__item { border-left: 1px solid rgba(155, 155, 155, 0.35); padding-left: 24px; padding-bottom: 24px; -webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } .c-article-nav-list .c-article-nav-list__item a { border-bottom: none; color: #4a4a4a; } .c-article-nav-list .c-article-nav-list__item a:hover { border-bottom: 1px solid #4a4a4a; } .c-article-nav-list .c-article-nav-list__item--scrolled-past, .c-article-nav-list .c-article-nav-list__item--selected { border-left: 1px solid #4a4a4a; } .c-article-nav-list .c-article-nav-list__item--selected > a { font-weight: bolder; color: #0954a7; } .c-article-nav-list--inner { margin: 0; padding: 0; } @media (max-width: 46.24em) { .c-article-nav-list--inner { display: none; } } .c-article-nav-list--inner .c-article-nav-list__item { border-left: none; } .c-article-nav-list--inner .c-article-nav-list__item:last-child { padding-bottom: 0; } @media (max-width: 46.24em) { .c-article-nav-list__item--selected .c-article-nav-list--inner { display: block; } } .c-article-nav-list__arrowup { margin-top: 24px; margin-left: 20px; opacity: 0.3; } .c-article-nav-list__arrowdown { margin-left: 20px; } .c-article-nav-list__arrowdown svg { -webkit-transform: rotate(180deg); transform: rotate(180deg); } .c-article-nav-fullscreen { margin: 0; opacity: 0; display: none; } @-webkit-keyframes fullscreenopener { 1%, 100% { display: block; } 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fullscreenopener { 1%, 100% { display: block; } 0% { opacity: 0; } 100% { opacity: 1; } } .c-article-nav-fullscreen--open { background: #e5f1fa; min-height: 100vh; z-index: 3; opacity: 1; display: block; -webkit-animation: fullscreenopener 0.9s ease-out; animation: fullscreenopener 0.9s ease-out; } .c-article-nav-fullscreen-button { position: fixed; z-index: 2; right: 10px; bottom: 10px; border: 0; height: 75px; width: 75px; border-radius: 50%; background-color: #1e2051; cursor: pointer; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.4); box-shadow: 0 0 20px rgba(0, 0, 0, 0.4); } .c-article-nav-fullscreen-button img { vertical-align: text-bottom; max-width: 30px; } @media (max-width: 81.25em) { .c-article-nav-fullscreen-button { display: block; } } @media (min-width: 81.25em) { .c-article-nav-fullscreen-button { display: none; } } .c-article-nav-sidebar { padding: 0 24px; position: fixed; display: block; max-width: 300px; top: 48px; bottom: 0; right: 0; height: calc(100%-$spacing-large); padding-bottom: 48px; overflow-y: auto; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (max-width: 81.25em) { .c-article-nav-sidebar { display: none; } } /* ========================================================================== #BUTTONS ========================================================================== */ /** * This is an example component. Extend inuitcss by building your own components * that make up your UI. Component classes are prefixed with a `c-`. */ /** * 1. Allow us to style box model properties. * 2. Line different sized buttons up a little nicer. * 3. Make buttons inherit font styles (often necessary when styling `input`s as * buttons). * 4. Reset/normalize some styles. * 5. Force all button-styled elements to appear clickable. */ .c-btn { display: inline-block; /* [1] */ vertical-align: middle; /* [2] */ font: inherit; /* [3] */ text-align: center; /* [4] */ margin: 0; /* [4] */ cursor: pointer; /* [5] */ -webkit-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; border: none; background-color: transparent; } .c-btn:hover, .c-btn:focus { text-decoration: underline; /* [4] */ } .c-btn--flex { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .c-btn--icon { color: #0079cf; height: 54px; } .c-btn--icon svg path { stroke: #0079cf; } .c-btn--icon svg circle { stroke: #0079cf; fill: transparent; } .c-btn--icon:hover, .c-btn--icon:focus { border: none; outline: none; } .c-btn--icon:hover svg g, .c-btn--icon:hover svg path, .c-btn--icon:focus svg g, .c-btn--icon:focus svg path { stroke: #ffffff; fill: #ffffff; } .c-btn--icon:hover svg circle, .c-btn--icon:focus svg circle { fill: #0079cf; } .c-btn__body { font-family: "Lato", Helvetica, Arial, sans-serif; margin-left: 12px; display: inline-block; margin: auto; padding: 12px 24px; border: 2px solid #0079cf; } .c-btn__body:hover { border: 2px solid #00c2ff; } /* Style variants ========================================================================== */ .c-btn--primary:focus .c-btn__body { color: #ffffff; background-color: #0079cf; } .c-btn--secondary { color: #ffffff; } .c-btn--secondary svg g { color: transparent; } .c-btn--secondary svg path { color: #ffffff; } .c-btn--secondary svg circle { stroke: #ffffff; fill: transparent; } .c-btn--secondary:hover, .c-btn--secondary:focus { border: none; outline: none; } .c-btn--secondary:hover svg g, .c-btn--secondary:hover svg path, .c-btn--secondary:focus svg g, .c-btn--secondary:focus svg path { stroke: #1e2051; fill: #1e2051; } .c-btn--secondary:hover svg circle, .c-btn--secondary:focus svg circle { fill: #ffffff; } .c-btn--tertiary { background-color: #fff; color: #4a8ec2; } .c-btn--tertiary, .c-btn--tertiary:hover, .c-btn--tertiary:active, .c-btn--tertiary:focus { text-decoration: none; color: #4a8ec2; } .c-btn--tertiary:hover, .c-btn--tertiary:focus { color: #3774a2; } /* Size variants ========================================================================== */ .c-btn--small { padding: 6px 12px; } .c-btn--large { padding: 24px 48px; } /* Ghost buttons ========================================================================== */ /** * Ghost buttons have see-through backgrounds and are bordered. */ .c-btn--ghost { border: 2px solid currentColor; padding: 10px 22px; } .c-btn--ghost, .c-btn--ghost:hover, .c-btn--ghost:active, .c-btn--ghost:focus { background: none; } .c-btn--ghost.c-btn--small { padding: 4px 10px; } .c-btn--ghost.c-btn--large { padding: 22px 46px; } .c-btn--ghost.c-btn--primary { color: #4a8ec2; } .c-btn--ghost.c-btn--primary:hover, .c-btn--ghost.c-btn--primary:focus { color: #3774a2; } .c-btn--ghost.c-btn--secondary { color: #2f4054; } .c-btn--ghost.c-btn--secondary:hover, .c-btn--ghost.c-btn--secondary:focus { color: #1d2733; } .c-btn--ghost.c-btn--tertiary { color: #fff; } .c-btn--ghost.c-btn--tertiary:hover, .c-btn--ghost.c-btn--tertiary:focus { color: #fff; } .c-breadcrumb { font-family: "Lato", Helvetica, Arial, sans-serif; width: 100vw; position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; font-weight: 600; } @media (min-width: 46.25em) { .c-breadcrumb__link { margin-left: 96px; } } .c-breadcrumb__link svg { -webkit-transform: rotate(180deg); transform: rotate(180deg); vertical-align: middle; margin-right: 12px; } .c-breadcrumb-inner { padding: 8px 0; } .c-breadcrumb:after { content: ''; position: absolute; width: 100%; bottom: 0; left: 0; height: 1px; background: #f2f2f2; } .c-breadcrumb:before { content: ''; left: 0; position: absolute; width: 100%; height: 1px; background: #f2f2f2; } .c-boxOnBox { display: block; font-weight: 300; font-family: "Lato", Helvetica, Arial, sans-serif; color: #ddddea; font-size: 18px; font-size: 1.125rem; line-height: 28px; } @media (min-width: 46.25em) { .c-boxOnBox { width: 100%; display: grid; grid-template-columns: 10% 10% 10% 10% 10% 10% 10% 10% 10%; grid-auto-rows: -webkit-min-content; grid-auto-rows: min-content; } } .c-boxOnBox p { max-width: 600px; } .c-boxOnBox__left { background: #1e2051; color: #ffffff; z-index: 9; padding: 24px; } @media (min-width: 46.25em) { .c-boxOnBox__left { padding: 10%; margin-top: -24px; grid-column: 1 / 6; } } .c-boxOnBox__left a { color: #00c2ff; } .c-boxOnBox__right { background: #e5f1fa; color: #1e2051; margin: 0; padding: 24px; } @media (min-width: 46.25em) { .c-boxOnBox__right { padding: 10% 10% 10% 20%; margin-left: -10%; grid-column: 6 / 11; grid-row: 1 / 4; } } .c-boxOnBox__right ul { list-style: none; margin: 0; padding: 0; } .c-boxOnBox__right li { margin: 0; } .c-boxOnBox__right li a { display: block; border: none; color: #1e2051; border-bottom: 1px solid rgba(30, 32, 81, 0.1); padding: 24px 0; } .c-boxOnBox__right li a:after { content: ''; display: inline-block; width: 20px; height: 20px; background: url("/static/arrowright.svg") no-repeat; float: right; margin-top: 12px; } .c-boxOnBox__right li a:hover { color: #0079cf; } .c-boxOnBox-partner-features { display: block; font-weight: 300; font-family: "Lato", Helvetica, Arial, sans-serif; color: #ddddea; font-size: 18px; font-size: 1.125rem; line-height: 28px; } @media (min-width: 46.25em) { .c-boxOnBox-partner-features { margin-right: auto; margin-left: auto; max-width: 1100px; } } .c-boxOnBox-partner-features p { max-width: 600px; } .c-boxOnBox-partner-features:after { content: ""; display: table; clear: both; } .c-boxOnBox-partner-features__left { background: #0079cf; color: #ffffff; z-index: 9; position: relative; padding: 24px 48px; margin-left: 24px; } @media (min-width: 46.25em) { .c-boxOnBox-partner-features__left { margin-left: 48px; float: left; } } .c-boxOnBox-partner-features__left p { font-size: 26px; font-size: 1.625rem; line-height: 1.4; font-weight: 300; } .c-boxOnBox-partner-features__right { text-align: center; background: #1e2051; color: #ffffff; margin: 0; z-index: 0; margin-top: -48px; padding: 24px; padding-top: 96px; } @media (min-width: 46.25em) { .c-boxOnBox-partner-features__right { margin-right: 48px; text-align: left; float: right; padding-left: 96px; } } .c-boxOnBox-partner-features__right ul { list-style: none; margin: 0; padding: 0; } .c-boxOnBox-partner-features__right li { margin: 0; } .c-boxOnBox-partner-features__right li a { display: block; border: none; color: #1e2051; border-bottom: 1px solid rgba(30, 32, 81, 0.1); padding: 24px 0; } .c-boxOnBox-partner-features__right li a:after { content: ''; display: inline-block; width: 20px; height: 20px; background: url("/static/arrowright.svg") no-repeat; float: right; margin-top: 12px; } .c-boxOnBox-partner-features__right li a:hover { color: #0079cf; } .c-boxOnBox-partner-features__statement { font-weight: 300; padding: 24px 0; } @media (min-width: 46.25em) { .c-boxOnBox-partner-features__statement { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } } .c-boxOnBox-partner-features__statement-icon { height: auto; vertical-align: top; margin-top: 12px; margin-bottom: 12px; width: 50px; } @media (min-width: 46.25em) { .c-boxOnBox-partner-features__statement-icon { width: 70px; margin-top: 0; margin-right: 24px; } } .c-boxOnBox-partner-features__statement-title { font-size: 22px; font-size: 1.375rem; line-height: 1.4; margin-top: 0; margin-bottom: 0; color: #ffffff; } .c-boxOnBox-partner-features__statement-body { font-size: 18px; font-size: 1.125rem; line-height: 1.4; margin-top: 12px; max-width: 550px; color: #ddddea; margin-bottom: 0; } @media (min-width: 46.25em) { .c-boxOnBox-partner-features__statement-body { margin-bottom: 0; } } @supports (display: grid) { @media (min-width: 46.25em) { .c-boxOnBox-partner-features { margin-right: auto; margin-left: auto; max-width: 100%; width: 100%; display: grid; grid-template-columns: 10% 10% 10% 10% 10% 10% 10% 10% 10%; grid-auto-rows: -webkit-min-content; grid-auto-rows: min-content; } } @media (min-width: 46.25em) { .c-boxOnBox-partner-features__left { padding: 15% 20%; margin-top: -48px; margin-left: 0; grid-column: 1 / 5; } } @media (min-width: 46.25em) { .c-boxOnBox-partner-features__right { text-align: left; padding: 10% 10% 10% 20%; margin-top: 0; margin-left: -10%; margin-right: 0; grid-column: 5 / 11; grid-row: 1 / 4; } } } .c-boxOnBox-topics { display: block; font-weight: 300; font-family: "Lato", Helvetica, Arial, sans-serif; color: #ddddea; font-size: 18px; font-size: 1.125rem; line-height: 28px; } @media (min-width: 46.25em) { .c-boxOnBox-topics { margin-right: auto; margin-left: auto; max-width: 1100px; } } .c-boxOnBox-topics p { max-width: 600px; } .c-boxOnBox-topics:after { content: ''; display: table; clear: both; } .c-boxOnBox-topics__left { background: #1e2051; color: #ffffff; z-index: 9; position: relative; padding: 24px 48px; margin-left: 24px; } @media (min-width: 46.25em) { .c-boxOnBox-topics__left { margin-left: 48px; float: left; } } .c-boxOnBox-topics__left p { font-size: 30px; font-size: 1.875rem; line-height: 1.4; font-weight: 300; } .c-boxOnBox-topics__right { font-size: 30px; font-size: 1.875rem; line-height: 1.4; font-weight: 300; text-align: center; background: #0954a7; color: #ffffff; margin: 0; z-index: 0; margin-top: -48px; padding: 24px; padding-top: 96px; } @media (min-width: 46.25em) { .c-boxOnBox-topics__right { margin-right: 48px; text-align: left; float: right; padding-left: 96px; } } .c-boxOnBox-topics__right a, .c-boxOnBox-topics__right a:visited, .c-boxOnBox-topics__right a:hover { color: #ffffff; } .c-boxOnBox-topics__right ul { list-style: none; margin: 0; padding: 0; } .c-boxOnBox-topics__right li { margin: 0; } .c-boxOnBox-topics__right li a { display: block; border: none; color: #ffffff; border-bottom: 1px solid rgba(30, 32, 81, 0.1); padding: 24px 0; } .c-boxOnBox-topics__right li a:after { content: ''; display: inline-block; width: 20px; height: 20px; background: url("/static/arrowright.svg") no-repeat; float: right; margin-top: 12px; } .c-boxOnBox-topics__right li a:hover { color: #0079cf; } .c-boxOnBox--topics__statement { font-weight: 300; padding: 24px 0; } @media (min-width: 46.25em) { .c-boxOnBox--topics__statement { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } } .c-boxOnBox-topics__statement-icon { height: auto; vertical-align: top; margin-top: 12px; margin-bottom: 12px; width: 50px; } @media (min-width: 46.25em) { .c-boxOnBox-topics__statement-icon { width: 70px; margin-top: 0; margin-right: 24px; } } .c-boxOnBox-topics__statement-title { font-size: 22px; font-size: 1.375rem; line-height: 1.4; margin-top: 0; margin-bottom: 0; color: #ffffff; } .c-boxOnBox-topics__statement-body { font-size: 18px; font-size: 1.125rem; line-height: 1.4; margin-top: 12px; max-width: 550px; color: #ddddea; margin-bottom: 0; } @media (min-width: 46.25em) { .c-boxOnBox-topics__statement-body { margin-bottom: 0; } } @supports (display: grid) { @media (min-width: 46.25em) { .c-boxOnBox-topics { margin-right: auto; margin-left: auto; max-width: 100%; width: 100%; display: grid; grid-template-columns: 10% 10% 10% 10% 10% 10% 10% 10% 10%; grid-auto-rows: -webkit-min-content; grid-auto-rows: min-content; } } @media (min-width: 46.25em) { .c-boxOnBox-topics__left { padding: 15% 20%; margin-top: -48px; margin-left: 0; grid-column: 1 / 5; } } @media (min-width: 46.25em) { .c-boxOnBox-topics__right { text-align: left; padding: 10% 10% 10% 20%; margin-top: 0; margin-left: -10%; margin-right: 0; grid-column: 5 / 11; grid-row: 1 / 4; } } } .c-colorBox { height: 200px; width: 200px; float: left; margin: 24px; color: #ffffff; font-family: "Lato", Helvetica, Arial, sans-serif; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-transform: uppercase; } .c-colorBox--brandDark { background-color: #1e2051; } .c-colorBox--brandMedium { background-color: #0954a7; } .c-colorBox--brandMain { background-color: #0079cf; } .c-colorBox--brandLight { background-color: #1da1f2; } .c-colorBox--black { background-color: #4a4a4a; } .c-colorBox--grey { background-color: #9b9b9b; } .c-colorBox--white { color: #4a4a4a; border: 1px solid #9b9b9b; background-color: #ffffff; } .c-colorBox--contrast { background-color: #f8ee53; } .c-chart__title { font-weight: bold; font-family: "Lato", Helvetica, Arial, sans-serif; font-size: 16px; font-size: 1rem; line-height: 1.5; color: #4a4a4a; margin-bottom: 12px; page-break-after: avoid; } .c-chart__content { padding-top: 24px; } .c-chart__content svg { width: 100%; height: auto; } .c-chart__caption { font-family: "Lato", Helvetica, Arial, sans-serif; font-size: 16px; font-size: 1rem; line-height: 1.5; color: #4a4a4a; page-break-before: avoid; } .c-chart__caption > .c-longform-grid__standard { padding-left: 0; padding-right: 0; margin-top: 12px; } .c-chart--is-loading { display: none; } @media (min-width: 46.25em) { .c-chart--full { padding: 0 12px; } } @media print { .c-chart--full { margin-left: -3.5cm; margin-right: -3.5cm; } .c-chart--wide { margin-left: -1.75cm; margin-right: -1.75cm; } .c-chart__title { page-break-after: avoid; } .c-chart__title, .c-chart__caption { font-size: 10pt; } } .c-columns { font-family: "Lato", Helvetica, Arial, sans-serif; font-size: 18px; font-size: 1.125rem; line-height: 1.4; } @media (min-width: 46.25em) { .c-columns { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-top: 48px; } } .c-columns--two__item { padding: 12px; width: 100%; } @media (min-width: 46.25em) { .c-columns--two__item { width: 50%; padding: 24px; } } .c-columns--two__item li { border: none; color: #1e2051; border-bottom: 1px solid rgba(30, 32, 81, 0.1); padding: 12px 0; } @media (min-width: 46.25em) { .c-columns__item--narrow { width: 50%; padding: 12px; } } .c-columns__title { margin: 0 0 24px; } .c-duo__item { border-bottom: 1px solid #00c2ff; padding-bottom: 24px; } .c-duo__link { border: none; } .c-duo__title { font-size: 22px; font-size: 1.375rem; line-height: 28px; } .c-frontpage-feature { background: #0079cf; color: #ffffff; padding: 48px 48px; font-family: "Lato", Helvetica, Arial, sans-serif; } @media (min-width: 46.25em) { .c-frontpage-feature { margin-top: 96px; margin-bottom: 96px; padding: 96px 48px; } } @media (min-width: 46.25em) { .c-frontpage-feature__wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } } .c-frontpage-feature__left { display: none; } @media (min-width: 46.25em) { .c-frontpage-feature__left { display: inline-block; width: 40%; } } .c-frontpage-feature__left img { max-width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .c-frontpage-feature__right { font-weight: 300; } @media (min-width: 46.25em) { .c-frontpage-feature__right { width: 40%; margin-left: 48px; } } .c-frontpage-feature__heading { font-size: 16px; font-size: 1rem; line-height: 1; margin: 0 0 24px; font-weight: 300; font-style: italic; } .c-frontpage-feature__list { list-style: none; margin: 48px 0; padding: 0; counter-reset: counter; } .c-frontpage-feature__list--active { counter-reset: counter 5; } .c-frontpage-feature__list-item { font-size: 22px; font-size: 1.375rem; line-height: 1.6; padding-top: 6px; font-weight: 300; position: relative; margin-bottom: 12px; } @media (min-width: 46.25em) { .c-frontpage-feature__list-item { padding-top: 0; font-size: 28px; font-size: 1.75rem; line-height: 1.6; } } .c-frontpage-feature__list-item:after { position: absolute; left: -32px; top: 16px; content: counter(counter, decimal-leading-zero); counter-increment: counter; font-size: 16px; font-size: 1rem; line-height: 1; color: #1e2051; padding-right: 12px; -webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } .c-frontpage-feature__list-item:before { content: ''; display: inline-block; height: 1px; width: 0px; background: #1e2051; position: absolute; left: -12px; top: 22px; -webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } @media (min-width: 46.25em) { .c-frontpage-feature__list-item:hover:after { left: -60%; } .c-frontpage-feature__list-item:hover:before { width: 55%; left: -55%; } } .c-frontpage-feature__link, .c-frontpage-feature__link:visited { color: #ffffff; } .c-frontpage-feature__link:hover, .c-frontpage-feature__link:visited:hover { padding-bottom: 0.05em; border-bottom: 1px solid rgba(30, 32, 81, 0.5); color: #1e2051; } .c-frontpage-feature__btn { background: transparent; border: none; cursor: pointer; color: #ffffff; padding: 0; margin-top: 24px; padding-bottom: 0.05em; font-family: "Lato", Helvetica, Arial, sans-serif; } .c-frontpage-feature__btn:hover { border-bottom: 1px solid white; } .c-frontpage-feature__arrowdown { -webkit-transform: rotate(90deg); transform: rotate(90deg); } .c-frontpage-feature__arrowdown--active { -webkit-transform: rotate(-90deg); transform: rotate(-90deg); } @media (min-width: 46.25em) { .c-features { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } .c-features__item { padding: 24px; text-align: center; font-family: "Lato", Helvetica, Arial, sans-serif; font-size: 18px; font-size: 1.125rem; line-height: 28px; color: #1e2051; font-weight: 300; } @media (min-width: 46.25em) { .c-features__item { display: inline-block; width: 25%; } } .c-features__icon { padding-bottom: 12px; } .c-features__icon svg, .c-features__icon path { fill: #1e2051; } .c-features__icon img { max-height: 80px; } .c-footer { margin-top: 48px; padding: 48px 24px; font-family: "Lato", Helvetica, Arial, sans-serif; border-top: 1px solid #e5f1fa; } .c-footer__wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media (min-width: 46.25em) { .c-footer__wrapper { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } } .c-footer__heading { font-weight: bold; } .c-footer__item { padding: 6px; margin-bottom: 24px; width: 50%; } .c-footer__item:first-child { width: 100%; } @media (min-width: 46.25em) { .c-footer__item { padding: 12px; width: auto; } .c-footer__item:first-child { width: auto; } } .c-footer__link { display: block; } .c-footer__link:hover { border-bottom: none; } .c-footer__color-icon { margin-bottom: 24px; } .c-footer__color-icon path, .c-footer__color-icon polygon { fill: #1e2051; } .c-footer__some-icon { border-bottom: none; height: 20px; width: 20px; margin-right: 6px; margin-bottom: -4px; } .c-footer__some-icon path, .c-footer__some-icon polygon { fill: #1e2051; } .c-footer .c-logo__text { display: inline-block; } .c-figure__title { font-weight: bold; font-family: "Lato", Helvetica, Arial, sans-serif; font-size: 16px; font-size: 1rem; line-height: 1.5; color: #4a4a4a; margin-bottom: 12px; page-break-after: avoid; } .c-figure__caption { font-family: "Lato", Helvetica, Arial, sans-serif; font-size: 16px; font-size: 1rem; line-height: 1.5; color: #4a4a4a; } .c-figure__caption > .c-longform-grid__standard { padding-left: 0; padding-right: 0; margin-top: 12px; } .c-figure--narrow { width: 100%; } @media (min-width: 46.25em) { .c-figure--narrow { width: 50%; } } @media print { .c-figure--narrow { width: 25%; } } .c-figure--narrow img { width: 100%; height: auto; } @media (min-width: 46.25em) { .c-figure--small { width: 50%; } } @media print { .c-figure--small { width: 50%; } } .c-figure--small img { width: 100%; height: auto; } .c-figure--normal img { width: 100%; height: auto; } .c-figure--wide img { width: 100%; height: auto; } @media (min-width: 46.25em) { .c-figure--wide { padding: 0 12px; } } @media print { .c-figure--full { margin-left: -3.5cm; margin-right: -3.5cm; } .c-figure--wide { margin-left: -1.75cm; margin-right: -1.75cm; } .c-figure__title { page-break-after: avoid; } .c-figure__title, .c-figure__caption { font-size: 10pt; } } .c-filters-v2 { color: #1e2051; padding: 0 24px; display: none; } @media (min-width: 46.25em) { .c-filters-v2 { padding: 0 96px; } } @media (min-width: 68.75em) { .c-filters-v2 { display: block; padding: 0; } } .c-filters-v2__clear-all { padding-bottom: 24px; min-height: 45px; text-align: right; } .c-filters-v2--standalone { margin-left: auto; margin-right: auto; font-family: "Lato", Helvetica, Arial, sans-serif; text-align: center; margin-top: 144px; color: #1e2051; margin-bottom: 48px; font-size: 18px; font-size: 1.125rem; line-height: 1.2; } .c-filters-v2__item { font-family: "Lato", Helvetica, Arial, sans-serif; padding: 0; margin: 48px 0; font-size: 16px; font-size: 1rem; line-height: 1; } .c-filters-v2__item--standalone { background: none; border: none; } .c-filters-v2__main-title { font-size: 22px; font-size: 1.375rem; line-height: 1.4; font-weight: bold; } .c-filters-v2__item-head { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .c-filters-v2__title { padding: 0; margin: 20px 0; font-weight: bold; font-size: 18px; font-size: 1.125rem; line-height: 1.4; } .c-filters-v2__checkbox { margin-bottom: 14px; display: grid; grid-template-columns: 16px auto; } .c-filters-v2__checkbox input { margin-top: 1px; width: 16px !important; height: 16px !important; border-radius: 2px; -webkit-appearance: none; -moz-appearance: none; -o-appearance: none; appearance: none; -webkit-box-shadow: none; box-shadow: none; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05); display: inline-block; position: relative; border: 1px solid #1e2051; } .c-filters-v2__checkbox input:active { -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px 1px 3px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px 1px 3px rgba(0, 0, 0, 0.1); } .c-filters-v2__checkbox input:checked { background: #1e2051; color: #ffffff; } .c-filters-v2__checkbox input:checked:after { content: '\2713'; font-size: 14px; position: absolute; top: -1px; left: 1px; color: #e5f1fa; } .c-filters-v2__radio { margin-bottom: 14px; display: grid; grid-template-columns: 16px auto; } .c-filters-v2__radio input { margin-top: 1px; width: 18px !important; height: 18px !important; border-radius: 9px; -webkit-appearance: none; -moz-appearance: none; -o-appearance: none; appearance: none; -webkit-box-shadow: none; box-shadow: none; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05); display: inline-block; position: relative; border: 1px solid #1e2051; } .c-filters-v2__radio input:active { -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px 1px 3px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px 1px 3px rgba(0, 0, 0, 0.1); } .c-filters-v2__radio input:checked { color: #1e2051; border-color: #1e2051; } .c-filters-v2__radio input:checked:after { content: ''; position: absolute; height: 100%; width: 100%; border-radius: 9px; border: 2px solid #ffffff; background-color: #1e2051; } .c-filters-v2__select { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .c-filters-v2__select div { margin-bottom: 12px; } .c-filters-v2__select label { padding-right: 6px; } .c-filters-v2__select > :first-child { margin-right: 24px; } .c-filters-v2--open { display: block; top: 0; left: 0; bottom: 0; right: 0; position: fixed; overflow-y: scroll; min-height: 100vh; width: 100%; background: #ffffff; z-index: 9; -webkit-animation: slideUp 0.2s ease-out; animation: slideUp 0.2s ease-out; -webkit-overflow-scrolling: touch; } @-webkit-keyframes slideUp { from { -webkit-transform: translateY(100vh); transform: translateY(100vh); } to { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes slideUp { from { -webkit-transform: translateY(100vh); transform: translateY(100vh); } to { -webkit-transform: translateY(0); transform: translateY(0); } } .c-filters-v2__wrapper { width: 83.33333%; margin: 0 auto; } @media (min-width: 68.75em) { .c-filters-v2__wrapper { width: 100%; } } .c-filters-v2__topbar { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 24px 0; } @media (min-width: 68.75em) { .c-filters-v2__topbar { display: none; } } .c-filters-v2__topbar-filter { background: #0079cf; border-radius: 0; border: none; color: #ffffff; padding: 5px 15px; font-size: 16px; min-height: 34px; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .c-filters-v2__topbar-filter:hover { background: #0954a7; } .c-filters-v2__topbar-result { padding: 0; margin: 0; font-size: 16px; font-size: 1rem; line-height: 1.2; } @media (min-width: 46.25em) { .c-filters-v2__topbar-result { font-size: 16px; font-size: 1rem; line-height: 1.4; } } .c-filters-v2-btn { border-color: transparent; background-color: transparent; padding: 0; } .c-filters-v2-btn--list-item { margin-top: 10px; margin-left: 30px; } .c-filters-v2-btn:hover { border-bottom: 1px solid currentColor; } .c-glossary__title { color: #1e2051; font-weight: bolder; margin-bottom: 48px; font-size: 47px; font-size: 2.9375rem; line-height: 1; } @media (min-width: 46.25em) { .c-glossary__terms { display: grid; grid-template-columns: 300px auto; grid-column-gap: 48px; border-top: solid 2px #e5f1fa; } } .c-glossary__terms-term { margin: 6px 0 0; font-family: "Lato", Helvetica, Arial, sans-serif; color: #1e2051; font-weight: bold; font-size: 22px; font-size: 1.375rem; line-height: 1.4; } @media (min-width: 46.25em) { .c-glossary__terms-term { margin: 48px 0; } } .c-glossary__terms-definition { font-family: "Lato", Helvetica, Arial, sans-serif; color: #1e2051; margin: 6px 0 48px; font-size: 18px; font-size: 1.125rem; line-height: 1.6; } @media (min-width: 46.25em) { .c-glossary__terms-definition { margin: 48px 0; } } .c-topic-page_title { font-family: "Lato", Helvetica, Arial, sans-serif; position: relative; color: #1e2051; font-weight: 300; padding: 0 0 0 24px; text-transform: uppercase; margin: 48px 24px 12px; font-size: 16px; font-size: 1rem; line-height: 1.4; } @media (min-width: 46.25em) { .c-topic-page_title { margin: 0 96px; font-size: 16px; font-size: 1rem; line-height: 1.4; } } .c-topic-page_title:before { position: absolute; content: '–'; color: #0079cf; left: 0; } .c-topic-page__longTitle { font-family: "Lato", Helvetica, Arial, sans-serif; color: #1e2051; margin: 12px 24px 24px; max-width: 650px; font-size: 22px; font-size: 1.375rem; line-height: 28px; } @media (min-width: 46.25em) { .c-topic-page__longTitle { margin: 12px 24px 96px; font-size: 47px; font-size: 2.9375rem; line-height: 57px; margin: 12px 24px 96px 96px; } } .c-topic-page__body { font-size: 22px; font-size: 1.375rem; line-height: 36px; } .c-topic-page__back { font-family: "Lato", Helvetica, Arial, sans-serif; border: none; } .c-hero { margin: 0 auto; margin-bottom: 48px; } .c-hero:after { content: ''; display: table; clear: both; } .c-hero-image { overflow: hidden; height: 50vh; width: 95%; background-size: cover; } @media (min-width: 46.25em) { .c-hero-image { height: 560px; width: 90%; } } @media (min-width: 68.75em) { .c-hero-image { width: 70%; height: 700px; } } .c-hero-header { padding: 24px 24px; color: white; width: 95%; float: right; background: #1e2051; margin-top: -200px; } @media (min-width: 46.25em) { .c-hero-header { padding: 48px 0 0; width: 95%; } } @media (min-width: 68.75em) { .c-hero-header { width: 90%; } } @media (min-width: 81.25em) { .c-hero-header { width: 80%; max-width: 1400px; } } .c-article-header { max-width: 700px; margin: 6px; } @media (min-width: 46.25em) { .c-article-header { margin: 24px 48px; } } @media (min-width: 68.75em) { .c-article-header { margin: 24px 96px; } } .c-hero-sideText { font-family: "Lato", Helvetica, Arial, sans-serif; float: left; text-align: right; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; } .c-hero-sideText a { border: none; color: grey; } @media (min-width: 81.25em) { .c-hero-sideText { -webkit-writing-mode: horizontal-tb; -ms-writing-mode: lr-tb; writing-mode: horizontal-tb; max-width: 19%; } } /* no-image styles if grid not supported */ .c-hero.c-hero-no-image .c-hero-image { display: none; } .c-hero.c-hero-no-image .c-hero-header { margin-top: 0; } @supports (display: grid) { .c-hero { max-width: 100%; margin: 0; padding: 0; display: grid; grid-template-columns: 20px auto auto auto 1fr auto auto auto 20px; grid-template-rows: 40vh 20vh auto; grid-row-gap: 10px; } @media (min-width: 46.25em) { .c-hero { grid-template-columns: 1fr auto auto 1fr 620px 1fr auto auto 1fr; } } @media (min-width: 68.75em) { .c-hero { grid-template-columns: auto 80px 80px 80px 620px 80px 80px 80px auto; } } .c-hero-image { grid-column: 1 / 7; grid-row: 1 / 3; background-size: cover; height: 100%; width: 100%; } @media (min-width: 46.25em) { .c-hero-header { padding: 48px 0; } } .c-article-header { max-width: none; margin: 0; } .c-hero-bg { background-color: #1e2051; grid-column: 4 / 10; grid-row: 2 / 4; margin-bottom: 48px; } .c-hero-sideText { grid-column: 8 / 10; grid-row: 1 / 2; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; } @media (min-width: 68.75em) { .c-hero-sideText { -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; grid-column: 7 / 8; } } @media (min-width: 81.25em) { .c-hero-sideText { grid-column: 8 / 9; } } .c-hero-header { width: 100%; float: none; background: none; margin-top: 0; grid-column: 4 / 10; grid-row: 2 / 4; } @media (min-width: 46.25em) { .c-hero-header { height: 100%; width: 100%; grid-column: 5 / 6; } } .c-hero.c-hero-no-image { grid-template-rows: auto; grid-row-gap: 0; } .c-hero.c-hero-no-image .c-hero-bg { grid-row: 1/4; } .c-hero.c-hero-no-image .c-hero-header { grid-row: 1/4; } } .c-input { margin-bottom: 14px; display: grid; grid-template-columns: 16px auto; } .c-input label { margin-left: 14px; } .c-input input { margin-top: 1px; -webkit-appearance: none; -moz-appearance: none; -o-appearance: none; appearance: none; -webkit-box-shadow: none; box-shadow: none; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05); display: inline-block; position: relative; border: 1px solid #1e2051; } .c-input input[type="checkbox"] { width: 16px !important; height: 16px !important; border-radius: 2px; } .c-input input[type="checkbox"]:active { -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px 1px 3px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px 1px 3px rgba(0, 0, 0, 0.1); } .c-input input[type="checkbox"]:checked { background: #1e2051; color: #ffffff; } .c-input input[type="checkbox"]:checked:after { content: '\2713'; font-size: 14px; position: absolute; top: -1px; left: 1px; color: #e5f1fa; } .c-input input[type="radio"] { width: 18px !important; height: 18px !important; border-radius: 9px; } .c-input input[type="radio"]:active { -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px 1px 3px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px 1px 3px rgba(0, 0, 0, 0.1); } .c-input input[type="radio"]:checked { color: #1e2051; border-color: #1e2051; } .c-input input[type="radio"]:checked:after { content: ''; position: absolute; height: 100%; width: 100%; border-radius: 9px; border: 2px solid #ffffff; background-color: #1e2051; } @keyframes loader { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 50% { -webkit-transform: rotate(180deg); transform: rotate(180deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @-webkit-keyframes loader { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 50% { -webkit-transform: rotate(180deg); transform: rotate(180deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } .c-loader__wrapper { position: relative; } .c-loader div { position: absolute; -webkit-animation: loader 1s linear infinite; animation: loader 1s linear infinite; width: 130px; height: 130px; top: 0px; left: 0px; border-radius: 50%; -webkit-box-shadow: 0 4px 0 0 #ffffff; box-shadow: 0 4px 0 0 #ffffff; } .c-loader { width: 100px; height: 100px; -webkit-transform: scale(0.3) translateX(-130px) translateY(-130px); transform: scale(0.3) translateX(-130px) translateY(-130px); } @keyframes loader-v2 { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 50% { -webkit-transform: rotate(-180deg); transform: rotate(-180deg); } 100% { -webkit-transform: rotate(-360deg); transform: rotate(-360deg); } } @-webkit-keyframes loader-v2 { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 50% { -webkit-transform: rotate(-180deg); transform: rotate(-180deg); } 100% { -webkit-transform: rotate(-360deg); transform: rotate(-360deg); } } .c-loader-v2 svg { animation: loader-v2 1s linear infinite; -webkit-animation: loader-v2 1s linear infinite; } .c-link-list { list-style: none; padding: 0; margin: 24px 0 24px; } @media (min-width: 46.25em) { .c-link-list { margin: 48px 0 0; } } .c-link-list span { font-size: 22px; font-size: 1.375rem; line-height: 28px; font-weight: 400; } .c-link-list__item { font-size: 16px; font-size: 1rem; line-height: 22px; padding: 6px 0 0; } .c-link-list__item:hover .c-link-list__icon { -webkit-transform: translateX(8px); transform: translateX(8px); } .c-link-list__link { border-bottom: none; color: #00c2ff; } .c-link-list__link:visited { color: #00c2ff; } .c-link-list__link:hover { color: #00c2ff; border-bottom: none; } .c-link-list__link:visited:hover { color: #00c2ff; } .c-link-list__icon { margin-left: 24px; -webkit-transition: -webkit-transform .15s ease-out; transition: -webkit-transform .15s ease-out; transition: transform .15s ease-out; transition: transform .15s ease-out, -webkit-transform .15s ease-out; -webkit-transform: translateX(0px); transform: translateX(0px); } /** Specify defaults to be used if "display: grid" is not supported. */ .c-longform-grid, .c-longform-grid-sub-div > div { max-width: 620px; margin: 0 auto; padding: 0 12px; } @media print { .c-longform-grid, .c-longform-grid-sub-div > div { width: 20cm; margin: 0 auto; } } .c-longform-grid__standard { padding: 0 24px; } @supports (display: grid) { .c-longform-grid, .c-longform-grid-sub-div > div { max-width: 100%; } @media (min-width: 46.25em) { .c-longform-grid, .c-longform-grid-sub-div > div { display: grid; padding: 0; grid-template-columns: 20px auto auto auto 1fr auto auto auto 20px; grid-template-rows: auto; grid-row-gap: 10px; grid-template-columns: 1fr auto auto 1fr 620px 1fr auto auto 1fr; } } @media (min-width: 68.75em) { .c-longform-grid, .c-longform-grid-sub-div > div { grid-template-columns: 1fr 80px 80px 80px 620px 80px 80px 80px 1fr; } } .c-longform-grid__standard { padding: 0 24px; grid-column: 5 / 6; } .c-longform-grid__sidebar-right { display: none; } @media (min-width: 81.25em) { .c-longform-grid__sidebar-right { display: block; grid-column: 7 / 10; } } .c-longform-grid__medium { padding: 0 24px; grid-column: 4 / 7; } .c-longform-grid__large { padding: 0 24px; grid-column: 3 / 8; } .c-longform-grid__large-right { padding: 0 24px; grid-column: 5 / 8; } .c-longform-grid__larger { padding: 0 24px; grid-column: 2 / 9; } .c-longform-grid__half { grid-column: 4 / 7; } .c-longform-grid__full { grid-column: 1 / 10; } } .c-logo { max-width: 80px; } @media (min-width: 46.25em) { .c-logo { width: auto; margin-bottom: 48px; max-width: 250px; } } .c-logo--larger { width: auto; max-width: 300px; max-height: 200px; } @media (min-width: 46.25em) { .c-logo--larger { max-width: 300px; } } .c-logo--center { text-align: center; } .c-logo--center svg { max-width: 180px; margin: auto; } @media (min-width: 46.25em) { .c-logo--center svg { margin-bottom: 48px; max-width: 250px; } } .c-logo__text { display: none; } @media (min-width: 46.25em) { .c-logo__text { display: inline-block; } } .c-oneColumnBox { font-family: "Lato", Helvetica, Arial, sans-serif; font-size: 18px; font-size: 1.125rem; line-height: 1.4; padding-top: 24px; padding-bottom: 24px; } .c-oneColumnBox__darkOnWhite { background: #ffffff; } .c-oneColumnBox__darkOnLightBlue { background: #e5f1fa; } .c-oneColumnBox__whiteOnBlue { background: #0079cf; color: #ffffff; } .c-oneColumnBox__whiteOnDarkBlue { background: #1e2051; color: #ffffff; } .c-overview-page-header { background: #1e2051; padding: 48px; color: #ffffff; } .c-overview-page__title { margin: 12px 0 0 0; font-family: Georgia, serif; font-weight: 100; letter-spacing: 1px; font-size: 28px; font-size: 1.75rem; line-height: 1.4; } @media (min-width: 46.25em) { .c-overview-page__title { font-size: 47px; font-size: 2.9375rem; line-height: 1.4; } } .c-menu { position: fixed; right: 0; top: 0; z-index: 9; background: #1e2051; -webkit-box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.3); box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.3); color: #ffffff; font-family: "Lato", Helvetica, Arial, sans-serif; font-weight: 300; -webkit-animation: toggle 0.3s ease-out; animation: toggle 0.3s ease-out; padding: 24px; overflow-y: auto; height: 100vh; width: 100%; -webkit-overflow-scrolling: touch; } @media (min-width: 46.25em) { .c-menu { width: 40%; width: 40vw; padding: 48px 48px; } } @media (min-width: 81.25em) { .c-menu { padding: 48px 96px; } } .c-menu__backdrop { position: fixed; top: 0; left: 0; width: 100%; width: 100vw; height: 100%; z-index: 2; border: 0; background: rgba(30, 32, 81, 0.5); -webkit-animation: fadeIn 0.2s ease-out; animation: fadeIn 0.2s ease-out; } .c-menu__heading { font-size: 14px; font-size: 0.875rem; line-height: 1; text-transform: uppercase; letter-spacing: 0.05em; position: relative; margin-top: 48px; } .c-menu__heading:before { content: ''; display: block; position: absolute; bottom: 1px; left: 0; width: 100%; height: 1px; background: rgba(255, 255, 255, 0.7); } .c-menu__heading-bg { display: inline-block; background: #1e2051; z-index: 1; position: relative; padding-right: 12px; } .c-menu__list { list-style: none; margin: 12px 0 0; padding: 0; font-size: 16px; font-size: 1rem; line-height: 1.6; } @-webkit-keyframes toggle { 0% { -webkit-transform: translateX(100vw); transform: translateX(100vw); } 100% { -webkit-transform: translateX(0vw); transform: translateX(0vw); } } @keyframes toggle { 0% { -webkit-transform: translateX(100vw); transform: translateX(100vw); } 100% { -webkit-transform: translateX(0vw); transform: translateX(0vw); } } .c-menu__list-item { margin-bottom: 6px; } .c-menu__clean-btn { background: none; border: none; cursor: pointer; color: #00c2ff; padding: 0; font-size: inherit; font-size: 16px; font-size: 1rem; line-height: 1.6; font-weight: 300; font-family: "Lato", Helvetica, Arial, sans-serif; } .c-menu__arrowdown { -webkit-transform: rotate(90deg); transform: rotate(90deg); width: 10px; height: 10px; margin: 0; padding: 0; } .c-menu__arrowdown--flipped { -webkit-transform: rotate(-90deg); transform: rotate(-90deg); } .c-menu__link, .c-menu__link:visited { color: #ffffff; border: none; } .c-menu__link:hover, .c-menu__link:visited:hover { color: #00c2ff; } .c-menu__links--round { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 48px; -ms-flex-pack: distribute; justify-content: space-around; } .c-menu__links--round:first-child { margin-right: 24px; } .c-menu__link-round, .c-menu__link-round:visited { margin: 6px; border: 1px solid #ffffff; text-align: center; border-radius: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -ms-flex-item-align: center; align-self: center; font-size: 14px; font-size: 0.875rem; line-height: 1; color: #ffffff; font-weight: 700; text-transform: uppercase; width: 100px; height: 100px; } @media (min-width: 81.25em) { .c-menu__link-round, .c-menu__link-round:visited { width: 180px; height: 180px; } } .c-menu__link-round:hover, .c-menu__link-round:visited:hover { border: 1px solid #1da1f2; color: #00c2ff; } .c-menu-v2 { right: 0; color: #ffffff; font-family: "Lato", Helvetica, Arial, sans-serif; font-weight: 300; padding: 24px; padding-top: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; -webkit-animation: toggleFromTop 0.3s ease-out; animation: toggleFromTop 0.3s ease-out; position: absolute; left: 0; margin: 0 auto; top: 93px; z-index: -1; max-width: 1435px; height: calc(100vh - 93px); overflow-y: scroll; } .c-menu-v2::-webkit-scrollbar { display: none; } @media (min-width: 46.25em) { .c-menu-v2 { padding: 48px 48px; height: auto; overflow: auto; } } @media (min-width: 81.25em) { .c-menu-v2 { padding: 12px 96px 48px 96px; top: 115px; } } .c-menu-v2__backdrop { position: fixed; top: 0; left: 0; width: 100%; width: 100vw; height: 100%; z-index: -2; border: 0; background: #0079cf; -webkit-animation: fadeIn 0.2s ease-out; animation: fadeIn 0.2s ease-out; } @media (min-width: 46.25em) { .c-menu-v2__section { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding-bottom: 24px; } } @media (min-width: 46.25em) { .c-menu-v2__resources { width: 25%; } } .c-menu-v2__topics .c-menu-v2__heading:before { display: none; } @media (min-width: 46.25em) { .c-menu-v2__topics { width: 60%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; padding-bottom: 24px; } .c-menu-v2__topics .c-menu-v2__list { width: 50%; } .c-menu-v2__topics .c-menu-v2__border-left { width: 50%; } .c-menu-v2__topics .c-menu-v2__border-left .c-menu-v2__list { width: 100%; } } @media (min-width: 81.25em) { .c-menu-v2__topics { padding-bottom: 24px; } } .c-menu-v2__contact { margin-top: 48px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .c-menu-v2__contact a { line-height: 0; } .c-menu-v2__contact .c-top-bar-v2__some-icon { margin-right: 12px; opacity: 1; -webkit-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out; } .c-menu-v2__contact .c-top-bar-v2__some-icon:hover { opacity: 0.8; } .c-menu-v2__contact .c-menu-v2__link { margin-left: 24px; line-height: 1; } .c-menu-v2__border-left { border-left: 5px solid #0954a7; padding-left: 24px; } .c-menu-v2__heading { font-size: 22px; font-size: 1.375rem; line-height: 40px; position: relative; margin-top: 48px; letter-spacing: normal; font-weight: bold; width: 100%; } .c-menu-v2__heading:before { display: none; content: ''; position: absolute; bottom: 0; background: rgba(155, 155, 155, 0.7); left: 0; width: 100%; height: 1px; } .c-menu-v2__heading--border-left { padding-left: 24px; border-left: 5px solid #0954a7; } .c-menu-v2__heading-bg { display: inline-block; z-index: 1; position: relative; } .c-menu-v2__list { list-style: none; margin: 0; padding: 0; padding-top: 6px; font-size: 18px; font-size: 1.125rem; line-height: 40px; } .c-menu-v2__list.rest-topics { border-left: 5px solid #0954a7; padding-left: 24px; } @media (min-width: 46.25em) { .c-menu-v2__list.rest-topics { border-left: none; } } @-webkit-keyframes toggleFromTop { 0% { -webkit-transform: translateY(-100vw); transform: translateY(-100vw); } 100% { -webkit-transform: translateY(0vw); transform: translateY(0vw); } } @keyframes toggleFromTop { 0% { -webkit-transform: translateY(-100vw); transform: translateY(-100vw); } 100% { -webkit-transform: translateY(0vw); transform: translateY(0vw); } } .c-menu-v2__clean-btn { background: none; border: none; cursor: pointer; color: #00c2ff; padding: 0; font-size: inherit; font-size: 16px; font-size: 1rem; line-height: 1.6; font-weight: 300; font-family: "Lato", Helvetica, Arial, sans-serif; } .c-menu-v2__arrowdown { -webkit-transform: rotate(90deg); transform: rotate(90deg); width: 10px; height: 10px; margin: 0; padding: 0; } .c-menu-v2__arrowdown--flipped { -webkit-transform: rotate(-90deg); transform: rotate(-90deg); } .c-menu-v2__link { font-weight: 400; color: #ffffff; font-size: 18px; line-height: 40px; border-bottom: 1px solid transparent; } .c-menu-v2__link:hover { color: inherit; } .c-menu-v2__link:visited { color: inherit; font-size: 18px; line-height: 40px; border-bottom: 1px solid transparent; } .c-menu-v2__link:visited:hover { color: inherit; } .c-menu-v2__links--round { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 48px; -ms-flex-pack: distribute; justify-content: space-around; } .c-menu-v2__links--round:first-child { margin-right: 24px; } .c-menu-v2__link-round, .c-menu-v2__link-round:visited { margin: 6px; border: 1px solid #ffffff; text-align: center; border-radius: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -ms-flex-item-align: center; align-self: center; font-size: 14px; font-size: 0.875rem; line-height: 1; color: #ffffff; font-weight: 700; text-transform: uppercase; width: 100px; height: 100px; } @media (min-width: 81.25em) { .c-menu-v2__link-round, .c-menu-v2__link-round:visited { width: 180px; height: 180px; } } .c-menu-v2__link-round:hover, .c-menu-v2__link-round:visited:hover { border: 1px solid #1da1f2; color: #00c2ff; } .c-top-bar { padding: 12px 24px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } @media (min-width: 46.25em) { .c-top-bar { padding: 48px 96px; max-width: 1570px; margin-left: auto; margin-right: auto; } } @media (min-width: 68.75em) { .c-top-bar { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } } a.c-top-bar__logo, a.c-top-bar__logo:visited { width: 50px; height: 50px; display: inline-block; border-bottom: 0; } @media (min-width: 46.25em) { a.c-top-bar__logo, a.c-top-bar__logo:visited { margin: 0; } } @media (min-width: 68.75em) { a.c-top-bar__logo, a.c-top-bar__logo:visited { width: 25%; } } a.c-top-bar__logo:hover , a.c-top-bar__logo:visited:hover { border: 0; } .c-top-bar__wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .c-top-bar__menu { color: #0079cf; list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; font-family: "Lato", Helvetica, Arial, sans-serif; margin: 9.6px 0 0 0; padding: 0; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } @media (min-width: 46.25em) { .c-top-bar__menu { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin: 0; margin-top: 6px; } } .c-top-bar__menu--active { margin-top: -6px; color: #00c2ff; } @media (min-width: 46.25em) { .c-top-bar__menu--active { position: absolute; top: 48px; right: 88px; margin-left: 120px; } } .c-top-bar__menu-item { margin-left: 12px; } @media (min-width: 46.25em) { .c-top-bar__menu-item { background: none; border: none; margin-right: 12px; padding: 6px 12px; } .c-top-bar__menu-item:last-child { margin-right: 0; } .c-top-bar__menu-item button:focus { outline: auto; } } .c-top-bar__menu-item button { letter-spacing: 0.6px; } .c-top-bar__menu-item button { border: none; background: none; margin: 0; -webkit-appearance: normal; -moz-appearance: normal; appearance: normal; outline: inherit; cursor: pointer; font-family: "Lato", Helvetica, Arial, sans-serif; font-weight: 700; color: inherit; white-space: nowrap; } @media (min-width: 46.25em) { .c-top-bar__menu-item button { padding: 0; } } .c-top-bar__menu-item--active { background: #0079cf; color: #ffffff; } .c-top-bar__menu-icon { margin-right: 12px; vertical-align: middle; } .c-top-bar-v2 { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: fixed; z-index: 10; top: 0; left: 0; right: 0; padding: 0; } .c-top-bar-v2 .logo-mobile { display: inline-block; vertical-align: top; } .c-top-bar-v2 .c-logo { display: none; } .c-top-bar-v2 .fixed-header-content { width: 100%; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 0 0 0 24px; height: 80px; } .c-top-bar-v2 .logo-white path, .c-top-bar-v2 .logo-white polygon { fill: #ffffff; } .c-top-bar-v2 .c-top-bar-v2__logo, .c-top-bar-v2 .c-top-bar-v2__logo:visited { padding-left: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (min-width: 46.25em) { .c-top-bar-v2 { margin-left: auto; margin-right: auto; padding: 11px 0 11px 24px; max-width: 1548px; } .c-top-bar-v2 .fixed-header-content { padding: 0 24px 0 0; height: 93px; -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .c-top-bar-v2 .c-search-v2 { -ms-flex-item-align: center; align-self: center; } .c-top-bar-v2 .logo-mobile { display: none; } .c-top-bar-v2 .c-top-bar-v2__logo { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 240px; height: 93px; } .c-top-bar-v2 .c-top-bar-v2__logo .c-logo { margin: 0; display: block; } } @media (min-width: 68.75em) { .c-top-bar-v2 { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .c-top-bar-v2 .fixed-header-content { height: 93px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } } @media (min-width: 81.25em) { .c-top-bar-v2 .fixed-header-content { height: 93px; } .c-top-bar-v2 .c-top-bar-v2__logo { margin-left: 0; } } .c-top-bar-v2__logo-cmi { display: none; background-color: #1e2051; height: 93px; width: 93px; -ms-flex-negative: 0; flex-shrink: 0; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-right: 24px; border: none !important; } @media (min-width: 46.25em) { .c-top-bar-v2__logo-cmi { display: -webkit-box; display: -ms-flexbox; display: flex; } } a.c-top-bar-v2__logo, a.c-top-bar-v2__logo:visited { width: 50px; height: 50px; display: inline-block; border-bottom: 0; } @media (min-width: 46.25em) { a.c-top-bar-v2__logo, a.c-top-bar-v2__logo:visited { margin: 0; } } @media (min-width: 68.75em) { a.c-top-bar-v2__logo, a.c-top-bar-v2__logo:visited { width: auto; } } a.c-top-bar-v2__logo:hover , a.c-top-bar-v2__logo:visited:hover { border: 0; } .c-top-bar-v2__wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .c-top-bar-v2__menu { color: #0079cf; list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; font-family: "Lato", Helvetica, Arial, sans-serif; padding: 0; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; margin: 0; margin-top: 0; } @media (min-width: 46.25em) { .c-top-bar-v2__menu { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin: 0; } } .c-top-bar-v2__menu--active { margin-top: -6px; color: #00c2ff; } @media (min-width: 46.25em) { .c-top-bar-v2__menu--active { position: absolute; top: 48px; right: 88px; margin-left: 120px; } } .c-top-bar-v2__menu-item { margin-left: 12px; } @media (min-width: 46.25em) { .c-top-bar-v2__menu-item { background: none; border: none; margin-right: 12px; padding: 0; } .c-top-bar-v2__menu-item:last-child { margin-right: 0; } .c-top-bar-v2__menu-item button:focus { outline: auto; } } .c-top-bar-v2__menu-item button { letter-spacing: 0.6px; } .c-top-bar-v2__menu-item button { border: none; background: none; margin: 0; -webkit-appearance: normal; -moz-appearance: normal; appearance: normal; outline: inherit; cursor: pointer; font-family: "Lato", Helvetica, Arial, sans-serif; font-weight: 700; color: inherit; white-space: nowrap; } @media (min-width: 46.25em) { .c-top-bar-v2__menu-item button { padding: 12px 12px; } .c-top-bar-v2__menu-item button.c-top-bar-v2__menu-button { margin-top: 24px; border: 2px solid #0079cf; } } @media (min-width: 68.75em) { .c-top-bar-v2__menu-item button { padding: 12px 12px; } .c-top-bar-v2__menu-item button.c-top-bar-v2__menu-button { margin-top: 0; } } .c-top-bar-v2__menu-item button.c-top-bar-v2__menu-button { height: 49px; width: 108px; color: #0079cf; -webkit-transition: background-color 0.2s ease-out, color 0.2s ease-out; transition: background-color 0.2s ease-out, color 0.2s ease-out; } .c-top-bar-v2__menu-item button.c-top-bar-v2__menu-button.c-top-bar-v2__menu-button--active { background-color: #1e2051; color: #ffffff; border-color: #1e2051; } .c-top-bar-v2__menu-item button.c-top-bar-v2__menu-button.c-top-bar-v2__menu-button--active .c-top-bar-v2__menu-icon img { width: 23px; max-width: 100%; vertical-align: top; } .c-top-bar-v2__menu-item--active { background: #0079cf; color: #ffffff; } .c-top-bar-v2__menu-icon { margin-right: 12px; margin-left: 12px; vertical-align: middle; } .headroom { bottom: 0; left: 0; right: 0; z-index: 2; } @media (min-width: 46.25em) { .headroom { display: none; } } .headroom--unfixed { position: relative; -webkit-transform: translateY(0); transform: translateY(0); } .headroom--scrolled { -webkit-transition: -webkit-transform 200ms ease-in-out; transition: -webkit-transform 200ms ease-in-out; transition: transform 200ms ease-in-out; transition: transform 200ms ease-in-out, -webkit-transform 200ms ease-in-out; } .headroom--unpinned { position: fixed; -webkit-transform: translateY(100%); transform: translateY(100%); } .headroom--pinned { position: fixed; -webkit-transform: translateY(0%); transform: translateY(0%); } .disable-headroom-pinning .headroom--unpinned { -webkit-transform: translateY(0%) !important; transform: translateY(0%) !important; } .c-boxOnImage { position: relative; color: #ffffff; font-family: "Lato", Helvetica, Arial, sans-serif; } .c-boxOnImage__body { background: #1e2051; padding: 24px; font-weight: 300; color: #ddddea; margin-right: 24px; font-size: 18px; font-size: 1.125rem; line-height: 28px; } .c-boxOnImage__body h1, .c-boxOnImage__body h2, .c-boxOnImage__body h3, .c-boxOnImage__body h4, .c-boxOnImage__body h5, .c-boxOnImage__body h6 { color: #ffffff; } @media (min-width: 46.25em) { .c-boxOnImage__body { max-width: 50%; position: absolute; top: 0; right: 0; padding: 6%; margin: -24px 0 24px 0; } } @media (min-width: 81.25em) { .c-boxOnImage__body { font-size: 17px; font-size: 1.0625rem; line-height: 28px; padding: 6%; } .c-boxOnImage__body > * { max-width: 600px; } } .c-boxOnImage__body a { color: #00c2ff; } .c-boxOnImage__body:nth-of-type(3n + 0) { background: #1e2051; } .c-boxOnImage__lead { font-size: 22px; font-size: 1.375rem; line-height: 36px; } .c-boxOnImage__link { color: #1da1f2; } .c-boxOnImage__figure { /* z-index: -10; */ margin: 0; position: relative; margin-left: 24px; margin-bottom: -96px; } .c-boxOnImage__figure > img { width: 100%; height: 50vh; -o-object-fit: cover; object-fit: cover; } @media (min-width: 46.25em) { .c-boxOnImage__figure { width: 60%; margin: 0 48px 0 0; height: 560px; } .c-boxOnImage__figure > img { width: 100%; height: 560px; -o-object-fit: cover; object-fit: cover; } } .c-boxOnImage__caption { display: inline-block; color: grey; background-color: white; position: absolute; top: 0; left: 0; margin-left: -24px; margin-bottom: 96px; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; } @media (min-width: 46.25em) { .c-boxOnImage__caption { -webkit-writing-mode: horizontal-tb; -ms-writing-mode: lr-tb; writing-mode: horizontal-tb; margin: 0 0 0 0; position: relative; padding-left: 6px; } } .c-boxOnImage--smaller { display: block; } @media (min-width: 46.25em) { .c-boxOnImage__body--smaller { position: relative; } } .c-boxOnImage__figure--smaller { display: none; } @media (min-width: 46.25em) { .c-boxOnImage__figure--smaller { right: 0; top: 24px; position: absolute; display: block; } } @supports (display: grid) { @media (min-width: 46.25em) { .c-boxOnImage { display: grid; grid-template-columns: 10% 10% 10% 10% 10% 10% 10% 10% 10%; grid-auto-rows: -webkit-min-content; grid-auto-rows: min-content; } } .c-boxOnImage__body { max-width: 100%; position: relative; grid-column: 7 / 11; grid-row: 1 / 3; grid-auto-rows: -webkit-min-content; grid-auto-rows: min-content; } @media (min-width: 46.25em) { .c-boxOnImage__body { padding: 10%; } } @media (min-width: 81.25em) { .c-boxOnImage__body { font-size: 17px; font-size: 1.0625rem; line-height: 28px; padding: 15%; } } .c-boxOnImage__body--wide { grid-column: 5 / 11; } .c-boxOnImage__figure { width: 100%; grid-column: 1 / 9; grid-row: 1 / 4; } .c-boxOnImage--smaller { display: block; } @media (min-width: 46.25em) { .c-boxOnImage--smaller { display: grid; grid-template-columns: 20% 20px 20px 400px 20px 20px 20px; grid-auto-rows: -webkit-min-content; grid-auto-rows: min-content; } } .c-boxOnImage__body--smaller { text-align: center; z-index: 9; margin-right: 0; } @media (min-width: 46.25em) { .c-boxOnImage__body--smaller { text-align: left; grid-column: 1 / 6; padding: 10%; } } .c-boxOnImage__figure--smaller { margin: 0; display: none; } @media (min-width: 46.25em) { .c-boxOnImage__figure--smaller { display: block; } } @media (min-width: 46.25em) { .c-boxOnImage__figure--smaller { grid-column: 2 / 10; grid-row: 1 / 4; } .c-boxOnImage__figure--smaller > img { height: 560px; } } } .c-lead::first-letter { color: #4a4a4a; letter-spacing: 0; text-transform: uppercase; color: #4a4a4a; font-size: 90px; font-size: 5.625rem; line-height: 1; font-weight: normal; float: left; margin: 0px 20px -10px 0; /* THESE VALUES SET TXT WRAP AROUND DROP CAP */ line-height: 1; /* THIS SETS BASELINE POSITION OF DROP CAP */ } @media (min-width: 46.25em) { .c-lead::first-letter { font-size: 108px; font-size: 6.75rem; line-height: 1; } } .c-lead-and-toc { display: -webkit-box; display: -ms-flexbox; display: flex; } .c-lead-and-toc .c-lead-and-toc__lead { -webkit-box-flex: 3; -ms-flex: 3 1 auto; flex: 3 1 auto; } .c-lead-and-toc .c-lead-and-toc__toc { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; width: 340px; margin-right: -60; } @media (max-width: 46.24em) { .c-lead-and-toc .c-lead-and-toc__toc { display: none; } } .c-linkbox-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; margin-bottom: 96px; } @media (max-width: 46.24em) { .c-linkbox-wrapper { margin: 0; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; display: block; } } .c-linkbox { margin: 5px; -webkit-transition: background-color .2s ease-out; transition: background-color .2s ease-out; } .c-linkbox svg { -webkit-transition: all .2s ease-out; transition: all .2s ease-out; } .c-linkbox:nth-child(3n) { background-color: #1da1f2; } .c-linkbox:nth-child(3n):hover { background-color: #0954a7; } .c-linkbox:nth-child(3n):hover svg { -webkit-transform: scale(1.1); transform: scale(1.1); } .c-linkbox:nth-child(3n + 1) { background-color: #0079cf; } @media (min-width: 46.25em) { .c-linkbox:nth-child(3n + 1) { margin-top: -24px; margin-bottom: 24px; } } .c-linkbox:nth-child(3n + 1):hover { background-color: #0954a7; } .c-linkbox:nth-child(3n + 1):hover svg { -webkit-transform: scale(1.1); transform: scale(1.1); } .c-linkbox:nth-child(3n + 2) { background-color: #1e2051; } .c-linkbox:nth-child(3n + 2):hover { background-color: #0954a7; } .c-linkbox:nth-child(3n + 2):hover svg { -webkit-transform: scale(1.1); transform: scale(1.1); } @media (min-width: 46.25em) { .c-linkbox { height: auto; margin: 0; } } @media (min-width: 68.75em) { .c-linkbox { width: 100%; } } .c-linkbox:nth-child(odd) .c-linkbox__content { margin: 0; } .c-linkbox__content { color: #ffffff; padding: 48px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 100%; font-weight: 300; text-align: center; } @media (min-width: 81.25em) { .c-linkbox__content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } } .c-linkbox__title { font-size: 22px; font-size: 1.375rem; line-height: 1.36364; margin-top: 0; } .c-linkbox__icon { padding: 12px; } .c-linkbox__arrow { padding: 24px; } .c-linkbox__body { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; padding: 12px; font-family: "Lato", Helvetica, Arial, sans-serif; line-height: 1.4; } .c-linkbox__body p { font-size: 18px; max-width: 450px; color: #ddddea; margin-bottom: 0; } .c-mosaic { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .c-mosaic_item { width: 100%; background-size: cover; background: #0954a7; word-break: normal; } @media (min-width: 46.25em) { .c-mosaic_item { width: 49%; margin: 0.5%; } } @media (min-width: 68.75em) { .c-mosaic_item { width: 31.33%; margin: 1%; } } @supports (display: grid) { .c-mosaic_item:nth-child(1) { display: none; } .c-mosaic { display: grid; grid-template-columns: 1fr; grid-auto-rows: minmax(100px, auto); grid-column-gap: 20px; clear: both; grid-row-gap: 5px; margin: 0 5px; } @media (min-width: 46.25em) { .c-mosaic { margin: 0; grid-row-gap: 20px; grid-template-columns: repeat(2, 1fr); grid-auto-rows: minmax(300px, auto); } } @media (min-width: 68.75em) { .c-mosaic { margin: 0; grid-template-columns: repeat(3, 1fr); } } @media (min-width: 81.25em) { .c-mosaic { margin: 0; grid-template-columns: repeat(4, 1fr); } } .c-mosaic_item { background: #ffffff; margin: 0; } @media (min-width: 46.25em) { .c-mosaic_item { margin: 0; } } @media (min-width: 68.75em) { .c-mosaic_item { margin: 0; } } .c-mosaic_item:nth-child(1) { display: grid; grid-template-columns: 1fr; background-size: cover; background-position: center; } @media (min-width: 46.25em) { .c-mosaic_item:nth-child(1) { display: grid; grid-column-gap: 20px; grid-row-gap: 20px; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; grid-row: 1 / 3; grid-column: 1 / 3; } } .c-mosaic_item:nth-child(1) .c-mosaic_item-content { grid-row: 2 / 3; grid-column: 1 / 2; } .c-mosaic_item { width: 100%; } @media (min-width: 46.25em) and (max-width: 68.74em) { .c-mosaic_item:nth-child(2):nth-last-child(1) { grid-column: 1 / 3; } .c-mosaic_item:nth-child(4):nth-last-child(1) { grid-column: 1 / 3; } .c-mosaic_item:nth-child(6):nth-last-child(1) { grid-column: 1 / 3; } .c-mosaic_item:nth-child(3):nth-last-child(6) { grid-column: 1 / 3; } .c-mosaic_item:nth-child(8):nth-last-child(1) { grid-column: 1 / 3; } .c-mosaic_item:nth-child(5):nth-last-child(6) { grid-column: 1 / 3; } .c-mosaic_item:nth-child(10):nth-last-child(1) { grid-column: 1 / 3; } .c-mosaic_item:nth-child(5):nth-last-child(6) { grid-column: 1 / 3; } .c-mosaic_item:nth-child(12):nth-last-child(1) { grid-column: 1 / 3; } } @media (min-width: 68.75em) and (max-width: 81.24em) { .c-mosaic_item:nth-child(2)nth-child(9):nth-last-child(1) { grid-row: 1 / 3; } .c-mosaic_item:nth-child(2):nth-last-child(3) { grid-row: 1 / 3; } .c-mosaic_item:nth-child(4):nth-last-child(1) { grid-column: 2 / 4; } .c-mosaic_item:nth-child(5):nth-last-child(1) { grid-column: 2 / 4; } .c-mosaic_item:nth-child(2):nth-last-child(6) { grid-row: 1 / 3; } .c-mosaic_item:nth-child(6):nth-last-child(2) { grid-column: 1 / 3; } .c-mosaic_item:nth-child(8):nth-last-child(1) { grid-column: 2 / 4; } .c-mosaic_item:nth-child(10):nth-last-child(1) { grid-row: 5 / 6; grid-column: 2 / 4; } .c-mosaic_item:nth-child(9):nth-last-child(2) { grid-row: 4 / 5; grid-column: 2 / 4; } .c-mosaic_item:nth-child(9):nth-last-child(3) { grid-row: 4 / 6; grid-column: 3 / 4; } } @media (min-width: 81.25em) { .c-mosaic_item:nth-child(2):nth-last-child(1) { grid-column: 3 / 5; grid-row: 1 / 3; } .c-mosaic_item:nth-child(2):nth-last-child(2) { grid-column: 3 / 5; } .c-mosaic_item:nth-child(3):nth-last-child(1) { grid-column: 3 / 5; } .c-mosaic_item:nth-child(4):nth-last-child(1) { grid-column: 3 / 5; } .c-mosaic_item:nth-child(2):nth-last-child(5) { grid-column: 3 / 5; } .c-mosaic_item:nth-child(4):nth-last-child(3) { grid-row: 2 / 4; } .c-mosaic_item:nth-child(5):nth-last-child(2) { grid-column: 1 / 3; } .c-mosaic_item:nth-child(5):nth-last-child(3) { grid-row: 3 / 4; grid-column: 3 / 5; } .c-mosaic_item:nth-child(4):nth-last-child(4) { grid-row: 2 / 3; grid-column: 3 / 5; } .c-mosaic_item:nth-child(8):nth-last-child(1) { grid-column: 3 / 5; } .c-mosaic_item:nth-child(9):nth-last-child(2) { grid-row: 3 / 4; grid-column: 3 / 5; } .c-mosaic_item:nth-child(10):nth-last-child(1) { grid-column: 3 / 5; } .c-mosaic_item:nth-child(5):nth-last-child(6) { grid-row: 1 / 3; grid-column: 4 / 5; } .c-mosaic_item:nth-child(5):nth-last-child(7) { grid-row: 1 / 3; grid-column: 4 / 5; } .c-mosaic_item:nth-child(11):nth-last-child(1) { grid-column: 3 / 5; } } .c-mosaic_item--single:nth-child(1) { grid-column: 1/5; } .c-mosaic_item--single:nth-child(1) + .c-mosaic_item:nth-child(2) { grid-column: 1 / 5; } @media (min-width: 68.75em) { .c-mosaic_item--single:nth-child(1) + .c-mosaic_item:nth-child(2) { grid-row: 2 / 3; grid-column: 1 / 3; } } } @supports (display: grid) { @media (min-width: 46.25em) { .c-mosaic_item:nth-child(1) .c-mosaic_item-content { background-color: #1e2051; } .c-mosaic_item:nth-child(1) .c-mosaic_item-content .c-mosaic_item-content__meta, .c-mosaic_item:nth-child(1) .c-mosaic_item-content .c-mosaic_item-title { color: #ffffff; } } } .c-mosaic_item:nth-child(4n + 1) { background-color: #0954a7; background-position: center; background-size: cover; } .c-mosaic_item:nth-child(4n + 2) { background-color: #0079cf; color: #ffffff; } .c-mosaic_item:nth-child(4n + 3) { background-color: #1e2051; color: #ffffff; } .c-mosaic_item:nth-child(4n + 4) { border: solid 1px #1e2051; background-color: #ffffff; color: #1e2051; } .c-mosaic_item-content { display: -webkit-box; display: -ms-flexbox; display: flex; height: 100%; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 24px; } .c-mosaic_item-content__meta { font-family: "Lato", Helvetica, Arial, sans-serif; font-weight: 300; text-transform: uppercase; padding-bottom: 24px; font-size: 14px; font-size: 0.875rem; line-height: 1.71429; } @media (min-width: 46.25em) { .c-mosaic_item-content__meta { font-size: 16px; font-size: 1rem; line-height: 1.5; } } .c-mosaic_item-title { -webkit-hyphens: none; -ms-hyphens: none; hyphens: none; font-weight: 400; font-size: 19.8px; font-size: 1.2375rem; line-height: 28px; } @media (min-width: 46.25em) { .c-mosaic_item-title { font-weight: 300; font-size: 22px; font-size: 1.375rem; line-height: 30.8px; } } .c-mosaic_item--backgroundImage { -webkit-box-shadow: inset 0 0 0 500px rgba(0, 0, 0, 0.2); box-shadow: inset 0 0 0 500px rgba(0, 0, 0, 0.2); -webkit-transition: -webkit-box-shadow 0.4s; transition: -webkit-box-shadow 0.4s; transition: box-shadow 0.4s; transition: box-shadow 0.4s, -webkit-box-shadow 0.4s; } .c-mosaic_item--backgroundImage-invert { -webkit-box-shadow: inset 0 0 0 500px rgba(255, 255, 255, 0.4); box-shadow: inset 0 0 0 500px rgba(255, 255, 255, 0.4); } .c-mosaic_item--backgroundImage:hover { -webkit-box-shadow: inset 0 0 0 500px rgba(0, 0, 0, 0); box-shadow: inset 0 0 0 500px rgba(0, 0, 0, 0); } a.c-mosaic_item, .c-mosaic_item-content { border-bottom: 0; -webkit-transition: all 0.1s; transition: all 0.1s; -webkit-transform-origin: center center; transform-origin: center center; will-change: transform, opacity; } a.c-mosaic_item:hover { color: white; border-bottom: 0; } @supports (display: grid) { @media (min-width: 46.25em) { .c-mosaic_item:nth-child(1):hover .c-mosaic_item-content { background-color: #242d73; } } } .c-mosaic_item:nth-child(4n + 2):hover { background-color: #0954a7; } .c-mosaic_item:nth-child(4n + 3):hover { background-color: #242d73; } .c-mosaic_item:nth-child(4n + 4):hover { background-color: #e5f1fa; color: #1e2051; border: 1px solid #1e2051; } .c-mosaic_item:nth-child(4n + 5):hover { background-color: #0954a7; } .c-mosaic_item { position: relative; } .c-mosaic_item--backgroundImage::after { content: ''; position: absolute; display: block; left: 0; bottom: 0; width: 100%; height: 100%; opacity: 0.3; } .c-newsletter { margin-bottom: 48px; margin-top: 48px; display: -webkit-box; display: -ms-flexbox; display: flex; } .c-newsletter__content { -webkit-box-flex: 10; -ms-flex-positive: 10; flex-grow: 10; background: #e5f1fa; padding: 48px 24px; } @media (min-width: 46.25em) { .c-newsletter__content { padding: 144px 48px 96px 96px; } } .c-newsletter__title-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border-bottom: 1px solid #1e2051; } .c-newsletter__title-wrapper:hover .c-newsletter__title { color: #1da1f2; } .c-newsletter__title-wrapper:hover .c-newsletter__input::-webkit-input-placeholder { color: #9b9b9b; } .c-newsletter__title-wrapper:hover .c-newsletter__input:-ms-input-placeholder { color: #9b9b9b; } .c-newsletter__title-wrapper:hover .c-newsletter__input::-ms-input-placeholder { color: #9b9b9b; } .c-newsletter__title-wrapper:hover .c-newsletter__input::placeholder { color: #9b9b9b; } .c-newsletter__title-wrapper:hover .c-newsletter__title-arrow svg path { fill: #1da1f2; } .c-newsletter__title-wrapper button { border-style: none; background: #e5f1fa; } .c-newsletter__title { color: #1e2051; margin: 0 0 12px; padding-bottom: 6px; -webkit-transition: border 0.2s ease-out; transition: border 0.2s ease-out; font-size: 22px; font-size: 1.375rem; line-height: 1.4; } @media (min-width: 46.25em) { .c-newsletter__title { padding-bottom: 12px; font-size: 60px; font-size: 3.75rem; line-height: 1.6; } } .c-newsletter__small-title { padding-left: 12px; } .c-newsletter__input { display: -webkit-box; display: -ms-flexbox; display: flex; color: #1e2051; margin: 0 0 12px; padding-bottom: 6px; -webkit-transition: border 0.2s ease-out; transition: border 0.2s ease-out; font-size: 18px; font-size: 1.125rem; line-height: 1.4; border-style: none; background: #e5f1fa; width: 100%; font-family: "Lato", Helvetica, Arial, sans-serif; padding-left: 12px; } @media (min-width: 46.25em) { .c-newsletter__input { padding-bottom: 12px; font-size: 31.33333px; font-size: 1.95833rem; line-height: 1.6; } } @media (min-width: 68.75em) { .c-newsletter__input { padding-bottom: 12px; font-size: 60px; font-size: 3.75rem; line-height: 1.6; } } ::-webkit-input-placeholder { color: #1e2051; opacity: 1; } :-ms-input-placeholder { color: #1e2051; opacity: 1; } ::-ms-input-placeholder { color: #1e2051; opacity: 1; } ::placeholder { color: #1e2051; opacity: 1; } .c-newsletter__tit
URL
GET http://www.u4.no/
Response Headers
Connection:keep-aliveContent-Length:80Content-Type:text/html; charset=utf-8Date:Sun, 21 Feb 2021 18:51:50 GMTLocation:https://www.u4.no/Server:CowboyVary:AcceptVia:1.1 vegurX-Powered-By:Express
Response Body
<p>Found. Redirecting to <a href="https://www.u4.no/">https://www.u4.no/</a></p>
Resolver
Resolver ASN
AS13335
Resolver IP
108.162.213.64
Resolver Network Name
Cloudflare, Inc.
Measurement UID
20210221185152.512756_BB_webconnectivity_4a8ba9467fe644c3
Report ID
20210221T170736Z_webconnectivity_BB_14813_n1_gVSD6QSBbcQIPPPf
Platform
windows
Software Name
ooniprobe-desktop (3.2.3)
Measurement Engine
ooniprobe-engine (3.5.2)