/* EXOS 2.0 */

/* fix headline color within corporate solid sections and sheets */
.sheet__section--corporate-solid .subheadline,
.page-section--corporate-solid .subheadline,
.sheet__section--corporate-solid .subheadline-section,
.page-section--corporate-solid .subheadline-section,
.sheet__section--corporate-solid .headline,
.page-section--corporate-solid .headline {
	color: #fff;
}

/* 2/3 column list for menu subpages */
.css2columns {
    -webkit-columns: 2 260px;
    -moz-columns: 2 260px;
    columns: 2 260px;
}
.css3columns {
    -webkit-columns: 3 230px;
    -moz-columns: 3 230px;
    columns: 3 230px;
}

.table-component-header td,
.table-component-header th {
    color: #2d323a;
    font-size: 13px;
}

th.wrap-text-overflow,
td.wrap-text-overflow{
    word-wrap: break-word;
}

.responsive-small table.content-table tbody td:first-child {
    padding-left: 40%;
}

/* Marketing article styles */
.marketing .page-section:last-child.page-section--corporate-solid,
.marketing .page-section.last-child.page-section--corporate-solid {
    padding-bottom: 32px;
}

.responsive-large .marketing .page-section .page-section__block .grid-12 > p,
.responsive-medium .marketing .page-section .page-section__block .grid-12 > p {
    margin-bottom: 24px;
}

.responsive-large .marketing .page-section .page-section__block .two-columns,
.responsive-medium .marketing .page-section .page-section__block .two-columns {
    display: flex;
    align-items: center;
    margin-bottom: 24px;
    width: 100%;
}

@media only screen and (max-width: 666px) {
    .marketing .two-columns {
        display: block;
    }
}
.responsive-small .marketing .page-section:last-child.page-section--corporate-solid,
.responsive-small .marketing .page-section.last-child.page-section--corporate-solid {
    padding-bottom: 16px;
}

/* PDF Footer Icon */
a.generate-pdf-icon:before,
a.generate-pdf-icon:after {
    content: '\e94b';
    padding-right: 3px;
}

/* Removing Global Navigation Padding & Footer in mobile App */
.oao-navi-mobile-app #content {
    padding-top: 0;
}

.oao-navi-mobile-app #footer-container {
    display: none;
}

.oao-navi-mobile-app #content .page-section:last-child,
.oao-navi-mobile-app #content.marketing {
    padding-bottom: 0;
}

.oao-navi-mobile-app #content.marketing .page-section:last-child {
    padding-bottom: 32px;
}


/* Large primary header button for small screens */
.responsive-small .header-section .button-primary {
    width: 100%;
}

.responsive-small #content.glossary,
.responsive-small #content.marketing,
.responsive-small #content.landinghub  {
    padding-bottom: 32px;
}

.responsive-small #content.marketing > .page-section + .page-section + .page-section figure {
    display: none;
}

#content.has-sticky-section .page-section.sticky {
    position: absolute;
    width: 100%;
    bottom: 88px;
    padding-left: 0;
    padding-right: 0;
}

.page-section .sticky-sidebar.active .grid-spacing-both {
    margin: 0 0 0 22px;
}

.responsive-small #content.has-sticky-section {
    padding-bottom: 139px;
}

body.responsive-small table td:before {
    width: 33%;
}

#content {
    padding-bottom: 0;
}

#content.marketing,
#content.landinghub {
    padding-bottom: 0;
}

.responsive-small.oao-pi-headless-flyin hr.survey {
    margin: 0 15px;
}

#content > .page-section .sheet__section--secondary + .sheet__section--secondary,
#content > .page-section .sheet__section--tertiary + .sheet__section--tertiary,
#content .page-section--primary + .page-section--primary,
#content .page-section--secondary + .page-section--secondary,
#content .page-section--corporate-solid + .page-section--corporate-solid {
    padding-top: 0;
    margin-top: -1px;
}

#content > .page-section .check-mark {
    padding-left: 24px;
}

