/* variables */ :root { /* 1250 */ } /* 480px / 16px */ /* 768px / 16px */ /* 1024px / 16px */ /* 1282px / 16px */ /* 768px / 16px */ /* 1024px / 16px */ /* 1282px / 16px */ /* 1440px / 16px */ /* SIX-4763: default print media query, use all for debug */ :root { /* Official Six Colors */ /* #DE3919 */ /* #4E4E4E */ /* #ADA398 */ /* #002C5F */ /* * The official horizon color was not applicable in a web context, there is a * darker definition in the Station colors */ /* #88C1E4 */ /* Station Colors */ /*--color-shadow: rgb(116, 116, 116); */ /* #747474 Check if rock-80 should be used */ /* #4997B7 */ /* #E94C47 */ /* #F0C04E */ /* #9E6C00 */ /* #4997b7 */ /* #5cb85c */ /* Neutral Colors */ /* TODO remove duplicates */ /* #393939 */ /* #393939 */ /* #717171 */ /* #959595 */ /* #B8B8B8 */ /* #DCDCDC */ /* #948A7F */ /* #7B7166 */ /* #F8F8F8 */ /* #FFFFFF */ /* This is an unofficial color from the existing guide line */ /* styles */ /* color(var(--color-black) a(5%)) */ /* Button in header section styles (youtube player) */ } :root { /* used for citation quotes */ /* used for */ /* used for some icons */ /* used on */ } :root { /* TODO: change to rem */ /* calc((var(--gutter-width) * 0.5) * -1); */ /* calc((var(--gutter-width) * 0.5)); */ } :root { /* 65/16 */ /* 60/16 */ /*--navbar-hamburger-size: 4.000rem;*/ /* Very strange behaviour with exact pixel sizes */ /* Very strange behaviour with exact pixel sizes */ } /* vendor */ /*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */ /* Document ========================================================================== */ /** * 1. Change the default font family in all browsers (opinionated). * 2. Correct the line height in all browsers. * 3. Prevent adjustments of font size after orientation changes in * IE on Windows Phone and in iOS. */ html { font-family: sans-serif; /* 1 */ line-height: 1.15; /* 2 */ -ms-text-size-adjust: 100%; /* 3 */ -webkit-text-size-adjust: 100%; /* 3 */ } /* 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. */ /* NOTE: Not needed as only IE11 has to be mantained */ figure { margin: 0; } /** * 1. Add the correct box sizing in Firefox. * 2. Show the overflow in Edge and IE. */ hr { 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 */ } /** * Remove the outline on focused links when they are also active or hovered * in all browsers (opinionated). */ a:active, a:hover { outline-width: 0; } /** * 1. Remove the bottom border in 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"], /* 1 */ [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; } /** * Change the border, margin, and padding in all browsers (opinionated). */ fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } /** * 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 { 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"] { 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, /* 1 */ 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; } .choices { font-size: 1rem; margin-bottom: 1rem; position: relative; } .choices:focus { outline: none; } .choices:last-child { margin-bottom: 0; } .choices.is-disabled .choices__inner, .choices.is-disabled .choices__input { background-color: #eaeaea; cursor: not-allowed; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .choices.is-disabled .choices__item { cursor: not-allowed; } .choices[data-type*=select-one] { cursor: pointer; } .choices[data-type*=select-one] .choices__inner { padding-bottom: 7.5px; } .choices[data-type*=select-one] .choices__input { display: block; width: 100%; padding: 10px; border-bottom: 1px solid #ddd; background-color: #fff; margin: 0; } .choices[data-type*=select-one] .choices__button { border-radius: 10em; background-image: url(data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%20standalone%3D%22no%22%3F%3E%0A%3Csvg%20width%3D%2211px%22%20height%3D%2211px%22%20viewBox%3D%22147%200%2011%2011%22%20version%3D%221.1%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%3E%0A%20%20%20%20%3Cg%20id%3D%22cross%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%20transform%3D%22translate%28147.750000%2C%200.750000%29%22%3E%0A%20%20%20%20%20%20%20%20%3Cpolygon%20id%3D%22Shape%22%20fill%3D%22%234997B7%22%20points%3D%229.5%200.558885621%208.94926389%200.00936029412%204.75%204.20061438%200.550720588%200.00936029412%200%200.558885621%204.19927941%204.75017075%200%208.9411299%200.550720588%209.49063971%204.75%205.29968056%208.94926389%209.49063971%209.5%208.9411299%205.30042565%204.75017075%22%3E%3C/polygon%3E%0A%20%20%20%20%3C/g%3E%0A%3C/svg%3E%0A); background-size: 8px; position: absolute; top: 50%; right: 0; margin-top: -10px; margin-right: 25px; height: 20px; width: 20px; opacity: .5; padding: 0; } .choices[data-type*=select-one] .choices__button:focus, .choices[data-type*=select-one] .choices__button:hover { opacity: 1; } .choices[data-type*=select-one] .choices__button:focus { box-shadow: 0 0 0 2px #00bcd4; } .choices[data-type*=select-one]:after { content: ""; height: 0; width: 0; border-style: solid; border-color: #333 transparent transparent transparent; border-width: 5px; position: absolute; right: 11.5px; top: 50%; margin-top: -2.5px; pointer-events: none; } .choices[data-type*=select-one].is-open:after { border-color: transparent transparent #333 transparent; margin-top: -7.5px; } .choices[data-type*=select-one][dir=rtl]:after { left: 11.5px; right: auto; } .choices[data-type*=select-one][dir=rtl] .choices__button { right: auto; left: 0; margin-left: 25px; margin-right: 0; } .choices[data-type*=select-multiple] .choices__inner, .choices[data-type*=text] .choices__inner { cursor: text; } .choices[data-type*=select-multiple] .choices__button, .choices[data-type*=text] .choices__button { position: relative; display: inline-block; margin: 0 -4px 0 8px; padding-left: 16px; border-left: 1px solid #008fa1; background-size: 8px; width: 8px; line-height: 1; opacity: .75; border-radius: 0; } .choices[data-type*=select-multiple] .choices__button:focus, .choices[data-type*=select-multiple] .choices__button:hover, .choices[data-type*=text] .choices__button:focus, .choices[data-type*=text] .choices__button:hover { opacity: 1; } .choices__inner { display: inline-block; vertical-align: top; width: 100%; background-color: #f9f9f9; padding: 7.5px 7.5px 3.75px; border: 1px solid #ddd; border-radius: 2.5px; font-size: 14px; min-height: 44px; overflow: hidden; } .is-focused .choices__inner, .is-open .choices__inner { border-color: #b7b7b7; } .is-open .choices__inner { border-radius: 2.5px 2.5px 0 0; } .is-flipped.is-open .choices__inner { border-radius: 0 0 2.5px 2.5px; } .choices__list { margin: 0; padding-left: 0; list-style: none; } .choices__list--single { display: inline-block; padding: 4px 16px 4px 4px; width: 100%; } [dir=rtl] .choices__list--single { padding-right: 4px; padding-left: 16px; } .choices__list--single .choices__item { width: 100%; } .choices__list--multiple { display: inline; } .choices__list--multiple .choices__item { display: inline-block; vertical-align: middle; border-radius: 20px; padding: 4px 10px; font-size: 12px; font-weight: 500; margin-right: 3.75px; margin-bottom: 3.75px; background-color: #00bcd4; border: 1px solid #00a5bb; color: #fff; word-break: break-all; } .choices__list--multiple .choices__item[data-deletable] { padding-right: 5px; } [dir=rtl] .choices__list--multiple .choices__item { margin-right: 0; margin-left: 3.75px; } .choices__list--multiple .choices__item.is-highlighted { background-color: #00a5bb; border: 1px solid #008fa1; } .is-disabled .choices__list--multiple .choices__item { background-color: #aaa; border: 1px solid #919191; } .choices__list--dropdown { display: none; z-index: 1; position: absolute; width: 100%; background-color: #fff; border: 1px solid #ddd; top: 100%; margin-top: -1px; border-bottom-left-radius: 2.5px; border-bottom-right-radius: 2.5px; overflow: hidden; word-break: break-all; } .choices__list--dropdown.is-active { display: block; } .is-open .choices__list--dropdown { border-color: #b7b7b7; } .is-flipped .choices__list--dropdown { top: auto; bottom: 100%; margin-top: 0; margin-bottom: -1px; border-radius: .25rem .25rem 0 0; } .choices__list--dropdown .choices__list { position: relative; max-height: 300px; overflow: auto; -webkit-overflow-scrolling: touch; will-change: scroll-position; } .choices__list--dropdown .choices__item { position: relative; padding: 10px; font-size: 14px; } [dir=rtl] .choices__list--dropdown .choices__item { text-align: right; } @media (min-width:640px) { .choices__list--dropdown .choices__item--selectable { padding-right: 100px; } .choices__list--dropdown .choices__item--selectable:after { content: attr(data-select-text); font-size: 12px; opacity: 0; position: absolute; right: 10px; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } [dir=rtl] .choices__list--dropdown .choices__item--selectable { text-align: right; padding-left: 100px; padding-right: 10px; } [dir=rtl] .choices__list--dropdown .choices__item--selectable:after { right: auto; left: 10px; } } .choices__list--dropdown .choices__item--selectable.is-highlighted { background-color: #f2f2f2; } .choices__list--dropdown .choices__item--selectable.is-highlighted:after { opacity: .5; } .choices__item { cursor: default; } .choices__item--selectable { cursor: pointer; } .choices__item--disabled { cursor: not-allowed; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; opacity: .5; } .choices__heading { font-weight: 600; font-size: 12px; padding: 10px; border-bottom: 1px solid #f7f7f7; color: gray; } .choices__button { text-indent: -9999px; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 0; background-color: transparent; background-repeat: no-repeat; background-position: center; cursor: pointer; } .choices__button:focus { outline: none; } .choices__input { display: inline-block; vertical-align: baseline; background-color: #f9f9f9; font-size: 14px; margin-bottom: 5px; border: 0; border-radius: 0; max-width: 100%; padding: 4px 0 4px 2px; } .choices__input:focus { outline: 0; } [dir=rtl] .choices__input { padding-right: 2px; padding-left: 0; } .choices__placeholder { opacity: .5; } .choices[data-type*=select-multiple] .choices__input.is-hidden, .choices[data-type*=select-one] .choices__input.is-hidden, .choices__input.is-hidden { display: none; } /* SIX overwrite */ [type="text"].choices__input, [type="text"].choices__input:focus { background: none; border: none; display: inline-block; height: auto; margin-bottom: 0; padding: 0; } .choices__inner { -moz-appearance: none; appearance: none; background-color: rgb(255, 255, 255); border-radius: 0; border: 1px solid rgb(220, 220, 220); box-sizing: border-box; color: rgb(57, 57, 57); display: block; font-size: 1rem; width: 100%; padding: .425rem 1.25rem; -webkit-transition: background-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), border-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: background-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), border-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); -webkit-appearance: none; } .choices__placeholder { opacity: 1; } .choices__input::-webkit-input-placeholder { color: rgb(149, 149, 149); } .choices__input::-moz-placeholder { color: rgb(149, 149, 149); } .choices__input:-ms-input-placeholder { color: rgb(149, 149, 149); } .choices__input::placeholder { color: rgb(149, 149, 149); } .choices__list--multiple { display: inline-block } .choices__list--multiple .choices__item { background-color: #fff; border: 1px solid #4997b7; border-radius: 0; color: #4997b7; font-size: 12px; font-weight: 500; margin-right: 4px; margin-bottom: 0; padding: 3px 10px } .choices__list--multiple .choices__item:last-child { margin-right: 1em; } .choices__list--multiple .choices__item.is-highlighted { background-color: #fff; border: 1px solid #4997b7; } .choices[data-type*=select-multiple] .choices__button, .choices[data-type*=text] .choices__button { background-image: url(data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%20standalone%3D%22no%22%3F%3E%0A%3Csvg%20width%3D%2211px%22%20height%3D%2211px%22%20viewBox%3D%22147%200%2011%2011%22%20version%3D%221.1%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%3E%0A%20%20%20%20%3Cg%20id%3D%22cross%22%20stroke%3D%22none%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%20transform%3D%22translate%28147.750000%2C%200.750000%29%22%3E%0A%20%20%20%20%20%20%20%20%3Cpolygon%20id%3D%22Shape%22%20fill%3D%22%234997B7%22%20points%3D%229.5%200.558885621%208.94926389%200.00936029412%204.75%204.20061438%200.550720588%200.00936029412%200%200.558885621%204.19927941%204.75017075%200%208.9411299%200.550720588%209.49063971%204.75%205.29968056%208.94926389%209.49063971%209.5%208.9411299%205.30042565%204.75017075%22%3E%3C/polygon%3E%0A%20%20%20%20%3C/g%3E%0A%3C/svg%3E%0A); background-size: 11px; border-left: none; padding-left: 20px; top: -1px; } .choices__list--dropdown { border-bottom-left-radius: 0; border-bottom-right-radius: 0 } .choices__list--dropdown .choices__item { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-size: 1rem; padding: .5em 1.438em; } .choices__list--dropdown .choices__item--selectable.is-highlighted { background-color: #4288a5; color: #fff; } .is-open .choices__inner { border-radius: 0; } /* SaaS */ .search-input-wrapper .choices { -webkit-box-flex: 1; flex-grow: 1; margin-bottom: 0; } .search-input-wrapper .choices__inner { padding-bottom: 0; padding-top: 0; } .search-input-wrapper .choices__list.choices__list--multiple { display: none; } /* Autocomplete search field */ .choices__input.choices__input--cloned { font-weight: 700; font-size: 1.27rem; min-width: 100%; } .choices__input.choices__input--cloned::-ms-clear { display: none; } [type="text"].choices__input.choices__input--cloned, [type="text"].choices__input.choices__input--cloned:focus { height: 42px; line-height: 44px; } [type="text"].choices__input.is-hidden { display: none; } .choices__list--dropdown { z-index: 11; } /* .search-form .choices__list.choices__list--dropdown { display: none; } */ .paragraph_title.numberOfResults { margin: 2rem 0; } /* header */ .search-wrapper .choices__inner { border: none; height: auto; padding-left: 0; } .search-wrapper .btn .fa { margin-right: 0; } @media (min-width: 48em) { .search-wrapper [type="text"].choices__input.choices__input--cloned { height: 3.25rem; padding-left: 1rem; } } @media (min-width: 64em) { .search-wrapper [type="text"].choices__input.choices__input--cloned { font-size: 1.5rem; } } /* Custom Colors */ .highcharts-color-0 { fill: #88c1e4; stroke: #88c1e4; } .highcharts-color-1 { fill: #4e4e4e; stroke: #4e4e4e; } .highcharts-color-2 { fill: #ada398; stroke: #ada398; } .highcharts-color-3 { fill: #acd4ec; stroke: #acd4ec; } .highcharts-color-4 { fill: #7a7a7a; stroke: #7a7a7a; } .highcharts-color-5 { fill: #d6d1cc; stroke: #d6d1cc; } .highcharts-color-6 { fill: #de3919; stroke: #de3919; } .highcharts-container { position: relative; overflow: hidden; width: 100%; height: 100%; text-align: left; line-height: normal; z-index: 0; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); font-size: 0.75rem; } .highcharts-root text { stroke-width: 0; } .highcharts-strong { font-weight: bold; } .highcharts-emphasized { font-style: italic; } .highcharts-anchor { cursor: pointer; } .highcharts-background { fill: #ffffff; } .highcharts-plot-border, .highcharts-plot-background { fill: none; } .highcharts-label-box { fill: none; } .highcharts-button-box { fill: inherit; } .highcharts-tracker-line { stroke-linejoin: round; stroke: rgba(192, 192, 192, 0.0001); stroke-width: 22; fill: none; } .highcharts-tracker-area { fill: rgba(192, 192, 192, 0.0001); stroke-width: 0; } /* Titles */ .highcharts-title { fill: #616161; font-size: 1.5em; } .highcharts-subtitle { fill: #888; } /* Axes */ .highcharts-axis-line { fill: none; stroke: #ccd5df; } .highcharts-yaxis .highcharts-axis-line { stroke-width: 0; } .highcharts-axis-title { fill: #888; } .highcharts-axis-labels { fill: #888; cursor: default; font-size: 0.9em; } .highcharts-grid-line { fill: none; stroke: #ebebeb; } .highcharts-xaxis-grid .highcharts-grid-line { stroke-width: 0; } .highcharts-tick { stroke: #ccd5df; } .highcharts-yaxis .highcharts-tick { stroke-width: 0; } .highcharts-minor-grid-line { stroke: #f5f5f5; } .highcharts-crosshair-thin { stroke-width: 1px; stroke: #d7d7d7; } .highcharts-crosshair-category { stroke: #ccd5df; stroke-opacity: 0.25; } /* Credits */ .highcharts-credits { cursor: pointer; fill: #b0b0b0; font-size: 0.7em; -webkit-transition: fill 250ms, font-size 250ms; transition: fill 250ms, font-size 250ms; } .highcharts-credits:hover { font-size: 1em; } /* Tooltip */ .highcharts-tooltip { cursor: default; pointer-events: none; white-space: nowrap; -webkit-transition: stroke 150ms; transition: stroke 150ms; font-size: 1.1em; stroke: #ebebeb; } /* Remove Shadow of tooltip */ .highcharts-tooltip-0 { -webkit-filter: none !important; filter: none !important; } .highcharts-tooltip text { fill: #616161; } .highcharts-tooltip .highcharts-header { font-size: 0.9em; font-weight: bold; } .highcharts-tooltip-box, .highcharts-tooltip-box.highcharts-label-box { stroke-width: 1px; fill: rgb(255, 255, 255); fill-opacity: 1; } .highcharts-selection-marker { fill: #33567f; fill-opacity: 0.25; } .highcharts-graph { fill: none; stroke-width: 2px; stroke-linecap: round; stroke-linejoin: round; } .highcharts-state-hover .highcharts-graph { stroke-width: 3; } .highcharts-state-hover path { -webkit-transition: stroke-width 50; transition: stroke-width 50; /* quick in */ } .highcharts-state-normal path { -webkit-transition: stroke-width 250ms; transition: stroke-width 250ms; /* slow out */ } /* Legend hover affects points and series */ g.highcharts-series, .highcharts-point, .highcharts-markers, .highcharts-data-labels { -webkit-transition: opacity 250ms; transition: opacity 250ms; } .highcharts-legend-series-active g.highcharts-series:not(.highcharts-series-hover), .highcharts-legend-point-active .highcharts-point:not(.highcharts-point-hover), .highcharts-legend-series-active .highcharts-markers:not(.highcharts-series-hover), .highcharts-legend-series-active .highcharts-data-labels:not(.highcharts-series-hover) { opacity: 0.2; } .highcharts-area { fill: rgb(136, 193, 228); fill-opacity: 0.5; stroke-width: 0 } .highcharts-color-0 .highcharts-area { fill-opacity: 1; fill: url(#highchart-gradient-0) } .highcharts-color-1 .highcharts-area { fill-opacity: 1; fill: url(#highchart-gradient-1) } .highcharts-color-2 .highcharts-area { fill-opacity: 1; fill: url(#highchart-gradient-2) } /* * This are the gradient definitions, the ID should mirror the configuration in * the chart.js Highcharts.theme.defs */ #highchart-gradient-0 stop, #highchart-gradient-1 stop, #highchart-gradient-2 stop { stop-color: rgb(136, 193, 228) } #highchart-gradient-0 stop[offset="0"], #highchart-gradient-1 stop[offset="0"], #highchart-gradient-2 stop[offset="0"] { stop-opacity: 0.66; } #highchart-gradient-0 stop[offset="1"], #highchart-gradient-1 stop[offset="1"], #highchart-gradient-2 stop[offset="1"] { stop-opacity: 0; /* * Make sure the fadeout will be multiplied with white, otherwise there * could be miscalculations in Safari */ stop-color: #FFF; } #highchart-gradient-1 stop { stop-color: rgb(78, 78, 78); } #highchart-gradient-2 stop { stop-color: rgb(173, 163, 152); } .highcharts-markers { stroke-width: 1px; stroke: rgb(255, 255, 255); } .highcharts-point { stroke-width: 1px; } .highcharts-dense-data .highcharts-point { stroke-width: 0; } .highcharts-data-label { font-size: 0.9em; font-weight: bold; } .highcharts-data-label-box { fill: none; stroke-width: 0; } .highcharts-data-label text { fill: #616161; } .highcharts-data-label-connector { fill: none; } .highcharts-halo { fill-opacity: 0.25; stroke-width: 0; } .highcharts-series:not(.highcharts-pie-series) .highcharts-point-select, .highcharts-markers .highcharts-point-select { fill: #d7d7d7; stroke: rgb(57, 57, 57); } .highcharts-column-series rect.highcharts-point { stroke: rgb(255, 255, 255); } .highcharts-column-series .highcharts-point { -webkit-transition: fill-opacity 250ms; transition: fill-opacity 250ms; } .highcharts-column-series .highcharts-point-hover { fill-opacity: 0.75; -webkit-transition: fill-opacity 50ms; transition: fill-opacity 50ms; } .highcharts-pie-series .highcharts-point { stroke-linejoin: round; stroke: rgb(255, 255, 255); } .highcharts-pie-series .highcharts-point-hover { fill-opacity: 0.75; -webkit-transition: fill-opacity 50ms; transition: fill-opacity 50ms; } .highcharts-funnel-series .highcharts-point { stroke-linejoin: round; stroke: rgb(255, 255, 255); } .highcharts-funnel-series .highcharts-point-hover { fill-opacity: 0.75; -webkit-transition: fill-opacity 50ms; transition: fill-opacity 50ms; } .highcharts-funnel-series .highcharts-point-select { fill: inherit; stroke: inherit; } .highcharts-pyramid-series .highcharts-point { stroke-linejoin: round; stroke: #ffffff; } .highcharts-pyramid-series .highcharts-point-hover { fill-opacity: 0.75; -webkit-transition: fill-opacity 50ms; transition: fill-opacity 50ms; } .highcharts-pyramid-series .highcharts-point-select { fill: inherit; stroke: inherit; } .highcharts-solidgauge-series .highcharts-point { stroke-width: 0; } .highcharts-treemap-series .highcharts-point { stroke-width: 1px; stroke: #e6e6e6; -webkit-transition: stroke 250ms, fill 250ms, fill-opacity 250ms; transition: stroke 250ms, fill 250ms, fill-opacity 250ms; } .highcharts-treemap-series .highcharts-point-hover { stroke: #999999; -webkit-transition: stroke 25ms, fill 25ms, fill-opacity 25ms; transition: stroke 25ms, fill 25ms, fill-opacity 25ms; } .highcharts-treemap-series .highcharts-above-level { display: none; } .highcharts-treemap-series .highcharts-internal-node { fill: none; } .highcharts-treemap-series .highcharts-internal-node-interactive { fill-opacity: 0.15; cursor: pointer; } .highcharts-treemap-series .highcharts-internal-node-interactive:hover { fill-opacity: 0.75; } /* Legend */ .highcharts-legend-box { fill: none; stroke-width: 0; } .highcharts-legend-item > text { fill: #333333; font-weight: bold; font-size: 1em; cursor: pointer; stroke-width: 0; } .highcharts-legend-item:hover text { fill: #000000; } .highcharts-legend-item-hidden * { fill: #d7d7d7 !important; stroke: #d7d7d7 !important; -webkit-transition: fill 250ms; transition: fill 250ms; } .highcharts-legend-nav-active { fill: rgb(0, 44, 95); cursor: pointer; } .highcharts-legend-nav-inactive { fill: #cccccc; } circle.highcharts-legend-nav-active, circle.highcharts-legend-nav-inactive { /* tracker */ fill: rgba(192, 192, 192, 0.0001); } .highcharts-legend-title-box { fill: none; stroke-width: 0; } /* Bubble legend */ .highcharts-bubble-legend-symbol { stroke-width: 2; fill-opacity: 0.5; } .highcharts-bubble-legend-connectors { stroke-width: 1; } .highcharts-bubble-legend-labels { fill: #333333; } /* Loading */ .highcharts-loading { position: absolute; background-color: #ffffff; opacity: 0.5; text-align: center; z-index: 10; -webkit-transition: opacity 250ms; transition: opacity 250ms; } .highcharts-loading-hidden { height: 0 !important; opacity: 0; overflow: hidden; -webkit-transition: opacity 250ms, height 250ms step-end; transition: opacity 250ms, height 250ms step-end; } .highcharts-loading-inner { font-weight: bold; position: relative; top: 45%; } /* Plot bands and polar pane backgrounds */ .highcharts-plot-band, .highcharts-pane { fill: #000000; fill-opacity: 0.05; } .highcharts-plot-line { fill: none; stroke: #999999; stroke-width: 1px; } /* Highcharts More and modules */ .highcharts-boxplot-box { fill: #ffffff; } .highcharts-boxplot-median { stroke-width: 2px; } .highcharts-bubble-series .highcharts-point { fill-opacity: 0.5; } .highcharts-errorbar-series .highcharts-point { stroke: #000000; } .highcharts-gauge-series .highcharts-data-label-box { stroke: #cccccc; stroke-width: 1px; } .highcharts-gauge-series .highcharts-dial { fill: #000000; stroke-width: 0; } .highcharts-polygon-series .highcharts-graph { fill: inherit; stroke-width: 0; } .highcharts-waterfall-series .highcharts-graph { stroke: #333333; stroke-dasharray: 1, 3; } .highcharts-sankey-series .highcharts-point { stroke-width: 0; } .highcharts-sankey-series .highcharts-link { -webkit-transition: fill 250ms, fill-opacity 250ms; transition: fill 250ms, fill-opacity 250ms; fill-opacity: 0.5; } .highcharts-sankey-series .highcharts-point-hover.highcharts-link { -webkit-transition: fill 50ms, fill-opacity 50ms; transition: fill 50ms, fill-opacity 50ms; fill-opacity: 1; } .highcharts-venn-series .highcharts-point { fill-opacity: 0.75; stroke: #cccccc; -webkit-transition: stroke 250ms, fill-opacity 250ms; transition: stroke 250ms, fill-opacity 250ms; } .highcharts-venn-series .highcharts-point-hover { fill-opacity: 1; stroke: #cccccc; } /* Highstock */ .highcharts-navigator-mask-outside { fill-opacity: 0; } .highcharts-navigator-mask-inside { fill: #66809f; /* navigator.maskFill option */ fill-opacity: 0.25; cursor: ew-resize; } .highcharts-navigator-outline { stroke: #cccccc; fill: none; } .highcharts-navigator-handle { stroke: #cccccc; fill: #f2f2f2; cursor: ew-resize; } .highcharts-navigator-series .highcharts-graph { stroke-width: 1px; stroke: #33567f; } .highcharts-navigator-series .highcharts-area { fill: transparent; fill-opacity: 0.05; } .highcharts-navigator-xaxis .highcharts-axis-line { stroke-width: 0; } .highcharts-navigator-xaxis .highcharts-grid-line { stroke-width: 1px; stroke: #e6e6e6; } .highcharts-navigator-xaxis.highcharts-axis-labels { fill: #999999; } .highcharts-navigator-yaxis .highcharts-grid-line { stroke-width: 0; } .highcharts-scrollbar-thumb { fill: #cccccc; stroke: #cccccc; stroke-width: 1px; } .highcharts-scrollbar-button { fill: #e6e6e6; stroke: #cccccc; stroke-width: 1px; } .highcharts-scrollbar-arrow { fill: #666666; } .highcharts-scrollbar-rifles { stroke: #666666; stroke-width: 1px; } .highcharts-scrollbar-track { fill: #f2f2f2; stroke: #f2f2f2; stroke-width: 1px; } .highcharts-button { fill: #f7f7f7; stroke: #cccccc; cursor: default; stroke-width: 1px; -webkit-transition: fill 250ms; transition: fill 250ms; } .highcharts-button text { fill: #333333; } .highcharts-button-hover { -webkit-transition: fill 0ms; transition: fill 0ms; fill: #e6e6e6; stroke: #cccccc; } .highcharts-button-hover text { fill: #333333; } .highcharts-button-pressed { font-weight: bold; fill: #e6ebf5; stroke: #cccccc; } .highcharts-button-pressed text { fill: #333333; font-weight: bold; } .highcharts-button-disabled text { fill: #333333; } .highcharts-range-selector-buttons .highcharts-button { stroke-width: 0px; } .highcharts-range-label rect { fill: none; } .highcharts-range-label text { fill: #666666; } .highcharts-range-input rect { fill: none; } .highcharts-range-input text { fill: #333333; } .highcharts-range-input { stroke-width: 1px; stroke: #cccccc; } input.highcharts-range-selector { position: absolute; border: 0; width: 1px; /* Chrome needs a pixel to see it */ height: 1px; padding: 0; text-align: center; left: -9em; /* #4798 */ } .highcharts-crosshair-label text { fill: #ffffff; font-size: 1.1em; } .highcharts-crosshair-label .highcharts-label-box { fill: inherit; } .highcharts-candlestick-series .highcharts-point { stroke: #000000; stroke-width: 1px; } .highcharts-candlestick-series .highcharts-point-up { fill: #ffffff; } .highcharts-ohlc-series .highcharts-point-hover { stroke-width: 3px; } .highcharts-flags-series .highcharts-point .highcharts-label-box { stroke: #999999; fill: #ffffff; -webkit-transition: fill 250ms; transition: fill 250ms; } .highcharts-flags-series .highcharts-point-hover .highcharts-label-box { stroke: #000000; fill: #ccd6eb; } .highcharts-flags-series .highcharts-point text { fill: #000000; font-size: 0.9em; font-weight: bold; } /* Highmaps */ .highcharts-map-series .highcharts-point { -webkit-transition: fill 500ms, fill-opacity 500ms, stroke-width 250ms; transition: fill 500ms, fill-opacity 500ms, stroke-width 250ms; stroke: #cccccc; } .highcharts-map-series .highcharts-point-hover { -webkit-transition: fill 0ms, fill-opacity 0ms; transition: fill 0ms, fill-opacity 0ms; fill-opacity: 0.5; stroke-width: 2px; } .highcharts-mapline-series .highcharts-point { fill: none; } .highcharts-heatmap-series .highcharts-point { stroke-width: 0; } .highcharts-map-navigation { font-size: 1.3em; font-weight: bold; text-align: center; } .highcharts-coloraxis { stroke-width: 0; } .highcharts-coloraxis-marker { fill: #999999; } .highcharts-null-point { fill: #f7f7f7; } /* 3d charts */ .highcharts-3d-frame { fill: transparent; } /* Exporting module */ .highcharts-contextbutton { fill: #ffffff; /* needed to capture hover */ stroke: none; stroke-linecap: round; } .highcharts-contextbutton:hover { fill: #e6e6e6; stroke: #e6e6e6; } .highcharts-button-symbol { stroke: #666666; stroke-width: 3px; } .highcharts-menu { border: 1px solid #999999; background: #ffffff; padding: 5px 0; box-shadow: 3px 3px 10px #888; } .highcharts-menu-item { padding: 0.5em 1em; background: none; color: #333333; cursor: pointer; -webkit-transition: background 250ms, color 250ms; transition: background 250ms, color 250ms; } .highcharts-menu-item:hover { background: #33567f; color: rgb(255, 255, 255); } /* Drilldown module */ .highcharts-drilldown-point { cursor: pointer; } .highcharts-drilldown-data-label text, text.highcharts-drilldown-data-label, .highcharts-drilldown-axis-label { cursor: pointer; fill: rgb(0, 44, 95); font-weight: bold; text-decoration: underline; } /* No-data module */ .highcharts-no-data text { font-weight: bold; font-size: 12px; fill: #666666; } /* Drag-panes module */ .highcharts-axis-resizer { cursor: ns-resize; stroke: black; stroke-width: 2px; } /* Bullet type series */ .highcharts-bullet-target { stroke-width: 0; } /* Lineargauge type series */ .highcharts-lineargauge-target { stroke-width: 1px; stroke: #333333; } .highcharts-lineargauge-target-line { stroke-width: 1px; stroke: #333333; } /* Annotations module */ .highcharts-annotation-label-box { stroke-width: 1px; stroke: #000000; fill: #000000; fill-opacity: 0.75; } .highcharts-annotation-label text { fill: #e6e6e6; } /* Gantt */ .highcharts-treegrid-node-collapsed, .highcharts-treegrid-node-expanded { cursor: pointer; } .highcharts-point-connecting-path { fill: none; } .highcharts-grid-axis .highcharts-tick { stroke-width: 1px; } .highcharts-grid-axis .highcharts-axis-line { stroke-width: 1px; } /* elements */ @-ms-viewport { width: device-width; } html { box-sizing: border-box; font-size: 16px; -ms-overflow-style: scrollbar; -webkit-tap-highlight-color: rgba(0,0,0,0); } html, body { width: 100%; height: 100%; } *, *::before, *::after { box-sizing: inherit; content: none; } body { background-color: rgb(255, 255, 255); color: rgb(113, 113, 113); font-family: "Noto Sans", Helvetica, Arial, sans-serif; font-size: 1rem; line-height: 1.64; -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -ms-font-smoothing: antialiased; -o-font-smoothing: antialiased; font-smoothing: antialiased; -webkit-text-rendering: optimizeLegibility; -moz-text-rendering: optimizeLegibility; -ms-text-rendering: optimizeLegibility; -o-text-rendering: optimizeLegibility; text-rendering: optimizeLegibility; -moz-osx-font-smoothing : grayscale; -webkit-text-size-adjust : none; text-size-adjust : none; } #js { position: relative; } hr { border: 0; border-bottom: 1px solid rgb(220, 220, 220); margin: 1rem 0; overflow: hidden; background: transparent } hr::after { content: ""; display: table; clear: both; } img { max-width: 100%; height: auto; } a, area, button, [role="button"], input, label, select, summary, textarea { touch-action: manipulation; } /* TODO: Check if also the six hide should be added */ /*[data-six-hide],*/ [hidden], .hidden { display: none !important; } body { -webkit-overflow-scrolling: touch; } html.no-scroll, html.no-scroll body { overflow: hidden !important; position: relative; /* fix ios overflow issue */ } @media (max-width: 63.999em) { html.no-scroll, html.no-scroll body { height: 100%; height: 100vh; } } .sr-only, /* TODO: remove .sr-only and use .screensreader */ .screenreader, .btn.btn-icon-only .screenreader { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .screenreader.focusable:active, .screenreader.focusable:focus, .btn .screenreader { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } .clearfix::after { content: ""; display: table; clear: both; } .align-left { text-align: left; } /* SIX-4268: center only if not mobile */ @media (min-width: 30em) { .align-center { text-align: center; } } .align-right { text-align: right; } .only-print { display: none!important; } @media print { html, body { font-size: 11pt; height: auto; overflow: visible !important; width: auto; } body { padding-bottom: 4rem; } *:hover { box-shadow: none; } .only-screen { display: none!important; } .only-print { display: block!important; } .print-container { margin: 8%; } } /*! SIX Pictogram 2.0.0 copyright 2019 */ @font-face { font-family: "SIX-pictogram"; font-style: normal; font-weight: 400; font-display: swap; src: url("build/fonts/pictogram/SIX-pictogram.eot?6bb47268904df7ad"); src: url("build/fonts/pictogram/SIX-pictogram.eot?6bb47268904df7ad") format("embedded-opentype"), url("build/fonts/pictogram/SIX-pictogram.woff2?ec9f41a0c85afd96") format("woff2"), url("build/fonts/pictogram/SIX-pictogram.woff?6c10efccacaa4bff") format("woff"), url("build/fonts/pictogram/SIX-pictogram.ttf?d2607bc77d30868c") format("truetype"), url("build/fonts/pictogram/SIX-pictogram.svg?d0a3e8162583bdc4") format("svg"); } .sp, .fa[class*=" sp-"] { display: inline-block; font-family: "SIX-pictogram"; font-weight: 400; font-style: normal; -webkit-font-feature-settings: normal; font-feature-settings: normal; font-variant: normal; line-height: 1; text-rendering: auto; -webkit-transform: translate(0, 0); transform: translate(0, 0); -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; } .sp-lg { vertical-align: -15%; line-height: 0.75em; font-size: 1.33333333em; } .sp-2x { font-size: 2em; } .sp-3x { font-size: 3em; } .sp-4x { font-size: 4em; } .sp-5x { font-size: 5em; } .sp-fw { width: 1.28571429em; text-align: center; } .sp-agile::before { content: "\ea01"; } .sp-agile-o::before { content: "\ea02"; } .sp-agile-s::before { content: "\ea03"; } .sp-ai::before { content: "\ea04"; } .sp-ai-o::before { content: "\ea05"; } .sp-ai-s::before { content: "\ea06"; } .sp-airplane::before { content: "\ea07"; } .sp-airplane-o::before { content: "\ea08"; } .sp-airplane-s::before { content: "\ea09"; } .sp-alert::before { content: "\ea0a"; } .sp-alert-o::before { content: "\ea0b"; } .sp-alert-s::before { content: "\ea0c"; } .sp-analyse::before { content: "\ea0d"; } .sp-analyse-o::before { content: "\ea0e"; } .sp-analyse-s::before { content: "\ea0f"; } .sp-anchor::before { content: "\ea10"; } .sp-anchor-o::before { content: "\ea11"; } .sp-anchor-s::before { content: "\ea12"; } .sp-apple::before { content: "\ea13"; } .sp-apple-o::before { content: "\ea14"; } .sp-apple-s::before { content: "\ea15"; } .sp-arrow-down::before { content: "\ea16"; } .sp-arrow-down-o::before { content: "\ea17"; } .sp-arrow-down-s::before { content: "\ea18"; } .sp-arrow-right::before { content: "\ea19"; } .sp-arrow-right-o::before { content: "\ea1a"; } .sp-arrow-right-s::before { content: "\ea1b"; } .sp-arrow-up::before { content: "\ea1c"; } .sp-arrow-up-o::before { content: "\ea1d"; } .sp-arrow-up-s::before { content: "\ea1e"; } .sp-astronaut::before { content: "\ea1f"; } .sp-astronaut-o::before { content: "\ea20"; } .sp-astronaut-s::before { content: "\ea21"; } .sp-augmented-reality::before { content: "\ea22"; } .sp-augmented-reality-o::before { content: "\ea23"; } .sp-augmented-reality-s::before { content: "\ea24"; } .sp-backoffice::before { content: "\ea25"; } .sp-backoffice-o::before { content: "\ea26"; } .sp-backoffice-s::before { content: "\ea27"; } .sp-balloon::before { content: "\ea28"; } .sp-balloon-o::before { content: "\ea29"; } .sp-balloon-s::before { content: "\ea2a"; } .sp-bank::before { content: "\ea2b"; } .sp-bank-o::before { content: "\ea2c"; } .sp-bank-s::before { content: "\ea2d"; } .sp-banknote::before { content: "\ea2e"; } .sp-banknote-o::before { content: "\ea2f"; } .sp-banknote-s::before { content: "\ea30"; } .sp-bar-chart::before { content: "\ea31"; } .sp-bar-chart-o::before { content: "\ea32"; } .sp-bar-chart-s::before { content: "\ea33"; } .sp-barcode::before { content: "\ea34"; } .sp-barcode-o::before { content: "\ea35"; } .sp-barcode-s::before { content: "\ea36"; } .sp-battery::before { content: "\ea37"; } .sp-battery-o::before { content: "\ea38"; } .sp-battery-s::before { content: "\ea39"; } .sp-beacon::before { content: "\ea3a"; } .sp-beacon-o::before { content: "\ea3b"; } .sp-beacon-s::before { content: "\ea3c"; } .sp-beat::before { content: "\ea3d"; } .sp-beat-o::before { content: "\ea3e"; } .sp-beat-s::before { content: "\ea3f"; } .sp-bee::before { content: "\ea40"; } .sp-bee-o::before { content: "\ea41"; } .sp-bee-s::before { content: "\ea42"; } .sp-berlin::before { content: "\ea43"; } .sp-berlin-o::before { content: "\ea44"; } .sp-berlin-s::before { content: "\ea45"; } .sp-big-data::before { content: "\ea46"; } .sp-big-data-o::before { content: "\ea47"; } .sp-big-data-s::before { content: "\ea48"; } .sp-bill::before { content: "\ea49"; } .sp-bill-o::before { content: "\ea4a"; } .sp-bill-s::before { content: "\ea4b"; } .sp-binoculars::before { content: "\ea4c"; } .sp-binoculars-o::before { content: "\ea4d"; } .sp-binoculars-s::before { content: "\ea4e"; } .sp-blockchain::before { content: "\ea4f"; } .sp-blockchain-o::before { content: "\ea50"; } .sp-blockchain-s::before { content: "\ea51"; } .sp-bluetooth::before { content: "\ea52"; } .sp-bluetooth-o::before { content: "\ea53"; } .sp-bluetooth-s::before { content: "\ea54"; } .sp-bone::before { content: "\ea55"; } .sp-bone-o::before { content: "\ea56"; } .sp-bone-s::before { content: "\ea57"; } .sp-book::before { content: "\ea58"; } .sp-book-o::before { content: "\ea59"; } .sp-book-s::before { content: "\ea5a"; } .sp-bottle::before { content: "\ea5b"; } .sp-bottle-o::before { content: "\ea5c"; } .sp-bottle-s::before { content: "\ea5d"; } .sp-bricks::before { content: "\ea5e"; } .sp-bricks-o::before { content: "\ea5f"; } .sp-bricks-s::before { content: "\ea60"; } .sp-broom::before { content: "\ea61"; } .sp-broom-o::before { content: "\ea62"; } .sp-broom-s::before { content: "\ea63"; } .sp-building::before { content: "\ea64"; } .sp-building-o::before { content: "\ea65"; } .sp-building-s::before { content: "\ea66"; } .sp-bull-bear::before { content: "\ea67"; } .sp-bull-bear-o::before { content: "\ea68"; } .sp-bull-bear-s::before { content: "\ea69"; } .sp-business::before { content: "\ea6a"; } .sp-business-continuity-management::before { content: "\ea6b"; } .sp-business-continuity-management-o::before { content: "\ea6c"; } .sp-business-continuity-management-s::before { content: "\ea6d"; } .sp-business-o::before { content: "\ea6e"; } .sp-business-s::before { content: "\ea6f"; } .sp-cake::before { content: "\ea70"; } .sp-cake-o::before { content: "\ea71"; } .sp-cake-s::before { content: "\ea72"; } .sp-calculator::before { content: "\ea73"; } .sp-calculator-o::before { content: "\ea74"; } .sp-calculator-s::before { content: "\ea75"; } .sp-calendar::before { content: "\ea76"; } .sp-calendar-o::before { content: "\ea77"; } .sp-calendar-s::before { content: "\ea78"; } .sp-camera::before { content: "\ea79"; } .sp-camera-o::before { content: "\ea7a"; } .sp-camera-s::before { content: "\ea7b"; } .sp-cap::before { content: "\ea7c"; } .sp-cap-o::before { content: "\ea7d"; } .sp-cap-s::before { content: "\ea7e"; } .sp-capsule::before { content: "\ea7f"; } .sp-capsule-o::before { content: "\ea80"; } .sp-capsule-s::before { content: "\ea81"; } .sp-car::before { content: "\ea82"; } .sp-car-front::before { content: "\ea83"; } .sp-car-front-o::before { content: "\ea84"; } .sp-car-front-s::before { content: "\ea85"; } .sp-car-o::before { content: "\ea86"; } .sp-car-race::before { content: "\ea87"; } .sp-car-race-o::before { content: "\ea88"; } .sp-car-race-s::before { content: "\ea89"; } .sp-car-s::before { content: "\ea8a"; } .sp-carabiner::before { content: "\ea8b"; } .sp-carabiner-o::before { content: "\ea8c"; } .sp-carabiner-s::before { content: "\ea8d"; } .sp-card::before { content: "\ea8e"; } .sp-card-o::before { content: "\ea8f"; } .sp-card-s::before { content: "\ea90"; } .sp-carrot::before { content: "\ea91"; } .sp-carrot-o::before { content: "\ea92"; } .sp-carrot-s::before { content: "\ea93"; } .sp-cash::before { content: "\ea94"; } .sp-cash-machine::before { content: "\ea95"; } .sp-cash-machine-o::before { content: "\ea96"; } .sp-cash-machine-s::before { content: "\ea97"; } .sp-cash-o::before { content: "\ea98"; } .sp-cash-register::before { content: "\ea99"; } .sp-cash-register-o::before { content: "\ea9a"; } .sp-cash-register-s::before { content: "\ea9b"; } .sp-cash-s::before { content: "\ea9c"; } .sp-cash-terminal::before { content: "\ea9d"; } .sp-cash-terminal-o::before { content: "\ea9e"; } .sp-cash-terminal-s::before { content: "\ea9f"; } .sp-cashless::before { content: "\eaa0"; } .sp-cashless-o::before { content: "\eaa1"; } .sp-cashless-s::before { content: "\eaa2"; } .sp-certificate::before { content: "\eaa3"; } .sp-certificate-o::before { content: "\eaa4"; } .sp-certificate-s::before { content: "\eaa5"; } .sp-check::before { content: "\eaa6"; } .sp-check-o::before { content: "\eaa7"; } .sp-check-s::before { content: "\eaa8"; } .sp-cheveron-right::before { content: "\eaa9"; } .sp-cheveron-right-o::before { content: "\eaaa"; } .sp-cheveron-right-s::before { content: "\eaab"; } .sp-chf-eur::before { content: "\eaac"; } .sp-chf-eur-o::before { content: "\eaad"; } .sp-chf-eur-s::before { content: "\eaae"; } .sp-click-collect::before { content: "\eaaf"; } .sp-click-collect-o::before { content: "\eab0"; } .sp-click-collect-s::before { content: "\eab1"; } .sp-click-return::before { content: "\eab2"; } .sp-click-return-o::before { content: "\eab3"; } .sp-click-return-s::before { content: "\eab4"; } .sp-client-receipt::before { content: "\eab5"; } .sp-client-receipt-o::before { content: "\eab6"; } .sp-client-receipt-s::before { content: "\eab7"; } .sp-clock::before { content: "\eab8"; } .sp-clock-o::before { content: "\eab9"; } .sp-clock-s::before { content: "\eaba"; } .sp-cloud::before { content: "\eabb"; } .sp-cloud-o::before { content: "\eabc"; } .sp-cloud-s::before { content: "\eabd"; } .sp-coffee::before { content: "\eabe"; } .sp-coffee-o::before { content: "\eabf"; } .sp-coffee-s::before { content: "\eac0"; } .sp-coins::before { content: "\eac1"; } .sp-coins-o::before { content: "\eac2"; } .sp-coins-s::before { content: "\eac3"; } .sp-compass::before { content: "\eac4"; } .sp-compass-o::before { content: "\eac5"; } .sp-compass-s::before { content: "\eac6"; } .sp-connectivity::before { content: "\eac7"; } .sp-connectivity-o::before { content: "\eac8"; } .sp-connectivity-s::before { content: "\eac9"; } .sp-contactless::before { content: "\eaca"; } .sp-contactless-o::before { content: "\eacb"; } .sp-contactless-s::before { content: "\eacc"; } .sp-cornet::before { content: "\eacd"; } .sp-cornet-o::before { content: "\eace"; } .sp-cornet-s::before { content: "\eacf"; } .sp-cost-reduction::before { content: "\ead0"; } .sp-cost-reduction-o::before { content: "\ead1"; } .sp-cost-reduction-s::before { content: "\ead2"; } .sp-couch::before { content: "\ead3"; } .sp-couch-o::before { content: "\ead4"; } .sp-couch-s::before { content: "\ead5"; } .sp-coupon::before { content: "\ead6"; } .sp-coupon-o::before { content: "\ead7"; } .sp-coupon-s::before { content: "\ead8"; } .sp-cow::before { content: "\ead9"; } .sp-cow-o::before { content: "\eada"; } .sp-cow-s::before { content: "\eadb"; } .sp-crisis-management::before { content: "\eadc"; } .sp-crisis-management-o::before { content: "\eadd"; } .sp-crisis-management-s::before { content: "\eade"; } .sp-croissant::before { content: "\eadf"; } .sp-croissant-o::before { content: "\eae0"; } .sp-croissant-s::before { content: "\eae1"; } .sp-crowdfunding::before { content: "\eae2"; } .sp-crowdfunding-o::before { content: "\eae3"; } .sp-crowdfunding-s::before { content: "\eae4"; } .sp-crown::before { content: "\eae5"; } .sp-crown-o::before { content: "\eae6"; } .sp-crown-s::before { content: "\eae7"; } .sp-cryptocurrency::before { content: "\eae8"; } .sp-cryptocurrency-o::before { content: "\eae9"; } .sp-cryptocurrency-s::before { content: "\eaea"; } .sp-crystal-ball::before { content: "\eaeb"; } .sp-crystal-ball-o::before { content: "\eaec"; } .sp-crystal-ball-s::before { content: "\eaed"; } .sp-cup::before { content: "\eaee"; } .sp-cup-o::before { content: "\eaef"; } .sp-cup-s::before { content: "\eaf0"; } .sp-cupcake::before { content: "\eaf1"; } .sp-cupcake-o::before { content: "\eaf2"; } .sp-cupcake-s::before { content: "\eaf3"; } .sp-currency::before { content: "\eaf4"; } .sp-currency-o::before { content: "\eaf5"; } .sp-currency-s::before { content: "\eaf6"; } .sp-cyber-security::before { content: "\eaf7"; } .sp-cyber-security-o::before { content: "\eaf8"; } .sp-cyber-security-s::before { content: "\eaf9"; } .sp-data-encoding::before { content: "\eafa"; } .sp-data-encoding-o::before { content: "\eafb"; } .sp-data-encoding-s::before { content: "\eafc"; } .sp-data-mapping::before { content: "\eafd"; } .sp-data-mapping-o::before { content: "\eafe"; } .sp-data-mapping-s::before { content: "\eaff"; } .sp-database::before { content: "\eb00"; } .sp-database-o::before { content: "\eb01"; } .sp-database-s::before { content: "\eb02"; } .sp-ddos-protection::before { content: "\eb03"; } .sp-ddos-protection-o::before { content: "\eb04"; } .sp-ddos-protection-s::before { content: "\eb05"; } .sp-deck-chair::before { content: "\eb06"; } .sp-deck-chair-o::before { content: "\eb07"; } .sp-deck-chair-s::before { content: "\eb08"; } .sp-desktop::before { content: "\eb09"; } .sp-desktop-o::before { content: "\eb0a"; } .sp-desktop-s::before { content: "\eb0b"; } .sp-diamond::before { content: "\eb0c"; } .sp-diamond-o::before { content: "\eb0d"; } .sp-diamond-s::before { content: "\eb0e"; } .sp-digital-workspace::before { content: "\eb0f"; } .sp-digital-workspace-o::before { content: "\eb10"; } .sp-digital-workspace-s::before { content: "\eb11"; } .sp-disc::before { content: "\eb12"; } .sp-disc-o::before { content: "\eb13"; } .sp-disc-s::before { content: "\eb14"; } .sp-diversify::before { content: "\eb15"; } .sp-diversify-o::before { content: "\eb16"; } .sp-diversify-s::before { content: "\eb17"; } .sp-dna::before { content: "\eb18"; } .sp-dna-o::before { content: "\eb19"; } .sp-dna-s::before { content: "\eb1a"; } .sp-doctor::before { content: "\eb1b"; } .sp-doctor-o::before { content: "\eb1c"; } .sp-doctor-s::before { content: "\eb1d"; } .sp-dog::before { content: "\eb1e"; } .sp-dog-o::before { content: "\eb1f"; } .sp-dog-s::before { content: "\eb20"; } .sp-download::before { content: "\eb21"; } .sp-download-o::before { content: "\eb22"; } .sp-download-s::before { content: "\eb23"; } .sp-drop::before { content: "\eb24"; } .sp-drop-o::before { content: "\eb25"; } .sp-drop-s::before { content: "\eb26"; } .sp-dumbbell::before { content: "\eb27"; } .sp-dumbbell-o::before { content: "\eb28"; } .sp-dumbbell-s::before { content: "\eb29"; } .sp-ear::before { content: "\eb2a"; } .sp-ear-o::before { content: "\eb2b"; } .sp-ear-s::before { content: "\eb2c"; } .sp-ethernet::before { content: "\eb2d"; } .sp-ethernet-o::before { content: "\eb2e"; } .sp-ethernet-s::before { content: "\eb2f"; } .sp-eur-dollar::before { content: "\eb30"; } .sp-eur-dollar-o::before { content: "\eb31"; } .sp-eur-dollar-s::before { content: "\eb32"; } .sp-exchange::before { content: "\eb33"; } .sp-exchange-o::before { content: "\eb34"; } .sp-exchange-s::before { content: "\eb35"; } .sp-exclamation::before { content: "\eb36"; } .sp-exclamation-o::before { content: "\eb37"; } .sp-exclamation-s::before { content: "\eb38"; } .sp-external-link::before { content: "\eb39"; } .sp-external-link-o::before { content: "\eb3a"; } .sp-external-link-s::before { content: "\eb3b"; } .sp-extinguisher::before { content: "\eb3c"; } .sp-extinguisher-o::before { content: "\eb3d"; } .sp-extinguisher-s::before { content: "\eb3e"; } .sp-eye::before { content: "\eb3f"; } .sp-eye-o::before { content: "\eb40"; } .sp-eye-s::before { content: "\eb41"; } .sp-factory::before { content: "\eb42"; } .sp-factory-o::before { content: "\eb43"; } .sp-factory-s::before { content: "\eb44"; } .sp-fax::before { content: "\eb45"; } .sp-fax-o::before { content: "\eb46"; } .sp-fax-s::before { content: "\eb47"; } .sp-feather::before { content: "\eb48"; } .sp-feather-o::before { content: "\eb49"; } .sp-feather-s::before { content: "\eb4a"; } .sp-fence::before { content: "\eb4b"; } .sp-fence-o::before { content: "\eb4c"; } .sp-fence-s::before { content: "\eb4d"; } .sp-file::before { content: "\eb4e"; } .sp-file-o::before { content: "\eb4f"; } .sp-file-s::before { content: "\eb50"; } .sp-file-text::before { content: "\eb51"; } .sp-file-text-o::before { content: "\eb52"; } .sp-file-text-s::before { content: "\eb53"; } .sp-fingerprint::before { content: "\eb54"; } .sp-fingerprint-o::before { content: "\eb55"; } .sp-fingerprint-s::before { content: "\eb56"; } .sp-flag::before { content: "\eb57"; } .sp-flag-o::before { content: "\eb58"; } .sp-flag-s::before { content: "\eb59"; } .sp-flag-switzerland::before { content: "\eb5a"; } .sp-flag-switzerland-o::before { content: "\eb5b"; } .sp-flag-switzerland-s::before { content: "\eb5c"; } .sp-flash::before { content: "\eb5d"; } .sp-flash-o::before { content: "\eb5e"; } .sp-flash-s::before { content: "\eb5f"; } .sp-flexibility::before { content: "\eb60"; } .sp-flexibility-o::before { content: "\eb61"; } .sp-flexibility-s::before { content: "\eb62"; } .sp-flipchart::before { content: "\eb63"; } .sp-flipchart-o::before { content: "\eb64"; } .sp-flipchart-s::before { content: "\eb65"; } .sp-flower::before { content: "\eb66"; } .sp-flower-o::before { content: "\eb67"; } .sp-flower-s::before { content: "\eb68"; } .sp-focus::before { content: "\eb69"; } .sp-focus-o::before { content: "\eb6a"; } .sp-focus-s::before { content: "\eb6b"; } .sp-footprint::before { content: "\eb6c"; } .sp-footprint-o::before { content: "\eb6d"; } .sp-footprint-s::before { content: "\eb6e"; } .sp-foreign-exchange::before { content: "\eb6f"; } .sp-foreign-exchange-o::before { content: "\eb70"; } .sp-foreign-exchange-s::before { content: "\eb71"; } .sp-four-leaf-clover::before { content: "\eb72"; } .sp-four-leaf-clover-o::before { content: "\eb73"; } .sp-four-leaf-clover-s::before { content: "\eb74"; } .sp-fraud-free::before { content: "\eb75"; } .sp-fraud-free-o::before { content: "\eb76"; } .sp-fraud-free-s::before { content: "\eb77"; } .sp-funnel::before { content: "\eb78"; } .sp-funnel-o::before { content: "\eb79"; } .sp-funnel-s::before { content: "\eb7a"; } .sp-gamepad::before { content: "\eb7b"; } .sp-gamepad-o::before { content: "\eb7c"; } .sp-gamepad-s::before { content: "\eb7d"; } .sp-gear::before { content: "\eb7e"; } .sp-gear-o::before { content: "\eb7f"; } .sp-gear-s::before { content: "\eb80"; } .sp-gears::before { content: "\eb81"; } .sp-gears-o::before { content: "\eb82"; } .sp-gears-s::before { content: "\eb83"; } .sp-generic::before { content: "\eb84"; } .sp-generic-o::before { content: "\eb85"; } .sp-generic-s::before { content: "\eb86"; } .sp-genie::before { content: "\eb87"; } .sp-genie-o::before { content: "\eb88"; } .sp-genie-s::before { content: "\eb89"; } .sp-giftcard::before { content: "\eb8a"; } .sp-giftcard-o::before { content: "\eb8b"; } .sp-giftcard-s::before { content: "\eb8c"; } .sp-glass::before { content: "\eb8d"; } .sp-glass-o::before { content: "\eb8e"; } .sp-glass-s::before { content: "\eb8f"; } .sp-glasses::before { content: "\eb90"; } .sp-glasses-o::before { content: "\eb91"; } .sp-glasses-s::before { content: "\eb92"; } .sp-global::before { content: "\eb93"; } .sp-global-coins::before { content: "\eb94"; } .sp-global-coins-o::before { content: "\eb95"; } .sp-global-coins-s::before { content: "\eb96"; } .sp-global-o::before { content: "\eb97"; } .sp-global-s::before { content: "\eb98"; } .sp-gprs::before { content: "\eb99"; } .sp-gprs-lan::before { content: "\eb9a"; } .sp-gprs-lan-o::before { content: "\eb9b"; } .sp-gprs-lan-s::before { content: "\eb9c"; } .sp-gprs-o::before { content: "\eb9d"; } .sp-gprs-s::before { content: "\eb9e"; } .sp-hacker-security::before { content: "\eb9f"; } .sp-hacker-security-o::before { content: "\eba0"; } .sp-hacker-security-s::before { content: "\eba1"; } .sp-hand-open::before { content: "\eba2"; } .sp-hand-open-o::before { content: "\eba3"; } .sp-hand-open-s::before { content: "\eba4"; } .sp-hand-paper::before { content: "\eba5"; } .sp-hand-paper-o::before { content: "\eba6"; } .sp-hand-paper-s::before { content: "\eba7"; } .sp-handshake::before { content: "\eba8"; } .sp-handshake-o::before { content: "\eba9"; } .sp-handshake-s::before { content: "\ebaa"; } .sp-hashtag::before { content: "\ebab"; } .sp-hashtag-o::before { content: "\ebac"; } .sp-hashtag-s::before { content: "\ebad"; } .sp-heart::before { content: "\ebae"; } .sp-heart-o::before { content: "\ebaf"; } .sp-heart-s::before { content: "\ebb0"; } .sp-helmet::before { content: "\ebb1"; } .sp-helmet-o::before { content: "\ebb2"; } .sp-helmet-s::before { content: "\ebb3"; } .sp-home::before { content: "\ebb4"; } .sp-home-o::before { content: "\ebb5"; } .sp-home-s::before { content: "\ebb6"; } .sp-homebase::before { content: "\ebb7"; } .sp-homebase-o::before { content: "\ebb8"; } .sp-homebase-s::before { content: "\ebb9"; } .sp-i-connect::before { content: "\ebba"; } .sp-i-connect-o::before { content: "\ebbb"; } .sp-i-connect-s::before { content: "\ebbc"; } .sp-identity-management::before { content: "\ebbd"; } .sp-identity-management-o::before { content: "\ebbe"; } .sp-identity-management-s::before { content: "\ebbf"; } .sp-info::before { content: "\ebc0"; } .sp-info-o::before { content: "\ebc1"; } .sp-info-s::before { content: "\ebc2"; } .sp-institute-invoice-issuer::before { content: "\ebc3"; } .sp-institute-invoice-issuer-o::before { content: "\ebc4"; } .sp-institute-invoice-issuer-s::before { content: "\ebc5"; } .sp-institute-invoice-recipient::before { content: "\ebc6"; } .sp-institute-invoice-recipient-o::before { content: "\ebc7"; } .sp-institute-invoice-recipient-s::before { content: "\ebc8"; } .sp-instructor::before { content: "\ebc9"; } .sp-instructor-o::before { content: "\ebca"; } .sp-instructor-s::before { content: "\ebcb"; } .sp-international-connectivity::before { content: "\ebcc"; } .sp-international-connectivity-o::before { content: "\ebcd"; } .sp-international-connectivity-s::before { content: "\ebce"; } .sp-invoice-by-mail::before { content: "\ebcf"; } .sp-invoice-by-mail-o::before { content: "\ebd0"; } .sp-invoice-by-mail-s::before { content: "\ebd1"; } .sp-invoice-by-post::before { content: "\ebd2"; } .sp-invoice-by-post-o::before { content: "\ebd3"; } .sp-invoice-by-post-s::before { content: "\ebd4"; } .sp-invoice-laptop::before { content: "\ebd5"; } .sp-invoice-laptop-o::before { content: "\ebd6"; } .sp-invoice-laptop-s::before { content: "\ebd7"; } .sp-iot::before { content: "\ebd8"; } .sp-iot-o::before { content: "\ebd9"; } .sp-iot-s::before { content: "\ebda"; } .sp-key::before { content: "\ebdb"; } .sp-key-o::before { content: "\ebdc"; } .sp-key-s::before { content: "\ebdd"; } .sp-lab::before { content: "\ebde"; } .sp-lab-o::before { content: "\ebdf"; } .sp-lab-s::before { content: "\ebe0"; } .sp-labyrinth::before { content: "\ebe1"; } .sp-labyrinth-o::before { content: "\ebe2"; } .sp-labyrinth-s::before { content: "\ebe3"; } .sp-laptop::before { content: "\ebe4"; } .sp-laptop-o::before { content: "\ebe5"; } .sp-laptop-s::before { content: "\ebe6"; } .sp-laurel::before { content: "\ebe7"; } .sp-laurel-o::before { content: "\ebe8"; } .sp-laurel-s::before { content: "\ebe9"; } .sp-leaf::before { content: "\ebea"; } .sp-leaf-o::before { content: "\ebeb"; } .sp-leaf-s::before { content: "\ebec"; } .sp-lightbulb::before { content: "\ebed"; } .sp-lightbulb-o::before { content: "\ebee"; } .sp-lightbulb-s::before { content: "\ebef"; } .sp-lighthouse::before { content: "\ebf0"; } .sp-lighthouse-o::before { content: "\ebf1"; } .sp-lighthouse-s::before { content: "\ebf2"; } .sp-lines::before { content: "\ebf3"; } .sp-lines-o::before { content: "\ebf4"; } .sp-lines-s::before { content: "\ebf5"; } .sp-link::before { content: "\ebf6"; } .sp-link-o::before { content: "\ebf7"; } .sp-link-s::before { content: "\ebf8"; } .sp-lock::before { content: "\ebf9"; } .sp-lock-o::before { content: "\ebfa"; } .sp-lock-s::before { content: "\ebfb"; } .sp-logout::before { content: "\ebfc"; } .sp-logout-o::before { content: "\ebfd"; } .sp-logout-s::before { content: "\ebfe"; } .sp-london::before { content: "\ebff"; } .sp-london-o::before { content: "\ec00"; } .sp-london-s::before { content: "\ec01"; } .sp-loss-of-building::before { content: "\ec02"; } .sp-loss-of-building-o::before { content: "\ec03"; } .sp-loss-of-building-s::before { content: "\ec04"; } .sp-loss-of-provider::before { content: "\ec05"; } .sp-loss-of-provider-o::before { content: "\ec06"; } .sp-loss-of-provider-s::before { content: "\ec07"; } .sp-loss-of-staff::before { content: "\ec08"; } .sp-loss-of-staff-o::before { content: "\ec09"; } .sp-loss-of-staff-s::before { content: "\ec0a"; } .sp-loss-of-system::before { content: "\ec0b"; } .sp-loss-of-system-o::before { content: "\ec0c"; } .sp-loss-of-system-s::before { content: "\ec0d"; } .sp-lunch-learn::before { content: "\ec0e"; } .sp-lunch-learn-o::before { content: "\ec0f"; } .sp-lunch-learn-s::before { content: "\ec10"; } .sp-machine-learning::before { content: "\ec11"; } .sp-machine-learning-o::before { content: "\ec12"; } .sp-machine-learning-s::before { content: "\ec13"; } .sp-mail::before { content: "\ec14"; } .sp-mail-o::before { content: "\ec15"; } .sp-mail-s::before { content: "\ec16"; } .sp-malware::before { content: "\ec17"; } .sp-malware-o::before { content: "\ec18"; } .sp-malware-s::before { content: "\ec19"; } .sp-map::before { content: "\ec1a"; } .sp-map-marker::before { content: "\ec1b"; } .sp-map-marker-o::before { content: "\ec1c"; } .sp-map-marker-s::before { content: "\ec1d"; } .sp-map-o::before { content: "\ec1e"; } .sp-map-s::before { content: "\ec1f"; } .sp-megaphone::before { content: "\ec20"; } .sp-megaphone-o::before { content: "\ec21"; } .sp-megaphone-s::before { content: "\ec22"; } .sp-micro-payments::before { content: "\ec23"; } .sp-micro-payments-o::before { content: "\ec24"; } .sp-micro-payments-s::before { content: "\ec25"; } .sp-microphone::before { content: "\ec26"; } .sp-microphone-o::before { content: "\ec27"; } .sp-microphone-s::before { content: "\ec28"; } .sp-minus::before { content: "\ec29"; } .sp-minus-o::before { content: "\ec2a"; } .sp-minus-s::before { content: "\ec2b"; } .sp-mobile-payment::before { content: "\ec2c"; } .sp-mobile-payment-o::before { content: "\ec2d"; } .sp-mobile-payment-s::before { content: "\ec2e"; } .sp-mobile-terminal::before { content: "\ec2f"; } .sp-mobile-terminal-o::before { content: "\ec30"; } .sp-mobile-terminal-s::before { content: "\ec31"; } .sp-monitoring::before { content: "\ec32"; } .sp-monitoring-o::before { content: "\ec33"; } .sp-monitoring-s::before { content: "\ec34"; } .sp-more-horiz::before { content: "\ec35"; } .sp-more-horiz-o::before { content: "\ec36"; } .sp-more-horiz-s::before { content: "\ec37"; } .sp-more-vert::before { content: "\ec38"; } .sp-more-vert-o::before { content: "\ec39"; } .sp-more-vert-s::before { content: "\ec3a"; } .sp-mountain::before { content: "\ec3b"; } .sp-mountain-o::before { content: "\ec3c"; } .sp-mountain-s::before { content: "\ec3d"; } .sp-movie-camera::before { content: "\ec3e"; } .sp-movie-camera-o::before { content: "\ec3f"; } .sp-movie-camera-s::before { content: "\ec40"; } .sp-no-smoking::before { content: "\ec41"; } .sp-no-smoking-o::before { content: "\ec42"; } .sp-no-smoking-s::before { content: "\ec43"; } .sp-office::before { content: "\ec44"; } .sp-office-o::before { content: "\ec45"; } .sp-office-s::before { content: "\ec46"; } .sp-outsourcing::before { content: "\ec47"; } .sp-outsourcing-o::before { content: "\ec48"; } .sp-outsourcing-s::before { content: "\ec49"; } .sp-package::before { content: "\ec4a"; } .sp-package-o::before { content: "\ec4b"; } .sp-package-s::before { content: "\ec4c"; } .sp-paddle::before { content: "\ec4d"; } .sp-paddle-o::before { content: "\ec4e"; } .sp-paddle-s::before { content: "\ec4f"; } .sp-paragraph::before { content: "\ec50"; } .sp-paragraph-o::before { content: "\ec51"; } .sp-paragraph-s::before { content: "\ec52"; } .sp-paris::before { content: "\ec53"; } .sp-paris-o::before { content: "\ec54"; } .sp-paris-s::before { content: "\ec55"; } .sp-parking::before { content: "\ec56"; } .sp-parking-o::before { content: "\ec57"; } .sp-parking-s::before { content: "\ec58"; } .sp-pause::before { content: "\ec59"; } .sp-pause-o::before { content: "\ec5a"; } .sp-pause-s::before { content: "\ec5b"; } .sp-pay-points::before { content: "\ec5c"; } .sp-pay-points-o::before { content: "\ec5d"; } .sp-pay-points-s::before { content: "\ec5e"; } .sp-payment-note::before { content: "\ec5f"; } .sp-payment-note-o::before { content: "\ec60"; } .sp-payment-note-s::before { content: "\ec61"; } .sp-pencil::before { content: "\ec62"; } .sp-pencil-o::before { content: "\ec63"; } .sp-pencil-s::before { content: "\ec64"; } .sp-person-business::before { content: "\ec65"; } .sp-person-business-o::before { content: "\ec66"; } .sp-person-business-s::before { content: "\ec67"; } .sp-person-callcenter::before { content: "\ec68"; } .sp-person-callcenter-o::before { content: "\ec69"; } .sp-person-callcenter-s::before { content: "\ec6a"; } .sp-person-client::before { content: "\ec6b"; } .sp-person-client-o::before { content: "\ec6c"; } .sp-person-client-s::before { content: "\ec6d"; } .sp-person-group::before { content: "\ec6e"; } .sp-person-group-o::before { content: "\ec6f"; } .sp-person-group-s::before { content: "\ec70"; } .sp-person-headphones::before { content: "\ec71"; } .sp-person-headphones-o::before { content: "\ec72"; } .sp-person-headphones-s::before { content: "\ec73"; } .sp-person-neutral::before { content: "\ec74"; } .sp-person-neutral-o::before { content: "\ec75"; } .sp-person-neutral-s::before { content: "\ec76"; } .sp-person-social::before { content: "\ec77"; } .sp-person-social-o::before { content: "\ec78"; } .sp-person-social-s::before { content: "\ec79"; } .sp-person-two::before { content: "\ec7a"; } .sp-person-two-o::before { content: "\ec7b"; } .sp-person-two-s::before { content: "\ec7c"; } .sp-pet::before { content: "\ec7d"; } .sp-pet-o::before { content: "\ec7e"; } .sp-pet-s::before { content: "\ec7f"; } .sp-phishing::before { content: "\ec80"; } .sp-phishing-o::before { content: "\ec81"; } .sp-phishing-s::before { content: "\ec82"; } .sp-phone-headset::before { content: "\ec83"; } .sp-phone-headset-o::before { content: "\ec84"; } .sp-phone-headset-s::before { content: "\ec85"; } .sp-physical-security::before { content: "\ec86"; } .sp-physical-security-o::before { content: "\ec87"; } .sp-physical-security-s::before { content: "\ec88"; } .sp-pi::before { content: "\ec89"; } .sp-pi-o::before { content: "\ec8a"; } .sp-pi-s::before { content: "\ec8b"; } .sp-piechart::before { content: "\ec8c"; } .sp-piechart-o::before { content: "\ec8d"; } .sp-piechart-s::before { content: "\ec8e"; } .sp-pig::before { content: "\ec8f"; } .sp-pig-o::before { content: "\ec90"; } .sp-pig-s::before { content: "\ec91"; } .sp-piggy-bank::before { content: "\ec92"; } .sp-piggy-bank-o::before { content: "\ec93"; } .sp-piggy-bank-s::before { content: "\ec94"; } .sp-planet::before { content: "\ec95"; } .sp-planet-o::before { content: "\ec96"; } .sp-planet-s::before { content: "\ec97"; } .sp-play::before { content: "\ec98"; } .sp-play-o::before { content: "\ec99"; } .sp-play-s::before { content: "\ec9a"; } .sp-plus::before { content: "\ec9b"; } .sp-plus-o::before { content: "\ec9c"; } .sp-plus-s::before { content: "\ec9d"; } .sp-podium::before { content: "\ec9e"; } .sp-podium-o::before { content: "\ec9f"; } .sp-podium-s::before { content: "\eca0"; } .sp-popsicle::before { content: "\eca1"; } .sp-popsicle-o::before { content: "\eca2"; } .sp-popsicle-s::before { content: "\eca3"; } .sp-popup::before { content: "\eca4"; } .sp-popup-o::before { content: "\eca5"; } .sp-popup-s::before { content: "\eca6"; } .sp-pram::before { content: "\eca7"; } .sp-pram-o::before { content: "\eca8"; } .sp-pram-s::before { content: "\eca9"; } .sp-present::before { content: "\ecaa"; } .sp-present-o::before { content: "\ecab"; } .sp-present-s::before { content: "\ecac"; } .sp-printer::before { content: "\ecad"; } .sp-printer-o::before { content: "\ecae"; } .sp-printer-s::before { content: "\ecaf"; } .sp-privacy::before { content: "\ecb0"; } .sp-privacy-o::before { content: "\ecb1"; } .sp-privacy-s::before { content: "\ecb2"; } .sp-process::before { content: "\ecb3"; } .sp-process-o::before { content: "\ecb4"; } .sp-process-s::before { content: "\ecb5"; } .sp-projector::before { content: "\ecb6"; } .sp-projector-o::before { content: "\ecb7"; } .sp-projector-s::before { content: "\ecb8"; } .sp-psp::before { content: "\ecb9"; } .sp-psp-o::before { content: "\ecba"; } .sp-psp-s::before { content: "\ecbb"; } .sp-punch-card::before { content: "\ecbc"; } .sp-punch-card-o::before { content: "\ecbd"; } .sp-punch-card-s::before { content: "\ecbe"; } .sp-puzzle::before { content: "\ecbf"; } .sp-puzzle-o::before { content: "\ecc0"; } .sp-puzzle-s::before { content: "\ecc1"; } .sp-qr-bill::before { content: "\ecc2"; } .sp-qr-bill-laptop::before { content: "\ecc3"; } .sp-qr-bill-laptop-o::before { content: "\ecc4"; } .sp-qr-bill-laptop-s::before { content: "\ecc5"; } .sp-qr-bill-mail::before { content: "\ecc6"; } .sp-qr-bill-mail-o::before { content: "\ecc7"; } .sp-qr-bill-mail-s::before { content: "\ecc8"; } .sp-qr-bill-o::before { content: "\ecc9"; } .sp-qr-bill-post::before { content: "\ecca"; } .sp-qr-bill-post-o::before { content: "\eccb"; } .sp-qr-bill-post-s::before { content: "\eccc"; } .sp-qr-bill-s::before { content: "\eccd"; } .sp-qr-scanner::before { content: "\ecce"; } .sp-qr-scanner-o::before { content: "\eccf"; } .sp-qr-scanner-s::before { content: "\ecd0"; } .sp-qrcode::before { content: "\ecd1"; } .sp-qrcode-o::before { content: "\ecd2"; } .sp-qrcode-s::before { content: "\ecd3"; } .sp-question::before { content: "\ecd4"; } .sp-question-o::before { content: "\ecd5"; } .sp-question-s::before { content: "\ecd6"; } .sp-rabbit::before { content: "\ecd7"; } .sp-rabbit-o::before { content: "\ecd8"; } .sp-rabbit-s::before { content: "\ecd9"; } .sp-rain::before { content: "\ecda"; } .sp-rain-o::before { content: "\ecdb"; } .sp-rain-s::before { content: "\ecdc"; } .sp-realtime::before { content: "\ecdd"; } .sp-realtime-o::before { content: "\ecde"; } .sp-realtime-s::before { content: "\ecdf"; } .sp-recurring-payments::before { content: "\ece0"; } .sp-recurring-payments-o::before { content: "\ece1"; } .sp-recurring-payments-s::before { content: "\ece2"; } .sp-responsive-design::before { content: "\ece3"; } .sp-responsive-design-o::before { content: "\ece4"; } .sp-responsive-design-s::before { content: "\ece5"; } .sp-risk::before { content: "\ece6"; } .sp-risk-o::before { content: "\ece7"; } .sp-risk-s::before { content: "\ece8"; } .sp-robotics::before { content: "\ece9"; } .sp-robotics-advisor::before { content: "\ecea"; } .sp-robotics-advisor-o::before { content: "\eceb"; } .sp-robotics-advisor-s::before { content: "\ecec"; } .sp-robotics-o::before { content: "\eced"; } .sp-robotics-s::before { content: "\ecee"; } .sp-rock::before { content: "\ecef"; } .sp-rock-o::before { content: "\ecf0"; } .sp-rock-s::before { content: "\ecf1"; } .sp-rocket::before { content: "\ecf2"; } .sp-rocket-o::before { content: "\ecf3"; } .sp-rocket-s::before { content: "\ecf4"; } .sp-rss::before { content: "\ecf5"; } .sp-rss-o::before { content: "\ecf6"; } .sp-rss-s::before { content: "\ecf7"; } .sp-rudolph::before { content: "\ecf8"; } .sp-rudolph-o::before { content: "\ecf9"; } .sp-rudolph-s::before { content: "\ecfa"; } .sp-rudolph-s-neu::before { content: "\ecfb"; } .sp-rudolph-s-neu2::before { content: "\ecfc"; } .sp-safe::before { content: "\ecfd"; } .sp-safe-o::before { content: "\ecfe"; } .sp-safe-s::before { content: "\ecff"; } .sp-sailboat::before { content: "\ed00"; } .sp-sailboat-o::before { content: "\ed01"; } .sp-sailboat-s::before { content: "\ed02"; } .sp-sandwich::before { content: "\ed03"; } .sp-sandwich-o::before { content: "\ed04"; } .sp-sandwich-s::before { content: "\ed05"; } .sp-scales::before { content: "\ed06"; } .sp-scales-o::before { content: "\ed07"; } .sp-scales-s::before { content: "\ed08"; } .sp-screen::before { content: "\ed09"; } .sp-screen-o::before { content: "\ed0a"; } .sp-screen-s::before { content: "\ed0b"; } .sp-seal::before { content: "\ed0c"; } .sp-seal-o::before { content: "\ed0d"; } .sp-seal-s::before { content: "\ed0e"; } .sp-search::before { content: "\ed0f"; } .sp-search-o::before { content: "\ed10"; } .sp-search-s::before { content: "\ed11"; } .sp-security-champions::before { content: "\ed12"; } .sp-security-champions-o::before { content: "\ed13"; } .sp-security-champions-s::before { content: "\ed14"; } .sp-security-operation-center::before { content: "\ed15"; } .sp-security-operation-center-o::before { content: "\ed16"; } .sp-security-operation-center-s::before { content: "\ed17"; } .sp-sentiment-dissatisfied::before { content: "\ed18"; } .sp-sentiment-dissatisfied-o::before { content: "\ed19"; } .sp-sentiment-dissatisfied-s::before { content: "\ed1a"; } .sp-sentiment-satisfied::before { content: "\ed1b"; } .sp-sentiment-satisfied-o::before { content: "\ed1c"; } .sp-sentiment-satisfied-s::before { content: "\ed1d"; } .sp-server::before { content: "\ed1e"; } .sp-server-o::before { content: "\ed1f"; } .sp-server-s::before { content: "\ed20"; } .sp-service-bell::before { content: "\ed21"; } .sp-service-bell-o::before { content: "\ed22"; } .sp-service-bell-s::before { content: "\ed23"; } .sp-service-center::before { content: "\ed24"; } .sp-service-center-o::before { content: "\ed25"; } .sp-service-center-s::before { content: "\ed26"; } .sp-sextant::before { content: "\ed27"; } .sp-sextant-o::before { content: "\ed28"; } .sp-sextant-s::before { content: "\ed29"; } .sp-share::before { content: "\ed2a"; } .sp-share-o::before { content: "\ed2b"; } .sp-share-s::before { content: "\ed2c"; } .sp-shield::before { content: "\ed2d"; } .sp-shield-o::before { content: "\ed2e"; } .sp-shield-s::before { content: "\ed2f"; } .sp-shopping-cart::before { content: "\ed30"; } .sp-shopping-cart-chf::before { content: "\ed31"; } .sp-shopping-cart-chf-o::before { content: "\ed32"; } .sp-shopping-cart-chf-s::before { content: "\ed33"; } .sp-shopping-cart-download::before { content: "\ed34"; } .sp-shopping-cart-download-o::before { content: "\ed35"; } .sp-shopping-cart-download-s::before { content: "\ed36"; } .sp-shopping-cart-ecommerce::before { content: "\ed37"; } .sp-shopping-cart-ecommerce-o::before { content: "\ed38"; } .sp-shopping-cart-ecommerce-s::before { content: "\ed39"; } .sp-shopping-cart-o::before { content: "\ed3a"; } .sp-shopping-cart-s::before { content: "\ed3b"; } .sp-signal::before { content: "\ed3c"; } .sp-signal-o::before { content: "\ed3d"; } .sp-signal-s::before { content: "\ed3e"; } .sp-simple-integration::before { content: "\ed3f"; } .sp-simple-integration-o::before { content: "\ed40"; } .sp-simple-integration-s::before { content: "\ed41"; } .sp-skull::before { content: "\ed42"; } .sp-skull-o::before { content: "\ed43"; } .sp-skull-s::before { content: "\ed44"; } .sp-smartphone::before { content: "\ed45"; } .sp-smartphone-o::before { content: "\ed46"; } .sp-smartphone-s::before { content: "\ed47"; } .sp-smoking::before { content: "\ed48"; } .sp-smoking-allowed::before { content: "\ed49"; } .sp-smoking-allowed-o::before { content: "\ed4a"; } .sp-smoking-allowed-s::before { content: "\ed4b"; } .sp-smoking-o::before { content: "\ed4c"; } .sp-smoking-prohibited::before { content: "\ed4d"; } .sp-smoking-prohibited-o::before { content: "\ed4e"; } .sp-smoking-prohibited-s::before { content: "\ed4f"; } .sp-smoking-s::before { content: "\ed50"; } .sp-snow::before { content: "\ed51"; } .sp-snow-o::before { content: "\ed52"; } .sp-snow-s::before { content: "\ed53"; } .sp-snowflake::before { content: "\ed54"; } .sp-snowflake-o::before { content: "\ed55"; } .sp-snowflake-s::before { content: "\ed56"; } .sp-snowman::before { content: "\ed57"; } .sp-snowman-o::before { content: "\ed58"; } .sp-snowman-s::before { content: "\ed59"; } .sp-social-trading::before { content: "\ed5a"; } .sp-social-trading-o::before { content: "\ed5b"; } .sp-social-trading-s::before { content: "\ed5c"; } .sp-software-bank::before { content: "\ed5d"; } .sp-software-bank-o::before { content: "\ed5e"; } .sp-software-bank-s::before { content: "\ed5f"; } .sp-software-bank-s-neu::before { content: "\ed60"; } .sp-software-erp::before { content: "\ed61"; } .sp-software-erp-o::before { content: "\ed62"; } .sp-software-erp-s::before { content: "\ed63"; } .sp-software-erp-s-neu::before { content: "\ed64"; } .sp-software-package::before { content: "\ed65"; } .sp-software-package-o::before { content: "\ed66"; } .sp-software-package-s::before { content: "\ed67"; } .sp-software-s::before { content: "\ed68"; } .sp-sp-software-bank-s::before { content: "\ed69"; } .sp-speechbubble::before { content: "\ed6a"; } .sp-speechbubble-o::before { content: "\ed6b"; } .sp-speechbubble-s::before { content: "\ed6c"; } .sp-spirit::before { content: "\ed6d"; } .sp-spirit-o::before { content: "\ed6e"; } .sp-spirit-s::before { content: "\ed6f"; } .sp-split::before { content: "\ed70"; } .sp-split-o::before { content: "\ed71"; } .sp-split-operation::before { content: "\ed72"; } .sp-split-operation-o::before { content: "\ed73"; } .sp-split-operation-s::before { content: "\ed74"; } .sp-split-s::before { content: "\ed75"; } .sp-stability::before { content: "\ed76"; } .sp-stability-o::before { content: "\ed77"; } .sp-stability-s::before { content: "\ed78"; } .sp-stairs::before { content: "\ed79"; } .sp-stairs-o::before { content: "\ed7a"; } .sp-stairs-s::before { content: "\ed7b"; } .sp-star::before { content: "\ed7c"; } .sp-star-o::before { content: "\ed7d"; } .sp-star-s::before { content: "\ed7e"; } .sp-stock::before { content: "\ed7f"; } .sp-stock-o::before { content: "\ed80"; } .sp-stock-s::before { content: "\ed81"; } .sp-stopwatch::before { content: "\ed82"; } .sp-stopwatch-o::before { content: "\ed83"; } .sp-stopwatch-s::before { content: "\ed84"; } .sp-storage::before { content: "\ed85"; } .sp-storage-o::before { content: "\ed86"; } .sp-storage-s::before { content: "\ed87"; } .sp-store::before { content: "\ed88"; } .sp-store-o::before { content: "\ed89"; } .sp-store-s::before { content: "\ed8a"; } .sp-success::before { content: "\ed8b"; } .sp-success-o::before { content: "\ed8c"; } .sp-success-s::before { content: "\ed8d"; } .sp-suitcase::before { content: "\ed8e"; } .sp-suitcase-o::before { content: "\ed8f"; } .sp-suitcase-s::before { content: "\ed90"; } .sp-sun::before { content: "\ed91"; } .sp-sun-o::before { content: "\ed92"; } .sp-sun-s::before { content: "\ed93"; } .sp-surveillance::before { content: "\ed94"; } .sp-surveillance-o::before { content: "\ed95"; } .sp-surveillance-s::before { content: "\ed96"; } .sp-swiss::before { content: "\ed97"; } .sp-swiss-o::before { content: "\ed98"; } .sp-swiss-s::before { content: "\ed99"; } .sp-tablet::before { content: "\ed9a"; } .sp-tablet-o::before { content: "\ed9b"; } .sp-tablet-s::before { content: "\ed9c"; } .sp-tachometer::before { content: "\ed9d"; } .sp-tachometer-o::before { content: "\ed9e"; } .sp-tachometer-s::before { content: "\ed9f"; } .sp-target::before { content: "\eda0"; } .sp-target-o::before { content: "\eda1"; } .sp-target-s::before { content: "\eda2"; } .sp-telephone::before { content: "\eda3"; } .sp-telephone-o::before { content: "\eda4"; } .sp-telephone-s::before { content: "\eda5"; } .sp-telescope::before { content: "\eda6"; } .sp-telescope-o::before { content: "\eda7"; } .sp-telescope-s::before { content: "\eda8"; } .sp-temperature::before { content: "\eda9"; } .sp-temperature-o::before { content: "\edaa"; } .sp-temperature-s::before { content: "\edab"; } .sp-terminal::before { content: "\edac"; } .sp-terminal-o::before { content: "\edad"; } .sp-terminal-s::before { content: "\edae"; } .sp-thumbs-up::before { content: "\edaf"; } .sp-thumbs-up-o::before { content: "\edb0"; } .sp-thumbs-up-s::before { content: "\edb1"; } .sp-ticket::before { content: "\edb2"; } .sp-ticket-o::before { content: "\edb3"; } .sp-ticket-s::before { content: "\edb4"; } .sp-tin::before { content: "\edb5"; } .sp-tin-o::before { content: "\edb6"; } .sp-tin-s::before { content: "\edb7"; } .sp-tokenization::before { content: "\edb8"; } .sp-tokenization-o::before { content: "\edb9"; } .sp-tokenization-s::before { content: "\edba"; } .sp-tool::before { content: "\edbb"; } .sp-tool-o::before { content: "\edbc"; } .sp-tool-s::before { content: "\edbd"; } .sp-touch::before { content: "\edbe"; } .sp-touch-o::before { content: "\edbf"; } .sp-touch-s::before { content: "\edc0"; } .sp-tpp::before { content: "\edc1"; } .sp-tpp-o::before { content: "\edc2"; } .sp-tpp-s::before { content: "\edc3"; } .sp-train::before { content: "\edc4"; } .sp-train-o::before { content: "\edc5"; } .sp-train-s::before { content: "\edc6"; } .sp-trash::before { content: "\edc7"; } .sp-trash-o::before { content: "\edc8"; } .sp-trash-s::before { content: "\edc9"; } .sp-truck::before { content: "\edca"; } .sp-truck-o::before { content: "\edcb"; } .sp-truck-s::before { content: "\edcc"; } .sp-umbrella::before { content: "\edcd"; } .sp-umbrella-o::before { content: "\edce"; } .sp-umbrella-s::before { content: "\edcf"; } .sp-unicorn::before { content: "\edd0"; } .sp-unicorn-o::before { content: "\edd1"; } .sp-unicorn-s::before { content: "\edd2"; } .sp-unlock::before { content: "\edd3"; } .sp-unlock-o::before { content: "\edd4"; } .sp-unlock-s::before { content: "\edd5"; } .sp-upload::before { content: "\edd6"; } .sp-upload-o::before { content: "\edd7"; } .sp-upload-s::before { content: "\edd8"; } .sp-usb::before { content: "\edd9"; } .sp-usb-o::before { content: "\edda"; } .sp-usb-s::before { content: "\eddb"; } .sp-vienna::before { content: "\eddc"; } .sp-vienna-o::before { content: "\eddd"; } .sp-vienna-s::before { content: "\edde"; } .sp-viking::before { content: "\eddf"; } .sp-viking-o::before { content: "\ede0"; } .sp-viking-s::before { content: "\ede1"; } .sp-virus::before { content: "\ede2"; } .sp-virus-busines-o::before { content: "\ede3"; } .sp-virus-business::before { content: "\ede4"; } .sp-virus-business-o::before { content: "\ede5"; } .sp-virus-business-s::before { content: "\ede6"; } .sp-virus-document::before { content: "\ede7"; } .sp-virus-document-o::before { content: "\ede8"; } .sp-virus-document-s::before { content: "\ede9"; } .sp-virus-home::before { content: "\edea"; } .sp-virus-home-o::before { content: "\edeb"; } .sp-virus-home-s::before { content: "\edec"; } .sp-virus-leadership::before { content: "\eded"; } .sp-virus-leadership-o::before { content: "\edee"; } .sp-virus-leadership-s::before { content: "\edef"; } .sp-virus-marker::before { content: "\edf0"; } .sp-virus-marker-o::before { content: "\edf1"; } .sp-virus-marker-s::before { content: "\edf2"; } .sp-virus-o::before { content: "\edf3"; } .sp-virus-paragraph::before { content: "\edf4"; } .sp-virus-paragraph-o::before { content: "\edf5"; } .sp-virus-paragraph-s::before { content: "\edf6"; } .sp-virus-person::before { content: "\edf7"; } .sp-virus-person-o::before { content: "\edf8"; } .sp-virus-person-s::before { content: "\edf9"; } .sp-virus-s::before { content: "\edfa"; } .sp-virus-spirit::before { content: "\edfb"; } .sp-virus-spirit-o::before { content: "\edfc"; } .sp-virus-spirit-s::before { content: "\edfd"; } .sp-volume::before { content: "\edfe"; } .sp-volume-o::before { content: "\edff"; } .sp-volume-s::before { content: "\ee00"; } .sp-wallet::before { content: "\ee01"; } .sp-wallet-o::before { content: "\ee02"; } .sp-wallet-s::before { content: "\ee03"; } .sp-warning::before { content: "\ee04"; } .sp-warning-o::before { content: "\ee05"; } .sp-warning-s::before { content: "\ee06"; } .sp-water::before { content: "\ee07"; } .sp-water-o::before { content: "\ee08"; } .sp-water-s::before { content: "\ee09"; } .sp-way-up::before { content: "\ee0a"; } .sp-way-up-o::before { content: "\ee0b"; } .sp-way-up-s::before { content: "\ee0c"; } .sp-wc-handicap::before { content: "\ee0d"; } .sp-wc-handicap-o::before { content: "\ee0e"; } .sp-wc-handicap-s::before { content: "\ee0f"; } .sp-wc-man::before { content: "\ee10"; } .sp-wc-man-o::before { content: "\ee11"; } .sp-wc-man-s::before { content: "\ee12"; } .sp-wc-men::before { content: "\ee13"; } .sp-wc-men-o::before { content: "\ee14"; } .sp-wc-men-s::before { content: "\ee15"; } .sp-wc-woman::before { content: "\ee16"; } .sp-wc-woman-o::before { content: "\ee17"; } .sp-wc-woman-s::before { content: "\ee18"; } .sp-wearable::before { content: "\ee19"; } .sp-wearable-o::before { content: "\ee1a"; } .sp-wearable-s::before { content: "\ee1b"; } .sp-wearables::before { content: "\ee1c"; } .sp-wearables-o::before { content: "\ee1d"; } .sp-wearables-s::before { content: "\ee1e"; } .sp-webinar::before { content: "\ee1f"; } .sp-webinar-o::before { content: "\ee20"; } .sp-webinar-s::before { content: "\ee21"; } .sp-webshop::before { content: "\ee22"; } .sp-webshop-o::before { content: "\ee23"; } .sp-webshop-s::before { content: "\ee24"; } .sp-wheel::before { content: "\ee25"; } .sp-wheel-o::before { content: "\ee26"; } .sp-wheel-s::before { content: "\ee27"; } .sp-wlan::before { content: "\ee28"; } .sp-wlan-bluetooth::before { content: "\ee29"; } .sp-wlan-bluetooth-o::before { content: "\ee2a"; } .sp-wlan-bluetooth-s::before { content: "\ee2b"; } .sp-wlan-o::before { content: "\ee2c"; } .sp-wlan-s::before { content: "\ee2d"; } .sp-worker-protection::before { content: "\ee2e"; } .sp-worker-protection-o::before { content: "\ee2f"; } .sp-worker-protection-s::before { content: "\ee30"; } .sp-x::before { content: "\ee31"; } .sp-x-o::before { content: "\ee32"; } .sp-x-s::before { content: "\ee33"; } .sp-zurich::before { content: "\ee34"; } .sp-zurich-o::before { content: "\ee35"; } .sp-zurich-s::before { content: "\ee36"; } /* contains CSS variables with pictogram icons */ .btn, .buttonlink, .list-with-btn .teaser-link, button[type="submit"], button[type="reset"], input[type="submit"], input[type="reset"] { background-color: rgb(222, 57, 25); border: 1px solid transparent; border-radius: 0; box-shadow: none; color: rgb(255, 255, 255); cursor: pointer; display: inline-block; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-size: 1rem; font-weight: 400; line-height: 1.64; outline: none; padding: 0.500em 1.438em; position: relative; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; text-align: center; text-decoration: none; -webkit-transition: background 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: background 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); vertical-align: middle; word-break: normal; /* Corrects inability to style clickable `input` types in iOS. */ -webkit-appearance: none } .btn:active, .btn:focus, .buttonlink:active, .buttonlink:focus, .list-with-btn .teaser-link:active, .list-with-btn .teaser-link:focus, button[type="submit"]:active, button[type="submit"]:focus, button[type="reset"]:active, button[type="reset"]:focus, input[type="submit"]:active, input[type="submit"]:focus, input[type="reset"]:active, input[type="reset"]:focus { /* background-color: color(var(--color-six-red) shade(10%)); */ background-color: #c83317; color: rgb(255, 255, 255); -webkit-tap-highlight-color: rgba(#000, 0); outline: none; text-decoration: none; } .btn:hover, .buttonlink:hover, .list-with-btn .teaser-link:hover, button[type="submit"]:hover, button[type="reset"]:hover, input[type="submit"]:hover, input[type="reset"]:hover { /* background-color: color(var(--color-six-red) shade(10%)); */ background-color: #c83317; color: rgb(255, 255, 255); text-decoration: none; } .btn:active, .buttonlink:active, .list-with-btn .teaser-link:active, button[type="submit"]:active, button[type="reset"]:active, input[type="submit"]:active, input[type="reset"]:active { -webkit-transform: scale(.98); transform: scale(.98); } .btn.btn-compact, .buttonlink.btn-compact, .list-with-btn .teaser-link.btn-compact, button[type="submit"].btn-compact, button[type="reset"].btn-compact, input[type="submit"].btn-compact, input[type="reset"].btn-compact { font-size: 0.875rem; padding: 0.357em 1.286em; } .btn.btn-link, .buttonlink.btn-link, .list-with-btn .teaser-link.btn-link, button[type="submit"].btn-link, button[type="reset"].btn-link, input[type="submit"].btn-link, input[type="reset"].btn-link { border: 0; color: #4997b7; font-weight: 700; display: inline-block; padding-left: 0; background: transparent; } .btn.btn-link:active, .btn.btn-link:focus, .btn.btn-link:hover, .buttonlink.btn-link:active, .buttonlink.btn-link:focus, .buttonlink.btn-link:hover, .list-with-btn .teaser-link.btn-link:active, .list-with-btn .teaser-link.btn-link:focus, .list-with-btn .teaser-link.btn-link:hover, button[type="submit"].btn-link:active, button[type="submit"].btn-link:focus, button[type="submit"].btn-link:hover, button[type="reset"].btn-link:active, button[type="reset"].btn-link:focus, button[type="reset"].btn-link:hover, input[type="submit"].btn-link:active, input[type="submit"].btn-link:focus, input[type="submit"].btn-link:hover, input[type="reset"].btn-link:active, input[type="reset"].btn-link:focus, input[type="reset"].btn-link:hover { color: #4a7485; background: transparent; } .btn.disabled, .btn[disabled], .buttonlink.disabled, .buttonlink[disabled], .list-with-btn .teaser-link.disabled, .list-with-btn .teaser-link[disabled], button[type="submit"].disabled, button[type="submit"][disabled], button[type="reset"].disabled, button[type="reset"][disabled], input[type="submit"].disabled, input[type="submit"][disabled], input[type="reset"].disabled, input[type="reset"][disabled] { background-color: #f2f2f2; border: solid 1px rgb(113, 113, 113); color: rgb(113, 113, 113); cursor: not-allowed; opacity: 0.6 } .btn.disabled:hover, .btn[disabled]:hover, .buttonlink.disabled:hover, .buttonlink[disabled]:hover, .list-with-btn .teaser-link.disabled:hover, .list-with-btn .teaser-link[disabled]:hover, button[type="submit"].disabled:hover, button[type="submit"][disabled]:hover, button[type="reset"].disabled:hover, button[type="reset"][disabled]:hover, input[type="submit"].disabled:hover, input[type="submit"][disabled]:hover, input[type="reset"].disabled:hover, input[type="reset"][disabled]:hover { background-color: #f2f2f2; border: solid 1px rgb(113, 113, 113); color: rgb(113, 113, 113) } .btn.disabled:hover:before, .btn.disabled:hover:after, .btn[disabled]:hover:before, .btn[disabled]:hover:after, .buttonlink.disabled:hover:before, .buttonlink.disabled:hover:after, .buttonlink[disabled]:hover:before, .buttonlink[disabled]:hover:after, .list-with-btn .teaser-link.disabled:hover:before, .list-with-btn .teaser-link.disabled:hover:after, .list-with-btn .teaser-link[disabled]:hover:before, .list-with-btn .teaser-link[disabled]:hover:after, button[type="submit"].disabled:hover:before, button[type="submit"].disabled:hover:after, button[type="submit"][disabled]:hover:before, button[type="submit"][disabled]:hover:after, button[type="reset"].disabled:hover:before, button[type="reset"].disabled:hover:after, button[type="reset"][disabled]:hover:before, button[type="reset"][disabled]:hover:after, input[type="submit"].disabled:hover:before, input[type="submit"].disabled:hover:after, input[type="submit"][disabled]:hover:before, input[type="submit"][disabled]:hover:after, input[type="reset"].disabled:hover:before, input[type="reset"].disabled:hover:after, input[type="reset"][disabled]:hover:before, input[type="reset"][disabled]:hover:after { display: none; } input[type=text]::-ms-clear { display: none; } .fieldset a.inline { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; vertical-align: bottom; margin-right: 1rem; display: inline-block; padding-bottom: 0.53rem; } .btn, .buttonlink, button[type="submit"], button[type="reset"] { /* icons */ } .btn .fa, .buttonlink .fa, button[type="submit"] .fa, button[type="reset"] .fa { margin-right: 1em; } .btn .fa[class*='sp-'], .buttonlink .fa[class*='sp-'], button[type="submit"] .fa[class*='sp-'], button[type="reset"] .fa[class*='sp-'] { vertical-align: middle; } .btn-icon-only { padding: 0.5em; min-width: 3rem } .btn-icon-only.btn-compact { padding: 0.357em; } .btn-icon-only .fa { margin-right: 0; } .btn-icon-only.filter-submit:active { -webkit-transform: none; transform: none; } .page-content a.btn[target="_blank"]:after, .page-content a.buttonlink[target="_blank"]:after { content: none; } .btn-loader-icon { display: inline-block; text-align: right; visibility: hidden; white-space: nowrap; width: 0; opacity: 0; -webkit-transition: width calc(0.2s - 0.05) 0.2s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.2s, visibility 0s 0.2s; transition: width calc(0.2s - 0.05) 0.2s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.2s, visibility 0s 0.2s } .btn-loader-icon span { width: 4px; height: 4px; border-radius: 50%; background: white; -webkit-animation: ball .45s cubic-bezier(0, 0, 0.15, 1) alternate infinite; animation: ball .45s cubic-bezier(0, 0, 0.15, 1) alternate infinite; display: inline-block; margin: 0 3px; -webkit-animation-delay: .15s; animation-delay: .15s } .btn-loader-icon span:first-child { left: -10px; -webkit-animation-delay: 0s; animation-delay: 0s; } .btn-loader-icon span:last-child { left: 10px; -webkit-animation-delay: .3s; animation-delay: .3s; } .btn-loading { pointer-events: none; } .btn-loading .btn-loader-icon { visibility: visible; width: 46px; opacity: 1; -webkit-transition: width calc(0.2s - 0.05) cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.2s, visibility 0s 0s; transition: width calc(0.2s - 0.05) cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.2s, visibility 0s 0s; } .btn-secondary.btn-loading .btn-loader-icon { visibility: inherit } .btn-secondary.btn-loading .btn-loader-icon span { /* background: color(var(--color-clay) shade(20%)); */ background: #8a827a; } .btn-secondary.btn-loading:hover .btn-loader-icon span, .btn-secondary.btn-loading:active .btn-loader-icon span { background: rgb(255, 255, 255); } .btn + .btn, .buttonlink + .buttonlink, .pull-left + .pull-left, input[type="submit"] + input[type="reset"] { margin-left: 1rem; } .pull-right + .pull-right { margin-left: 0; margin-right: 1rem; } .btn-secondary, .list-with-btn .teaser-link, input[type="reset"], button.btn-secondary, input.btn-secondary { /* color: color(var(--color-clay) shade(20%)); */ color: #8a827a; background: transparent; /* border: 1px solid color(var(--color-clay) shade(20%)); */ border: 1px solid #8a827a; } .section.color-inverted .list-with-btn .teaser-link { border-color: rgb(255, 255, 255); } .btn-secondary:focus, .btn-secondary:hover, .list-with-btn a:focus .teaser-link, .list-with-btn a:hover .teaser-link, input[type="reset"]:focus, input[type="reset"]:hover, button.btn-secondary:focus, button.btn-secondary:hover, input.btn-secondary:focus, input.btn-secondary:hover { color: rgb(255, 255, 255); /* background: color(var(--color-clay) shade(20%)); */ background: #8a827a; } .section.color-inverted .list-with-btn a:focus .teaser-link, .section.color-inverted .list-with-btn a:hover .teaser-link { background-color: rgb(255, 255, 255); color: rgb(78, 78, 78); } .bg-red button.btn:not(.btn-secondary), .bg-red input[type="submit"], .bg-red .btn-primary { background-color: rgb(255, 255, 255); color: rgb(78, 78, 78) } .bg-red button.btn:not(.btn-secondary):hover, .bg-red input[type="submit"]:hover, .bg-red .btn-primary:hover { background-color: rgba(255, 255, 255, .9); } /* Magic rules */ .dependency-fullpage .btn-secondary, .bg-red .btn-secondary, .bg-rock .btn-secondary, .bg-clay .btn-secondary, .bg-rock-90 .btn-secondary, .bg-marine .btn-secondary { -webkit-transition: color .5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: color .5s cubic-bezier(0.165, 0.84, 0.44, 1); color: rgb(255, 255, 255); border: 1px solid rgb(255, 255, 255); background: transparent; overflow: hidden } .dependency-fullpage .btn-secondary span, .bg-red .btn-secondary span, .bg-rock .btn-secondary span, .bg-clay .btn-secondary span, .bg-rock-90 .btn-secondary span, .bg-marine .btn-secondary span { position: relative; z-index: 2; } .dependency-fullpage .btn-secondary:after, .dependency-fullpage .btn-secondary:before, .bg-red .btn-secondary:after, .bg-red .btn-secondary:before, .bg-rock .btn-secondary:after, .bg-rock .btn-secondary:before, .bg-clay .btn-secondary:after, .bg-clay .btn-secondary:before, .bg-rock-90 .btn-secondary:after, .bg-rock-90 .btn-secondary:before, .bg-marine .btn-secondary:after, .bg-marine .btn-secondary:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 103%; /* background: color(var(--color-white) alpha(40%)); */ background: rgba(255, 255, 255, 0.4); z-index: 1; -webkit-transition: -webkit-transform .5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: -webkit-transform .5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform .5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform .5s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform .5s cubic-bezier(0.165, 0.84, 0.44, 1); -webkit-transform: translate3d(0, -101%, 0); transform: translate3d(0, -101%, 0); } .dependency-fullpage .btn-secondary:after, .bg-red .btn-secondary:after, .bg-rock .btn-secondary:after, .bg-clay .btn-secondary:after, .bg-rock-90 .btn-secondary:after, .bg-marine .btn-secondary:after { background: rgb(255, 255, 255); -webkit-transition-delay: .1s; transition-delay: .1s; } .dependency-fullpage .btn-secondary:focus, .dependency-fullpage .btn-secondary:hover, .bg-red .btn-secondary:focus, .bg-red .btn-secondary:hover, .bg-rock .btn-secondary:focus, .bg-rock .btn-secondary:hover, .bg-clay .btn-secondary:focus, .bg-clay .btn-secondary:hover, .bg-rock-90 .btn-secondary:focus, .bg-rock-90 .btn-secondary:hover, .bg-marine .btn-secondary:focus, .bg-marine .btn-secondary:hover { text-decoration: none; color: rgb(78, 78, 78); background: transparent } .dependency-fullpage .btn-secondary:focus:after, .dependency-fullpage .btn-secondary:focus:before, .dependency-fullpage .btn-secondary:hover:after, .dependency-fullpage .btn-secondary:hover:before, .bg-red .btn-secondary:focus:after, .bg-red .btn-secondary:focus:before, .bg-red .btn-secondary:hover:after, .bg-red .btn-secondary:hover:before, .bg-rock .btn-secondary:focus:after, .bg-rock .btn-secondary:focus:before, .bg-rock .btn-secondary:hover:after, .bg-rock .btn-secondary:hover:before, .bg-clay .btn-secondary:focus:after, .bg-clay .btn-secondary:focus:before, .bg-clay .btn-secondary:hover:after, .bg-clay .btn-secondary:hover:before, .bg-rock-90 .btn-secondary:focus:after, .bg-rock-90 .btn-secondary:focus:before, .bg-rock-90 .btn-secondary:hover:after, .bg-rock-90 .btn-secondary:hover:before, .bg-marine .btn-secondary:focus:after, .bg-marine .btn-secondary:focus:before, .bg-marine .btn-secondary:hover:after, .bg-marine .btn-secondary:hover:before { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .btn-block { width: 100%; } .btn-large { min-width: 66.6666%; } .btn-medium { min-width: 50%; } .btn-small { min-width: 33.3333%; } .btn-inline { width: auto; } .juicer-button, .j-loading { display: none; } @-webkit-keyframes ball { from { -webkit-transform: translateY(0) scaleY(.8); transform: translateY(0) scaleY(.8); } to { -webkit-transform: translateY(-10px); transform: translateY(-10px); } } @keyframes ball { from { -webkit-transform: translateY(0) scaleY(.8); transform: translateY(0) scaleY(.8); } to { -webkit-transform: translateY(-10px); transform: translateY(-10px); } } @media print { .button_link { display: none; } } /* Play Button */ /* For now, this only appears within certain components */ .home-header .btn-primary { padding: 0.625em 2em 0.51em 2.1em; background: rgba(0,0,0,.4) /* overwrite some strong styles from elsewhere */ } .home-header .btn-primary.btn-primary.btn-primary { margin-bottom: -0.5em; } .home-header .btn-primary .fa { font-size: 20px; } .home-header .btn-primary:hover { background: rgb(222, 57, 25); } @media (min-width: 48em) { .hero-header { /* Video Button */ } .hero-header .btn-primary { padding: 0.625em 2em 0.51em 2.1em; background: rgba(0,0,0,.4) /* overwrite some strong styles from elsewhere */ } .hero-header .btn-primary.btn-primary.btn-primary { margin-bottom: -0.5em; } .hero-header .btn-primary .fa { font-size: 20px; } .hero-header .btn-primary:hover { background: rgb(222, 57, 25); color: rgb(255, 255, 255); } header a.btn.btn-header-standard { background: rgba(0,0,0,.55); } header { /* excluding Flyout from styling SIX-7672 */ } header .login-fullpage a.btn.btn-header-standard.btn-secondary, header .login-fullpage a.btn.btn-header-standard.btn-link { background: inherit; } header a.btn.btn-header-light { background: rgba(255, 255, 255, 0.55); color: rgb(0,0,0); } header a.btn.btn-header-red { background: rgb(222, 57, 25); } header a.btn.btn-header-red:hover { background: #b22e14; } } /* Play Button -- mobile layout */ @media (max-width: 47.999em) { .hero-header .btn-primary { padding: 0.625em 2em 0.51em 2.1em } .hero-header .btn-primary.btn-primary.btn-primary { margin-bottom: -0.5em; } } .fa.sp-flag-switzerland { background-color: #fff !important; color: #f00 !important; } /*! * Font Awesome 4.7.0 by @davegandy - http://fontawesome.io - @fontawesome * License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License) */ @font-face { font-family: 'FontAwesome'; src: url('build/fonts/fontawesome/fontawesome-webfont.eot?d980c2ce873dc43a'); src: url('build/fonts/fontawesome/fontawesome-webfont.eot?d980c2ce873dc43a') format('embedded-opentype'), url('build/fonts/fontawesome/fontawesome-webfont.woff2?d6f48cba7d076fb6') format('woff2'), url('build/fonts/fontawesome/fontawesome-webfont.woff?28b782240b3e76db') format('woff'), url('build/fonts/fontawesome/fontawesome-webfont.ttf?13b1eab65a983c7a') format('truetype'), url('build/fonts/fontawesome/fontawesome-webfont.svg?98a8aa5cf7d62c2e') format('svg'); font-weight: normal; font-style: normal; font-display: swap; } .fa { display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; text-transform: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* makes the font 33% larger relative to the icon container */ .fa-lg { font-size: 1.33333333em; line-height: 0.75em; vertical-align: -15%; } .fa-2x { font-size: 2em; } .fa-3x { font-size: 3em; } .fa-4x { font-size: 4em; } .fa-5x { font-size: 5em; } .fa-fw { width: 1.28571429em; text-align: center; } .fa-ul { padding-left: 0; margin-left: 2.14285714em; list-style-type: none; } .fa-ul > li { position: relative; } .fa-li { position: absolute; left: -2.14285714em; width: 2.14285714em; top: 0.14285714em; text-align: center; } .fa-li.fa-lg { left: -1.85714286em; } .fa-border { padding: .2em .25em .15em; border: solid 0.08em #eeeeee; border-radius: .1em; } .fa-pull-left { float: left; } .fa-pull-right { float: right; } .fa.fa-pull-left { margin-right: .3em; } .fa.fa-pull-right { margin-left: .3em; } /* Deprecated as of 4.4.0 */ .pull-right { float: right; } .pull-left { float: left; } .fa.pull-left { margin-right: .3em; } .fa.pull-right { margin-left: .3em; } .fa-spin { -webkit-animation: fa-spin 2s infinite linear; animation: fa-spin 2s infinite linear; } .fa-pulse { -webkit-animation: fa-spin 1s infinite steps(8); animation: fa-spin 1s infinite steps(8); } @-webkit-keyframes fa-spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(359deg); transform: rotate(359deg); } } @keyframes fa-spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(359deg); transform: rotate(359deg); } } .fa-rotate-90 { -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(90deg); transform: rotate(90deg); } .fa-rotate-180 { -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)"; -webkit-transform: rotate(180deg); transform: rotate(180deg); } .fa-rotate-270 { -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)"; -webkit-transform: rotate(270deg); transform: rotate(270deg); } .fa-flip-horizontal { -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)"; -webkit-transform: scale(-1, 1); transform: scale(-1, 1); } .fa-flip-vertical { -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)"; -webkit-transform: scale(1, -1); transform: scale(1, -1); } :root .fa-rotate-90, :root .fa-rotate-180, :root .fa-rotate-270, :root .fa-flip-horizontal, :root .fa-flip-vertical { -webkit-filter: none; filter: none; } .fa-stack { position: relative; display: inline-block; width: 2em; height: 2em; line-height: 2em; vertical-align: middle; } .fa-stack-1x, .fa-stack-2x { position: absolute; left: 0; width: 100%; text-align: center; } .fa-stack-1x { line-height: inherit; } .fa-stack-2x { font-size: 2em; } .fa-inverse { color: #ffffff; } /* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen readers do not read off random characters that represent icons */ .fa-glass:before { content: "\f000"; } .fa-music:before { content: "\f001"; } .fa-search:before { content: "\f002"; } .fa-envelope-o:before { content: "\f003"; } .fa-heart:before { content: "\f004"; } .fa-star:before { content: "\f005"; } .fa-star-o:before { content: "\f006"; } .fa-user:before { content: "\f007"; } .fa-film:before { content: "\f008"; } .fa-th-large:before { content: "\f009"; } .fa-th:before { content: "\f00a"; } .fa-th-list:before { content: "\f00b"; } .fa-check:before { content: "\f00c"; } .fa-remove:before, .fa-close:before, .fa-times:before { content: "\f00d"; } .fa-search-plus:before { content: "\f00e"; } .fa-search-minus:before { content: "\f010"; } .fa-power-off:before { content: "\f011"; } .fa-signal:before { content: "\f012"; } .fa-gear:before, .fa-cog:before { content: "\f013"; } .fa-trash-o:before { content: "\f014"; } .fa-home:before { content: "\f015"; } .fa-file-o:before { content: "\f016"; } .fa-clock-o:before { content: "\f017"; } .fa-road:before { content: "\f018"; } .fa-download:before { content: "\f019"; } .fa-arrow-circle-o-down:before { content: "\f01a"; } .fa-arrow-circle-o-up:before { content: "\f01b"; } .fa-inbox:before { content: "\f01c"; } .fa-play-circle-o:before { content: "\f01d"; } .fa-rotate-right:before, .fa-repeat:before { content: "\f01e"; } .fa-refresh:before { content: "\f021"; } .fa-list-alt:before { content: "\f022"; } .fa-lock:before { content: "\f023"; } .fa-flag:before { content: "\f024"; } .fa-headphones:before { content: "\f025"; } .fa-volume-off:before { content: "\f026"; } .fa-volume-down:before { content: "\f027"; } .fa-volume-up:before { content: "\f028"; } .fa-qrcode:before { content: "\f029"; } .fa-barcode:before { content: "\f02a"; } .fa-tag:before { content: "\f02b"; } .fa-tags:before { content: "\f02c"; } .fa-book:before { content: "\f02d"; } .fa-bookmark:before { content: "\f02e"; } .fa-print:before { content: "\f02f"; } .fa-camera:before { content: "\f030"; } .fa-font:before { content: "\f031"; } .fa-bold:before { content: "\f032"; } .fa-italic:before { content: "\f033"; } .fa-text-height:before { content: "\f034"; } .fa-text-width:before { content: "\f035"; } .fa-align-left:before { content: "\f036"; } .fa-align-center:before { content: "\f037"; } .fa-align-right:before { content: "\f038"; } .fa-align-justify:before { content: "\f039"; } .fa-list:before { content: "\f03a"; } .fa-dedent:before, .fa-outdent:before { content: "\f03b"; } .fa-indent:before { content: "\f03c"; } .fa-video-camera:before { content: "\f03d"; } .fa-photo:before, .fa-image:before, .fa-picture-o:before { content: "\f03e"; } .fa-pencil:before { content: "\f040"; } .fa-map-marker:before { content: "\f041"; } .fa-adjust:before { content: "\f042"; } .fa-tint:before { content: "\f043"; } .fa-edit:before, .fa-pencil-square-o:before { content: "\f044"; } .fa-share-square-o:before { content: "\f045"; } .fa-check-square-o:before { content: "\f046"; } .fa-arrows:before { content: "\f047"; } .fa-step-backward:before { content: "\f048"; } .fa-fast-backward:before { content: "\f049"; } .fa-backward:before { content: "\f04a"; } .fa-play:before { content: "\f04b"; } .fa-pause:before { content: "\f04c"; } .fa-stop:before { content: "\f04d"; } .fa-forward:before { content: "\f04e"; } .fa-fast-forward:before { content: "\f050"; } .fa-step-forward:before { content: "\f051"; } .fa-eject:before { content: "\f052"; } .fa-chevron-left:before { content: "\f053"; } .fa-chevron-right:before { content: "\f054"; } .fa-plus-circle:before { content: "\f055"; } .fa-minus-circle:before { content: "\f056"; } .fa-times-circle:before { content: "\f057"; } .fa-check-circle:before { content: "\f058"; } .fa-question-circle:before { content: "\f059"; } .fa-info-circle:before { content: "\f05a"; } .fa-crosshairs:before { content: "\f05b"; } .fa-times-circle-o:before { content: "\f05c"; } .fa-check-circle-o:before { content: "\f05d"; } .fa-ban:before { content: "\f05e"; } .fa-arrow-left:before { content: "\f060"; } .fa-arrow-right:before { content: "\f061"; } .fa-arrow-up:before { content: "\f062"; } .fa-arrow-down:before { content: "\f063"; } .fa-mail-forward:before, .fa-share:before { content: "\f064"; } .fa-expand:before { content: "\f065"; } .fa-compress:before { content: "\f066"; } .fa-plus:before { content: "\f067"; } .fa-minus:before { content: "\f068"; } .fa-asterisk:before { content: "\f069"; } .fa-exclamation-circle:before { content: "\f06a"; } .fa-gift:before { content: "\f06b"; } .fa-leaf:before { content: "\f06c"; } .fa-fire:before { content: "\f06d"; } .fa-eye:before { content: "\f06e"; } .fa-eye-slash:before { content: "\f070"; } .fa-warning:before, .fa-exclamation-triangle:before { content: "\f071"; } .fa-plane:before { content: "\f072"; } .fa-calendar:before { content: "\f073"; } .fa-random:before { content: "\f074"; } .fa-comment:before { content: "\f075"; } .fa-magnet:before { content: "\f076"; } .fa-chevron-up:before { content: "\f077"; } .fa-chevron-down:before { content: "\f078"; } .fa-retweet:before { content: "\f079"; } .fa-shopping-cart:before { content: "\f07a"; } .fa-folder:before { content: "\f07b"; } .fa-folder-open:before { content: "\f07c"; } .fa-arrows-v:before { content: "\f07d"; } .fa-arrows-h:before { content: "\f07e"; } .fa-bar-chart-o:before, .fa-bar-chart:before { content: "\f080"; } .fa-twitter-square:before { content: "\f081"; } .fa-facebook-square:before { content: "\f082"; } .fa-camera-retro:before { content: "\f083"; } .fa-key:before { content: "\f084"; } .fa-gears:before, .fa-cogs:before { content: "\f085"; } .fa-comments:before { content: "\f086"; } .fa-thumbs-o-up:before { content: "\f087"; } .fa-thumbs-o-down:before { content: "\f088"; } .fa-star-half:before { content: "\f089"; } .fa-heart-o:before { content: "\f08a"; } .fa-sign-out:before { content: "\f08b"; } .fa-linkedin-square:before { content: "\f08c"; } .fa-thumb-tack:before { content: "\f08d"; } .fa-external-link:before { content: "\f08e"; } .fa-sign-in:before { content: "\f090"; } .fa-trophy:before { content: "\f091"; } .fa-github-square:before { content: "\f092"; } .fa-upload:before { content: "\f093"; } .fa-lemon-o:before { content: "\f094"; } .fa-phone:before { content: "\f095"; } .fa-square-o:before { content: "\f096"; } .fa-bookmark-o:before { content: "\f097"; } .fa-phone-square:before { content: "\f098"; } .fa-twitter:before { content: "\f099"; } .fa-facebook-f:before, .fa-facebook:before { content: "\f09a"; } .fa-github:before { content: "\f09b"; } .fa-unlock:before { content: "\f09c"; } .fa-credit-card:before { content: "\f09d"; } .fa-feed:before, .fa-rss:before { content: "\f09e"; } .fa-hdd-o:before { content: "\f0a0"; } .fa-bullhorn:before { content: "\f0a1"; } .fa-bell:before { content: "\f0f3"; } .fa-certificate:before { content: "\f0a3"; } .fa-hand-o-right:before { content: "\f0a4"; } .fa-hand-o-left:before { content: "\f0a5"; } .fa-hand-o-up:before { content: "\f0a6"; } .fa-hand-o-down:before { content: "\f0a7"; } .fa-arrow-circle-left:before { content: "\f0a8"; } .fa-arrow-circle-right:before { content: "\f0a9"; } .fa-arrow-circle-up:before { content: "\f0aa"; } .fa-arrow-circle-down:before { content: "\f0ab"; } .fa-globe:before { content: "\f0ac"; } .fa-wrench:before { content: "\f0ad"; } .fa-tasks:before { content: "\f0ae"; } .fa-filter:before { content: "\f0b0"; } .fa-briefcase:before { content: "\f0b1"; } .fa-arrows-alt:before { content: "\f0b2"; } .fa-group:before, .fa-users:before { content: "\f0c0"; } .fa-chain:before, .fa-link:before { content: "\f0c1"; } .fa-cloud:before { content: "\f0c2"; } .fa-flask:before { content: "\f0c3"; } .fa-cut:before, .fa-scissors:before { content: "\f0c4"; } .fa-copy:before, .fa-files-o:before { content: "\f0c5"; } .fa-paperclip:before { content: "\f0c6"; } .fa-save:before, .fa-floppy-o:before { content: "\f0c7"; } .fa-square:before { content: "\f0c8"; } .fa-navicon:before, .fa-reorder:before, .fa-bars:before { content: "\f0c9"; } .fa-list-ul:before { content: "\f0ca"; } .fa-list-ol:before { content: "\f0cb"; } .fa-strikethrough:before { content: "\f0cc"; } .fa-underline:before { content: "\f0cd"; } .fa-table:before { content: "\f0ce"; } .fa-magic:before { content: "\f0d0"; } .fa-truck:before { content: "\f0d1"; } .fa-pinterest:before { content: "\f0d2"; } .fa-pinterest-square:before { content: "\f0d3"; } .fa-google-plus-square:before { content: "\f0d4"; } .fa-google-plus:before { content: "\f0d5"; } .fa-money:before { content: "\f0d6"; } .fa-caret-down:before { content: "\f0d7"; } .fa-caret-up:before { content: "\f0d8"; } .fa-caret-left:before { content: "\f0d9"; } .fa-caret-right:before { content: "\f0da"; } .fa-columns:before { content: "\f0db"; } .fa-unsorted:before, .fa-sort:before { content: "\f0dc"; } .fa-sort-down:before, .fa-sort-desc:before { content: "\f0dd"; } .fa-sort-up:before, .fa-sort-asc:before { content: "\f0de"; } .fa-envelope:before { content: "\f0e0"; } .fa-linkedin:before { content: "\f0e1"; } .fa-rotate-left:before, .fa-undo:before { content: "\f0e2"; } .fa-legal:before, .fa-gavel:before { content: "\f0e3"; } .fa-dashboard:before, .fa-tachometer:before { content: "\f0e4"; } .fa-comment-o:before { content: "\f0e5"; } .fa-comments-o:before { content: "\f0e6"; } .fa-flash:before, .fa-bolt:before { content: "\f0e7"; } .fa-sitemap:before { content: "\f0e8"; } .fa-umbrella:before { content: "\f0e9"; } .fa-paste:before, .fa-clipboard:before { content: "\f0ea"; } .fa-lightbulb-o:before { content: "\f0eb"; } .fa-exchange:before { content: "\f0ec"; } .fa-cloud-download:before { content: "\f0ed"; } .fa-cloud-upload:before { content: "\f0ee"; } .fa-user-md:before { content: "\f0f0"; } .fa-stethoscope:before { content: "\f0f1"; } .fa-suitcase:before { content: "\f0f2"; } .fa-bell-o:before { content: "\f0a2"; } .fa-coffee:before { content: "\f0f4"; } .fa-cutlery:before { content: "\f0f5"; } .fa-file-text-o:before { content: "\f0f6"; } .fa-building-o:before { content: "\f0f7"; } .fa-hospital-o:before { content: "\f0f8"; } .fa-ambulance:before { content: "\f0f9"; } .fa-medkit:before { content: "\f0fa"; } .fa-fighter-jet:before { content: "\f0fb"; } .fa-beer:before { content: "\f0fc"; } .fa-h-square:before { content: "\f0fd"; } .fa-plus-square:before { content: "\f0fe"; } .fa-angle-double-left:before { content: "\f100"; } .fa-angle-double-right:before { content: "\f101"; } .fa-angle-double-up:before { content: "\f102"; } .fa-angle-double-down:before { content: "\f103"; } .fa-angle-left:before { content: "\f104"; } .fa-angle-right:before { content: "\f105"; } .fa-angle-up:before { content: "\f106"; } .fa-angle-down:before { content: "\f107"; } .fa-desktop:before { content: "\f108"; } .fa-laptop:before { content: "\f109"; } .fa-tablet:before { content: "\f10a"; } .fa-mobile-phone:before, .fa-mobile:before { content: "\f10b"; } .fa-circle-o:before { content: "\f10c"; } .fa-quote-left:before { content: "\f10d"; } .fa-quote-right:before { content: "\f10e"; } .fa-spinner:before { content: "\f110"; } .fa-circle:before { content: "\f111"; } .fa-mail-reply:before, .fa-reply:before { content: "\f112"; } .fa-github-alt:before { content: "\f113"; } .fa-folder-o:before { content: "\f114"; } .fa-folder-open-o:before { content: "\f115"; } .fa-smile-o:before { content: "\f118"; } .fa-frown-o:before { content: "\f119"; } .fa-meh-o:before { content: "\f11a"; } .fa-gamepad:before { content: "\f11b"; } .fa-keyboard-o:before { content: "\f11c"; } .fa-flag-o:before { content: "\f11d"; } .fa-flag-checkered:before { content: "\f11e"; } .fa-terminal:before { content: "\f120"; } .fa-code:before { content: "\f121"; } .fa-mail-reply-all:before, .fa-reply-all:before { content: "\f122"; } .fa-star-half-empty:before, .fa-star-half-full:before, .fa-star-half-o:before { content: "\f123"; } .fa-location-arrow:before { content: "\f124"; } .fa-crop:before { content: "\f125"; } .fa-code-fork:before { content: "\f126"; } .fa-unlink:before, .fa-chain-broken:before { content: "\f127"; } .fa-question:before { content: "\f128"; } .fa-info:before { content: "\f129"; } .fa-exclamation:before { content: "\f12a"; } .fa-superscript:before { content: "\f12b"; } .fa-subscript:before { content: "\f12c"; } .fa-eraser:before { content: "\f12d"; } .fa-puzzle-piece:before { content: "\f12e"; } .fa-microphone:before { content: "\f130"; } .fa-microphone-slash:before { content: "\f131"; } .fa-shield:before { content: "\f132"; } .fa-calendar-o:before { content: "\f133"; } .fa-fire-extinguisher:before { content: "\f134"; } .fa-rocket:before { content: "\f135"; } .fa-maxcdn:before { content: "\f136"; } .fa-chevron-circle-left:before { content: "\f137"; } .fa-chevron-circle-right:before { content: "\f138"; } .fa-chevron-circle-up:before { content: "\f139"; } .fa-chevron-circle-down:before { content: "\f13a"; } .fa-html5:before { content: "\f13b"; } .fa-css3:before { content: "\f13c"; } .fa-anchor:before { content: "\f13d"; } .fa-unlock-alt:before { content: "\f13e"; } .fa-bullseye:before { content: "\f140"; } .fa-ellipsis-h:before { content: "\f141"; } .fa-ellipsis-v:before { content: "\f142"; } .fa-rss-square:before { content: "\f143"; } .fa-play-circle:before { content: "\f144"; } .fa-ticket:before { content: "\f145"; } .fa-minus-square:before { content: "\f146"; } .fa-minus-square-o:before { content: "\f147"; } .fa-level-up:before { content: "\f148"; } .fa-level-down:before { content: "\f149"; } .fa-check-square:before { content: "\f14a"; } .fa-pencil-square:before { content: "\f14b"; } .fa-external-link-square:before { content: "\f14c"; } .fa-share-square:before { content: "\f14d"; } .fa-compass:before { content: "\f14e"; } .fa-toggle-down:before, .fa-caret-square-o-down:before { content: "\f150"; } .fa-toggle-up:before, .fa-caret-square-o-up:before { content: "\f151"; } .fa-toggle-right:before, .fa-caret-square-o-right:before { content: "\f152"; } .fa-euro:before, .fa-eur:before { content: "\f153"; } .fa-gbp:before { content: "\f154"; } .fa-dollar:before, .fa-usd:before { content: "\f155"; } .fa-rupee:before, .fa-inr:before { content: "\f156"; } .fa-cny:before, .fa-rmb:before, .fa-yen:before, .fa-jpy:before { content: "\f157"; } .fa-ruble:before, .fa-rouble:before, .fa-rub:before { content: "\f158"; } .fa-won:before, .fa-krw:before { content: "\f159"; } .fa-bitcoin:before, .fa-btc:before { content: "\f15a"; } .fa-file:before { content: "\f15b"; } .fa-file-text:before { content: "\f15c"; } .fa-sort-alpha-asc:before { content: "\f15d"; } .fa-sort-alpha-desc:before { content: "\f15e"; } .fa-sort-amount-asc:before { content: "\f160"; } .fa-sort-amount-desc:before { content: "\f161"; } .fa-sort-numeric-asc:before { content: "\f162"; } .fa-sort-numeric-desc:before { content: "\f163"; } .fa-thumbs-up:before { content: "\f164"; } .fa-thumbs-down:before { content: "\f165"; } .fa-youtube-square:before { content: "\f166"; } .fa-youtube:before { content: "\f167"; } .fa-xing:before { content: "\f168"; } .fa-xing-square:before { content: "\f169"; } .fa-youtube-play:before { content: "\f16a"; } .fa-dropbox:before { content: "\f16b"; } .fa-stack-overflow:before { content: "\f16c"; } .fa-instagram:before { content: "\f16d"; } .fa-flickr:before { content: "\f16e"; } .fa-adn:before { content: "\f170"; } .fa-bitbucket:before { content: "\f171"; } .fa-bitbucket-square:before { content: "\f172"; } .fa-tumblr:before { content: "\f173"; } .fa-tumblr-square:before { content: "\f174"; } .fa-long-arrow-down:before { content: "\f175"; } .fa-long-arrow-up:before { content: "\f176"; } .fa-long-arrow-left:before { content: "\f177"; } .fa-long-arrow-right:before { content: "\f178"; } .fa-apple:before { content: "\f179"; } .fa-windows:before { content: "\f17a"; } .fa-android:before { content: "\f17b"; } .fa-linux:before { content: "\f17c"; } .fa-dribbble:before { content: "\f17d"; } .fa-skype:before { content: "\f17e"; } .fa-foursquare:before { content: "\f180"; } .fa-trello:before { content: "\f181"; } .fa-female:before { content: "\f182"; } .fa-male:before { content: "\f183"; } .fa-gittip:before, .fa-gratipay:before { content: "\f184"; } .fa-sun-o:before { content: "\f185"; } .fa-moon-o:before { content: "\f186"; } .fa-archive:before { content: "\f187"; } .fa-bug:before { content: "\f188"; } .fa-vk:before { content: "\f189"; } .fa-weibo:before { content: "\f18a"; } .fa-renren:before { content: "\f18b"; } .fa-pagelines:before { content: "\f18c"; } .fa-stack-exchange:before { content: "\f18d"; } .fa-arrow-circle-o-right:before { content: "\f18e"; } .fa-arrow-circle-o-left:before { content: "\f190"; } .fa-toggle-left:before, .fa-caret-square-o-left:before { content: "\f191"; } .fa-dot-circle-o:before { content: "\f192"; } .fa-wheelchair:before { content: "\f193"; } .fa-vimeo-square:before { content: "\f194"; } .fa-turkish-lira:before, .fa-try:before { content: "\f195"; } .fa-plus-square-o:before { content: "\f196"; } .fa-space-shuttle:before { content: "\f197"; } .fa-slack:before { content: "\f198"; } .fa-envelope-square:before { content: "\f199"; } .fa-wordpress:before { content: "\f19a"; } .fa-openid:before { content: "\f19b"; } .fa-institution:before, .fa-bank:before, .fa-university:before { content: "\f19c"; } .fa-mortar-board:before, .fa-graduation-cap:before { content: "\f19d"; } .fa-yahoo:before { content: "\f19e"; } .fa-google:before { content: "\f1a0"; } .fa-reddit:before { content: "\f1a1"; } .fa-reddit-square:before { content: "\f1a2"; } .fa-stumbleupon-circle:before { content: "\f1a3"; } .fa-stumbleupon:before { content: "\f1a4"; } .fa-delicious:before { content: "\f1a5"; } .fa-digg:before { content: "\f1a6"; } .fa-pied-piper-pp:before { content: "\f1a7"; } .fa-pied-piper-alt:before { content: "\f1a8"; } .fa-drupal:before { content: "\f1a9"; } .fa-joomla:before { content: "\f1aa"; } .fa-language:before { content: "\f1ab"; } .fa-fax:before { content: "\f1ac"; } .fa-building:before { content: "\f1ad"; } .fa-child:before { content: "\f1ae"; } .fa-paw:before { content: "\f1b0"; } .fa-spoon:before { content: "\f1b1"; } .fa-cube:before { content: "\f1b2"; } .fa-cubes:before { content: "\f1b3"; } .fa-behance:before { content: "\f1b4"; } .fa-behance-square:before { content: "\f1b5"; } .fa-steam:before { content: "\f1b6"; } .fa-steam-square:before { content: "\f1b7"; } .fa-recycle:before { content: "\f1b8"; } .fa-automobile:before, .fa-car:before { content: "\f1b9"; } .fa-cab:before, .fa-taxi:before { content: "\f1ba"; } .fa-tree:before { content: "\f1bb"; } .fa-spotify:before { content: "\f1bc"; } .fa-deviantart:before { content: "\f1bd"; } .fa-soundcloud:before { content: "\f1be"; } .fa-database:before { content: "\f1c0"; } .fa-file-pdf-o:before { content: "\f1c1"; } .fa-file-word-o:before { content: "\f1c2"; } .fa-file-excel-o:before { content: "\f1c3"; } .fa-file-powerpoint-o:before { content: "\f1c4"; } .fa-file-photo-o:before, .fa-file-picture-o:before, .fa-file-image-o:before { content: "\f1c5"; } .fa-file-zip-o:before, .fa-file-archive-o:before { content: "\f1c6"; } .fa-file-sound-o:before, .fa-file-audio-o:before { content: "\f1c7"; } .fa-file-movie-o:before, .fa-file-video-o:before { content: "\f1c8"; } .fa-file-code-o:before { content: "\f1c9"; } .fa-vine:before { content: "\f1ca"; } .fa-codepen:before { content: "\f1cb"; } .fa-jsfiddle:before { content: "\f1cc"; } .fa-life-bouy:before, .fa-life-buoy:before, .fa-life-saver:before, .fa-support:before, .fa-life-ring:before { content: "\f1cd"; } .fa-circle-o-notch:before { content: "\f1ce"; } .fa-ra:before, .fa-resistance:before, .fa-rebel:before { content: "\f1d0"; } .fa-ge:before, .fa-empire:before { content: "\f1d1"; } .fa-git-square:before { content: "\f1d2"; } .fa-git:before { content: "\f1d3"; } .fa-y-combinator-square:before, .fa-yc-square:before, .fa-hacker-news:before { content: "\f1d4"; } .fa-tencent-weibo:before { content: "\f1d5"; } .fa-qq:before { content: "\f1d6"; } .fa-wechat:before, .fa-weixin:before { content: "\f1d7"; } .fa-send:before, .fa-paper-plane:before { content: "\f1d8"; } .fa-send-o:before, .fa-paper-plane-o:before { content: "\f1d9"; } .fa-history:before { content: "\f1da"; } .fa-circle-thin:before { content: "\f1db"; } .fa-header:before { content: "\f1dc"; } .fa-paragraph:before { content: "\f1dd"; } .fa-sliders:before { content: "\f1de"; } .fa-share-alt:before { content: "\f1e0"; } .fa-share-alt-square:before { content: "\f1e1"; } .fa-bomb:before { content: "\f1e2"; } .fa-soccer-ball-o:before, .fa-futbol-o:before { content: "\f1e3"; } .fa-tty:before { content: "\f1e4"; } .fa-binoculars:before { content: "\f1e5"; } .fa-plug:before { content: "\f1e6"; } .fa-slideshare:before { content: "\f1e7"; } .fa-twitch:before { content: "\f1e8"; } .fa-yelp:before { content: "\f1e9"; } .fa-newspaper-o:before { content: "\f1ea"; } .fa-wifi:before { content: "\f1eb"; } .fa-calculator:before { content: "\f1ec"; } .fa-paypal:before { content: "\f1ed"; } .fa-google-wallet:before { content: "\f1ee"; } .fa-cc-visa:before { content: "\f1f0"; } .fa-cc-mastercard:before { content: "\f1f1"; } .fa-cc-discover:before { content: "\f1f2"; } .fa-cc-amex:before { content: "\f1f3"; } .fa-cc-paypal:before { content: "\f1f4"; } .fa-cc-stripe:before { content: "\f1f5"; } .fa-bell-slash:before { content: "\f1f6"; } .fa-bell-slash-o:before { content: "\f1f7"; } .fa-trash:before { content: "\f1f8"; } .fa-copyright:before { content: "\f1f9"; } .fa-at:before { content: "\f1fa"; } .fa-eyedropper:before { content: "\f1fb"; } .fa-paint-brush:before { content: "\f1fc"; } .fa-birthday-cake:before { content: "\f1fd"; } .fa-area-chart:before { content: "\f1fe"; } .fa-pie-chart:before { content: "\f200"; } .fa-line-chart:before { content: "\f201"; } .fa-lastfm:before { content: "\f202"; } .fa-lastfm-square:before { content: "\f203"; } .fa-toggle-off:before { content: "\f204"; } .fa-toggle-on:before { content: "\f205"; } .fa-bicycle:before { content: "\f206"; } .fa-bus:before { content: "\f207"; } .fa-ioxhost:before { content: "\f208"; } .fa-angellist:before { content: "\f209"; } .fa-cc:before { content: "\f20a"; } .fa-shekel:before, .fa-sheqel:before, .fa-ils:before { content: "\f20b"; } .fa-meanpath:before { content: "\f20c"; } .fa-buysellads:before { content: "\f20d"; } .fa-connectdevelop:before { content: "\f20e"; } .fa-dashcube:before { content: "\f210"; } .fa-forumbee:before { content: "\f211"; } .fa-leanpub:before { content: "\f212"; } .fa-sellsy:before { content: "\f213"; } .fa-shirtsinbulk:before { content: "\f214"; } .fa-simplybuilt:before { content: "\f215"; } .fa-skyatlas:before { content: "\f216"; } .fa-cart-plus:before { content: "\f217"; } .fa-cart-arrow-down:before { content: "\f218"; } .fa-diamond:before { content: "\f219"; } .fa-ship:before { content: "\f21a"; } .fa-user-secret:before { content: "\f21b"; } .fa-motorcycle:before { content: "\f21c"; } .fa-street-view:before { content: "\f21d"; } .fa-heartbeat:before { content: "\f21e"; } .fa-venus:before { content: "\f221"; } .fa-mars:before { content: "\f222"; } .fa-mercury:before { content: "\f223"; } .fa-intersex:before, .fa-transgender:before { content: "\f224"; } .fa-transgender-alt:before { content: "\f225"; } .fa-venus-double:before { content: "\f226"; } .fa-mars-double:before { content: "\f227"; } .fa-venus-mars:before { content: "\f228"; } .fa-mars-stroke:before { content: "\f229"; } .fa-mars-stroke-v:before { content: "\f22a"; } .fa-mars-stroke-h:before { content: "\f22b"; } .fa-neuter:before { content: "\f22c"; } .fa-genderless:before { content: "\f22d"; } .fa-facebook-official:before { content: "\f230"; } .fa-pinterest-p:before { content: "\f231"; } .fa-whatsapp:before { content: "\f232"; } .fa-server:before { content: "\f233"; } .fa-user-plus:before { content: "\f234"; } .fa-user-times:before { content: "\f235"; } .fa-hotel:before, .fa-bed:before { content: "\f236"; } .fa-viacoin:before { content: "\f237"; } .fa-train:before { content: "\f238"; } .fa-subway:before { content: "\f239"; } .fa-medium:before { content: "\f23a"; } .fa-yc:before, .fa-y-combinator:before { content: "\f23b"; } .fa-optin-monster:before { content: "\f23c"; } .fa-opencart:before { content: "\f23d"; } .fa-expeditedssl:before { content: "\f23e"; } .fa-battery-4:before, .fa-battery:before, .fa-battery-full:before { content: "\f240"; } .fa-battery-3:before, .fa-battery-three-quarters:before { content: "\f241"; } .fa-battery-2:before, .fa-battery-half:before { content: "\f242"; } .fa-battery-1:before, .fa-battery-quarter:before { content: "\f243"; } .fa-battery-0:before, .fa-battery-empty:before { content: "\f244"; } .fa-mouse-pointer:before { content: "\f245"; } .fa-i-cursor:before { content: "\f246"; } .fa-object-group:before { content: "\f247"; } .fa-object-ungroup:before { content: "\f248"; } .fa-sticky-note:before { content: "\f249"; } .fa-sticky-note-o:before { content: "\f24a"; } .fa-cc-jcb:before { content: "\f24b"; } .fa-cc-diners-club:before { content: "\f24c"; } .fa-clone:before { content: "\f24d"; } .fa-balance-scale:before { content: "\f24e"; } .fa-hourglass-o:before { content: "\f250"; } .fa-hourglass-1:before, .fa-hourglass-start:before { content: "\f251"; } .fa-hourglass-2:before, .fa-hourglass-half:before { content: "\f252"; } .fa-hourglass-3:before, .fa-hourglass-end:before { content: "\f253"; } .fa-hourglass:before { content: "\f254"; } .fa-hand-grab-o:before, .fa-hand-rock-o:before { content: "\f255"; } .fa-hand-stop-o:before, .fa-hand-paper-o:before { content: "\f256"; } .fa-hand-scissors-o:before { content: "\f257"; } .fa-hand-lizard-o:before { content: "\f258"; } .fa-hand-spock-o:before { content: "\f259"; } .fa-hand-pointer-o:before { content: "\f25a"; } .fa-hand-peace-o:before { content: "\f25b"; } .fa-trademark:before { content: "\f25c"; } .fa-registered:before { content: "\f25d"; } .fa-creative-commons:before { content: "\f25e"; } .fa-gg:before { content: "\f260"; } .fa-gg-circle:before { content: "\f261"; } .fa-tripadvisor:before { content: "\f262"; } .fa-odnoklassniki:before { content: "\f263"; } .fa-odnoklassniki-square:before { content: "\f264"; } .fa-get-pocket:before { content: "\f265"; } .fa-wikipedia-w:before { content: "\f266"; } .fa-safari:before { content: "\f267"; } .fa-chrome:before { content: "\f268"; } .fa-firefox:before { content: "\f269"; } .fa-opera:before { content: "\f26a"; } .fa-internet-explorer:before { content: "\f26b"; } .fa-tv:before, .fa-television:before { content: "\f26c"; } .fa-contao:before { content: "\f26d"; } .fa-500px:before { content: "\f26e"; } .fa-amazon:before { content: "\f270"; } .fa-calendar-plus-o:before { content: "\f271"; } .fa-calendar-minus-o:before { content: "\f272"; } .fa-calendar-times-o:before { content: "\f273"; } .fa-calendar-check-o:before { content: "\f274"; } .fa-industry:before { content: "\f275"; } .fa-map-pin:before { content: "\f276"; } .fa-map-signs:before { content: "\f277"; } .fa-map-o:before { content: "\f278"; } .fa-map:before { content: "\f279"; } .fa-commenting:before { content: "\f27a"; } .fa-commenting-o:before { content: "\f27b"; } .fa-houzz:before { content: "\f27c"; } .fa-vimeo:before { content: "\f27d"; } .fa-black-tie:before { content: "\f27e"; } .fa-fonticons:before { content: "\f280"; } .fa-reddit-alien:before { content: "\f281"; } .fa-edge:before { content: "\f282"; } .fa-credit-card-alt:before { content: "\f283"; } .fa-codiepie:before { content: "\f284"; } .fa-modx:before { content: "\f285"; } .fa-fort-awesome:before { content: "\f286"; } .fa-usb:before { content: "\f287"; } .fa-product-hunt:before { content: "\f288"; } .fa-mixcloud:before { content: "\f289"; } .fa-scribd:before { content: "\f28a"; } .fa-pause-circle:before { content: "\f28b"; } .fa-pause-circle-o:before { content: "\f28c"; } .fa-stop-circle:before { content: "\f28d"; } .fa-stop-circle-o:before { content: "\f28e"; } .fa-shopping-bag:before { content: "\f290"; } .fa-shopping-basket:before { content: "\f291"; } .fa-hashtag:before { content: "\f292"; } .fa-bluetooth:before { content: "\f293"; } .fa-bluetooth-b:before { content: "\f294"; } .fa-percent:before { content: "\f295"; } .fa-gitlab:before { content: "\f296"; } .fa-wpbeginner:before { content: "\f297"; } .fa-wpforms:before { content: "\f298"; } .fa-envira:before { content: "\f299"; } .fa-universal-access:before { content: "\f29a"; } .fa-wheelchair-alt:before { content: "\f29b"; } .fa-question-circle-o:before { content: "\f29c"; } .fa-blind:before { content: "\f29d"; } .fa-audio-description:before { content: "\f29e"; } .fa-volume-control-phone:before { content: "\f2a0"; } .fa-braille:before { content: "\f2a1"; } .fa-assistive-listening-systems:before { content: "\f2a2"; } .fa-asl-interpreting:before, .fa-american-sign-language-interpreting:before { content: "\f2a3"; } .fa-deafness:before, .fa-hard-of-hearing:before, .fa-deaf:before { content: "\f2a4"; } .fa-glide:before { content: "\f2a5"; } .fa-glide-g:before { content: "\f2a6"; } .fa-signing:before, .fa-sign-language:before { content: "\f2a7"; } .fa-low-vision:before { content: "\f2a8"; } .fa-viadeo:before { content: "\f2a9"; } .fa-viadeo-square:before { content: "\f2aa"; } .fa-snapchat:before { content: "\f2ab"; } .fa-snapchat-ghost:before { content: "\f2ac"; } .fa-snapchat-square:before { content: "\f2ad"; } .fa-pied-piper:before { content: "\f2ae"; } .fa-first-order:before { content: "\f2b0"; } .fa-yoast:before { content: "\f2b1"; } .fa-themeisle:before { content: "\f2b2"; } .fa-google-plus-circle:before, .fa-google-plus-official:before { content: "\f2b3"; } .fa-fa:before, .fa-font-awesome:before { content: "\f2b4"; } .fa-handshake-o:before { content: "\f2b5"; } .fa-envelope-open:before { content: "\f2b6"; } .fa-envelope-open-o:before { content: "\f2b7"; } .fa-linode:before { content: "\f2b8"; } .fa-address-book:before { content: "\f2b9"; } .fa-address-book-o:before { content: "\f2ba"; } .fa-vcard:before, .fa-address-card:before { content: "\f2bb"; } .fa-vcard-o:before, .fa-address-card-o:before { content: "\f2bc"; } .fa-user-circle:before { content: "\f2bd"; } .fa-user-circle-o:before { content: "\f2be"; } .fa-user-o:before { content: "\f2c0"; } .fa-id-badge:before { content: "\f2c1"; } .fa-drivers-license:before, .fa-id-card:before { content: "\f2c2"; } .fa-drivers-license-o:before, .fa-id-card-o:before { content: "\f2c3"; } .fa-quora:before { content: "\f2c4"; } .fa-free-code-camp:before { content: "\f2c5"; } .fa-telegram:before { content: "\f2c6"; } .fa-thermometer-4:before, .fa-thermometer:before, .fa-thermometer-full:before { content: "\f2c7"; } .fa-thermometer-3:before, .fa-thermometer-three-quarters:before { content: "\f2c8"; } .fa-thermometer-2:before, .fa-thermometer-half:before { content: "\f2c9"; } .fa-thermometer-1:before, .fa-thermometer-quarter:before { content: "\f2ca"; } .fa-thermometer-0:before, .fa-thermometer-empty:before { content: "\f2cb"; } .fa-shower:before { content: "\f2cc"; } .fa-bathtub:before, .fa-s15:before, .fa-bath:before { content: "\f2cd"; } .fa-podcast:before { content: "\f2ce"; } .fa-window-maximize:before { content: "\f2d0"; } .fa-window-minimize:before { content: "\f2d1"; } .fa-window-restore:before { content: "\f2d2"; } .fa-times-rectangle:before, .fa-window-close:before { content: "\f2d3"; } .fa-times-rectangle-o:before, .fa-window-close-o:before { content: "\f2d4"; } .fa-bandcamp:before { content: "\f2d5"; } .fa-grav:before { content: "\f2d6"; } .fa-etsy:before { content: "\f2d7"; } .fa-imdb:before { content: "\f2d8"; } .fa-ravelry:before { content: "\f2d9"; } .fa-eercast:before { content: "\f2da"; } .fa-microchip:before { content: "\f2db"; } .fa-snowflake-o:before { content: "\f2dc"; } .fa-superpowers:before { content: "\f2dd"; } .fa-wpexplorer:before { content: "\f2de"; } .fa-meetup:before { content: "\f2e0"; } /* SIX removed .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; } */ .sr-only-focusable:active, .sr-only-focusable:focus { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; } /* noto-serif-regular - latin */ @font-face { font-family: 'Noto Serif'; font-style: normal; font-weight: 400; font-display: swap; src: url('build/fonts/noto-serif-v6-latin-ext_latin/noto-serif-v6-latin-ext_latin-regular.eot?d824730c2123fa9b'); /* IE9 Compat Modes */ src: local('Noto Serif'), local('NotoSerif'), url('build/fonts/noto-serif-v6-latin-ext_latin/noto-serif-v6-latin-ext_latin-regular.eot?d824730c2123fa9b') format('embedded-opentype'), url('build/fonts/noto-serif-v6-latin-ext_latin/noto-serif-v6-latin-ext_latin-regular.woff2?e053bb2d030a8a6a') format('woff2'), url('build/fonts/noto-serif-v6-latin-ext_latin/noto-serif-v6-latin-ext_latin-regular.woff?a4b881ae6f0f32a8') format('woff'), url('build/fonts/noto-serif-v6-latin-ext_latin/noto-serif-v6-latin-ext_latin-regular.ttf?b21acf864aeaa59a') format('truetype'), url('build/fonts/noto-serif-v6-latin-ext_latin/noto-serif-v6-latin-ext_latin-regular.svg?9313be1247a72578') format('svg'); /* Legacy iOS */ } /* noto-serif-700 - latin */ @font-face { font-family: 'Noto Serif'; font-style: normal; font-weight: 700; font-display: swap; src: url('build/fonts/noto-serif-v6-latin-ext_latin/noto-serif-v6-latin-ext_latin-700.eot?50aaca1047f67cc5'); /* IE9 Compat Modes */ src: local('Noto Serif Bold'), local('NotoSerif-Bold'), url('build/fonts/noto-serif-v6-latin-ext_latin/noto-serif-v6-latin-ext_latin-700.eot?50aaca1047f67cc5') format('embedded-opentype'), url('build/fonts/noto-serif-v6-latin-ext_latin/noto-serif-v6-latin-ext_latin-700.woff2?67acff70f863001d') format('woff2'), url('build/fonts/noto-serif-v6-latin-ext_latin/noto-serif-v6-latin-ext_latin-700.woff?d442fc294e9de1ab') format('woff'), url('build/fonts/noto-serif-v6-latin-ext_latin/noto-serif-v6-latin-ext_latin-700.ttf?75939354e1d9f6f2') format('truetype'), url('build/fonts/noto-serif-v6-latin-ext_latin/noto-serif-v6-latin-ext_latin-700.svg?383607128c46958e') format('svg'); /* Legacy iOS */ } /* noto-sans-regular - latin */ @font-face { font-family: 'Noto Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url('build/fonts/noto-sans-v7-latin-ext_latin/noto-sans-v7-latin-ext_latin-regular.eot?d6c0be31c64ae4bd'); /* IE9 Compat Modes */ src: local('Noto Sans'), local('NotoSans'), url('build/fonts/noto-sans-v7-latin-ext_latin/noto-sans-v7-latin-ext_latin-regular.eot?d6c0be31c64ae4bd') format('embedded-opentype'), url('build/fonts/noto-sans-v7-latin-ext_latin/noto-sans-v7-latin-ext_latin-regular.woff2?36660c3cec4b82cc') format('woff2'), url('build/fonts/noto-sans-v7-latin-ext_latin/noto-sans-v7-latin-ext_latin-regular.woff?4e157b608d652de2') format('woff'), url('build/fonts/noto-sans-v7-latin-ext_latin/noto-sans-v7-latin-ext_latin-regular.svg?6fe979ff50093ed7') format('svg'); /* Legacy iOS */ } /* noto-sans-700 - latin */ @font-face { font-family: 'Noto Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url('build/fonts/noto-sans-v7-latin-ext_latin/noto-sans-v7-latin-ext_latin-700.eot?a33e32c377cf74e1'); /* IE9 Compat Modes */ src: local('Noto Sans Bold'), local('NotoSans-Bold'), url('build/fonts/noto-sans-v7-latin-ext_latin/noto-sans-v7-latin-ext_latin-700.eot?a33e32c377cf74e1') format('embedded-opentype'), url('build/fonts/noto-sans-v7-latin-ext_latin/noto-sans-v7-latin-ext_latin-700.woff2?305b3c2026d3d643') format('woff2'), url('build/fonts/noto-sans-v7-latin-ext_latin/noto-sans-v7-latin-ext_latin-700.woff?661f97eb7f13479c') format('woff'), url('build/fonts/noto-sans-v7-latin-ext_latin/noto-sans-v7-latin-ext_latin-700.svg?53c0aa31ebbccc4e') format('svg'); /* Legacy iOS */ } /* noto-sans-italic - latin */ @font-face { font-family: 'Noto Sans'; font-style: italic; font-weight: 400; font-display: swap; src: url('build/fonts/noto-sans-v7-latin-ext_latin/noto-sans-v7-latin-ext_latin-italic.eot?ef4e3c2ad5e0a97c'); /* IE9 Compat Modes */ src: local('Noto Sans Italic'), local('NotoSans-Italic'), url('build/fonts/noto-sans-v7-latin-ext_latin/noto-sans-v7-latin-ext_latin-italic.eot?ef4e3c2ad5e0a97c') format('embedded-opentype'), url('build/fonts/noto-sans-v7-latin-ext_latin/noto-sans-v7-latin-ext_latin-italic.woff2?ad1109b2af7a18b8') format('woff2'), url('build/fonts/noto-sans-v7-latin-ext_latin/noto-sans-v7-latin-ext_latin-italic.woff?00cd5fa95eb39089') format('woff'), url('build/fonts/noto-sans-v7-latin-ext_latin/noto-sans-v7-latin-ext_latin-italic.svg?43223ddd2cfe404e') format('svg'); /* Legacy iOS */ } /* noto-sans-condensed - latin - converted with transfonter.org (see readme.md in fonts folder for options)*/ @font-face { font-family: 'Noto Sans Condensed'; font-style: normal; font-weight: 400; font-display: swap; src: local('Noto Sans Condensed'), local('NotoSans-Condensed'), url('build/fonts/noto-sans-condensed/hinted-subset-NotoSans-Condensed.woff2?2e6efca900ec2b65') format('woff2'), url('build/fonts/noto-sans-condensed/hinted-subset-NotoSans-Condensed.woff?8f6993f77dc8b2cd') format('woff'); } /* noto-sans-condensed-700 - latin - converted with transfonter.org (see readme.md in fonts folder for options)*/ @font-face { font-family: 'Noto Sans Condensed'; font-style: normal; font-weight: 700; font-display: swap; src: local('Noto Sans Condensed Bold'), local('NotoSans-CondensedBold'), url('build/fonts/noto-sans-condensed/hinted-subset-NotoSans-CondensedBold.woff2?22afa32a087d8a0c') format('woff2'), url('build/fonts/noto-sans-condensed/hinted-subset-NotoSans-CondensedBold.woff?e75162cdd6d03c57') format('woff'); } /* roboto-mono-regular - latin */ @font-face { font-family: 'Roboto Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url('build/fonts/roboto-mono-v5-latin-ext_latin/roboto-mono-v5-latin-ext_latin-regular.eot?2c061f042b189751'); /* IE9 Compat Modes */ src: local('Roboto Mono'), local('RobotoMono-Regular'), url('build/fonts/roboto-mono-v5-latin-ext_latin/roboto-mono-v5-latin-ext_latin-regular.eot?2c061f042b189751') format('embedded-opentype'), url('build/fonts/roboto-mono-v5-latin-ext_latin/roboto-mono-v5-latin-ext_latin-regular.woff2?d4b634ffe1e7af4a') format('woff2'), url('build/fonts/roboto-mono-v5-latin-ext_latin/roboto-mono-v5-latin-ext_latin-regular.woff?99143bd768443c98') format('woff'), url('build/fonts/roboto-mono-v5-latin-ext_latin/roboto-mono-v5-latin-ext_latin-regular.svg?46263c74dab9ef5f') format('svg'); /* Legacy iOS */ } /* SIX-4499: adds support for forms with grey background */ .form.featured { background-color: rgb(248, 248, 248); padding: 30px; } /* fieldset reset */ fieldset { padding: 0; margin: 0; border: 0; } .fieldset.featured [type="submit"], .fieldset.featured [type="reset"] { margin-top: 25px; margin-bottom: 0; } /* --form-input-theme */ .fieldset > button + a.inline { margin-left: 1rem; } [type="text"], [type="password"], [type="date"], [type="datetime"], [type="datetime-local"], [type="month"], [type="week"], [type="email"], [type="number"], [type="search"], [type="tel"], [type="time"], [type="url"], [type="color"], textarea { -moz-appearance: none; appearance: none; background-color: rgb(255, 255, 255); border-radius: 0; border: 1px solid rgb(220, 220, 220); box-sizing: border-box; color: rgb(57, 57, 57); display: block; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-size: 1rem; height: 2.6875rem; width: 100%; padding: 0.55rem 1.25rem; -webkit-transition: background-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), border-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: background-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), border-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); -webkit-appearance: none } [type="text"]:focus, [type="password"]:focus, [type="date"]:focus, [type="datetime"]:focus, [type="datetime-local"]:focus, [type="month"]:focus, [type="week"]:focus, [type="email"]:focus, [type="number"]:focus, [type="search"]:focus, [type="tel"]:focus, [type="time"]:focus, [type="url"]:focus, [type="color"]:focus, textarea:focus { border: 1px solid rgb(136, 193, 228); /* SIX: removes ugly focus color on dark sections */ /* background-color: color(var(--color-horizon-official) alpha(10%)); */ background-color: rgb(243, 249, 252); outline: none; } .compact [type="text"], .compact [type="password"], .compact [type="date"], .compact [type="datetime"], .compact [type="datetime-local"], .compact [type="month"], .compact [type="week"], .compact [type="email"], .compact [type="number"], .compact [type="search"], .compact [type="tel"], .compact [type="time"], .compact [type="url"], .compact [type="color"], .compact textarea { height: 1.875rem; padding: 0.375rem 0.75rem; font-size: 0.875rem } .error [type="text"], .error [type="password"], .error [type="date"], .error [type="datetime"], .error [type="datetime-local"], .error [type="month"], .error [type="week"], .error [type="email"], .error [type="number"], .error [type="search"], .error [type="tel"], .error [type="time"], .error [type="url"], .error [type="color"], .error textarea { border: 1px solid rgb(233, 76, 71) } .valid [type="text"], .valid [type="password"], .valid [type="date"], .valid [type="datetime"], .valid [type="datetime-local"], .valid [type="month"], .valid [type="week"], .valid [type="email"], .valid [type="number"], .valid [type="search"], .valid [type="tel"], .valid [type="time"], .valid [type="url"], .valid [type="color"], .valid textarea { border: 1px solid rgb(92, 184, 92) } .highlight [type="text"], .highlight [type="password"], .highlight [type="date"], .highlight [type="datetime"], .highlight [type="datetime-local"], .highlight [type="month"], .highlight [type="week"], .highlight [type="email"], .highlight [type="number"], .highlight [type="search"], .highlight [type="tel"], .highlight [type="time"], .highlight [type="url"], .highlight [type="color"], .highlight textarea { border: 1px solid rgb(136, 193, 228); /* background-color: color(var(--color-horizon-official) alpha(10%)); */ background-color: rgba(136,193,228,0.1) } [type="color"]::-webkit-color-swatch-wrapper, .compact [type="color"]::-webkit-color-swatch-wrapper, [type="color"], .compact [type="color"] { padding: 0; } [type="color"]::-webkit-color-swatch, .compact [type="color"]::-webkit-color-swatch { border: none; } .field { display: block; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-size: 1rem; font-weight: 400; margin: 0 0 0.4rem; padding-top: 1.5rem; position: relative } .compact .field { margin: 0 0 0.325rem } .field .title { position: absolute; display: inline-block; font-size: .75rem; font-weight: 700; left: 2px; top: 4px } .compact .field .title { font-size: .7rem } .field .detail, .field .caption { font-family: inherit; font-size: 0.75rem; font-weight: 700; } .field.error .detail, .field.error .caption { color: rgb(233, 76, 71); } .field.valid .detail, .field.valid .caption { color: rgb(92, 184, 92); } /* Range input */ [type=range] { -webkit-appearance: none; margin: 10px 0; width: 100%; -webkit-transition: background 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: background 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) } [type=range]:focus { outline: none; } [type=range]::-webkit-slider-runnable-track { width: 100%; height: 2px; cursor: pointer; animate: 0.2s; background: rgb(149, 149, 149); border-radius: 0px; border: 0px solid; } [type=range]::-webkit-slider-thumb { border: 0px solid; height: 12px; width: 12px; border-radius: 12px; background: rgb(78, 78, 78); cursor: pointer; -webkit-appearance: none; margin-top: -5px; } [type=range]:focus::-webkit-slider-runnable-track { background: rgb(149, 149, 149); } [type=range]:focus::-webkit-slider-thumb { background: rgb(73, 151, 183); } [type=range]::-moz-range-track { width: 100%; height: 2px; cursor: pointer; animate: 0.2s; background: rgb(149, 149, 149); border-radius: 0px; border: 0px solid; } [type=range]::-moz-range-thumb { border: 0px solid; height: 12px; width: 12px; border-radius: 12px; background: rgb(78, 78, 78); cursor: pointer; } [type=range]:focus::-moz-range-thumb { background: rgb(73, 151, 183); } [type=range]::-ms-track { width: 100%; height: 2px; cursor: pointer; animate: 0.2s; background: transparent; border-color: transparent; color: transparent; } [type=range]::-ms-fill-lower { background: rgb(149, 149, 149); border: 0px solid; border-radius: 0px; } [type=range]::-ms-fill-upper { background: rgb(149, 149, 149); border: 0px solid; border-radius: 0px; } [type=range]::-ms-thumb { border: 0px solid; height: 12px; width: 12px; border-radius: 12px; background: rgb(78, 78, 78); cursor: pointer; } [type=range]:focus::-ms-fill-lower { background: rgb(149, 149, 149); } [type=range]:focus::-ms-fill-upper { background: rgb(149, 149, 149); } [type=range]:focus::-ms-thumb { background: rgb(73, 151, 183); } input:placeholder, textarea:placeholder { color: rgb(184, 184, 184); } input:disabled, input[disabled], input[readonly], textarea:disabled, textarea[disabled], textarea[readonly] { background-color: rgb(248, 248, 248); border: 1px solid rgb(220, 220, 220); color: rgba(123, 113, 102, 0.6); cursor: default; } textarea { min-height: 4rem; padding: 0.375rem; resize: vertical; max-width: 100% } textarea[rows] { height: auto; } select { -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; border-radius: 0; cursor: pointer; display: inline-block; vertical-align: middle; color: rgb(57, 57, 57); border: 1px solid rgb(220, 220, 220); padding: 0.500em 1.438em; text-overflow: ellipsis; line-height: 1.64; height: 43px; font-size: 1rem; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; padding-right: 2.5em; background-color: rgb(255, 255, 255); background-repeat: no-repeat; background-position: right 1.1em top 1.1em; -webkit-transition: border 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: border 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) } select:hover, select:active, select:focus { outline: 0; /* border-color: color(var(--color-rock-20) shade(10%)); */ border-color: #c6c6c6; } select { /* This is some basic styling for non-Webkit Browsers */ } select option { padding: inherit; font-family: inherit; color: inherit !important; background: transparent !important; box-shadow: none; } select option:checked, select option:hover { color: rgb(255, 255, 255) !important; /* background: color(var(--color-horizon) shade(10%)) !important; */ background: #4288a5 !important; /* box-shadow: 0 0 10px 100px color(var(--color-horizon) shade(10%)) inset; */ box-shadow: 0 0 10px 100px #4288a5 inset; } select optgroup { font-family: inherit; padding: inherit } select optgroup option { padding: inherit; padding-left: 0; padding-right: 0; font-family: inherit; } select, .choices[data-type*="select-one"], .choices[data-type*="select-multiple"] { background-image: url(data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M4.177%205.53L4%205.707l-.354-.353-3-3L.293%202%201%201.293l.354.353L4%204.293l2.646-2.647L7%201.293%207.707%202l-.353.354-3%203-.177.176z%22%20fill%3D%22currentColor%22/%3E%3C/svg%3E); background-image: url(data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M4.177%205.53L4%205.707l-.354-.353-3-3L.293%202%201%201.293l.354.353L4%204.293l2.646-2.647L7%201.293%207.707%202l-.353.354-3%203-.177.176z%22%20fill%3D%22%23de3919%22/%3E%3C/svg%3E); } /* browser hacks */ select:-moz-focusring { color: transparent; text-shadow: 0 0 0 #000; } select::-ms-expand { display: none; } .compact select { height: 1.875rem; padding: 0 0.75rem; padding-right: 2rem; font-size: 0.875rem; background-position: right 1.2em top 0.8em; } .row select { width: 100%; } .select-opt-row span + span { margin-left: 8px; } .choices__inner .select-opt-row span { display: none; } .choices__inner .select-opt-row .its { display: block; } .choices__inner .select-opt-row .its { display: block; } .select-opt-row .its + .it:before { content: '–'; display: inline-block; margin-right: 8px; } .select-opt-row .itv, .select-opt-row .isin { font-size: 0.875rem; /* 14/16 */ color: rgb(113, 113, 113) } .is-highlighted .select-opt-row .itv, .is-highlighted .select-opt-row .isin { color: rgb(248, 248, 248) } .label-text { display: inline-block; } label.stacked { display: block; margin-bottom: 0.5rem; } input[type="checkbox"], input[type="radio"] { position: absolute; opacity: 0; font-size: 1rem } input[type="checkbox"] + .label-text, input[type="radio"] + .label-text { margin-right: 1em; padding-left: 1.5em; position: relative; } input[type="checkbox"] + .label-text:before, input[type="checkbox"] + .label-text:after, input[type="radio"] + .label-text:before, input[type="radio"] + .label-text:after { content: ''; background: rgb(255, 255, 255); display: inline-block; width: 1em; height: 1em; position: absolute; top: .25em; left: 0; vertical-align: top; cursor: pointer; text-align: center; -webkit-transition: all 250ms ease; transition: all 250ms ease; } input[type="checkbox"] + .label-text:before, input[type="radio"] + .label-text:before { border: 1px solid rgb(220, 220, 220); box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.05); } input[type="checkbox"]:disabled + .label-text:before, input[type="radio"]:disabled + .label-text:before { background: rgb(248, 248, 248); border-color: rgb(220, 220, 220); cursor: not-allowed; } input[type="checkbox"]:disabled + .label-text:after, input[type="radio"]:disabled + .label-text:after { opacity: 0; cursor: not-allowed; } input[type="checkbox"]:focus + .label-text:before, input[type="radio"]:focus + .label-text:before { outline: none; } input[type="radio"] + .label-text:before, input[type="radio"] + .label-text:after { border-radius: 50%; } input[type="radio"]:checked + .label-text:before { background-color: rgb(73, 151, 183); border-color: rgb(73, 151, 183); } input[type="radio"] + .label-text:after { background: rgb(255, 255, 255); opacity: 0; -webkit-transform: scale(1); transform: scale(1); } input[type="radio"]:checked + .label-text:after { opacity: 1; -webkit-transform: scale(.3); transform: scale(.3); } input[type="checkbox"]:checked + .label-text:before { background-color: rgb(73, 151, 183); border-color: rgb(73, 151, 183); } input[type="checkbox"] + .label-text:after { background: transparent; border: solid rgb(255, 255, 255); border-width: 0px 1px 1px 0; width: 0.2em; height: 0.4em; position: absolute; top: 0.6em; left: 0.45em; margin-left: -1px; margin-top: -2px; opacity: 0; -webkit-transform: scale(2) rotate(45deg); transform: scale(2) rotate(45deg); } input[type="checkbox"]:checked + .label-text:after { opacity: 1; -webkit-transform: scale(1) rotate(45deg); transform: scale(1) rotate(45deg); } /* filter labels */ .filter-tag { display: inline-block; margin-bottom: 0.625rem; margin-right: 0.625rem; } .filter-tag label { background-color: rgb(184, 184, 184); text-transform: capitalize } .filter-tag label:active { -webkit-tap-highlight-color: rgba(#000, 0); outline: none; text-decoration: none; /* background-color: color(var(--color-rock-40) shade(10%)); */ background-color: #a6a6a6; color: rgb(255, 255, 255); } .filter-tag label:hover, .filter-tag label:focus { text-decoration: none; /* background-color: color(var(--color-rock-40) shade(10%)); */ background-color: #a6a6a6; color: rgb(255, 255, 255); } .filter-tag label:active { -webkit-transform: scale(.98); transform: scale(.98); } .filter-tags--accordion .filter-tag label { text-transform: none; } .filter-tag input[type="checkbox"]:checked + label{ background-color: rgb(73, 151, 183); } #js .file-upload:not(.file-upload-fallback) { display: block; background: rgb(255, 255, 255); border: 2px dashed rgb(184, 184, 184); padding: 1rem; width: 100%; max-width: 380px; text-align: center; } #js .file-upload.error:not(.file-upload-fallback) { border: 2px dashed rgb(222, 57, 25); } #js .error .file-upload { border-color: rgb(222, 57, 25); } #js .valid .file-upload { border-color: rgb(92, 184, 92); } #js .highlight .file-upload { border-color: rgb(73, 151, 183); } .file-upload-link, .file-upload-drag { display: none; } #js .file-upload-drag { display: block } #js .file-upload-drag .fa { display: block; margin-bottom: 1rem; } #js .file-upload-link { cursor: pointer; color: rgb(73, 151, 183); display: none; } #js .file-upload-link { display: inline; } #js .file-upload-label input { display: none; margin: 2px 0 4px; } #js .file-upload-fallback .file-upload-link, #js .file-upload-fallback .file-upload-drag { display: none; } #js .file-upload-fallback .file-upload-label input { display: block; } .file-upload ul { margin: 0; text-align: left } .file-upload ul li { list-style: none; background: rgb(248, 248, 248); display: -webkit-box; display: flex; padding: 3px 6px 2px; margin-bottom: 2px } .file-upload ul li:first-child { margin-top: 1rem; } .file-upload ul .fa:before { position: relative; top: 2px; font-size: 0.9em; } .file-upload ul .file-list-name { margin-right: auto; margin-left: 4px; display: inline-block; font-size: 0.9em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .file-upload ul .file-list-size { margin-left: auto; margin-top: 1px; display: inline-block; font-size: 0.8em; white-space: nowrap; } .googlecaptcha .grecaptcha-badge { z-index: 500; } .googlecaptcha.no-title { padding: 0; } .form .dijitTextBox, .form .dijitTextBox .dijitButtonNode { border-color: #dcdcdc; height: 2.68rem; } .form.compact .dijitTextBox, .form.compact .dijitTextBox .dijitButtonNode { height: 1.87rem; } .form .dijitDateTextBox .dijitArrowButtonInner { right: 5px; top: 13px; } .form.compact .dijitDateTextBox .dijitArrowButtonInner { right: 0; top: 7px; } .form .dijitDateTextBox.dijitDateTextBox .dijitInputInner { height: 2.68rem; text-indent: 15px; } .form.compact .dijitDateTextBox.dijitDateTextBox .dijitInputInner { font-size: 14px; height: 24px; text-indent: 7px; } .form .dijitDateTextBox .dijitArrowButtonInner { z-index: 121; } /* reset */ .hbspt-form .field { margin-bottom: 0 !important; } input.hs-input, input.hs-input:focus, textarea.hs-input, textarea.hs-input:focus { box-shadow: none !important; -webkit-transition: none; transition: none; } textarea.hs-input { width: 100% !important; } input[type="email"].hs-input, input[type="tel"].hs-input, input[type="text"].hs-input, input[type="url"].hs-input { -moz-appearance: none; appearance: none; background-color: rgb(255, 255, 255); border-radius: 0; border: 1px solid rgb(220, 220, 220); box-sizing: border-box; color: rgb(57, 57, 57); display: block; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-size: 1rem; height: 2.6875rem; width: 100%; padding: 0.55rem 1.25rem; -webkit-transition: background-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), border-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: background-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), border-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); -webkit-appearance: none; box-sizing: border-box !important; width: 100% !important; } span.hs-form-required { color: inherit !important; } /* richtext */ .hs-richtext { color: rgb(113, 113, 113) !important; font-family: "Noto Sans", Helvetica, Arial, sans-serif !important; } /* lists */ .hs-richtext ul, .hs-richtext ol { list-style-type: none; margin-left: 1.563em } .hs-richtext ul li, .hs-richtext ol li { position: relative; margin-bottom: 0.6em } .hs-richtext ul li ul, .hs-richtext ul li ol, .hs-richtext ol li ul, .hs-richtext ol li ol { margin-top: 0.5em; margin-bottom: 0.8em; } .hs-richtext ul li:before { content: ''; width: 0.3125em; /* 5/16 */ height: 0.3125em; /* 5/16 */ border-radius: 50%; background: rgb(222, 57, 25); position: absolute; left: -16px; top: 10px; } @media print { .hs-richtext ul { list-style-type: disc; list-style-type: initial } .hs-richtext ul li:before { content: none; background: transparent; } } .hs-richtext ol { counter-reset: counter } .hs-richtext ol li { counter-increment: counter } .hs-richtext ol li:before { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; content: counter(counter, decimal-leading-zero) '.'; font-size: 0.750em; color: rgb(222, 57, 25); position: absolute; left: -2em; top: 0.416em; } /* button */ input.hs-button { background-image: none !important; background-color: rgb(222, 57, 25) !important; border: 1px solid transparent !important; border-radius: 0 !important; box-shadow: none !important; /*min-width: 3rem;*/ color: rgb(255, 255, 255) !important; cursor: pointer !important; display: inline-block !important; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif !important; font-size: 1rem !important; font-weight: 400 !important; line-height: 1.64 !important; outline: none !important; padding: 0.500em 1.438em !important; position: relative !important; text-align: center !important; text-decoration: none !important; text-shadow: none !important; -webkit-transition: background 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) !important; transition: background 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) !important; -webkit-user-select: none !important; -moz-user-select: none !important; -ms-user-select: none !important; user-select: none !important; vertical-align: middle !important; } /* labels */ .hs-fieldtype-text label span, .hs-fieldtype-textarea label span { color: rgb(113, 113, 113) !important; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-size: 0.75rem; font-weight: 700; } .hs-fieldtype-textarea textarea { min-height: 4rem; padding: 0.375rem; resize: vertical; } input[type="email"].hs-input.error, input[type="tel"].hs-input.error, input[type="text"].hs-input.error, input[type="url"].hs-input.error { border: 1px solid rgb(233, 76, 71) !important; } .hs-error-msgs.inputs-list { padding-left: 0 !important } .hs-error-msgs.inputs-list li { margin-bottom: 0; } .hs-error-msgs.inputs-list label { color: rgb(233, 76, 71); font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-size: 0.75rem; font-weight: 700 !important; margin-bottom: 0 !important; } /* input */ input[type="email"].hs-input:focus, input[type="tel"].hs-input:focus, input[type="text"].hs-input:focus, input[type="url"].hs-input:focus { background-color: rgb(243, 249, 252); } /* Grid */ .form-columns-2 > .field { box-sizing: border-box; float: left; width: 50%; } .form-columns-2 > .field:first-child { padding-right: 8px; } .form-columns-2 > .field:last-child { padding-left: 8px; } /* Checkbox & Radio */ .hs-fieldtype-checkbox ul, .hs-form-booleancheckbox ul, .hs-fieldtype-radio ul { list-style: none; } .hs-fieldtype-checkbox input[type="checkbox"], .hs-fieldtype-checkbox input[type="radio"], .hs-form-booleancheckbox input[type="checkbox"], .hs-form-booleancheckbox input[type="radio"], .hs-fieldtype-radio input[type="checkbox"], .hs-fieldtype-radio input[type="radio"] { position: absolute; opacity: 0; font-size: 1rem } .hs-fieldtype-checkbox input[type="checkbox"] + span, .hs-fieldtype-checkbox input[type="radio"] + span, .hs-form-booleancheckbox input[type="checkbox"] + span, .hs-form-booleancheckbox input[type="radio"] + span, .hs-fieldtype-radio input[type="checkbox"] + span, .hs-fieldtype-radio input[type="radio"] + span { display: block; margin-right: 1em; position: relative; padding-left: 1.5em; } .hs-fieldtype-checkbox input[type="checkbox"] + span:before, .hs-fieldtype-checkbox input[type="checkbox"] + span:after, .hs-fieldtype-checkbox input[type="radio"] + span:before, .hs-fieldtype-checkbox input[type="radio"] + span:after, .hs-form-booleancheckbox input[type="checkbox"] + span:before, .hs-form-booleancheckbox input[type="checkbox"] + span:after, .hs-form-booleancheckbox input[type="radio"] + span:before, .hs-form-booleancheckbox input[type="radio"] + span:after, .hs-fieldtype-radio input[type="checkbox"] + span:before, .hs-fieldtype-radio input[type="checkbox"] + span:after, .hs-fieldtype-radio input[type="radio"] + span:before, .hs-fieldtype-radio input[type="radio"] + span:after { content: ''; background: rgb(255, 255, 255); display: inline-block; width: 1em; height: 1em; position: absolute; top: 0.25em; left: 0; vertical-align: top; cursor: pointer; text-align: center; -webkit-transition: all 250ms ease; transition: all 250ms ease; } .hs-fieldtype-checkbox input[type="checkbox"] + span:before, .hs-fieldtype-checkbox input[type="radio"] + span:before, .hs-form-booleancheckbox input[type="checkbox"] + span:before, .hs-form-booleancheckbox input[type="radio"] + span:before, .hs-fieldtype-radio input[type="checkbox"] + span:before, .hs-fieldtype-radio input[type="radio"] + span:before { border: 1px solid rgb(220, 220, 220); box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.05); } .hs-fieldtype-checkbox input[type="checkbox"]:checked + span:before, .hs-form-booleancheckbox input[type="checkbox"]:checked + span:before, .hs-fieldtype-radio input[type="checkbox"]:checked + span:before { background-color: rgb(73, 151, 183); border-color: rgb(73, 151, 183); } .hs-fieldtype-checkbox input[type="checkbox"] + span:after, .hs-form-booleancheckbox input[type="checkbox"] + span:after, .hs-fieldtype-radio input[type="checkbox"] + span:after { background: transparent; border: solid rgb(255, 255, 255); border-width: 0px 1px 1px 0; width: 0.2em; height: 0.4em; position: absolute; top: 0.6em; left: 0.45em; margin-left: -1px; margin-top: -2px; opacity: 0; -webkit-transform: scale(2) rotate(45deg); transform: scale(2) rotate(45deg); } .hs-fieldtype-checkbox input[type="checkbox"]:checked + span:after, .hs-form-booleancheckbox input[type="checkbox"]:checked + span:after, .hs-fieldtype-radio input[type="checkbox"]:checked + span:after { opacity: 1; -webkit-transform: scale(1) rotate(45deg); transform: scale(1) rotate(45deg); } .hs-fieldtype-checkbox input[type="radio"] + span:before, .hs-fieldtype-checkbox input[type="radio"] + span:after, .hs-form-booleancheckbox input[type="radio"] + span:before, .hs-form-booleancheckbox input[type="radio"] + span:after, .hs-fieldtype-radio input[type="radio"] + span:before, .hs-fieldtype-radio input[type="radio"] + span:after { border-radius: 50%; } .hs-fieldtype-checkbox input[type="radio"]:checked + span:before, .hs-form-booleancheckbox input[type="radio"]:checked + span:before, .hs-fieldtype-radio input[type="radio"]:checked + span:before { background-color: rgb(73, 151, 183); border-color: rgb(73, 151, 183); } .hs-fieldtype-checkbox input[type="radio"] + span:after, .hs-form-booleancheckbox input[type="radio"] + span:after, .hs-fieldtype-radio input[type="radio"] + span:after { background: rgb(255, 255, 255); opacity: 0; -webkit-transform: scale(1); transform: scale(1); } .hs-fieldtype-checkbox input[type="radio"]:checked + span:after, .hs-form-booleancheckbox input[type="radio"]:checked + span:after, .hs-fieldtype-radio input[type="radio"]:checked + span:after { opacity: 1; -webkit-transform: scale(.3); transform: scale(.3); } /* recaptcha */ .hbspt-form .field.hs-recaptcha { margin-bottom: 2rem !important; } /* stuff */ .legal-consent-container .inputs-list { list-style: none; } .alert_success, .alert_info, .alert_warning, .alert_error { position: relative; padding: 1.25rem; padding-left: 3.75rem; margin-bottom: 1.25rem; font-size: 0.875rem; color: #ffffff; border: 1px solid } .alert_success .fa, .alert_info .fa, .alert_warning .fa, .alert_error .fa { height: 1.375rem; width: 1.375rem; padding: 0; position: absolute; top: 1.25rem; left: 1.25rem; font-size: 1.375rem; } .alert_success li, .alert_info li, .alert_warning li, .alert_error li { margin-bottom: .3em; } .alert_success p, .alert_info p, .alert_warning p, .alert_error p { font-size: inherit; } .alert_success .title:last-child, .alert_success ul:last-child, .alert_success p:last-child, .alert_info .title:last-child, .alert_info ul:last-child, .alert_info p:last-child, .alert_warning .title:last-child, .alert_warning ul:last-child, .alert_warning p:last-child, .alert_error .title:last-child, .alert_error ul:last-child, .alert_error p:last-child { margin-bottom: 0; } .alert_success .title, .alert_info .title, .alert_warning .title, .alert_error .title { font-size: 1.25rem; color: inherit; } .alert_success { background: rgba(92, 184, 92, 0.8); border-color: rgb(92, 184, 92); } .alert_info { background: rgba(73, 150, 183, 0.8); border-color: rgb(73, 150, 183); } .alert_warning { color: rgb(158, 108, 0); background: rgba(253, 198, 82, 0.8); border-color: rgb(253, 198, 82); } .alert_error { background: rgba(233, 76, 71, 0.8); border-color: rgb(233, 76, 71); } .spinner svg { width: 40px; height: 40px; display: block; } .spinner path { stroke-dashoffset: 70; stroke-dasharray: 70, 444; -webkit-animation: loader 2s cubic-bezier(.51,.18,.61,.61) infinite; animation: loader 2s cubic-bezier(.51,.18,.61,.61) infinite; } @-webkit-keyframes loader { 0% { stroke-dashoffset: -150; } 50% { stroke-dashoffset: -444; } 50.001% { stroke-dashoffset: 70; } 60% { stroke-dashoffset: 70; } 100% { stroke-dashoffset: -150; } } @keyframes loader { 0% { stroke-dashoffset: -150; } 50% { stroke-dashoffset: -444; } 50.001% { stroke-dashoffset: 70; } 60% { stroke-dashoffset: 70; } 100% { stroke-dashoffset: -150; } } /* * CSS Definitions for lists */ ol, ul, dl { margin-top: 0; } ol ol, ul ul, ol ul, ul ol { margin-bottom: 0; font-size: 1em; margin-left: 2rem; } ul { list-style: disc outside; } ol { list-style: decimal outside; } ol, ul { margin-top: 0; margin-left: 1.2rem; padding-left: 0; } li { margin-bottom: .8em; } nav ul, nav ul ul { margin-left: 0; } .iconbox ul, .iconbox ol, .textimage ul, .textimage ol, .teaser-offering ul { list-style-type: none; margin-left: 1.563em } .iconbox ul li, .iconbox ol li, .textimage ul li, .textimage ol li, .teaser-offering ul li { position: relative; margin-bottom: 0.6em } .iconbox ul li ul, .iconbox ul li ol, .iconbox ol li ul, .iconbox ol li ol, .textimage ul li ul, .textimage ul li ol, .textimage ol li ul, .textimage ol li ol, .teaser-offering ul li ul, .teaser-offering ul li ol { margin-top: 0.5em; margin-bottom: 0.8em; } .iconbox ul li:before, .textimage ul:not(.fa-ul) li:before, .teaser-offering ul:not(.fa-ul) li:before { content: ''; width: 0.3125em; /* 5/16 */ height: 0.3125em; /* 5/16 */ border-radius: 50%; background: rgb(222, 57, 25); position: absolute; left: -16px; top: 10px; } @media print { .textimage ul:not(.fa-ul), .teaser-offering ul:not(.fa-ul) { list-style-type: disc; list-style-type: initial } .textimage ul:not(.fa-ul) li:before, .teaser-offering ul:not(.fa-ul) li:before { content: none; background: transparent; } } .bg-red .textimage ul:not(.fa-ul) li:before { background: rgb(255, 255, 255); } .bg-red .accordion .textimage ul:not(.fa-ul) li:before, .bg-red .featured .textimage ul:not(.fa-ul) li:before { background: rgb(222, 57, 25); } .iconbox ol, .textimage ol { counter-reset: counter } .iconbox ol li, .textimage ol li { counter-increment: counter } .iconbox ol li:before, .textimage ol li:before { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; content: counter(counter, decimal-leading-zero) '.'; font-size: 0.750em; color: rgb(222, 57, 25); position: absolute; left: -2em; top: 0.416em; } .bg-red .textimage ol li:before { color: rgb(255, 255, 255); } .bg-red .accordion .textimage ol li:before, .bg-red .featured .textimage ol li:before { color: rgb(222, 57, 25); } .fa-ul, .links-only { font-size: 0.875rem; /* 14/16 */ } /* SIX-4808: improves download taxonomy lists */ .dam_taxonomy_list .list > ul { margin-left: 20px; } .dam_taxonomy_list .list .item > a { color: #4997b7 } .dam_taxonomy_list .list .item > a:hover { color: #4a7485; } .links-only { margin-left: 0; list-style: none } .links-only i.fa { display: none; } .social_connect ul { /* SIX-4528: fixes alignement on contact detail page */ margin: 0; } .social_connect li { display: inline-block; margin-bottom: 0; } .social_connect a { font-size: 1.125rem; /* 18/16 */ color: rgb(184, 184, 184); display: inline-block; padding: .4em } .social_connect a:hover { /* color: color(var(--color-rock-40) shade(20%)); */ color: #939393; } .pagination { text-align: center; margin: 40px 0 10px 0 /* Needed when pagination is integrated into a teaser list page */ } .pagination nav ul { display: block; } .pagination li { margin: 0; } .pagination li { display: inline-block; margin-bottom: 0; } .pagination .arrow { display: none; } .pagination a { display: inline-block; border: 1px solid transparent; color: rgb(113, 113, 113); font-size: 0.75rem; /* 12/16 */ padding: 6px 9px 5px; margin: 6px 1px } .pagination a:hover { /* color: color(var(--color-rock-80) shade(20%)); */ color: rgb(90, 90, 90); } .pagination .first a { margin-left: 0; margin-right: 4px; } .pagination .last a { margin-left: 4px; margin-right: 0; } .pagination .active a { color: rgb(73, 151, 183); border-color: rgb(73, 151, 183); /* background-color: color(var(--color-horizon) alpha(15%)); */ background-color: rgba(73, 151, 183, 0.15); } /* Image */ img { max-width: 100%; height: auto; visibility: hidden; } img[src] { visibility: visible; } /* SIX-5300: fix RWD hero images (vertical position was broken) */ .nav-image img.cover, .hero-half .fig img, .section-img img { height: auto !important; } @supports (grid-area: auto) { .nav-image img.cover, .hero-half .fig img, .section-img img { height: 100% !important; } } div.mood { display: block; margin-bottom: 16px; width: auto; } .mood img { display: block; } .mood.partner { max-width: 60%; } /* SIX-4950: prefers to not print an image on 2 pages */ .img, figure { page-break-inside: avoid; -webkit-column-break-inside: avoid; break-inside: avoid; } .fig.image-block { margin-bottom: 10px; margin-right: 0; max-width: 100%; position: relative; width: 100%; } .figure .fig.align-center, .align-center .fig { margin-left: auto; margin-right: auto; } .fig.image-small { width: 30%; } .fig.image-medium { width: 40%; } .fig.image-large { width: 50%; } .image-block img, .image-large img, .image-medium img, .image-small img { display: block; width: auto; } /* List Image */ .list.image-block img, .list.image-block .img { margin-left: 0; margin-right: 0; margin-bottom: 1px; max-width: 100%; position: relative; } .list.image-block .img { width: 100%; } .list.image-large img, .list.image-large .img { max-width: 50%; } .list.image-large .img { width: 50%; } .list.image-medium img, .list.image-medium .img { max-width: 40%; } .list.image-medium .img { width: 40%; } .list.image-small img, .list.image-small .img { max-width: 30%; } .list.image-small .img { width: 30%; } .list .img img { /* float: none; */ margin-bottom: 0; margin-left: 0; margin-right: 0; max-width: 100%; width: auto; } /* SIX-3235: set all images in 4 cols to block */ .list.image-small .cols_3-3-3-3 .img, .list.image-medium .cols_3-3-3-3 .img, .list.image-large .cols_3-3-3-3 .img { margin-bottom: 1px; min-width: 100%; width: 100%; } /* SIX-3235: special treatment for images in 3 cols */ @media only screen and (min-width: 768px) { .list.image-small .cols_4-4-4 .img, .list.image-medium .cols_4-4-4 .img, .list.image-large .cols_4-4-4 .img { margin-bottom: 1px; min-width: 100%; width: 100%; } } /* Partner lists */ .list .thumb { position: relative; } .list.image-block .img.thumb, .list.image-small .cols_3-3-3-3 .img.thumb, .list.image-medium .cols_3-3-3-3 .img.thumb, .list.image-large .cols_3-3-3-3 .img.thumb, .list.image-small .cols_4-4-4 .img.thumb, .list.image-medium .cols_4-4-4 .img.thumb, .list.image-large .cols_4-4-4 .img.thumb { margin-bottom: 10px; } .list .thumb .thumb-holder { -webkit-box-align: center; align-items: center; display: -webkit-box; display: flex; -webkit-box-pack: center; justify-content: center; padding-bottom: 56.25%; /* 16:9 */ } .list .thumb img { display: block; margin-left: auto; margin-right: auto; max-height: 100%; max-width: 100%; position: absolute; bottom: 0; top: 0; margin-bottom: auto; margin-top: auto; left: 0; right: 0; } /* Gallery */ .list.image-small .gallery .item { box-sizing: border-box; width: calc(25% - 15px); } .list.image-medium .gallery .item { box-sizing: border-box; width: calc(33% - 14px); } .list.image-large .gallery .item { box-sizing: border-box; width: calc(50% - 15px); } .list.image-block .gallery .item { float: none; width: auto; } .list .gallery .item img { float: none; max-width: 100%; width: auto; } @media only screen and (max-width: 767px) { .list.image-small .gallery .item { width: calc(50% - 15px); } .list.image-medium .gallery .item, .list.image-large .gallery .item { float: none; width: auto; } } /* Featured carousel */ .image-block .featured .figure, .row .image-large .featured .figure { float: none; margin-left: 0; margin-right: 0; width: 100%; } .image-large .featured .figure { width: 50%; } .image-medium .featured .figure { width: 33%; } .image-small .featured .figure { width: 25%; } /* Grid */ .column_1 .fig.image-large, .column_2 .fig.image-large, .column_3 .fig.image-large, .column_4 .fig.image-large, .column_5 .fig.image-large { float: none !important; margin-right: 0 !important; max-width: 100% !important; } .column_1 .image-large img, .column_2 .image-large img, .column_3 .image-large img, .column_4 .image-large img, .column_5 .image-large img, .column_1 .image-large .img, .column_2 .image-large .img, .column_3 .image-large .img, .column_4 .image-large .img, .column_5 .image-large .img { float: none !important; margin-left: 0 !important; margin-right: 0 !important; max-width: 100% !important; } .column_1 .list.image-large img, .column_2 .list.image-large img, .column_3 .list.image-large img, .column_4 .list.image-large img, .column_5 .list.image-large img, .column_1 .list.image-large .img, .column_2 .list.image-large .img, .column_3 .list.image-large .img, .column_4 .list.image-large .img, .column_5 .list.image-large .img { margin-bottom: 10px; } .column_1 .fig.image-large, .column_2 .fig.image-large, .column_3 .fig.image-large, .column_4 .fig.image-large, .column_5 .fig.image-large { margin-bottom: 10px; width: 100%; } .column_1 .image-large .img, .column_2 .image-large .img, .column_3 .image-large .img, .column_4 .image-large .img, .column_5 .image-large .img { width: 100% !important; } .section-img .cover-y-top.cover-x-left { top: 0; -webkit-transform: translate(0%, 0%); transform: translate(0%, 0%); left: 0; } .section-img .cover-y-top.cover-x-center { top: 0; -webkit-transform: translate(-50%, 0%); transform: translate(-50%, 0%); } .section-img .cover-y-top.cover-x-right { top: 0; -webkit-transform: translate(0%, 0%); transform: translate(0%, 0%); left: auto; right: 0; } .section-img .cover-y-center.cover-x-left { top: 50%; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); left: 0; } .section-img .cover-y-center.cover-x-center { top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .section-img .cover-y-center.cover-x-right { top: 50%; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); left: auto; right: 0; } .section-img .cover-y-bottom.cover-x-left { top: 100%; -webkit-transform: translate(0%, -100%); transform: translate(0%, -100%); left: 0; } .section-img .cover-y-bottom.cover-x-center { top: 100%; -webkit-transform: translate(-50%, -100%); transform: translate(-50%, -100%); } .section-img .cover-y-bottom.cover-x-right { top: 100%; -webkit-transform: translate(0%, -100%); transform: translate(0%, -100%); left: auto; right: 0; } /* modern browsers */ @supports (object-fit: cover) { .section-img .cover { left: 0 !important; object-fit: cover; right: auto !important; -webkit-transform: none !important; transform: none !important; top: auto !important; } .section-img .cover-y-top.cover-x-left { object-position: left top; } .section-img .cover-y-top.cover-x-center { object-position: center top; } .section-img .cover-y-top.cover-x-right { object-position: right top; } .section-img .cover-y-center.cover-x-left { object-position: left center; } .section-img .cover-y-center.cover-x-center { object-position: center center; } .section-img .cover-y-center.cover-x-right { object-position: right center; } .section-img .cover-y-bottom.cover-x-left { object-position: left bottom; } .section-img .cover-y-bottom.cover-x-center { object-position: center bottom; } .section-img .cover-y-bottom.cover-x-right { object-position: right bottom; } } /* * CSS Definitions for media */ audio, video, canvas { width: 100%; height: auto; } /* * Credit: Nicolas Gallagher and SUIT CSS. */ .embed-responsive { position: relative; display: block; height: 0; padding: 0; overflow: hidden } .embed-responsive .embed-responsive-item, .embed-responsive iframe, .embed-responsive embed, .embed-responsive object, .embed-responsive video { position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; border: 0; } /* * CSS Definitions for tables */ table { width: 100%; /*max-width: 100%;*/ border-collapse: collapse; font-size: 0.875rem; /* 14/16 */ background: #fff; position: relative } table.align-right th, table.align-right td { text-align: right; } /* SIX: unstyles p tags in tables added by the wysiwyg editor of AEM */ table p { font-size: 0.875rem; /* 14/16 */ margin-bottom: 0; } .table.valign-top tbody { vertical-align: top; } .table.valign-middle tbody { vertical-align: middle; } .table.valign-bottom tbody { vertical-align: bottom; } table, .table-fixed-scroll.table-enhanced { z-index: 1; position: relative } table:before, .table-fixed-scroll.table-enhanced:before { /* use :before to prevent css sticky bug */ content: ''; display: block; position: absolute; left: 0; top: 0; height: 100%; width: 100%; z-index: -1; box-shadow: -5px 0px 10px 0 rgba(0, 0, 0, 0.08), 10px 10px 20px 0 rgba(0, 0, 0, 0.05); } table.no-shadow, .table-fixed-scroll.table-enhanced.no-shadow { box-shadow: none } table.no-shadow:before, .table-fixed-scroll.table-enhanced.no-shadow:before { display: none; } .table-inner { box-shadow: -5px 0px 10px 0 rgba(0, 0, 0, 0.08), 10px 10px 20px 0 rgba(0, 0, 0, 0.05) } .table-inner table:before { display: none; } .no-shadow .table-inner { box-shadow: none } .table-va-top th, .table-va-top td { vertical-align: top; } table.selectable tr:hover td, table.selectable tbody tr:hover th { background: rgb(229, 240, 245); } th, td { border-bottom: 1px solid rgb(220, 220, 220); padding: 0.75rem 0.9375rem; text-align: left; word-wrap: break-word; } tfoot th, tbody tr:last-child td { border-bottom: 0; } tfoot th { border-top: 1px solid rgb(184, 184, 184); } thead th, thead td, tbody th { border-color: transparent; } thead th, thead td { position: relative } thead th:not(:empty):after, thead td:not(:empty):after { content: ''; width: calc(100% - 16px); height: 1px; background: rgb(184, 184, 184); position: absolute; left: 8px; bottom: 0; } thead th, .table-clone-corner th { color: rgb(57, 57, 57) } thead th a, .table-clone-corner th a { color: rgb(57, 57, 57) } thead th a:hover, .table-clone-corner th a:hover { color: rgb(113, 113, 113); } .table-clone-corner tr:last-child th { border-bottom-color: transparent; } thead th { vertical-align: top; } thead tr:last-child th, thead th[rowspan="2"] { border-width: 1px; border-color: rgb(222, 57, 25); } thead tr:last-child td:after, thead tr:last-child th:after, thead th[rowspan="2"]:after { display: none; } tbody th { border-bottom: 0; border-right: 1px solid rgb(220, 220, 220); } td { color: rgb(113, 113, 113); } table a { font-size: inherit; } td ul { list-style: none; margin-left: 0; margin-bottom: 0 } td ul li:last-child { margin-bottom: 0; } .info-overlay-trigger .fa { display: block; color: rgb(149, 149, 149) } .info-overlay-trigger .fa:before { border: 1px solid; padding: 5px; } .table-cell-line { display: inline-block; width: 100%; } .cell-updatable { position: relative; padding-right: 30px } .cell-updatable:after { content: ''; position: absolute; width: 0; height: 0; margin-top: -2px; border: 4px; top: 50%; right: 11px; opacity: 0; } .cell-update-negative:after { border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid rgb(233, 76, 71); } .cell-update-positive:after { border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 5px solid rgb(92, 184, 92); } .cell-update { -webkit-animation: cell-update 2s; animation: cell-update 2s; } .cell-update-negative { -webkit-animation: cell-update-negative 4s; animation: cell-update-negative 4s; } .cell-update-positive { -webkit-animation: cell-update-positive 4s; animation: cell-update-positive 4s; } .cell-updatable.cell-update-negative:after, .cell-updatable.cell-update-positive:after { -webkit-animation: cell-update-icon 4s; animation: cell-update-icon 4s; } @-webkit-keyframes cell-update { 0% { background-color: transparent; } 10% { background-color: rgb(229, 240, 245); } 40% { background-color: rgb(229, 240, 245); } 100% { background-color: transparent; } } @keyframes cell-update { 0% { background-color: transparent; } 10% { background-color: rgb(229, 240, 245); } 40% { background-color: rgb(229, 240, 245); } 100% { background-color: transparent; } } @-webkit-keyframes cell-update-negative { 0% { background-color: transparent; color: rgb(113, 113, 113); } /* background-color: color(var(--color-error) alpha(30%)); */ 10% { background-color: rgba(233, 76, 71, 0.3); color: rgb(78, 78, 78); } 40% { background-color: rgba(233, 76, 71, 0.3); color: rgb(78, 78, 78); } 100% { background-color: transparent; color: rgb(113, 113, 113); } } @keyframes cell-update-negative { 0% { background-color: transparent; color: rgb(113, 113, 113); } /* background-color: color(var(--color-error) alpha(30%)); */ 10% { background-color: rgba(233, 76, 71, 0.3); color: rgb(78, 78, 78); } 40% { background-color: rgba(233, 76, 71, 0.3); color: rgb(78, 78, 78); } 100% { background-color: transparent; color: rgb(113, 113, 113); } } @-webkit-keyframes cell-update-positive { 0% { background-color: transparent; color: rgb(113, 113, 113); } /* background-color: color(var(--color-positive) alpha(60%)); */ 10% { background-color: rgba(92, 184, 92, 0.3); color: rgb(78, 78, 78); } 40% { background-color: rgba(92, 184, 92, 0.3); color: rgb(78, 78, 78); } 100% { background-color: transparent; color: rgb(113, 113, 113); } } @keyframes cell-update-positive { 0% { background-color: transparent; color: rgb(113, 113, 113); } /* background-color: color(var(--color-positive) alpha(60%)); */ 10% { background-color: rgba(92, 184, 92, 0.3); color: rgb(78, 78, 78); } 40% { background-color: rgba(92, 184, 92, 0.3); color: rgb(78, 78, 78); } 100% { background-color: transparent; color: rgb(113, 113, 113); } } @-webkit-keyframes cell-update-icon { 0% {opacity: 0;} 10% {opacity: 1;} 40% {opacity: 1;} 100% {opacity: 0;} } @keyframes cell-update-icon { 0% {opacity: 0;} 10% {opacity: 1;} 40% {opacity: 1;} 100% {opacity: 0;} } .table-inner { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; } .table-compact td { border-bottom: 0; padding-top: 0.25rem; /* 4/16 */ padding-bottom: 0.25rem; /* 4/16 */ } .table-compact tbody tr:first-child td { padding-top: 0.75rem; } .table-compact tbody tr:last-child td { padding-bottom: 0.75rem; } .table-compact tbody + tbody { border-top: 1px solid rgb(220, 220, 220); } .table-title { display: -webkit-box; display: flex; -webkit-box-flex: 1; flex: 1; -ms-flex: 1 1 auto; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; flex-wrap: wrap; vertical-align: bottom; margin: 0.5rem 0 1.875rem } .table-title .paragraph_title { display: none; -webkit-box-flex: 1; flex-grow: 1; margin: 0.5rem 1.5rem 0.5rem 0; display: block; flex-basis: auto; align-self: center; } .table-title .table-pagination { display: none; } .table-pagination { display: block; flex-basis: auto; -webkit-box-flex: 1; flex-grow: 1 } .table-pagination .pagination { text-align: center; margin: 0; padding: 0; } .table-pagination ul { margin: 0; } .table-teaser-link { float: right; color: #4997b7 } .table-teaser-link:hover { color: #4a7485; } .table-header-bar { list-style: none; width: 100%; margin: 0; padding: 0; color: rgb(149, 149, 149); background-color: rgb(248, 248, 248); display: -webkit-box; display: flex; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: center; align-items: center; } .table-header-title .tooltip-wrapper .fa { font-size: 1rem; padding: 7px 10px; color: rgb(149, 149, 149); display: inline-block; vertical-align: middle; margin: 0; border-right: 2px solid rgb(255, 255, 255); } .table-header-title .tooltip, .table-header-title-inner { font-size: 0.75em; /* 12/16 */ text-transform: uppercase; } .table-header-title-inner { padding: 4px 8px 5px; } .tooltip-wrapper + .table-header-title-inner { display: none; } @media (min-width: 30em) { .table-header-title .tooltip-wrapper { display: none; } .tooltip-wrapper + .table-header-title-inner { display: inline-block; } } .table-header-meta { margin-bottom: 0; margin-left: 0 } .table-header-meta li { display: inline-block; margin: 0; padding: 0 8px; vertical-align: middle; border-left: 2px solid rgb(255, 255, 255); } .table-header-meta .btn.btn-link { -webkit-transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); } .table-header-meta .btn.btn-link, .table-header-meta a { display: inline-block; padding: 3px 10px 1px; color: inherit } .table-header-meta .btn.btn-link:hover, .table-header-meta a:hover { color: rgb(57, 57, 57); } .btn.btn-table-scroll-left, .btn.btn-table-scroll-right { margin: 0; text-align: center } .btn.btn-table-scroll-left .fa, .btn.btn-table-scroll-right .fa { margin-right: 0; } .btn.btn-table-scroll-left.disabled, .btn.btn-table-scroll-right.disabled { border: none; background: transparent } .btn.btn-table-scroll-left.disabled:hover, .btn.btn-table-scroll-right.disabled:hover { color: rgb(149, 149, 149); } .table-bubbling table { table-layout: fixed; } .table-bubbling tr { display: -webkit-box; display: flex; -webkit-box-flex: 1; flex: 1 1 auto; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; flex-wrap: wrap; } .table-bubbling tr:last-child th, .table-bubbling td { display: block; border-bottom-width: 0; width: 100%; -webkit-box-flex: 1; flex-grow: 1; } .table-bubbling tr:last-child th:last-child { border-bottom: 1px solid rgb(222, 57, 25); } .table-bubbling td:last-child { border-bottom: 1px solid rgb(220, 220, 220); } .table-bubbling { /* Do not override this definition */ } .table-bubbling tbody tr:last-child th:last-child, .table-bubbling tbody tr:last-child td:last-child { border-bottom-width: 0; } .table-bubbling.cols-two th, .table-bubbling.cols-two td, .table-bubbling.cols-two tr:last-child th { width: 50% } .table-bubbling.cols-two th:nth-child(odd):last-child, .table-bubbling.cols-two td:nth-child(odd):last-child, .table-bubbling.cols-two tr:last-child th:nth-child(odd):last-child { width: 100%; } .table-bubbling.cols-two tr:last-child th:not(.col-full):nth-child(odd):nth-last-child(2) { border-bottom: 1px solid rgb(222, 57, 25); } .table-bubbling.cols-two tr:last-child th.col-full:last-child { border-bottom: 1px solid rgb(222, 57, 25); } .table-bubbling.cols-two td:not(.col-full):nth-child(odd):nth-last-child(2) { border-bottom: 1px solid rgb(220, 220, 220); } .table-bubbling.cols-two td.col-full:last-child { border-bottom: 1px solid rgb(220, 220, 220); } .table-bubbling.cols-three th, .table-bubbling.cols-three td, .table-bubbling.cols-three tr:last-child th { width: 33.33333333% } .table-bubbling.cols-three th:nth-child(3n-1):last-child, .table-bubbling.cols-three td:nth-child(3n-1):last-child, .table-bubbling.cols-three tr:last-child th:nth-child(3n-1):last-child { width: 66.66666667%; } .table-bubbling.cols-three th:nth-child(3n-2):last-child, .table-bubbling.cols-three td:nth-child(3n-2):last-child, .table-bubbling.cols-three tr:last-child th:nth-child(3n-2):last-child { width: 100%; } .table-bubbling.cols-three th.col-full ~ th:nth-child(3n-2):nth-last-child(2), .table-bubbling.cols-three td.col-full ~ td:nth-child(3n-2):nth-last-child(2), .table-bubbling.cols-three tr:last-child th.col-full ~ th:nth-child(3n-2):nth-last-child(2) { border-bottom-width: 0; } .table-bubbling.cols-three th.col-full + th:nth-child(3n-2):nth-last-child(2), .table-bubbling.cols-three tr:last-child th.col-full + th:nth-child(3n-2):nth-last-child(2) { border-bottom: 1px solid rgb(222, 57, 25); } .table-bubbling.cols-three td.col-full + td:nth-child(3n-2):nth-last-child(2) { border-bottom: 1px solid rgb(220, 220, 220); } .table-bubbling.cols-three { /* Rules only apply if none of the last columns are expanded to 100% */ } .table-bubbling.cols-three tr:last-child th:not(.col-full) { /* If the number of columns %3 == 0, 3 columns are underlined */ } .table-bubbling.cols-three tr:last-child th:not(.col-full):nth-child(3n):last-child, .table-bubbling.cols-three tr:last-child th:not(.col-full):nth-child(3n-1):nth-last-child(2), .table-bubbling.cols-three tr:last-child th:not(.col-full):nth-child(3n-2):nth-last-child(3), .table-bubbling.cols-three tr:last-child th:not(.col-full):nth-child(3n-1):last-child, .table-bubbling.cols-three tr:last-child th:not(.col-full):nth-child(3n-2):nth-last-child(2), .table-bubbling.cols-three tr:last-child th:not(.col-full):nth-child(3n-2):last-child { border-bottom: 1px solid rgb(222, 57, 25); } .table-bubbling.cols-three tr:last-child th.col-full:last-child { border-bottom: 1px solid rgb(222, 57, 25); } .table-bubbling.cols-three td:not(.col-full) { /* If the number of columns %3 == 0, 3 columns are underlined */ } .table-bubbling.cols-three td:not(.col-full):nth-child(3n):last-child, .table-bubbling.cols-three td:not(.col-full):nth-child(3n-1):nth-last-child(2), .table-bubbling.cols-three td:not(.col-full):nth-child(3n-2):nth-last-child(3), .table-bubbling.cols-three td:not(.col-full):nth-child(3n-1):last-child, .table-bubbling.cols-three td:not(.col-full):nth-child(3n-2):nth-last-child(2), .table-bubbling.cols-three td:not(.col-full):nth-child(3n-2):last-child { border-bottom: 1px solid rgb(220, 220, 220); } .table-bubbling.cols-three td.col-full:last-child { border-bottom: 1px solid rgb(220, 220, 220); } .table-bubbling .col-full { width: 100% !important; } .table-bubbling colgroup { display: none; } /* SIX style definitions for tables */ table .prominent { background: rgba(57, 57, 57, 0.05) } table .prominent[colspan="2"] { background: none; } .zebra tr.odd { /* background: color(var(--color-black) a(5%)); */ background: rgba(57, 57, 57, 0.05); } .zebra td { border: 0; } .zebra thead tr.odd { background: #fff; } /* Scroll Table test */ .table-fixed-scroll.table-enhanced { position: relative; margin-bottom: 1rem; z-index: 1 } .table-fixed-scroll.table-enhanced table:before { display: none; } .table-fixed-scroll.table-enhanced .table-inner { box-shadow: none; } .table-fixed-scroll.table-enhanced table { margin-bottom: 0; } .table-fixed-scroll.table-enhanced .table-clone-wrapper-left { border-right: 1px solid rgb(220, 220, 220); } .table-fixed-scroll.table-enhanced .table-clone-wrapper-top { border-bottom: 1px solid rgb(222, 57, 25); } .table-fixed-scroll.table-enhanced thead tr:last-child th { border-bottom-color: transparent; } .table-fixed-scroll.table-enhanced .table-inner { width: auto; -webkit-overflow-scrolling: auto; } .table-clone-wrapper-top, .table-clone-wrapper-left { background: #fff } .table-clone-wrapper-top .table-clone-inner, .table-clone-wrapper-left .table-clone-inner { background: #fff; overflow: hidden; } .table-clone-wrapper-top { position: -webkit-sticky; position: sticky; width: 100%; top: 0; z-index: 5; overflow: hidden; } .table-enhanced-sticky .table-clone-wrapper-top { position: absolute; } .table-clone-wrapper-left { position: absolute; left: 0; top: 0; height: 100%; z-index: 3 } .table-clone-wrapper-left:before { content: ''; position: absolute; top: 5px; left: 50%; width: 50%; height: calc(100% - 10px); box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.15); z-index: -1; opacity: 0; } .is-scrolled .table-clone-wrapper-left:before { opacity: 1; } .table-clone-corner { position: absolute; left: 0; top: 0; z-index: 10 } .table-clone-corner:before { display: none; } .table-clone-corner th a { /* override to match "thead th a" behaviour */ color: rgb(57, 57, 57) } .table-clone-corner th a:hover { color: rgb(113, 113, 113); } .table-fixed-scroll .table-clone-corner { box-shadow: none; } .table-fixed-scroll.is-scrolled .table-clone-corner { box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.15); } .table-orderbook .table-inner { /* max-height: 275px; min-height: 100px; */ overflow-y: auto; } .table-orderbook tr { -webkit-transform: none; transform: none; -webkit-transition: -webkit-transform 1s; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s, -webkit-transform 1s; } .table-orderbook th span, .table-orderbook td span { display: block; } .row-separator td, .row-separator th, .ob-ask-row-0 td { border-bottom: 1px solid rgb(136, 193, 228); } @media (min-width: 48em) { .table-orderbook th span, .table-orderbook td span { display: inline-block; width: 48%; } } @media (max-width: 63.999em) { .table-fixed-scroll.table-enhanced tbody th { max-width: 150px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } } @media (min-width: 64em) { .main .table-clone-wrapper-top { top: calc(3.375rem + 3.75rem); } .expander-body.is-closing .table-clone-wrapper-top, .expander-body[aria-hidden="true"] .table-clone-wrapper-top { top: 0; /* fixes issues with position: sticky and overflow: hidden */ } } .table .sort a { width: 100%; display: inline-block; cursor: pointer } .table .sort a:after { content: url(data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M4.177%205.53L4%205.707l-.354-.353-3-3L.293%202%201%201.293l.354.353L4%204.293l2.646-2.647L7%201.293%207.707%202l-.353.354-3%203-.177.176z%22%20fill%3D%22currentColor%22/%3E%3C/svg%3E); margin-top: -2px; display: inline-block; width: 0px; height: 100%; overflow: visible; -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: pointer; vertical-align: middle; } .table .sort-desc, .table .sort-asc { background-color: rgb(248, 248, 248) } .table .sort-desc a:after, .table .sort-asc a:after { content: url(data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M4.177%205.53L4%205.707l-.354-.353-3-3L.293%202%201%201.293l.354.353L4%204.293l2.646-2.647L7%201.293%207.707%202l-.353.354-3%203-.177.176z%22%20fill%3D%22%23de3919%22/%3E%3C/svg%3E); } .table .sort-asc a:after { content: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%3Cpath%20d%3D%22M3.8%201.5L4%201.3l0.4%200.4%203%203L7.7%205%207%205.7%206.6%205.4%204%202.7%201.4%205.4%201%205.7%200.3%205l0.4-0.4%203-3L3.8%201.5z%22%20fill%3D%22%23DE3919%22%2F%3E%3C%2Fsvg%3E); } /* IE11 Hack for inline sorting arrow */ @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .table .sort a:after { content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAACxJREFUeNpiYCASKOATBxH/gTgBTTIBKo7CScDBRxGcj8NE3DqJdTB2ABBgADk9C9mWmNS6AAAAAElFTkSuQmCC); } .table .sort-desc a:after, .table .sort-asc a:after { content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAEtJREFUeNpiYCAG3LOUVMAlzgSVvA+kE9AkQfz7TErHnz8AMhKBeD5MEZSeDxJnRNMBElwAxCB2IlDzAnQ7E4D4P7p1RDkYJwAIMADAVh1DWMdASAAAAABJRU5ErkJggg==); } .table .sort-asc a:after { content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAEdJREFUeNpiYCAF3LOUNADi+yAaJsaELAmk9kO5+2GKmNAkNygdf64IomGKGIGEApBzHiqZiGTifCAVAOMk4HBTAgPFACDAAI54GuFRD/ttAAAAAElFTkSuQmCC); } } /** * Styles for the responsive table utility */ @media (max-width: 63.999em) { .table-deconstruct { display: block } .table-deconstruct thead th, .table-deconstruct tfoot th { display: none; } .table-deconstruct tr { background-color: transparent !important; } .table-deconstruct tbody, .table-deconstruct tr { display: block; } .table-deconstruct tbody th, .table-deconstruct tbody td { display: block; vertical-align: top; padding-left: 0; padding-right: 0 } .table-deconstruct tbody th:before, .table-deconstruct tbody td:before { content: attr(data-column-name); font-weight: bold; display: inline-block; vertical-align: middle; width: auto; padding-right: 3%; } .table-deconstruct tbody th:last-child, .table-deconstruct tbody td:last-child { margin-bottom: 1rem; } } @media (min-width: 30em) { .table-pagination .pagination { text-align: right; } .table-title .table-pagination { display: block; } } @media (min-width: 48em) { .table-bubbling tr { display: table-row; } .table-bubbling tr:last-child th, .table-bubbling th, .table-bubbling td { display: table-cell; border-bottom-width: 1px !important } .table-bubbling tr:last-child th:first-child, .table-bubbling tr:last-child th:last-child, .table-bubbling th:first-child, .table-bubbling th:last-child, .table-bubbling td:first-child, .table-bubbling td:last-child { padding: 0.75rem 0.9375rem; } .table-bubbling.first-two th:nth-child(-n+2), .table-bubbling.first-two td:nth-child(-n+2), .table-bubbling.first-two th:nth-child(n+3), .table-bubbling.first-two td:nth-child(n+3) { padding: 0.75rem 0.9375rem; max-width: none; } .table-bubbling.cols-two th, .table-bubbling.cols-two td { padding: 0.75rem 0.9375rem } .table-bubbling.cols-two th + td, .table-bubbling.cols-two td + td { padding: 0.75rem 0.9375rem; } .table-bubbling.cols-two th:last-child, .table-bubbling.cols-two td:last-child { padding: 0.75rem 0.9375rem; } .table-bubbling colgroup { display: table-column-group; } } @media print { .table-inner { box-shadow: none; } th, td { padding: .25rem 0; } } /** * Styles for the teaser tables */ .table-teaser td:first-child { /*border-right: 1px solid var(--color-rock-20);*/ box-shadow: 1px 0 0 0 rgb(184, 184, 184); } .table-teaser .table-teaser__date-col { width: 110px; } @media (max-width: 47.999em) { .table-teaser-wrapper { position: relative } .table-teaser-wrapper:before { /* use :before to prevent css sticky bug */ content: ''; display: block; position: absolute; left: 0; top: 0; height: 100%; width: 100%; z-index: -1; box-shadow: -5px 0px 10px 0 rgba(0, 0, 0, 0.08), 10px 10px 20px 0 rgba(0, 0, 0, 0.05); } .table-teaser { overflow-x: auto } .table-teaser table:before { content: none; } } .table-badge { display: block; color: rgb(113, 113, 113); font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; margin: 0; padding: 0; } .table-badge-day { font-size: 1.375rem; /* 22/16 */ display: block; line-height: 1.1; text-align: center; position: relative } .table-badge-day span { display: inline-block; width: 100%; white-space: nowrap; } .table-badge-day span:nth-child(1):nth-last-child(2){ width: 50%; min-width: 45px } .table-badge-day span:nth-child(1):nth-last-child(2):after { position: absolute; content: '–'; top: 1px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); display: block; font-weight: 200; } .table-badge-day span:nth-child(2):nth-last-child(1) { width: 50%; min-width: 45px; } .table-badge-month { display: block; font-size: 0.75rem; /* 12/16 */ font-weight: 700; text-align: center } .table-badge-month span { display: inline-block; width: 100%; white-space: nowrap; } .table-badge-month span:nth-child(1):nth-last-child(2), .table-badge-month span:nth-child(2):nth-last-child(1) { width: 50%; padding: 0 0.25rem; } /** * Table column groups style definitions */ colgroup .col-hidden { visibility: collapse; width: 0; } colgroup .col-teaser-date { width: 75px; } colgroup .col-simple-date { width: 105px; } colgroup .col-1of3 { width: 33.33333333%; } colgroup .col-2of3 { width: 66.66666667%; } colgroup .col-3of3 { width: 100%; } /** * Styles for System Notifications that could als obe used from the autor system */ .system-notifications { position: fixed; height: 100%; width: auto; left: auto; right: 0; top: 0; display: -webkit-box; display: flex; -webkit-box-flex: 1; flex: 1 1 auto; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-box-align: end; align-items: flex-end; /* align right */ -webkit-box-pack: end; justify-content: flex-end; /* align bottom */ pointer-events: none; z-index: 99999; } .system-notification { display: inline-block; position: static; margin: .5rem; width: auto; max-width: 800px; background: rgb(255, 255, 255); pointer-events: auto } .system-notification + .system-notification { margin-top: 0; } .system-notification .state { position: relative; display: inline-block; width: 100%; min-height: 4rem; padding: 0.9rem 3.4rem 0.9rem 1.1rem; border-left: 4px solid; border-color: rgb(78, 78, 78); box-shadow: -5px 0px 10px 0 rgba(0, 0, 0, 0.08), 10px 10px 20px 0 rgba(0, 0, 0, 0.05); -webkit-transition: box-shadow 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: box-shadow 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) } .system-notification .state.success { border-color: rgb(92, 184, 92); } .system-notification .state.info { border-color: rgb(73, 150, 183); } .system-notification .state.warning { border-color: rgb(253, 198, 82); } .system-notification .state.error { border-color: rgb(233, 76, 71); } .system-notification .btn-link { color: rgb(73, 151, 183) } .system-notification .btn-link:active, .system-notification .btn-link:focus, .system-notification .btn-link:hover { /* color: color(var(--color-horizon) shade(10%)); */ color: #4288a5; } .system-notification:hover .state { box-shadow: 5px 10px 15px 0 rgba(0, 0, 0, 0.18); } .system-notification .close-icon { color: rgb(222, 57, 25); margin-right: 0; font-size: 12px; } .system-notification-close { background: transparent; border: 0px solid transparent; cursor: pointer; position: absolute; left: auto; right: 0; top: 0.25rem; padding: 0.5rem; margin-bottom: 0 } .system-notification-close:active, .system-notification-close:focus, .system-notification-close:hover { background: transparent; border: 0px solid transparent; } .system-notification-cta { margin-top: 1rem } .system-notification-cta .btn { margin-bottom: 0; } .system-notification-text { font-size: 0.875rem; color: rgb(113, 113, 113); } @media (min-width: 48em) { .system-notification { margin: 1rem } .system-notification .state { padding: 1.25rem 3.75rem 1.125rem 1.875rem; } } @media print { .system-notifications { display: none; } } h1,h2,h3,h4,h5,fieldset legend,.page_title,.section_title,.chapter_title,.paragraph_title,.list .title { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; margin-top: 0; margin-bottom: .5rem; font-weight: 700; } /* colors */ .color-inverted, .color-inverted h1, .color-inverted h2, .color-inverted h3, .color-inverted h4, .color-inverted h5, .color-inverted fieldset legend, .color-inverted .page_title, .color-inverted .section_title, .color-inverted .chapter_title, .color-inverted .paragraph_title, .color-inverted .list .title, .color-inverted .featured.borderedColumns, .color-inverted .featured.borderedColumns h1, .color-inverted .featured.borderedColumns h2, .color-inverted .featured.borderedColumns h3, .color-inverted .featured.borderedColumns h4, .color-inverted .featured.borderedColumns h5, .color-inverted .featured.borderedColumns fieldset legend, .color-inverted .featured.borderedColumns .page_title, .color-inverted .featured.borderedColumns .section_title, .color-inverted .featured.borderedColumns .chapter_title, .color-inverted .featured.borderedColumns .paragraph_title, .color-inverted .featured.borderedColumns .list .title, .color-inverted h6 { color: rgb(255, 255, 255); } .color-inverted .featured, /* Set the text color to default inside a Grid elements with White Background option selected */ .color-inverted .featured.borderedColumns.borderedColumns--white-bg, /* Set the text color to default inside an Asset Taxonomy List elements with White Background option selected */ .color-inverted .list-bordered--white-bg .item { color: rgb(113, 113, 113); } h1,h2,h3,h4,h5,fieldset legend,.page_title,.section_title,.chapter_title,.paragraph_title,.list .title, .featured h1, .featured h2, .featured h3, .featured h4, .featured h5, .featured fieldset legend, .featured .page_title, .featured .section_title, .featured .chapter_title, .featured .paragraph_title, .featured .list .title, .color-inverted .featured.borderedColumns.borderedColumns--white-bg h1, .color-inverted .featured.borderedColumns.borderedColumns--white-bg h2, .color-inverted .featured.borderedColumns.borderedColumns--white-bg h3, .color-inverted .featured.borderedColumns.borderedColumns--white-bg h4, .color-inverted .featured.borderedColumns.borderedColumns--white-bg h5, .color-inverted .featured.borderedColumns.borderedColumns--white-bg fieldset legend, .color-inverted .featured.borderedColumns.borderedColumns--white-bg .page_title, .color-inverted .featured.borderedColumns.borderedColumns--white-bg .section_title, .color-inverted .featured.borderedColumns.borderedColumns--white-bg .chapter_title, .color-inverted .featured.borderedColumns.borderedColumns--white-bg .paragraph_title, .color-inverted .featured.borderedColumns.borderedColumns--white-bg .list .title, .color-inverted .list-bordered--white-bg .item h1, .color-inverted .list-bordered--white-bg .item h2, .color-inverted .list-bordered--white-bg .item h3, .color-inverted .list-bordered--white-bg .item h4, .color-inverted .list-bordered--white-bg .item h5, .color-inverted .list-bordered--white-bg .item fieldset legend, .color-inverted .list-bordered--white-bg .item .page_title, .color-inverted .list-bordered--white-bg .item .section_title, .color-inverted .list-bordered--white-bg .item .chapter_title, .color-inverted .list-bordered--white-bg .item .paragraph_title, .color-inverted .list-bordered--white-bg .item .list .title { color: rgb(57, 57, 57); } .color-inverted .featured h6 { color: rgb(184, 184, 184); } .bg-red a { color: rgb(255, 255, 255); } @media print { .color-inverted { color: rgb(113, 113, 113); } .color-inverted h1,.color-inverted h2,.color-inverted h3,.color-inverted h4,.color-inverted h5,.color-inverted fieldset legend,.color-inverted .page_title,.color-inverted .section_title,.color-inverted .chapter_title,.color-inverted .paragraph_title,.color-inverted .list .title { color: rgb(57, 57, 57); } .color-inverted h6 { color: rgb(184, 184, 184); } } /* font-sizes */ h1,.page_title,.top-level-teaser.top-level-teaser--with-header-h1 .title,.page-list-related.page-list-related--with-header-h1 .list2 li.item h1,.page-list-related.page-list-related--with-header-h1 .list2 li.item h2,.page-list-related.page-list-related--with-header-h1 .list2 li.item h3,.page-list-related.page-list-related--with-header-h1 .list2 li.item h4 { font-family: "Noto Serif", Georgia, "Times New Roman", Times, serif; font-size: 2rem; letter-spacing: -0.01667em; /* -1px at font-size size 60px */ line-height: 1.25; } h2,.section_title,.top-level .title,.list-box .title,.list-highlight .title,.list-teaser-box-vertical .title,.list-teaser-highlight .title,.top-level-teaser.top-level-teaser--with-header-h2 .title,.page-list-related.page-list-related--with-header-h2 .list2 li.item h1,.page-list-related.page-list-related--with-header-h2 .list2 li.item h2,.page-list-related.page-list-related--with-header-h2 .list2 li.item h3,.page-list-related.page-list-related--with-header-h2 .list2 li.item h4 { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-size: 1.375rem; letter-spacing: -0.0104em; /* -0.3px at font-size 32 */ line-height: 1.2; } h3,fieldset legend,.lead,.chapter_title,.list-box.list-title-smaller .title,.list-highlight.list-title-smaller .title,.list-normal.list-title-bigger .title,.search-page .result .title,.top-level-teaser.top-level-teaser--with-header-h3 .title,.page-list-related.page-list-related--with-header-h3 .list2 li.item h1,.page-list-related.page-list-related--with-header-h3 .list2 li.item h2,.page-list-related.page-list-related--with-header-h3 .list2 li.item h3,.page-list-related.page-list-related--with-header-h3 .list2 li.item h4 { font-size: 1.250em; line-height: 1.2; } h4,.paragraph_title,.list-normal .title,.list.list-title-small .title,.list-teaser-alternating .title,.list-teaser-normal .title,.top-level-teaser.top-level-teaser--with-header-h4 .title,.page-list-related.page-list-related--with-header-h4 .list2 li.item h1,.page-list-related.page-list-related--with-header-h4 .list2 li.item h2,.page-list-related.page-list-related--with-header-h4 .list2 li.item h3,.page-list-related.page-list-related--with-header-h4 .list2 li.item h4 { font-size: 1.125rem; line-height: 1.222; } h5 { font-size: 1rem; line-height: 1.222; } h6, .footer .social_connect .description { font-family: "Noto Sans", Helvetica, Arial, sans-serif; color: rgb(184, 184, 184); font-weight: 700; font-size: 0.750rem; margin-top: 0; margin-bottom: .5rem; text-transform: uppercase; line-height: 1.25; } @media (min-width: 48em) { h1,.page_title,.top-level-teaser.top-level-teaser--with-header-h1 .title,.page-list-related.page-list-related--with-header-h1 .list2 li.item h1,.page-list-related.page-list-related--with-header-h1 .list2 li.item h2,.page-list-related.page-list-related--with-header-h1 .list2 li.item h3,.page-list-related.page-list-related--with-header-h1 .list2 li.item h4 { font-size: 3rem; line-height: 1.145833; } h2,.section_title,.top-level .title,.list-box .title,.list-highlight .title,.list-teaser-box-vertical .title,.list-teaser-highlight .title,.top-level-teaser.top-level-teaser--with-header-h2 .title,.page-list-related.page-list-related--with-header-h2 .list2 li.item h1,.page-list-related.page-list-related--with-header-h2 .list2 li.item h2,.page-list-related.page-list-related--with-header-h2 .list2 li.item h3,.page-list-related.page-list-related--with-header-h2 .list2 li.item h4 { font-size: 2rem; line-height: 1.28; } h3,fieldset legend,.lead,.chapter_title,.list-box.list-title-smaller .title,.list-highlight.list-title-smaller .title,.list-normal.list-title-bigger .title,.search-page .result .title,.top-level-teaser.top-level-teaser--with-header-h3 .title,.page-list-related.page-list-related--with-header-h3 .list2 li.item h1,.page-list-related.page-list-related--with-header-h3 .list2 li.item h2,.page-list-related.page-list-related--with-header-h3 .list2 li.item h3,.page-list-related.page-list-related--with-header-h3 .list2 li.item h4 { font-size: 1.5rem; line-height: 1.333333; } .lead { margin-bottom: 40px; } } @media (min-width: 30em) { h4,.paragraph_title,.list-normal .title,.list.list-title-small .title,.list-teaser-alternating .title,.list-teaser-normal .title,.top-level-teaser.top-level-teaser--with-header-h4 .title,.page-list-related.page-list-related--with-header-h4 .list2 li.item h1,.page-list-related.page-list-related--with-header-h4 .list2 li.item h2,.page-list-related.page-list-related--with-header-h4 .list2 li.item h3,.page-list-related.page-list-related--with-header-h4 .list2 li.item h4 { font-size: 1.125rem; line-height: 1.25; } } @media (min-width: 80.125em) { .hero-header h1,.hero-header h2,.hero-header h3,.hero-header h4,.hero-header h5,.hero-header fieldset legend,.hero-header .page_title,.hero-header .section_title,.hero-header .chapter_title,.hero-header .paragraph_title,.hero-header .list .title, .header-image-wrapper h1, .header-image-wrapper h2, .header-image-wrapper h3, .header-image-wrapper h4, .header-image-wrapper h5, .header-image-wrapper fieldset legend, .header-image-wrapper .page_title, .header-image-wrapper .section_title, .header-image-wrapper .chapter_title, .header-image-wrapper .paragraph_title, .header-image-wrapper .list .title { color: rgb(255, 255, 255); } } .underlined_title { border-bottom: 1px solid rgb(222, 57, 25); margin-bottom: 1.25rem; } .bg-red .underlined_title { border-bottom-color: rgb(255, 255, 255); } .bg-red .featured .underlined_title { border-bottom-color: rgb(222, 57, 25); } p { margin-top: 0; font-size: 1rem; margin-bottom: 1em; line-height: 1.64; } .lead { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-weight: bold; line-height: 1.4; margin-bottom: 20px; color: rgb(57, 57, 57); } /* TODO: doublecheck this */ .reduced { font-size: 0.875rem; line-height: 1.58; } .cell-negative, .data-pair-list .cell-negative { color: rgb(233, 76, 71); } .cell-positive, .data-pair-list .cell-positive { color: rgb(92, 184, 92); } a { font-weight: bold; color: #4997b7; text-decoration: none; -webkit-transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); /* Break long links, hyphens is needed for IE11 */ -ms-hyphens: auto; word-break: break-word } a:focus { outline: thin dotted; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } a:hover { color: #4a7485; text-decoration: none; } a .fa-li { top: 0.25em; } .home-page a[target="_blank"][href^="http"]::after, .page-content a[target="_blank"][href^="http"]::after { content: "\ea1c"; font-family: "SIX-Pictogram"; font-size: 0.75em; margin-left: 5px; } .home-page .linklist:not(.link-list--with-file-exts) a[target="_blank"]::after, .page-content .linklist:not(.link-list--with-file-exts) a[target="_blank"]::after { content: "" !important; } .home-page a[href*=".jpg"][target="_blank"]:not(.link-list__link--with-file-ext)::after, .home-page a[href*=".png"][target="_blank"]:not(.link-list__link--with-file-ext)::after, .home-page a[href*=".gif"][target="_blank"]:not(.link-list__link--with-file-ext)::after, .home-page a[href$=".pdf"][target="_blank"]:not(.link-list__link--with-file-ext)::after, .home-page .no-extension a[target="_blank"]::after, .home-page a[target="_blank"].no-extension::after, .home-page a[target="_blank"].empty-extension::after, .home-page a[target="_blank"].btn::after, .home-page a[target="_blank"].buttonlink::after, .home-page .intraday-chart-teaser a[target="_blank"]::after, .page-content a[href*=".jpg"][target="_blank"]:not(.link-list__link--with-file-ext)::after, .page-content a[href*=".png"][target="_blank"]:not(.link-list__link--with-file-ext)::after, .page-content a[href*=".gif"][target="_blank"]:not(.link-list__link--with-file-ext)::after, .page-content a[href$=".pdf"][target="_blank"]:not(.link-list__link--with-file-ext)::after, .page-content .no-extension a[target="_blank"]::after, .page-content a[target="_blank"].no-extension::after, .page-content a[target="_blank"].empty-extension::after, .page-content a[target="_blank"].btn::after, .page-content a[target="_blank"].buttonlink::after, .page-content .intraday-chart-teaser a[target="_blank"]::after { content: none !important; } /* SIX-4608: removes open in new window icon in download lists */ .page-content .downloads a[target="_blank"]::after { content: none; } /* SIX-5198: allow non horizontal lists to have outgoing arrow */ .page-content [data-six-layout="horizontal"] a[target="_blank"]:after { content: none; } .figure .caption, .figure .caption p, figure .caption, figure .caption p, .fig .caption, .fig .caption p { font-size: 0.875rem; } .filter-result .caption, .filter-result .caption p, .tab-item .caption, .tab-item .caption p, .table .caption, .table .caption p { font-size: 0.75rem; } .disclaimer { display: block; width: 100%; margin: 1.75rem 0 0.5rem; border-top: 4px solid rgb(136, 193, 228); padding-top: 0.25rem } .disclaimer .caption, .disclaimer .caption p { font-size: 0.75rem; } .nowrap { white-space: nowrap } .text-center { text-align: center; } /* IMEX: bond calculator something */ .info-title { display: -webkit-box; display: flex; -webkit-box-pack: justify; justify-content: space-between; vertical-align: middle; margin: 10px 0 20px } .info-title h2, .info-title h3, .info-title h4 { margin: 0; } code, kbd, pre, samp { font-family: "Roboto Mono", Consolas, "Liberation Mono", "Courier New", monospace; font-size: .92em; } code { display: inline-block; padding: 5px 7px; border-radius: 3px; background: rgba(0, 0, 0, 0.15); text-transform: none; } [role="button"] { cursor: pointer; } /* there'd probably be a better place to put this styling for linklists with [data-six-menu=true] */ .menu { top: 60px; box-shadow: 0 4px 10px -2px rgba(62, 62, 62, 0.9); display: none; left: 0; list-style: none; margin: 0 auto; max-width: 500px; padding: 0; position: absolute } .menu li { background-color: #fff; margin: 0 } .menu li:first-child { padding-top: 15px; } .menu li:last-child { padding-bottom: 15px; } .menu:before { background-color: #fff; box-shadow: 0 0 5px -2px rgba(0, 0, 0, 0.9); content: ""; display: inline-block; height: 40px; left: calc(50% - 20px); position: absolute; top: -6px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); width: 40px; z-index: -1; } .pull-right > .menu { left: auto; right: 0; } .menu a { display: block; padding: 5px 20px; } .dropdown_top .menu { bottom: 60px; top: auto; } .dropdown_top .menu:before { bottom: -10px; box-shadow: -5px 5px 7px -3px rgba(84, 84, 84, 0.9); top: auto; } /* Dropdown */ .dropdown_menu.open .menu { display: block; z-index: 100; } .dropdown_menu .menu.pull-right { left: auto; right: 0; } .dropdown_menu a { background-image: none; } /* Buttonlink - Dropdown*/ .button_link.dropdown_menu { position: relative; } /* include logos and icons in the build */ .six-logo2-svg { background-image: url("build/images/logos/logo2-six.min.svg?770d1768f1f9d6c7"); background-repeat: no-repeat; } .six-logo-svg { background-image: url("build/images/logos/logo-six.min.svg?770d1768f1f9d6c7"); background-repeat: no-repeat; } .six-logo-png { background-image: url("build/images/logos/logo-six.min.png?f91081eeccb8f9c0"); background-repeat: no-repeat; } .six-logo-ps-svg { background-image: url("build/images/logos/logo-six-payment-services.min.svg?ae82f1ce85b61b9f"); background-repeat: no-repeat; } .six-logo-ps-png { background-image: url("build/images/logos/logo-six-payment-services.min.png?ece07c96227efd64"); background-repeat: no-repeat; } .six-compass-svg { background-image: url("build/images/compass.svg?3bfeb3acbec8892a"); background-repeat: no-repeat; } .six-icon-marker { background-image: url("build/images/icon-marker@2x.png?11a86842a52f604e"); background-repeat: no-repeat; } .six-icon-marker-active { background-image: url("build/images/icon-marker-active@2x.png?4c9b0213563b551b"); background-repeat: no-repeat; } /* components */ /* all margins between components ---- margins within a component should be defined in _.css */ .list, .list2, .row, .blockquote, .iconbox, .image-slider, .textimage, .table, .downloads, .cta, .list-teaser-contact-cta, .filter-form, .search-results { margin-bottom: 1.25rem } .list:last-child, .list2:last-child, .row:last-child, .blockquote:last-child, .iconbox:last-child, .image-slider:last-child, .textimage:last-child, .table:last-child, .downloads:last-child, .cta:last-child, .list-teaser-contact-cta:last-child, .filter-form:last-child, .search-results:last-child { margin-bottom: 0; } [class^=column_] .list:last-child, [class^=column_] .list2:last-child, [class^=column_] .row:last-child, [class^=column_] .blockquote:last-child, [class^=column_] .iconbox:last-child, [class^=column_] .image-slider:last-child, [class^=column_] .textimage:last-child, [class^=column_] .table:last-child, [class^=column_] .downloads:last-child, [class^=column_] .cta:last-child, [class^=column_] .list-teaser-contact-cta:last-child, [class^=column_] .filter-form:last-child, [class^=column_] .search-results:last-child { margin-bottom: 1.25rem } [class^=column_]:last-child .list:last-child, [class^=column_]:last-child .list2:last-child, [class^=column_]:last-child .row:last-child, [class^=column_]:last-child .blockquote:last-child, [class^=column_]:last-child .iconbox:last-child, [class^=column_]:last-child .image-slider:last-child, [class^=column_]:last-child .textimage:last-child, [class^=column_]:last-child .table:last-child, [class^=column_]:last-child .downloads:last-child, [class^=column_]:last-child .cta:last-child, [class^=column_]:last-child .list-teaser-contact-cta:last-child, [class^=column_]:last-child .filter-form:last-child, [class^=column_]:last-child .search-results:last-child { margin-bottom: 0 } @media (min-width: 64em) { [class^=column_] .list:last-child, [class^=column_] .list2:last-child, [class^=column_] .row:last-child, [class^=column_] .blockquote:last-child, [class^=column_] .iconbox:last-child, [class^=column_] .image-slider:last-child, [class^=column_] .textimage:last-child, [class^=column_] .table:last-child, [class^=column_] .downloads:last-child, [class^=column_] .cta:last-child, [class^=column_] .list-teaser-contact-cta:last-child, [class^=column_] .filter-form:last-child, [class^=column_] .search-results:last-child { margin-bottom: 0 } } @media (max-width: 63.999em) { .row.row--reversed-mobile-order [class^=column_]:first-child .list:last-child, .row.row--reversed-mobile-order [class^=column_]:first-child .list2:last-child, .row.row--reversed-mobile-order [class^=column_]:first-child .row:last-child, .row.row--reversed-mobile-order [class^=column_]:first-child .blockquote:last-child, .row.row--reversed-mobile-order [class^=column_]:first-child .iconbox:last-child, .row.row--reversed-mobile-order [class^=column_]:first-child .image-slider:last-child, .row.row--reversed-mobile-order [class^=column_]:first-child .textimage:last-child, .row.row--reversed-mobile-order [class^=column_]:first-child .table:last-child, .row.row--reversed-mobile-order [class^=column_]:first-child .downloads:last-child, .row.row--reversed-mobile-order [class^=column_]:first-child .cta:last-child, .row.row--reversed-mobile-order [class^=column_]:first-child .list-teaser-contact-cta:last-child, .row.row--reversed-mobile-order [class^=column_]:first-child .filter-form:last-child, .row.row--reversed-mobile-order [class^=column_]:first-child .search-results:last-child { margin-bottom: 0 } .row.row--reversed-mobile-order [class^=column_]:last-child .list:last-child, .row.row--reversed-mobile-order [class^=column_]:last-child .list2:last-child, .row.row--reversed-mobile-order [class^=column_]:last-child .row:last-child, .row.row--reversed-mobile-order [class^=column_]:last-child .blockquote:last-child, .row.row--reversed-mobile-order [class^=column_]:last-child .iconbox:last-child, .row.row--reversed-mobile-order [class^=column_]:last-child .image-slider:last-child, .row.row--reversed-mobile-order [class^=column_]:last-child .textimage:last-child, .row.row--reversed-mobile-order [class^=column_]:last-child .table:last-child, .row.row--reversed-mobile-order [class^=column_]:last-child .downloads:last-child, .row.row--reversed-mobile-order [class^=column_]:last-child .cta:last-child, .row.row--reversed-mobile-order [class^=column_]:last-child .list-teaser-contact-cta:last-child, .row.row--reversed-mobile-order [class^=column_]:last-child .filter-form:last-child, .row.row--reversed-mobile-order [class^=column_]:last-child .search-results:last-child { margin-bottom: 1.25rem } } .button_link, button[type="submit"], button[type="reset"], input[type="submit"], input[type="reset"], .iframe, .linklist, .fa-ul[data-six-layout], .form.link_list, .dropdown_menu { margin-bottom: 1rem } .button_link:last-child, button[type="submit"]:last-child, button[type="reset"]:last-child, input[type="submit"]:last-child, input[type="reset"]:last-child, .iframe:last-child, .linklist:last-child, .fa-ul[data-six-layout]:last-child, .form.link_list:last-child, .dropdown_menu:last-child { margin-bottom: 0; } [class^=column_] .button_link:last-child, [class^=column_] button[type="submit"]:last-child, [class^=column_] button[type="reset"]:last-child, [class^=column_] input[type="submit"]:last-child, [class^=column_] input[type="reset"]:last-child, [class^=column_] .iframe:last-child, [class^=column_] .linklist:last-child, [class^=column_] .fa-ul[data-six-layout]:last-child, [class^=column_] .form.link_list:last-child, [class^=column_] .dropdown_menu:last-child { margin-bottom: 1rem } [class^=column_]:last-child .button_link:last-child, [class^=column_]:last-child button[type="submit"]:last-child, [class^=column_]:last-child button[type="reset"]:last-child, [class^=column_]:last-child input[type="submit"]:last-child, [class^=column_]:last-child input[type="reset"]:last-child, [class^=column_]:last-child .iframe:last-child, [class^=column_]:last-child .linklist:last-child, [class^=column_]:last-child .fa-ul[data-six-layout]:last-child, [class^=column_]:last-child .form.link_list:last-child, [class^=column_]:last-child .dropdown_menu:last-child { margin-bottom: 0 } @media (min-width: 64em) { [class^=column_] .button_link:last-child, [class^=column_] button[type="submit"]:last-child, [class^=column_] button[type="reset"]:last-child, [class^=column_] input[type="submit"]:last-child, [class^=column_] input[type="reset"]:last-child, [class^=column_] .iframe:last-child, [class^=column_] .linklist:last-child, [class^=column_] .fa-ul[data-six-layout]:last-child, [class^=column_] .form.link_list:last-child, [class^=column_] .dropdown_menu:last-child { margin-bottom: 0 } } @media (max-width: 63.999em) { .button_link .btn { display: table; margin-bottom: 1rem; margin-left: 0; } .button_link .btn.btn-inline-block { display: inline-block; } .button_link .btn:last-child { margin-bottom: 0; } /* Layout issues in responsive design for SPS - https://jira.six-group.net/browse/SIX-7518 */ .home-header .button_link .btn { display: inline-block; } .align-center .button_link .btn { margin-left: auto; margin-right: auto; } .align-right .button_link .btn { margin-left: auto; margin-right: 0; } } /* can not be within a grid */ .top-level-teaser { margin-bottom: 30px } .top-level-teaser:last-child { margin-bottom: 0; } @media (min-width: 64em) { .top-level-teaser { margin-bottom: 50px } } /* grids within certain components should never have bottom margin */ .form .row { margin-bottom: 0; } /* SIX-4482: increase space between list and titles */ .section_title + .row, .section_title + .list2, .chapter_title + .row, .chapter_title + .list2 { margin-top: 1.5rem; } /* add spacing between list and grid and between grids */ .list2 + .row { margin-top: 2.5rem } @media (min-width: 64em) { .list2 + .row { margin-top: 1.5rem } } .row + .list2, .row + .row:not(.row--without-spacing) { margin-top: 2.5rem; } #inpage-nav { z-index: 980; } .inpage-nav-wrapper { background: rgb(237, 237, 237); /* background-image: linear-gradient(to bottom, #f7f7f7, #dfdfdf); */ border: solid rgb(220, 220, 220); border-width: 1px 0; width: 100%; } .inpage-nav-wrapper:before { content: ''; position: absolute; width: 100%; left: 0; height: 50%; top: 50%; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.05), inset 0 1px 0 0 rgba(255, 255, 255, 0.2);; z-index: -1; } .anchor-nav-inner { position: relative } .anchor-nav-inner:before { content: ''; position: absolute; width: calc(100% - 4px); left: 4px; height: 1rem; bottom: 0; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.05), inset 0 1px 0 0 rgba(255, 255, 255, 0.2);; z-index: -1; } /* TODO: check .js-sticky */ #inpage-nav.js-sticky { height: 62px; position: relative; top: auto; } .inpage-nav-inner { margin-left: -16px; margin-right: -16px; position: relative } .inpage-nav-inner ul { list-style-type: none; margin-bottom: 0; } .inpage-nav-inner li { margin-bottom: 0; } .inpage-nav-inner .inpage-nav > li:first-child.active:after { width: calc(100% - 8px); left: 0px; } .inpage-nav-inner .inpage-nav > li:first-child.inpage-thirdlevel a { font-weight: 700; color: rgb(57, 57, 57); } .inpage-nav-inner a { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; color: rgb(113, 113, 113); font-weight: normal } .inpage-nav-inner a:hover { color: rgb(57, 57, 57); } .inpage-nav-inner:before, .inpage-nav-inner:after { content: ''; position: absolute; top: 0; width: 16px; height: 45px; z-index: 1; } .inpage-nav-inner:before { left: 0; background-image: -webkit-linear-gradient(left, rgba(237, 237, 237, 1), rgba(237, 237, 237, 0)); background-image: linear-gradient(to right, rgba(237, 237, 237, 1), rgba(237, 237, 237, 0)); } .inpage-nav-inner:after { right: 0; background-image: -webkit-linear-gradient(right, rgba(237, 237, 237, 1), rgba(237, 237, 237, 0)); background-image: linear-gradient(to left, rgba(237, 237, 237, 1), rgba(237, 237, 237, 0)); } .inpage-nav-scroller { overflow: auto; -webkit-overflow-scrolling: touch } .inpage-nav-scroller li { display: inline-block; } .inpage-nav { margin-left: 16px; margin-right: 16px; display: -webkit-box; display: flex } .inpage-nav li { padding: 17px 0; } .inpage-nav a { white-space: nowrap; padding: 4px 8px; } .inpage-nav > li + li a { position: relative } .inpage-nav > li + li a:before { content: ''; position: absolute; left: 0; top: 50%; height: 1.5rem; /* 24/16 */ margin-top: -0.75rem; width: 1px; background: #cacaca; } .inpage-nav li:first-child a { padding-left: 0; } .inpage-nav li:last-child a { padding-right: 16px; } .inpage-nav li.active, .inpage-nav-overflow-content li.active { position: relative } .inpage-nav li.active:after, .inpage-nav-overflow-content li.active:after { content: ''; position: absolute; height: 1px; width: calc(100% - 16px); bottom: 13px; left: 8px; background: rgb(222, 57, 25); } .inpage-nav-overflow { position: absolute; right: 1.1rem; top: 50%; margin-top: -16px; display: none; } .inpage-nav-overflow-trigger { width: 32px; height: 32px; padding: 0; position: relative; background: transparent; border: 1px solid currentColor; -webkit-transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); color: rgb(113, 113, 113); display: none } .inpage-nav-overflow-trigger:focus, .inpage-nav-overflow-trigger:hover { color: rgb(57, 57, 57); background: transparent; } .inpage-nav-overflow-trigger.contains-active .inpage-nav-overflow-count { color: rgb(222, 57, 25); font-weight: 700; } .inpage-nav-overflow-count { position: absolute; top: -9px; left: 22px; padding: 2px 6px; font-size: 0.625rem; background: rgb(237, 237, 237); } @media (min-width: 64em) { #inpage-nav { position: -webkit-sticky; position: sticky; top: 114px; } .inpage-nav { margin-left: 1rem; margin-right: 70px; overflow: hidden } .inpage-nav li { -webkit-transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s 0s, -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s 0s, -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), transform .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s 0s; transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), transform .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s 0s, -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); opacity: 1; visibility: visible; -webkit-transform: none; transform: none; -webkit-transform-origin: 100% 50%; transform-origin: 100% 50%; } .inpage-nav .nav-item-overflow { -webkit-transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s .5s, -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s .5s, -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), transform .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s .5s; transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), transform .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s .5s, -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); opacity: 0; -webkit-transform: scale(.8) translateX(30px); transform: scale(.8) translateX(30px); visibility: hidden; } .inpage-nav-inner:before, .inpage-nav-inner:after { display: none; } .inpage-nav-overflow { display: block; } .inpage-nav-overflow-content { position: absolute; background: white; padding: 20px 30px; width: auto; min-width: 100px; right: 0; top: 40px; z-index: 1; box-shadow: -5px 0px 10px 0 rgba(0, 0, 0, 0.08), 10px 10px 20px 0 rgba(0, 0, 0, 0.05); border: 1px solid rgb(220, 220, 220); opacity: 0; visibility: hidden; -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: scale(.8) translateY(-50px); transform: scale(.8) translateY(-50px); -webkit-transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s .5s, -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s .5s, -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), transform .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s .5s; transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), transform .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s .5s, -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1) } .inpage-nav-overflow-content.open { visibility: visible; opacity: 1; -webkit-transform: none; transform: none; -webkit-transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s 0s, -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s 0s, -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), transform .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s 0s; transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), transform .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s 0s, -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); } .inpage-nav-overflow-content a { white-space: nowrap; } .inpage-nav-overflow-content li.active:after { height: 21px; width: 3px; bottom: auto; left: -15px; top: 3px; } } @media print { #inpage-nav { display: none; } } .breadcrumbs { list-style: none; font-size: 0.75rem; text-transform: uppercase; font-weight: bold; margin-left: 0; margin-bottom: 0.5rem; color: rgb(184, 184, 184) } .breadcrumbs a { color: inherit; display: inline-block; padding: 0.25rem 0 0 0 } .breadcrumbs a:hover { color: #b22e14; } .breadcrumbs li { display: inline-block; margin-bottom: 0 } .breadcrumbs li + li:before { content: '/ '; } .breadcrumbs.breadcrumbs-large { font-size: 0.875rem; } .breadcrumbs.breadcrumbs-white li{ color: rgb(255, 255, 255) } .breadcrumbs.breadcrumbs-white li a:hover { color: rgb(220, 220, 220); } nav > .breadcrumbs { color: rgb(222, 57, 25); } @media (min-width: 30em) { .breadcrumbs { font-size: 0.625rem } .breadcrumbs.breadcrumbs-large { font-size: 0.75rem; } } .breadcrumbs--shortened, .breadcrumbs--shortened-collapsed { text-overflow: ellipsis; width: 100%; overflow: hidden; white-space: nowrap; } .breadcrumbs--shortened a, .breadcrumbs--shortened-collapsed a, .breadcrumbs--shortened-revealed a { display: inline; } .breadcrumbs--shortened-collapsed li { display: none; } .breadcrumbs--shortened-collapsed li:first-child, .breadcrumbs--shortened-collapsed li:last-child, .breadcrumbs--shortened-revealed li { display: inline; } .breadcrumbs--shortened-collapsed.breadcrumbs li+li:before { content: ''; } .category { font-family: "Noto Sans", Helvetica, Arial, sans-serif; color: rgb(184, 184, 184); font-weight: 700; font-size: 0.750rem; margin-top: 0; margin-bottom: .5rem; text-transform: uppercase; line-height: 1.25 } .category span + span:before { content: ' | '; } .filter-advanced-inline { background: white; box-shadow: -5px 0px 10px 0 rgba(0, 0, 0, 0.08), 10px 10px 20px 0 rgba(0, 0, 0, 0.05); padding: 20px } .filter-advanced-inline .row + .row { margin-top: 20px; } .filter-advanced-inline .field { margin-bottom: 0 } .filter-advanced-inline .filter-advanced-fields { padding: 0; } .filter-advanced-inline .filter-advanced-buttons { padding-left: 0; padding-right: 0; } .filter-advanced-inline hr { margin-bottom: 2rem; } .column.currency-converter-loader { -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; margin-top: 20px } .column.currency-converter-loader .field { -webkit-box-flex: 1; flex: 1; padding-top: 0; } .column.currency-converter-loader .spinner { padding-left: .8rem; } .currency-converter-result { margin-top: 40px; } .currency-converter-result-target { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-size: 2rem; /* 32/16 */ font-weight: 700; line-height: 1.04; color: rgb(57, 57, 57); border-bottom: 4px solid rgb(222, 57, 25); padding-bottom: 4px; word-break: break-all } .currency-converter-result-target span { word-break: no-break; font-size: 1rem; } .currency-converter-result-base { font-weight: 700; } .currency-converter-result-meta { padding-top: 6px; margin-top: 0 !important; display: -webkit-box; display: flex; -webkit-box-pack: justify; justify-content: space-between; font-size: 0.875em; /* 14/16 */ } .currency-converter-result-date { padding-left: 1rem; } .currency-converter-result-chart { height: 140px; margin-left: -10px; margin-right: -10px; } @media (min-width: 48em) { .currency-converter-result { padding-left: 40px; margin-top: 0; } } .yield-curves-controls .field { margin-top: 1rem; } .yield-curves-controls .column_3 > .field:first-child, .yield-curves-controls .column_6 > .field:first-child { margin-top: 0; padding-bottom: 0.5rem; } .yield-curves-controls .btn-secondary, .yield-curves-controls .expander-body { margin: 0; } .yield-curves-controls .expander-body:focus { outline: none; } .yield-curves-controls .country-base-checkboxes, .yield-curves-controls .country-base-radios { position: absolute; visibility: hidden; height: 0; opacity: 0; -webkit-transition: opacity 0s; transition: opacity 0s } .yield-curves-controls .country-base-checkboxes.visible, .yield-curves-controls .country-base-radios.visible { position: relative; visibility: visible; height: auto; opacity: 1; -webkit-transition: opacity .6s; transition: opacity .6s; } .yield-curves-controls hr { margin-top: 2rem; } .yield-curves-controls .choices__button { visibility: hidden; } .yield-curves-chart { height: 300px; max-height: 400px; } @media (max-width: 47.999em) { .yield-curves-controls .column_6 + .column_6 { margin-top: 1rem; } } .textimage { display: block; position: static } .textimage p:last-child, .textimage ul:last-child, .textimage ul:last-child li:last-child { margin-bottom: 0; } .textimage .fig.image-block, .textimage .fig.image-small, .textimage .fig.image-medium, .textimage .fig.image-large { float: none; width: 100%; } .textimage .fig a { display: block; position: relative } .textimage .fig a span { position: absolute; width: 48px; height: 48px; text-align: center; line-height: 48px; color: #fff; font-size: 0.875rem; /* 14/16 */ bottom: 0; right: 0; background: rgba(56, 56, 56, 0.6); } /* SIX-4237: respect .align-center of container component (Grid, Section) */ .align-center .textimage p { max-width: 620px; margin-left: auto; margin-right: auto; } .align-center .textimage .figure { display: block; } .align-center .textimage img { margin: 0 auto; } .align-center .textimage .fig.image-small, .align-center .textimage .fig.image-medium, .align-center .textimage .fig.image-large, .align-center .textimage .fig.image-block { margin: 0 auto 10px auto; padding-left: 0; padding-right: 0; } .align-center .textimage .fig + .cell { margin: 0 auto; width: auto; } .textimage .featured { background-color: rgb(248, 248, 248); /* SIX-6135: removes border: 1px solid var(--color-rock-20); */ margin-left: 0; margin-right: 0; padding: 40px 20px; } /* SIX-4752: changes link color in bg red special case */ .bg-red .textimage .featured a { color: #4997b7; } /* SIX: if inside a featured grid */ .featured .textimage .featured { background-color: rgb(255, 255, 255); } .row .textimage { width: 100%; /* ie fix */ } /* TODO: there is currently no setting below. only way is to use image block at the moment */ [data-six-textimage="below"] .fig { margin-bottom: 10px; } /* SIX-4237: changes text inside centered containers to use full width */ .align-center .textimage .cell { width: auto !important; } @media (max-width: 80.124em) { [data-six-textimage="left"] .fig, [data-six-textimage="right"] .fig { margin-bottom: 10px; } } @media (min-width: 30em) { [data-six-textimage="left"] .figure, [data-six-textimage="right"] .figure { display: -webkit-box; display: flex; flex-wrap: wrap; } .textimage .fig, .textimage .cell { -webkit-box-flex: 0; flex: 0 0 auto; width: 100%; } .textimage .fig.image-small, .textimage .fig.image-medium, .textimage .fig.image-large { margin-top: 0; margin-right: 0; } .textimage .fig.image-small { width: 33.333%; min-width: 33.333% } .textimage .fig.image-small + .cell { width: 66.666%; } .textimage .fig.image-medium { width: 50%; min-width: 50% } .textimage .fig.image-medium + .cell { width: 50%; } .textimage .fig.image-large { width: 66.666%; min-width: 66.666% } .textimage .fig.image-large + .cell { width: 33.333%; } .textimage .fig.image-block { width: 100%; } .textimage .fig { padding-right: 8px; } .textimage .cell { padding-left: 8px; } .textimage[data-six-textimage="right"] .fig { padding-left: 0; padding-right: 8px } .textimage[data-six-textimage="right"] .fig.image-block { padding-right: 0; } .textimage[data-six-textimage="right"] .cell { padding-left: 8px; padding-right: 0; } .textimage[data-six-textimage="left"] .fig { padding-left: 8px; padding-right: 0 } .textimage[data-six-textimage="left"] .fig.image-block { padding-left: 0; } .textimage[data-six-textimage="left"] .cell { padding-left: 0; padding-right: 8px; } .textimage { /* TODO: Check if this is really needed on small? */ } .textimage[data-six-textimage="left"] .fig { -webkit-box-ordinal-group: 3; order: 2; } .textimage[data-six-textimage="below"] { /* // this line is somewhat correct but on IE11 will add a lot of padding-bottom // https://jira.six-group.net/browse/SIX-3579 & .figure { flex-direction: column; } */ /* TODO: Check if textimage below is still a valid use case & .fig { order: 2; } */ } .textimage[data-six-textimage="below"] .fig { padding-left: 0; padding-right: 0; } .textimage[data-six-textimage="below"] .cell { padding-left: 0; padding-right: 0; } .textimage[data-six-textimage="below"] .figure .fig + .cell { width: 100%; } .textimage .image-block { padding-right: 0; padding-left: 0 } .textimage .image-block + .cell { padding-left: 0; padding-right: 0; } /* SIX-4520: supports special case People Box / Personen Kasten */ .textimage .featured .fig.image-small { padding-left: 10px } .textimage .featured .fig.image-small + .cell { padding-left: 30px; padding-right: 10px; } .textimage[data-six-textimage="left"] .featured .fig.image-small { padding-left: 0; padding-right: 10px } .textimage[data-six-textimage="left"] .featured .fig.image-small + .cell { padding-left: 10px; padding-right: 30px; } } @media (min-width: 80.125em) { /*.textimage { & .fig.image-large { width: 66.666%; min-width: 66.666%; & + .cell { width: 33.333%; } } }*/ .row .row .textimage .fig, .row .row .textimage .cell { width: auto; } } @media print { /* SIX-5000: do not print enlarge icon */ .textimage .fig a span { display: none; } } .textimg-button-wrapper { -webkit-box-flex: 1; flex-grow: 1; -webkit-box-ordinal-group: 4; order: 3; margin-top: 1rem; } .figure.featured .cell+.textimg-button-wrapper { padding-left: 10px; } @charset "utf-8"; blockquote { margin: 0.3em 0; } .section[class*=" bg-"] .blockquote { background-color: rgb(255, 255, 255); } .blockquote { background-color: rgb(248, 248, 248) } .blockquote .cell { position: relative; padding: 3.5em 1em; } .blockquote.none .cell { padding-top: 1em; padding-bottom: 1em; } .blockquote img { display: block; } .blockquote figcaption p { margin-bottom: 0; } .blockquote blockquote p { color: rgb(57, 57, 57); display: block; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-weight: bold; font-size: 1.5rem; line-height: 1.2; margin-bottom: 0; } .blockquote.quotation blockquote p:before, .blockquote.quotation blockquote p:after { color: rgb(222, 57, 25); content: ''; display: block; position: absolute; font-family: Georgia, "Times New Roman", Times, serif; font-size: 4rem; line-height: 1; height: 27px; width: 33px; } .blockquote.quotation blockquote p:before { content: "“"; text-align: right; top: 1rem; left: 0.75rem; } .blockquote.quotation blockquote p:after { content: "”"; text-align: left; top: auto; bottom: 1rem; left: auto; right: 0.75rem; } .blockquote cite { display: inline-block; width: 100%; color: rgb(113, 113, 113); font-weight: bold; font-style: normal; font-size: 0.875rem; } .blockquote cite small { font-weight: normal; padding-left: 0.75rem; font-size: 0.75rem; } /* SIX-4972: use different symbols for quotation in german */ [lang=de] .blockquote.quotation blockquote p:before, [lang=de] .blockquote.quotation blockquote p:after { font-size: 3.5rem; font-family: "Times New Roman", Times, serif; line-height: 0.5; -webkit-transform: none; transform: none; } [lang=de] .blockquote.quotation blockquote p:before { content: "«"; text-align: right; top: .5rem; width: .5em; } [lang=de] .blockquote.quotation blockquote p:after { content: "»"; text-align: left; width: .5em; } @media (min-width: 30em) { .quotation .cell { padding: 3em 3.3em; } } @media (min-width: 48em) { .blockquote figure { display: -webkit-box; display: flex; } .blockquote .fig { max-width: 319px; width: 20%; margin: 1rem; -webkit-box-flex: 0; flex: 0 0 20%; } .blockquote .cell { -webkit-box-flex: 1; flex: 1 auto; display: block; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-box-align: start; align-items: flex-start; -webkit-box-pack: center; justify-content: center; } .blockquote blockquote p { font-size: 2rem; line-height: 1.15; } } @media print { .blockquote figure { display: -webkit-box; display: flex; } } @media (min-width: 64em) { .blockquote.quotation .cell { padding: 3.6em 7em; } .blockquote.quotation blockquote p:before, .blockquote.quotation blockquote p:after { font-size: 6rem; height: 34px; width: 1.05em; } .blockquote.quotation blockquote p:before { top: .75rem; left: 0; } .blockquote.quotation blockquote p:after { top: auto; bottom: 1.75rem; left: auto; right: 0; } [lang=de] .blockquote.quotation blockquote p:before, [lang=de] .blockquote.quotation blockquote p:after { font-size: 5rem; } [lang=de] .blockquote.quotation blockquote p:before { width: 1.05em; } [lang=de] .blockquote.quotation blockquote p:after { width: 1.05em; } } @media print { .blockquote.quotation { border: 1px solid rgb(220, 220, 220); } } .list.list-teaser-contact-cta .title { font-size: 20px; line-height: 1.28; } .featured.cta { background-color: rgb(255, 255, 255); box-shadow: -5px 0px 10px 0 rgba(0, 0, 0, 0.08), 10px 10px 20px 0 rgba(0, 0, 0, 0.05); border-top: 4px solid rgb(222, 57, 25); color: rgb(113, 113, 113); padding-bottom: 1.25rem } .featured.cta .cell { -webkit-box-flex: 1; flex-grow: 1; padding: 1.25rem 1.25rem 0 1.25rem; } .featured.cta .paragraph_title { font-size: 1.2rem; margin-top: 0; margin-bottom: .7em; line-height: 1.2; color: rgb(57, 57, 57); } .featured.cta .fig { width: 100%; } .featured.cta p { font-size: 0.875rem; /* 14/16 */ } .featured.cta .btn { color: rgb(255, 255, 255); margin-bottom: 0; } .featured.cta figure a { display: block; } .featured.cta { /* SIX: hide red border on red sections */ } .bg-red .featured.cta { border-top: none } @media (min-width: 48em) { .featured.cta, .featured.cta .clearfix { display: -webkit-box; display: flex; } .featured.cta .clearfix { -webkit-box-flex: 1; flex: 1 auto; } .featured.cta { padding: 1.5em 1.25em /* 28/16 */ /* 20/16 */ } .featured.cta .cell { padding-top: 0; padding-bottom: 0; } .featured.cta .fig { width: 30%; flex-shrink: 0; max-width: 319px; } } @media (min-width: 64em) { .featured.cta .paragraph_title { font-size: 2rem; line-height: 1.15; } } @media (max-width: 63.999em) { /* TODO do this globally ? */ .tab-item .column { flex-basis: 100%; max-width: 100%; } .row.featured .column + .column .label:first-child { padding-top: 20px; } .tab-item .column-tab-item:not(:first-child) { margin-top: 40px; } } .data-pair-list { display: -webkit-box; display: flex; flex-wrap: wrap; -webkit-box-align: end; align-items: flex-end; margin-left: -10px; margin-right: -10px } .data-pair-list div { padding: 0 10px 15px; width: 50% } .registration-criteria-list .data-pair-list div { width: 100% } .data-pair-list dd { margin-left: 0; } .data-pair-list > a { display: block; font-size: 0.875rem; /* 14/16 */ padding: 4px 0; } .data-pair-list .data-pair-key { font-weight: 700; font-size: 0.75rem; /* 12/16 */ } .data-pair-value { border-bottom: 1px solid rgb(220, 220, 220); color: rgb(57, 57, 57); font-weight: 700; font-size: 1rem; display: block; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif } .data-pair-value a { font-family: "Noto Sans", Helvetica, Arial, sans-serif; font-size: 0.875rem; } .data-pair-value .fa-ul { margin-left: 1.76em; margin-top: 0.5em; margin-bottom: 0 } .data-pair-value .fa-ul li { margin-bottom: 0.2em; } td .data-pair-key { font-size: 0.75rem; } td .data-pair-value { font-size: 0.875rem; border-bottom: 0; } .data-pair-compare { display: -webkit-box; display: flex } .data-pair-compare .data-pair-list { box-shadow: 2px 2px 5px 0 rgba(0, 0, 0, 0.05), 0 0 10px 0 rgba(0, 0, 0, 0.05); background: white; display: block; -webkit-box-align: initial; align-items: initial; margin: 0 } .data-pair-compare .data-pair-list dt { font-weight: 400; } .data-pair-compare .data-pair-list dt, .data-pair-compare .data-pair-list dd { padding-left: 10px; padding-right: 10px; } .data-pair-compare .data-pair-list div { width: auto; padding-left: 0; padding-right: 0; } .data-pair-compare .data-pair-list:first-child div { padding-right: 15px; } @media (min-width: 30em) { .registration-criteria-list .data-pair-list div { width: 50% } } @media (min-width: 48em) { .hero-header .data-pair-list { -webkit-box-pack: center; justify-content: center } .hero-header .data-pair-list .data-pair-value { color: rgb(255, 255, 255); } .hero-header .data-pair-list div { width: 33.333%; } } @media (min-width: 64em) { .data-pair-list div { width: 33.333%; } .data-pair-list.data-pair-list--column_3-3-3-3 div, .page-header .data-pair-list.data-pair-list--column_3-3-3-3 div, .hero-header .data-pair-list.data-pair-list--column_3-3-3-3 div { width: 25%; } .data-pair-list.data-pair-list--column_6-6 div, .page-header .data-pair-list.data-pair-list--column_6-6 div, .hero-header .data-pair-list.data-pair-list--column_6-6 div { width: 50%; } .data-pair-list.data-pair-list--column_12 div, .page-header .data-pair-list.data-pair-list--column_12 div, .hero-header .data-pair-list.data-pair-list--column_12 div { width: 100%; } .hero-header .data-pair-list { margin-top: 4rem; } } /* TODO: Move this to a more generic place */ .iframe { position: relative; padding-bottom: 56.25%; /* 16:9 */ height: 0; overflow: hidden; max-width: 100% } .iframe.ratio-4x3 { padding-bottom: 75%; /* 4:3 */ } .iframe.ratio-5x2 { padding-bottom: 40%; /* 5:2 */ } .iframe iframe, .iframe object, .iframe embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* TODO: probably move to _teaser-list-decorate.css */ .separator.list-teaser-horizontal .item:after { content: ""; position: absolute; height: 1px; background: rgb(220, 220, 220); bottom: 0; width: calc(100% - 1rem); left: .5rem; } .separator.list-teaser-normal .item, .separator.list-teaser-alternating .item { position: relative; padding-bottom: 40px } .separator.list-teaser-normal .item:after, .separator.list-teaser-alternating .item:after { content: ""; position: absolute; height: 1px; background: rgb(220, 220, 220); bottom: 0; width: 100%; } /** * Style definitions for the iconbox component already in use for SIX */ /* SIX-6334 Ensure that icon stays centered when placed inside .align-center */ .align-center .iconbox .icon { text-align: center; } .iconbox { display: block; margin-bottom: 1.25rem } .iconbox::after { content: ""; display: table; clear: both; } .iconbox .paragraph_title { font-size: 1.563rem; } .iconbox .icon { margin-bottom: 0.25rem; color: rgb(222, 57, 25) } .bg-red .iconbox .icon { color: rgb(255, 255, 255) } .bg-red .accordion .iconbox .icon, .bg-red .featured .iconbox .icon { color: rgb(222, 57, 25) } .iconbox .icon.small, .iconbox .icon.medium, .iconbox .icon.large { line-height: 100%; } .iconbox .icon.small { font-size: 1.25rem } .iconbox .icon.small ~ .paragraph_title { font-size: 0.875rem; } .iconbox .icon.medium { font-size: 2.25rem } .iconbox .icon.medium ~ .paragraph_title { font-size: 1.2rem; } .iconbox .icon.medium ~ .iconbox-text { overflow: hidden; } .iconbox .icon.large { font-size: 4rem } .iconbox .icon.large ~ .paragraph_title { font-size: 1.563rem; } .iconbox .icon.large ~ .iconbox-text { overflow: hidden; } .iconbox .icon.pull-left, .iconbox .icon.pull-right { color: rgb(57, 57, 57) } .color-inverted .iconbox .icon.pull-left, .color-inverted .iconbox .icon.pull-right { color: rgb(255, 255, 255) } .color-inverted .accordion .iconbox .icon.pull-left, .color-inverted .featured .iconbox .icon.pull-left, .color-inverted .accordion .iconbox .icon.pull-right, .color-inverted .featured .iconbox .icon.pull-right { color: rgb(57, 57, 57) } .iconbox .icon.pull-left { margin: 0 0.5rem 0 0; } .iconbox .icon.pull-right { margin: 0 0 0 0.5rem; } .iconbox .paragraph_title { font-size: 1.5rem; margin-top: 0; } .iconbox p, .iconbox li { color: rgb(113, 113, 113); font-size: 1rem; font-weight: 400; } .iconbox ol, .iconbox ul { display: inline-block; margin-left: 24px; text-align: left; } .color-inverted .iconbox p { color: rgb(255, 255, 255) } .color-inverted .accordion .iconbox p, .color-inverted .featured .iconbox p { color: rgb(113, 113, 113) } .iconbox a { font-size: 0.875rem; display: block; } .iconbox { /* if iconbox is configured with positin left but in a section or grid that has align-center center should win */ } .align-center .iconbox .pull-left, .align-center .iconbox .pull-right { float: none; margin: 0 0 .25rem 0; } .iconbox { /* no support for icon in a circle background */ } .iconbox .bg { color: inherit; position: relative; } .fact { margin: 20px 0; color: rgb(57, 57, 57); text-align: left; } .section.color-inverted .fact { color: rgb(255, 255, 255); } .section.color-inverted .accordion .fact, .section.color-inverted .featured .fact { color: rgb(57, 57, 57); } .fact.fact-prominent { background-color: rgba(200, 200, 200, .2); -webkit-box-flex: 1; flex-grow: 1; padding: 1.5rem 0; } /* TODO: check if this should go into _margin.css */ .row > div:first-child .fact { margin-top: 0; } .row > div:last-child .fact { margin-bottom: 0; } @media (min-width: 30em) { .fact, .row > div:first-child .fact, .row > div:last-child .fact { margin: 10px 0; } } .fact-value { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-weight: 700; line-height: 1.1; position: relative } .fact-value strong { display: block; } .fact-value:before { content: ''; background: rgb(222, 57, 25); position: absolute; width: 4px; height: calc(100% - 0.3em); top: 0.12em; left: 0; } .bg-red .fact-value:before { background: rgb(255, 255, 255); } .fact-description { font-size: 0.875rem; /* 14/16 */ line-height: 1.57; } .fact-big-normal .fact-value, .fact-big-normal .fact-description, .fact-big-inverted .fact-value, .fact-big-inverted .fact-description { padding: 0 15px; } .fact-big-normal .fact-value, .fact-big-inverted .fact-value { font-size: 2rem; /* 32/16 */ padding-right: 0; } .fact-small-normal .fact-value, .fact-small-normal .fact-description, .fact-small-inverted .fact-value, .fact-small-inverted .fact-description { padding: 0 10px; } .fact-small-normal .fact-value, .fact-small-inverted .fact-value { font-size: 1.125rem; /* 18/16 */ padding-right: 0; } .fact-big-inverted, .fact-small-inverted { display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column } .fact-big-inverted .fact-value, .fact-small-inverted .fact-value { margin-top: 5px; -webkit-box-ordinal-group: 3; order: 2; } @media (min-width: 64em) { .hero-header .fact { color: rgb(255, 255, 255); } .hero-header .fact-value:before { background-color: rgb(255, 255, 255); } } @media (min-width: 80.125em) { .fact, .row > div:first-child .fact, .row > div:last-child .fact { margin: 0 0 5px /* SIX-5985: align center if in hero header */ } .hero-header .fact, .hero-header .row > div:first-child .fact, .hero-header .row > div:last-child .fact { align-self: center } .fact-big-normal .fact-value, .fact-big-inverted .fact-value { font-size: 3.75rem; /* 60/16 */ } .fact-small-normal .fact-value, .fact-small-inverted .fact-value { font-size: 1.5rem; /* 24/16 */ } } .expander-trigger { /* Default transition */ -webkit-transition: height .4s cubic-bezier(0.23, 1, 0.32, 1); transition: height .4s cubic-bezier(0.23, 1, 0.32, 1) } .expander-body { position: relative } .expander-body.is-closing { overflow: hidden; } .expander-body[aria-hidden="true"] { height: 0; overflow: hidden; } .expander-body-inner { -webkit-transform: translateY(-40px); transform: translateY(-40px); opacity: 0; -webkit-transition: opacity .2s .1s, -webkit-transform .3s cubic-bezier(0.21, 0.82, 0.29, 0.96); transition: opacity .2s .1s, -webkit-transform .3s cubic-bezier(0.21, 0.82, 0.29, 0.96); transition: transform .3s cubic-bezier(0.21, 0.82, 0.29, 0.96), opacity .2s .1s; transition: transform .3s cubic-bezier(0.21, 0.82, 0.29, 0.96), opacity .2s .1s, -webkit-transform .3s cubic-bezier(0.21, 0.82, 0.29, 0.96); } .expander-body.is-opening .expander-body-inner, .expander-body[aria-hidden="false"] .expander-body-inner { opacity: 1; -webkit-transform: none; transform: none; } .expander-inplace .expander-body.is-closing .expander-body-inner { opacity: 0; } .expander-inplace h4 { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; } @media (max-width: 63.999em) { .expander-body { -webkit-transition-duration: 0.1s !important; transition-duration: 0.1s !important; } } @media print { .expander-body[aria-hidden="true"] { height: auto !important; overflow: visible !important; } .accordion .expander-body-inner { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } .accordion .expander-trigger:before, .accordion .expander-trigger:after { content: none; background: transparent; } } .tooltip-wrapper { position: relative; display: inline-block; cursor: pointer; color: #4997b7 } .tooltip-wrapper:hover .tooltip { visibility: visible; opacity: 1; -webkit-transition: .25s opacity, visibility 0s 0s; transition: .25s opacity, visibility 0s 0s; } .tooltip { position: absolute; z-index: 10; width: 200px; visibility: hidden; opacity: 0; -webkit-transition: .25s opacity, visibility 0s .25s; transition: .25s opacity, visibility 0s .25s; } .tooltip-content { display: block; background: white; cursor: default; padding: 10px; font-weight: 400; color: rgb(113, 113, 113); box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.18), 0 0 1px 0 rgba(0, 0, 0, 0.1); } .tooltip-arrow { width: 12px; height: 12px; position: absolute; overflow: hidden } .tooltip-arrow:after { content: ""; position: absolute; width: 8px; height: 8px; background: white; -webkit-transform: rotate(45deg); transform: rotate(45deg); top: 8px; left: 2px; box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.18), 0 0 1px 0 rgba(0, 0, 0, 0.1); } .tooltip-content hr { margin: 0.6rem 0; } .tooltip-items { list-style: none } .tooltip-items li + li, .tooltip-items li { margin: 0; padding-left: 0; } .tooltip-items li + li:before { display: none; } .tooltip-items li a { height: auto; display: block; line-height: inherit; padding-left: 0.3rem 0; } .nav-meta .tooltip-items li + li { margin: 0; padding-left: 0; } .login-trigger .tooltip-content { font-size: 1rem; text-align: left } .login-trigger .tooltip-content > span { font-size: 14px; padding: 0 0.2rem; display: block; } .login-trigger .tooltip-content li a { text-align: left; height: auto; line-height: inherit; } .login-trigger:hover .tooltip { visibility: hidden; opacity: 0; -webkit-transition: .25s opacity, visibility 0s .25s; transition: .25s opacity, visibility 0s .25s; } body.logged-in-open .login-trigger .tooltip { visibility: visible; opacity: 1; -webkit-transition: .25s opacity, visibility 0s 0s; transition: .25s opacity, visibility 0s 0s; } .tooltip-bottom { padding-top: 4px; top: 100%; left: 50%; margin-left: -100px } .tooltip-bottom .tooltip-arrow { top: -8px; left: 50%; margin-left: -6px; } .tooltip-bottom-left { left: 100%; margin-left: -160px } .tooltip-bottom-left .tooltip-arrow { left: auto; right: 41px; } .tooltip-bottom-right { left: 0; margin-left: -8px } .tooltip-bottom-right .tooltip-arrow { right: auto; left: 26px; } @media (max-width: 63.999em) { .tooltip-bottom-small-left { /* use .tooltip-bottom-left on small screen */ left: 100%; margin-left: -160px } .tooltip-bottom-small-left .tooltip-arrow { left: auto; right: 34px; } .tooltip-bottom-right { left: 0; margin-left: -8px } .tooltip-bottom-right .tooltip-arrow { right: auto; left: 26px; } } /** * CSS definitions for the AEM component: Link List Box (Styleguide: "Link List > Box") */ /* TODO: this is the link list on homepage !*/ .linklist { box-shadow: -5px 0px 10px 0 rgba(0, 0, 0, 0.08), 10px 10px 20px 0 rgba(0, 0, 0, 0.05); background: rgb(255, 255, 255); padding-bottom: 1rem; -webkit-box-flex: 1; flex: 1 auto; width: 100%; -webkit-transition: box-shadow 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: box-shadow 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) } .linklist:hover { box-shadow: 5px 10px 15px 0 rgba(0, 0, 0, 0.18); } .linklist { /* SIX fixes link list in author mode */ } .linklist.fa-ul { margin-left: 0; } .linklist .teaser-path, .linklist .title { color: rgb(248, 248, 248); } .linklist li { margin-bottom: 0; } .linklist a { padding: 1.75rem 2.6rem 1.75rem 1rem; display: block; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; color: rgb(57, 57, 57); font-size: 1rem; text-decoration: none; font-weight: bold; } .linklist a:after { background-image: url("build/images/arrow-left.svg?f052e5d42974018a"); background-repeat: repeat-x; background-position: 0 0; content: ""; display: block; height: 9px; left: auto; position: absolute; right: 1rem; -webkit-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: background-position 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: background-position 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); top: 54%; width: 12px; } .linklist:hover a { color: rgb(149, 149, 149); } .linklist:hover a:hover { color: rgb(57, 57, 57) } .linklist:hover a:hover:after { background-position: 12px; } .linklist-title:after, .linklist a:before { content: ""; position: absolute; height: 1px; bottom: 0; left: 0; left: 1rem; right: 1rem; background: rgb(220, 220, 220); } .linklist-title, .linklist-item-title { font-family: "Noto Sans", Helvetica, Arial, sans-serif; color: rgb(184, 184, 184); text-transform: uppercase; font-weight: bold; display: block; } .linklist-title { border-color: rgb(73, 151, 183); padding: 1rem 1rem 0.625em; font-size: 0.750rem; position: relative } .linklist-title:after { opacity: 0.6; background: rgb(73, 151, 183); } .linklist-item-title { font-size: 0.625rem; } /* SIX-4674: removes spacing after last item of the last list */ .fa-ul[data-six-layout="linklist"]:last-child li:last-child, .fa-ul[data-six-layout="horizontal"]:last-child li { margin-bottom: 0; } /* Linklist -- Seamless Variation ------------------------------------------------------------ */ .linklist-seamless { box-shadow: none; padding-bottom: 2.5em } .linklist-seamless:hover { box-shadow: none; } .linklist-seamless a { padding-top: 0.75em; padding-bottom: 0.75em; } @media (max-width: 63.999em) { .section .linklist-seamless li { padding-left: 0; padding-right: 0 } .section .linklist-seamless li::after { left: 0; right: 0; } .section .linklist-seamless li > a { padding-left: 0; padding-right: 0 } .section .linklist-seamless li > a::before { left: 0; right: 0; } .section .linklist-seamless li > a::after { right: 0; } .bg-red .linklist-seamless, .bg-rock .linklist-seamless, .bg-clay .linklist-seamless, .bg-petrol .linklist-seamless, .bg-marine .linklist-seamless, .bg-light-gray .linklist-seamless { padding-left: 2rem; padding-right: 2rem; } } @media (min-width: 64em) { .section .linklist-seamless .linklist-title { padding-top: 0; } .bg-red .linklist-seamless .linklist-title, .bg-rock .linklist-seamless .linklist-title, .bg-clay .linklist-seamless .linklist-title, .bg-petrol .linklist-seamless .linklist-title, .bg-marine .linklist-seamless .linklist-title, .bg-light-gray .linklist-seamless .linklist-title { padding-top: 1.875rem; } } /** * CSS definitions for the AEM component: Link List */ /* Link list with extensions */ .link-list.link-list--with-file-exts a:after { color: rgb(184, 184, 184); font-family: "Noto Sans", Helvetica, Arial, sans-serif; font-size: 0.75em; margin-left: 3px; } .link-list.link-list--with-file-exts a[href$=".zip"]:after { content: '[ZIP]'; } .link-list.link-list--with-file-exts a[href$=".rar"]:after { content: '[RAR]'; } .link-list.link-list--with-file-exts a[href$=".tar"]:after { content: '[TAR]'; } .link-list.link-list--with-file-exts a[href$=".7z"]:after { content: '[7Z]'; } .link-list.link-list--with-file-exts a[href$=".pdf"]:after { content: '[PDF]'; } .link-list.link-list--with-file-exts a[href$=".doc"]:after, .link-list.link-list--with-file-exts a[href$=".docx"]:after { content: '[DOC]'; } .link-list.link-list--with-file-exts a[href$=".xls"]:after, .link-list.link-list--with-file-exts a[href$=".xlsx"]:after { content: '[EXCEL]'; } .link-list.link-list--with-file-exts a[href$=".csv"]:after { content: '[CSV]'; } .link-list.link-list--with-file-exts a[href$=".ppt"]:after, .link-list.link-list--with-file-exts a[href$=".pptx"]:after { content: '[PPT]'; } .link-list.link-list--with-file-exts a[href$=".txt"]:after { content: '[TXT]'; } .link-list.link-list--with-file-exts a[href$=".jar"]:after { content: '[JAR]'; } .link-list.link-list--with-file-exts a[href$=".xml"]:after { content: '[XML]'; } .link-list.link-list--with-file-exts a[href$=".xsd"]:after { content: '[XSD]'; } .link-list.link-list--with-file-exts a[href$=".jpg"]:after, .link-list.link-list--with-file-exts a[href$=".jpeg"]:after { content: '[JPG]'; } .link-list.link-list--with-file-exts a[href$=".png"]:after { content: '[PNG]'; } .link-list.link-list--with-file-exts a[href$=".gif"]:after { content: '[GIF]'; } .link-list.link-list--with-file-exts a[href$=".tif"]:after, .link-list.link-list--with-file-exts a[href$=".tiff"]:after{ content: '[TIF]'; } .link-list.link-list--with-file-exts a[href$=".mp3"]:after { content: '[MP3]'; } .link-list.link-list--with-file-exts a[href$=".wma"]:after { content: '[WMA]'; } .link-list.link-list--with-file-exts a[href$=".wav"]:after { content: '[WAV]'; } .link-list.link-list--with-file-exts a[href$=".ogg"]:after { content: '[OGG]'; } .link-list.link-list--with-file-exts a[href$=".flac"]:after { content: '[FLAC]'; } .link-list.link-list--with-file-exts a[href$=".aif"]:after, .link-list.link-list--with-file-exts a[href$=".aifc"]:after, .link-list.link-list--with-file-exts a[href$=".aiff"]:after { content: '[AIF]'; } .link-list.link-list--with-file-exts a[href$=".3gp"]:after { content: '[3GP]'; } .link-list.link-list--with-file-exts a[href$=".webm"]:after { content: '[WEBM]'; } .link-list.link-list--with-file-exts a[href$=".mkv"]:after { content: '[MKV]'; } .link-list.link-list--with-file-exts a[href$=".vob"]:after { content: '[VOB]'; } .link-list.link-list--with-file-exts a[href$=".avi"]:after { content: '[AVI]'; } .link-list.link-list--with-file-exts a[href$=".wmv"]:after { content: '[WMV]'; } .link-list.link-list--with-file-exts a[href$=".mp4"]:after { content: '[MP4]'; } .link-list.link-list--with-file-exts a[href$=".mpg"]:after, .link-list.link-list--with-file-exts a[href$=".mpeg"]:after { content: '[MPG]'; } .link-list.link-list--with-file-exts a[href$=".mov"]:after { content: '[MOV]'; } .link-list.link-list--with-file-exts a[href$=".rss"]:after { content: '[RSS]'; } .link-list.link-list--with-file-exts a[href$=".msi"]:after { content: '[MSI]'; } .link-list.link-list--with-file-exts a[href$=".edi"]:after { content: '[EDI]'; } .link-list.link-list--with-file-exts a[href$=".exe"]:after { content: '[EXE]'; } .link-list.link-list--with-file-exts a[href$=".iso"]:after { content: '[ISO]'; } .link-list.link-list--with-file-exts a[href$=".cer"]:after { content: '[CER]'; } .link-list.link-list--with-file-exts a[href$=".crt"]:after { content: '[CRT]'; } .link-list.link-list--with-file-exts a[href$=".der"]:after { content: '[DER]'; } .link-list.link-list--with-file-exts a[href$=".key"]:after { content: '[KEY]'; } .link-list.link-list--with-file-exts a[href$=".pem"]:after { content: '[PEM]'; } /* Link list with icons options*/ .link-list.link-list--with-no-icon { margin-left: 0 } .link-list.link-list--with-no-icon a .fa-li:before { content: ''; } .link-list.link-list--with-no-icon[data-six-layout="horizontal"] a { padding-right: 0 } .link-list.link-list--with-no-icon[data-six-layout="horizontal"] a i { display: none; } .link-list.link-list--with-file-icons a .fa-li { font-family: FontAwesome; } .link-list.link-list--with-file-icons a .fa-li:before { content: '\f016'; } .link-list.link-list--with-file-icons a[href$=".zip"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".rar"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".tar"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".7z"] .fa-li:before { content: '\f1c6'; } .link-list.link-list--with-file-icons a[href$=".pdf"] .fa-li:before { content: '\f1c1'; } .link-list.link-list--with-file-icons a[href$=".doc"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".docx"] .fa-li:before { content: '\f1c2'; } .link-list.link-list--with-file-icons a[href$=".xls"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".xlsx"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".csv"] .fa-li:before { content: '\f1c3'; } .link-list.link-list--with-file-icons a[href$=".ppt"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".pptx"] .fa-li:before { content: '\f1c4'; } .link-list.link-list--with-file-icons a[href$=".txt"] .fa-li:before { content: '\f0f6'; } .link-list.link-list--with-file-icons a[href$=".jar"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".xml"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".xsd"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".edi"] .fa-li:before { content: '\f1c9'; } .link-list.link-list--with-file-icons a[href$=".jpg"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".jpeg"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".png"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".gif"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".tif"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".tiff"] .fa-li:before { content: '\f1c5'; } .link-list.link-list--with-file-icons a[href$=".mp3"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".wma"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".wav"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".ogg"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".flac"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".aif"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".aifc"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".aiff"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".3gp"] .fa-li:before { content: '\f1c7'; } .link-list.link-list--with-file-icons a[href$=".webm"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".mkv"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".vob"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".avi"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".wmv"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".mp4"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".mpg"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".mpeg"] .fa-li:before, .link-list.link-list--with-file-icons a[href$=".mov"] .fa-li:before { content: '\f1c8'; } .link-list.link-list--with-file-icons a[href$=".rss"] .fa-li:before { content: '\f09e'; } .link-list.link-list--with-file-icons .link-list__attachments { margin: 0.75rem 0 0 2.1rem } .link-list.link-list--with-file-icons .link-list__attachments a .fa-li:before { content: '\f105'; } .link-list.link-list--with-file-icons .link-list__attachment a { font-size: 0.75rem } .link-list.link-list--with-file-icons .link-list__attachment a i { top: 0.3rem; } .link-list.link-list--with-file-icons .link-list__attachment p { font-size: 0.875rem; } .link-list__link { position: relative } .link-list__link .fa-li:before { position: relative; top: -1px; } /* SIX-5810: centers the list (including icon) when LinkList is in centered Section */ .align-center .link-list[data-six-layout="linklist"], .align-right .link-list[data-six-layout="linklist"] { display: inline-block } .align-center .link-list[data-six-layout="linklist"] a, .align-right .link-list[data-six-layout="linklist"] a { position: relative; } /* SIX-4674: removes spacing after last item of the last list */ .fa-ul[data-six-layout="linklist"]:last-child li:last-child, .fa-ul[data-six-layout="horizontal"]:last-child li { margin-bottom: 0; } [data-six-layout="horizontal"] { display: -webkit-box; display: flex; flex-wrap: wrap; margin-left: 0 } [data-six-layout="horizontal"] li { position: static; } [data-six-layout="horizontal"] a { margin: 0 1rem 0 0; padding: 0 1rem 0 0; } [data-six-layout="horizontal"] .fa-li { top: auto; left: auto; position: static; text-align: left; width: 1.5em; } .align-center [data-six-layout="horizontal"] { -webkit-box-pack: center; justify-content: center } .align-center [data-six-layout="horizontal"] a { margin: 0; padding: 0 .5rem; } .align-right [data-six-layout="horizontal"] { -webkit-box-pack: end; justify-content: flex-end } .align-right [data-six-layout="horizontal"] a { margin: 0 0 0 1rem; padding: 0 0 0 1rem; } .taxonomy-list__item--type-link-list .teaser-path .breadcrumbs { margin-bottom: 0; } @media (min-width: 30em) { .linklist-title, .linklist a { padding-right: 2.750rem; padding-left: 2.750rem; } .linklist { padding-bottom: 3.125rem } .linklist a { padding-right: 4.15rem } .linklist a:after { right: 2.750rem; } .linklist-title { padding-top: 1.875rem; } .linklist-title:after, .linklist a:before { left: 2.750rem; right: 2.750rem; } } @media print { .linklist { display: none; } } /* TODO: deprecated */ .text-teaser { position: relative; /* TODO: Remove these two lines as it is only used for debug */ max-width: 48rem; margin: 0 auto; background-color: rgb(255, 255, 255) } .text-teaser .text-block { margin: 1.25rem; } .text-teaser a { display: inline-block; height: 100%; } .text-teaser .teaser-link { display: block; margin-bottom: 1.25rem; } /* TODO: deprecated remove should be list.css */ .list { color: rgb(113, 113, 113) } .list > ul { list-style: none; margin-left: 0; margin-bottom: 0; } .list > ul > li { margin-bottom: 0; } .list p { font-weight: normal; } .list .item > a { display: block; color: inherit } .list .item > a .teaser-link { font-weight: bold; color: #4997b7; text-decoration: none; -webkit-transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); /* Break long links, hyphens is needed for IE11 */ -ms-hyphens: auto; word-break: break-word } .list .item > a .teaser-link:focus { outline: thin dotted; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } .list .item > a:hover .teaser-link { color: #4a7485; text-decoration: none; } .list .img { position: relative; float: none; } .list .img .fa { position: absolute; font-size: 1.8rem; width: 4em; height: 2.2em; top: 50%; left: 50%; margin-left: -2em; margin-top: -1em; text-align: center; line-height: 2.2em; color: rgb(255, 255, 255); /* background: color(var(--color-six-red) a(60%)); */ background: rgba(222, 57, 25, 0.6); -webkit-transition: background 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: background 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); } .list a:hover .img .fa { background: rgb(222, 57, 25); } .list .item .cell, .list .item .img { width: auto; /* TODO do this in image.css */ max-width: 100%; /* TODO do this in image.css */ margin-right: 0; } .list .img img { display: block; } .list .fig.image-block { margin-bottom: 0; } .list-teaser-highlight .item { border: 1px solid rgb(220, 220, 220); border-width: 1px 0; padding: 1rem 0 1rem } .list-teaser-highlight .item p { font-size: 0.875rem; } .list-teaser-highlight .item + .item { border-top: 0; } .list-teaser-normal .item + .item, .list-teaser-alternating .item + .item { margin-top: 2.5rem; } .list-teaser-ticker { margin-bottom: 0 } .list-teaser-ticker a { position: relative; margin-left: 16px; margin-right: 16px } .list-teaser-ticker a .cell { padding: 30px 0 40px; } .list-teaser-ticker a { position: relative; margin-left: 0; margin-right: 0; padding-left: 16px; padding-right: 16px } .list-teaser-ticker a .cell { padding: 20px 0 20px; } @media (min-width: 30em) { .list-teaser-normal .item > a, .list-teaser-highlight .item > a, .list-teaser-alternating .item > a { display: -webkit-box; display: flex; -webkit-box-align: start; align-items: flex-start; margin-left: -8px; margin-right: -8px; } .list-teaser-normal .teaser-path, .list-teaser-normal .title, .list-teaser-highlight .teaser-path, .list-teaser-highlight .title, .list-teaser-alternating .teaser-path, .list-teaser-alternating .title { margin-top: 0; } .list-teaser-normal .cell, .list-teaser-normal .img, .list-teaser-highlight .cell, .list-teaser-highlight .img, .list-teaser-alternating .cell, .list-teaser-alternating .img { width: auto; padding-left: 8px; padding-right: 8px; } .list-teaser-normal .img, .list-teaser-highlight .img, .list-teaser-alternating .img { margin-right: 0; /* TODO do this in image.css */ } .list-teaser-normal .cell, .list-teaser-normal .img, .list-teaser-alternating .cell, .list-teaser-alternating .img { flex-basis: 50%; /* TODO do this in image.css */ max-width: 50%; /* TODO do this in image.css */ } .list-teaser-highlight .img { flex-basis: 33.333%; /* TODO do this in image.css */ max-width: 33.333%; /* TODO do this in image.css */ } .list-teaser-highlight .cell { flex-basis: 66.666%; /* TODO do this in image.css */ max-width: 66.666%; /* TODO do this in image.css */ } /* Special cases for quadratic image handling */ .list-teaser-highlight .item .img, .list-teaser-highlight.list .item .img { min-width: 240px; } .list-teaser-alternating .item:nth-child(odd) .img { -webkit-box-ordinal-group: 3; order: 2; } } @media (min-width: 64em) { .list-teaser-ticker a { margin-left: 0; margin-right: 0; padding-left: 40px; padding-right: 40px } .list-teaser-ticker a .cell:after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 4px; background: red; opacity: 0; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); transition: transform .5s cubic-bezier(0.19, 0.92, 0.27, 1), opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1); transition: transform .5s cubic-bezier(0.19, 0.92, 0.27, 1), opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); } .list-teaser-ticker a .cell:hover:after { opacity: 1; -webkit-transform: scaleX(1); transform: scaleX(1); } /* Special cases for quadratic image handling */ .list-teaser-highlight .item .img, .list-teaser-highlight.list .item .img { width: 300px; } } /* TODO: deprecated remove should be list.css */ .list-teaser-horizontal .title { margin-top: 1.3rem; } .list-teaser-horizontal ul { display: -webkit-box; display: flex; flex-wrap: wrap; margin-right: -8px; margin-left: -8px; padding: 0; } .list-teaser-horizontal .item { display: -webkit-box; display: flex; -webkit-box-flex: 1; flex: 1 auto; max-width: 100%; flex-basis: 100%; position: relative; padding-bottom: 40px; margin-bottom: 40px /*&:after { content: ""; position: absolute; width: calc(100% - 1rem); bottom: 0; left: .5rem; height: 1px; background: var(--color-rock-20); }*/ } .list-teaser-horizontal .item > a { padding: 0 8px; width: 100%; } .list-teaser-horizontal .item ul { display: block; margin: 0; padding: 0; } .row .list-teaser-horizontal { -webkit-box-flex: 1; flex-grow: 1; position: relative; margin-bottom: 40px /*&:after { content: ""; position: absolute; width: 100%; bottom: 0; left: 0; height: 1px; background: var(--color-rock-20); }*/ } .row .list-teaser-horizontal ul { display: block; } .row .list-teaser-horizontal ul .item { display: block; flex-basis: auto; max-width: 100%; margin-bottom: 0; position: static } .row .list-teaser-horizontal ul .item:after { display: none; } @media (min-width: 30em) { .list-teaser-horizontal .item { max-width: 50%; /* Let flexbox figure out width as Safari calculates margins differently */ flex-basis: 50%; } } @media (min-width: 64em) { .list-teaser-horizontal .item { /* Let flexbox figure out width as Safari calculates margins differently */ flex-basis: 33.33333333%; } } /* TODO: deprecated remove should be list-box.css */ .list-teaser-box-vertical .item + .item { margin-top: 1rem; margin-bottom: 0; } .list-teaser-box-vertical { margin-left: 0; margin-bottom: 0; list-style-type: none } .list-teaser-box-vertical .img { display: none; } .list-teaser-box-vertical .cell { padding: 1.25rem; padding-top: .8rem; } .list-teaser-box-vertical .teaser-path:first-child, .list-teaser-box-vertical .title:first-child { margin-top: .3rem; } .list-teaser-box-vertical .breadcrumbs { color: rgb(184, 184, 184); } .list-teaser-box-vertical .item > a { background: rgb(255, 255, 255); width: 100%; display: block; -webkit-box-flex: 1; flex: 1; -ms-flex: 1 1 auto; /* IE11 Reset because of Flexbox miscalculation */ min-height: 1px; } .list-teaser-box-vertical p { font-size: 0.875rem; } .list-teaser-image-left .img { display: block; } .list-teaser-box-vertical .item { box-shadow: -5px 0px 10px 0 rgba(0, 0, 0, 0.08), 10px 10px 20px 0 rgba(0, 0, 0, 0.05); -webkit-transition: box-shadow 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: box-shadow 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) } .list-teaser-box-vertical .item:hover { box-shadow: 5px 10px 15px 0 rgba(0, 0, 0, 0.18); } .list-teaser-box-vertical .item { -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; } .list-teaser-box-vertical.list-teaser-image-left .item { -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; } /* TODO: remove magic */ .column_3 .list-teaser-normal .item .img img, .column_4 .list-teaser-normal .item .img img, .column_3 .list-teaser-alternating .item .img img, .column_4 .list-teaser-alternating .item .img img, .column_3 .list-teaser-highlight .item .img img, .column_4 .list-teaser-highlight .item .img img, .column_3 .list-teaser-image-left .item .img img, .column_4 .list-teaser-image-left .item .img img { padding: 0; } .column_3 .list-teaser-normal .cell, .column_4 .list-teaser-normal .cell, .column_3 .list-teaser-alternating .cell, .column_4 .list-teaser-alternating .cell, .column_3 .list-teaser-highlight .cell, .column_4 .list-teaser-highlight .cell, .column_3 .list-teaser-image-left .cell, .column_4 .list-teaser-image-left .cell { max-width: none; flex-basis: auto; } .column_3 .list-teaser-normal .item .img, .column_4 .list-teaser-normal .item .img, .column_3 .list-teaser-alternating .item .img, .column_4 .list-teaser-alternating .item .img, .column_3 .list-teaser-highlight .item .img, .column_4 .list-teaser-highlight .item .img, .column_3 .list-teaser-image-left .item .img, .column_4 .list-teaser-image-left .item .img { min-width: 0; width: auto; } .column_3 .list-teaser-normal .item > a, .column_4 .list-teaser-normal .item > a, .column_3 .list-teaser-alternating .item > a, .column_4 .list-teaser-alternating .item > a, .column_3 .list-teaser-highlight .item > a, .column_4 .list-teaser-highlight .item > a, .column_3 .list-teaser-image-left .item > a, .column_4 .list-teaser-image-left .item > a { display: block; } @media (max-width: 63.999em) { /* TODO: check why only column_6, probably use .row */ .column_6 .list-teaser-image-left .item .img img { padding: 0; } .column_6 .list-teaser-image-left .item > a { display: block; } } @media (min-width: 30em) { .list-teaser-box-vertical, .list-teaser-box-vertical > ul, .list-teaser-box-vertical .item { display: -webkit-box; display: flex; -webkit-box-flex: 1; flex: 1 1 auto; -ms-flex: 1 1 auto; flex-shrink: 1; /* Setting min-height seems to fix miscalculation of IE11 */ /* min-height: 0; */ } .list-teaser-box-vertical > ul { -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; width: 100%; /* fixes ie layout problem */ } .list-teaser-box-vertical .item .item { width: auto; padding-left: 0; padding-right: 0 } .list-teaser-box-vertical .item .item:last-child { margin-bottom: 0; } .list-teaser-box-vertical .img { display: block } .list-teaser-box-vertical .img img { width: 100%; } } @media (min-width: 48em) { .list-teaser-image-left .item { position: relative /* display: flex; flex: 1; -ms-flex: 1 1 auto; height: 100%; max-height: 100%; */ } .list-teaser-image-left .item > a { display: -webkit-box; display: flex; -webkit-box-flex: 1; flex: 1; -ms-flex: 1 1 auto; } .list-teaser-image-left .item .img { margin-bottom: 0; -webkit-box-flex: 1; flex: 1; -ms-flex: 1 1 auto; flex-basis: 44.444% } .list-teaser-image-left .item .img img { padding: 16px; padding-right: 0; } .list-teaser-image-left .item .cell { -webkit-box-flex: 1; flex: 1; -ms-flex: 1 1 auto; flex-basis: 55.555%; } } /* TODO: deprecated remove should be list-box.css */ .list-teaser-box-horizontal ul { list-style-type: none; margin-left: 0; display: -webkit-box; display: flex; flex-wrap: wrap; margin-right: -8px; margin-left: -8px; padding: 0.5rem 0; } .list-teaser-box-horizontal .item { margin: 8px; /*padding: var(--half-gutter-width, 0.5rem);*/ display: -webkit-box; display: flex; -webkit-box-flex: 1; flex: 1; -ms-flex: 1 1 auto; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; max-width: calc(100% - 16px); flex-basis: calc(100% - 16px) /*max-width: 410px;*/ /* flex: 1 auto; */ /* Reset because of generic & ul on list-teaser-box-horizontal */ } .list-teaser-box-horizontal .item ul { display: block; margin: 0; padding: 0; } .list-teaser-box-horizontal .item p { font-size: 0.875rem; } .list-teaser-box-horizontal .item .chapter_title { margin-bottom: .8em; } .list-teaser-box-horizontal .item .title { margin-top: 1.3rem; } .list-teaser-box-horizontal .item .teaser-path { margin-top: 1rem; } .list-teaser-box-horizontal .item .teaser-path + .title { margin-top: 0; } .list-teaser-box-horizontal .item .label { color: rgb(184, 184, 184); } .list-teaser-box-horizontal .item .fa-ul { font-size: 0.875rem; /* 14/16 */ margin-left: 1.571em; /* 22/14 */ } .list-teaser-box-horizontal .item .img, .list-teaser-box-horizontal .item .cell { display: block; width: 100%; } .list-teaser-box-horizontal .item .img { min-height: 1px; /* fixes wrong ie height calculation */ } .list-teaser-box-horizontal .item .email a { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .list-teaser-box-horizontal .item .cell { display: -webkit-box; display: flex; -webkit-box-flex: 1; flex: 1; -ms-flex: 1 1 auto; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; padding: 20px; } .list-teaser-box-horizontal .item .img + .cell { padding-top: 0; } .list-teaser-box-horizontal .item { background: white; box-shadow: -5px 0px 10px 0 rgba(0, 0, 0, 0.08), 10px 10px 20px 0 rgba(0, 0, 0, 0.05); -webkit-transition: box-shadow 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: box-shadow 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) } .list-teaser-box-horizontal .item:hover { box-shadow: 5px 10px 15px 0 rgba(0, 0, 0, 0.18); } .list-teaser-box-horizontal .item > a { /*height: 100%;*/ display: -webkit-box; display: flex; -webkit-box-flex: 1; flex: 1; -ms-flex: 1 1 auto; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; /* IE11 Reset because of Flexbox miscalculation */ min-height: 1px; } @media (min-width: 30em) { .list-teaser-box-horizontal ul { padding: 1rem 0 } .row .list-teaser-box-horizontal ul { padding: 0 } .list-teaser-box-horizontal .item { max-width: calc(50% - 16px); /* Let flexbox figure out width as Safari calculates margins differently */ flex-basis: calc(50% - 16px); -webkit-box-flex: 1; flex-grow: 1 } .row .list-teaser-box-horizontal .item { max-width: calc(100% - 16px); flex-basis: calc(100% - 16px); margin-top: 1rem; margin-bottom: 0 } } @media (min-width: 64em) { .list-teaser-box-horizontal .item { max-width: calc(33.33333333% - 16px); /* Let flexbox figure out width as Safari calculates margins differently */ flex-basis: calc(33.33333333% - 16px); -webkit-box-flex: 1; flex-grow: 1 } .row .list-teaser-box-horizontal .item { max-width: calc(100% - 16px); flex-basis: calc(100% - 16px); margin-top: 1rem; margin-bottom: 0 } } /* TODO: check if this is deprecated */ .list-teaser-contact-cta { /* SIX-4485: CTA in centered container should always be left aligned */ text-align: left } .list-teaser-contact-cta .item { background: rgb(0, 44, 95); color: rgb(255, 255, 255); } .list-teaser-contact-cta p, .list-teaser-contact-cta .title { color: inherit; } .list-teaser-contact-cta .fa-ul { margin-top: .5em; margin-left: 1.6em; margin-bottom: 1.5em; } .list-teaser-contact-cta a { color: #4997b7; } .list-teaser-contact-cta .teaser-cta { color: rgb(255, 255, 255); } .list-teaser-contact-cta.list-teaser-contact-cta-light .item { background: rgb(255, 255, 255); border-top: 4px solid rgb(222, 57, 25); color: rgb(113, 113, 113); margin-bottom: 1.25rem; padding: 1.5em 1.25em; } .list-teaser-contact-cta.list-teaser-contact-cta-light .cell { padding: 0 1.25rem; } .list-teaser-contact-cta.list-teaser-contact-cta-light .title { color: rgb(57, 57, 57); font-size: 1.2rem; line-height: 1.2; margin-bottom: .7em; } @media (min-width: 64em) { .list-teaser-contact-cta.list-teaser-contact-cta-light .title { font-size: 2rem; line-height: 1.15; } } .list-teaser-contact-cta p, .list-teaser-contact-cta li, .list-teaser-contact-cta .title { max-width: 100%; } .list-teaser-contact-cta .item, .list-teaser-contact-cta .cell { -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-box-align: start; align-items: flex-start; -webkit-box-flex: 1; flex: 1 auto; } .list.list-teaser-contact-cta .item + .item { margin-top: 0; } .teaser-cta { /* vertical align 0 - right after teaser content auto - algin bottom of each teaser */ margin-top: auto; } .list-teaser-contact-cta .item .cell { display: -webkit-box; display: flex; } /* SIX: removes shadow of blue CTA box on a blue background */ .bg-marine .list-teaser-contact-cta .item, .bg-marine .list-teaser-contact-cta .item:hover { box-shadow: none; } @media (min-width: 48em) { .list-teaser-contact-cta .item .cell { display: -webkit-box; display: flex; } } .section.teaser-slider-wrapper { background: #fff; margin-top: 0; position: relative; z-index: 4; } .section.teaser-slider-wrapper h2 { margin-left: 40px; margin-top: 20px; } .section.teaser-slider-wrapper:not(.hide-shadow) { box-shadow: -5px 0px 10px 0 rgba(0, 0, 0, 0.08), 10px 10px 20px 0 rgba(0, 0, 0, 0.05); } .detail-page .section.teaser-slider-wrapper > section { padding-left: 0; padding-right: 0; } @media print { .teaser-slider-wrapper { box-shadow: none; } .teaser-slider-prev, .teaser-slider-next { display: none; } } .teaser-slider-items { list-style-type: none; margin-left: 0; margin-bottom: 0; } .teaser-slider-item { /* align-self: flex-start; */ margin-bottom: 0; } .teaser-slider-inner { position: relative; overflow: hidden; } .teaser-slider-item .list-teaser-news { align-self: flex-start; } .teaser-slider-item .list-teaser-news, .teaser-slider-item .list-teaser-news > ul, .teaser-slider-item .item, .teaser-slider-item .item > a, .teaser-slider-items { display: -webkit-box; display: flex; -webkit-box-flex: 1; flex: 1 auto; } .teaser-slider-item { position: relative; display: -webkit-box; display: flex; -webkit-box-flex: 0; flex: 0 0 100%; max-width: 100%; } .teaser-slider-item.tns-item { position: relative; display: -webkit-box; display: flex; max-width: unset; -webkit-box-flex: unset; flex: unset; } /* Teaser tickers definitions */ .teaser-slider-item .list-teaser-ticker { display: -webkit-box; display: flex; width: 100%; max-width: 100%; -webkit-box-flex: 1; flex: 1; -ms-flex: 1 1 auto } .teaser-slider-item .list-teaser-ticker > ul, .teaser-slider-item .list-teaser-ticker .item, .teaser-slider-item .list-teaser-ticker .item > a, .teaser-slider-item .list-teaser-ticker .list-teaser-ticker-graph { display: -webkit-box; display: flex; max-width: 100%; -webkit-box-flex: 1; flex: 1; -ms-flex: 1 1 auto; } .teaser-slider-item .list-teaser-ticker > ul { margin: 0; } .teaser-slider-item .list-teaser-ticker .item .cell { display: block; position: relative; width: 100%; max-width: 100%; -webkit-box-flex: 0; flex: none; } .teaser-slider-item .list-teaser-ticker .title { margin-bottom: 0; } .list-teaser-ticker-icon { display: inline-block } .cell-positive .list-teaser-ticker-icon { color: rgb(92, 184, 92); stroke: rgb(92, 184, 92) } .cell-positive .list-teaser-ticker-icon svg { -webkit-transform: rotate(180deg); transform: rotate(180deg); } .cell-negative .list-teaser-ticker-icon { color: rgb(233, 76, 71); stroke: rgb(233, 76, 71); -webkit-transform: none; transform: none } .list-teaser-ticker-state { display: block; position: absolute; left: auto; right: 0; padding-right: 10px; top: auto; font-weight: 400; font-size: 0.875rem; opacity: 0.9; color: rgb(113, 113, 113) } .list-teaser-ticker-state:before { content: "\eab8"; display: inline-block; font-family: "SIX-Pictogram"; line-height: 1; margin-right: 3px; vertical-align: middle; } .list-teaser-ticker-open .title, .list-teaser-ticker-open .list-teaser-ticker-values, .list-teaser-ticker-open .list-teaser-ticker-graph { opacity: 1; } .list-teaser-ticker-closed .title, .list-teaser-ticker-closed .list-teaser-ticker-values, .list-teaser-ticker-closed .list-teaser-ticker-graph { opacity: 0.54; } .list-teaser-ticker-price { font-weight: 400; font-size: 0.875rem; color: rgb(113, 113, 113); } .list-teaser-index-chart { width: 100%; height: 130px; } .teaser-slider-btn-bottom .teaser-slider-item .item .cell { padding-bottom: 2.25rem; } .teaser-slider .btn { background: transparent; } .teaser-slider-prev, .teaser-slider-next { position: absolute; bottom: 20px; display: block; cursor: pointer; width: 48px; height: 44px; margin-bottom: 0 } .teaser-slider-prev svg, .teaser-slider-next svg { display: block; width: 100%; height: 100%; -webkit-transition: fill 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: fill 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); fill: rgb(184, 184, 184); } .teaser-slider-btn-bottom .teaser-slider-prev, .teaser-slider-btn-bottom .teaser-slider-next { bottom: 0; margin-bottom: 0 } .teaser-slider-next { right: 4px; } .teaser-slider-prev { right: 52px; } /* SIX-5647: fix lory bug when btn has disabled class but still inline style visibitly related https://github.com/loryjs/lory/issues/611 */ .teaser-slider-next.disabled, .teaser-slider-prev.disabled { visibility: hidden !important; } .teaser-slider-next[disabled], .teaser-slider-prev[disabled] { visibility: hidden !important; } /* prevents external link icon */ .page-content .list-teaser-news a[target="_blank"]:after { content: ""; } @media (min-width: 30em) { .teaser-slider-no-chart .teaser-slider-item { -webkit-box-flex: 0; flex: 0 0 50%; max-width: 50% } .teaser-slider-no-chart .teaser-slider-item + .teaser-slider-item:before { content: ""; position: absolute; left: 0; top: 10%; height: 80%; width: 1px; background: rgb(220, 220, 220); opacity: 1; -webkit-transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); } .teaser-slider-no-chart .teaser-slider-item.active:before { opacity: 0; } } @media (min-width: 48em) { .teaser-slider-item { -webkit-box-flex: 0; flex: 0 0 50%; max-width: 23em } .teaser-slider-no-chart .teaser-slider-item { -webkit-box-flex: 0; flex: 0 0 246px; /* percentage causes problems because of non-integer width */ max-width: 246px } .teaser-slider-item + .teaser-slider-item:before { content: ""; position: absolute; left: 0; top: 30px; height: calc(100% - 60px); width: 1px; background: rgb(220, 220, 220); opacity: 1; -webkit-transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); } .teaser-slider-item.active:before { opacity: 0; } } @media (min-width: 64em) { .teaser-slider-item { -webkit-box-flex: 0; flex: 0 0 332px; /* percentage causes problems because of non-integer width */ max-width: 332px } .teaser-slider-no-chart .teaser-slider-item { -webkit-box-flex: 0; flex: 0 0 249px; /* percentage causes problems because of non-integer width */ max-width: 249px } } @media (min-width: 1350px) { .teaser-slider-btn-bottom .teaser-slider-item .cell { padding-bottom: 0; } .teaser-slider-prev, .teaser-slider-next { top: 50%; margin-top: -22px } .teaser-slider-prev:hover svg, .teaser-slider-next:hover svg { fill: rgb(149, 149, 149); } .teaser-slider-next { right: 5px; } .teaser-slider-prev { right: auto; left: 5px; } } @media (min-width: 80.125em) { .teaser-slider-item { -webkit-box-flex: 0; flex: 0 0 418px; /* percentage causes problems because of non-integer width */ max-width: 418px } .teaser-slider-no-chart .teaser-slider-item { -webkit-box-flex: 0; flex: 0 0 313px; /* percentage causes problems because of non-integer width */ max-width: 313px } } .tns-outer { padding: 0 !important; } .tns-outer [hidden] { display: none !important; } .tns-outer [aria-controls], .tns-outer [data-action] { cursor: pointer; } .tns-slider { -webkit-transition: all 0s; transition: all 0s; } .tns-slider > .tns-item { box-sizing: border-box; } .tns-horizontal.tns-subpixel { white-space: nowrap; } .tns-horizontal.tns-subpixel > .tns-item { display: inline-block; vertical-align: top; white-space: normal; } .tns-horizontal.tns-no-subpixel:after { content: ""; display: table; clear: both; } .tns-horizontal.tns-no-subpixel > .tns-item { float: left; } .tns-horizontal.tns-carousel.tns-no-subpixel > .tns-item { margin-right: -100%; } .tns-no-calc { position: relative; left: 0; } .tns-gallery { position: relative; left: 0; min-height: 1px; } .tns-gallery > .tns-item { position: absolute; left: -100%; -webkit-transition: transform 0s, opacity 0s; -webkit-transition: opacity 0s, -webkit-transform 0s; transition: opacity 0s, -webkit-transform 0s; transition: transform 0s, opacity 0s; transition: transform 0s, opacity 0s, -webkit-transform 0s; } .tns-gallery > .tns-slide-active { position: relative; left: auto !important; } .tns-gallery > .tns-moving { -webkit-transition: all 0.25s; transition: all 0.25s; } .tns-autowidth { display: inline-block; } .tns-lazy-img { -webkit-transition: opacity 0.6s; transition: opacity 0.6s; opacity: 0.6; } .tns-lazy-img.tns-complete { opacity: 1; } .tns-ah { -webkit-transition: height 0s; transition: height 0s; } .tns-ovh { overflow: hidden; } .tns-visually-hidden { position: absolute; left: -10000em; } .tns-transparent { opacity: 0; visibility: hidden; } .tns-fadeIn { opacity: 1; filter: alpha(opacity=100); z-index: 0; } .tns-normal, .tns-fadeOut { opacity: 0; filter: alpha(opacity=0); z-index: -1; } .tns-vpfix { white-space: nowrap; } .tns-vpfix > div, .tns-vpfix > li { display: inline-block; } .tns-t-subp2 { margin: 0 auto; width: 310px; position: relative; height: 10px; overflow: hidden; } .tns-t-ct { width: 2333.3333333%; width: calc(100% * 70 / 3); position: absolute; right: 0; } .tns-t-ct:after { content: ""; display: table; clear: both; } .tns-t-ct > div { width: 1.4285714%; width: calc(100% / 70); height: 10px; float: left; } .tns-nav { display: none; } .tns-inner::after { content: ""; position: absolute; width: 1px; height: 100%; background-color: #fff; top: 0; right: 0; z-index: 2; } .tns-inner::before { content: ""; position: absolute; width: 1px; height: 100%; background-color: #fff; top: 0; left: 0; z-index: 2; } .top-level-teaser > ul { list-style: none; margin-left: 0; margin-right: 0; } .top-level-teaser .item { box-shadow: -5px 0px 10px 0 rgba(0, 0, 0, 0.08), 10px 10px 20px 0 rgba(0, 0, 0, 0.05); -webkit-transition: box-shadow 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: box-shadow 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); position: relative; margin-left: -8px; margin-right: -8px; padding: 0 8px 8px } .top-level-teaser .item > a { color: inherit; display: block; } .top-level-teaser .item:hover { box-shadow: 5px 10px 15px 0 rgba(0, 0, 0, 0.18); } .top-level-teaser .item + .item { margin-top: 1rem; } .top-level-teaser p { font-weight: 400; } .top-level-teaser .img { position: relative } .top-level-teaser .img:before { content: ''; display: block; position: absolute; width: 100%; height: 70%; left: 0; bottom: 0; z-index: 1; opacity: 0.85; -webkit-transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, .6)); background-image: linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, .6)); /* SIX-4815: top level teaser should be completelly clickable */ pointer-events: none; } .top-level-teaser .img img { display: block; } .top-level-teaser .teaser-link { font-weight: bold; color: #4997b7; text-decoration: none; -webkit-transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); /* Break long links, hyphens is needed for IE11 */ -ms-hyphens: auto; word-break: break-word } .top-level-teaser .teaser-link:focus { outline: thin dotted; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } .top-level-teaser .title { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; } .top-level-teaser h4 { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; } @media (max-width: 63.999em) { .top-level-teaser .title { font-size: 18px; overflow: hidden; padding-right: 10px; white-space: nowrap; width: 100%; text-overflow: ellipsis; z-index: 1; } } @media (max-width: 47.999em) { .top-level-teaser .title { position: absolute; top: 0; padding-top: calc(39% - 1em - 8px); color: rgb(255, 255, 255); margin-bottom: 0; /* TODO: find better solution to handle multiline text */ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; padding-right: 10px; } .top-level-teaser p { margin-top: .8em; } .top-level-teaser .item .img { width: auto; max-width: none; margin-left: -8px; margin-right: -8px; } } @media (min-width: 48em) { .top-level-teaser { overflow: hidden } .top-level-teaser > ul { margin-bottom: 0; } .top-level-teaser .item { position: relative; margin-right: 0; margin-left: 0; padding: 0 } .top-level-teaser .item.hidden { margin-bottom: 0; } .top-level-teaser .item:hover { color: rgb(255, 255, 255) } .top-level-teaser .item:hover .img:before { opacity: 1; } .top-level-teaser .cell { position: absolute; z-index: 2; width: 100%; bottom: 0; left: 0; padding: 1.5rem 1rem; } .top-level-teaser h4, .top-level-teaser .title, .top-level-teaser p { color: rgb(255, 255, 255); } .top-level-teaser + .list2 { margin-top: -32px; } } .tag-labels { list-style: none; margin-left: -2px; margin-right: -2px; margin-bottom: 10px } .tag-labels li { display: inline-block; padding: 8px 12px 7px; border: 1px solid; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-size: 0.75rem; /* 12/16 */ margin: 0 2px 8px; } .top-level-teaser .tag-labels { padding-top: .8rem; color: rgb(73, 151, 183); } .list2 .tag-labels { color: rgb(73, 151, 183); } .article-header .tag-labels { color: rgb(73, 151, 183); margin-bottom: 15px; } @media (min-width: 48em) { .top-level-teaser .tag-labels { color: rgb(255, 255, 255); } } .list2 { page-break-inside: avoid; -webkit-column-break-inside: avoid; break-inside: avoid } .list2 > ul { list-style-type: none; margin: 0; padding: 0; } .list2 .item { display: block; position: relative; } .list2 .item > a, .list2 .item .cell > a, .list2 .item-inner > a { color: rgb(113, 113, 113) } .color-inverted .list2 .item > a, .color-inverted .list2 .item .cell > a, .color-inverted .list2 .item-inner > a { color: rgb(255, 255, 255) } .list2 .item > a, .list2 .item-inner { display: -webkit-box; display: flex; -webkit-box-flex: 1; flex: 1; -ms-flex: 1 1 auto; flex-basis: 100%; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; font-weight: normal; height: 100%; } .list2:not(.list-with-btn) .item > a .teaser-link, .list2:not(.list-with-btn) .item-inner .teaser-link { font-weight: bold; color: #4997b7; text-decoration: none; -webkit-transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); /* Break long links, hyphens is needed for IE11 */ -ms-hyphens: auto; word-break: break-word } .list2:not(.list-with-btn) .item > a .teaser-link:focus, .list2:not(.list-with-btn) .item-inner .teaser-link:focus { outline: thin dotted; /* this is fallback, do not remove */ outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } .list2:not(.list-with-btn) .item > a:hover .teaser-link, .list2:not(.list-with-btn) .item-inner:hover .teaser-link { color: #4a7485; text-decoration: none; } .list2.list-with-btn .teaser-link { align-self: start; } .list2 .img { flex-shrink: 0; } .list2 img { display: block; } .list2 .cell { display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-box-flex: 1; flex-grow: 1; padding: .8rem 0 0 0; } .row.featured .list2 .cell .title { /* SIX: featured grid title leaks */ padding: 0 } .list2 p { font-size: 0.875rem; width: 100%; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; font-weight: normal } .list2 p:last-child { margin-bottom: 0; } .list2 { /* SIX: div.teaser-link is used for events, and should NOT match here */ } .list2 span.teaser-link { margin-top: .8rem; } .list2 .list-teaser-news-date + .teaser-link, .list2 p + span.teaser-link { margin-top: 0; } .list-vertical { -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column } .list-vertical .show_more { margin-top: 1rem; } .list2 .vcard a .description, .list2 .vcard a:hover .description { color: rgb(113, 113, 113); margin-bottom: 1em; } /* TODO: check if this is still needed, should be moved to text.css */ .home-page .list2 a[target="_blank"]::after, .page-content .list2 a[target="_blank"]::after { content: ""; display: none; } @media (min-width: 30em) { .list-image-alternating .item:nth-child(odd) .img { -webkit-box-ordinal-group: 3; order: 2; } .list2.list-image-alternating, .list2.list-image-left, .list2.list-image-right { /* & .item { display: flex; } */ } .list2.list-image-alternating .item > a, .list2.list-image-alternating .item > .item-inner, .list2.list-image-alternating .item .item-inner > a, .list2.list-image-left .item > a, .list2.list-image-left .item > .item-inner, .list2.list-image-left .item .item-inner > a, .list2.list-image-right .item > a, .list2.list-image-right .item > .item-inner, .list2.list-image-right .item .item-inner > a { display: -webkit-box; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; } .list2.list-image-alternating .img, .list2.list-image-left .img, .list2.list-image-right .img { display: block; flex-basis: 50%; /*max-width: 50%;*/ } .list2.list-image-alternating .image-block, .list2.list-image-left .image-block, .list2.list-image-right .image-block { margin-bottom: 0; } .list2.list-image-alternating .cell, .list2.list-image-left .cell, .list2.list-image-right .cell { /* for IE11 */ -webkit-box-flex: 1; flex-grow: 1; flex-shrink: 1; flex-basis: 100%; } .list2.list-image-alternating .img + .cell, .list2.list-image-left .img + .cell, .list2.list-image-right .img + .cell { padding: 0 0 0 1rem; flex-basis: 50%; } .list2.list-image-alternating.list-image-17 .img, .list2.list-image-left.list-image-17 .img, .list2.list-image-right.list-image-17 .img { flex-basis: calc(17% - 8px); } .list2.list-image-alternating.list-image-17 .img + .cell, .list2.list-image-left.list-image-17 .img + .cell, .list2.list-image-right.list-image-17 .img + .cell { flex-basis: calc(83% - 8px); } .list2.list-image-alternating.list-image-33 .img, .list2.list-image-left.list-image-33 .img, .list2.list-image-right.list-image-33 .img { flex-basis: calc(33.3333% - 8px); } .list2.list-image-alternating.list-image-33 .img + .cell, .list2.list-image-left.list-image-33 .img + .cell, .list2.list-image-right.list-image-33 .img + .cell { flex-basis: calc(66.6666% - 8px); } .list2.list-image-alternating.list-image-50 .img, .list2.list-image-alternating.list-image-50 .img + .cell, .list2.list-image-left.list-image-50 .img, .list2.list-image-left.list-image-50 .img + .cell, .list2.list-image-right.list-image-50 .img, .list2.list-image-right.list-image-50 .img + .cell { flex-basis: calc(50% - 8px); } .list2.list-image-right .img { -webkit-box-ordinal-group: 3; order: 2; } .list2.list-image-right .img + .cell { padding: 0 1rem 0 0; } .list2.list-image-alternating .cell { padding: 0; } .list2.list-image-alternating .img + .cell { padding: 0 0 0 1rem; } .list2.list-image-alternating .item:nth-child(odd) .img + .cell { padding: 0 1rem 0 0; } } @media (max-width: 47.999em) { .list2 .item + .item { margin: 1.25rem 0 0 0; } footer .list2 .img { display: none; } } @media (min-width: 48em) { .list2 > ul { display: -webkit-box; display: flex; flex-wrap: wrap; margin-left: -8px; margin-right: -8px; } .list2 .item { max-width: 100%; flex-basis: auto; -webkit-box-flex: 1; flex-grow: 1; margin-left: calc(16px * 0.5); margin-right: calc(16px * 0.5); margin-bottom: 16px; } .list2 { /* SIX-6262: blog lists can have margin bottom as they are not only horizontal */ } .list2.list-horizontal-6-6-4-4-4 .item { margin-bottom: 16px; } .list2.list-horizontal-6-6-4-4-4 .item, .list2.list-horizontal-4-4-4 .item { max-width: calc(33.33333333% - 16px); flex-basis: calc(33.33333333% - 16px); } .list2.list-horizontal-6-6-4-4-4 .item:nth-child(1), .list2.list-horizontal-6-6-4-4-4 .item:nth-child(2), .list2.list-horizontal-6-6-4-4-4 .item.half-width, .list2.list-horizontal-6-6 .item { max-width: calc(50% - 16px); flex-basis: calc(50% - 16px); } .list2.list-horizontal-3-3-3-3 .item { max-width: calc(25% - 16px); flex-basis: calc(25% - 16px); } .list2.list-horizontal-24-24-24-24-24 .item { max-width: calc(20% - 16px); flex-basis: calc(20% - 16px); } .list2.list-vertical { /* flex-direction: column; */ } .list2.list-vertical > ul { display: block; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; margin-left: 0; margin-right: 0; } .list2.list-vertical .item { margin: 0; max-width: 100% } .list2.list-vertical .item + .item { margin: 1rem 0 0 0; } .list2.list-vertical { /* START: equalized height */ } .list2.list-vertical.list-image-top, .list2.list-vertical.list-image-top > ul { display: -webkit-box; display: flex; -webkit-box-flex: 1; flex-grow: 1; flex-shrink: 1; flex-basis: auto; } .list2.list-vertical.list-image-top .item { -webkit-box-flex: 1; flex-grow: 1; flex-shrink: 1; flex-basis: 100%; } .list2.list-vertical { /* END: equalized height */ } .list2.list-vertical .teaser-link { /* vertical align 0 - right after teaser content auto - algin bottom of each teaser */ margin-top: 0; } } @media print { .list2.list-horizontal-6-6 .item { max-width: calc(50% - 16px); flex-basis: calc(50% - 16px); } .list2.list-horizontal-4-4-4 .item { max-width: calc(33.33333333% - 16px); flex-basis: calc(33.33333333% - 16px); } .list2.list-horizontal-3-3-3-3 .item { max-width: calc(25% - 16px); flex-basis: calc(25% - 16px); } .list2.list-horizontal-24-24-24-24-24 .item { max-width: calc(20% - 16px); flex-basis: calc(20% - 16px); } } .list2 .item { margin-top: 35px; } .bg-red .list-normal .item > a .teaser-link, .bg-red .list-normal .item .item-inner .teaser-link { color: rgb(255, 255, 255); } @media (min-width: 48em) { .list2.list-normal.list-vertical .item + .item { margin: 32px 0 0 0; } } .list-highlight .item { border-bottom: 1px solid rgb(220, 220, 220); padding: 0 0 1rem 0 } .list-highlight .item a p { color: #393939; } .bg-red .list-highlight .item > a .teaser-link, .bg-red .list-highlight .item .item-inner .teaser-link { color: rgb(255, 255, 255); } .list-box .item { box-shadow: -5px 0px 10px 0 rgba(0, 0, 0, 0.08), 10px 10px 20px 0 rgba(0, 0, 0, 0.05); -webkit-transition: box-shadow 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: box-shadow 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) } .list-box .item:hover { box-shadow: 5px 10px 15px 0 rgba(0, 0, 0, 0.18); } .list-box .item { /* SIX: list box teasers always */ } .color-inverted .list-box .item > a, .color-inverted .list-box .item > a:hover, .row.featured .list-box .item > a, .row.featured .list-box .item > a:hover, .color-inverted .list-box .item .item-inner, .color-inverted .list-box .item .item-inner:hover, .row.featured .list-box .item .item-inner, .row.featured .list-box .item .item-inner:hover { color: rgb(113, 113, 113) } .list-box { /* SIX: titles in list box teasers always should use rock-90 */ } .list-box h2, .list-box h4, .list-box .title { color: rgb(57, 57, 57); } .list-box h4 { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; } .list-box .cell { background-color: #fff; flex-shrink: 0; } .list-box .cell, .list-box .img + .cell { padding: .8rem 1.25rem 1.25rem 1.25rem; } .list-box .img { background-color: #fff; } .list-box.list-box--boxes-disabled .item, .list-box.list-box--boxes-disabled .item:hover { box-shadow: none; } @media (max-width: 47.999em) { .list2.list-box .img { display: none; } } @media (min-width: 30em) { .list-box.list-image-left .cell, .list-box.list-image-left .img + .cell, .list-box.list-image-right .cell, .list-box.list-image-right .img + .cell, .list-box.list-image-alternating .cell, .list-box.list-image-alternating .img + .cell { padding: .8rem 1rem 1rem 1rem; } .list-box.list-image-left .img { padding: 1rem 0 1rem 1rem; } .list-box.list-image-right .img { padding: 1rem 1rem 1rem 0; } .list-box.list-image-alternating .img { padding: 1rem 0 1rem 1rem; } .list-box.list-image-alternating .item:nth-child(odd) .img { padding: 1rem 1rem 1rem 0; } .list-box.list-image-alternating .item:nth-child(odd) .img + .cell { padding: .8rem 1rem 1rem 1rem; } } .bg-red .list-box .fa-ul a { color: #4997b7; } @media print { .list-box .item { box-shadow: none; border: 1px solid #dcdcdc; } } .event-teaser-badge { display: block; background: rgb(222, 57, 25); color: rgb(255, 255, 255); font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-weight: 700; min-width: 75px; padding: 8px; position: relative; align-self: flex-start; /* fallback for IE11 bug (bug when there are no images and a badge) */ align-self: start; top: -.8rem; margin-left: 20px; } .event-teaser-badge-day { font-size: 1.375rem; /* 22/16 */ display: block; line-height: 1.1; text-align: center; position: relative } .event-teaser-badge-day span { display: inline-block; width: 100%; white-space: nowrap; } .event-teaser-badge-day span:nth-child(1):nth-last-child(2){ width: 50%; min-width: 45px } .event-teaser-badge-day span:nth-child(1):nth-last-child(2):after { position: absolute; content: '–'; top: 1px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); display: block; font-weight: 200; } .event-teaser-badge-day span:nth-child(2):nth-last-child(1) { width: 50%; min-width: 45px; } .event-teaser-badge-month { display: block; font-size: 0.75rem; /* 12/16 */ text-align: center } .event-teaser-badge-month span { display: inline-block; width: 100%; white-space: nowrap; } .event-teaser-badge-month span:nth-child(1):nth-last-child(2), .event-teaser-badge-month span:nth-child(2):nth-last-child(1) { width: 50%; padding: 0 0.25rem; } @media (min-width: 48em) { .event-teaser-badge { margin-left: 0; left: calc(45px - 1.25rem); } .img + .cell .event-teaser-badge { position: absolute; top: 0; left: 45px; } .list-image-right .img + .cell .event-teaser-badge { left: auto; right: 5%; } .list-box.list-image-left .img + .cell .event-teaser-badge, .list-box.list-image-right .img + .cell .event-teaser-badge { top: 16px; } .list-image-right .img + .cell .event-teaser-badge, .list-image-alternating .item:nth-child(odd) .event-teaser-badge { left: auto; right: 5%; } .list-image-top .img + .cell .event-teaser-badge { top: 0; } } .list-image-top .item[data-six-tags*="RED"] .img:before, .top-level-teaser .item[data-six-tags*="RED"] .img:before { content: ''; position: absolute; width: 20px; height: 77px; top: 0; left: 1.25rem; background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%20130%20499.8'%3E%3Cpath%20d%3D'M0-.6h130v500.5H0V-.6z'%20fill%3D'%23de3919'%2F%3E%3Cpath%20d%3D'M49.7%2052.5v38.2h12.7C73.8%2090.7%2077%2079.3%2077%2070.6c0-13.1-5.5-18.1-14.6-18.1H49.7zm0%2059.3v56.8H21V31.4h53c19.6%200%2032.1%2012.5%2032.1%2035.9%200%2017.5-6.8%2030.6-25.5%2033.6v.4c6.3.8%2024.9%202.3%2024.9%2027%200%208.7.6%2034.6%203.2%2040.3h-28c-3.8-8.4-3-17.7-3-26.6%200-16.3%201.5-30.2-20.5-30.2h-7.5zm48.2%20206.8v-21.1H50.3v-40.1h42.6v-21.1H50.3v-33.8h46.2v-21.1H21.6v137.2h76.3zm-47.1%2033.9v95h13.9c17.5%200%2020.9-13.1%2020.9-47.5%200-25.3%200-47.5-20-47.5H50.8zM22.1%20468.6V331.4H70c37.6%200%2044.7%2025.1%2044.7%2067.8%200%2021.1%203.2%2069.4-45.8%2069.4H22.1z'%20fill%3D'%23fff'%2F%3E%3C%2Fsvg%3E"); background-repeat: no-repeat; } @media (min-width: 64em) { .top-level-teaser .item[data-six-tags*="RED"] .img:before, .list-horizontal-6-6-4-4-4 .item[data-six-tags*="RED"]:nth-child(1) .img:before, .list-horizontal-6-6-4-4-4 .item[data-six-tags*="RED"]:nth-child(2) .img:before { width: 30px; height: 115px; } } .teaser-link { color: inherit; display: block; font-size: 0.75rem; font-weight: bold; margin-top: 0; text-decoration: none } .teaser-link .fa { margin-right: 3px; padding-right: 0; } .teaser-link span { display: inline-block; padding-right: 1.25rem; margin-top: 0.25rem; } .teaser-link span:last-child, .teaser-link span:first-child:last-child, .teaser-link span.date span { padding-right: 0; } .page-header-copy .teaser-link { margin-top: 0; margin-bottom: 1rem } .page-header-copy .teaser-link span { margin-top: 0; } .hero-header-copy .teaser-link { margin-top: 0; margin-bottom: 1rem } .hero-header-copy .teaser-link span { margin-top: 0; } .item .teaser-link + p { margin-top: 15px; } .list2 .img .fa { position: absolute; font-size: 1.8rem; width: 4em; height: 2.2em; top: 50%; left: 50%; margin-left: -2em; margin-top: -1em; text-align: center; line-height: 2.2em; color: rgb(255, 255, 255); /* background: color(var(--color-six-red) a(60%)); */ background: rgba(222, 57, 25, 0.6); -webkit-transition: background 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: background 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); } .list2 a:hover .img .fa { background: rgb(222, 57, 25); } .teaser-offering ul { font-size: 0.875rem; } .teaser-price { display: block; font-size: 1.25rem; } .teaser-small-print p { font-size: 0.75rem; } .teaser-offering + .teaser-link { margin-top: .8rem; } .color-inverted .list2.list-accordion .item > a .teaser-link { color: #fff; } .list-accordion { /* Currently needed because of strong .list2 declaration */ } .list-accordion.list2 .item > a, .list-accordion.list2 .item .item-inner, .list-accordion .item > a, .list-accordion .item .item-inner { border-bottom: 1px solid rgb(220, 220, 220); outline: 0; -webkit-box-flex: 0; flex-grow: 0; height: auto } .list-accordion.list2 .item > a .cell, .list-accordion.list2 .item .item-inner .cell, .list-accordion .item > a .cell, .list-accordion .item .item-inner .cell { -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; flex-wrap: nowrap; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: center; align-items: center; padding-top: 0.5rem; min-height: 3.6rem; } .list-accordion.list2 .item > a .teaser-link, .list-accordion.list2 .item .item-inner .teaser-link, .list-accordion .item > a .teaser-link, .list-accordion .item .item-inner .teaser-link { color: rgb(222, 57, 25); padding-left: 0.75rem; padding-bottom: 0.5rem; margin: 0; } .list-accordion.list2 .item[aria-expanded="true"] > a, .list-accordion.list2 .item[aria-expanded="true"] .item-inner, .list-accordion.list2 .item.is-opening > a, .list-accordion.list2 .item.is-opening .item-inner, .list-accordion .item[aria-expanded="true"] > a, .list-accordion .item[aria-expanded="true"] .item-inner, .list-accordion .item.is-opening > a, .list-accordion .item.is-opening .item-inner { border-bottom: 0px solid; } .list-accordion.list2 .item[aria-expanded="true"] .accordion-indicator:before, .list-accordion.list2 .item.is-opening .accordion-indicator:before, .list-accordion .item[aria-expanded="true"] .accordion-indicator:before, .list-accordion .item.is-opening .accordion-indicator:before { content: "\ec29"; } .list-accordion.list2 .item .accordion-indicator:before, .list-accordion .item .accordion-indicator:before { content: "\ec9b"; font-family: "SIX-Pictogram"; font-weight: normal; } .list-accordion.list2 .item .img img, .list-accordion .item .img img { width: 100%; max-width: none; } .list-accordion.list2 .item .expander-body, .list-accordion .item .expander-body { width: 100%; z-index: 3; } .list-accordion.list2 .item .expander-body-inner, .list-accordion .item .expander-body-inner { padding: 2.5rem calc(8.33333333% + 8px); border-bottom: 1px solid rgb(220, 220, 220) } .list-accordion.list2 .item .expander-body-inner ul li, .list-accordion .item .expander-body-inner ul li { font-size: 0.875rem; } @media (min-width: 48em) { .list-accordion.list-horizontal-4-4-4.list2 .item:nth-child(3n+2) .expander-body, .list-accordion.list-horizontal-4-4-4 .item:nth-child(3n+2) .expander-body { margin-left: calc((100% + 16px) * -1); } .list-accordion.list-horizontal-4-4-4.list2 .item:nth-child(3n) .expander-body, .list-accordion.list-horizontal-4-4-4 .item:nth-child(3n) .expander-body { margin-left: calc((200% + 32px) * -1); } .list-accordion.list-horizontal-4-4-4.list2 .item .expander-body, .list-accordion.list-horizontal-4-4-4 .item .expander-body { width: calc(300% + 32px); } .list-accordion.list-horizontal-4-4-4.list2 .item .expander-body-inner, .list-accordion.list-horizontal-4-4-4 .item .expander-body-inner { padding: 2.5rem calc(8.33333333% + 16px); } .list-accordion.list-horizontal-6-6.list2 .item:nth-child(2n) .expander-body, .list-accordion.list-horizontal-6-6 .item:nth-child(2n) .expander-body { margin-left: calc((100% + 16px) * -1); } .list-accordion.list-horizontal-6-6.list2 .item .expander-body, .list-accordion.list-horizontal-6-6 .item .expander-body { width: calc(200% + 16px); } .list-accordion.list-horizontal-6-6.list2 .item .expander-body-inner, .list-accordion.list-horizontal-6-6 .item .expander-body-inner { padding: 2.5rem calc(8.33333333% + 16px); } } .dam_taxonomy_list .list > ul.gallery { margin-left: -20px; } .list .gallery .item { float: left; margin: 0 0 15px 15px; } .align-center .list .gallery .item img { margin: 0 auto; } .align-right .list .gallery .item img { margin: 0 0 0 auto; } .list-teaser-news { margin-bottom: 0 } .list-teaser-news .item { flex-basis: 100%; } .list-teaser-news a { margin-left: 16px; margin-right: 16px } .list-teaser-news a .cell { padding: 30px 0 40px 0; } .list2.list-teaser-news > ul { margin: 0; } .list2.list-teaser-news .item { margin: 0; /* SIX: we need this so the red line can be positioned outside at the bottom*/ position: static; } .list2.list-teaser-news p { font-size: 1rem; } .list-teaser-news-date { text-transform: uppercase; font-size: 0.75rem; /* 12/16 */ color: rgb(184, 184, 184); margin-bottom: .8rem } .list-teaser-news-date .fa { margin-right: 5px; position: relative; top: 3px; font-size: 1.333em; /* 16/12 */ } .list-teaser-news-date span + .fa { margin-left: 5px; } .list-teaser-news .list-teaser-news-date { margin-bottom: 0 } @media (min-width: 64em) { .list-teaser-news a { margin-left: 40px; margin-right: 40px } .list-teaser-news a:after { content: ""; position: absolute; bottom: 0; left: 40px; width: calc(100% - 80px); height: 4px; background: rgb(222, 57, 25); opacity: 0; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); transition: transform .5s cubic-bezier(0.19, 0.92, 0.27, 1), opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1); transition: transform .5s cubic-bezier(0.19, 0.92, 0.27, 1), opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); } .list-teaser-news a:hover:after { opacity: 1; -webkit-transform: scaleX(1); transform: scaleX(1); } } .list-bordered .item, .list-featured .item, .list-bordered--white-bg .item { padding: 1rem; } .list-bordered.list-vertical .item + .item, .list-featured.list-vertical .item + .item, .list-bordered--white-bg.list-vertical .item + .item { margin-top: 1rem; } .list-bordered .item { border: 1px solid rgb(220, 220, 220); } .list-bordered--white-bg .item { border: 1px solid rgb(220, 220, 220); background-color: rgb(255, 255, 255); } .list-featured .item { background-color: rgb(248, 248, 248); } /* attachment links */ .list2 .fa-ul { font-size: .75rem; margin: .75rem 0 0 2.1rem; } /* list elements with file type icons */ .list2 .item--use-file-type-icon { margin-top: 3px !important } .list2 .item--use-file-type-icon .item-inner { display: -webkit-box; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; } .list2 .item--use-file-type-icon .item__file-icon { padding-top: 1.5rem; margin-right: 20px; } .list2 .item--use-file-type-icon[data-six-item-id$=".pdf"] .item__file-icon i:before { content: '\f1c1'; } .list2 .item--use-file-type-icon[data-six-item-id$=".zip"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".rar"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".tar"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".7z"] .item__file-icon i:before { content: '\f1c6'; } .list2 .item--use-file-type-icon[data-six-item-id$=".doc"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".docx"] .item__file-icon i:before { content: '\f1c2'; } .list2 .item--use-file-type-icon[data-six-item-id$=".xls"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".xlsx"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".csv"] .item__file-icon i:before { content: '\f1c3'; } .list2 .item--use-file-type-icon[data-six-item-id$=".ppt"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".pptx"] .item__file-icon i:before { content: '\f1c4'; } .list2 .item--use-file-type-icon[data-six-item-id$=".txt"] .item__file-icon i:before { content: '\f0f6'; } .list2 .item--use-file-type-icon[data-six-item-id$=".jar"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".xml"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".xsd"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".edi"] .item__file-icon i:before { content: '\f1c9'; } .list2 .item--use-file-type-icon[data-six-item-id$=".jpg"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".jpeg"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".png"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".gif"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".tif"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".tiff"] .item__file-icon i:before { content: '\f1c5'; } .list2 .item--use-file-type-icon[data-six-item-id$=".mp3"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".wma"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".wav"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".ogg"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".flac"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".aif"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".aifc"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".aiff"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".3gp"] .item__file-icon i:before { content: '\f1c7'; } .list2 .item--use-file-type-icon[data-six-item-id$=".webm"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".mkv"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".vob"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".avi"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".wmv"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".mp4"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".mpg"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".mpeg"] .item__file-icon i:before, .list2 .item--use-file-type-icon[data-six-item-id$=".mov"] .item__file-icon i:before { content: '\f1c8'; } .list2 .item--use-file-type-icon[data-six-item-id$=".rss"] .item__file-icon i:before { content: '\f09e'; } .list2 .item--use-file-type-icon .cell > a h4.title { margin-top: 24px; } .list2 .item--use-file-type-icon .cell > a .teaser-path + h4.title { margin-top: 0; } .list2 > ul:hover .item--use-file-type-icon, .list2 > ul:hover .item--use-file-type-icon h4.title { color: rgb(149, 149, 149); } .list2 > ul:hover .item--use-file-type-icon:hover, .list2 > ul:hover .item--use-file-type-icon:hover h4.title { color: rgb(57, 57, 57); } @media (max-width: 63.999em) { .list2 .item--use-file-type-icon .item__file-icon { padding-top: 2.4rem; margin-right: 10px } .list2 .item--use-file-type-icon .item__file-icon i { font-size: 1em; } } @media (max-width: 47.999em) { .list2 .fa-ul { margin-left: 4em; } } @media (min-width: 48em) { .list2 { /* item--has-image is a modifier to support multiple links (attachments) */ } .list2 .item.item--has-image .item-inner { display: block } .list2 .item.item--has-image .item-inner > a { display: block; } .list2 .item.item--has-image:after { clear: both; content: ""; display: table; } .list2.list-image-left .item--has-image .img { float: left; } .list2.list-image-right .item--has-image .img { float: right; } .list2.list-image-17 .item--has-image .img { width: calc(17% - 8px); } .list2.list-image-left.list-image-33 .item--has-image .img, .list2.list-image-right.list-image-33 .item--has-image .img { width: calc(33.3333% - 8px); } .list2.list-image-left.list-image-50 .item--has-image .img, .list2.list-image-right.list-image-50 .item--has-image .img { width: calc(50% - 8px); } } .logo-grid { display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; margin-left: -8px; margin-right: -8px } .logo-grid.list-vertical .fig { padding: 0 } .logo-grid.list-vertical .fig figure { height: auto; position: static; } .logo-grid-item .textimage { margin: 10px; } .logo-grid-item img { display: inline; max-width: 100%; max-height: 100%; -webkit-filter: grayscale(1); filter: grayscale(1); -webkit-transition: -webkit-filter .2s ease-out; transition: -webkit-filter .2s ease-out; transition: filter .2s ease-out; transition: filter .2s ease-out, -webkit-filter .2s ease-out; } .logo-grid-item a { text-align: center } .logo-grid-item a:after { display: none; } .logo-grid-item:hover img { -webkit-filter: grayscale(0); filter: grayscale(0); } @media (min-width: 30em) { .logo-grid.list-horizontal-6-6, .logo-grid.list-horizontal-4-4-4, .logo-grid.list-horizontal-3-3-3-3, .logo-grid.list-horizontal-2-2-2-2-2-2, .logo-grid.list-horizontal-24-24-24-24-24 { flex-wrap: wrap; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row } .logo-grid.list-horizontal-6-6 .textimage, .logo-grid.list-horizontal-4-4-4 .textimage, .logo-grid.list-horizontal-3-3-3-3 .textimage, .logo-grid.list-horizontal-2-2-2-2-2-2 .textimage, .logo-grid.list-horizontal-24-24-24-24-24 .textimage { margin: 1rem } .logo-grid.list-horizontal-6-6 .textimage .fig, .logo-grid.list-horizontal-4-4-4 .textimage .fig, .logo-grid.list-horizontal-3-3-3-3 .textimage .fig, .logo-grid.list-horizontal-2-2-2-2-2-2 .textimage .fig, .logo-grid.list-horizontal-24-24-24-24-24 .textimage .fig { padding-bottom: 50%; position: relative } .logo-grid.list-horizontal-6-6 .textimage .fig figure, .logo-grid.list-horizontal-4-4-4 .textimage .fig figure, .logo-grid.list-horizontal-3-3-3-3 .textimage .fig figure, .logo-grid.list-horizontal-2-2-2-2-2-2 .textimage .fig figure, .logo-grid.list-horizontal-24-24-24-24-24 .textimage .fig figure { position: absolute; width: 100%; height: 100%; top: 0; left: 0 } .logo-grid.list-horizontal-6-6 .textimage .fig figure a, .logo-grid.list-horizontal-4-4-4 .textimage .fig figure a, .logo-grid.list-horizontal-3-3-3-3 .textimage .fig figure a, .logo-grid.list-horizontal-2-2-2-2-2-2 .textimage .fig figure a, .logo-grid.list-horizontal-24-24-24-24-24 .textimage .fig figure a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .logo-grid.list-horizontal-6-6 .textimage .fig figure img, .logo-grid.list-horizontal-4-4-4 .textimage .fig figure img, .logo-grid.list-horizontal-3-3-3-3 .textimage .fig figure img, .logo-grid.list-horizontal-2-2-2-2-2-2 .textimage .fig figure img, .logo-grid.list-horizontal-24-24-24-24-24 .textimage .fig figure img { position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } .list-horizontal-6-6 .logo-grid-item, .list-horizontal-3-3-3-3 .logo-grid-item{ max-width: calc(50% - 16px); flex-basis: calc(50% - 16px); } .list-horizontal-4-4-4 .logo-grid-item, .list-horizontal-2-2-2-2-2-2 .logo-grid-item, .list-horizontal-24-24-24-24-24 .logo-grid-item { max-width: calc(33.33333333% - 16px); flex-basis: calc(33.33333333% - 16px); } } @media (min-width: 48em) { .list-horizontal-3-3-3-3 .logo-grid-item, .list-horizontal-2-2-2-2-2-2 .logo-grid-item{ max-width: calc(25% - 16px); flex-basis: calc(25% - 16px); } .list-horizontal-24-24-24-24-24 .logo-grid-item { max-width: calc(20% - 16px); flex-basis: calc(20% - 16px); } } @media (min-width: 64em) { .list-horizontal-2-2-2-2-2-2 .logo-grid-item { max-width: calc(16.66666667% - 16px); flex-basis: calc(33.66666667% - 16px); } .list-horizontal-24-24-24-24-24 .logo-grid-item { max-width: calc(20% - 16px); flex-basis: calc(20% - 16px); } } @media print { .list-horizontal-6-6 .logo-grid-item { max-width: calc(50% - 16px); flex-basis: calc(50% - 16px); } .list-horizontal-4-4-4 .logo-grid-item { max-width: calc(33.33333333% - 16px); flex-basis: calc(33.33333333% - 16px); } .list-horizontal-3-3-3-3 .logo-grid-item { max-width: calc(25% - 16px); flex-basis: calc(25% - 16px); } .list-horizontal-2-2-2-2-2-2 .logo-grid-item { max-width: calc(16.66666667% - 16px); flex-basis: calc(33.66666667% - 16px); } .list-horizontal-24-24-24-24-24 .logo-grid-item { max-width: calc(20% - 16px); flex-basis: calc(20% - 16px); } } /* use bg-light-gray to hide sidebar behind map */ .section.map-explorer.bg-light-gray { padding: 0 } .section.map-explorer.bg-light-gray .bg { background: transparent; } .section.map-explorer.bg-light-gray:after { display: none; } .map-explorer .filter-advanced-collapsible { z-index: 10; } .map-explorer-canvas { height: 50vh; background: rgb(248, 248, 248) } .map-explorer-canvas .spinner { height: 100%; display: -webkit-box; display: flex } .map-explorer-canvas .spinner svg { margin: auto; } .map-explorer-widget { margin-bottom: 30px } .map-explorer-widget:focus { outline: none; } .map-explorer-widget-inner { font-size: 0.875rem /* 14/16 */ } .map-explorer-widget-inner li { margin-bottom: 0.2em; } .map-explorer-widget-inner a { display: inline-block; } .map-explorer-widget-inner .fa-ul, .map-explorer-widget-inner a { margin-left: 20px; } .map-explorer-widget-inner .map-expolerer-list li.tel a, .map-explorer-widget-inner .map-expolerer-list li.email a { margin-left: 0; } @media (min-width: 64em) { .map-explorer-canvas { min-height: 500px; } .map-explorer-widget { position: absolute; z-index: 1; top: 0; left: 0; } .map-explorer-widget-inner { background: white; padding: 20px; margin: 40px; box-shadow: -5px 0px 10px 0 rgba(0, 0, 0, 0.08), 10px 10px 20px 0 rgba(0, 0, 0, 0.05); } } .image-slider { /* SIX-4421: fixes height on IE11 */ -webkit-box-flex: 0; flex-grow: 0; flex-shrink: 0; position: relative } .image-slider-inner { position: relative; overflow: hidden; } .image-slider-items { list-style-type: none; margin-left: 0; margin-bottom: 0; display: -webkit-box; display: flex; -webkit-box-flex: 1; flex: 1 auto; } .image-slider-item { background: rgb(57, 57, 57); margin-bottom: 0; /* SIX-4421: rounding error shows 1px of the next image */ margin-right: .5px; position: relative; -webkit-box-flex: 0; flex: 0 0 100% } .image-slider-item .fig { position: relative; margin-bottom: 0 } .image-slider-item .fig img { display: block; } .image-slider-item figcaption { display: none; min-height: 48px; margin: 0; padding: 0 1rem; position: absolute; bottom: 0; left: 0; right: 0; padding-right: 176px; /* background: color(var(--color-rock-90) a(60%)); */ background: rgba(57, 57, 57, 0.6); color: rgb(255, 255, 255) } .image-slider-item figcaption .caption { padding: 12px 0 12px; margin: 0; } .image-slider .btn { background: rgb(255, 255, 255); } .image-slider-prev, .image-slider-next { position: absolute; bottom: 0; display: block; cursor: pointer; width: 48px; height: 48px; font-size: 1rem; color: rgb(113, 113, 113); /* SIX-4421: never ever have spacing after slider btn element */ margin-bottom: 0 !important } .image-slider-prev:focus, .image-slider-prev:hover, .image-slider-next:focus, .image-slider-next:hover { color: rgb(57, 57, 57); } .image-slider-prev:active, .image-slider-next:active { -webkit-transform: none; transform: none; background: rgb(248, 248, 248); } .image-slider-prev svg, .image-slider-next svg { display: block; width: 100%; height: 100%; -webkit-transition: fill 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: fill 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); fill: currentColor; } .image-slider-count { width: 80px; height: 48px; position: absolute; bottom: 0; right: 96px; color: rgb(255, 255, 255); background: rgb(57, 57, 57); font-weight: 700; font-size: 0.875rem; /* 14/16 */ text-align: center; letter-spacing: 0.1rem; line-height: 48px; /* box-shadow: 1px 1px 0 0 rgba(255, 255, 255, 0.05) inset; */ } .image-slider-count-current { color: #4997b7; } .image-slider-next { right: 0; } .image-slider-prev { right: 48px; } @media (min-width: 48em) { .image-slider-item figcaption { display: block; } } @media (min-width: 1350px) { } @media (min-width: 80.125em) { .image-slider-item { } } @media print { .image-slider { display: none; } .image-slider-count { right: 0; } } .filter { padding-top: 20px; margin-left: -.5rem; margin-right: -.5rem; margin-bottom: 10px } .filter .input { display: inline-block; margin: .5rem .4rem; } .filter button { margin-bottom: 0; } .filter-form { margin-bottom: 0; } .filter-form + .list2 { margin-top: 1.25rem; } .filter-caption { margin: 1rem 0 0.5rem; padding-bottom: 0.5rem; border-bottom: 1px solid rgb(220, 220, 220); } .filter-caption-title { font-family: "Noto Sans", Helvetica, Arial, sans-serif; color: rgb(184, 184, 184); font-weight: 700; font-size: 0.750rem; margin-top: 0; margin-bottom: .5rem; text-transform: uppercase; line-height: 1.25; color: rgb(222, 57, 25); padding: 0; } .filter-result { margin: 40px 0 } .filter-result > .underlined_title + .table-pagination { display: none; } @media (min-width: 30em) { .filter-result > .underlined_title + .table-pagination { display: block; } } @media (min-width: 48em) { .filter-form { margin-bottom: 80px; } .filter { padding-top: 40px; margin-bottom: 20px; } } .filter-tags { width: 100%; display: -webkit-box; display: flex; -webkit-box-align: start; align-items: flex-start; -webkit-box-pack: justify; justify-content: space-between; flex-wrap: wrap; /* SIX-4121: changed filter and results to be the same component section */ margin-bottom: 40px } .filter-tags .field { padding-top: 0; margin-bottom: 0; } /* Overlay for modal window */ .overlay, .overlay_shim { background-color: #000; border: none; bottom: 0; display: none; height: 100%; left: 0; position: fixed; right: 0; top: 0; z-index: 9000; } .overlay.visible { display: block; } /* Overlay for flyout */ .page .overlay, .page .overlay_shim { background-color: #fff; bottom: 0; position: absolute; z-index: 200; } /* AEM refsearch */ .search-results .item { display: block; padding: 25px 0; } .search-results .item { border-bottom: 1px solid rgb(220, 220, 220); } .search-results .result-item + .result-item { border-top: 1px solid rgb(220, 220, 220); } .result.list.loading svg { margin: 0 auto; } /* SIX-4777: this is required using anchor_trim.js */ [data-six-trim-url] { display: block; overflow-x: hidden; white-space: nowrap; } /* END AEM refsearch */ .result-item { display: block; padding: 25px 0 } .result-item em { color: rgb(78, 78, 78); } .result-item a p { color: rgb(113, 113, 113); font-weight: normal; } .result-item { /* attachment */ } .result-item .fa-ul { line-height: 1; margin: 0; padding: 1rem 0 0 2.4em; width: 100% } .result-item .fa-ul .title { font-size: .75rem; } .result-item .fa-ul p { margin-bottom: 0; } .result-item .fa-ul li:last-child { margin-bottom: 2px; } .result-item:after { clear: both; content: ""; display: table; } @media (min-width: 30em) { .result-item.result-has-image .fa-ul { float: right; width: calc(100% - 165px); } } /* TODO: moved to .list-asset.css */ .asset-list-border > .result-item, .asset-list-featured > .result-item { padding: 1rem; } .asset-list-border .result-item + .result-item, .asset-list-featured .result-item + .result-item { margin-top: 1rem; } .asset-list-border > .result-item { border: 1px solid rgb(220, 220, 220); } .asset-list-featured > .result-item { background-color: rgb(248, 248, 248) } .asset-list-featured > .result-item .img-shade:before { display: none; } .result-meta { width: 100%; } .result-action, .result-info { font-size: 0.75rem; margin-bottom: 5px } .result-action .fa, .result-info .fa { margin-right: 5px; } .result-action > a, .result-action > span, .result-info > a, .result-info > span { display: inline-block; margin-right: 20px; } .result-action > a, .result-info > a { margin-bottom: 4px; } .result-path { display: block; font-style: normal; white-space: nowrap; } .result-outline { font-weight: normal; color: rgb(113, 113, 113); } .result-action { margin-top: 10px } .result-action .fa { margin-right: 0.3rem; } a.result-item .h3 { color: rgb(57, 57, 57); -webkit-transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); } a.result-item:hover .h3 { color: rgb(74, 116, 133); } .search-top-hit { background: #f8f8f8; padding: 20px } .search-top-hit .search-type-title, .search-top-hit .result-item { padding: 0; margin: 0; } .search-top-hit.search-type { margin-top: 40px; } .result-media .img { margin-bottom: 1rem; } .result-media .img-shade { position: relative; display: inline-block } .result-media .img-shade:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.04); mix-blend-mode: multiply; } .result-media img { display: block; width: auto; max-height: 150px; } @media (min-width: 30em) { .result-item-media { display: block; margin-left: -8px; margin-right: -8px } .result-item-media .result-media { float: left; margin: 0 8px; } .result-item-media .result-meta { float: right; margin: 0 8px; width: calc(100% - 182px); } .result-item-media .result-media .img { display: block; margin-bottom: 0; width: 150px; } } @media (min-width: 48em) { .search-top-hit { padding: 30px; } } /* Fixes to global choices styling */ .filter-advanced .choices__input--cloned.choices__input--cloned.choices__input--cloned { font-size: 1rem; font-weight: normal; display: inline-block; line-height: 1em; height: auto; min-width: 0; } .filter-advanced .choices__list--multiple .choices__item > div { display: inline-block; } .filter-advanced-header { position: relative; box-shadow: 0 10px 10px 0 rgba(0, 0, 0, 0.05), 5px 5px 5px 0 rgba(0, 0, 0, 0.05); z-index: 2 } .filter-advanced-header .field { margin: 0; padding: 0 } .filter-advanced-header .field.field-multi-date { width: 100%; } .filter-advanced-header .input-multi-list input:last-child { padding-right: 3.5rem; } .filter-advanced-header .choices[data-type*="select-one"]:after, .filter-advanced-header .choices[data-type*="select-multiple"]:after { content: ''; display: none; } .filter-advanced-collapsible { position: relative; min-height: 45px; background-color: rgb(248, 248, 248); box-shadow: 0 10px 10px 0 rgba(0, 0, 0, 0.05), 5px 5px 5px 0 rgba(0, 0, 0, 0.05); border: solid 1px rgb(220, 220, 220) } .filter-advanced-collapsible .expander-body:focus { outline: none; } .filter-advanced-collapsible .expander-trigger { background: transparent; border: 0; box-shadow: none; border-radius: 0; padding: 0; position: absolute; display: block; width: 100%; height: 45px; bottom: 0; right: 0; cursor: pointer; z-index: 1; -webkit-appearance: none } .filter-advanced-collapsible .expander-trigger:focus { outline: none; } .filter-advanced-collapsible .expander-trigger.is-opening, .filter-advanced-collapsible .expander-trigger[aria-expanded="true"] { width: 45px } .filter-advanced-collapsible .expander-trigger.is-opening .filter-summary-text, .filter-advanced-collapsible .expander-trigger[aria-expanded="true"] .filter-summary-text { visibility: hidden; opacity: 0; } .filter-advanced-header + .filter-advanced-collapsible { margin: 0 1rem; border-top: 0px solid; padding-top: 1.5rem; } .accordion-toggle-icon { width: 45px; height: 45px; display: block; padding-top: 12px; position: absolute; top: 0; right: 0 } .accordion-toggle-icon span { -webkit-transform: none; transform: none; -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; } .expander-trigger[aria-expanded="true"] .accordion-toggle-icon span { -webkit-transform: rotate(180deg); transform: rotate(180deg); } .filter-summary-text { height: 100%; width: 100%; padding-right: 45px; padding-left: 20px; position: absolute; left: 0; top: 0; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left; opacity: 1; -webkit-transition: opacity .3s; transition: opacity .3s } .filter-summary-text .default, .filter-summary-text .intro { display: inline; line-height: 45px; } .filter-summary-text .filter-value + .filter-value:before { content: '/'; display: inline; padding: 0 0.25rem 0 0.25rem; } .filter-summary-text .intro { display: inline-block } .filter-summary-text .intro:first-child:last-child { display: none; } .filter-summary-text .default { font-size: 14px; margin-top: 2px; color: rgb(113, 113, 113); } .filter-summary-text .default + .intro { display: none; } .filter-summary-text .default.hidden + .intro { display: inline-block; } /** * Special handling of Chrome datepicker on narrow desktop views */ .filter-advanced-fields .field .input-multi [type="date"]::-webkit-calendar-picker-indicator, .filter-advanced-fields .field .input-multi [type="date"]::-webkit-inner-spin-button, .filter-advanced-fields .field .input-multi [type="date"]::-webkit-clear-button, .filter-advanced-fields .field .input-multi [type="datetime"]::-webkit-calendar-picker-indicator, .filter-advanced-fields .field .input-multi [type="datetime"]::-webkit-inner-spin-button, .filter-advanced-fields .field .input-multi [type="datetime"]::-webkit-clear-button, .filter-advanced-fields .field .input-multi [type="datetime-local"]::-webkit-calendar-picker-indicator, .filter-advanced-fields .field .input-multi [type="datetime-local"]::-webkit-inner-spin-button, .filter-advanced-fields .field .input-multi [type="datetime-local"]::-webkit-clear-button, .filter-advanced-header .field .input-multi [type="date"]::-webkit-calendar-picker-indicator, .filter-advanced-header .field .input-multi [type="date"]::-webkit-inner-spin-button, .filter-advanced-header .field .input-multi [type="date"]::-webkit-clear-button, .filter-advanced-header .field .input-multi [type="datetime"]::-webkit-calendar-picker-indicator, .filter-advanced-header .field .input-multi [type="datetime"]::-webkit-inner-spin-button, .filter-advanced-header .field .input-multi [type="datetime"]::-webkit-clear-button, .filter-advanced-header .field .input-multi [type="datetime-local"]::-webkit-calendar-picker-indicator, .filter-advanced-header .field .input-multi [type="datetime-local"]::-webkit-inner-spin-button, .filter-advanced-header .field .input-multi [type="datetime-local"]::-webkit-clear-button { display: none; } .filter-advanced-fields { display: -webkit-box; display: flex; -webkit-box-flex: 1; flex: 1 1 auto; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; flex-wrap: wrap; margin-right: -1rem; margin-left: -1rem; padding: 0 1.25rem } .filter-advanced-fields .field { -webkit-box-flex: 1; flex: 1 1 auto; max-width: 100%; padding-right: 1rem; padding-left: 1rem; padding-bottom: 1.5rem; margin: 0 /* Overrides flex behaviour and makes field fullwidth */ } .filter-advanced-fields .field.fullwidth { flex-basis: 100%; max-width: 100%; } .filter-advanced-fields .field .title { left: 2.25rem; } .filter-advanced-fields .field input, .filter-advanced-fields .field select { width: 100%; max-width: 100%; } .filter-advanced-fields .field input[type="checkbox"], .filter-advanced-fields .field input[type="radio"] { min-width: auto; width: auto; max-width: none; } .filter-advanced-fields .field.autocompleter input { min-width: auto; width: auto; max-width: none } .filter-advanced-fields .field.autocompleter input.choices__input--cloned { max-width: 100%; } .filter-advanced-fields .field .input-multi .input { min-width: 60px; max-width: none; /* Chrome needs some absolute width otherwise the date inputs overflow */ width: 20px; } .filter-advanced-fields .field.autocompleter { min-width: 50% } .filter-advanced-fields .field.autocompleter:first-child { margin-top: 1rem; } #js .filter-advanced-fields .field.autocompleter select { visibility: hidden } .filter-input-wrapper { -webkit-box-align: center; align-items: center; display: -webkit-box; display: flex; position: relative } .filter-input-wrapper .filter-input { padding-right: 3.75rem; } .filter-input-wrapper .choices { margin-bottom: 0; width: 100%; } .filter-input-wrapper .choices__inner { padding-right: 3.75rem; } .filter-input-wrapper > select { visibility: hidden; } .filter-input-wrapper .filter-submit { position: absolute; top: 0; left: auto; right: 0; margin-bottom: 0; background: transparent; color: rgb(113, 113, 113); -webkit-transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) } .filter-input-wrapper .filter-submit .fa { margin-right: 0; } .filter-input-wrapper .filter-submit:hover, .filter-input-wrapper .filter-submit:focus { background: transparent; color: rgb(57, 57, 57); } .filter-advanced-buttons { padding: 1.25rem 1.25rem 3.5rem 1.25rem } .filter-advanced-buttons button, .filter-advanced-buttons [type="submit"] { margin-right: 1rem; width: 100% } .filter-advanced-buttons button:last-child, .filter-advanced-buttons [type="submit"]:last-child { margin-right: 0; } /* FAQ client search */ .accordion-search .filter-advanced { } @media (min-width: 30em) { .filter-advanced-buttons { padding: 1.25rem } .filter-advanced-buttons button, .filter-advanced-buttons [type="submit"] { margin-bottom: 0; width: auto; } .filter-advanced { /* Special handling for fieldset e.g. the multi-input fields */ } .filter-advanced fieldset.field { flex-basis: 50%; max-width: 50% } .filter-advanced fieldset.field.field-multi-date { flex-basis: 100%; max-width: 100%; } .filter-advanced { /* Prevent underlap of toggle on the buttons */ /* TODO: remove &.accordion-open { & .accordion-toggle { width: calc(100% - 315px); } } */ } .filter-advanced-fields .field .input-multi [type="date"]::-webkit-calendar-picker-indicator, .filter-advanced-fields .field .input-multi [type="date"]::-webkit-inner-spin-button, .filter-advanced-fields .field .input-multi [type="date"]::-webkit-clear-button, .filter-advanced-fields .field .input-multi [type="datetime"]::-webkit-calendar-picker-indicator, .filter-advanced-fields .field .input-multi [type="datetime"]::-webkit-inner-spin-button, .filter-advanced-fields .field .input-multi [type="datetime"]::-webkit-clear-button, .filter-advanced-fields .field .input-multi [type="datetime-local"]::-webkit-calendar-picker-indicator, .filter-advanced-fields .field .input-multi [type="datetime-local"]::-webkit-inner-spin-button, .filter-advanced-fields .field .input-multi [type="datetime-local"]::-webkit-clear-button, .filter-advanced-header .field .input-multi [type="date"]::-webkit-calendar-picker-indicator, .filter-advanced-header .field .input-multi [type="date"]::-webkit-inner-spin-button, .filter-advanced-header .field .input-multi [type="date"]::-webkit-clear-button, .filter-advanced-header .field .input-multi [type="datetime"]::-webkit-calendar-picker-indicator, .filter-advanced-header .field .input-multi [type="datetime"]::-webkit-inner-spin-button, .filter-advanced-header .field .input-multi [type="datetime"]::-webkit-clear-button, .filter-advanced-header .field .input-multi [type="datetime-local"]::-webkit-calendar-picker-indicator, .filter-advanced-header .field .input-multi [type="datetime-local"]::-webkit-inner-spin-button, .filter-advanced-header .field .input-multi [type="datetime-local"]::-webkit-clear-button { display: block; } .filter-advanced-fields .field.autocompleter { min-width: 50%; flex-basis: 50%; /* Override to target IE who interprets this wrong */ -ms-flex-preferred-size: auto; } } @media (min-width: 48em) { .filter-advanced-fields.grid .field { flex-basis: 50%; max-width: 50% } .filter-advanced-fields.grid .field.field-multi-date { flex-basis: 50%; max-width: 50%; } } @media (min-width: 80.125em) { .filter-advanced-fields.grid .field { flex-basis: 33.3333333%; max-width: 33.3333333%; /* Remove definitions for autocompleter fields */ min-width: 150px; } } /** * Style definitions for extended form elements like multi input */ .input-multi { } .input-multi-list { display: -webkit-box; display: flex; position: relative; -webkit-box-flex: 1; flex: 1; -ms-flex: 1 1 auto; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; flex-wrap: nowrap; -webkit-box-pack: start; justify-content: flex-start; align-content: stretch; -webkit-box-align: start; align-items: flex-start } .input-multi-list .input { -webkit-box-flex: 1; flex: 1; -ms-flex: 1 1 auto; min-width: 0; max-width: 100%; display: -webkit-box; display: flex; -webkit-box-pack: start; justify-content: flex-start; align-content: flex-start; position: relative; /* Let flex handle the width as some browsers seem to have issues with auto */ width: 1px } .input-multi-list .input input { border-left-width: 0; border-right-width: 0; } .input-multi-list .input:first-child input { border-left-width: 1px; } .input-multi-list .input:first-child .input-multi-label { display: none; } .input-multi-list .input:last-child input { border-right-width: 1px; } .input-multi-list input, .input-multi-list select { width: 100%; min-width: 1px; } .input-multi-list .input-multi-label { display: block; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); left: -1.25rem; width: 2.5rem; height: auto; font-size: 0.875rem; color: rgb(149, 149, 149); line-height: 1; overflow: hidden; text-align: center; } @media (min-width: 48em) { .input-multi-list .input:first-child .input-multi-label { display: block; left: 0.125rem } .input-multi-list .input:first-child .input-multi-label + input { padding-left: 2.75rem; } } /** * CSS definitions for select dependency */ .dependency-first-level, .dependency-second-level { display: inline-block; } .dependency-desktop-first-level, .dependency-desktop-second-level { display: none; list-style: none; } .dependency-desktop-second-level li { position: absolute; overflow: hidden; clip: rect(0 0 0 0); height: 1px; width: 1px; opacity: 0; } .dependency-desktop-second-level .dependency-show { position: relative; overflow: auto; height: auto; width: auto; opacity: 1; } .dependency-display-level { margin-top: 0.75rem; position: absolute; overflow: hidden; height: 1px; width: 1px; opacity: 0 } .dependency-display-level.dependency-show { position: relative; overflow: auto; height: auto; width: auto; opacity: 1; } @media (min-width: 64em) { .dependency-first-level, .dependency-second-level { display: none; } .dependency-desktop-first-level, .dependency-desktop-second-level { display: block; } } #six-modal { display: none; position: fixed; top: 0; left: 0; z-index: 9999; width: 100vw; height: 100vh; } #six-modal.open { display: block; } #six-modal .overlay { display: -webkit-box; display: flex; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; width: 100vw; height: 100vh; background: rgba(0, 0, 0, 0.75); background: -webkit-radial-gradient(circle, rgba(0, 0, 0, 0.76), rgba(0, 0, 0, 0.75)); background: radial-gradient(circle, rgba(0, 0, 0, 0.76), rgba(0, 0, 0, 0.75)); } #six-modal .overlay .modal { background: #fff; position: relative; padding: 20px; } #six-modal .close-btn { position: absolute; right: -14px; top: -50px; width: 45px; height: 40px; color: #dcdcdc; font-size: 31px; line-height: 41px; font-weight: unset; text-align: center; cursor: pointer; } #six-modal iframe { border: 0; max-width: calc(80vw - 40px); max-height: calc(80vh - 40px); } #six-modal .content { min-width: 50vw; min-height: 30vh; max-height: 80vh; max-width: 80vw; display: -webkit-box; display: flex; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; } #six-modal .content img { max-width: 100%; max-height: calc(80vh - 40px); } body.six-modal-open { overflow: hidden; height: 100vh; } .six-modal-open #js { -webkit-filter: blur(3px); filter: blur(3px); } .modal-slider { position: relative; width: 100%; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .modal-slider .images { display: none; } .modal-slider .prev, .modal-slider .next { position: absolute; top: 50%; cursor: pointer; background-color: #222; background-color: rgba(0,0,0,0.5); color: #fff; font-size: 1rem; height: 48px; line-height: 47px; margin: -20px 0 0 0; padding: 0; text-align: center; width: 48px; -webkit-transition: background .2s cubic-bezier(0.455,0.03,0.515,0.955); transition: background .2s cubic-bezier(0.455,0.03,0.515,0.955); } .modal-slider .prev:hover, .modal-slider .next:hover { background-color: rgba(0,0,0,0.75); } .modal-slider .prev { left: -10px; } .modal-slider .next { right: -10px; } .structured-output { background-color: rgb(248, 248, 248); padding: 1rem 1.5rem } .structured-output .structured-output-block { width: 100%; max-width: 100%; overflow: auto; } .structured-output code { background: none; display: block; width: 100%; border-radius: 0; } .structured-output .button-list { text-align: right; } .spacer-v { content: " "; display: block; } .spacer-v.spacer-v--author-mode:before { content: "Spacer Vertical"; } .spacer-v--s { padding-top: 0.3125rem; } .spacer-v--m { padding-top: 1.25rem; } .spacer-v--l { padding-top: 3.125rem; } .youtube__button-overlay { position: absolute; width: 100%; height: 100%; text-align: center; cursor: pointer; background-size: cover; background-position: center; } .youtube__play-button-path{ fill: rgb(33, 33, 33); fill-opacity: 0.8; -webkit-transition: .15s; transition: .15s; } .youtube__button-overlay:hover .youtube__play-button-path { fill: #f00; fill-opacity: 1; } .youtube__play-button { width: 68px; } .table-extended__downloadable-asset { font-family: FontAwesome; } .table-extended__downloadable-asset:before { content: '\f016'; } .table-extended__downloadable-asset[href$=".zip"]:before, .table-extended__downloadable-asset[href$=".ZIP"]:before, .table-extended__downloadable-asset[href$=".rar"]:before, .table-extended__downloadable-asset[href$=".RAR"]:before, .table-extended__downloadable-asset[href$=".tar"]:before, .table-extended__downloadable-asset[href$=".TAR"]:before, .table-extended__downloadable-asset[href$=".7z"]:before, .table-extended__downloadable-asset[href$=".7Z"]:before { content: '\f1c6'; } .table-extended__downloadable-asset[href$=".pdf"]:before, .table-extended__downloadable-asset[href$=".PDF"]:before { content: '\f1c1'; } .table-extended__downloadable-asset[href$=".doc"]:before, .table-extended__downloadable-asset[href$=".DOC"]:before, .table-extended__downloadable-asset[href$=".docx"]:before, .table-extended__downloadable-asset[href$=".DOCX"]:before { content: '\f1c2'; } .table-extended__downloadable-asset[href$=".xls"]:before, .table-extended__downloadable-asset[href$=".XLS"]:before, .table-extended__downloadable-asset[href$=".xlsx"]:before, .table-extended__downloadable-asset[href$=".XLSX"]:before, .table-extended__downloadable-asset[href$=".csv"]:before, .table-extended__downloadable-asset[href$=".CSV"]:before { content: '\f1c3'; } .table-extended__downloadable-asset[href$=".ppt"]:before, .table-extended__downloadable-asset[href$=".PPT"]:before, .table-extended__downloadable-asset[href$=".pptx"]:before, .table-extended__downloadable-asset[href$=".PPTX"]:before { content: '\f1c4'; } .table-extended__downloadable-asset[href$=".txt"]:before, .table-extended__downloadable-asset[href$=".TXT"]:before { content: '\f0f6'; } .table-extended__downloadable-asset[href$=".jar"]:before, .table-extended__downloadable-asset[href$=".JAR"]:before, .table-extended__downloadable-asset[href$=".xml"]:before, .table-extended__downloadable-asset[href$=".XML"]:before, .table-extended__downloadable-asset[href$=".xsd"]:before, .table-extended__downloadable-asset[href$=".XSD"]:before, .table-extended__downloadable-asset[href$=".edi"]:before, .table-extended__downloadable-asset[href$=".EDI"]:before { content: '\f1c9'; } .table-extended__downloadable-asset[href$=".jpg"]:before, .table-extended__downloadable-asset[href$=".JPG"]:before, .table-extended__downloadable-asset[href$=".jpeg"]:before, .table-extended__downloadable-asset[href$=".JPEG"]:before, .table-extended__downloadable-asset[href$=".png"]:before, .table-extended__downloadable-asset[href$=".PNG"]:before, .table-extended__downloadable-asset[href$=".gif"]:before, .table-extended__downloadable-asset[href$=".GIF"]:before, .table-extended__downloadable-asset[href$=".tif"]:before, .table-extended__downloadable-asset[href$=".TIF"]:before, .table-extended__downloadable-asset[href$=".tiff"]:before, .table-extended__downloadable-asset[href$=".TIFF"]:before { content: '\f1c5'; } .table-extended__downloadable-asset[href$=".mp3"]:before, .table-extended__downloadable-asset[href$=".MP3"]:before, .table-extended__downloadable-asset[href$=".wma"]:before, .table-extended__downloadable-asset[href$=".WMA"]:before, .table-extended__downloadable-asset[href$=".wav"]:before, .table-extended__downloadable-asset[href$=".WAV"]:before, .table-extended__downloadable-asset[href$=".ogg"]:before, .table-extended__downloadable-asset[href$=".OGG"]:before, .table-extended__downloadable-asset[href$=".flac"]:before, .table-extended__downloadable-asset[href$=".FLAC"]:before, .table-extended__downloadable-asset[href$=".aif"]:before, .table-extended__downloadable-asset[href$=".AIF"]:before, .table-extended__downloadable-asset[href$=".aifc"]:before, .table-extended__downloadable-asset[href$=".AIFC"]:before, .table-extended__downloadable-asset[href$=".aiff"]:before, .table-extended__downloadable-asset[href$=".AIFF"]:before, .table-extended__downloadable-asset[href$=".3gp"]:before, .table-extended__downloadable-asset[href$=".3GP"]:before { content: '\f1c7'; } .table-extended__downloadable-asset[href$=".webm"]:before, .table-extended__downloadable-asset[href$=".WEBM"]:before, .table-extended__downloadable-asset[href$=".mkv"]:before, .table-extended__downloadable-asset[href$=".MKV"]:before, .table-extended__downloadable-asset[href$=".vob"]:before, .table-extended__downloadable-asset[href$=".VOB"]:before, .table-extended__downloadable-asset[href$=".avi"]:before, .table-extended__downloadable-asset[href$=".AVI"]:before, .table-extended__downloadable-asset[href$=".wmv"]:before, .table-extended__downloadable-asset[href$=".WMV"]:before, .table-extended__downloadable-asset[href$=".mp4"]:before, .table-extended__downloadable-asset[href$=".MP4"]:before, .table-extended__downloadable-asset[href$=".mpg"]:before, .table-extended__downloadable-asset[href$=".MPG"]:before, .table-extended__downloadable-asset[href$=".mpeg"]:before, .table-extended__downloadable-asset[href$=".MPEG"]:before, .table-extended__downloadable-asset[href$=".mov"]:before, .table-extended__downloadable-asset[href$=".MOV"]:before { content: '\f1c8'; } .table-extended__downloadable-asset[href$=".rss"]:before, .table-extended__downloadable-asset[href$=".RSS"]:before { content: '\f09e'; } .menu-nav-overflow-content li { margin-bottom: 0; } .menu-nav-overflow-content li a.current-trail:after { content: ''; position: absolute; background: rgb(222, 57, 25); height: 21px; width: 3px; left: 1rem; top: 1.5rem; } .menu-nav-overflow { position: relative; right: 1rem; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; } .menu-nav-overflow-trigger { width: 32px; height: 32px; padding: 0; position: relative; background: transparent; border: 1px solid currentColor; -webkit-transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); color: rgb(113, 113, 113); display: none } .menu-nav-overflow-trigger:focus, .menu-nav-overflow-trigger:hover { color: rgb(57, 57, 57); background: transparent; } .menu-nav-overflow-trigger.contains-active .menu-nav-overflow-count { color: rgb(222, 57, 25); font-weight: 700; } .menu-nav-overflow-count { position: absolute; top: -9px; left: 22px; padding: 2px 6px; font-size: 0.625rem; background: rgb(255, 255, 255); } @media (min-width: 64em) { .inpage-nav-inner:before, .inpage-nav-inner:after { display: none; } .menu-nav-overflow-content { position: absolute; background: white; padding: 20px 30px; width: auto; min-width: 100px; right: 0; top: 40px; z-index: 1; box-shadow: -5px 0px 10px 0 rgba(0, 0, 0, 0.08), 10px 10px 20px 0 rgba(0, 0, 0, 0.05); border: 1px solid rgb(220, 220, 220); opacity: 0; visibility: hidden; -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: scale(.8) translateY(-50px); transform: scale(.8) translateY(-50px); -webkit-transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s .5s, -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s .5s, -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), transform .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s .5s; transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), transform .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s .5s, -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1) } .menu-nav-overflow-content.open { visibility: visible; opacity: 1; -webkit-transform: none; transform: none; -webkit-transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s 0s, -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s 0s, -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), transform .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s 0s; transition: opacity .5s cubic-bezier(0.19, 0.92, 0.27, 1), transform .5s cubic-bezier(0.19, 0.92, 0.27, 1), visibility 0s 0s, -webkit-transform .5s cubic-bezier(0.19, 0.92, 0.27, 1); } .menu-nav-overflow-content a { white-space: nowrap; } } @media print { #inpage-nav { display: none; } } /* containers */ .main { /* uses paddingtop instead of margin-top so children can define margin-top */ padding-top: calc(3.375rem + 3.75rem); /* TODO: Check the spacings if this can be done for the main and footer */ margin-bottom: 7rem; position: relative; /* for sticky navigation */ } @media print { .main > footer { display: none; } } /* Main Footer Parts: - Footer Search - Logo - Form Search - Footer Columns - 4-5 Columns with Link Lists in them. -
- Footer About - Contact Button - Footer Links - Footer Social */ /* General ------------------------------------------------------------ */ .footer { position: relative; padding: 2.5rem 0 1.25rem } .footer .container { position: relative; z-index: 2; } .footer .bg { z-index: 1; } .footer hr { border-color: #4e4e4e; } /* Explore Icon ------------------------------------------------------------ */ .footer .explore-icon { text-align: center; display: block; width: 100%; height: auto; padding: 2rem 0 0 0 } .footer .explore-icon a { height: 44px; display: inline-block; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; -webkit-transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); opacity: 0.65; padding-right: 0.75rem } .footer .explore-icon a:hover { opacity: 1; } .footer .explore-icon .text { font-weight: normal; color: rgb(255, 255, 255); margin-left: -5px; vertical-align: middle; } .footer .explore-icon .svg-icon { vertical-align: middle; } .footer .explore-icon .column_4 { text-align: center /* This is needed as reset because of added display: flex to the column */ } .footer .explore-icon .column_4 > a { align-self: center; } .footer-notice { text-align: center; } /* Social Icons ------------------------------------------------------------ */ .footer .social_connect ul { list-style: none; margin: 0; text-align: center; padding-bottom: 0.25rem } .footer .social_connect ul a { color: rgba(255, 255, 255, 0.6); font-size: 1.25rem } .footer .social_connect ul a:hover { color: rgba(255, 255, 255, 1); } .footer .social_connect ul li { display: inline-block; width: auto; margin-bottom: 0; vertical-align: middle } .footer .social_connect ul li a { padding: 0 8px; } .footer .social_connect ul { /* "Follow Us" Text */ } .footer .social_connect ul li:first-child { display: block; padding-top: 8px } .footer .social_connect ul li:first-child .description { display: block; margin-bottom: 8px; } /* Footer Links ------------------------------------------------------------ */ .footer .footer-links { list-style: none; margin: 0; text-align: center; padding: 1.5rem 0; -webkit-box-align: center; align-items: center } .footer .footer-links a { font-size: 0.75rem; color: rgba(255, 255, 255, 0.6); font-weight: normal; word-break: keep-all; display: block; line-height: 1rem; margin-top: 10px } .footer .footer-links a:hover { color: rgba(255, 255, 255, 1); } .footer .footer-links li { margin-bottom: 1.125rem; } @media (min-width: 48em) { .footer .footer-links { padding: 0; height: 2em; /* Fixes a bug in IE11, where hovering over the links in the footer causes a jump */ -webkit-box-pack: center; justify-content: center } .footer--with-columns .footer .footer-links { -webkit-box-pack: normal; justify-content: normal } .footer .footer-links li { display: inline-block; margin-bottom: 0 } .footer .footer-links li + li { margin-left: 1.25rem; } } @media (min-width: 30em) and (max-width: 63.999em) { .footer .footer-links { display: -webkit-box; display: flex; } } @media (max-width: 19.999em) { .footer .footer-links li { display: block; width: auto; padding-left: 0.5rem; padding-right: 0.5rem; } } @media (min-width: 20em) and (max-width: 47.999em) { .footer .footer-links { display: -webkit-box; display: flex; flex-wrap: wrap; -webkit-box-flex: 1; flex: 1 1 auto; -webkit-box-pack: center; justify-content: center; margin-left: auto; margin-right: auto; max-width: 40rem } .footer .footer-links li { padding-left: 0.5rem; padding-right: 0.5rem; } } /* Small Screens To Up (General) ------------------------------------------------------------ */ @media (min-width: 48em) { .footer .social_connect ul { text-align: right; direction: ltr; white-space: normal; padding: 0; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; flex-wrap: wrap; -webkit-box-pack: end; justify-content: flex-end } .footer .social_connect ul a { font-size: 1rem; } .footer .social_connect ul { /* "Follow Us" Text */ } .footer .social_connect ul li:first-child { margin-right: 10px; display: inline-block; } .footer .explore-icon { padding: 0; } .footer .column_last { -webkit-box-ordinal-group: 1; order: 0; } .footer .column_4 { flex-basis: 33.33333%; max-width: 33.33333%; text-align: inherit /* This is needed as reset because of added display: flex to the column */ } .footer .column_4 > a { align-self: flex-start; } } /* Small Screens Only (General) ------------------------------------------------------------ */ @media (min-width: 30em) and (max-width: 63.999em) { .footer .social_connect ul { white-space: nowrap; padding: 0 } .footer .social_connect ul li a { padding: 0 0.5rem; } .footer .column_6 { flex-basis: 100%; max-width: 100%; } .footer { /* Special behaviour if the grid shoud be smaller then the padding */ } .footer .btn { max-width: 100%; text-overflow: ellipsis; } } /* Footer Columns ------------------------------------------------------------ */ /* Section in footer with variable amount of columns with link lists in them */ .grid--footer-columns .paragraph_title { color: inherit; text-transform: uppercase; font-family: "Noto Sans", Helvetica, Arial, sans-serif; font-size: 0.75rem; color: #b8b8b8; } .grid--footer-columns a { font-size: 0.75rem; color: rgba(255, 255, 255, 1); font-weight: normal } .grid--footer-columns a:hover { color: rgba(255, 255, 255, 0.6); } .grid--footer-columns { /* CSS hide the linklist icons.*/ } .grid--footer-columns i { display: none; } .grid--footer-columns .fa-ul { padding-left: 0; margin-left: 0; } /* Large Screens only - Looks like a Link List */ @media (min-width: 64em) { .grid--footer-columns.grid--footer-columns { -webkit-box-pack: justify; justify-content: space-between; -webkit-box-flex: 1; flex: 1 1 auto; flex-wrap: nowrap; margin-bottom: 2.8rem } .grid--footer-columns.grid--footer-columns .paragraph_title { margin-bottom: 3em; } .grid--footer-columns.grid--footer-columns [class^='column'] { border-right: solid 1px #4e4e4e; -webkit-box-flex: 1; flex-grow: 1; flex-basis: auto; min-width: 12%; padding-left: 3%; padding-right: 3% } .grid--footer-columns.grid--footer-columns [class^='column']:first-child { padding-left: 1rem; } .grid--footer-columns.grid--footer-columns [class^='column']:last-child { border-right: 0; padding-right: 1rem; } } /* Small screens only - Works like an Expander */ @media (max-width: 63.999em) { .grid--footer-columns { padding-bottom: 20px } .grid--footer-columns.row { display: block; margin-left: 0; margin-right: 0; } .grid--footer-columns [class^='column'] { display: block; width: 100%; border: solid 1px #dadada; padding: 0; margin-bottom: -1px } .grid--footer-columns [class^='column']:last-child { margin-bottom: 0; } .grid--footer-columns .paragraph_title { text-transform: uppercase; font-family: "Noto Sans", Helvetica, Arial, sans-serif; border-bottom: solid 1px #555; padding: 12px 15px; margin: 0; position: relative; padding-right: 44px; cursor: pointer } .grid--footer-columns .paragraph_title::before, .grid--footer-columns .paragraph_title::after { position: absolute; content: ''; display: block; right: 16px; width: 9px; height: 1px; background: #dadada; top: 0; bottom: 0; margin: auto; } .grid--footer-columns .paragraph_title::after { -webkit-transform: rotate(90deg) scale(1); transform: rotate(90deg) scale(1); -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; } .grid--footer-columns .link-list { padding: 0 15px; max-height: 0; overflow: hidden; -webkit-transition: max-height 0.2s ease-in-out; transition: max-height 0.2s ease-in-out } .grid--footer-columns .link-list a { display: block; } .grid--footer-columns .link-list li:first-child { margin-top: 1em; } .grid--footer-columns .link-list.link-list.link-list li { margin-bottom: 1em; } .grid--footer-columns .is-open-mobile .link-list { max-height: 1000px; } .grid--footer-columns .is-open-mobile .paragraph_title::after { -webkit-transform: rotate(90deg) scale(0); transform: rotate(90deg) scale(0); } } /* Footer About ------------------------------------------------------------ */ @media (max-width: 63.999em) { .footer-about.footer-about { flex-wrap: wrap; padding-top: 5px } .footer-about.footer-about .column_4:last-child { width: 100%; display: block; max-width: none; } } @media (min-width: 48em) { .footer-about { -webkit-box-pack: justify; justify-content: space-between; margin-top: 36px; padding-bottom: 30px } .footer-about .column_4 { width: auto; max-width: none; flex-basis: auto; -webkit-box-flex: 0; flex-grow: 0; } } /* Footer Contact Button ------------------------------------------------------------ */ @media (max-width: 47.999em) { .footer:not(.footer--with-columns) .btn-secondary { align-self: center; max-width: 100%; } /* it fills the full width on smaller screens */ .footer--with-columns .btn-secondary { display: block; width: 100%; text-align: right; padding-left: 1rem } .footer--with-columns .btn-secondary .fa { height: 1em; float: left; position: relative; top: 4px; } } /* Footer Search ------------------------------------------------------------ */ .grid--footer-search { margin-top: 10px; margin-bottom: 0; } @media (min-width: 64em) { .grid--footer-search { margin-bottom: 55px; } } /* Footer Logo ------------------------------------------------------------ */ .grid--footer-search .image-block a { -webkit-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out } .grid--footer-search .image-block a:hover { opacity: 0.8; } .grid--footer-search .image-block img { display: inline-block; } @media (max-width: 63.999em) { .grid--footer-search .image-block { text-align: center; } } @media (min-width: 64em) { .grid--footer-search .column_3 { max-width: 166px; padding-top: 1rem; } } /* Footer Search Form ------------------------------------------------------------ */ .footer .search-form .search-input-wrapper { background: #666; color: rgb(255, 255, 255); display: -webkit-box; display: flex; height: var(-var(--footer-search-height)); position: relative; max-width: 798px; } .footer .search-form .search-input-wrapper .choices { -webkit-transition: all .3s; transition: all .3s; } .footer .search-form .search-input-wrapper .choices .choices__list { background-color: #4f4f4f; padding-right: 0; height: auto; } .footer .search-form .search-input-wrapper .choices .choices__list.is-active { border-bottom: 1px solid rgb(136, 136, 136);; border-left: 1px solid rgb(136, 136, 136); border-right: 1px solid rgb(136, 136, 136); } .footer .search-form .search-input-wrapper .choices > div { background-color: #666 } .footer .search-form .search-input-wrapper .choices > div input { color: #c6c6c6; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-weight: 400; font-size: 16px; } .footer .search-form .search-input-wrapper .choices > div input::-webkit-input-placeholder { color: rgba(255, 255, 255, 0.6); } .footer .search-form .search-input-wrapper .choices > div input::-moz-placeholder { color: rgba(255, 255, 255, 0.6); } .footer .search-form .search-input-wrapper .choices > div input:-ms-input-placeholder { color: rgba(255, 255, 255, 0.6); } .footer .search-form .search-input-wrapper .choices > div input::placeholder { color: rgba(255, 255, 255, 0.6); } .footer .search-form .search-input, .footer .search-form .search-input-wrapper .choices > div { border-color: transparent; color: inherit; font-weight: normal; font-size: 16px; padding-top: 0.5em; padding-bottom: 0.5em; height: 60px; border-right-width: 1px; border-right-style: solid; padding-right: 60px } .footer .search-form .search-input::-webkit-input-placeholder, .footer .search-form .search-input-wrapper .choices > div::-webkit-input-placeholder { color: rgba(255, 255, 255, 0.6); } .footer .search-form .search-input::-moz-placeholder, .footer .search-form .search-input-wrapper .choices > div::-moz-placeholder { color: rgba(255, 255, 255, 0.6); } .footer .search-form .search-input:-ms-input-placeholder, .footer .search-form .search-input-wrapper .choices > div:-ms-input-placeholder { color: rgba(255, 255, 255, 0.6); } .footer .search-form .search-input::placeholder, .footer .search-form .search-input-wrapper .choices > div::placeholder { color: rgba(255, 255, 255, 0.6); } .footer .search-form .search-input-wrapper .choices.is-focused > div { border: 1px solid #c6c6c6; } .footer .search-form .btn { background: transparent; position: absolute; width: 60px; height: 100%; display: block; top: 0; bottom: 0; right: 0 } .footer .search-form .btn .fa { position: absolute; top: 0; bottom: 0; right: 1px; margin: auto; text-align: center; height: 1em; width: 60px; } .footer .search-config { margin: 0; } @media (min-width: 80.125em) { .detail-page.with-service-bar footer .footer-teaser-wrapper > div.section > section { padding-right: 16px; } } @media (min-width: 64em) { .detail-page.with-service-bar footer .footer-teaser-wrapper > div.section > section { padding-right: 16px; } } /* PRINT Styles ------------------------------------------------------------ */ @media print { /* hides for print */ .footer { display: none; } } .nav-division-header { -webkit-box-flex: 0; flex: 0 auto } .nav-division-header ul { margin-bottom: 0; display: -webkit-box; display: flex; list-style-type: none; } .nav-division-header li { margin-bottom: 0; } .nav-division-header-back, .nav-division-header-explore, .nav-division-header-search { height: 4.0625rem; line-height: 4.0625rem; display: inline-block; } .nav-division-header-search { line-height: 3.8rem; } .nav-division-header-search .search-toggle-open { font-size: 0.8rem; } .nav-division-header-button span { line-height: 4.0625rem; } .nav-division-header-button { cursor: pointer } .nav-division-header-button span:first-child { padding-right: 0.4rem; } .nav-division-header-button .nav-division-header-icon { display: inline-block; position: relative; top: 2px } .nav-division-header-button .nav-division-header-icon span { width: 16px; height: 16px; display: block; padding: 0; margin: 0; } .nav-division-header-button .nav-division-header-icon svg { display: block; width: 100%; height: 100%; } .nav-division-header-button .nav-division-header-icon path { -webkit-transition: fill .2s; transition: fill .2s; fill: rgb(57, 57, 57); } .nav-division-header-button .nav-division-header-icon .nav-division-header-icon-close { position: absolute; left: 0; top: 0; } .menu-open .nav-division-header-button .nav-division-header-icon path { fill: rgb(222, 57, 25); } .explore-menu-open .nav-division-header-button .nav-division-header-icon path { fill: rgb(255, 255, 255); } .nav-division-header-icon-open, .menu-open .nav-division-header-icon-close { opacity: 1; visibility: visible; -webkit-transition: .2s .1s opacity, visibility 0s 0s; transition: .2s .1s opacity, visibility 0s 0s; } .menu-open .nav-division-header-icon-open, .nav-division-header-icon-close { opacity: 0; visibility: hidden; -webkit-transition: .2s 0s opacity, visibility 0s .2s; transition: .2s 0s opacity, visibility 0s .2s; } .nav-sub-wrapper .close-icon svg { fill: rgb(57, 57, 57); } /* General Division Nav */ .navbar-division { background-color: rgb(255, 255, 255); box-shadow: 0 8px 25px 0 rgba(0, 0, 0, 0.08), 0 -1px rgb(255, 255, 255); -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); position: fixed; top: 3.375rem; right: 0; bottom: auto; left: 0; z-index: 1030; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif } .navbar-division ul { -webkit-box-align: start; align-items: flex-start; align-content: flex-start; list-style: none; } .navbar-division > .container > .row { margin-left: -1rem; margin-right: -1rem; } .nav-division-header-back, .nav-division-header-button { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; } .navbar-division { /* TODO: remove? */ } .navbar-division.fixed { position: fixed; top: 3.375rem; } .navbar-division { /* TODO: remove? */ } .hide-navbar .navbar-division { -webkit-transform: translate3d(0, -var(--navbar-height-desktop), 0); transform: translate3d(0, -var(--navbar-height-desktop), 0) } .navbar-division a { font-weight: 400; } .navbar-division li > a { color: rgb(57, 57, 57); } .navbar-division li > a:hover { text-decoration: none; color: rgb(57, 57, 57); } .navbar-division li > a.nav-sub-toggle:hover { color: rgb(113, 113, 113); } .nav-sub-wrapper { visibility: hidden; } .nav-third-level { font-family: "Noto Sans", Helvetica, Arial, sans-serif; font-size: 0.875em; } .nav-division-header { display: block; margin-bottom: 0; } .nav-division a.current-trail span, .nav-division a.current span, /* SIX-4891: dummy overview link should be active too */ .nav-division .current + .active li:first-child span, .nav-division .current-trail > .nav-sub-toggle span { position: relative } .nav-division a.current-trail span:after, .nav-division a.current span:after, .nav-division .current + .active li:first-child span:after, .nav-division .current-trail > .nav-sub-toggle span:after { content: ""; position: absolute; display: block; left: 0; bottom: -0.1em; width: 100%; height: 1px; -webkit-transition: opacity .3s; transition: opacity .3s; background-color: rgb(222, 57, 25); } .nav-division-header-explore .explore-trigger { height: 4.0625rem; vertical-align: bottom; margin-bottom: 0; } .nav-division-header-explore, .nav-division-header-back { position: absolute; left: 0.8rem; } .nav-division-header-explore { left: 1rem; } .navbar-division .nav-division { overflow-y: hidden; } @media (max-width: 63.999em) { .main { padding-top: 0; } .navbar-division { height: 4.0625rem; box-shadow: none; } .nav-division-header li { font-size: 1.125em; } .explore-menu-open .nav-corporate-header { background: rgb(0, 44, 95) !important; color: rgb(255, 255, 255) } .explore-menu-open .nav-corporate-header .nav-division-header-back:before { border-color: inherit; } .explore-menu-open .nav-corporate-header .nav-division-header-icon:before, .explore-menu-open .nav-corporate-header .nav-division-header-icon:after { background: rgb(255, 255, 255); } .nav-division-header-back { cursor: pointer; visibility: hidden; opacity: 0; -webkit-transition: .2s 0s opacity, visibility 0s .2s; transition: .2s 0s opacity, visibility 0s .2s; padding-left: 20px } .nav-division-header-back:before { content: ""; position: absolute; width: 6px; height: 6px; top: 50%; margin-top: -3px; left: 8px; margin-left: -3px; -webkit-transform: rotate(45deg); transform: rotate(45deg); border: 1px solid rgb(222, 57, 25); border-width: 0 0 1px 1px; } .nav-division-header-search { visibility: visible; opacity: 1; position: relative; right: 0; -webkit-transition: .3s opacity, visibility 0s, right 0s .2s; transition: .3s opacity, visibility 0s, right 0s .2s; } .search-open .nav-division-header-search { right: -79px; } .nav-division-header-button { opacity: 1; visibility: visible; -webkit-transition: opacity .3s .2s, visibility 0s 0s; transition: opacity .3s .2s, visibility 0s 0s; } .search-open .nav-division-header-button, .search-open .nav-primary-mobile-menu-button { opacity: 0; visibility: hidden; -webkit-transition: opacity .3s , visibility 0s .3s; transition: opacity .3s , visibility 0s .3s } .search-open .nav-division-header-button .nav-division-header-icon-open, .search-open .nav-primary-mobile-menu-button .nav-division-header-icon-open { visibility: inherit; } .menu-open .nav-division-header-search { visibility: hidden; opacity: 0; -webkit-transition: .2s opacity, visibility 0s .2s; transition: .2s opacity, visibility 0s .2s; } .menu-open .nav-division-header-back-on .nav-division-header-back { visibility: visible; opacity: 1; -webkit-transition: .2s .2s opacity, visibility 0s; transition: .2s .2s opacity, visibility 0s; } .menu-open .nav-division-header-back-on .nav-division-header-explore, .nav-division-header-explore { visibility: hidden; opacity: 0; -webkit-transition: .2s opacity, visibility 0s .2s; transition: .2s opacity, visibility 0s .2s; } .menu-open .nav-division-header-explore { visibility: visible; opacity: 1; -webkit-transition: .2s .1s opacity, visibility 0s; transition: .2s .1s opacity, visibility 0s; } .navbar-division { position: static; top: 0; -webkit-transform: none; transform: none } .navbar-division.fixed { position: static; top: 0; -webkit-transform: none; transform: none; } .hide-navbar .navbar-division { -webkit-transform: none; transform: none; } .menu-open > div > header { height: 100vh; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; } /* SIX-4853: fixes last item not accessible on mobile */ .menu-open .navbar-division > .container { background: #fff; max-height: 100vh; padding-left: 0; padding-right: 0; position: relative; z-index: 980; } /* SIX-4853: fixes last item not accessible on mobile */ .navbar-division > .container > .row { margin-left: 0; margin-right: 0; } .nav-division { /* SIX-4853: fixes last item not accessible on mobile */ border-bottom: 2rem solid #fff; position: relative; top: 0; right: 0; left: 0; width: 100%; opacity: 0; visibility: hidden; z-index: 999; margin-bottom: 0; background: #fff; -webkit-transition: opacity .2s 0s, visibility 0s .2s; transition: opacity .2s 0s, visibility 0s .2s } .nav-division > li:first-child > a, .nav-division .nav-second-level > li:first-child > a { padding-top: 1.8rem; } .nav-division > li:last-child > a, .nav-division .nav-second-level > li:last-child > a { padding-bottom: 1.8rem; } /* SIX-4853: fixes last item not accessible on mobile */ .nav.nav-second-level { background-color: #fff; } /* SIX-4853: fixes last item not accessible on mobile */ .nav-sub-overview, .nav-division > li:first-child { margin-top: 4.0625rem; } /* SIX-4853 */ .menu-open .nav-division { visibility: visible; opacity: 1; -webkit-transition: opacity .3s 0s, visibility 0s 0s; transition: opacity .3s 0s, visibility 0s 0s; } .nav-corporate-header { color: rgb(57, 57, 57); } header .navbar-corporate .nav-corporate-header { background: rgb(255, 255, 255); box-shadow: 0 8px 25px 0 rgba(0, 0, 0, .08) } header .navbar-corporate .nav-corporate-header .container { opacity: 1; } .nav-division-header, .hide-navbar .navbar-corporate .nav-corporate-header, .navbar-corporate .nav-corporate-header { -webkit-transform: none; transform: none; -webkit-transition: background .3s, color .3s, -webkit-transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: background .3s, color .3s, -webkit-transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94), background .3s, color .3s; transition: transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94), background .3s, color .3s, -webkit-transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94); } .main-logo { -webkit-transition: opacity .3s .1s, visibility 0s 0s; transition: opacity .3s .1s, visibility 0s 0s; visibility: visible; opacity: 1; } .menu-open .main-logo { -webkit-transition: opacity .3s 0s, visibility 0s .3s; transition: opacity .3s 0s, visibility 0s .3s; visibility: hidden; opacity: 0; } .nav-division > li { opacity: 0; -webkit-transition: opacity .3s; transition: opacity .3s; -webkit-transition-delay: 0; transition-delay: 0; } .nav-division > li:nth-child(1) { -webkit-transition-delay: .45s; transition-delay: .45s } .nav-division > li:nth-child(2) { -webkit-transition-delay: .4s; transition-delay: .4s } .nav-division > li:nth-child(3) { -webkit-transition-delay: .35s; transition-delay: .35s } .nav-division > li:nth-child(4) { -webkit-transition-delay: .3s; transition-delay: .3s } .nav-division > li:nth-child(5) { -webkit-transition-delay: .25s; transition-delay: .25s } .nav-division > li:nth-child(6) { -webkit-transition-delay: .2s; transition-delay: .2s } .nav-division > li:nth-child(7) { -webkit-transition-delay: .15s; transition-delay: .15s } .nav-division > li:nth-child(8) { -webkit-transition-delay: .1s; transition-delay: .1s } .menu-open .nav-division > li:nth-child(1) { -webkit-transition-delay: .1s; transition-delay: .1s } .menu-open .nav-division > li:nth-child(2) { -webkit-transition-delay: .15s; transition-delay: .15s } .menu-open .nav-division > li:nth-child(3) { -webkit-transition-delay: .2s; transition-delay: .2s } .menu-open .nav-division > li:nth-child(4) { -webkit-transition-delay: .25s; transition-delay: .25s } .menu-open .nav-division > li:nth-child(5) { -webkit-transition-delay: .3s; transition-delay: .3s } .menu-open .nav-division > li:nth-child(6) { -webkit-transition-delay: .35s; transition-delay: .35s } .menu-open .nav-division > li:nth-child(7) { -webkit-transition-delay: .4s; transition-delay: .4s } .menu-open .nav-division > li:nth-child(8) { -webkit-transition-delay: .45s; transition-delay: .45s } .menu-open .nav-division > li { opacity: 1; } .nav-division .nav-meta-mobile-item, .nav-division > li > a { opacity: 1; -webkit-transform: none; transform: none; -webkit-transition: opacity .3s .3s, visibility 0s .3s, -webkit-transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) .3s; transition: opacity .3s .3s, visibility 0s .3s, -webkit-transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) .3s; transition: opacity .3s .3s, transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) .3s, visibility 0s .3s; transition: opacity .3s .3s, transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) .3s, visibility 0s .3s, -webkit-transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) .3s; } .nav-division.collapse .nav-meta-mobile-item, .nav-division.collapse > li > a { opacity: 0; -webkit-transform: translateX(-20px); transform: translateX(-20px); visibility: hidden; -webkit-transition: opacity .3s 0s, visibility 0s .3s, -webkit-transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s; transition: opacity .3s 0s, visibility 0s .3s, -webkit-transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s; transition: opacity .3s 0s, transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, visibility 0s .3s; transition: opacity .3s 0s, transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, visibility 0s .3s, -webkit-transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s; } .nav-second-level > li { opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px); -webkit-transition: opacity .3s 0s, visibility 0s .3s, -webkit-transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s; transition: opacity .3s 0s, visibility 0s .3s, -webkit-transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s; transition: opacity .3s 0s, transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, visibility 0s .3s; transition: opacity .3s 0s, transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s, visibility 0s .3s, -webkit-transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s; } .nav-sub-overview { opacity: 0; -webkit-transition: opacity .3s .2s; transition: opacity .3s .2s; } .nav-sub-wrapper.active .nav-second-level > li { opacity: 1; -webkit-transform: none; transform: none; -webkit-transition: opacity .3s .3s, visibility 0s .3s, -webkit-transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) .3s; transition: opacity .3s .3s, visibility 0s .3s, -webkit-transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) .3s; transition: opacity .3s .3s, transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) .3s, visibility 0s .3s; transition: opacity .3s .3s, transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) .3s, visibility 0s .3s, -webkit-transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) .3s; } .nav-sub-wrapper.active .nav-sub-overview { opacity: 1; } .nav-division li { margin-bottom: 0; width: 100%; max-width: 48em; margin-left: auto; margin-right: auto; } .navbar-division .login-trigger > a, .navbar-division .explore-trigger > a, .navbar-division li > a { padding: 1rem; display: block; font-size: 1.125em; visibility: inherit; color: rgb(78, 78, 78); } .nav-tab-toggle > span, .nav-sub-toggle > span { position: relative } .nav-tab-toggle > span:before, .nav-sub-toggle > span:before { content: ""; position: absolute; width: 6px; height: 6px; top: 50%; margin-top: -2px; right: -12px; margin-left: -3px; -webkit-transform: rotate(45deg); transform: rotate(45deg); border: 1px solid rgb(113, 113, 113); border-width: 1px 1px 0 0; } .nav-tab-toggle:only-child span, .nav-sub-toggle:only-child span { margin-left: 0 } .nav-tab-toggle:only-child span:before, .nav-sub-toggle:only-child span:before { display: none; } .active > a.current-trail span:after { opacity: 0; } /* Level 2 */ .nav-sub-wrapper { /* SIX-4853 */ display: none; position: absolute; top: 0; left: 0; width: 100%; } /* SIX-4853: fixes last item not accessible on mobile */ .login-inner, .language-inner { overflow-y: auto; max-height: calc(100vh - 65px); padding-bottom: 4rem; } .nav-sub-wrapper.active { /* SIX-4853 */ display: block; visibility: visible; } .nav-second-level.collapse > li > a { opacity: .2; -webkit-transition: opacity .3s; transition: opacity .3s; } .nav-second-level.collapse > li.active > a { opacity: 1; } .nav-third-level { -webkit-transition: height .3s, opacity .2s; transition: height .3s, opacity .2s; opacity: 0; height: 0; overflow: hidden } .nav-third-level li { max-width: none; padding-left: 1rem; } .nav-sub-overview { padding: 2rem 1rem; text-align: center; } .nav-sub-overview-copy { display: none; } .nav-sub-overview-title { display: block; font-size: 1.250em; margin-bottom: 1em; } .nav-second-level > li:before { top: 1.25rem; right: auto; left: 1rem; font-size: 0.875em; } .nav-second-level > li:first-child:before { top: 2.05rem; } /* Level 3 */ .nav-third-level.active { opacity: 1; height: auto; } .nav-third-level a { font-size: 0.875rem; } .nav-second-level.collapse > li { opacity: .2; -webkit-transition: opacity .3s; transition: opacity .3s } .nav-second-level.collapse > li.active { opacity: 1; } } .nav-sub-overview-title { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-weight: 700; } .nav-division .nav-meta-mobile { max-width: none; margin-top: 10px; margin-bottom: 30px; } .nav-meta-mobile-item { border-top: 1px solid rgb(220, 220, 220); } .nav-meta-mobile-item-inner { width: 100%; max-width: 48em; margin-left: auto; margin-right: auto; } @media (min-width: 64em) { .nav-division .nav-meta-mobile { display: none; } .navbar-division { height: 3.75rem; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition: -webkit-transform 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: -webkit-transform 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94); } .nav-division-header { display: none; } .search-wrapper { height: 3.75rem; display: block } .search-wrapper .search-icon { height: 3.75rem; line-height: 3.75rem; } .search-wrapper a { display: block; text-align: right; padding-right: 1.3rem; width: 3.6rem; height: 3.75rem; line-height: 3.75rem; color: rgb(57, 57, 57); } .nav-division { display: block; position: inherit; margin-bottom: 0; width: auto; padding-left: 0; height: 3.75rem; -webkit-box-flex: 1; flex: 1 } .nav-division > li { float: left; display: block; margin-bottom: 0 } .nav-division > li > a { display: block; padding: 0 1em; } .nav-division { /* SIX-5643: firstlevel should be bold */ } .nav-division .firstlevel > a { font-weight: 700; } .nav-division.nav-visible > li > a { color: gray; /* TODO: gray is correct? */ } .nav-division li.hover-active > a { color: rgb(57, 57, 57); } .nav-division .nav-sub-wrapper { display: -webkit-box; display: flex; -webkit-box-align: stretch; align-items: stretch; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; min-height: 100%; max-height: calc(100vh - 114px); visibility: hidden; position: absolute; top: 100%; overflow-x: hidden; overflow-y: auto; left: 0; right: 0; background: white; opacity: 0; -webkit-transition: opacity .2s ease-out, visibility 0s .2s; transition: opacity .2s ease-out, visibility 0s .2s; box-shadow: inset 0 8px 25px 0 rgba(0, 0, 0, 0.08), 0 8px 25px 0 rgba(0, 0, 0, 0.08); } .nav-visible .nav-sub-wrapper { opacity: 1; -webkit-transition: opacity .2s ease-out, visibility 0s 0s; transition: opacity .2s ease-out, visibility 0s 0s; } .hover-active .nav-sub-wrapper { visibility: visible; } .nav-sub-overview { box-shadow: inset 0 8px 25px 0 rgba(0, 0, 0, 0.08); height: auto; min-height: 100%; } .nav-sub-overview-inner { float: right; width: 312px; padding: 2.3rem 2rem 2.5rem 16px; } .nav-sub-overview-title { font-size: 1.125em; margin-bottom: 1rem; display: block; } .nav-sub-overview-copy { margin-bottom: 2rem; line-height: 1.45; } .nav-second-level { padding: 2.5rem .5rem 2rem 4rem; min-height: 28.25rem; max-width: 688px } .nav-second-level a:hover { color: rgb(73, 151, 183); } .nav-second-level > li { display: block; width: 100%; margin-bottom: 1rem } .nav-second-level > li:before { top: 0.15rem; left: auto; right: 100%; font-size: 0.750em; } .nav-second-level > li > a.current-trail span:after { opacity: 0; } .nav-division .current-trail > .nav-sub-toggle span:after { opacity: 0; } .nav-third-level { margin-left: -1rem; margin-right: -1rem; height: auto !important; opacity: 1 !important } .nav-third-level > li { margin-bottom: 0.1rem; position: relative; float: left } .nav-third-level > li:after { content: ""; position: absolute; background: #cacaca; height: 20px; width: 1px; margin-left: -1px; left: 0; top: 6px; } .nav-third-level > li:first-child { display: none; /* hide overview Link on Desktop */ } .nav-third-level { margin-top: 0.1rem; margin-bottom: 0.8rem; overflow: hidden; } .nav-third-level a { display: inline-block; padding: 0.4rem 1rem; } .nav-division > li > a { height: 3.75rem; line-height: 3.75rem; white-space: nowrap; } .nav-third-level li { display: inline-block } .nav-third-level li a { color: rgb(113, 113, 113); } .nav-sub-overview { -webkit-box-flex: 0; flex-grow: 0; flex-shrink: 0; flex-basis: calc(50% - 200px); /* (1024 / 2) - 312 */ } } @media (min-width: 80.125em) { .nav-sub-overview { flex-basis: calc(50% - 328px); /* (1250 / 2) - (312 + 16) */ } .nav-second-level { max-width: 950px; } } @media print { .nav-division-header, .navbar-division { display: none; } .navbar-division, header .navbar-corporate .nav-corporate-header { box-shadow: none; } } /** * CSS definitions for the fullpage primary navigation */ .nav-primary { background-color: rgb(255, 255, 255); font-family: "Noto Sans", Helvetica, Arial, sans-serif; position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1060 } .nav-primary .container { height: 100%; } .nav-primary { /* make sure layout wont break if entering text that is too long. */ } .nav-primary .row { flex-wrap: nowrap; } .nav-primary { /* SIX-840 disabled styles for _nav-primary-simple layout, seems not to be needed anymore? */ /* Hack because of simplified grid for SIX */ /* & .column_4 { flex-basis: 100%; max-width: 100%; position: relative; display: block; } */ } .nav-primary-header { text-align: right; padding-top: 8px; padding-bottom: 20px } .nav-primary-header .btn-close { width: 40px; height: 40px; padding: 0; text-align: center; z-index: 1; } .nav-primary-header .close-icon { padding: 0; line-height: 42px; display: block } .nav-primary-header .close-icon svg { display: inline-block; } .nav-primary--stage-one .nav-primary-header { padding-bottom: 0; margin-bottom: -14px } .nav-primary-content { padding-bottom: 30px } .nav-primary-content .column-level-1-inner { height: 100%; } .nav-primary-content { /* SIX-840 added .column_6 to make stage one layout possible */ } .nav-primary-content .column_6 .column-level-1 { width: 20.5%; flex-basis: 20.5%; max-width: 20.5%; } .nav-primary-content { /* SIX-840 added .column_6 to make stage one layout possible */ } .nav-primary-content .column_6 .column-level-1-first { -webkit-box-flex: 1; flex-grow: 1; width: auto; flex-basis: auto; max-width: 45%; } .nav-primary-content .column-level-1:last-child .column-level-1-inner { border-right: 0; } .nav-primary-content a { color: inherit; font-family: inherit; font-weight: inherit; font-size: inherit; display: block; padding: 0 0 0; line-height: 1.3em; } .nav-primary-content .title { position: relative; } .nav-primary-content .title-mainlist { color: rgb(184, 184, 184); text-transform: uppercase; min-height: 70px; font-size: 0.75rem; font-weight: bold; font-family: "Noto Serif", Georgia, "Times New Roman", Times, serif; line-height: 1.3em } .nav-primary-content .title-mainlist a.main-logo { display: inline-block; } .nav-primary--stage-one .nav-primary-content .title-mainlist { color: rgb(222, 57, 25); font-family: inherit } .nav-primary-content .title-sublist { text-transform: none; font-weight: bold; margin-bottom: 17px; font-size: 0.875rem; color: rgb(78, 78, 78) } .nav-primary-content .title-sublist a:hover { color: rgb(73, 151, 183); } .nav-primary-content ul { clear: both; color: rgb(78, 78, 78); content: ''; display: table; list-style: none; margin: 0 0 52px 0 } .nav-primary-content ul a:hover { color: rgb(73, 151, 183); } .nav-primary-content ul:last-child { margin-bottom: 0; } .nav-primary-content .list-default { font-size: 0.75rem; padding-right: 7px } .nav-primary-content .list-default li { margin-bottom: 19px } .nav-primary-content .list-default li:last-child { margin-bottom: 0; } .nav-primary-content .list-bold { font-weight: bold; font-size: 0.875rem } .nav-primary-content .list-bold li { margin: 0 0 16px } .nav-primary-content .list-bold li:last-child { margin-bottom: 0; } .nav-primary-content .link-contact { font-weight: bold; font-size: 0.875rem; color: rgb(78, 78, 78); margin-top: 51px; } .nav-primary-content { /* link active state - underline */ } .nav-primary-content .active .title { position: relative } .nav-primary-content .active .title:before { content: ''; position: absolute; display: block; margin-top: 0.35rem; left: 0; bottom: -3px; width: 100%; height: 1px; background-color: rgb(222, 57, 25); } .nav-primary--stage-one .nav-primary-content .fa { margin-bottom: 0.5em; color: rgb(173, 163, 152); } .nav-primary-content-list-about { /* fix horizonal alignments with other lists, because it has no title. */ } .nav-primary-content-list-about ul { padding-top: 1px; } .nav-primary--stage-one .nav-primary-content-list-about { /* The colored background on the right side of the desktop nav */ } .nav-primary--stage-one .nav-primary-content-list-about::before { content: ''; display: block; height: 100vh; width: 100%; position: fixed; margin-left: -40px; top: 0; bottom: 0; background-color: rgb(248, 248, 248); z-index: -1; } .nav-primary--stage-one .nav-primary-content-list-about .title-mainlist { /* compensate that there is no icon on this column */ min-height: 118px; } .nav-primary--stage-one .nav-primary-content-list-about .svg-icon { width: auto; height: 16px; } .nav-primary--stage-one .nav-primary-content-list-about .column-level-1-inner { padding-left: 15%; } @media (min-width: 80.125em) { .nav-primary-content .column-level-1-inner { padding-left: 17px; } .nav-primary-content .column-level-1-first { max-width: none; } .nav-primary-content { /* hover state for titles and list items */ } .nav-primary-content a .title:after { content: ''; background-image: url('assets/icons/arrow-right-alt.svg'); position: absolute; top: 3px; right: -32px; width: 16px; height: 18px; background-repeat: no-repeat; /* TODO: see below */ opacity: 1; background-position: -20px 0; background-size: 16px; /* TODO: opacity 0 or 1, TODO: sort alphabetically */ opacity: 0; /* fix a small 1px skip when animating */ -webkit-backface-visibility: hidden; -webkit-transform: translateZ(0) scale(1, 1); -webkit-transition: background-position 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: background-position 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); } .nav-primary-content a:hover .title:after { opacity: 1; background-position: 0 0; } .nav-primary-content { /* Bigger font size for large screens */ } .nav-primary-content .list-bold, .nav-primary-content .link-contact, .nav-primary-content .title-sublist { font-size: 1rem } .nav-primary-content .list-bold .title:after, .nav-primary-content .link-contact .title:after, .nav-primary-content .title-sublist .title:after { top: 5px; } .nav-primary-content .title-mainlist { font-size: 0.875rem; } .nav-primary-content .list-default { font-size: 0.875rem } .nav-primary-content .list-default li { margin-bottom: 18px; } .nav-primary-content .list-default .title:after { top: 4px; } } /* Open and Closed States - Nav Primary Desktop ------------------------------------------------------------ */ .nav-primary { display: none } .is-open-nav-primary .nav-primary { display: block } @media (max-width: 63.999em) { .nav-primary { display: none !important; } } /* ---------------------------------------------- Open Menu Button ---------------------------------------------- */ /* visible in header of site on desktop dimensions. */ .nav-primary-menu-button.btn { height: 40px; line-height: 40px; padding: 0 15px; } .nav-primary-menu-button svg { display: block; width: 100%; height: 100%; } .nav-primary-menu-button path { fill: rgb(255, 255, 255); } .nav-primary-menu-button .icon { display: inline-block; width: 16px; height: 16px; vertical-align: middle; margin-left: 6px; margin-top: -3px; } .nav-primary-menu-button.btn.btn:hover { color: rgb(255, 255, 255); } /** * CSS definitions for the primary navigation on Mobile. */ /* ---------------------------------------------- Common Styling - Primary Nav and Subnav ---------------------------------------------- */ .nav-primary-mobile { background: rgb(255, 255, 255); position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1060 } .nav-primary-mobile .nav-primary-mobile-inner { position: relative; height: calc(100vh); } .nav-primary-mobile ul { list-style: none; } .nav-primary-mobile li { margin: 0; } .nav-primary-mobile .btn-close { display: inline-block; color: rgb(78, 78, 78); height: 4.0625rem; line-height: 4.0625rem; white-space: nowrap; font-size: 1.125rem; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; } .nav-primary-mobile .btn-close-text { vertical-align: middle; display: inline-block; padding-right: 0.4rem; font-weight: 400; position: relative; top: -2px; } .nav-primary-mobile .btn-close-icon { display: inline-block; width: 16px; height: 16px; vertical-align: middle } .nav-primary-mobile .btn-close-icon svg { fill: rgb(222, 57, 25); display: block; } .nav-primary-mobile .btn-back { display: inline-block; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; cursor: pointer; color: rgb(78, 78, 78); font-size: 1.125rem; font-weight: 400; opacity: 0; -webkit-transition: 0.4s opacity; transition: 0.4s opacity; height: 4.0625rem; line-height: 4.0625rem; padding-left: 20px; position: relative } .nav-primary-mobile .btn-back:before { content: ''; position: absolute; width: 6px; height: 6px; top: 50%; margin-top: -3px; left: 8px; margin-left: -3px; -webkit-transform: rotate(45deg); transform: rotate(45deg); border: 1px solid rgb(222, 57, 25); border-width: 0 0 1px 1px; } .nav-primary-mobile .nav-primary-mobile-content, .nav-primary-mobile .subnav-modal-content { overflow-y: auto; max-height: calc(100vh - 65px); padding-bottom: 4rem } .nav-primary-mobile .nav-primary-mobile-content .container, .nav-primary-mobile .subnav-modal-content .container { padding: 0; } .nav-primary-mobile .nav-primary-mobile-content, .nav-primary-mobile .subnav-modal-content { /* Underline for items that are the active page. Add .active to
  • */ } .nav-primary-mobile .nav-primary-mobile-content .active > a .title, .nav-primary-mobile .subnav-modal-content .active > a .title { position: relative } .nav-primary-mobile .nav-primary-mobile-content .active > a .title:before, .nav-primary-mobile .subnav-modal-content .active > a .title:before { content: ''; position: absolute; display: block; left: 0; bottom: -0.2em; width: 100%; height: 1px; -webkit-transition: opacity 0.3s; transition: opacity 0.3s; background-color: rgb(222, 57, 25); } .nav-primary-mobile-header { background: rgb(255, 255, 255); box-shadow: 0 8px 25px 0 rgba(0, 0, 0, 0.08); height: 4.0625rem; text-align: right } .nav-primary-mobile-header .container { display: -webkit-box; display: flex } .nav-primary-mobile-header .container .main-logo { -webkit-box-flex: 1; flex-grow: 1; padding: 1.3rem 0 0 0; text-align: left } .nav-primary-mobile-header .container .main-logo img { max-height: 24px; } .nav-primary-mobile-content .nav-meta-mobile .fa { vertical-align: baseline; } .nav-primary-mobile-content .nav-meta-mobile .language-label, .nav-primary-mobile-content .nav-meta-mobile .login-trigger-label { margin-left: .6rem; } .nav-primary-mobile-content ul.breadcrumbs { display: none; } .nav-primary-mobile-content .nav-level-1, .nav-primary-mobile-subnav-modal .nav-level-3 { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif } .nav-primary-mobile-content .nav-level-1 li, .nav-primary-mobile-subnav-modal .nav-level-3 li { color: rgb(78, 78, 78); } .nav-primary-mobile-content .nav-level-1 a, .nav-primary-mobile-subnav-modal .nav-level-3 a { padding: 1rem; display: block; font-size: 1.125em; font-family: inherit; font-weight: inherit; color: inherit; } .nav-primary-mobile-content .nav-level-1 .has-subnav > a .title, .nav-primary-mobile-subnav-modal .nav-level-3 .has-subnav > a .title { position: relative } .nav-primary-mobile-content .nav-level-1 .has-subnav > a .title:after, .nav-primary-mobile-subnav-modal .nav-level-3 .has-subnav > a .title:after { content: ''; position: absolute; width: 6px; height: 6px; top: 50%; margin-top: -2px; right: -12px; margin-left: -3px; -webkit-transform: rotate(45deg); transform: rotate(45deg); border: 1px solid rgb(113, 113, 113); border-width: 1px 1px 0 0; -webkit-transition: -webkit-transform 0.1s; transition: -webkit-transform 0.1s; transition: transform 0.1s; transition: transform 0.1s, -webkit-transform 0.1s; } .nav-primary-mobile-content .nav-level-1 li.has-subnav.nav-primary-mobile__root-element > a > .title:after, .nav-primary-mobile-subnav-modal .nav-level-3 li.has-subnav.nav-primary-mobile__root-element > a > .title:after { border: none; } .nav-primary-mobile-content .nav-level-1, .nav-primary-mobile-subnav-modal .nav-level-3 { /* Open and Closed States - Levels 2 & 4 -- Accordion Navs ------------------------------------------------------------ */ } .nav-primary-mobile-content .nav-level-1 > .has-subnav > a .title:after, .nav-primary-mobile-subnav-modal .nav-level-3 > .has-subnav > a .title:after { -webkit-transform: rotate(135deg); transform: rotate(135deg); } .nav-primary-mobile-content .nav-level-1 .is-open > a .title:after, .nav-primary-mobile-subnav-modal .nav-level-3 .is-open > a .title:after { -webkit-transform: rotate(-43deg); transform: rotate(-43deg); } .nav-primary-mobile-content .nav-level-1.has-open-child > li, .nav-primary-mobile-subnav-modal .nav-level-3.has-open-child > li { color: rgb(149, 149, 149); } .nav-primary-mobile-content .nav-level-1.has-open-child .is-open, .nav-primary-mobile-subnav-modal .nav-level-3.has-open-child .is-open { color: rgb(78, 78, 78); } .nav-primary-mobile-content .nav-level-1 .nav-level-2, .nav-primary-mobile-content .nav-level-1 .nav-level-4, .nav-primary-mobile-subnav-modal .nav-level-3 .nav-level-2, .nav-primary-mobile-subnav-modal .nav-level-3 .nav-level-4 { opacity: 0; max-height: 0; -webkit-transition: all 0.3s; transition: all 0.3s; overflow: hidden } .nav-primary-mobile-content .nav-level-1 .nav-level-2 li, .nav-primary-mobile-content .nav-level-1 .nav-level-4 li, .nav-primary-mobile-subnav-modal .nav-level-3 .nav-level-2 li, .nav-primary-mobile-subnav-modal .nav-level-3 .nav-level-4 li { padding-left: 1rem; } .nav-primary-mobile-content .nav-level-1 .nav-level-2 .nav-subnav, .nav-primary-mobile-subnav-modal .nav-level-3 .nav-level-2 .nav-subnav { display: none; } .nav-primary-mobile-content .nav-level-1 .always-open > .nav-subnav, .nav-primary-mobile-content .nav-level-1 .is-open > .nav-subnav, .nav-primary-mobile-subnav-modal .nav-level-3 .always-open > .nav-subnav, .nav-primary-mobile-subnav-modal .nav-level-3 .is-open > .nav-subnav { opacity: 1; max-height: 1000px; } /* Open and Closed States - Nav Primary Mobile ------------------------------------------------------------ */ .nav-primary-mobile { max-height: 1px; overflow: hidden; visibility: hidden } .nav-primary-mobile .btn-close-icon { opacity: 0; -webkit-transition: opacity 0.4s; transition: opacity 0.4s; } @media (max-width: 63.999em) { .is-open-nav-primary .nav-primary-mobile { max-height: none; visibility: visible } .is-open-nav-primary .nav-primary-mobile .btn-close-icon { opacity: 1; } } /* ---------------------------------------------- Language and Login ---------------------------------------------- */ .nav-primary-mobile-account { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; } .nav-primary-mobile-item, .nav-primary-mobile-account a { padding: 1rem; display: block; font-size: 1.125em; font-family: inherit; font-weight: inherit; color: rgb(78, 78, 78); } .nav-primary-mobile-item .nav-meta-mobile-item-label { color: rgb(149, 149, 149); } .nav-primary-mobile-account-info { margin-left: 1.938rem } .nav-primary-mobile-account-info > span { font-size: 0.8em; line-height: 1.6; display: inline-block; color: rgb(149, 149, 149); } .nav-primary-mobile-account-info ul { margin-top: .7em } .nav-primary-mobile-account-info ul a { padding: 0.2em 0; font-size: 0.8em; } /* ---------------------------------------------- SIX RED Menu ---------------------------------------------- */ .nav-mobile-six-red-menu { border-top: 1px solid rgb(220, 220, 220); margin-bottom: 0 } .nav-mobile-six-red-menu .nav-level-2 > li { padding-left: 0 !important; } .nav-mobile-six-red-side-menu > li.active a span:before { content: none !important; } /* ---------------------------------------------- Subnav Modal ---------------------------------------------- */ /* when you navigate to a subnav, this appears */ .nav-primary-mobile-subnav-modal { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgb(255, 255, 255) } .nav-primary-mobile-subnav-modal .subnav-modal-header { height: 4.0625rem; box-shadow: 0 8px 25px 0 rgba(0, 0, 0, 0.08); } .nav-primary-mobile-subnav-modal .btn-close { float: right; } .nav-primary-mobile-subnav-modal .subnav-modal-content-overview { background: rgb(222, 57, 25); color: rgb(255, 255, 255); padding: 2rem 1rem; text-align: center; opacity: 0; -webkit-transition: opacity 0.3s; transition: opacity 0.3s; } .nav-primary-mobile-subnav-modal .subnav-modal-title { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; display: block; font-size: 1.25em; margin-bottom: 1em; font-weight: 700; } /* Open and Closed States - Subnav modal ------------------------------------------------------------ */ .nav-primary-mobile-subnav-modal { height: 1px; overflow: hidden } .is-subnav-open .nav-primary-mobile-subnav-modal { height: auto } .is-subnav-open .nav-primary-mobile-subnav-modal .subnav-modal-content-overview { opacity: 1; } .is-subnav-open .nav-primary-mobile-subnav-modal .btn-back { opacity: 1; } /* Open and Closed States - Language and Login Subnavs ------------------------------------------------------------ */ /* compatible with previous functionality. */ .is-open-nav-primary.language-menu-open .language-fullpage { z-index: 1064; } .is-open-nav-primary.login-menu-open .login-fullpage { z-index: 1064; } .is-open-nav-primary.language-menu-open .nav-primary-mobile-subnav-modal { height: auto } .is-open-nav-primary.language-menu-open .nav-primary-mobile-subnav-modal .btn-back { opacity: 1; } /* ---------------------------------------------- Open Menu Button ---------------------------------------------- */ /* visible in header of site on mobile dimensions. */ .nav-primary-mobile-menu-button { background: transparent; color: rgb(78, 78, 78); font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-size: 1.125rem; white-space: nowrap; line-height: 4.0625rem; padding: 0; margin: 0; border: 0; outline: 0 } .nav-primary-mobile-menu-button svg { display: block; width: 100%; height: 100%; } .nav-primary-mobile-menu-button path { fill: rgb(57, 57, 57); } .nav-primary-mobile-menu-button .icon { display: inline-block; width: 16px; height: 16px; vertical-align: middle; margin-left: 6px; } .nav-corporate-header { position: absolute; top: 0; right: 0; bottom: auto; left: 0; z-index: 1040; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); will-change: transform, display; height: 4.0625rem; background-color: #ffffff; -webkit-transition: background-color .25s, -webkit-transform .25s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: background-color .25s, -webkit-transform .25s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform .25s cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color .25s; transition: transform .25s cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color .25s, -webkit-transform .25s cubic-bezier(0.25, 0.46, 0.45, 0.94) } .nav-corporate-header .container { opacity: 1; -webkit-transition: opacity .25s; transition: opacity .25s; display: -webkit-box; display: flex; position: relative; } .nav-center { display: block; -webkit-box-ordinal-group: 1; order: 0; -webkit-box-flex: 1; flex: 1 1 auto; align-self: auto; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; position: relative; text-align: left; -webkit-transition: opacity 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94), z-index 0s, -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94), z-index 0s, -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform 0.4s cubic-bezier(0.19, 1, 0.22, 1), z-index 0s; transition: opacity 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform 0.4s cubic-bezier(0.19, 1, 0.22, 1), z-index 0s, -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); } .navbar-logo-wrapper { height: 4.0625rem; display: block; -webkit-box-flex: 1; flex: 1; align-self: auto; overflow: hidden } .navbar-logo-wrapper .main-logo { display: inline-block; padding: 1.3rem 0 0 } .navbar-logo-wrapper .main-logo img { max-height: 24px; height: 24px; } @media (min-width: 64em) { .navbar-logo-wrapper { height: 3.375rem } .navbar-logo-wrapper .main-logo { padding: 0.5rem 0 0 } .navbar-logo-wrapper .main-logo img { width: auto; max-height: 33px; height: 33px; display: block; } .nav-corporate-header { position: fixed; height: 3.375rem; } } .nav-meta { font-size: 0.875rem; margin-bottom: 0; padding-right: 0; display: none; width: auto; height: 4.0625rem; /* overflow: hidden; allow logged in user tooltip to be visible */ vertical-align: top; text-align: right } .mobile-nav-open .nav-meta { opacity: 1; pointer-events: all; -webkit-transform: none; transform: none; -webkit-transition: opacity 0.2s 0.1s, z-index 0s, -webkit-transform 0.2s 0.1s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.2s 0.1s, z-index 0s, -webkit-transform 0.2s 0.1s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.2s 0.1s, transform 0.2s 0.1s cubic-bezier(0.19, 1, 0.22, 1), z-index 0s; transition: opacity 0.2s 0.1s, transform 0.2s 0.1s cubic-bezier(0.19, 1, 0.22, 1), z-index 0s, -webkit-transform 0.2s 0.1s cubic-bezier(0.19, 1, 0.22, 1); z-index: 10 } .nav-meta .btn-link { padding-left: 0.35rem; } .nav-meta .fa { font-size: 1rem; } .nav-meta li > a, .nav-meta .login-trigger > a, .nav-meta .explore-trigger > a{ text-decoration: none !important; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; color: rgb(78, 78, 78); text-align: center; position: relative; font-weight: 400; padding: 0 0.35rem } .nav-meta li > a:hover, .nav-meta .login-trigger > a:hover, .nav-meta .explore-trigger > a:hover { /* color: color(var(--color-rock) shade(20%)); */ color: #3e3e3e; } .nav-meta .btn { margin-bottom: 0 } .nav-meta .btn:hover { /* color: color(var(--color-marine) shade(20%)); */ color: #00234c; } .nav-meta .btn:active { -webkit-transform: none; transform: none; } .nav-meta > li { display: inline-block; margin-bottom: 0 } .nav-meta > li + li { padding-left: 0.5rem; } .nav-meta > li > a, .nav-meta > li .login-trigger > a { height: 4.0625rem; line-height: 4.0625rem; } .nav-meta li a.explore-trigger { color: rgb(0, 44, 95); cursor: pointer; } .nav-meta li a.explore-trigger:hover { color: rgb(0, 44, 95); } .nav-meta-mobile .fa { vertical-align: text-top; } .nav-meta-mobile-item-label { margin-left: .6rem; } .nav-meta-mobile .tooltip { display: none; } .explore-icon { vertical-align: middle; height: 18px; width: 18px; position: relative; top: -1px; left: 4px } .explore-icon svg { width: 100%; height: 100%; } .hide-navbar .nav-corporate-header { -webkit-transform: translate3d(0, -var(--navbar-height-desktop), 0); transform: translate3d(0, -var(--navbar-height-desktop), 0) } .hide-navbar .nav-corporate-header .container { opacity: 0; } .nav-body-fixed .nav-corporate-header { background-color: rgb(255, 255, 255); } .nav-util-block { -webkit-box-flex: 0; flex: 0 1 auto; } .navbar-corporate .fa { vertical-align: -1px; /* vertical-align: text-top; */ } .navbar-corporate .language-label, .navbar-corporate .login-trigger-label, .navbar-corporate .explore-trigger .fa + span { padding-left: 0.6em; } .navbar-corporate .btn-link .fa { margin-right: 0; } /* SIX: fix explore SIX styles */ @media (max-width: 63.999em) { .nav-division-header .btn-link { font-size: 1em; margin-left: -4px; /* SIX: fix explore SIX after recent btn-link improvements */ padding-bottom: 0; } .explore-icon { height: 20px; width: 20px; } } @media (min-width: 64em) { .nav-meta { display: inline-block; padding: 0; width: auto; /*width: 12rem;*/ height: 3.375rem } .nav-meta li > button, .nav-meta li > a, .nav-meta li .login-trigger > a, .nav-meta li .explore-trigger > a { display: inline-block; height: 3.375rem; line-height: 3.375rem; } .nav-meta .btn-link { position: relative; top: -1px; } .nav-meta li + li { margin-left: 8px; padding-left: 11px; position: relative } .nav-meta li + li:before { content: ''; position: absolute; width: 1px; height: 1.4em; left: 0; top: 50%; margin-top: -.7em; background: rgb(184, 184, 184); } .explore-wrapper { width: 3.375rem; height: 3.375rem; } .explore { top: 0.65rem; width: calc(3.375rem - 1.25rem); height: calc(3.375rem - 1.25rem) } .explore .svg-icon { width: 100%; height: auto; opacity: 1; -webkit-transition: opacity 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: opacity 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94); } } @media print { .nav-util-block { display: none; } .nav-corporate-header { height: auto; position: relative; } .navbar-logo-wrapper { height: auto } .navbar-logo-wrapper .main-logo { display: block } .navbar-logo-wrapper .main-logo img { max-height: none; max-width: none; height: 34px; width: auto; /* -ms-interpolation-mode: nearest-neighbor; */ } } .anchor-nav-inner ul, .anchor-nav-horizontal-inner ul { list-style-type: none; } .anchor-nav-inner nav a, .anchor-nav-horizontal-inner nav a { font-size: 0.75rem; /* 12/16 */ padding: 1.3rem 0; display: inline-block; margin: 0 0.6rem; position: relative } .anchor-nav-inner nav a:after, .anchor-nav-horizontal-inner nav a:after { content: ''; position: absolute; height: 3px; width: 100%; bottom: 1rem; left: 0; background: currentColor; opacity: 0; -webkit-transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0.2s; transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) 0.2s; } .anchor-nav-inner nav a.active:after, .anchor-nav-horizontal-inner nav a.active:after { opacity: 1; -webkit-transition-delay: 0s; transition-delay: 0s; } .anchor-nav-inner nav a span, .anchor-nav-horizontal-inner nav a span { display: none; } @media (max-width: 63.999em) { /* TODO: consider moving this into a postcss mixin, since it is used in anchor-nav-horizontal too */ .anchor-nav-wrapper { width: 100%; height: 60px; margin: 0; margin-top: 20px; margin-bottom: 0; } /* TODO: consider moving this into a postcss mixin, since it is used in anchor-nav-horizontal too */ .anchor-nav-inner { height: 60px; z-index: 20; border-bottom: 1px solid rgb(220, 220, 220); background: rgb(248, 248, 248) } .anchor-nav-inner .container { overflow: hidden; overflow-x: auto; -webkit-overflow-scrolling: touch; } .anchor-nav-inner ul { margin-bottom: 0; white-space: nowrap; margin-left: -0.6rem; margin-right: -0.6rem; } .anchor-nav-inner li { display: inline-block; margin-bottom: 0 } .anchor-nav-inner li:first-child a { padding-left: 0; } .anchor-nav-inner h6 { display: none; } .anchor-nav-wrapper:empty { display: none; } .product-sidebar + .anchor-nav-inner { position: -webkit-sticky; position: sticky; top: 0; z-index: 20; margin-bottom: 16px; } .product-sidebar-wrapper { position: relative } .product-sidebar-wrapper .anchor-nav-inner { position: absolute; bottom: 0; left: 0; width: 100%; } } .sticky-inpage-nav { /* TODO: consider moving this into a postcss mixin, since it is used in anchor-nav-horizontal too */ } .sticky-inpage-nav .anchor-nav-wrapper { width: 100%; height: 60px; margin: 0; margin-top: 20px; margin-bottom: 0; } .sticky-inpage-nav { /* TODO: consider moving this into a postcss mixin, since it is used in anchor-nav-horizontal too */ } .sticky-inpage-nav .anchor-nav-inner { height: auto; z-index: 20; border-bottom: 1px solid rgb(220, 220, 220); background: rgb(248, 248, 248) } .sticky-inpage-nav .anchor-nav-inner .container { overflow: hidden; overflow-x: auto; -webkit-overflow-scrolling: touch; } .sticky-inpage-nav .anchor-nav-inner ul { margin-bottom: 0; white-space: nowrap; margin-left: -0.6rem; margin-right: -0.6rem; } .sticky-inpage-nav .anchor-nav-inner li { display: inline-block; margin-bottom: 0 } .sticky-inpage-nav .anchor-nav-inner li:first-child a { padding-left: 0; } .sticky-inpage-nav .anchor-nav-inner h6 { display: none; } .sticky-inpage-nav .anchor-nav-wrapper:empty { display: none; } .sticky-inpage-nav .product-sidebar + .anchor-nav-inner { position: -webkit-sticky; position: sticky; top: 0; z-index: 20; } .sticky-inpage-nav .product-sidebar-wrapper { position: relative; width: 100% } .sticky-inpage-nav .product-sidebar-wrapper .anchor-nav-inner { position: absolute; bottom: 0; left: 0; width: 100%; } @media (min-width: 64em) { .product-sidebar.non-sticky-nav .product-sidebar-inner-sticky.product-sidebar-inner-sticky { margin-top: 0; } .product-sidebar.non-sticky-nav .page-header + .page-content .product-sidebar-inner-sticky, .product-sidebar.non-sticky-nav .article-header + .page-content .product-sidebar-inner-sticky { padding-top: 60px; } .product-sidebar.non-sticky-nav .anchor-nav-inner nav a { margin: 5px 0; padding: 0; padding-right: 10px; display: block } .product-sidebar.non-sticky-nav .anchor-nav-inner nav a:after { width: 3px; height: 100%; left: auto; right: 0; top: 0; -webkit-transform: scaleX(0); transform: scaleX(0); } .product-sidebar.non-sticky-nav .anchor-nav-inner nav a.active:after { -webkit-transform: scaleX(1); transform: scaleX(1); } .product-sidebar.non-sticky-nav .anchor-nav-inner nav a span { color: rgb(113, 113, 113); font-weight: 400; display: inline; } .product-sidebar.non-sticky-nav .anchor-nav-wrapper { background: rgb(248, 248, 248); padding: 1rem 8px; } } @media print { .anchor-nav-wrapper, .anchor-nav-inner { display: none; } } /* Anchor Tabs horizontal variation */ .anchor-nav-horizontal-wrapper { position: -webkit-sticky; position: sticky; top: 0; z-index: 20; margin-top: 20px; } /* TODO: consider moving this into a postcss mixin, since it is used in anchor-nav too */ .anchor-nav-horizontal-wrapper { width: 100%; height: 60px; margin: 0; margin-top: 20px; margin-bottom: 0; } /* TODO: consider moving this into a postcss mixin, since it is used in anchor-nav too */ .anchor-nav-horizontal-inner { height: 60px; z-index: 20; border-bottom: 1px solid rgb(220, 220, 220); background: #f8f8f8 } .anchor-nav-horizontal-inner .container { overflow: hidden; overflow-x: auto; -webkit-overflow-scrolling: touch; } .anchor-nav-horizontal-inner ul { margin-bottom: 0; white-space: nowrap; margin-left: -0.6rem; margin-right: -0.6rem; } .anchor-nav-horizontal-inner li { display: inline-block; margin-bottom: 0 } .anchor-nav-horizontal-inner li:first-child a { padding-left: 0; } .anchor-nav-horizontal-inner h6 { display: none; } /** * CSS definitions for the explore fullpage overlay */ .explore-fullpage .container { height: 100%; } .explore-fullpage .row { -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; /* Hack for IE11 */ } .explore-fullpage { /* Hack because of simplified grid for SIX */ } .explore-fullpage .column_4 { flex-basis: 100%; max-width: 100%; position: relative; display: block; } .explore-fullpage .list-divisions, .explore-fullpage .list-general, .explore-fullpage .social_connect ul { list-style: none; margin: 0 } .explore-fullpage .list-divisions::after, .explore-fullpage .list-general::after, .explore-fullpage .social_connect ul::after { content: ""; display: table; clear: both; } .explore-fullpage .list-divisions li, .explore-fullpage .list-general li, .explore-fullpage .social_connect ul li { -webkit-transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); margin-bottom: 0 } .explore-fullpage .list-divisions li .title, .explore-fullpage .list-general li .title, .explore-fullpage .social_connect ul li .title { display: inline-block; width: auto; font-weight: 400 } .explore-fullpage .list-divisions li .title::after, .explore-fullpage .list-general li .title::after, .explore-fullpage .social_connect ul li .title::after { content: ""; display: table; clear: both; } .explore-fullpage .list-divisions li .description, .explore-fullpage .list-general li .description, .explore-fullpage .social_connect ul li .description { font-weight: 400; } .explore-fullpage .list-divisions { padding-top: 2rem; text-align: center } .explore-fullpage .list-divisions li + li { padding-top: 2rem; } .explore-fullpage .list-divisions a { position: relative; width: 100% } .explore-fullpage .list-divisions a:hover { opacity: 1; } .explore-fullpage .list-divisions li .description { display: none; } .explore-fullpage .list-general { height: 100%; display: -webkit-box; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: reverse; flex-direction: row-reverse; flex-wrap: wrap; -webkit-box-pack: center; justify-content: center; align-content: flex-start; -webkit-box-align: start; align-items: flex-start; padding-top: 2.5rem } .explore-fullpage .list-general li { display: inline-block; position: relative; text-align: center; -webkit-box-flex: 1; flex: 1; /* Fix for IE11 */ -ms-flex: 1 1 auto } .explore-fullpage .list-general li a { display: inline-block; position: relative; } .explore-fullpage .list-general li .description { display: none; } .explore-fullpage .list-general a { display: block; width: 100%; } .explore-fullpage .list-divisions a, .explore-fullpage .list-general a { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; } .explore-fullpage .list-divisions .active .title, .explore-fullpage .list-general .active .title { position: relative } .explore-fullpage .list-divisions .active .title:before, .explore-fullpage .list-general .active .title:before { content: ''; position: absolute; display: block; margin-top: 0.35rem; left: 0; bottom: 0; width: 100%; height: 1px; background-color: rgb(222, 57, 25); } .explore-fullpage .list-divisions:hover li, .explore-fullpage .list-general:hover li, .explore-fullpage .social_connect:hover li { opacity: 0.5; } .explore-fullpage .list-divisions:hover li:hover, .explore-fullpage .list-general:hover li:hover, .explore-fullpage .social_connect:hover li:hover { opacity: 1; } .explore-fullpage .social_connect { max-width: 100%; display: block; padding-top: 1.5rem; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; color: rgb(255, 255, 255) } .explore-fullpage .social_connect li { display: inline-block; padding: 0.35rem 0 1rem 0 } .explore-fullpage .social_connect li + li { margin-left: 1.2rem; } .explore-fullpage .social_connect a { display: inline-block; width: 1.75rem; text-align: center; font-size: 1.25rem; } .explore-fullpage .social_connect:hover li:first-child { opacity: 1; } .explore-fullpage .utilities-wrapper { padding: 0 0 1rem 0; position: inherit; } .explore-fullpage .utilities { display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: reverse; flex-direction: column-reverse; position: inherit; text-align: center; width: 100%; margin-top: 40px; } .explore-fullpage .explore-top a { font-size: 1.25rem; font-weight: 400; color: rgb(255, 255, 255); text-decoration: none; } .explore-fullpage .description { font-size: 1rem; opacity: 0.5; width: 100%; } .explore-top { width: 100%; } .explore-bottom { display: none; background-color: #0e3c71 } .explore-bottom .explore-placeholder { height: 15rem; background-color: rgb(255, 255, 255); background-image: -webkit-repeating-linear-gradient(315deg, transparent, transparent 35px, rgba(0, 0, 0, .1) 35px, rgba(0, 0, 0, .1) 70px); background-image: repeating-linear-gradient(135deg, transparent, transparent 35px, rgba(0, 0, 0, .1) 35px, rgba(0, 0, 0, .1) 70px); position: relative } .explore-bottom .explore-placeholder:after { content: 'Placeholder'; width: 100%; top: 50%; left: 0; -webkit-transform: translateY(-50%); transform: translateY(-50%); text-align: center; position: absolute; display: block; font-size: 4.5vw; color: rgb(220, 220, 220); } /* Flexbox definitions */ .explore-fullpage { position: relative; } .explore-header { position: absolute; width: 100% } .explore-header .container { position: relative; z-index: 2; } .explore-close, .fullpage-close, .nav-sub-close { position: absolute; top: 4px; right: 0; padding: 0; margin: 0; overflow: hidden; display: block; background: transparent; -webkit-transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); border: 0 solid; } .fullpage-close .close-icon { background: transparent } .fullpage-close .close-icon svg { fill: rgb(78, 78, 78); } .explore-close:focus, .explore-close:hover, .fullpage-close:focus, .fullpage-close:hover, .nav-sub-close:focus, .nav-sub-close:hover { background: transparent; opacity: 1 } .explore-close:focus svg, .explore-close:hover svg, .fullpage-close:focus svg, .fullpage-close:hover svg, .nav-sub-close:focus svg, .nav-sub-close:hover svg { fill: rgb(222, 57, 25); } .explore-header .explore-close { opacity: 0; } .explore-menu-open .explore-close { opacity: .8 } .close-icon { position: relative; display: block; padding: 14px } .close-icon svg { display: block; fill: rgb(255, 255, 255); -webkit-transition: fill 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: fill 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); width: 16px; height: 16px; } @media (min-width: 30em) { .explore-top { padding-top: 1rem; } .explore-fullpage .row { height: auto; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; } .explore-fullpage .column_4 { flex-basis: 50%; max-width: 50%; display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; align-content: flex-end; } .explore-fullpage .column_4:nth-child(3n) { flex-basis: 100%; max-width: 100%; } .explore-fullpage { /* * Special override for a little smaller headers to keep consistent with * the removed .list-explore-teaser .title definitions */ } .explore-fullpage .list .item .title { font-size: 1.125em; line-height: 1.222; } .explore-fullpage .list-divisions { padding-top: 0; text-align: left } .explore-fullpage .list-divisions li + li { padding-top: 2.5rem; } .explore-fullpage .list-divisions li .description { display: inline-block; } .explore-fullpage .list-general { width: 100%; padding-top: 0; -webkit-box-flex: 1; flex: 1 auto; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; align-content: flex-end } .explore-fullpage .list-general li { display: block; text-align: left; width: 100%; -webkit-box-flex: 0; flex: none } .explore-fullpage .list-general li + li { padding-top: 40px; } .explore-fullpage .list-general li .description { display: inline-block; } .explore-fullpage .utilities-wrapper { -webkit-box-flex: 1; flex: 1 auto; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; display: -webkit-box; display: flex; align-content: flex-end; -webkit-box-align: end; align-items: flex-end; padding: 40px 0 60px; } .explore-fullpage .social_connect { padding-top: 0 } .explore-fullpage .social_connect li:first-child { display: block } .explore-fullpage .social_connect li:first-child + li { margin-left: -0.3rem; } .explore-fullpage a { font-size: 1.25rem; } .explore-fullpage .utilities { display: -webkit-box; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; text-align: left; margin-top: 30px } .explore-fullpage .utilities .social_connect, .explore-fullpage .utilities .explore-searchbox { flex-basis: 50%; max-width: 50%; padding: 0; } .explore-bottom { padding: 3rem 0; display: block; } } .nav-sub-close { display: none; right: 0; top: 15px; } @media (min-width: 48em) { .explore-fullpage a { font-size: 1.5rem; } .explore-fullpage .social_connect li:first-child { display: inline-block } .explore-fullpage .social_connect li:first-child + li { margin-left: 1.2rem; } } @media (min-width: 64em) { .nav-sub-close { display: block; right: calc(50% - 512px); } .explore-top .container { position: relative; } .explore-top, .explore-bottom { padding-top: 0; -webkit-box-ordinal-group: 1; order: 0; -webkit-box-flex: 1; flex: 1 1 auto; align-self: stretch; } .explore-fullpage .row { height: auto; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; } .explore-fullpage { /* Hack because of simplified grid for Six */ } .explore-fullpage .column_4, .explore-fullpage .column_4:nth-child(3n) { flex-basis: 33.33333333%; max-width: 33.33333333%; } .explore-fullpage .utilities-wrapper { -webkit-box-flex: 1; flex: 1 auto; padding: 0; } .explore-fullpage .utilities { display: block; text-align: right } .explore-fullpage .utilities .social_connect, .explore-fullpage .utilities .explore-searchbox { max-width: none; } .explore-fullpage .social_connect { background: transparent; position: relative; display: block; width: auto; max-width: none; padding-bottom: 2.5rem; z-index: 1 } .explore-fullpage .social_connect li { padding: 0 0 2rem 0; } .explore-top .container, .explore-bottom .container { padding-top: 5rem; /* Needed for IE11 */ padding-bottom: 3rem; } .explore-top { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center } .explore-top > .container { } .explore-bottom { padding: 0; } .explore-searchbox { width: 100%; } .explore-inner { display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-box-flex: 1; flex-grow: 1; min-height: 100%; } .language-inner .container, .login-inner .container { position: relative } .language-inner .container .row, .login-inner .container .row { padding: 5rem 0; } .language-inner .fullpage-close { left: auto; right: 193px; background-color: transparent; } .login-inner .fullpage-close { left: auto; right: 147px; background-color: transparent; } } @media (min-width: 80.125em) { .nav-sub-close { right: calc(50% - 640px); } } @media (max-width: 63.999em) { .explore-inner { display: -webkit-box; display: flex; -webkit-box-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; } .explore-close, .fullpage-close { display: none; } } /* * CCS Style for the dependencies between the corporate and explore fullpage * definitions */ .explore-menu-open .explore-fullpage { z-index: 1044; } .language-menu-open .language-fullpage { z-index: 1044; } .login-menu-open .login-fullpage { z-index: 1044; } .explore-fullpage, .language-fullpage, .login-fullpage { position: absolute; top: 4.0625rem; left: 0; right: 0; bottom: 0; z-index: 1049; overflow: hidden; visibility: hidden; background-color: transparent; -webkit-transition: background-color .3s , visibility 0s .3s; transition: background-color .3s , visibility 0s .3s; -webkit-overflow-scrolling: touch /* SIX prevents phantom element covering the login and language links */ } .explore-fullpage img[src], .language-fullpage img[src], .login-fullpage img[src] { visibility: hidden; } .explore-menu-open .explore-fullpage { -webkit-transition: background-color .3s , visibility 0s 0s, -webkit-transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: background-color .3s , visibility 0s 0s, -webkit-transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color .3s , visibility 0s 0s; transition: transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94), background-color .3s , visibility 0s 0s, -webkit-transform .3s cubic-bezier(0.25, 0.46, 0.45, 0.94); visibility: visible; background-color: rgb(0, 44, 95); overflow-y: auto } .explore-menu-open .explore-fullpage img[src] { visibility: visible; } .explore-fullpage .explore-inner { width: 100%; } .explore-fullpage .explore-top, .explore-fullpage .explore-bottom { opacity: 0; -webkit-transition: opacity .1s 0s; transition: opacity .1s 0s } .explore-menu-open .explore-fullpage .explore-top, .explore-menu-open .explore-fullpage .explore-bottom { -webkit-transition: opacity .5s 0.35s; transition: opacity .5s 0.35s; opacity: 1 } .explore-menu-open .explore-fullpage .explore-bottom { -webkit-transition: opacity .8s 0.45s; transition: opacity .8s 0.45s } .explore-effect { position: absolute; top: 2rem; right: 1.85rem; display: none } .explore-effect:before { content: ''; visibility: visible; position: absolute; display: block; height: 400vw; width: 400vw; height: 270vmax; width: 270vmax; top: 50%; left: 50%; z-index: 1; border-radius: 50%; -webkit-transform: translate(-50%, -50%) scale(0); transform: translate(-50%, -50%) scale(0); opacity: 1; background-color: rgb(0, 44, 95); -webkit-transition: all .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) , visibility 0s 0s; transition: all .3s cubic-bezier(0.25, 0.46, 0.45, 0.94) , visibility 0s 0s; } .explore-menu-open .explore-effect:before, .language-menu-open .explore-effect:before, .login-menu-open .explore-effect:before { -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); visibility: visible; -webkit-transition: all .5s cubic-bezier(0.25, 0.46, 0.45, 0.94), visibility 0s .5s; transition: all .5s cubic-bezier(0.25, 0.46, 0.45, 0.94), visibility 0s .5s; } .language-menu-open .language-fullpage { -webkit-transition: background .3s, visibility 0s 0s; transition: background .3s, visibility 0s 0s; visibility: visible; background-color: rgb(255, 255, 255); overflow-y: auto } .language-fullpage .language-inner { opacity: 0; -webkit-transition: opacity .1s 0s; transition: opacity .1s 0s } .language-menu-open .language-fullpage .language-inner { -webkit-transition: opacity .5s 0.35s; transition: opacity .5s 0.35s; opacity: 1 } .login-menu-open .login-fullpage { -webkit-transition: background-color .3s, visibility 0s 0s; transition: background-color .3s, visibility 0s 0s; visibility: visible; background-color: rgb(255, 255, 255); overflow-y: auto } .login-menu-open .login-fullpage img[src] { visibility: visible; } .login-fullpage .login-inner { opacity: 0; -webkit-transition: opacity .1s 0s; transition: opacity .1s 0s } .login-menu-open .login-fullpage .login-inner { -webkit-transition: opacity .5s 0.35s; transition: opacity .5s 0.35s; opacity: 1 } @media (min-width: 64em) { .explore-fullpage, .language-fullpage, .login-fullpage { position: fixed; top: 0; -webkit-transform: translateY(0); transform: translateY(0); } .explore-fullpage .explore-top, .explore-fullpage .explore-bottom { position: relative; } } /** * CSS definitions for the language and login fullpage overlay */ .dependency-fullpage h6 { opacity: 0.4; display: block; margin: 2rem 1.25rem 0.75rem 1.25rem; } .dependency-fullpage .dependency-level-hidden { display: none !important; } .dependency-fullpage .dependency-desktop-first-level, .dependency-fullpage .row > div:first-child, .dependency-fullpage .dependency-level-hidden + div > .dependency-desktop-second-level { margin-top: 0 } .dependency-fullpage .dependency-desktop-first-level li, .dependency-fullpage .row > div:first-child li, .dependency-fullpage .dependency-level-hidden + div > .dependency-desktop-second-level li { opacity: 0.6; -webkit-transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) } .dependency-fullpage .dependency-desktop-first-level li a, .dependency-fullpage .row > div:first-child li a, .dependency-fullpage .dependency-level-hidden + div > .dependency-desktop-second-level li a { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; padding: 0.75rem 0; display: block; font-size: 1.125rem; visibility: inherit; font-weight: normal; color: rgb(78, 78, 78); } .dependency-fullpage .dependency-desktop-first-level li span, .dependency-fullpage .row > div:first-child li span, .dependency-fullpage .dependency-level-hidden + div > .dependency-desktop-second-level li span { position: relative; display: block; padding-right: 10px; } .dependency-fullpage .dependency-desktop-first-level li.dependency-active, .dependency-fullpage .dependency-desktop-first-level li:hover, .dependency-fullpage .row > div:first-child li.dependency-active, .dependency-fullpage .row > div:first-child li:hover, .dependency-fullpage .dependency-level-hidden + div > .dependency-desktop-second-level li.dependency-active, .dependency-fullpage .dependency-level-hidden + div > .dependency-desktop-second-level li:hover { opacity: 1; } .dependency-fullpage .dependency-desktop-second-level { margin-top: 0.75rem } .dependency-fullpage .dependency-desktop-second-level li { margin: 0; opacity: 0; -webkit-transform: translateX(3%); transform: translateX(3%); -webkit-transition: opacity .5s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform .5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: opacity .5s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform .5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform .5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity .5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform .5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity .5s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform .5s cubic-bezier(0.165, 0.84, 0.44, 1) } .dependency-fullpage .dependency-desktop-second-level li.dependency-show { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } .dependency-fullpage .dependency-desktop-second-level li a { padding: 0.375rem 0; display: block; font-size: 0.875rem; font-weight: bold; visibility: inherit; color: rgb(78, 78, 78); } .dependency-fullpage .dependency-desktop-second-level li span { position: relative; display: block; padding-right: 10px; } .dependency-fullpage .dependency-desktop-second-level li.dependency-active { opacity: 1 !important; } .dependency-fullpage .dependency-desktop-second-level:hover li { opacity: 0.6 } .dependency-fullpage .dependency-desktop-second-level:hover li:hover { opacity: 1; } .dependency-fullpage .dependency-desktop-first-level, .dependency-fullpage .dependency-desktop-second-level { margin: 0 1.25rem 2rem 1.25rem } .dependency-fullpage .dependency-desktop-first-level li a, .dependency-fullpage .dependency-desktop-second-level li a { cursor: pointer; } .dependency-fullpage .dependency-desktop-first-level li.dependency-active span:before, .dependency-fullpage .dependency-desktop-second-level li.dependency-active span:before { content: ''; position: absolute; width: 6px; height: 6px; top: 50%; margin-top: -2px; margin-right: 2px; left: auto; right: 0; -webkit-transform: rotate(45deg); transform: rotate(45deg); border: 1px solid rgb(222, 57, 25); border-width: 1px 1px 0 0; } .dependency-fullpage .dependency-display-level { margin: 0 1.25rem 2rem 1.25rem; opacity: 0; -webkit-transform: translateX(3%); transform: translateX(3%); -webkit-transition: opacity .5s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform .5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: opacity .5s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform .5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform .5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity .5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform .5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity .5s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform .5s cubic-bezier(0.165, 0.84, 0.44, 1) } .dependency-fullpage .dependency-display-level.dependency-show { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } .dependency-fullpage .dependency-display-level li { opacity: 1; -webkit-transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) } .dependency-fullpage .dependency-display-level li a { font-weight: bold; } .dependency-fullpage .dependency-display-level li.dependency-active { color: rgb(222, 57, 25); } .dependency-fullpage .dependency-display-level:hover li { opacity: 0.6 } .dependency-fullpage .dependency-display-level:hover li.dependency-active, .dependency-fullpage .dependency-display-level:hover li:hover { opacity: 1; } .dependency-fullpage .dependency-display-level .btn-primary { background-color: rgb(0, 44, 95); border-color: rgb(0, 44, 95) } .dependency-fullpage .dependency-display-level .btn-primary:focus, .dependency-fullpage .dependency-display-level .btn-primary:hover { background-color: rgb(0, 24, 71); border-color: rgb(0, 24, 71); } .dependency-fullpage .dependency-display-level .btn-secondary { border-color: rgb(0, 44, 95); color: rgb(0, 44, 95); /* Only needed for demonstration because of close trigger */ right: auto } .dependency-fullpage .dependency-display-level .btn-secondary:before, .dependency-fullpage .dependency-display-level .btn-secondary:after { background: rgb(0, 44, 95); z-index: -1; } .dependency-fullpage .dependency-display-level .btn-secondary:focus, .dependency-fullpage .dependency-display-level .btn-secondary:hover { color: rgba(255, 255, 255, 1); } .dependency-fullpage select { width: 100%; padding: 0.500em 2.250em 0.500em 1.000em } .dependency-fullpage select option { padding: 0.500em 1.250em; } .dependency-fullpage .column_3 { flex-basis: 100%; max-width: 100%; } @media (min-width: 64em) { .dependency-fullpage .column_3, .dependency-fullpage .column_4 { border-right: 1px solid rgb(220, 220, 220); } .dependency-fullpage .column_3 { flex-basis: 25%; max-width: 25%; } .dependency-fullpage .column_4 { flex-basis: 33.333333%; max-width: 33.333333%; } .dependency-fullpage .dependency-desktop-second-level, .dependency-fullpage .dependency-display-level { margin-top: 1.375rem; } } @media (min-width: 64em) { .dependency-fullpage h6 { margin: 2rem 2rem 0.75rem 3rem; } .dependency-fullpage .dependency-desktop-first-level, .dependency-fullpage .dependency-desktop-second-level, .dependency-fullpage .dependency-display-level { margin: 1.375rem 2rem 2rem 3rem; } .dependency-fullpage .dependency-desktop-first-level, .dependency-fullpage .dependency-level-hidden + .column_4 .dependency-desktop-second-level { margin-top: 0.75rem; } } /** * CSS definitions specific for the language overlay * Also see the definitions in _dependency-fullpage.css */ .language-fullpage .dependency-display-level { list-style: none } .language-fullpage .dependency-display-level li { margin: 0 } .language-fullpage .dependency-display-level li a { padding: 0.75rem 0; display: block; font-size: 0.875rem; visibility: inherit; color: rgb(78, 78, 78); } .language-fullpage .dependency-display-level li span { position: relative; } .language-fullpage .dependency-display-level li.dependency-active a { color: rgb(222, 57, 25); } .language-fullpage .dependency-desktop-second-level .dependency-active a { color: rgb(222, 57, 25); } @media (min-width: 48em) { .language-fullpage .dependency-display-level li a { padding: 0.375rem 0; } } /** * CSS definitions specific for the login overlay * Also see the definitions in _dependency-fullpage.css */ .login-fullpage .dependency-display-level p { font-size: 0.875rem; } .login-fullpage .dependency-display-level.dependency-show { margin-bottom: 4rem; /* SIX-4374: support teasers within login area */ overflow: visible; } .dependency-display-level .chapter_title { margin-top: 2rem; } .dependency-display-level > .chapter_title:first-child { margin-top: 0; } .login-inner .container .login-current-service .row { padding: 20px; margin-bottom: 20px } .login-inner .container .login-current-service .row ul { list-style: none; margin-top: 0; margin-bottom: 0; } .login-inner .container .login-current-service .row li { margin-bottom: 0; } .login-inner .container .login-current-service .row a { padding: 0.2rem 0; font-size: 1rem; } .login-inner .container .login-current-service .row p { font-size: 0.875rem; margin-bottom: 0.5em; } .login-inner .container .login-current-service hr { margin: 0.6rem 0; } @media (min-width: 64em) { .dependency-display-level .chapter_title { margin-top: 4rem; } .login-current-service { display: none; } } .accordion { border: 1px solid rgb(220, 220, 220); box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.05); color: rgb(113, 113, 113); margin: 20px 0 } .accordion h1,.accordion h2,.accordion h3,.accordion h4,.accordion h5,.accordion fieldset legend,.accordion .page_title,.accordion .section_title,.accordion .chapter_title,.accordion .paragraph_title,.accordion .list .title { color: rgb(57, 57, 57); } .bg-red .accordion a { color: #4997b7 } .bg-red .accordion a:hover { color: #4a7485 } .accordion-toggle-icon { position: relative; display: inline-block; height: 2.75rem; width: 2.75rem; background-color: rgb(0, 44, 95); background-color: transparent; color: white; color: rgb(113, 113, 113); font-size: 1.125rem; padding: 0.5rem 1rem } .accordion-toggle-icon span { -webkit-transition: -webkit-transform 0.5s linear; transition: -webkit-transform 0.5s linear; transition: transform 0.5s linear; transition: transform 0.5s linear, -webkit-transform 0.5s linear; } .accordion .expander-body { background: rgb(248, 248, 248); } .accordion .expander-body-inner { padding: 16px; } .accordion .expander-trigger { background: rgb(255, 255, 255); border: 0 solid #eee; border-bottom-width: 1px; border-radius: 0; display: block; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-size: 1rem; line-height: 1.15; color: rgb(113, 113, 113); padding: 14px 36px 14px 16px; text-align: left; width: 100%; position: relative; -webkit-appearance: none /* SIX-4271: disable trigger in editmode */ } .accordion .expander-trigger[aria-controls] { cursor: pointer; } .accordion .expander-trigger:before, .accordion .expander-trigger:after { content: ''; background: rgb(222, 57, 25); display: block; position: absolute; right: 20px; top: 50%; height: 1px; width: 9px; } .accordion .expander-trigger:after { height: 9px; width: 1px; margin-top: -4px; margin-right: 4px; -webkit-transform: none; transform: none; -webkit-transition: -webkit-transform .2s ease-out; transition: -webkit-transform .2s ease-out; transition: transform .2s ease-out; transition: transform .2s ease-out, -webkit-transform .2s ease-out; } .accordion .expander-trigger[aria-expanded="true"]:after { -webkit-transform: scale(0); transform: scale(0); } .accordion .expander-trigger:nth-last-child(2)[aria-expanded="false"] { border-bottom-color: transparent; } /* SIX-4271: adds support for author mode */ .accordion div.expander-trigger:before, .accordion div.expander-trigger:after { display: none; } /* keyboard support / do not hide the focus, https://jira.six-group.net/browse/SIX-3965 removed line: .accordion .expander-trigger:focus, */ .accordion .expander-body:focus { outline: 0; } @media (min-width: 64em) { .accordion .expander-body-inner { padding: 30px; } .accordion .expander-trigger { padding-left: 30px; } } .radio-tabs .radio-tabs-header span { border: 1px solid transparent; border-bottom: 0; cursor: pointer; display: inline-block; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; padding: 15px; position: relative } .radio-tabs .radio-tabs-header span.radio-tabs-badge { color: rgb(148, 138, 127); font-size: 0.75rem; padding: 0; position: relative; top: -8px; } .radio-tabs-header input { position: absolute; overflow: hidden; opacity: 0; width: 0; height: 0; clip: rect(0 0 0 0) } .radio-tabs-header input:checked + span { border-color: rgb(220, 220, 220); box-shadow: inset 0 -1px 0 0 #fff; position: relative; z-index: 3 } .radio-tabs-header input:checked + span:after { content: ''; position: absolute; bottom: 13px; left: 15px; width: calc(100% - 30px); height: 3px; background: rgb(222, 57, 25) } .bg-red .radio-tabs-header input:checked + span:after { background: rgb(255, 255, 255) } .bg-red .featured .radio-tabs-header input:checked + span:after { background: rgb(222, 57, 25) } .bg-light-gray .radio-tabs-header input:checked + span { box-shadow: inset 0 -1px 0 0 #f8f8f8; } .bg-red .radio-tabs-header input:checked + span { box-shadow: inset 0 -1px 0 0 #de3919; } .bg-marine .radio-tabs-header input:checked + span { box-shadow: inset 0 -1px 0 0 #002c5f; } .bg-clay .radio-tabs-header input:checked + span { box-shadow: inset 0 -1px 0 0 #ada398; } .bg-clay10 .radio-tabs-header input:checked + span { box-shadow: inset 0 -1px 0 0 #948a7f; } .bg-clay20 .radio-tabs-header input:checked + span { box-shadow: inset 0 -1px 0 0 #7b7166; } .bg-rock .radio-tabs-header input:checked + span { box-shadow: inset 0 -1px 0 0 #4e4e4e; } .bg-rock-90 .radio-tabs-header input:checked + span { box-shadow: inset 0 -1px 0 0 #393939; } .bg-rock-80 .radio-tabs-header input:checked + span { box-shadow: inset 0 -1px 0 0 #717171; } .bg-rock-60 .radio-tabs-header input:checked + span { box-shadow: inset 0 -1px 0 0 #959595; } .bg-rock-40 .radio-tabs-header input:checked + span { box-shadow: inset 0 -1px 0 0 #b8b8b8; } .bg-rock-20 .radio-tabs-header input:checked + span { border-color: #fff; box-shadow: inset 0 -1px 0 0 #dcdcdc; } .bg-rock-20 .radio-tabs-shadow { box-shadow: inset 0 -1px 0 0 #fff; } .bg-light-gray .radio-tabs-header input:checked + span { box-shadow: inset 0 -1px 0 0 #f8f8f8; } .row.featured .radio-tabs-header input:checked + span { box-shadow: inset 0 -1px 0 0 rgb(248, 248, 248); } .radio-tabs-compact > .radio-tabs-inner > .radio-tabs-header > span { padding-left: 0; padding-right: 0; padding-bottom: 10px; padding-top: 0px; margin-right: 1rem; font-size: 1rem; border: 0 !important; /* fixes a 1px jump when switching tabs */ } .radio-tabs-compact > .radio-tabs-inner > .radio-tabs-header > input:checked + span { border: 0; box-shadow: none; color: rgb(73, 151, 183) } .radio-tabs-compact > .radio-tabs-inner > .radio-tabs-header > input:checked + span:after { width: 100%; left: 0; bottom: 0; background: rgb(73, 151, 183); } .radio-tabs-compact .radio-tabs-inner { box-shadow: inset 0 -1px 0 0 rgb(220, 220, 220); } .radio-tabs-shadow { display: block; position: relative; z-index: 1; width: 100%; box-shadow: inset 0 -1px 0 0 rgb(220, 220, 220); height: 1px; margin-top: -1px; } .radio-tabs-content-wrapper { padding: 0.75rem 0; border: 0 } .radio-tabs-content-wrapper.wrapper-border { padding: 0.9375rem; border: 1px solid rgb(220, 220, 220); border-top: 0; } .radio-tabs-content { padding: 0.5rem 0; -webkit-transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), height 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), height 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) } .radio-tabs-content > .tab-item:first-child { margin-top: 20px; } .radio-tabs-content > .tab-item:last-child { margin-bottom: 20px; } .radio-tabs-active .radio-tabs-content.show-tab { visibility: visible; opacity: 1; height: auto; overflow: visible; padding: 0.5rem 0; } .radio-tabs-active .radio-tabs-content, .radio-tabs-init-hidden .radio-tabs-content { visibility: hidden; opacity: 0; position: relative; height: 0; overflow: hidden; padding: 0; } /* SIX-3548: make sure tabs do not break if they have display: block */ .radio-tabs-inner { display: -webkit-box; display: flex; } .tab-item { margin: 40px 0; } @media (min-width: 48em) { .radio-tabs-content-wrapper { min-height: 200px; } } @media (max-width: 47.999em) { .radio-tabs { position: relative; margin-left: -1rem; margin-right: -1rem; width: auto; } /* get rid of the gradient shadow on colorful backgrounds. */ .bg-red .radio-tabs:before, .bg-marine .radio-tabs:before, .bg-rock .radio-tabs:before, .bg-clay .radio-tabs:before, .bg-petrol .radio-tabs:before { display: none; } .radio-tabs-compact { margin-left: 0; margin-right: 0 } .radio-tabs-compact .radio-tabs-content-wrapper { padding-left: 0; padding-right: 0; } .radio-tabs-compact .radio-tabs-inner { padding-left: 0; padding-right: 0; } .radio-tabs-content-wrapper { position: relative; z-index: 2; padding-left: 1rem; padding-right: 1rem; } .radio-tabs-inner { white-space: nowrap; overflow: auto; position: relative; width: 100%; padding: 0 16px; } } /* Sticky tabs variation */ .radio-tabs-sticky { position: relative } .radio-tabs-sticky .radio-tabs-inner { position: -webkit-sticky; position: sticky; top: 114px; z-index: 4; padding-top: 8px; background-color: rgb(255, 255, 255); box-shadow: inset 0 -1px 0 0 rgb(220, 220, 220); /* part 1 of 2 of a trick to make the tabs stop being sticky before hitting bottom */ margin-bottom: 80vh } .conter-inverted .radio-tabs-sticky .radio-tabs-inner { box-shadow: inset 0 -1px 0 0 rgb(255, 255, 255) } .bg-red .radio-tabs-sticky .radio-tabs-inner { background-color: rgb(222, 57, 25) } .bg-rock .radio-tabs-sticky .radio-tabs-inner { background-color: rgb(78, 78, 78) } .bg-rock-90 .radio-tabs-sticky .radio-tabs-inner { background-color: rgb(57, 57, 57) } .bg-rock-80 .radio-tabs-sticky .radio-tabs-inner { background-color: rgb(113, 113, 113) } .bg-rock-60 .radio-tabs-sticky .radio-tabs-inner { background-color: rgb(149, 149, 149) } .bg-rock-40 .radio-tabs-sticky .radio-tabs-inner { background-color: rgb(184, 184, 184) } .bg-rock-20 .radio-tabs-sticky .radio-tabs-inner { background-color: rgb(220, 220, 220) } .bg-light-gray .radio-tabs-sticky .radio-tabs-inner { background-color: rgb(248, 248, 248) } .bg-clay .radio-tabs-sticky .radio-tabs-inner { background-color: rgb(173, 163, 152) } .bg-clay10 .radio-tabs-sticky .radio-tabs-inner { background-color: rgb(148, 138, 127) } .bg-clay20 .radio-tabs-sticky .radio-tabs-inner { background-color: rgb(123, 113, 102) } .bg-marine .radio-tabs-sticky .radio-tabs-inner { background-color: rgb(0, 44, 95) } .bg-petrol .radio-tabs-sticky .radio-tabs-inner { background-color: var(--color-petrol) } .row.featured .radio-tabs-sticky .radio-tabs-inner { background-color: rgb(248, 248, 248) } .radio-tabs-sticky .radio-tabs-content-wrapper { margin-top: -80vh; /* part 2 of 2 of a trick to make the tabs stop being sticky before hitting bottom */ } .radio-tabs-sticky .radio-tabs-shadow { display: none; /* this needs to be hidden to support the negative margin trick */ } /* Sticky tabs and .sticky-inpage-nav on page */ .product-sidebar.sticky-inpage-nav ~ .section .radio-tabs-sticky .radio-tabs-inner { top: calc(114px + 59px); } /* Sticky tabs and #inpage-nav on page */ #inpage-nav ~ .page-content .section .radio-tabs-sticky .radio-tabs-inner { top: calc(114px + 62px); } /* Sticky tabs and .sticky-inpage-nav and #inpage-nav on page */ #inpage-nav ~ .page-content .product-sidebar.sticky-inpage-nav ~ .section .radio-tabs-sticky .radio-tabs-inner { top: calc(114px + 62px + 59px); } /* Sticky tabs inside Sticky tabs */ .radio-tabs-sticky .radio-tabs-sticky .radio-tabs-inner { top: calc(114px + 65px + -1px); z-index: 3; } /* Sticky tabs inside Sticky tabs and .sticky-inpage-nav on page */ .product-sidebar.sticky-inpage-nav ~ .section .radio-tabs-sticky .radio-tabs-sticky .radio-tabs-inner { top: calc(114px + 59px + 65px + -1px); } /* Sticky tabs inside Sticky tabs and #inpage-nav on page */ #inpage-nav ~ .page-content .section .radio-tabs-sticky .radio-tabs-sticky .radio-tabs-inner { top: calc(114px + 62px + 65px + -1px); } /* Sticky tabs inside Sticky tabs and .sticky-inpage-nav and #inpage-nav on page */ #inpage-nav ~ .page-content .product-sidebar.sticky-inpage-nav ~ .section .radio-tabs-sticky .radio-tabs-sticky .radio-tabs-inner { top: calc(114px + 62px + 59px + 65px + -1px); } @media (max-width: 63.999em) { .radio-tabs { padding-left: 1rem; padding-right: 1rem; } .radio-tabs-inner { padding-left: 0; padding-right: 0; } .radio-tabs-sticky .radio-tabs-inner { top: -1px; } /* Sticky tabs and #inpage-nav on page */ #inpage-nav ~ .page-content .section .radio-tabs-sticky .radio-tabs-inner { top: -1px; } /* Sticky tabs and .sticky-inpage-nav on page */ .product-sidebar.sticky-inpage-nav ~ .section .radio-tabs-sticky .radio-tabs-inner { top: 59px; } /* Sticky tabs and .sticky-inpage-nav and #inpage-nav on page */ #inpage-nav ~ .page-content .product-sidebar.sticky-inpage-nav ~ .section .radio-tabs-sticky .radio-tabs-inner { top: calc(59px - 1px); } /* Sticky tabs inside Sticky tabs */ .radio-tabs-sticky .radio-tabs-sticky .radio-tabs-inner { top: calc(65px + -1px + -1px); } /* Sticky tabs inside Sticky tabs and #inpage-nav on page */ #inpage-nav ~ .page-content .section .radio-tabs-sticky .radio-tabs-sticky .radio-tabs-inner { top: calc(65px + -1px + -1px); } /* Sticky tabs inside Sticky tabs and .sticky-inpage-nav on page */ .product-sidebar.sticky-inpage-nav ~ .section .radio-tabs-sticky .radio-tabs-sticky .radio-tabs-inner { top: calc(59px + 65px + -1px); } /* Sticky tabs inside Sticky tabs and .sticky-inpage-nav and #inpage-nav on page */ #inpage-nav ~ .page-content .product-sidebar.sticky-inpage-nav ~ .section .radio-tabs-sticky .radio-tabs-sticky .radio-tabs-inner { top: calc(59px - 1px + 65px + -1px); } } :root { /* 5/2 */ } .header-image-wrapper { position: relative; width: 100%; overflow: hidden; position: relative; display: -webkit-box; display: flex; -webkit-box-flex: 1; flex: 1; -ms-flex: 1 1 auto; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; } .nav-image { height: 15.5rem; overflow: hidden; z-index: 1; position: relative } .nav-image .action-call { position: relative; top: calc(15.5rem / 2); left: 0; -webkit-transform: translateY(-50%); transform: translateY(-50%); text-align: center; z-index: 5 } .nav-image .action-call .call-text { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-size: 1rem; color: rgb(255, 255, 255); width: 100%; max-width: 85vw; margin: 0 auto; } .nav-image .action-call .call-link a { margin-top: 0.8rem; margin-bottom: 9px; } .nav-image .image-shade { background-color: rgba(57, 57, 57, 0.2); position: absolute; height: 100%; width: 100%; z-index: 2; } /* object-fit cover fallback only works with fixed aspect ratio! */ .nav-image .cover { position: absolute; left: 50%; top: 50%; right: 0; bottom: 0; z-index: 1; width: 100%; min-width: calc(15.5rem * 2.5); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } @media (min-width: 48em) and (max-width: 80.124em) { .nav-image { height: 20rem; } } @media (min-width: 64em) { .nav-image { height: 100% } .nav-image .cover { min-width: calc(32.000rem * 2.5); } } /* TODO: try to move this to image-cover.css */ .nav-image .cover-top { top: 0; -webkit-transform: translate(-50%, 0%); transform: translate(-50%, 0%); } .nav-image .cover-center { top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .nav-image .cover-bottom { top: 100%; -webkit-transform: translate(-50%, -100%); transform: translate(-50%, -100%); } @supports (object-fit: cover) { .nav-image .cover { -webkit-transform: none; transform: none; min-width: 0; left: 0; top: 0; height: 100%; width: 100%; object-fit: cover; object-position: center; } } /* * Header anchor teaser list element definitions */ .header-anchor { position: relative; width: 100%; height: auto; z-index: 2; -webkit-box-ordinal-group: 3; order: 2; display: block; -webkit-box-flex: 1; flex: 1; -ms-flex: 1 1 auto; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; flex-wrap: nowrap; -webkit-box-pack: start; justify-content: flex-start; align-content: stretch; -webkit-box-align: start; align-items: flex-start; align-self: stretch } .header-anchor ul { list-style: none; margin-left: 0; margin-bottom: 0; /* SIX-5040: fixes great flex rounding error on chrome 1px missing */ width: 100.01%; } .header-anchor ul li { margin-bottom: 0; } .header-anchor-left, .header-anchor-right { display: -webkit-box; display: flex; -webkit-box-ordinal-group: 1; order: 0; -webkit-box-flex: 0; flex: 0 1 auto; align-self: stretch; background-color: rgba(0, 44, 95, 0.5); /* 50% marine */ } .header-anchor-right { background-color: rgba(0, 44, 95, 0.9); /* 90% marine */ } .header-anchor-center { -webkit-box-ordinal-group: 1; order: 0; -webkit-box-flex: 1; flex: 1; -ms-flex: 1 1 auto; align-self: auto; position: relative; } .header-anchor-list { -webkit-box-align: stretch; align-items: stretch; /*align-content: stretch;*/ align-self: auto; display: -webkit-box; display: flex; -webkit-box-flex: 1; flex: 1 1 auto; flex-basis: 100%; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; flex-wrap: nowrap; margin: 0; height: auto; overflow: hidden; padding: 0; position: relative; top: auto; bottom: 0; } .header-anchor-item { display: -webkit-box; display: flex; -webkit-box-flex: 1; flex: 1 1 auto; align-self: stretch; background-color: rgba(0, 44, 95, 0.5); /* 50% marine */ -webkit-transition: background-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: background-color 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) } .header-anchor-item:nth-child(2) { background-color: rgba(0, 44, 95, 0.55); /* 55% marine */ } .header-anchor-item:nth-child(3) { background-color: rgba(0, 44, 95, 0.6); /* 60% marine */ } .header-anchor-item:nth-child(4) { background-color: rgba(0, 44, 95, 0.7); /* 70% marine */ } .header-anchor-item:nth-child(5) { background-color: rgba(0, 44, 95, 0.8); /* 80% marine */ } .header-anchor-item:nth-child(6) { background-color: rgba(0, 44, 95, 0.9); /* 90% marine */ } .header-anchor-item:hover { background-color: rgba(0, 44, 95, 0.95); /* 95% marine */ } .header-anchor-link { display: block; height: 100%; width: 100%; } .header-anchor-inner, .header-anchor-teaser { height: 100%; } .header-anchor-teaser { position: relative; color: rgb(255, 255, 255); padding: 0.75rem 1rem; max-height: 100%; } .header-anchor-content { display: none; font-size: 0.875rem; font-weight: 400; opacity: 0; height: auto; max-height: 0; overflow: hidden; } .header-anchor-teaser-title { color: inherit; display: inline; font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-size: 1.25rem; font-weight: 400; margin-bottom: 0; } .home-header .header-anchor-teaser .lead { color: rgb(255, 255, 255); margin-bottom: 0; margin-top: 0; white-space: nowrap; } .header-anchor-teaser .lead .fa.sp-cheveron-right { font-size: .8rem; padding-left: .2rem; } .header-anchor-teaser-link { position: relative; font-size: 0; } .header-anchor-teaser-icon { padding-left: 4px; } @media (min-width: 48em) { .nav-image .action-call .call-text { font-size: 1.35rem; width: 80%; max-width: 66rem; } .header-anchor { position: absolute; display: -webkit-box; display: flex; top: auto; bottom: 0; left: 0 } .header-anchor ~ .nav-image .action-call { -webkit-transform: translateY(-85%); transform: translateY(-85%); } .header-anchor-list { -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; } .header-anchor-teaser { padding: .5rem .5rem 2.25rem .5rem; } .header-anchor-teaser .lead { position: relative; top: .75rem; } .header-anchor-teaser-title { display: block; font-size: 1.25rem; } .header-anchor-teaser-link { font-size: 0.875rem; position: absolute; top: auto; bottom: 0.75rem; } } @media (min-width: 64em) { .header-image-wrapper { height: 32.000rem } .header-image-wrapper .action-call { top: calc(32.000rem / 2); } .nav-image .action-call { position: relative; top: calc(32.000rem / 2); left: 0; -webkit-transform: translateY(-35%); transform: translateY(-35%); text-align: center } .nav-image .action-call .call-text { max-width: 66rem; font-size: 2rem; } .nav-image .action-call .call-link a { margin-top: 2.5rem; } .header-anchor:hover ~ .nav-image .action-call { opacity: 0.3; } .header-anchor ~ .nav-image .action-call { opacity: 1; -webkit-transform: translateY(-80%); transform: translateY(-80%); -webkit-transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); } .header-anchor-teaser-title { display: block; font-size: 1.5rem; } .header-anchor-content { display: block; -webkit-transition: max-height 0.4s 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), opacity 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: max-height 0.4s 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), opacity 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955) } .header-anchor-list:hover .header-anchor-content { opacity: 1; max-height: 10rem; -webkit-transition: max-height 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955), opacity 0.4s 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: max-height 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955), opacity 0.4s 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955) } .header-anchor-teaser { -webkit-transition: max-height 0.4s 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: max-height 0.4s 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955) } .header-anchor-list:hover .header-anchor-teaser { height: 100%; max-height: 400px; -webkit-transition: max-height 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: max-height 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955) } .header-anchor-left, .header-anchor-right { -webkit-box-flex: 1; flex: 1; -ms-flex: 1 1 auto; } .header-anchor-center { width: 100%; flex-basis: 100%; max-width: calc(1282px - 32px); } } @media (min-width: 80.125em) { .header-anchor-teaser { padding: 0.75rem 2rem 2.25rem 2rem; } } @media print { .nav-image { height: auto } .nav-image .cover { display: none; } .nav-image .action-call { -webkit-transform: none; transform: none } .nav-image .action-call .call-text { color: rgb(113, 113, 113); } .header-anchor ~ .nav-image .action-call { -webkit-transform: none; transform: none; } } .hero-header { padding: 0; position: relative } .hero-header.container, .hero-header .hero-header-inner { max-width: 100%; padding-left: 0; padding-right: 0; } .hero-header figure { margin: 0; } .hero-header .bg-image { display: none; } .hero-header-copy { margin-bottom: 10px; margin-top: 30px; } .hero-header-bg-full img { display: block; width: 100%; } .hero-header-bg-full { /* slightly better loading */ } .hero-header-bg-full img:not([src]) { padding-bottom: calc(40% - 26px); } @media (min-width: 48em) { .hero-header-inner { position: relative; } .hero-header-copy { margin-top: 50px; margin-bottom: 30px; } .hero-header-inner .fig { padding-left: 16px; padding-right: 16px; position: relative } .hero-header-inner .fig:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(57, 57, 57, 0.2); } .hero-header { margin-bottom: 0 /* SIX-5076: adds support for small hero header */ } .hero-header.hero-half .hero-header-inner { min-height: 250px; padding-bottom: 20%; } .hero-header.hero-half .hero-header-bg-full { bottom: 0; overflow: hidden; position: absolute; top: 0; width: 100% } .hero-header.hero-half .hero-header-bg-full .fig { height: 100% } .hero-header.hero-half .hero-header-bg-full img { position: absolute; z-index: -1; } .hero-header.hero-half .hero-header-copy { padding: 32px 0; position: absolute } .hero-header.hero-half .hero-header-copy .lead { margin-bottom: 0; } .hero-header .hero-header-copy { position: absolute; width: 100%; height: 100%; left: 0; top: 0; text-align: center; margin-top: 0; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; margin-bottom: 0 } .hero-header .hero-header-copy .column_6 { margin-left: 0; } .hero-header .hero-header-copy .container { -webkit-box-flex: 1; flex: 1 auto; margin: 0; } .hero-header .hero-header-copy, .hero-header .hero-header-copy h1, .hero-header .hero-header-copy .breadcrumbs, .hero-header .hero-header-copy .lead { color: rgb(255, 255, 255); } .hero-header .hero-header-copy .breadcrumbs a:hover { color: rgba(255, 255, 255, .8); } .hero-header .fig { padding-left: 0; padding-right: 0; } @supports (object-fit: cover) { .hero-header.hero-half .hero-header-bg-full img { height: 100%; object-fit: cover; top: auto; -webkit-transform: none; transform: none; width: 100%; } } .hero-header.hero-half .hero-header-bg-full img.cover.cover-center { top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); } .hero-header.hero-half .hero-header-bg-full img.cover.cover-bottom { top: 100%; -webkit-transform: translate(0, -100%); transform: translate(0, -100%); } } @supports (object-fit: cover) { .hero-header.hero-half .hero-header-bg-full img.cover.cover-center, .hero-header.hero-half .hero-header-bg-full img.cover.cover-bottom { top: auto; -webkit-transform: none; transform: none; } } @media (min-width: 64em) { .hero-header + .page-content, .main:not(.with-service-bar) header + .page-content { position: relative; } .hero-header-copy { margin-top: 58px; } .hero-header-copy .container, .hero-header-inner .fig { padding-left: 0; padding-right: 0; } } .page-header { position: relative; margin-bottom: 10px } .page-header.container { /* increased specifity TODO: decrease maybe */ padding-top: 30px; } .page-header figure { margin: 0; } .page-header-inner .fig { margin-top: 40px; } .page-header .bg-image { display: none; } @media (max-width: 63.999em) { .page-header.container { padding-left: 0; padding-right: 0; } } @media (min-width: 48em) { .page-header { padding-top: 50px; } .page-header-inner { position: relative; } .page-header-inner .fig { padding-left: 16px; padding-right: 16px; } } @media (min-width: 64em) { .page-header .container, .page-header-inner .fig { padding-left: 0; padding-right: 0; } /* rare case: on overview pages without lead image, we change to standard page-header */ .landing-page .page-header.container { padding: 0; } .landing-page .page-header-inner { padding: 4rem 0 50px 0; text-align: center; } } .security-header, .share-header { font-size: 0.875rem; /* 14/16 */ padding: 1rem; margin-top: 20px; margin-bottom: 20px; box-shadow: -5px 0px 10px 0 rgba(0, 0, 0, 0.08), 10px 10px 20px 0 rgba(0, 0, 0, 0.05); } .column_5 > .security-header { margin-top: 0; margin-bottom: 20px; } .security-header-meta { border-bottom: 4px solid rgb(222, 57, 25) } .security-header-meta span { display: block } .security-header-meta span:first-child { margin-right: 1rem; } .security-header-meta, .security-header-datetime, .security-header-logo { margin-bottom: 20px; } .security-header-meta, .security-header-price-container, .security-header-datetime dl { display: -webkit-box; display: flex; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: end; align-items: flex-end; padding: 4px 0; } .security-header-change { -webkit-box-flex: 1; flex: 1; text-align: right; font-weight: 700 } .security-header-change span { display: block; } .security-header-logo img { max-width: 200px; max-height: 100px; height: auto; width: auto; } .security-header-price { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif; font-size: 2rem; /* 32/16 */ font-weight: 700; line-height: 1.04; color: rgb(57, 57, 57) } .security-header-price span { font-size: 1rem; } .security-header-datetime { border-top: 1px solid rgb(220, 220, 220) } .security-header-datetime dt, .security-header-datetime dd { display: block; } .security-header-datetime dd { margin-left: 0; } .security-header-datetime dt { margin-right: 1rem; font-weight: 700; } .security-header-chart .chart { max-width: 100%; height: 200px; } .security-header-filter .field:first-child { padding-top: 0; } .share-header-values { width: 100% } .share-header-values .radio-tabs-content-wrapper { padding-bottom: 0; } .share-header-left .title, .share-header-right .title { margin: 1rem 0 0.25rem; } .share-header-left { display: block; color: inherit; font-weight: inherit } .share-header-left:hover { color: inherit; font-weight: inherit; } .share-header-left .security-header-price-container { padding-top: 11px; } .share-header-right .table-inner { margin-bottom: 0; } .share-header-chart .chart { height: 180px; } @media (max-width: 63.999em) { .share-content .column_4, .share-content .column_8 { flex-basis: 100%; max-width: 100%; } } @media (min-width: 64em) { .security-header { padding: 20px; margin-bottom: 80px; } .share-header { padding: 20px; margin-bottom: 0; } .security-header-meta, .security-header-datetime, .security-header-logo { margin-bottom: 40px; } .security-header-inner { display: -webkit-box; display: flex; } .security-header-values { width: 33.333%; } .column_5 > .security-header .security-header-values { width: 100%; } .security-header-chart { width: 66.666%; padding-left: 20px } .security-header-chart .chart { height: 300px; } .security-header-values .security-header-chart { width: 100%; padding-left: 0; } } .home-header { color: rgb(255, 255, 255); margin-bottom: 20px } .home-header h1, .home-header h2 { text-align: left; } .home-header .lead { text-align: left; font-weight: 400; font-size: 1.125em; line-height: 1.5; margin-top: 0; margin-bottom: 1em; } .home-header .container { margin-top: 2rem; } @media (max-width: 47.999em) { .home-header .textimage p { font-size: 0.75em; } } @media (min-width: 30em) { .home-header { margin-bottom: 25px } .home-header h1, .home-header h2 { text-align: center; } .home-header .lead { text-align: center; font-size: 1.25rem; margin-top: 1.25rem; } .home-header .container { margin-top: 3rem; } } @media (min-width: 48em) { .home-header { margin-bottom: 30px; } } @media (min-width: 64em) { .home-header .container { margin-top: 4rem; } .home-header { margin-bottom: 50px; } } @media (min-width: 30em) and (max-width: 63.999em) { .home-header .column_8 { flex-basis: 83.33333333%; max-width: 83.33333333%; } } /* structural styles are copy of page-header */ .article-header { position: relative; margin-bottom: 10px /* SIX-SIX-4524: according to email with Lisa, das passt schon :) */ /* text-align: center; */ } .article-header.container { /* SIX-7638 too wide header in blog posts compared to content */ padding-top: 30px; } .article-header .fig, .article-header .lead { margin-top: 40px; } .article-header .fig img { display: block; } .article-header figure { margin: 0; } .article-header .article-date { font-size: 0.625rem; text-transform: uppercase; font-family: "Noto Sans", Helvetica, Arial, sans-serif; font-weight: 700; color: rgb(184, 184, 184); padding-top: 5px; } .article-header .bg-image { display: none; } @media (min-width: 48em) { .article-header { padding-top: 50px; margin-bottom: 30px; } .article-header-inner { position: relative; } .article-header-inner .fig { padding-left: 16px; padding-right: 16px; } } @media (min-width: 64em) { .article-header .container, .article-header-inner .fig { padding-left: 0; padding-right: 0; } } .content-footer { display: -webkit-box; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; flex-wrap: nowrap; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; position: relative; /* TODO: Check if this should this really be em?*/ font-size: 0.750em; padding: 20px 0; margin-top: 120px; /* Default setting without separator should have less bottom spacing on main */ margin-bottom: -40px } .content-footer .content-footer-social, .content-footer .social_share { -webkit-box-flex: 1; flex: 1; /* Needed because of the different interpretation on IE11 and Safari */ -ms-flex: 1 1 auto; } .content-footer ul { margin: 0; list-style-type: none } .content-footer ul li { display: inline-block; vertical-align: bottom; padding: 0px 8px; margin-bottom: 0; } .content-footer .section { /* * This is needed as on some detail/home pages there are rules that affect * the styling otherwise */ margin: 0 !important; } .content-footer.separator { border-bottom: 1px solid rgb(220, 220, 220); margin-top: 80px; margin-bottom: 40px; } .content-footer-social, .social_share { text-align: center } .content-footer-social a, .social_share a { font-size: 1rem; color: rgb(57, 57, 57) } .content-footer-social a:hover, .social_share a:hover { color: #4997b7; } .content-footer-social a, .social_share a { /* Remove the "external link arrow" */ } .content-footer-social a::after, .social_share a::after { content: none !important; } .content-footer-social .title, .social_share .title { display: block; line-height: 1.75; margin-bottom: 20px; } .content-footer-social h6, .social_share h6 { margin-bottom: 3px; } .social_share .sp-printer, .social_share .fa-print { position: relative; top: 3px; margin-left: 12px } .social_share .sp-printer:after, .social_share .fa-print:after { content: ''; display: block; position: absolute; width: 2px; height: 120%; top: -10%; left: -16px; background: rgb(220, 220, 220); } .content-footer-scroll-top { position: absolute; right: 0; /* Prevents miscalculation of position on Firefox */ bottom: 20px } .content-footer-scroll-top a { display: inline-block; -webkit-transform: rotate(-90deg) translateX(100%); transform: rotate(-90deg) translateX(100%); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; min-width: 120px; /* fix transition bug when width has decimals */ } .content-footer-scroll-top span { display: inline-block; margin-left: 10px; position: relative; bottom: -1px; -webkit-transform: none; transform: none; -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: -webkit-transform 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: transform 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); transition: transform 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955), -webkit-transform 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955); } .content-footer-scroll-top a:hover span { -webkit-transform: translateX(10px); transform: translateX(10px); } .content-footer-scroll-top path { stroke: currentColor; fill: none; } .content-footer-teaser { margin-bottom: 40px } .content-footer-teaser img { display: block; margin-bottom: 15px; } .content-footer-teaser p { color: rgb(113, 113, 113); font-weight: 400; font-size: 0.875em; margin-bottom: 1.1rem; } .content-footer-teaser .teaser-link { font-size: 0.750em; } .content-footer-teaser-header { text-align: center; margin-bottom: 25px } .content-footer-teaser-header h2 { margin-bottom: 5px; } .content-footer-teaser-header a { font-size: 0.875em; } .content-footer-teaser-content { box-shadow: 1px -1px 30px 0 rgba(0, 0, 0, 0.06); } .content-footer-teaser-item { display: block; padding: 25px 10px; } .footer_logo { text-align: center } .footer_logo img { margin: 10px 0; max-width: 440px; width: 90%; } @media (min-width: 30em) { .content-footer.separator, .content-footer-teaser { margin-bottom: 60px; } .social_share .title { display: inline-block; margin-bottom: 0; margin-right: 1rem; } /* SIX-4525: moves title before the list */ .content-footer .content-footer-social, .content-footer .social_share { display: -webkit-box; display: flex; vertical-align: baseline; /* text-align: center; */ -webkit-box-align: end; align-items: flex-end; -webkit-box-pack: center; justify-content: center; } } @media (min-width: 64em) { .footer_logo img { margin: 30px 0; } } @media (min-width: 80.125em) { .content-footer-teaser-item { padding-right: 0; padding-left: 0; } } @media (max-width: 47.999em) { .content-footer-teaser .column { flex-basis: 100%; margin-bottom: 25px; } } @media print { .social_share, .content-footer .social_share, .content-footer-scroll-top { display: none; } } .row { box-sizing: border-box; display: -webkit-box; display: flex; -webkit-box-flex: 0; flex: 0 1 auto; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; flex-wrap: wrap; margin-right: -8px; margin-left: -8px; } /* .column class is for 5-columns-row (unfortunate naming due to backend implementation) */ .column, .column_1, .column_2, .column_3, .column_4, .column_5, .column_6, .column_7, .column_8, .column_9, .column_10, .column_11, .column_12 { box-sizing: border-box; display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-box-flex: 0; flex: 0 0 auto; padding-right: 8px; padding-left: 8px; position: relative; } .column_3, .column_4, .column_5, .column_6, .column_7, .column_8, .column_9, .column_10, .column_11, .column_12 { word-break: break-word; } .column { -webkit-box-flex: 1; flex-grow: 1; flex-basis: 0; max-width: 100%; } .column_1, .column_2 { flex-basis: 33.33333333%; max-width: 33.33333333%; } /* column class is for 5-columns-row (unfortunate naming due to backend implementation) */ .column, .column_3, .column_4, .column_5, .column_6, .column_7, .column_8, .column_9, .column_10, .column_11, .column_12 { flex-basis: 100%; max-width: 100%; } @media (min-width: 48em) { .row:not(.grid--footer-columns) .column { flex-basis: 33%; max-width: 33%; margin-bottom: .8em; } } @media (max-width: 63.999em) { .row.row--reversed-mobile-order { -webkit-box-orient: vertical; -webkit-box-direction: reverse; flex-direction: column-reverse; } } @media (min-width: 64em) { .row:not(.grid--footer-columns) .column { flex-basis: 20%; max-width: 20%; } .column_1 { flex-basis: 8.33333333%; max-width: 8.33333333%; } .column_2 { flex-basis: 16.66666667%; max-width: 16.66666667%; width: 16.66666667%; } .column_3 { flex-basis: 25%; max-width: 25%; } .column_4 { flex-basis: 33.33333333%; max-width: 33.33333333%; } .column_5 { flex-basis: 41.66666667%; max-width: 41.66666667%; } .column_6 { flex-basis: 50%; max-width: 50%; } .column_7 { flex-basis: 58.33333333%; max-width: 58.33333333%; } .column_8 { flex-basis: 66.66666667%; max-width: 66.66666667%; } .column_9 { flex-basis: 75%; max-width: 75%; } .column_10 { flex-basis: 83.33333333%; max-width: 83.33333333%; } .column_11 { flex-basis: 91.66666667%; max-width: 91.66666667%; } .column_12 { flex-basis: 100%; max-width: 100%; } } @media print { .row { page-break-inside: avoid; } } .row.reverse { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; flex-direction: row-reverse; } .row.separator [class^="column_"], .row.separator [class^="column"] { margin-bottom: 40px; padding-bottom: 40px } .row.separator [class^="column_"] .textimage:last-child, .row.separator [class^="column"] .textimage:last-child { margin-bottom: 0; } .row.separator [class^="column_"]:after, .row.separator [class^="column"]:after { content: ""; position: absolute; height: 1px; background: rgb(220, 220, 220); bottom: 0; left: 8px; right: 8px; } [dir="ltr"] .row_start { text-align: left; } [dir="rtl"] .row_start { text-align: right; } .row_start { -webkit-box-pack: start; justify-content: flex-start; } .row_center { -webkit-box-pack: center; justify-content: center; text-align: center; } [dir="ltr"] .row_end { text-align: right; } [dir="rtl"] .row_end { text-align: left; } .row_end { -webkit-box-pack: end; justify-content: flex-end; } .row_top { -webkit-box-align: start; align-items: flex-start; } .row_middle { -webkit-box-align: center; align-items: center; } .row_bottom { -webkit-box-align: end; align-items: flex-end; } .row_around { justify-content: space-around; } .row_between { -webkit-box-pack: justify; justify-content: space-between; } .column_first { -webkit-box-ordinal-group: 0; order: -1; } .column_last { -webkit-box-ordinal-group: 2; order: 1; } .row.featured { padding: 40px 20px; margin-left: 0; margin-right: 0; background-color: rgb(248, 248, 248) /* SIX-4752: applies link color in featured grid */ } .row.featured a:not(.btn) { color: #4997b7; } .row.featured a:not(.btn):hover { color: #4a7485; } .row.featured .label { color: rgb(184, 184, 184); text-transform: uppercase; font-size: 0.75rem; /* 12/16 */ font-weight: 700; margin-bottom: .7em; } .row.featured.separator .list-teaser-horizontal:after { content: none !important; display: none !important; } /* SIX-5461: adds featured columns */ .row.featured.borderedColumns, .row.featured.featuredColumns { background-color: transparent; border: none; padding: 0 } .row.featured.borderedColumns [class^="column_"], .row.featured.borderedColumns [class^="column"], .row.featured.featuredColumns [class^="column_"], .row.featured.featuredColumns [class^="column"] { padding: 40px 20px; } .row.borderedColumns, .row.featuredColumns { -webkit-box-align: stretch; align-items: stretch; -webkit-box-pack: justify; justify-content: space-between; margin-left: 0; margin-right: 0 } .row.borderedColumns [class^="column_"], .row.borderedColumns [class^="column"], .row.featuredColumns [class^="column_"], .row.featuredColumns [class^="column"] { background-color: rgb(248, 248, 248); padding-bottom: 20px; padding-top: 20px; } .row.borderedColumns { background-color: transparent } .row.borderedColumns [class^="column_"], .row.borderedColumns [class^="column"] { background-color: transparent; outline: 1px solid rgb(220, 220, 220); } .row.borderedColumns.borderedColumns--white-bg [class^="column_"], .row.borderedColumns.borderedColumns--white-bg [class^="column"]{ background-color: rgb(255, 255, 255); } @media (max-width: 63.999em) { .row.borderedColumns [class^="column_"], .row.featuredColumns [class^="column_"], .row.borderedColumns [class^="column"], .row.featuredColumns [class^="column"] { margin-bottom: 1.25rem } .row.borderedColumns [class^="column_"]:last-child, .row.featuredColumns [class^="column_"]:last-child, .row.borderedColumns [class^="column"]:last-child, .row.featuredColumns [class^="column"]:last-child { margin-bottom: 0; } .row.borderedColumns .column_4, .row.featuredColumns .column_4 { margin-bottom: 0; } } @media (max-width: 63.999em) { .row.borderedColumns .column_4, .row.featuredColumns .column_4 { margin-bottom: 1.25rem; /* flex-basis: calc(50% - .675rem); max-width: calc(50% - .675rem); */ width: calc(50% - .675rem) } .row.borderedColumns .column_4:last-child, .row.featuredColumns .column_4:last-child { margin-bottom: 0; } } @media (min-width: 48em) and (max-width: 63.999em) { .row.borderedColumns .column_4:first-child, .row.featuredColumns .column_4:first-child { margin-right: 1.25rem; } } @media (max-width: 47.999em) { .row.borderedColumns .column_4, .row.featuredColumns .column_4 { flex-basis: 100%; max-width: 100%; width: 100%; } } @media (min-width: 64em) { .row.borderedColumns, .row.featuredColumns { /* .column class is for 5-columns-row (unfortunate naming due to backend implementation) */ } .row.borderedColumns .column, .row.featuredColumns .column { max-width: calc(20% - 1rem); } .row.borderedColumns .column_1, .row.featuredColumns .column_1 { max-width: calc(8.33333333% - 1rem); } .row.borderedColumns .column_2, .row.featuredColumns .column_2 { max-width: calc(16.66666667% - 1rem); } .row.borderedColumns .column_3, .row.featuredColumns .column_3 { max-width: calc(25% - 1rem); } .row.borderedColumns .column_4, .row.featuredColumns .column_4 { flex-basis: calc(33.33333333% - 1rem); /* IE11 */ max-width: calc(33.33333333% - 1rem); } .row.borderedColumns .column_5, .row.featuredColumns .column_5 { max-width: calc(41.66666667% - 0.75rem); } .row.borderedColumns .column_6, .row.featuredColumns .column_6 { max-width: calc(50% - 0.675rem); } .row.borderedColumns .column_7, .row.featuredColumns .column_7 { max-width: calc(58.33333333% - 0.675rem); } .row.borderedColumns .column_8, .row.featuredColumns .column_8 { max-width: calc(66.66666667% - 0.675rem); } .row.borderedColumns .column_9, .row.featuredColumns .column_9 { max-width: calc(75% - 0.675rem); } .row.borderedColumns .column_10, .row.featuredColumns .column_10 { max-width: calc(83.33333333% - 0.675rem); } .row.borderedColumns .column_11, .row.featuredColumns .column_11 { max-width: calc(91.66666667% - 0.675rem); } .row.borderedColumns .column_12, .row.featuredColumns .column_12 { max-width: 100%; } } /* MAGIC */ @media (max-width: 63.999em) { .section .column_4 { display: -webkit-box; display: flex; -webkit-box-flex: 1; flex: 1; /* flex-basis: 50%; max-width: 50%;*/ width: 50%; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; align-content: flex-start; } .section .column_4:nth-child(3n) { flex-basis: 100%; max-width: 100%; width: 100%; } } @media (max-width: 47.999em) { .section .column_4 { flex-basis: 100%; max-width: 100%; width: 100%; } } .main-search { border-top: 1px solid rgb(220, 220, 220); } .main-search__form:not(.main-search__form--single):first-child { border-bottom: 1px solid rgb(220, 220, 220); } .main-search__input-field { height: 42px !important; font-size: 1.27rem !important; padding-top: 0; padding-bottom: 0; } .main-search__input-field::-webkit-input-placeholder { color: rgb(149, 149, 149); } .main-search__input-field::-moz-placeholder { color: rgb(149, 149, 149); } .main-search__input-field:-ms-input-placeholder { color: rgb(149, 149, 149); } .main-search__input-field::placeholder { color: rgb(149, 149, 149); } .product-search-form .search-row { position: relative; } .product-search-form__spinner-bg { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.4); } .product-search-form__spinner-bg.product-search-form__spinner-bg--visible { display: block; } .product-search-form__spinner-wrapper { position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } @media (min-width: 48em) { .main-search { display: -webkit-box; display: flex; -webkit-box-pack: justify; justify-content: space-between; } .main-search__form { width: 49%; padding-top: 0.55rem; padding-bottom: 0.55rem; margin-bottom: 0.55rem; border-bottom: 1px solid rgb(220, 220, 220); } .main-search__form.main-search__form--single { width: 100%; border-bottom: none; } .main-search__input-field { height: 3.25rem !important; } } @media (min-width: 64em) { .main-search__form .main-search__input-field { font-size: 1.5rem !important; } } /*.search-wrapper .search-form {*/ /* border-top: 1px solid var(--color-rock-20);*/ /*}*/ .search-input-wrapper { -webkit-box-align: center; align-items: center; display: -webkit-box; display: flex; width: 100%; } .search-config { display: none; } .search-field { position: absolute; width: 100%; left: 0; visibility: hidden; opacity: 0; top: 4.0625rem; z-index: 1050; background: rgb(255, 255, 255); -webkit-transition: .3s opacity, visibility 0s .3s; transition: .3s opacity, visibility 0s .3s; box-shadow: 0 10px 10px 0 rgba(0, 0, 0, 0.05), 5px 5px 5px 0 rgba(0, 0, 0, 0.05); } .search-input { margin-bottom: 0; font-weight: 700; font-size: 1.500em; /* Fix for overflow issue on Firefox */ min-width: 0 } .search-input::-ms-clear { display: none; } .search-wrapper .search-input { padding-left: 0; border: 0; height: 2.5em; } .search-input, .search-input:focus { border: none; box-shadow: none; background: transparent; } .nav-division-header-search { margin: 0 15px; } .search-wrapper .search-toggle { display: none; } .search-toggle-open { visibility: visible; opacity: 1; -webkit-transition: .2s .2s opacity, visibility 0s 0s; transition: .2s .2s opacity, visibility 0s 0s; } .search-toggle { background: transparent; color: rgb(57, 57, 57); -webkit-transition: color .3s; transition: color .3s; margin-bottom: 0; position: relative } .search-toggle:hover, .search-toggle:active, .search-toggle:focus { background: transparent; color: rgb(113, 113, 113); } .search-toggle-close { position: absolute; top: 50%; left: 50%; margin-top: -.5rem; margin-left: -.5rem; width: 1rem; height: 1rem; visibility: hidden; opacity: 0; -webkit-transition: .2s opacity, visibility 0s .2s; transition: .2s opacity, visibility 0s .2s } .search-toggle-close svg { display: block; width: 100%; height: 100%; fill: rgb(222, 57, 25); } .search-open .search-field { visibility: visible; opacity: 1; -webkit-transition: .3s opacity, visibility 0s 0s; transition: .3s opacity, visibility 0s 0s; } .search-open .search-toggle-close { visibility: visible; opacity: 1; -webkit-transition: .2s .2s opacity, visibility 0s 0s; transition: .2s .2s opacity, visibility 0s 0s; } .search-open .search-toggle-open { visibility: hidden; opacity: 0; -webkit-transition: .2s opacity, visibility 0s .2s; transition: .2s opacity, visibility 0s .2s; } button.search-submit { margin-bottom: 0; -webkit-transition: background .3s, color .3s; transition: background .3s, color .3s; } .explore-searchbox .search-form { max-width: 400px; margin-left: auto; margin-right: auto; } .explore-searchbox .search-input { font-family: "Noto Sans", Helvetica, Arial, sans-serif; font-size: 1rem; padding: .5em 1.563em; height: 2.750em; font-weight: 400; background: rgba(255, 255, 255, .1); color: rgb(255, 255, 255) } .explore-searchbox .search-input::-webkit-input-placeholder { color: rgba(255, 255, 255, .2); line-height: 1.5; } .explore-searchbox .search-input::-moz-placeholder { color: rgba(255, 255, 255, .2); line-height: 1.5; } .explore-searchbox .search-input:-ms-input-placeholder { color: rgba(255, 255, 255, .2); line-height: 1.5; } .explore-searchbox .search-input::placeholder { color: rgba(255, 255, 255, .2); line-height: 1.5; } .explore-searchbox .btn.search-submit { background: rgba(255, 255, 255, .1); margin-bottom: 0; color: rgb(255, 255, 255); } .explore-searchbox .search-input:focus + .search-submit { background: rgba(255, 255, 255, 1); color: rgb(0, 44, 95); } .explore-searchbox .choices__list--dropdown { position: absolute; z-index: 2; } @media (max-width: 47.999em) { /* mobile only */ .search-wrapper button.search-submit { color: rgb(222, 57, 25); background: transparent } .search-wrapper button.search-submit:focus, .search-wrapper button.search-submit:active, .search-wrapper button.search-submit:hover { /* color: color(var(--color-six-red) shade(10%)); */ color: #c83317; background: transparent; } } @media (min-width: 48em) { .search-wrapper .search-input { font-size: 1.625em; height: 2.9em; } button[type="submit"].btn-icon-only { padding: 0.500em 1.438em; min-width: auto; } .search-wrapper .search-submit .fa { display: none; } .search-wrapper .search-submit .sr-only { position: relative; width: auto; height: auto; overflow: visible; clip: auto; margin: 0; } } @media (min-width: 64em) { .search-field { top: 100%; } .search-wrapper .search-input { font-size: 1.875em; /* SIX: align search input with navigation */ padding-left: 1rem; } .search-wrapper .search-submit { /* SIX: align search button to the right with the menu */ margin-right: 1rem; } .search-wrapper .search-toggle { display: inline-block; } } /* AEM legacy (google search that is depricated) */ .search-page .result a { display: block; } .search-page .result .title a { color: #393939; } .search-page .result .title + p { font-weight: normal; color: rgb(113, 113, 113) } .search-page .result .title + p a { font-size: 0.75rem; } .search-page .result .item { padding: 25px 0 0 0; } .search-page .result .item + .item { margin-top: 2.25rem; border-top: 1px solid rgb(220, 220, 220); } .search-page .result a[target="_blank"]:after { content: none; } .search-page .result { /* results found */ } .search-page .result > p { font-size: 0.875rem; margin-top: .5rem; } /* END AEM legacy */ .search-input-detail { font-family: "Noto Sans Condensed", Helvetica, Arial, sans-serif } .search-input-detail .search-config { display: block; } .search-input-detail .search-input { border: 1px solid rgb(220, 220, 220); border-right: 0; height: 44px; line-height: 44px; padding: 0 20px 0 15px } .search-input-detail .search-input:active, .search-input-detail .search-input:focus { /* border-color: color(var(--color-rock-20) shade(10%)); */ border-color: #c6c6c6; } .search-input-detail .search-input-wrapper { width: 100%; } .search-results-header { margin-top: 40px; } .search-category { -webkit-box-flex: 0; flex: none; margin-top: 20px; white-space: nowrap; overflow: auto; width: 100%; } .search-division { margin-top: 15px; } @media (min-width: 64em) { .search-page .container { padding-left: 0; padding-right: 0; } .search-category { margin-top: 50px; } .search-row { display: -webkit-box; display: flex; } .search-division { margin-left: 30px; margin-top: 0; } .search-results-header { padding-top: 100px; } } /** * Style definitions for the newsboard containers */ .newsboard-list .data-pair-list { margin-top: 1.25rem; margin-bottom: 0.75rem; } .newsboard-list .table-inner { margin: 1.5rem 0 0.75rem; } .newsboard-item { display: block; padding: 2.75rem 0 0.75rem } .newsboard-item + .newsboard-item { border-top: 1px solid rgb(220, 220, 220); } .newsboard-item.newsboard-detail-view { padding: 0; } .newsboard-message { margin-bottom: 0.5rem; } .newsboard-print, .newsboard-open { padding: 0.25rem 0 1.25rem; text-align: right } .newsboard-print .btn, .newsboard-open .btn { margin-bottom: 0; } .contact-detail .fa-ul { font-size: 0.875rem; /* 14/16 */ margin-left: 1.571em; /* 22/14 */ } .contact-detail .adr, .contact-detail .fa-ul { margin-bottom: 20px } .contact-teaser-item { background: white; box-shadow: -5px 0px 10px 0 rgba(0, 0, 0, 0.08), 10px 10px 20px 0 rgba(0, 0, 0, 0.05); padding: 20px; margin: .5rem; width: 100%; max-width: 410px /* flex: 1 auto; */ } .contact-teaser-item .chapter_title { margin-bottom: .8em; } .contact-teaser-item .fa-ul { font-size: 0.875rem; /* 14/16 */ margin-left: 1.571em; /* 22/14 */ } .contact-detail-form { background: rgb(248, 248, 248); padding-top: 30px; padding-bottom: 30px; } .contact-detail-address { padding-top: 30px; padding-bottom: 20px; } .contact-detail-address .fig img { margin-bottom: 20px; } @media (max-width: 63.999em) { .contact-detail { max-width: none; padding: 0; } } @media (min-width: 64em) { .contact-detail { padding-left: 135px } .contact-detail .page_title, .contact-detail .adr, .contact-detail .fa-ul { margin-bottom: 30px } .contact-detail .page_title { margin-top: 10px; } .container .container { padding: 0; } .contact-detail-box { padding-top: 70px; display: -webkit-box; display: flex; } .contact-detail-address { width: 33.333%; padding-top: 0; padding-right: 30px; } .contact-detail-form { width: 66.666%; /* box-shadow: none; */ padding: 56px 8% 50px; } } @media (min-width: 80.125em) { .contact-detail-address { /* padding-left: 119px; */ } } .section, .section.sectioninclude { margin-top: 40px; margin-bottom: 40px; position: relative; } .section > section, .container { width: 100%; margin-right: auto; margin-left: auto; padding-right: 16px; padding-left: 16px; } /* SIX: AEM markup sometimes adds .section */ .section .section, .section.sectioninclude .section { margin-bottom: 0; margin-top: 0; } .sectoin-bg-img, .section[class*=" bg-"] { margin-top: 0; margin-bottom: 0; /* make service bar pass behind colored sections */ z-index: 4 } .sectoin-bg-img.section-z-bottom, .section[class*=" bg-"].section-z-bottom { z-index: 2; } .section-low { padding: 0; } .sectoin-bg-img, .section[class*=" bg-"], .section[class*=" bg-"].section-low { padding: 2.25rem 0; } @media (min-width: 64em) { .sectoin-bg-img, .section-tall, .section[class*=" bg-"] { padding: 5.5rem 0; } .sectoin-bg-img.section-low { padding: 2.25rem 0; } } .bg { position: absolute; width: 100%; height: 100%; top: 0; bottom: auto; left: 0; right: auto; z-index: -1; } .bg-red .bg, .nav-sub-overview.bg-red { background-color: rgb(222, 57, 25); } .nav-sub-overview.bg-red { color: rgb(255, 255, 255); } /* .bg-rock-90 .bg */ .bg-rock .bg { background-color: rgb(78, 78, 78); } .bg-rock-90 .bg { background-color: rgb(57, 57, 57); } .bg-rock-80 .bg { background-color: rgb(113, 113, 113); } .bg-rock-60 .bg { background-color: rgb(149, 149, 149); } .bg-rock-40 .bg { background-color: rgb(184, 184, 184); } .bg-rock-20 .bg { background-color: rgb(220, 220, 220); } .bg-light-gray .bg { background-color: rgb(248, 248, 248); } .bg-clay .bg { background-color: rgb(173, 163, 152); } .bg-clay10 .bg { background-color: rgb(148, 138, 127); } .bg-clay20 .bg { background-color: rgb(123, 113, 102); } .bg-marine .bg { background-color: rgb(0, 44, 95); } .bg-white .bg { background-color: #fff; } .section-id { position: absolute; top: -100px; } [class*=" bg-"] .section-id { top: -60px; } @media (min-width: 64em) { .section-id { top: -155px; } [class*=" bg-"] .section-id { top: -115px; } #inpage-nav ~ .page-content [class*=" bg-"] .section-id { top: -177px; } /* SIX-5324: position correctly by taking inpage-nav into account */ #inpage-nav ~ .page-content .section-id { top: -217px; } } .section-img { background-position-x: center; background-position-y: center; background-size: cover; overflow: hidden; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: -1 } .section-img img { position: absolute; left: 50%; top: 50%; right: 0; bottom: 0; z-index: 1; width: 100%; min-width: calc(15.5rem * 2.5); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: -1; } .section-img:after { background-color: rgba(57, 57, 57, 0.2); content: ""; height: 100%; width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; } /* SIX-5178: better support for seciton bg images on medium screen and smaller */ @media(max-width: 1654px) { .section-img img { -ms-transform: translate(-50%, -50%) scale(1.1); } } @media(max-width: 1484px) { .section-img img { -ms-transform: translate(-50%, -50%) scale(1.2); } } @media(max-width: 1384px) { .section-img img { -ms-transform: translate(-50%, -50%) scale(1.4); } } @media(max-width: 1184px) { .section-img img { -ms-transform: translate(-50%, -50%) scale(1.6); } } @supports (object-fit: cover) { .section-img img { -webkit-transform: none; transform: none; min-width: 0; left: 0; top: 0; height: 100%; width: 100%; object-fit: cover; object-position: center; } } #js .section section { visibility: hidden } #js .section section .accordion-content { visibility: inherit; } .cq-wcm-edit #js .section section, /* AEM author mode */ .sr-not-supported #js .section section { visibility: visible } .cq-wcm-edit #js .section section .accordion-content, .sr-not-supported #js .section section .accordion-content { visibility: inherit; } /* Section on Homepage */ .home-page .section { margin-bottom: 20px } @media (min-width: 30em) { .home-page .section { margin-bottom: 25px } } @media (min-width: 48em) { .home-page .section { margin-bottom: 30px } } @media (min-width: 64em) { .home-page .section { margin-bottom: 50px } } .home-page .section.sectoin-bg-img, .home-page .section[class*=" bg-"] { margin-bottom: 0; } @media (min-width: 48em) { .section > section, .container { max-width: 768px; } } @media (min-width: 64em) { .section > section, .container { max-width: 1024px; } .service-page .page-header, .service-page .section section { padding-left: 135px; } .service-page .inpage-nav-wrapper .container, .service-page .inpage-nav-wrapper .section section { padding-left: 16px; } /* TODO: test if search-page could be replaced with service-page*/ .search-page section, .detail-page .page-header-inner, .detail-page .article-header-inner, .section.shrink > section { padding-left: 135px; /* padding-right: calc(((1024px - var(--gutter-width)) * 0.16666) + var(--gutter-width)); */ padding-right: 135px; } .detail-page .section > section { padding-left: calc(135px + 16px); } .search-page.with-service-bar section, .detail-page.with-service-bar .page-header-inner, .detail-page.with-service-bar .article-header-inner, .detail-page.with-service-bar .section > section, article.with-service-bar .section.shrink > section { padding-right: 180px; } .detail-page .section.expand > section, .detail-page footer .section > section, .section.expand > section { padding-left: 16px; padding-right: 16px; } } @media (min-width: 80.125em) { .section > section, .container { max-width: 1282px; } .search-page section, .detail-page .page-header-inner, .detail-page .article-header-inner, .detail-page .section > section, .section.shrink > section { /* padding-right: calc(((1282px - var(--gutter-width)) * 0.16666) + var(--gutter-width)); */ padding-bottom: 1rem; } .search-page.with-service-bar section, .detail-page.with-service-bar .page-header-inner, .detail-page.with-service-bar .article-header-inner, .detail-page.with-service-bar .section > section, article.with-service-bar .section.shrink > section { padding-right: 227px; } } @media print { .section > section, .container { max-width: 100%; padding-left: 0; padding-right: 0; } /* SIX-4763: force scrollreveal to show in print mode */ [data-sr-id], #js .section section { opacity: 1 !important; visibility: visible !important; -webkit-transform: none !important; transform: none !important; } .search-page section, .detail-page .page-header-inner, .detail-page .article-header-inner, .detail-page .section > section, .section.shrink > section { padding-left: 0; } .section-img { display: none; } } .product-sidebar { margin-top: 40px; margin-bottom: 40px } .product-sidebar h6 { color: rgb(184, 184, 184); } .product-sidebar a { display: inline-block; font-size: 0.750em; } .product-sidebar ul { list-style-type: none; margin-left: 0; margin-bottom: 0 } .product-sidebar ul li { margin-bottom: 0; } .product-sidebar .product-fixed-content { text-align: left; } .product-sidebar .featured { background: rgb(248, 248, 248); font-size: 0.875rem; /* 14/16 */ padding: 15px 20px; border-top: 2px solid rgb(222, 57, 25); } .product-sidebar .product-sidebar-social ul { display: -webkit-box; display: flex; -webkit-box-pack: start; justify-content: flex-start; align-content: center; /* SIX-4524: wraps if there are too many icons prevents scrollbar */ flex-wrap: wrap } .product-sidebar .product-sidebar-social ul a { font-size: 1.15rem; margin-right: 1.25rem } .product-sidebar .product-sidebar-social ul a[target="_blank"]:after { content: none; } .product-sidebar-item { display: inline-block; vertical-align: top; } .product-sidebar-wrapper-sticky { -webkit-transition: .2s opacity ease; transition: .2s opacity ease; } @media (max-width: 63.999em) { .product-sidebar .column_2 { width: 100%; max-width: none; flex-basis: auto; } .product-sidebar-item { margin-right: 20px; margin-bottom: 10px; margin-top: 10px; } /* SIX-4858: hide sidebar content on mobile, only show sticky inpage */ .product-sidebar-item { display: none; } /* SIX-4858: force sidebar items on small screen */ div:not(.sidebar-footer) > .product-sidebar .product-sidebar-item[class*="only_"] { display: none !important; } /* SIX-4858: hide sidebar content except product logo */ .product-sidebar-item.logo-img-wrapper { display: block; max-width: 200px; } .page-content > .product-sidebar.non-sticky-nav { display: none; } } .browser-ie header + .page-content .product-sidebar.sticky-inpage-nav + .section { margin-top: 0; padding-top: 104px; } @media (min-width: 30em) { .hero-header + .product-sidebar { margin-top: 30px; } } @media (min-width: 64em) { .product-sidebar { margin: 0; } .product-sidebar-inner-sticky { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); z-index: 10; } .product-sidebar .row { position: relative; } .product-sidebar-wrapper { margin-bottom: 0; width: 100%; } .product-sidebar-item { display: block; margin-top: 25px; padding-left: 8px; padding-right: 8px; } .product-sidebar-inner-sticky { /* height: calc(100vh - (var(--navbar-height-desktop) + var(--division-height-desktop))); */ overflow: auto; position: absolute; top: 0; right: 0; padding: 0; } .product-sidebar { position: absolute; top: 0; width: 100%; /* SIX-5382: sections can have z-index 2 or 4 (default) */ z-index: 3; } .hero-header + .page-content .product-sidebar .product-sidebar-inner-sticky { padding-top: 34px; } } @media (min-width: 64em) { .detail-page .product-sidebar ~ [class*="bg-"], .detail-page .product-sidebar ~ .section.parbase > [class*="bg-"] { /* AEM sometimes adds another div parbase :( */ /* SIX-5382: removes gradient :after colored section, fixes 2 adjacent colored sections */ } .detail-page .product-sidebar ~ [class*="bg-"]:before, .detail-page .product-sidebar ~ .section.parbase > [class*="bg-"]:before { content: ''; width: 170px; /* 168 */ height: 100px; pointer-events: none; position: absolute; left: 50%; margin-left: 335px; } .detail-page .product-sidebar ~ [class*="bg-"]:before, .detail-page .product-sidebar ~ .section.parbase > [class*="bg-"]:before { background: -webkit-linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 1)); background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 1)); bottom: 100%; } .detail-page .product-sidebar ~ [class*="bg-"], .detail-page .product-sidebar ~ .section.parbase > [class*="bg-"] { /* SIX-5289: prevent ugly white gradient between 2 adjacent sections with bgcolor */ } .detail-page .product-sidebar ~ [class*="bg-"] + [class*="bg-"]:before, .detail-page .product-sidebar ~ .section.parbase > [class*="bg-"] + [class*="bg-"]:before { content: none; display: none; } .detail-page .product-sidebar { /* SIX-5289: fix first section rendering ugly white gradient */ } .detail-page .product-sidebar + [class*="bg-"]:before { content: none; display: none; } } @media (min-width: 80.125em) { .detail-page .product-sidebar ~ [class*="bg-"]:before, .detail-page .product-sidebar ~ [class*="bg-"]:after, .detail-page .product-sidebar ~ .section.parbase > [class*="bg-"]:before, .detail-page .product-sidebar ~ .section.parbase > [class*="bg-"]:after { width: 213px; /* 211 */ margin-left: 421px; } } @media print { .product-sidebar { display: none; } .product-sidebar-item a { display: none; } /* would display only phone numbers .product-sidebar-item a[href^="tel:"] { display: block; } */ .product-sidebar-social { display: none; } } .sticky-inpage-nav .product-sidebar-inner-sticky { width: 100% !important; flex-basis: 100%; max-width: 100%; padding: 34px 0 0 0; } .sticky-inpage-nav .anchor-nav-inner > .container { padding: 0 10px 0 calc(16px - 0.6rem); } .sticky-inpage-nav > .product-sidebar-wrapper-sticky > .container { max-width: none; padding: 0 } .sticky-inpage-nav > .product-sidebar-wrapper-sticky > .container > .row_end { margin: 0; } .sticky-inpage-nav.product-sidebar { position: -webkit-sticky; position: sticky; top: 0; z-index: 20; margin: 0; } .sticky-inpage-nav .product-sidebar-item { display: inline; display: initial; } .sticky-inpage-nav .sidebar-footer { display: none } .sticky-inpage-nav .product-sidebar-item { margin-top: 0; } .sticky-inpage-nav .anchor-nav-inner ul { margin: 0; } .sticky-inpage-nav .product-sidebar .column_2 { width: 100%; max-width: none; flex-basis: auto; } .sticky-inpage-nav .product-sidebar-item { margin-right: 20px; margin-bottom: 10px; margin-top: 10px; } .sticky-inpage-nav { /* SIX-4858: hide sidebar content on mobile, only show sticky inpage */ /*& .product-sidebar-item {*/ /* display: none;*/ /*}*/ /* SIX-4858: force sidebar items on small screen */ } .sticky-inpage-nav div:not(.sidebar-footer) > .product-sidebar .product-sidebar-item[class*="only_"] { display: none !important; } .sticky-inpage-nav { /* SIX-4858: hide sidebar content except product logo */ } .sticky-inpage-nav .product-sidebar-item.logo-img-wrapper { display: block; max-width: 200px; } /*}*/ @media (max-width: 63.999em) { .sticky-inpage-nav .anchor-nav-inner > .container { padding: 0 6px; } } @media (min-width: 64em) { .sticky-inpage-nav { min-height: 59px } .sticky-inpage-nav ~.page-content .section-id { top: -205px; position: relative; } .sticky-inpage-nav ~ .section .section-id { top: -205px; position: relative; } .sticky-inpage-nav ~ .sections { .section { margin-top: 0; margin-bottom: 0 } .section:first-child { padding-top: 2.5rem; } } .sticky-inpage-nav .product-sidebar-wrapper[style*="position: fixed"] .product-sidebar-inner-sticky { margin-top: 0; } } .sidebar-footer .product-sidebar-wrapper { display: block; } .sidebar-footer .logo-img-wrapper, .sidebar-footer .anchor-nav-wrapper { display: none; } @media (min-width: 64em) { .sidebar-footer { display: none; } } @media (min-width: 30em) { .xs-visible-only { display: none !important; } } @media (max-width: 47.999em) { .xs-hidden-only { display: none !important; } } @media (min-width: 48em) { .sm-visible-only { display: none !important; } } @media (max-width: 63.999em) { .sm-hidden-only { display: none !important; } } @media (min-width: 64em) { .md-visible-only { display: none !important; } } @media (max-width: 80.124em) { .md-hidden-only { display: none !important; } } @media (min-width: 80.125em) { .lg-visible-only { display: none !important; } } @media (max-width: 89.999em) { .lg-hidden-only { display: none !important; } } /* custom modifiers which may added in dedicated field of component dialog by Authors */ .grid--list-image-block-margin .list.image-block { margin-bottom: 16px !important; } /* styles that trump basic styling because of various reasons */ /* Styles for sticky elements that couldn't be placed in separate files ************************************************************** */ /* DDM Data Table and .sticky-inpage-nav on page ************************************************************** */ .sticky-inpage-nav ~ .section .table-header + .separateStickyHeader { top: calc(114px + 59px); } @media (max-width: 63.999em) { .sticky-inpage-nav ~ .section .table-header + .separateStickyHeader { top: 59px; } } /* DDM Data Table and #inpage-nav on page ************************************************************** */ #inpage-nav ~ .page-content .section .table-header + .separateStickyHeader { top: calc(114px + 62px); } @media (max-width: 63.999em) { #inpage-nav ~ .page-content .section .table-header + .separateStickyHeader { top: -1px; } } /* DDM Data Table and .sticky-inpage-nav and #inpage-nav on page ************************************************************** */ #inpage-nav ~ .page-content .product-sidebar.sticky-inpage-nav ~ .section .table-header + .separateStickyHeader { top: calc(114px + 62px + 59px); } @media (max-width: 63.999em) { #inpage-nav ~ .page-content .product-sidebar.sticky-inpage-nav ~ .section .table-header + .separateStickyHeader { top: calc(59px - 1px); } } /* DDM Data Table inside Sticky Tab ************************************************************** */ .radio-tabs-sticky .tab-item .table-header + .separateStickyHeader { top: calc(114px + 65px); margin-bottom: calc(80vh - 65px - 46px); } .radio-tabs-sticky .tab-item .table-header + .separateStickyHeader + div { margin-top: calc(-80vh + 65px + 46px); } @media (max-width: 63.999em) { .radio-tabs-sticky .tab-item .table-header + .separateStickyHeader { top: 65px; } } /* DDM Data Table inside Sticky Tab and .sticky-inpage-nav on page ************************************************************** */ .sticky-inpage-nav ~ .section .radio-tabs-sticky .tab-item .table-header + .separateStickyHeader { top: calc(114px + 65px + 59px); } @media (max-width: 63.999em) { .sticky-inpage-nav ~ .section .radio-tabs-sticky .tab-item .table-header + .separateStickyHeader { top: calc(65px + 59px); } } /* DDM Data Table inside Sticky Tab and #inpage-nav on page ************************************************************** */ #inpage-nav ~ .page-content .section .radio-tabs-sticky .tab-item .table-header + .separateStickyHeader { top: calc(114px + 65px + 62px); } @media (max-width: 63.999em) { #inpage-nav ~ .page-content .section .radio-tabs-sticky .tab-item .table-header + .separateStickyHeader { top: calc(65px - 1px); } } /* DDM Data Table inside Sticky Tab and .sticky-inpage-nav and #inpage-nav on page ************************************************************** */ #inpage-nav ~ .page-content .product-sidebar.sticky-inpage-nav ~ .section .radio-tabs-sticky .tab-item .table-header + .separateStickyHeader { top: calc(114px + 62px + 65px + 59px); } @media (max-width: 63.999em) { #inpage-nav ~ .page-content .product-sidebar.sticky-inpage-nav ~ .section .radio-tabs-sticky .tab-item .table-header + .separateStickyHeader { top: calc(65px + 59px - 1px); } } /*# sourceMappingURL=main.css.map */