#content > .page-section td > span.check-mark {
    display: block;
    text-align: center;
}

#content > .page-section .check-mark:before {
    color: #1f282d;
    content: "\E674";
    font-family: exos-icon-font,sans-serif;
    margin-left: -24px;
    position: absolute;
}

.responsive-small .landinghub .page-section .page-section__block > .sheet:last-child {
    margin-bottom: 0;
}

.responsive-small .landinghub .page-section:last-child .page-section__block > .sheet:last-child {
    margin-bottom: -32px;
}

.page-tabs .page-tabbar {
    padding-left: 32px;
    margin-bottom: 24px;
}

.page-tabs .page-tabbar__panel {
    display: none;
}

.page-tabs .page-tabbar__panel.page-tabbar__panel--active {
    display: block;
}

.control-element {
    background-color: transparent;
    border: none;
    padding: 0;
    text-transform: none;
    cursor: default;
    display: inline-block;
    font-weight: bold;
    font-family: monospace, Arial, sans-serif;
    color: #0b2a63;
}

div.sheet-agent {
    margin-bottom: 16px;
    padding: 12px 12px 0;
    position: relative;
    background-color: rgba(214,6,0,0.05);
    border-bottom: 1px #d60600 solid;
    border-top: 26px #d60600 solid;
    color: #646e80;
}

div.sheet-agent > p:first-child {
    margin-top: -35px;
    margin-bottom: 16px;
    font-weight: bold;
    color: #fff;
}

div.sheet-agent + div.sheet-agent {
    margin-top: -17px;
    border-top: 1px #fdf2f2 solid;
}

div.sheet-agent + div.sheet-agent > p:first-child {
    display: none;
}

.oao-pi-headless .page-section.primary {
    background-color: transparent;
}

.page-content + #footer-container {
    margin-top: -387px;
}

.responsive-small .page-content + #footer-container {
    margin-top: -32px;
}


.appstore .hosting-manager,
.playstore .hosting-manager {
    background-image: url('../Images/hosting-manager-sprite.png');
    width: 152px;
    height: 45px;
    display: inline-block;
}


.appstore .hosting-manager {
    background-position-y: 0;
}

.appstore .hosting-manager:hover {
    background-position-y: -100px;
}

.playstore .hosting-manager {
    background-position-y: -200px;
}

.playstore .hosting-manager:hover {
    background-position-y: -300px;
}


img.responsive {
    max-width: 100%;
    height: auto;
}

figure.box-shadow img{
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.1);
    margin-bottom: 8px;
}

.hidden-anchor {
    position: absolute;
    z-index:1;
    left: -999em;
}

.page-content ul.content-list.condensed li:not(.teaser) {
    display: inline;
}

.page-content ul.content-list.condensed li.teaser span {
    margin-bottom: 0;
}

.page-content ul.content-list.condensed li:before {
    content: ' • ';
}
.page-content ul.content-list.condensed li.teaser:before,
.page-content ul.content-list.condensed li.teaser + li:before{
    content: '';
}

.custom-title {
    background-color: rgba(65, 72, 83, 0.8);
    color: #fff;
    cursor: default;
    display: block;
    font-size: 12px;
    line-height: 1.538em;
    opacity: 0;
    padding: 8px 12px;
    position: absolute;
    text-align: center;
    transition: margin-top 0.2s ease-out 0.25s, opacity 0.15s ease-out 0.25s;
    visibility: hidden;
    margin-top: 18px;
}

.custom-title.active {
    opacity: 1;
    visibility: visible;
    z-index: 10;
    margin-top: 8px;
}

/* Reset for orderedList */
.ordered-list-reset-1 { counter-reset: orderedList 1; }
.ordered-list-reset-2 { counter-reset: orderedList 2; }
.ordered-list-reset-3 { counter-reset: orderedList 3; }
.ordered-list-reset-4 { counter-reset: orderedList 4; }
.ordered-list-reset-5 { counter-reset: orderedList 5; }
.ordered-list-reset-6 { counter-reset: orderedList 6; }
.ordered-list-reset-7 { counter-reset: orderedList 7; }
.ordered-list-reset-8 { counter-reset: orderedList 8; }
.ordered-list-reset-9 { counter-reset: orderedList 9; }
.ordered-list-reset-10 { counter-reset: orderedList 10; }
.ordered-list-reset-11 { counter-reset: orderedList 11; }
.ordered-list-reset-12 { counter-reset: orderedList 12; }
.ordered-list-reset-13 { counter-reset: orderedList 13; }
.ordered-list-reset-14 { counter-reset: orderedList 14; }
.ordered-list-reset-15 { counter-reset: orderedList 15; }
.ordered-list-reset-16 { counter-reset: orderedList 16; }
.ordered-list-reset-17 { counter-reset: orderedList 17; }
.ordered-list-reset-18 { counter-reset: orderedList 18; }
.ordered-list-reset-19 { counter-reset: orderedList 19; }
.ordered-list-reset-20 { counter-reset: orderedList 20; }


.header-section.emphasized .ciso_deeplinks a span {
    color: inherit;
}

.content-card .tile__label {
    color: #0b9dcc;
}

.content-card footer .content-paragraph:last-child {
    margin-bottom: 0;
}

ul.accordion header {
    outline: none;
}

ul.accordion span.copy-text-a1,
ul.accordion span.copy-text-e1 {
    display: block;
}

ul.accordion span.copy-text-a1.hidden,
ul.accordion span.copy-text-e1.hidden {
    display: none;
}

/* CKeditor limitation requires classes to be on the same element */
.align-horizontal-center.readability-effect {
    display: inline-block;
    padding-left: 15%;
    padding-right: 15%;
}

.responsive-small .align-horizontal-center.readability-effect {
    padding: 0;
}

.responsive-small.headless-mode .header-section.emphasized {
    display: none;
}

.responsive-small.headless-mode .page-section {
    position: static;
    top: 0px;
}

.responsive-small.headless-mode .headline-page {
    margin-bottom: 8px;
    margin-top: -8px;
    line-height: 48px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-right: 16px;
}

[data-if-not-page],
[data-if-not-present],
[data-if-page],
[data-if-present],
[data-if-authenticated],
[data-if-not-authenticated],
[data-if-has-favorites],
[data-if-is-favorite] {
    display: none;
}

.cke_editable [data-if-not-page],
.cke_editable [data-if-not-present],
.cke_editable [data-if-page],
.cke_editable [data-if-present],
.cke_editable [data-if-authenticated],
.cke_editable [data-if-not-authenticated] {
    display: block;
}

/* Fix color for secondary button in emphasized section */
.page-section .button-secondary:hover {
    background-color: #0d7fd6;
    color: #fff;
}


/* BEGINN: Flyin Styling */
.oao-pi-headless #footer-container,
.oao-pi-headless .sheet section.sheet__section--corporate-solid:last-child {
    position: absolute;
    z-index: -1;
    display: none;
}

body.headless-mode.oao-pi-headless .sheet {
    background-color: transparent;
    box-shadow: 0 0;
}


/* BEGINN: OAO Survey Helpcenter */
.page-content #oao-helpcenter-feedback-container,
.page-content .oao-decision-survey > div {
    margin-top: 0;
    text-align: center;
}

.page-content #oao-helpcenter-feedback-container .subheadline-section {
    border: 0;
    margin-bottom: 10px;
    font-size: 19.5px;
    line-height: 1.3333em;
    padding-top: 0;
    font-family: OpenSansRegular,Arial,Arial Narrow,sans-serif;
}

.page-content .sheet > section.sheet__section--corporate-solid #oao-helpcenter-feedback-container * {
    color: #fff;
}

.page-content .sheet > section.sheet__section--corporate-solid #oao-helpcenter-feedback-container .button-secondary {
    border-color: #fff;
    font-size: 1em;
    font-family: OpenSansSemiBold, Arial, sans-serif;
}

.sticky-sidebar {
    opacity: 1;
    transition: opacity 0.3s ease-out, transform 0.1s linear 0.3s;
    will-change: opacity;
}

.oao-pi-flyin.oao-pi-animation .sticky-sidebar {
    opacity: 0;
    -webkit-transform: translateY(-500px);
    -moz-transform: translateY(-500px);
    -ms-transform: translateY(-500px);
    -o-transform: translateY(-500px);
    transform: translateY(-500px);
}

.oao-pi-headless-overlay .header-section + .page-section {
    padding-bottom: 0;
}

.page-section, .footer-section, .header-section {
    padding-left: 32px;
}

a.link-share {
    font-size: 32px;
    line-height: 32px;
    margin-right: 16px;
    text-decoration: none;
    vertical-align: top;
}

.code-snippet {
    display: block;
    padding: 1em;
    margin: .5em 0;
    overflow: auto;
    border-radius: 0.3em;
    background: #272822;
    color: #f8f8f2;
    text-shadow: 0 1px rgba(0,0,0,0.3);
    font-family: Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace;
    text-align: left;
    word-spacing: normal;
    word-break: normal;
    word-wrap: normal;
    line-height: 1.5;
    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4;
    -webkit-hyphens: none;
    -moz-hyphens: none;
    -ms-hyphens: none;
    hyphens: none;
}


/*  CONTROLPANEL ICON FONT */
@font-face {
    font-family: 'icon-font-catweasel';
    -webkit-font-smoothing: antialiased;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    line-height: 1;
    -moz-osx-font-smoothing: grayscale;
    speak: none;
    src: url('https://cors.uicdn.net/fonts/ciso-styleguide-icons.eot');
    src: url('https://cors.uicdn.net/fonts/ciso-styleguide-icons.eot#iefix') format('embedded-opentype'),
    url('https://cors.uicdn.net/fonts/ciso-styleguide-icons.woff') format('woff'),
    url('https://cors.uicdn.net/fonts/ciso-styleguide-icons.ttf') format('truetype'),
    url('https://cors.uicdn.net/fonts/ciso-styleguide-icons.svg#icon-font-catweasel') format('svg');
    text-transform: none;
}

.oao-pi-headless-overlay .page-section .page-section__block {
    min-height: 52px;
}
/****************** FOOTER ******************/
.page-section--beta .page-section__block > div.grid-12:last-child, .page-section--beta .page-section__block > section.grid-12:last-child {
    margin-bottom: -12px;
}

.responsive-small .page-footer__section:first-child .page-footer__section-item .link-standard,
.responsive-small .page-footer__section .page-footer__section-item .oao-statuspage-overall-status{
    margin-bottom: 16px;
    display: inline-block
}

.responsive-small.__has-left-navigation .page-footer__block {
    padding-left: 0;
}

.page-footer__section a.link-share {
    width: 32px;
    height: 32px;
    overflow: hidden;
    padding-left: 1px;
    display: inline-block;
}

.footer-section .copy-text-c1, .footer-section .copy-text-e1, .page-footer__section .copy-text-c1, .page-footer__section .copy-text-e1 {
    color: #646E80;
}

.footer-section ul.subheadline-b2 li, .page-footer__section ul.subheadline-b2 li {
    display: inline;
    margin-left: 0px;
    margin-right: 16px;
}

/** EXOS 2.0 adjustments **/
.content-paragraph:has(+ .code-snippet) {
	margin-bottom: .5em;
}

.code-snippet:has(+ p),
.code-snippet:has(+ .headline){
	margin-bottom: 1em;
}

h3.headline.headline--sub {
	font-size: 19px;
}
h5.headline.headline--paragraph {
	font-size: 16px;
}

@media only screen and (max-width: 666px) {
	h3.headline.headline--sub {
		font-size: 16px;
	}
}

/*
 * content-sheet compatibility for sheet__section classes
 *
 * cisodistribution >= v12 uses .sheet > .sheet__section structure in its Article template.
 * cip_terms_and_conditions uses the older .content-sheet > section.default > .sheet-block structure.
 * When Sheet.html content elements (section dividers) are rendered inside content-sheet, they
 * produce .sheet__section / .sheet__section--secondary classes without a .sheet-block wrapper.
 *
 * Fixes:
 * 1. Add horizontal padding matching .sheet-block (0 30px) so section content is not flush to edges.
 * 2. Apply the correct secondary background color (matches .content-sheet .secondary).
 */
.content-sheet > section.sheet__section {
    padding-left: 30px;
    padding-right: 30px;
}

.content-sheet > section.sheet__section--secondary {
    background-color: var(--default-background-color, #f4f7fa);
}

/****************** INLINE EMPHASIS ******************/
/* The exos framework reset (ionos.compat.min.css) lists `i` among the tags it sets
   `font: inherit` on, which wipes the browser default `font-style: italic`.
   Restore it for editorial content only — exos itself uses <i> as an icon element. */
.page-content i {
    font-style: italic;
}

/* CKEditor's list-item marker formatting (`li.ck-list-marker-italic`) is only styled by
   CKEditor's own CSS inside `.ck-content`, i.e. in the editor. Mirror it for the FE. */
.page-content li.ck-list-marker-italic::marker {
    font-style: italic;
}

/****************** CLS: METRIC-MATCHED ARIAL FALLBACK ******************/
/* The exos framework declares its text faces with `font-display: swap` and `arial` as the
   fallback, so text always paints in Arial first and then reflows when the web font arrives.
   Arial's advance widths are ~4% narrower than Open Sans, so any paragraph whose container
   width happens to fall in that ~4% window gains a whole extra line and pushes everything
   below it down. Measured on an article page: a `layout-shift` entry of 0.0497 at a 834px
   viewport, content displaced +25px (intro paragraph 602px in Arial vs 625px in Open Sans
   inside a 619px container - one line becomes two). It is not tablet-specific: 412px, 1024px
   and 1440px shift by the same ~24px, but below ~865px the article spans ~96% of the viewport
   width instead of ~49%, which roughly doubles the score for the same displacement.

   Rather than touch any exos font stack or custom property, this redefines the *fallback
   family itself*. exos already names `arial` as the fallback everywhere, so re-declaring it
   as an @font-face over the local Arial - carrying the web font's metrics - makes the
   pre-swap and post-swap layouts wrap identically. Nothing about the rendered design changes:
   the web fonts still come first in every stack and win as soon as they load. These metrics
   only describe the frame before the swap (or a permanent fallback if the CDN fails, where
   matching the intended layout is what we want anyway).

   `size-adjust` alone is not enough - it scales the em box vertically too, which changes
   inline box heights (19px -> 16px at font-size 14px) and moves any block whose line box is
   font-derived rather than a fixed px `line-height`. The overrides pin the vertical metrics
   to Open Sans' own 107%/29% with no line gap. Chrome multiplies the override percentages by
   `size-adjust`, so they are pre-divided by it (107/1.043 = 102.6, 29/1.043 = 27.8) to land
   on the target; re-derive them the same way if `size-adjust` changes.

   Values are measured against real article text: mean residual width error drops from 4.12%
   to 0.67% (max 5.73% -> 1.68%), the optimum across a 103.6-105.0% sweep. One value has to
   serve both the regular and the semibold stack, because exos carries weight in the family
   name (OpenSansSemibold) rather than the weight property - both compute to `font-weight:
   400`, so font matching cannot tell them apart. It is tuned for body copy, which is what
   re-wraps. Overpass headlines are unaffected in practice: they sit within 0.3% of Arial, and
   a line-count check over realistic titles at nine container widths flipped 2 of 90 either
   way, i.e. no worse than today. Re-measure if exos changes its fonts. */
@font-face {
    font-family: arial;
    src: local('Arial'), local('Helvetica'), local('Liberation Sans');
    size-adjust: 104.3%;
    ascent-override: 102.6%;
    descent-override: 27.8%;
    line-gap-override: 0%;
    font-display: swap;
}