diff options
Diffstat (limited to 'themes/itheme/static/css')
| -rw-r--r-- | themes/itheme/static/css/autocomplete-theme-classic.css | 2 | ||||
| -rw-r--r-- | themes/itheme/static/css/custom.css | 455 | ||||
| -rw-r--r-- | themes/itheme/static/css/global.css | 7392 | ||||
| -rw-r--r-- | themes/itheme/static/css/search.css | 21 |
4 files changed, 7870 insertions, 0 deletions
diff --git a/themes/itheme/static/css/autocomplete-theme-classic.css b/themes/itheme/static/css/autocomplete-theme-classic.css new file mode 100644 index 0000000..e5efa34 --- /dev/null +++ b/themes/itheme/static/css/autocomplete-theme-classic.css @@ -0,0 +1,2 @@ +/*! @algolia/autocomplete-theme-classic 1.8.3 | MIT License | © Algolia, Inc. and contributors | https://github.com/algolia/autocomplete */ +:root{--aa-search-input-height:44px;--aa-input-icon-size:20px;--aa-base-unit:16;--aa-spacing-factor:1;--aa-spacing:calc(var(--aa-base-unit)*var(--aa-spacing-factor)*1px);--aa-spacing-half:calc(var(--aa-spacing)/2);--aa-panel-max-height:650px;--aa-base-z-index:9999;--aa-font-size:calc(var(--aa-base-unit)*1px);--aa-font-family:inherit;--aa-font-weight-medium:500;--aa-font-weight-semibold:600;--aa-font-weight-bold:700;--aa-icon-size:20px;--aa-icon-stroke-width:1.6;--aa-icon-color-rgb:119,119,163;--aa-icon-color-alpha:1;--aa-action-icon-size:20px;--aa-text-color-rgb:38,38,39;--aa-text-color-alpha:1;--aa-primary-color-rgb:62,52,211;--aa-primary-color-alpha:0.2;--aa-muted-color-rgb:128,126,163;--aa-muted-color-alpha:0.6;--aa-panel-border-color-rgb:128,126,163;--aa-panel-border-color-alpha:0.3;--aa-input-border-color-rgb:128,126,163;--aa-input-border-color-alpha:0.8;--aa-background-color-rgb:255,255,255;--aa-background-color-alpha:1;--aa-input-background-color-rgb:255,255,255;--aa-input-background-color-alpha:1;--aa-selected-color-rgb:179,173,214;--aa-selected-color-alpha:0.205;--aa-description-highlight-background-color-rgb:245,223,77;--aa-description-highlight-background-color-alpha:0.5;--aa-detached-media-query:(max-width:680px);--aa-detached-modal-media-query:(min-width:680px);--aa-detached-modal-max-width:680px;--aa-detached-modal-max-height:500px;--aa-overlay-color-rgb:115,114,129;--aa-overlay-color-alpha:0.4;--aa-panel-shadow:0 0 0 1px rgba(35,38,59,0.1),0 6px 16px -4px rgba(35,38,59,0.15);--aa-scrollbar-width:13px;--aa-scrollbar-track-background-color-rgb:234,234,234;--aa-scrollbar-track-background-color-alpha:1;--aa-scrollbar-thumb-background-color-rgb:var(--aa-background-color-rgb);--aa-scrollbar-thumb-background-color-alpha:1}@media (hover:none) and (pointer:coarse){:root{--aa-spacing-factor:1.2;--aa-action-icon-size:22px}}body.dark,body[data-theme=dark]{--aa-text-color-rgb:183,192,199;--aa-primary-color-rgb:146,138,255;--aa-muted-color-rgb:146,138,255;--aa-input-background-color-rgb:0,3,9;--aa-background-color-rgb:21,24,42;--aa-selected-color-rgb:146,138,255;--aa-selected-color-alpha:0.25;--aa-description-highlight-background-color-rgb:0 255 255;--aa-description-highlight-background-color-alpha:0.25;--aa-icon-color-rgb:119,119,163;--aa-panel-shadow:inset 1px 1px 0 0 #2c2e40,0 3px 8px 0 #000309;--aa-scrollbar-track-background-color-rgb:44,46,64;--aa-scrollbar-thumb-background-color-rgb:var(--aa-background-color-rgb)}.aa-Autocomplete *,.aa-DetachedFormContainer *,.aa-Panel *{box-sizing:border-box}.aa-Autocomplete,.aa-DetachedFormContainer,.aa-Panel{color:#262627;color:rgba(var(--aa-text-color-rgb),var(--aa-text-color-alpha));font-family:inherit;font-family:var(--aa-font-family);font-size:16px;font-size:var(--aa-font-size);font-weight:400;line-height:1em;margin:0;padding:0;text-align:left}.aa-Form{align-items:center;background-color:#fff;background-color:rgba(var(--aa-input-background-color-rgb),var(--aa-input-background-color-alpha));border:1px solid rgba(128,126,163,.8);border:1px solid rgba(var(--aa-input-border-color-rgb),var(--aa-input-border-color-alpha));border-radius:3px;display:flex;line-height:1em;margin:0;position:relative;width:100%}.aa-Form[focus-within]{border-color:#3e34d3;border-color:rgba(var(--aa-primary-color-rgb),1);box-shadow:0 0 0 2px rgba(62,52,211,.2),inset 0 0 0 2px rgba(62,52,211,.2);box-shadow:rgba(var(--aa-primary-color-rgb),var(--aa-primary-color-alpha)) 0 0 0 2px,inset rgba(var(--aa-primary-color-rgb),var(--aa-primary-color-alpha)) 0 0 0 2px;outline:medium none currentColor}.aa-Form:focus-within{border-color:#3e34d3;border-color:rgba(var(--aa-primary-color-rgb),1);box-shadow:0 0 0 2px rgba(62,52,211,.2),inset 0 0 0 2px rgba(62,52,211,.2);box-shadow:rgba(var(--aa-primary-color-rgb),var(--aa-primary-color-alpha)) 0 0 0 2px,inset rgba(var(--aa-primary-color-rgb),var(--aa-primary-color-alpha)) 0 0 0 2px;outline:medium none currentColor}.aa-InputWrapperPrefix{align-items:center;display:flex;flex-shrink:0;height:44px;height:var(--aa-search-input-height);order:1}.aa-Label,.aa-LoadingIndicator{cursor:auto;flex-shrink:0;height:100%;padding:0;text-align:left}.aa-Label svg,.aa-LoadingIndicator svg{color:#3e34d3;color:rgba(var(--aa-primary-color-rgb),1);height:auto;max-height:20px;max-height:var(--aa-input-icon-size);stroke-width:1.6;stroke-width:var(--aa-icon-stroke-width);width:20px;width:var(--aa-input-icon-size)}.aa-LoadingIndicator,.aa-SubmitButton{height:100%;padding-left:11px;padding-left:calc(var(--aa-spacing)*0.75 - 1px);padding-right:8px;padding-right:var(--aa-spacing-half);width:47px;width:calc(var(--aa-spacing)*1.75 + var(--aa-icon-size) - 1px)}@media (hover:none) and (pointer:coarse){.aa-LoadingIndicator,.aa-SubmitButton{padding-left:3px;padding-left:calc(var(--aa-spacing-half)/2 - 1px);width:39px;width:calc(var(--aa-icon-size) + var(--aa-spacing)*1.25 - 1px)}}.aa-SubmitButton{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;margin:0}.aa-LoadingIndicator{align-items:center;display:flex;justify-content:center}.aa-LoadingIndicator[hidden]{display:none}.aa-InputWrapper{order:3;position:relative;width:100%}.aa-Input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;color:#262627;color:rgba(var(--aa-text-color-rgb),var(--aa-text-color-alpha));font:inherit;height:44px;height:var(--aa-search-input-height);padding:0;width:100%}.aa-Input::-moz-placeholder{color:rgba(128,126,163,.6);color:rgba(var(--aa-muted-color-rgb),var(--aa-muted-color-alpha));opacity:1}.aa-Input::placeholder{color:rgba(128,126,163,.6);color:rgba(var(--aa-muted-color-rgb),var(--aa-muted-color-alpha));opacity:1}.aa-Input:focus{border-color:none;box-shadow:none;outline:none}.aa-Input::-webkit-search-cancel-button,.aa-Input::-webkit-search-decoration,.aa-Input::-webkit-search-results-button,.aa-Input::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none}.aa-InputWrapperSuffix{align-items:center;display:flex;height:44px;height:var(--aa-search-input-height);order:4}.aa-ClearButton{align-items:center;background:none;border:0;color:rgba(128,126,163,.6);color:rgba(var(--aa-muted-color-rgb),var(--aa-muted-color-alpha));cursor:pointer;display:flex;height:100%;margin:0;padding:0 12.8333333333px;padding:0 calc(var(--aa-spacing)*0.83333 - .5px)}@media (hover:none) and (pointer:coarse){.aa-ClearButton{padding:0 10.1666666667px;padding:0 calc(var(--aa-spacing)*0.66667 - .5px)}}.aa-ClearButton:focus,.aa-ClearButton:hover{color:#262627;color:rgba(var(--aa-text-color-rgb),var(--aa-text-color-alpha))}.aa-ClearButton[hidden]{display:none}.aa-ClearButton svg{stroke-width:1.6;stroke-width:var(--aa-icon-stroke-width);width:20px;width:var(--aa-icon-size)}.aa-Panel{background-color:#fff;background-color:rgba(var(--aa-background-color-rgb),var(--aa-background-color-alpha));border-radius:4px;border-radius:calc(var(--aa-spacing)/4);box-shadow:0 0 0 1px rgba(35,38,59,.1),0 6px 16px -4px rgba(35,38,59,.15);box-shadow:var(--aa-panel-shadow);margin:8px 0 0;overflow:hidden;position:absolute;transition:opacity .2s ease-in,filter .2s ease-in}@media screen and (prefers-reduced-motion){.aa-Panel{transition:none}}.aa-Panel button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;margin:0;padding:0}.aa-PanelLayout{height:100%;margin:0;max-height:650px;max-height:var(--aa-panel-max-height);overflow-y:auto;padding:0;position:relative;text-align:left}.aa-PanelLayoutColumns--twoGolden{display:grid;grid-template-columns:39.2% auto;overflow:hidden;padding:0}.aa-PanelLayoutColumns--two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:hidden;padding:0}.aa-PanelLayoutColumns--three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow:hidden;padding:0}.aa-Panel--stalled .aa-Source{filter:grayscale(1);opacity:.8}.aa-Panel--scrollable{margin:0;max-height:650px;max-height:var(--aa-panel-max-height);overflow-x:hidden;overflow-y:auto;padding:8px;padding:var(--aa-spacing-half);scrollbar-color:#fff #eaeaea;scrollbar-color:rgba(var(--aa-scrollbar-thumb-background-color-rgb),var(--aa-scrollbar-thumb-background-color-alpha)) rgba(var(--aa-scrollbar-track-background-color-rgb),var(--aa-scrollbar-track-background-color-alpha));scrollbar-width:thin}.aa-Panel--scrollable::-webkit-scrollbar{width:13px;width:var(--aa-scrollbar-width)}.aa-Panel--scrollable::-webkit-scrollbar-track{background-color:#eaeaea;background-color:rgba(var(--aa-scrollbar-track-background-color-rgb),var(--aa-scrollbar-track-background-color-alpha))}.aa-Panel--scrollable::-webkit-scrollbar-thumb{background-color:#fff;background-color:rgba(var(--aa-scrollbar-thumb-background-color-rgb),var(--aa-scrollbar-thumb-background-color-alpha));border-radius:9999px;border:3px solid #eaeaea;border-color:rgba(var(--aa-scrollbar-track-background-color-rgb),var(--aa-scrollbar-track-background-color-alpha));border-right:2px solid rgba(var(--aa-scrollbar-track-background-color-rgb),var(--aa-scrollbar-track-background-color-alpha))}.aa-Source{margin:0;padding:0;position:relative;width:100%}.aa-Source:empty{display:none}.aa-SourceNoResults{font-size:1em;margin:0;padding:16px;padding:var(--aa-spacing)}.aa-List{list-style:none;margin:0}.aa-List,.aa-SourceHeader{padding:0;position:relative}.aa-SourceHeader{margin:8px .5em 8px 0;margin:var(--aa-spacing-half) .5em var(--aa-spacing-half) 0}.aa-SourceHeader:empty{display:none}.aa-SourceHeaderTitle{background:#fff;background:rgba(var(--aa-background-color-rgb),var(--aa-background-color-alpha));color:#3e34d3;color:rgba(var(--aa-primary-color-rgb),1);display:inline-block;font-size:.8em;font-weight:600;font-weight:var(--aa-font-weight-semibold);margin:0;padding:0 8px 0 0;padding:0 var(--aa-spacing-half) 0 0;position:relative;z-index:9999;z-index:var(--aa-base-z-index)}.aa-SourceHeaderLine{border-bottom:1px solid #3e34d3;border-bottom:1px solid rgba(var(--aa-primary-color-rgb),1);display:block;height:2px;left:0;margin:0;opacity:.3;padding:0;position:absolute;right:0;top:8px;top:var(--aa-spacing-half);z-index:9998;z-index:calc(var(--aa-base-z-index) - 1)}.aa-SourceFooterSeeAll{background:linear-gradient(180deg,#fff,rgba(128,126,163,.14));background:linear-gradient(180deg,rgba(var(--aa-background-color-rgb),var(--aa-background-color-alpha)),rgba(128,126,163,.14));border:1px solid rgba(128,126,163,.6);border:1px solid rgba(var(--aa-muted-color-rgb),var(--aa-muted-color-alpha));border-radius:5px;box-shadow:inset 0 0 2px #fff,0 2px 2px -1px rgba(76,69,88,.15);color:inherit;font-size:.95em;font-weight:500;font-weight:var(--aa-font-weight-medium);padding:.475em 1em .6em;text-decoration:none}.aa-SourceFooterSeeAll:focus,.aa-SourceFooterSeeAll:hover{border:1px solid #3e34d3;border:1px solid rgba(var(--aa-primary-color-rgb),1);color:#3e34d3;color:rgba(var(--aa-primary-color-rgb),1)}.aa-Item{align-items:center;border-radius:3px;cursor:pointer;display:grid;min-height:40px;min-height:calc(var(--aa-spacing)*2.5);padding:4px;padding:calc(var(--aa-spacing-half)/2)}.aa-Item[aria-selected=true]{background-color:rgba(179,173,214,.205);background-color:rgba(var(--aa-selected-color-rgb),var(--aa-selected-color-alpha))}.aa-Item[aria-selected=true] .aa-ActiveOnly,.aa-Item[aria-selected=true] .aa-ItemActionButton{visibility:visible}.aa-ItemIcon{align-items:center;background:#fff;background:rgba(var(--aa-background-color-rgb),var(--aa-background-color-alpha));border-radius:3px;box-shadow:inset 0 0 0 1px rgba(128,126,163,.3);box-shadow:inset 0 0 0 1px rgba(var(--aa-panel-border-color-rgb),var(--aa-panel-border-color-alpha));color:#7777a3;color:rgba(var(--aa-icon-color-rgb),var(--aa-icon-color-alpha));display:flex;flex-shrink:0;font-size:.7em;height:28px;height:calc(var(--aa-icon-size) + var(--aa-spacing-half));justify-content:center;overflow:hidden;stroke-width:1.6;stroke-width:var(--aa-icon-stroke-width);text-align:center;width:28px;width:calc(var(--aa-icon-size) + var(--aa-spacing-half))}.aa-ItemIcon img{height:auto;max-height:20px;max-height:calc(var(--aa-icon-size) + var(--aa-spacing-half) - 8px);max-width:20px;max-width:calc(var(--aa-icon-size) + var(--aa-spacing-half) - 8px);width:auto}.aa-ItemIcon svg{height:20px;height:var(--aa-icon-size);width:20px;width:var(--aa-icon-size)}.aa-ItemIcon--alignTop{align-self:flex-start}.aa-ItemIcon--noBorder{background:none;box-shadow:none}.aa-ItemIcon--picture{height:96px;width:96px}.aa-ItemIcon--picture img{max-height:100%;max-width:100%;padding:8px;padding:var(--aa-spacing-half)}.aa-ItemContent{align-items:center;cursor:pointer;display:grid;grid-gap:8px;gap:8px;grid-gap:var(--aa-spacing-half);gap:var(--aa-spacing-half);grid-auto-flow:column;line-height:1.25em;overflow:hidden}.aa-ItemContent:empty{display:none}.aa-ItemContent mark{background:none;color:#262627;color:rgba(var(--aa-text-color-rgb),var(--aa-text-color-alpha));font-style:normal;font-weight:700;font-weight:var(--aa-font-weight-bold)}.aa-ItemContent--dual{display:flex;flex-direction:column;justify-content:space-between;text-align:left}.aa-ItemContent--dual .aa-ItemContentSubtitle,.aa-ItemContent--dual .aa-ItemContentTitle{display:block}.aa-ItemContent--indented{padding-left:36px;padding-left:calc(var(--aa-icon-size) + var(--aa-spacing))}.aa-ItemContentBody{display:grid;grid-gap:4px;gap:4px;grid-gap:calc(var(--aa-spacing-half)/2);gap:calc(var(--aa-spacing-half)/2)}.aa-ItemContentTitle{display:inline-block;margin:0 .5em 0 0;max-width:100%;overflow:hidden;padding:0;text-overflow:ellipsis;white-space:nowrap}.aa-ItemContentSubtitle{font-size:.92em}.aa-ItemContentSubtitleIcon:before{border-color:rgba(128,126,163,.64);border-color:rgba(var(--aa-muted-color-rgb),.64);border-style:solid;content:"";display:inline-block;left:1px;position:relative;top:-3px}.aa-ItemContentSubtitle--inline .aa-ItemContentSubtitleIcon:before{border-width:0 0 1.5px;margin-left:8px;margin-left:var(--aa-spacing-half);margin-right:4px;margin-right:calc(var(--aa-spacing-half)/2);width:10px;width:calc(var(--aa-spacing-half) + 2px)}.aa-ItemContentSubtitle--standalone{align-items:center;color:#262627;color:rgba(var(--aa-text-color-rgb),var(--aa-text-color-alpha));display:grid;grid-gap:8px;gap:8px;grid-gap:var(--aa-spacing-half);gap:var(--aa-spacing-half);grid-auto-flow:column;justify-content:start}.aa-ItemContentSubtitle--standalone .aa-ItemContentSubtitleIcon:before{border-radius:0 0 0 3px;border-width:0 0 1.5px 1.5px;height:8px;height:var(--aa-spacing-half);width:8px;width:var(--aa-spacing-half)}.aa-ItemContentSubtitleCategory{color:#807ea3;color:rgba(var(--aa-muted-color-rgb),1);font-weight:500}.aa-ItemContentDescription{color:#262627;color:rgba(var(--aa-text-color-rgb),var(--aa-text-color-alpha));font-size:.85em;max-width:100%;overflow-x:hidden;text-overflow:ellipsis}.aa-ItemContentDescription:empty{display:none}.aa-ItemContentDescription mark{background:rgba(245,223,77,.5);background:rgba(var(--aa-description-highlight-background-color-rgb),var(--aa-description-highlight-background-color-alpha));color:#262627;color:rgba(var(--aa-text-color-rgb),var(--aa-text-color-alpha));font-style:normal;font-weight:500;font-weight:var(--aa-font-weight-medium)}.aa-ItemContentDash{color:rgba(128,126,163,.6);color:rgba(var(--aa-muted-color-rgb),var(--aa-muted-color-alpha));display:none;opacity:.4}.aa-ItemContentTag{background-color:rgba(62,52,211,.2);background-color:rgba(var(--aa-primary-color-rgb),var(--aa-primary-color-alpha));border-radius:3px;margin:0 .4em 0 0;padding:.08em .3em}.aa-ItemLink,.aa-ItemWrapper{align-items:center;color:inherit;display:grid;grid-gap:4px;gap:4px;grid-gap:calc(var(--aa-spacing-half)/2);gap:calc(var(--aa-spacing-half)/2);grid-auto-flow:column;justify-content:space-between;width:100%}.aa-ItemLink{color:inherit;text-decoration:none}.aa-ItemActions{display:grid;grid-auto-flow:column;height:100%;justify-self:end;margin:0 -5.3333333333px;margin:0 calc(var(--aa-spacing)/-3);padding:0 2px 0 0}.aa-ItemActionButton{align-items:center;background:none;border:0;color:rgba(128,126,163,.6);color:rgba(var(--aa-muted-color-rgb),var(--aa-muted-color-alpha));cursor:pointer;display:flex;flex-shrink:0;padding:0}.aa-ItemActionButton:focus svg,.aa-ItemActionButton:hover svg{color:#262627;color:rgba(var(--aa-text-color-rgb),var(--aa-text-color-alpha))}@media (hover:none) and (pointer:coarse){.aa-ItemActionButton:focus svg,.aa-ItemActionButton:hover svg{color:inherit}}.aa-ItemActionButton svg{color:rgba(128,126,163,.6);color:rgba(var(--aa-muted-color-rgb),var(--aa-muted-color-alpha));margin:5.3333333333px;margin:calc(var(--aa-spacing)/3);stroke-width:1.6;stroke-width:var(--aa-icon-stroke-width);width:20px;width:var(--aa-action-icon-size)}.aa-ActiveOnly{visibility:hidden}.aa-PanelHeader{align-items:center;background:#3e34d3;background:rgba(var(--aa-primary-color-rgb),1);color:#fff;display:grid;height:var(--aa-modal-header-height);margin:0;padding:8px 16px;padding:var(--aa-spacing-half) var(--aa-spacing);position:relative}.aa-PanelHeader:after{background-image:linear-gradient(#fff,hsla(0,0%,100%,0));background-image:linear-gradient(rgba(var(--aa-background-color-rgb),1),rgba(var(--aa-background-color-rgb),0));bottom:-8px;bottom:calc(var(--aa-spacing-half)*-1);content:"";height:8px;height:var(--aa-spacing-half);left:0;pointer-events:none;position:absolute;right:0}.aa-PanelFooter,.aa-PanelHeader:after{z-index:9999;z-index:var(--aa-base-z-index)}.aa-PanelFooter{background-color:#fff;background-color:rgba(var(--aa-background-color-rgb),var(--aa-background-color-alpha));box-shadow:inset 0 1px 0 rgba(128,126,163,.3);box-shadow:inset 0 1px 0 rgba(var(--aa-panel-border-color-rgb),var(--aa-panel-border-color-alpha));display:flex;justify-content:space-between;margin:0;padding:16px;padding:var(--aa-spacing);position:relative}.aa-PanelFooter:after{background-image:linear-gradient(hsla(0,0%,100%,0),rgba(128,126,163,.6));background-image:linear-gradient(rgba(var(--aa-background-color-rgb),0),rgba(var(--aa-muted-color-rgb),var(--aa-muted-color-alpha)));content:"";height:16px;height:var(--aa-spacing);left:0;opacity:.12;pointer-events:none;position:absolute;right:0;top:-16px;top:calc(var(--aa-spacing)*-1);z-index:9998;z-index:calc(var(--aa-base-z-index) - 1)}.aa-DetachedContainer{background:#fff;background:rgba(var(--aa-background-color-rgb),var(--aa-background-color-alpha));bottom:0;box-shadow:0 0 0 1px rgba(35,38,59,.1),0 6px 16px -4px rgba(35,38,59,.15);box-shadow:var(--aa-panel-shadow);display:flex;flex-direction:column;left:0;margin:0;overflow:hidden;padding:0;position:fixed;right:0;top:0;z-index:9999;z-index:var(--aa-base-z-index)}.aa-DetachedContainer:after{height:32px}.aa-DetachedContainer .aa-SourceHeader{margin:8px 0 8px 2px;margin:var(--aa-spacing-half) 0 var(--aa-spacing-half) 2px}.aa-DetachedContainer .aa-Panel{background-color:#fff;background-color:rgba(var(--aa-background-color-rgb),var(--aa-background-color-alpha));border-radius:0;box-shadow:none;flex-grow:1;margin:0;padding:0;position:relative}.aa-DetachedContainer .aa-PanelLayout{bottom:0;box-shadow:none;left:0;margin:0;max-height:none;overflow-y:auto;position:absolute;right:0;top:0;width:100%}.aa-DetachedFormContainer{border-bottom:1px solid rgba(128,126,163,.3);border-bottom:1px solid rgba(var(--aa-panel-border-color-rgb),var(--aa-panel-border-color-alpha));display:flex;flex-direction:row;justify-content:space-between;margin:0;padding:8px;padding:var(--aa-spacing-half)}.aa-DetachedCancelButton{background:none;border:0;border-radius:3px;color:inherit;color:#262627;color:rgba(var(--aa-text-color-rgb),var(--aa-text-color-alpha));cursor:pointer;font:inherit;margin:0 0 0 8px;margin:0 0 0 var(--aa-spacing-half);padding:0 8px;padding:0 var(--aa-spacing-half)}.aa-DetachedCancelButton:focus,.aa-DetachedCancelButton:hover{box-shadow:inset 0 0 0 1px rgba(128,126,163,.3);box-shadow:inset 0 0 0 1px rgba(var(--aa-panel-border-color-rgb),var(--aa-panel-border-color-alpha))}.aa-DetachedContainer--modal{border-radius:6px;bottom:inherit;height:auto;margin:0 auto;max-width:680px;max-width:var(--aa-detached-modal-max-width);position:absolute;top:3%}.aa-DetachedContainer--modal .aa-PanelLayout{max-height:500px;max-height:var(--aa-detached-modal-max-height);padding-bottom:8px;padding-bottom:var(--aa-spacing-half);position:static}.aa-DetachedSearchButton{align-items:center;background-color:#fff;background-color:rgba(var(--aa-input-background-color-rgb),var(--aa-input-background-color-alpha));border:1px solid rgba(128,126,163,.8);border:1px solid rgba(var(--aa-input-border-color-rgb),var(--aa-input-border-color-alpha));border-radius:3px;color:rgba(128,126,163,.6);color:rgba(var(--aa-muted-color-rgb),var(--aa-muted-color-alpha));cursor:pointer;display:flex;font:inherit;font-family:inherit;font-family:var(--aa-font-family);font-size:16px;font-size:var(--aa-font-size);height:44px;height:var(--aa-search-input-height);margin:0;padding:0 5.5px;padding:0 calc(var(--aa-search-input-height)/8);position:relative;text-align:left;width:100%}.aa-DetachedSearchButton:focus{border-color:#3e34d3;border-color:rgba(var(--aa-primary-color-rgb),1);box-shadow:0 0 0 3px rgba(62,52,211,.2),inset 0 0 0 2px rgba(62,52,211,.2);box-shadow:rgba(var(--aa-primary-color-rgb),var(--aa-primary-color-alpha)) 0 0 0 3px,inset rgba(var(--aa-primary-color-rgb),var(--aa-primary-color-alpha)) 0 0 0 2px;outline:medium none currentColor}.aa-DetachedSearchButtonIcon{align-items:center;color:#3e34d3;color:rgba(var(--aa-primary-color-rgb),1);cursor:auto;display:flex;flex-shrink:0;height:100%;justify-content:center;width:36px;width:calc(var(--aa-icon-size) + var(--aa-spacing))}.aa-DetachedSearchButtonQuery{color:#262627;color:rgba(var(--aa-text-color-rgb),1);line-height:1.25em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.aa-DetachedSearchButtonPlaceholder[hidden]{display:none}.aa-Detached{height:100vh;overflow:hidden}.aa-DetachedOverlay{background-color:rgba(115,114,129,.4);background-color:rgba(var(--aa-overlay-color-rgb),var(--aa-overlay-color-alpha));height:100vh;left:0;margin:0;padding:0;position:fixed;right:0;top:0;z-index:9998;z-index:calc(var(--aa-base-z-index) - 1)}.aa-GradientBottom,.aa-GradientTop{height:8px;height:var(--aa-spacing-half);left:0;pointer-events:none;position:absolute;right:0;z-index:9999;z-index:var(--aa-base-z-index)}.aa-GradientTop{background-image:linear-gradient(#fff,hsla(0,0%,100%,0));background-image:linear-gradient(rgba(var(--aa-background-color-rgb),1),rgba(var(--aa-background-color-rgb),0));top:0}.aa-GradientBottom{background-image:linear-gradient(hsla(0,0%,100%,0),#fff);background-image:linear-gradient(rgba(var(--aa-background-color-rgb),0),rgba(var(--aa-background-color-rgb),1));border-bottom-left-radius:4px;border-bottom-left-radius:calc(var(--aa-spacing)/4);border-bottom-right-radius:4px;border-bottom-right-radius:calc(var(--aa-spacing)/4);bottom:0}@media (hover:none) and (pointer:coarse){.aa-DesktopOnly{display:none}}@media (hover:hover){.aa-TouchOnly{display:none}}
\ No newline at end of file diff --git a/themes/itheme/static/css/custom.css b/themes/itheme/static/css/custom.css new file mode 100644 index 0000000..3e89938 --- /dev/null +++ b/themes/itheme/static/css/custom.css @@ -0,0 +1,455 @@ +blockquote { + width: 653px; + margin-left: auto; + margin-right: auto; + box-sizing: border-box; +} + +@media only screen and (max-width: 1068px) { + blockquote { + width: 576px; + } +} + +@media only screen and (max-width: 734px) { + blockquote { + width: 87.5%; + max-width: 414px; + } +} + +h1.pagebody-header { + font-size: 1.5em; +} + +h2.pagebody-header{ + font-size: 1.4em; +} + +h3.pagebody-header{ + font-size: 1.3em; +} + +h4.pagebody-header{ + font-size: 1.2em; +} + +h5.pagebody-header{ + font-size: 1.1em; +} + +h6.pagebody-header{ + font-size: 1em; +} + +.code pre { + border-radius: 0; +} + +code { + margin: 0 0 0 0.2em; + line-height: 1.8em; +} + +.pagination-ctrl { + margin-top: 60px; + margin-bottom: 60px +} + +@media only screen and (max-width: 734px) { + .pagination-ctrl { + margin-top:13px; + margin-bottom: 45px + } +} + +.pagination-ctrl__content { + max-width: 980px; + margin: 0 auto; + padding: 0 22px; + max-width: 330px; + margin: 0 auto; + position: relative; + display: flex; + align-items: center +} + +@media only screen and (max-width: 734px) { + .pagination-ctrl__content { + padding:0 16px; + max-width:314px; + } +} + +.pagination-ctrl__btn { + display: block; + background-color: #06c; + border-radius: 100%; + font-size: 36px; + height: 1em; + line-height: 1em; + position: relative; + text-align: center; + transition: background-color 0.3s ease; + width: 1em +} + +.pagination-ctrl__btn.hide { + display: none +} + + +@media (hover: hover) { + .pagination-ctrl__btn:hover { + background-color:#1d1d1f; + text-decoration: none + } +} + +.pagination-ctrl__btn[data-focus-method=key] { + background-color: #1d1d1f; + text-decoration: none +} + +.pagination-ctrl__btn--disabled { + background-color: #c4c4c4; + pointer-events: none +} + +.pagination-ctrl__info { + font-size: 17px; + line-height: 1.47059; + font-weight: 400; + letter-spacing: -.022em; + font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; + text-align: center; + flex: 1 0 1px +} + +.pagination-ctrl__info:lang(zh-CN) { + font-family: "SF Pro SC","SF Pro Text","SF Pro Icons","PingFang SC","Helvetica Neue","Helvetica","Arial",sans-serif +} + +.pagination-ctrl__info__text { + display: inline-block; + vertical-align: middle +} + + +.icon.icon-paginationleft { + transform: scaleX(-1) +} + + +.results__content { + margin-left: auto; + margin-right: auto; + width: 980px +} + +@media only screen and (min-width: 1441px) { + .results__content { + margin-left:auto; + margin-right: auto; + width: 980px + } +} + +@media only screen and (max-width: 1068px) { + .results__content { + margin-left:auto; + margin-right: auto; + width: 692px + } +} + +@media only screen and (max-width: 734px) { + .results__content { + margin-left:auto; + margin-right: auto; + width: 87.5% + } +} + +.result:last-of-type { + border-bottom: 1px solid #d2d2d7; + padding-bottom: 32px; + margin-bottom: 80px +} + +@media only screen and (max-width: 1068px) { + .result:last-of-type { + padding-bottom:24px; + margin-bottom: 64px + } +} + +@media only screen and (max-width: 734px) { + .result:last-of-type { + margin-bottom:44px + } +} + +.result__title { + margin-bottom: 16px; + font-size: 28px; + line-height: 1.14286; + font-weight: 700; + letter-spacing: .007em; + font-family: "SF Pro Display","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; + margin-top: 52px +} + +.result__title:lang(zh-CN) { + font-family: "SF Pro SC","SF Pro Display","SF Pro Icons","PingFang SC","Helvetica Neue","Helvetica","Arial",sans-serif +} + +@media only screen and (max-width: 1068px) { + .result__title { + font-size:24px; + line-height: 1.16667; + font-weight: 700; + letter-spacing: .009em; + font-family: "SF Pro Display","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif + } + + .result__title:lang(zh-CN) { + font-family: "SF Pro SC","SF Pro Display","SF Pro Icons","PingFang SC","Helvetica Neue","Helvetica","Arial",sans-serif + } +} + +@media only screen and (max-width: 734px) { + .result__title { + font-size:21px; + line-height: 1.19048; + font-weight: 700; + letter-spacing: .011em; + font-family: "SF Pro Display","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif + } + + .result__title:lang(zh-CN) { + font-family: "SF Pro SC","SF Pro Display","SF Pro Icons","PingFang SC","Helvetica Neue","Helvetica","Arial",sans-serif + } +} + +@media only screen and (max-width: 1068px) { + .result__title { + margin-top:48px + } +} + +@media only screen and (max-width: 734px) { + .result__title { + margin-top:44px + } +} + +.result__summary { + color: #6e6e73; + text-transform: lowercase; + font-size: 12px; + line-height: 1.33337; + font-weight: 600; + letter-spacing: -.01em; + font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; + margin-top: 40px; + margin-bottom: 32px +} + +.result__summary:lang(zh-CN) { + font-family: "SF Pro SC","SF Pro Text","SF Pro Icons","PingFang SC","Helvetica Neue","Helvetica","Arial",sans-serif +} + +@media only screen and (max-width: 1068px) { + .result__summary { + margin-bottom:24px + } +} + +@media only screen and (max-width: 734px) { + .result__summary { + margin-top:32px + } +} + +.result__item { + display: flex; + justify-content: flex-start; + margin: 0; + border-top: 1px solid #d2d2d7; + align-items: center; + padding: 32px 0 +} + +@media only screen and (max-width: 1068px) { + .result__item { + padding:24px 0 + } +} + +@media only screen and (max-width: 734px) { + .result__item { + align-items:flex-start + } +} + +.result__item:last-of-type { + padding-bottom: 0 +} + +.result__item.row-anchor:hover { + text-decoration: none +} + +.result__item .viewport-picture { + align-self: flex-start; + flex-shrink: 0; + font-size: 0; + width: 295px +} + +@media only screen and (max-width: 1068px) { + .result__item .viewport-picture { + width:264px + } +} + +@media only screen and (max-width: 734px) { + .result__item .viewport-picture { + width:106px + } +} + +.result__item .viewport-image { + width: 100%; + border-radius: 16px +} + +@media only screen and (max-width: 734px) { + .result__item .viewport-image { + border-radius:7px + } +} + + +.item__content { + margin-left: 32px +} + +@media only screen and (max-width: 1068px) { + .item__content { + margin-left:24px + } +} + +@media only screen and (max-width: 734px) { + .item__content { + margin-left:16px + } +} + +.item__category { + color: #6e6e73; + font-size: 12px; + line-height: 1.33337; + font-weight: 700; + letter-spacing: -.01em; + font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; + text-transform: uppercase +} + +.item__category:lang(zh-CN) { + font-family: "SF Pro SC","SF Pro Text","SF Pro Icons","PingFang SC","Helvetica Neue","Helvetica","Arial",sans-serif +} + +.item__headline { + font-size: 24px; + line-height: 1.16667; + font-weight: 700; + letter-spacing: .009em; + font-family: "SF Pro Display","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; + margin-top: 8px +} + +.item__headline:lang(zh-CN) { + font-family: "SF Pro SC","SF Pro Display","SF Pro Icons","PingFang SC","Helvetica Neue","Helvetica","Arial",sans-serif +} + +@media only screen and (max-width: 1068px) { + .item__headline { + font-size:21px; + line-height: 1.19048; + font-weight: 700; + letter-spacing: .011em; + font-family: "SF Pro Display","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif + } + + .item__headline:lang(zh-CN) { + font-family: "SF Pro SC","SF Pro Display","SF Pro Icons","PingFang SC","Helvetica Neue","Helvetica","Arial",sans-serif + } +} + +@media only screen and (max-width: 734px) { + .item__headline { + font-size:17px; + line-height: 1.23536; + font-weight: 700; + letter-spacing: -.022em; + font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif + } + + .item__headline:lang(zh-CN) { + font-family: "SF Pro SC","SF Pro Text","SF Pro Icons","PingFang SC","Helvetica Neue","Helvetica","Arial",sans-serif + } +} + +@media only screen and (max-width: 734px) { + .item__headline { + margin-top:4px + } +} + +.item__date { + color: #6e6e73; + font-size: 14px; + line-height: 1.42859; + font-weight: 600; + letter-spacing: -.016em; + font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif; + margin-top: 12px +} + +.item__date:lang(zh-CN) { + font-family: "SF Pro SC","SF Pro Text","SF Pro Icons","PingFang SC","Helvetica Neue","Helvetica","Arial",sans-serif +} + +@media only screen and (max-width: 734px) { + .item__date { + font-size:14px; + line-height: 1.28577; + font-weight: 600; + letter-spacing: -.016em; + font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif + } + + .item__date:lang(zh-CN) { + font-family: "SF Pro SC","SF Pro Text","SF Pro Icons","PingFang SC","Helvetica Neue","Helvetica","Arial",sans-serif + } +} + +@media only screen and (max-width: 734px) { + .item__date { + margin-top:8px + } +} + + +.tags-list a{ + color: var(--footer-link-color); + padding: 5px 1rem; + background: var(--footer-background); + border-radius: 5px; + margin-bottom: 1rem; + display: inline-block; + margin-right: 1rem; +}
\ No newline at end of file diff --git a/themes/itheme/static/css/global.css b/themes/itheme/static/css/global.css new file mode 100644 index 0000000..33d6b95 --- /dev/null +++ b/themes/itheme/static/css/global.css @@ -0,0 +1,7392 @@ +:root { + --black: #1d1d1f; + --bg-primary: #f5f5f7; + --gray-primary: #f2f2f2; + --gray-text: #515154; + --primary: #8129d9; + --blue: #0071e3; + --footer-background: #f5f5f7; + --footer-border-color: #d2d2d7; + --footer-text-color: #6e6e73; + --footer-link-color: #424245; + --footer-pipe-color: #86868b; + --footer-directory-title-color: #1d1d1f; + --footer-directory-title-color-hover: #000; +} + + +*, +::before, +::after { + box-sizing: inherit; +} + +html { + -ms-text-size-adjust: 100%; + -webkit-text-size-adjust: 100% +} + +body { + margin: 0; + padding: 0 +} + +ul, +ol, +li, +dl, +dt, +dd, +h1, +h2, +h3, +h4, +h5, +h6, +hgroup, +p, +blockquote, +figure, +form, +fieldset, +input, +legend, +pre, +abbr, +button { + margin: 0; + padding: 0 +} + +pre, +code, +address, +caption, +th, +figcaption { + font-size: .875em; + font-family: SF Mono, monaco, -apple-system, roboto mono, monospace; + font-weight: normal; + font-style: normal +} + +fieldset, +iframe { + border: 0 +} + +caption, +th { + text-align: left +} + +table { + border-collapse: collapse; + border-spacing: 0 +} + +main, +summary, +details { + display: block +} + +audio, +canvas, +video, +progress { + vertical-align: baseline +} + +button { + background: none; + border: 0; + box-sizing: content-box; + color: inherit; + cursor: pointer; + font: inherit; + line-height: inherit; + overflow: visible; + vertical-align: inherit +} + +button:disabled { + cursor: default +} + +:focus[data-focus-method="mouse"]:not(input):not(textarea):not(select), +:focus[data-focus-method="touch"]:not(input):not(textarea):not(select) { + outline: none +} + +::-moz-focus-inner { + border: 0; + padding: 0 +} + +html { + font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + font-size: 106.25%; + quotes: "“" "”" +} + +body { + font-size: 17px; + line-height: 1.47059; + font-weight: 400; + letter-spacing: -.022em; + font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + background-color: #fff; + color: #1d1d1f; + font-style: normal +} + +.content-body { + margin: 0 auto; + max-width: 980px; + padding: 0 22px; +} + +h1, +h2, +h3, +h4, +h5, +h6 { + font-weight: 600; + color: #1d1d1f +} + +h1 img, +h2 img, +h3 img, +h4 img, +h5 img, +h6 img { + display: block; + margin: 0 +} + +h1+*, +h2+*, +h3+*, +h4+*, +h5+*, +h6+* { + margin-top: .8em +} + +h1+h1, +h1+h2, +h1+h3, +h1+h4, +h1+h5, +h1+h6, +h2+h1, +h2+h2, +h2+h3, +h2+h4, +h2+h5, +h2+h6, +h3+h1, +h3+h2, +h3+h3, +h3+h4, +h3+h5, +h3+h6, +h4+h1, +h4+h2, +h4+h3, +h4+h4, +h4+h5, +h4+h6, +h5+h1, +h5+h2, +h5+h3, +h5+h4, +h5+h5, +h5+h6, +h6+h1, +h6+h2, +h6+h3, +h6+h4, +h6+h5, +h6+h6 { + margin-top: .4em +} + +p+h1, +ul+h1, +ol+h1, +p+h2, +ul+h2, +ol+h2, +p+h3, +ul+h3, +ol+h3, +p+h4, +ul+h4, +ol+h4, +p+h5, +ul+h5, +ol+h5, +p+h6, +ul+h6, +ol+h6 { + margin-top: 1.6em +} + +.heading-collapsed+* { + margin-top: 0 +} + +p+*, +ul+*, +ol+* { + margin-top: .8em +} + +ul, +ol { + margin-left: 1.17647em +} + +ul ul, +ul ol, +ol ul, +ol ol { + margin-top: 0; + margin-bottom: 0 +} + +nav ul, +nav ol { + margin: 0; + list-style: none +} + +li li { + font-size: 1em +} + +a, +.link { + color: #06c; + letter-spacing: inherit +} + +a:link, +a:visited, +.link:link, +.link:visited { + text-decoration: none +} + +a:hover, +.link:hover { + text-decoration: underline +} + +a:active, +.link:active { + text-decoration: none +} + +a:disabled, +.link:disabled { + opacity: .32 +} + + +.css-sticky { + position: -webkit-sticky; + position: sticky; +} + +header{ + position: sticky; + top: 0; + z-index: 2; +} + +.nav { + position: relative; + top: 0; + left: 0; + width: 100%; + min-width: 1024px; + z-index: 9997; + height: 3.05882rem; + backdrop-filter: saturate(180%) blur(20px); +} + +.nav::after{ + position: absolute; + content: " "; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: rgba(255,255,255,0.7); +} + +.theme-dark .nav::after { + background: rgba(29,29,31,0.7); +} + +.nav-title { + color: #1d1d1f; + font-size: 21px; + line-height: 1.14286; + font-weight: 600; + letter-spacing: 0.011em; + cursor: default; + display: block; + float: left; + margin: 14px 0 -18px; + padding: 0; + height: 52px; + white-space: nowrap; +} + + +.nav-item-content { + font-size: 14px; + font-weight: 500; + text-decoration: none !important; + color: #676b5f; +} + +@media only screen and (max-width: 734px) { + .nav { + height: 2.82353rem; + } + + .nav-title { + font-size: 21px; + line-height: 21px; + } + + .nav-item-content { + font-size: 14px; + } +} + +@media only screen and (max-width: 1044px) { + .nav { + min-width: 320px; + } +} + +@media only screen and (max-width: 767px) { + .nav { + height: 48px; + } +} + +.nav-wrapper { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: auto; + min-height: 100%; + z-index: 1; +} + +.nav-content-wrapper { + margin: 0 auto; + max-width: 980px; + padding: 0 22px; + position: relative; + z-index: 2; +} + +.nav-content { + display: flex; + align-items: center; + justify-content: space-between; + flex-direction: row; +} + +.nav-menu { + display: flex; + flex-direction: row; + align-items: center; +} + + + +a.nav-title:hover { + cursor: pointer; + text-decoration: none; +} + +.nav-item-wrapper { + margin: 0px 5px; + padding: 6px 10px; + border-radius: 10px; +} + + +.nav-item-wrapper a:hover { + color: #2997ff; +} + +.main { + padding: 0; + overflow-x: hidden +} + +.nr-scroll-animation { + --nr-animation-transform-x: 0; + --nr-animation-transform-y: 0; + --nr-animation-transform-scale: 1; + --nr-animation-duration: 800ms; +} + +.nr-scroll-animation--off { + opacity: 0 !important; +} + +.nr-scroll-animation--on { + animation-name: nr-scroll-animation; + animation-duration: var(--nr-animation-duration); + animation-timing-function: cubic-bezier(0.4, 0, 0.25, 1); +} + +.tile { + background-color: #fff; + display: flex; + border-radius: 16px; + overflow: hidden; + z-index: 0; + position: relative +} + +.tile .tile__description { + display: flex; + flex-direction: column; + flex-shrink: 0; + flex-grow: 1 +} + +.tile .tile__media { + direction: ltr +} + +@media only screen and (max-width: 734px) { + .tile { + border-radius: 12px + } +} + +.tile__category, +.tile__timestamp { + color: #6e6e73 +} + +.tile__headline { + color: #1d1d1f; + -webkit-line-clamp: 6; + -webkit-box-orient: vertical; + display: -webkit-box; + overflow: hidden +} + +@media (hover: hover) { + .tile:hover { + text-decoration: none + } +} + +.tile[data-focus-method=key] { + text-decoration: none +} + +.tile .media--video, +.tile .image { + transition: transform 400ms cubic-bezier(0.4, 0, 0.25, 1) 0ms +} + +@media (hover: hover) { + + html.no-touch.no-reduced-motion .tile:hover .image, + html.no-touch.no-reduced-motion .tile:hover .media--video { + transform: scale(1.03) + } +} + +html.no-touch.no-reduced-motion .tile[data-focus-method=key] .image, +html.no-touch.no-reduced-motion .tile[data-focus-method=key] .media--video { + transform: scale(1.03) +} + +.tile__category { + font-size: 12px; + line-height: 1.33337; + font-weight: 700; + letter-spacing: -.01em; + font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile__category:lang(ar) { + line-height: 1.66667; + letter-spacing: 0em; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile__category:lang(ja) { + line-height: 1.41667; + letter-spacing: 0em; + font-family: "SF Pro JP", "SF Pro Text", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile__category:lang(ko) { + line-height: 1.41667; + letter-spacing: 0em; + font-family: "SF Pro KR", "SF Pro Text", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile__category:lang(zh) { + letter-spacing: 0em +} + +.tile__category:lang(th) { + line-height: 1.33337; + letter-spacing: 0em; + font-family: "SF Pro TH", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile__category:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile__category:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile__category:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile__category:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile__timestamp { + font-size: 14px; + line-height: 1.28577; + font-weight: 600; + letter-spacing: -.016em; + font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + display: flex; + justify-content: flex-start; + align-items: center +} + +.tile__timestamp:lang(ar) { + letter-spacing: 0em; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile__timestamp:lang(ja) { + line-height: 1.35718; + letter-spacing: 0em; + font-family: "SF Pro JP", "SF Pro Text", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile__timestamp:lang(ko) { + line-height: 1.42859; + letter-spacing: 0em; + font-family: "SF Pro KR", "SF Pro Text", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile__timestamp:lang(zh) { + letter-spacing: 0em +} + +.tile__timestamp:lang(th) { + line-height: 1.35718; + letter-spacing: 0em; + font-family: "SF Pro TH", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile__timestamp:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile__timestamp:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile__timestamp:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile__timestamp:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile__media { + position: relative; + z-index: 0; + flex-grow: 0; + flex-shrink: 0; + overflow: hidden +} + +.image-load { + opacity: 0; + transform: translateY(20vh); +} + +.image-loaded { + opacity: 1; + transform: none; + transition: transform 800ms cubic-bezier(0.4, 0, 0.25, 1) 0ms, opacity 1s cubic-bezier(0.4, 0, 0.25, 1) 0ms +} + +html.js .tile[data-progressive-load] .image { + background-image: none +} + + +@keyframes nr-scroll-animation { + from { + opacity: 0; + transform: translate(var(--nr-animation-transform-x), var(--nr-animation-transform-y)) scale(var(--nr-animation-transform-scale)) + } + + to { + opacity: 1; + transform: translate(0, 0) scale(1) + } +} + +html.js .tile.large-load .image { + opacity: 0; + transform: translateY(20px); +} + +html.js .tile.large-loaded .image { + opacity: 1; + transform: none; + transition: transform 400ms cubic-bezier(0.4, 0, 0.25, 1) 0ms, opacity 1s cubic-bezier(0.4, 0, 0.25, 1) 0ms +} + +@media only screen and (max-width: 1068px) { + html.js .tile.medium-load .image { + opacity: 0; + transition: none; + transform: translateY(20px); + } + + html.js .tile.medium-loaded .image { + opacity: 1; + transform: none; + transition: transform 400ms cubic-bezier(0.4, 0, 0.25, 1) 0ms, opacity 1s cubic-bezier(0.4, 0, 0.25, 1) 0ms + } +} + +@media only screen and (max-width: 734px) { + html.js .tile.small-load .image { + opacity: 0; + transform: translateY(20px); + transition: none + } + + html.js .tile.small-loaded .image { + opacity: 1; + transform: none; + transition: transform 400ms cubic-bezier(0.4, 0, 0.25, 1) 0ms, opacity 1s cubic-bezier(0.4, 0, 0.25, 1) 0ms + } +} + +.image { + z-index: 0 +} + +@media only screen and (inverted-colors) { + .image { + filter: invert(1) + } +} + +.media--video { + position: absolute; + top: 0; + left: 0; + width: 100%; + z-index: 1 +} + +.video-ready .image { + display: none +} + +.everydayfeed { + padding-bottom: 80px; + overflow: hidden; + background-color: #f5f5f7; + margin-top: 0 +} + +@media only screen and (max-width: 1068px) { + .everydayfeed { + padding-bottom: 64px + } +} + +@media only screen and (max-width: 734px) { + .everydayfeed { + padding-bottom: 40px + } +} + +.everydayfeed .desktop-notification { + padding-top: 16px; + padding-bottom: 24px +} + +@media only screen and (max-width: 734px) { + .everydayfeed .desktop-notification { + padding-top: 12px; + padding-bottom: 12px + } +} + + +.section-content { + margin-left: auto; + margin-right: auto; + width: 980px; +} + +@media only screen and (min-width: 1441px) { + .section-content { + margin-left: auto; + margin-right: auto; + width: 980px; + } +} + +@media only screen and (max-width: 1068px) { + .section-content { + margin-left: auto; + margin-right: auto; + width: 692px; + } +} + +@media only screen and (max-width: 734px) { + .section-content { + margin-left: auto; + margin-right: auto; + width: 87.5%; + } +} + +@media only screen and (max-width: 734px) { + .section-content { + max-width: 366px; + } +} + +.section-head { + font-size: 32px; + line-height: 1.125; + font-weight: 700; + letter-spacing: 0.004em; + margin-top: 24px; + margin-bottom: 24px; +} + +@media only screen and (max-width: 1068px) { + .section-head { + font-size: 28px; + line-height: 1.14286; + font-weight: 700; + letter-spacing: 0.007em; + margin-bottom: 16px; + } +} + +.more-from-newsroom { + padding-top: 10px; + padding-bottom: 80px; + background-color: #fff; + overflow: hidden +} + +@media only screen and (max-width: 1068px) { + .more-from-newsroom { + padding-top: 14px; + padding-bottom: 64px + } +} + +@media only screen and (max-width: 734px) { + .more-from-newsroom { + padding-top: 10px; + padding-bottom: 52px + } +} + +.more-from-newsroom .section-head { + margin-bottom: 40px +} + +@media only screen and (max-width: 1068px) { + .more-from-newsroom .section-head { + margin-bottom: 28px + } +} + +@media only screen and (max-width: 734px) { + .more-from-newsroom .section-head { + margin-bottom: 24px + } +} + +.more-from-newsroom .section-tiles { + margin-right: -64px; + margin-top: 0; + justify-content: flex-start +} + +.more-from-newsroom .section-tiles::before { + margin-bottom: 32px +} + +.more-from-newsroom .section-tiles::after { + margin-top: 32px +} + +@media only screen and (max-width: 1068px) { + .more-from-newsroom .section-tiles { + margin-right: 0 + } + + .more-from-newsroom .section-tiles::before, + .more-from-newsroom .section-tiles::after { + width: 100% + } + + .more-from-newsroom .section-tiles::before { + margin-bottom: 24px + } + + .more-from-newsroom .section-tiles::after { + margin-top: 24px + } +} + +.more-from-newsroom .tile-item { + display: flex; + flex-direction: column; + width: 457px; + margin-bottom: 32px; + margin-right: 64px; + flex-grow: 1 +} + +@media only screen and (max-width: 1068px) { + .more-from-newsroom .tile-item { + margin-right: 0; + width: 100%; + margin-bottom: 24px + } +} + +.more-from-newsroom .tile-item::after { + content: ''; + flex: 0 0 auto; + height: 1px; + display: block; + background-color: #d0d0d0; + margin-top: 32px +} + +@media only screen and (max-width: 1068px) { + .more-from-newsroom .tile-item::after { + margin-top: 24px + } +} + +.more-from-newsroom .tile-item:nth-child(odd)::after { + width: calc(100% + (32px * 2)) +} + +@media only screen and (max-width: 1068px) { + .more-from-newsroom .tile-item:nth-child(odd)::after { + width: 100% + } +} + +.more-from-newsroom .tile-item:nth-last-of-type(1) { + margin-bottom: 0 +} + +.more-from-newsroom .tile-item:nth-last-of-type(1)::after { + display: none +} + +@media only screen and (min-width: 1069px) { + .more-from-newsroom .tile-item:nth-last-of-type(2):nth-of-type(odd) { + margin-bottom: 0 + } + + .more-from-newsroom .tile-item:nth-last-of-type(2):nth-of-type(odd)::after { + display: none + } +} + +.more-from-newsroom .view-archive-wrapper { + margin-top: 40px +} + +@media only screen and (max-width: 1068px) { + .more-from-newsroom .view-archive-wrapper { + margin-top: 28px + } +} + +@media only screen and (max-width: 734px) { + .more-from-newsroom .view-archive-wrapper { + margin-top: 24px + } +} + +.section-tiles { + align-items: stretch; + display: flex; + flex-flow: row wrap; + justify-content: space-between; + margin: 0 +} + +.section-tiles::after { + content: ''; + flex: 0 0 303px +} + + + +.section-tiles { + align-items: stretch; + display: flex; + flex-flow: row wrap; + justify-content: space-between; + margin: 0 +} + +.section-tiles::after { + content: ''; + flex: 0 0 303px +} + +@media only screen and (min-width: 1441px) { + .feature-stories .section-tiles::after { + content: none + } +} + + +.featured-header.with-keyline::after { + content: ''; + display: block; + border-top: 1px solid #d2d2d7; + width: 653px; + margin-left: auto; + margin-right: auto; + margin-top: 44px +} + +@media only screen and (max-width: 1068px) { + .featured-header.with-keyline::after { + width: 576px + } +} + +@media only screen and (max-width: 734px) { + .featured-header.with-keyline::after { + width: 87.5% + } +} + +@media only screen and (max-width: 1068px) { + .featured-header.with-keyline::after { + margin-top: 36px + } +} + +@media only screen and (max-width: 734px) { + .featured-header.with-keyline::after { + margin-top: 32px + } +} + +.featured-header .category-eyebrow { + display: flex; + justify-content: center; + margin-top: 16px +} + +@media only screen and (max-width: 734px) { + .featured-header .category-eyebrow { + margin-top: 20px + } +} + +.featured-header .category-eyebrow__category, +.featured-header .category-eyebrow__date { + color: #6e6e73; + margin: 4px 0 +} + +.featured-header .category-eyebrow__category { + display: flex; + align-items: center +} + +.featured-header .category-eyebrow__category::after { + color: #6e6e73; + content: '\2022'; + margin: 0 8px +} + +.featured-header .pagetitle .component-content { + width: 83.33333% +} + +@media only screen and (max-width: 1068px) { + .featured-header .pagetitle .component-content { + width: 100% + } +} + +@media only screen and (max-width: 734px) { + .featured-header .pagetitle .component-content { + margin-left: auto; + margin-right: auto; + width: 87.5% + } +} + +.featured-header .pagetitle .hero-headline { + font-size: 56px; + line-height: 1.07143; + font-weight: 700; + letter-spacing: -.005em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + text-align: center +} + +.featured-header .pagetitle .hero-headline:lang(ar) { + line-height: 1.21429; + letter-spacing: 0em; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.featured-header .pagetitle .hero-headline:lang(ja) { + line-height: 1.125; + letter-spacing: 0em; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.featured-header .pagetitle .hero-headline:lang(ko) { + line-height: 1.17865; + letter-spacing: 0em; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.featured-header .pagetitle .hero-headline:lang(zh) { + letter-spacing: 0em +} + +.featured-header .pagetitle .hero-headline:lang(th) { + line-height: 1.33929; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.featured-header .pagetitle .hero-headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.featured-header .pagetitle .hero-headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.featured-header .pagetitle .hero-headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.featured-header .pagetitle .hero-headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 1068px) { + .featured-header .pagetitle .hero-headline { + font-size: 48px; + line-height: 1.08349; + font-weight: 700; + letter-spacing: -.003em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .pagetitle .hero-headline:lang(ar) { + line-height: 1.25; + letter-spacing: 0em; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .pagetitle .hero-headline:lang(ja) { + line-height: 1.14599; + letter-spacing: 0em; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .pagetitle .hero-headline:lang(ko) { + line-height: 1.1875; + letter-spacing: 0em; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .pagetitle .hero-headline:lang(zh) { + letter-spacing: 0em + } + + .featured-header .pagetitle .hero-headline:lang(th) { + line-height: 1.33349; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .pagetitle .hero-headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .pagetitle .hero-headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .pagetitle .hero-headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .pagetitle .hero-headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +@media only screen and (max-width: 734px) { + .featured-header .pagetitle .hero-headline { + font-size: 32px; + line-height: 1.125; + font-weight: 700; + letter-spacing: .004em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .pagetitle .hero-headline:lang(ar) { + line-height: 1.34375; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .pagetitle .hero-headline:lang(ja) { + line-height: 1.21875; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .pagetitle .hero-headline:lang(ko) { + line-height: 1.21875; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .pagetitle .hero-headline:lang(th) { + line-height: 1.375; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .pagetitle .hero-headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .pagetitle .hero-headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .pagetitle .hero-headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .pagetitle .hero-headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +.featured-header .featured-subhead { + font-size: 24px; + line-height: 1.16667; + font-weight: 500; + letter-spacing: .009em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + text-align: center; + margin-top: 20px; + margin-bottom: 0 +} + +.featured-header .featured-subhead:lang(ar) { + line-height: 1.33341; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.featured-header .featured-subhead:lang(ja) { + line-height: 1.25; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.featured-header .featured-subhead:lang(ko) { + line-height: 1.29167; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.featured-header .featured-subhead:lang(th) { + line-height: 1.375; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.featured-header .featured-subhead:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.featured-header .featured-subhead:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.featured-header .featured-subhead:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.featured-header .featured-subhead:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 1068px) { + .featured-header .featured-subhead { + font-size: 21px; + line-height: 1.19048; + font-weight: 500; + letter-spacing: .011em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .featured-subhead:lang(ja) { + line-height: 1.2381; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .featured-subhead:lang(ko) { + line-height: 1.2858; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .featured-subhead:lang(th) { + line-height: 1.381; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .featured-subhead:lang(ar) { + line-height: 1.4286; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .featured-subhead:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .featured-subhead:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .featured-subhead:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .featured-header .featured-subhead:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +@media only screen and (max-width: 734px) { + .featured-header .featured-subhead { + margin-top: 16px + } +} + +.featured-header .sharesheet { + text-align: center; + margin-top: 24px; + margin-bottom: 0 +} + +@media only screen and (max-width: 734px) { + .featured-header .sharesheet { + margin-top: 20px + } +} + +.theme-dark .featured-header .category-eyebrow__category, +.theme-dark .featured-header .category-eyebrow__date { + color: #86868b +} + +.tile-item { + position: relative; + list-style: none +} + +.tile-item:first-child.item-1up~.tile-item, +.tile-item:first-child.item-hero~.tile-item, +.tile-item:first-child.item-hero-secondary~.tile-item, +.tile-item:first-child.item-hero-highlight~.tile-item, +.tile-item:first-child.item-hero-highlight-secondary~.tile-item, +.tile-item:first-child.item-super-hero~.tile-item, +.tile-item:first-child.item-super-hero-secondary~.tile-item, +.tile-item:first-child.item-portrait~.tile-item, +.tile-item:first-child.item-portrait-secondary~.tile-item, +.tile-item:first-child.item-hero-reversed~.tile-item { + margin-top: 36px +} + +@media only screen and (max-width: 1068px) { + + .tile-item:first-child.item-1up~.tile-item, + .tile-item:first-child.item-hero~.tile-item, + .tile-item:first-child.item-hero-secondary~.tile-item, + .tile-item:first-child.item-hero-highlight~.tile-item, + .tile-item:first-child.item-hero-highlight-secondary~.tile-item, + .tile-item:first-child.item-super-hero~.tile-item, + .tile-item:first-child.item-super-hero-secondary~.tile-item, + .tile-item:first-child.item-portrait~.tile-item, + .tile-item:first-child.item-portrait-secondary~.tile-item, + .tile-item:first-child.item-hero-reversed~.tile-item { + margin-top: 24px + } +} + +@media only screen and (max-width: 1068px) { + + .tile-item:first-child.item-hero-secondary~ :nth-child(2), + .tile-item:first-child.item-hero-highlight-secondary~ :nth-child(2), + .tile-item:first-child.item-super-hero-secondary~ :nth-child(2), + .tile-item:first-child.item-portrait-secondary~ :nth-child(2) { + margin-top: 0 + } +} + +@media only screen and (max-width: 734px) { + + .tile-item:first-child.item-hero-secondary~ :nth-child(2), + .tile-item:first-child.item-hero-highlight-secondary~ :nth-child(2), + .tile-item:first-child.item-super-hero-secondary~ :nth-child(2), + .tile-item:first-child.item-portrait-secondary~ :nth-child(2) { + margin-top: 24px + } +} + +.tile-item:first-child.item-2up~ :nth-child(2)~.tile-item, +.tile-item:first-child.item-2up-feature~ :nth-child(2)~.tile-item { + margin-top: 36px +} + +@media only screen and (max-width: 1068px) { + + .tile-item:first-child.item-2up~ :nth-child(2)~.tile-item, + .tile-item:first-child.item-2up-feature~ :nth-child(2)~.tile-item { + margin-top: 24px + } +} + +@media only screen and (max-width: 734px) { + + .tile-item:first-child.item-2up~ :nth-child(2), + .tile-item:first-child.item-2up-feature~ :nth-child(2) { + margin-top: 24px + } +} + +.tile-item:first-child.item-3up~ :nth-child(3)~.tile-item { + margin-top: 36px +} + +@media only screen and (max-width: 1068px) { + .tile-item:first-child.item-3up~ :nth-child(3)~.tile-item { + margin-top: 24px + } +} + +@media only screen and (max-width: 1068px) { + .tile-item:first-child.item-3up~ :nth-child(3) { + margin-top: 24px + } +} + +@media only screen and (max-width: 734px) { + .tile-item:first-child.item-3up~ :nth-child(2) { + margin-top: 24px + } +} + + +.item-1up, +.item-hero, +.item-hero-reversed, +.item-hero-secondary, +.item-hero-highlight, +.item-hero-highlight-secondary, +.item-portrait, +.item-portrait-secondary, +.item-super-hero, +.item-super-hero-secondary { + flex-basis: 100% +} + +@media only screen and (max-width: 1068px) { + .item-2up-tertiary { + flex-basis: 100% + } + + .item-1up-secondary, + .item-hero-secondary, + .item-hero-highlight-secondary, + .item-portrait-secondary, + .item-super-hero-secondary { + flex-basis: auto + } +} + +@media only screen and (max-width: 734px) { + + .item-1up, + .item-1up-secondary, + .item-2up, + .item-2up-secondary, + .item-2up-tertiary, + .item-3up, + .item-3up-secondary, + .item-hero, + .item-hero-highlight-secondary, + .item-hero-secondary, + .item-hero-reversed, + .item-portrait-secondary, + .item-super-hero-secondary { + flex-basis: 100% + } +} + +.chiclet { + margin-left: auto; + margin-right: auto; + width: 150px; + height: 150px; + border-radius: 32px; + overflow: hidden +} + +@media only screen and (max-width: 1068px) { + .chiclet { + width: 110px; + height: 110px; + border-radius: 24px + } +} + +@media only screen and (max-width: 734px) { + .chiclet { + width: 104px; + height: 104px; + border-radius: 24px + } +} + +.chiclet img { + width: 100% +} + +.tile.tile { + height: 100% +} + +.tile.tile-1up { + width: 100% +} + +.tile.tile-2up { + flex-direction: column; + width: 472px +} + +.tile.tile-2up .tile__headline { + font-size: 24px; + line-height: 1.16667; + font-weight: 700; + letter-spacing: .009em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + -webkit-line-clamp: 6; + -webkit-box-orient: vertical; + display: -webkit-box; + overflow: hidden +} + +.tile.tile-2up .tile__headline:lang(ar) { + line-height: 1.33341; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up .tile__headline:lang(ja) { + line-height: 1.25; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up .tile__headline:lang(ko) { + line-height: 1.29167; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up .tile__headline:lang(th) { + line-height: 1.375; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 1068px) { + .tile.tile-2up .tile__headline { + font-size: 19px; + line-height: 1.21053; + font-weight: 700; + letter-spacing: .012em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up .tile__headline:lang(ar) { + line-height: 1.36844; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up .tile__headline:lang(ja) { + line-height: 1.26316; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up .tile__headline:lang(ko) { + line-height: 1.31579; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up .tile__headline:lang(th) { + line-height: 1.36844; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +.tile.tile-2up .tile__description { + padding: 32px; + justify-content: space-between; + flex-basis: auto +} + +.tile.tile-2up .tile__media { + flex-shrink: 0 +} + +.tile.tile-2up .image { + background-size: cover +} + +.tile.tile-2up .tile__media, +.tile.tile-2up .tile__image-container { + width: 100%; + height: 266px; + min-height: auto; + flex-basis: auto; + flex-shrink: 1 +} + +.tile.tile-2up .tile__category { + margin-bottom: 8px +} + +.tile.tile-2up .tile__timestamp { + margin-top: 12px +} + +@media only screen and (max-width: 1068px) { + .tile.tile-2up { + flex-direction: column; + width: 333px + } + + .tile.tile-2up .tile__description { + padding: 24px; + justify-content: space-between; + flex-basis: auto + } + + .tile.tile-2up .tile__media { + flex-shrink: 0 + } + + .tile.tile-2up .image { + background-size: cover + } + + .tile.tile-2up .tile__media, + .tile.tile-2up .tile__image-container { + width: 100%; + height: 187px; + min-height: auto; + flex-basis: auto; + flex-shrink: 1 + } + + .tile.tile-2up .tile__category { + margin-bottom: 4px + } + + .tile.tile-2up .tile__timestamp { + margin-top: 8px + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-2up { + flex-direction: column; + width: 100% + } + + .tile.tile-2up .tile__description { + padding: 24px; + justify-content: space-between; + flex-basis: auto + } + + .tile.tile-2up .tile__media { + flex-shrink: 0 + } + + .tile.tile-2up .image { + background-size: cover + } + + .tile.tile-2up .tile__media, + .tile.tile-2up .tile__image-container { + width: 100%; + height: auto; + min-height: auto; + flex-basis: auto; + flex-shrink: 1; + padding-top: 56.25%; + height: 0; + position: relative + } + + .tile.tile-2up .tile__media .viewport-image, + .tile.tile-2up .tile__media .image, + .tile.tile-2up .tile__image-container .viewport-image, + .tile.tile-2up .tile__image-container .image { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100% + } + + .tile.tile-2up .tile__category { + margin-bottom: 8px + } + + .tile.tile-2up .tile__timestamp { + margin-top: 8px + } +} + +.tile.tile-2up-secondary { + flex-direction: column; + width: 472px +} + +.tile.tile-2up-secondary .tile__headline { + font-size: 24px; + line-height: 1.16667; + font-weight: 700; + letter-spacing: .009em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + -webkit-line-clamp: 6; + -webkit-box-orient: vertical; + display: -webkit-box; + overflow: hidden +} + +.tile.tile-2up-secondary .tile__headline:lang(ar) { + line-height: 1.33341; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-secondary .tile__headline:lang(ja) { + line-height: 1.25; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-secondary .tile__headline:lang(ko) { + line-height: 1.29167; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-secondary .tile__headline:lang(th) { + line-height: 1.375; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-secondary .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-secondary .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-secondary .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-secondary .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 1068px) { + .tile.tile-2up-secondary .tile__headline { + font-size: 19px; + line-height: 1.21053; + font-weight: 700; + letter-spacing: .012em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-secondary .tile__headline:lang(ar) { + line-height: 1.36844; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-secondary .tile__headline:lang(ja) { + line-height: 1.26316; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-secondary .tile__headline:lang(ko) { + line-height: 1.31579; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-secondary .tile__headline:lang(th) { + line-height: 1.36844; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-secondary .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-secondary .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-secondary .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-secondary .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-2up-secondary .tile__headline { + font-size: 17px; + line-height: 1.23536; + font-weight: 700; + letter-spacing: -.022em; + font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-secondary .tile__headline:lang(ar) { + letter-spacing: 0em; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-secondary .tile__headline:lang(ja) { + letter-spacing: 0em; + font-family: "SF Pro JP", "SF Pro Text", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-secondary .tile__headline:lang(ko) { + line-height: 1.35296; + letter-spacing: 0em; + font-family: "SF Pro KR", "SF Pro Text", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-secondary .tile__headline:lang(zh) { + letter-spacing: 0em + } + + .tile.tile-2up-secondary .tile__headline:lang(th) { + line-height: 1.35296; + letter-spacing: 0em; + font-family: "SF Pro TH", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-secondary .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-secondary .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-secondary .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-secondary .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +.tile.tile-2up-secondary .tile__description { + padding: 32px; + justify-content: space-between; + flex-basis: auto +} + +.tile.tile-2up-secondary .tile__media { + flex-shrink: 0 +} + +.tile.tile-2up-secondary .image { + background-size: cover +} + +.tile.tile-2up-secondary .tile__media, +.tile.tile-2up-secondary .tile__image-container { + width: 100%; + height: 266px; + min-height: auto; + flex-basis: auto; + flex-shrink: 1 +} + +.tile.tile-2up-secondary .tile__category { + margin-bottom: 8px +} + +.tile.tile-2up-secondary .tile__timestamp { + margin-top: 12px +} + +@media only screen and (max-width: 1068px) { + .tile.tile-2up-secondary { + flex-direction: column; + width: 333px + } + + .tile.tile-2up-secondary .tile__description { + padding: 24px; + justify-content: space-between; + flex-basis: auto + } + + .tile.tile-2up-secondary .tile__media { + flex-shrink: 0 + } + + .tile.tile-2up-secondary .image { + background-size: cover + } + + .tile.tile-2up-secondary .tile__media, + .tile.tile-2up-secondary .tile__image-container { + width: 100%; + height: 187px; + min-height: auto; + flex-basis: auto; + flex-shrink: 1 + } + + .tile.tile-2up-secondary .tile__category { + margin-bottom: 4px + } + + .tile.tile-2up-secondary .tile__timestamp { + margin-top: 8px + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-2up-secondary { + border-radius: revert; + overflow: revert; + z-index: revert; + position: revert; + background-color: transparent; + flex-direction: row; + width: 100% + } + + .tile.tile-2up-secondary .tile__media { + border-radius: 12px; + overflow: hidden; + z-index: 0; + position: relative + } + + .tile.tile-2up-secondary .tile__description { + padding: 0 0 0 16px; + justify-content: center; + flex-basis: 0 + } + + .tile.tile-2up-secondary .tile__media { + flex-shrink: 1 + } + + .tile.tile-2up-secondary .image { + background-size: contain + } + + .tile.tile-2up-secondary .tile__media, + .tile.tile-2up-secondary .tile__image-container { + width: 105px; + height: 105px; + min-height: auto; + flex-basis: auto; + flex-shrink: 1 + } + + .tile.tile-2up-secondary .tile__category { + margin-bottom: 4px + } + + .tile.tile-2up-secondary .tile__timestamp { + margin-top: 8px + } +} + +.tile.tile-2up-tertiary { + flex-direction: column; + width: 472px +} + +.tile.tile-2up-tertiary .tile__headline { + font-size: 24px; + line-height: 1.16667; + font-weight: 700; + letter-spacing: .009em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + -webkit-line-clamp: 6; + -webkit-box-orient: vertical; + display: -webkit-box; + overflow: hidden +} + +.tile.tile-2up-tertiary .tile__headline:lang(ar) { + line-height: 1.33341; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-tertiary .tile__headline:lang(ja) { + line-height: 1.25; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-tertiary .tile__headline:lang(ko) { + line-height: 1.29167; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-tertiary .tile__headline:lang(th) { + line-height: 1.375; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-tertiary .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-tertiary .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-tertiary .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-tertiary .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 1068px) { + .tile.tile-2up-tertiary .tile__headline { + font-size: 21px; + line-height: 1.19048; + font-weight: 700; + letter-spacing: .011em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-tertiary .tile__headline:lang(ja) { + line-height: 1.2381; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-tertiary .tile__headline:lang(ko) { + line-height: 1.2858; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-tertiary .tile__headline:lang(th) { + line-height: 1.381; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-tertiary .tile__headline:lang(ar) { + line-height: 1.4286; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-tertiary .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-tertiary .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-tertiary .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-tertiary .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-2up-tertiary .tile__headline { + font-size: 19px; + line-height: 1.21053; + font-weight: 700; + letter-spacing: .012em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-tertiary .tile__headline:lang(ar) { + line-height: 1.36844; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-tertiary .tile__headline:lang(ja) { + line-height: 1.26316; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-tertiary .tile__headline:lang(ko) { + line-height: 1.31579; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-tertiary .tile__headline:lang(th) { + line-height: 1.36844; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-tertiary .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-tertiary .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-tertiary .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-tertiary .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +.tile.tile-2up-tertiary .tile__description { + padding: 32px; + justify-content: space-between; + flex-basis: auto +} + +.tile.tile-2up-tertiary .tile__media { + flex-shrink: 0 +} + +.tile.tile-2up-tertiary .image { + background-size: cover +} + +.tile.tile-2up-tertiary .tile__media, +.tile.tile-2up-tertiary .tile__image-container { + width: 100%; + height: 266px; + min-height: auto; + flex-basis: auto; + flex-shrink: 1 +} + +.tile.tile-2up-tertiary .tile__category { + margin-bottom: 8px +} + +.tile.tile-2up-tertiary .tile__timestamp { + margin-top: 12px +} + +@media only screen and (max-width: 1068px) { + .tile.tile-2up-tertiary { + flex-direction: row; + width: 100% + } + + .tile.tile-2up-tertiary .tile__description { + padding: 24px; + justify-content: space-between; + flex-basis: 0 + } + + .tile.tile-2up-tertiary .tile__media { + flex-shrink: 1 + } + + .tile.tile-2up-tertiary .image { + background-size: contain + } + + .tile.tile-2up-tertiary .tile__media, + .tile.tile-2up-tertiary .tile__image-container { + width: 100%; + height: auto; + min-height: 255px; + flex-basis: 453px; + flex-shrink: 1 + } + + .tile.tile-2up-tertiary .tile__category { + margin-bottom: 8px + } + + .tile.tile-2up-tertiary .tile__timestamp { + margin-top: 12px + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-2up-tertiary { + flex-direction: column; + width: 100% + } + + .tile.tile-2up-tertiary .tile__description { + padding: 24px; + justify-content: space-between; + flex-basis: auto + } + + .tile.tile-2up-tertiary .tile__media { + flex-shrink: 0 + } + + .tile.tile-2up-tertiary .image { + background-size: cover + } + + .tile.tile-2up-tertiary .tile__media, + .tile.tile-2up-tertiary .tile__image-container { + width: 100%; + height: auto; + min-height: auto; + flex-basis: auto; + flex-shrink: 1; + padding-top: 56.25%; + height: 0; + position: relative + } + + .tile.tile-2up-tertiary .tile__media .viewport-image, + .tile.tile-2up-tertiary .tile__media .image, + .tile.tile-2up-tertiary .tile__image-container .viewport-image, + .tile.tile-2up-tertiary .tile__image-container .image { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100% + } + + .tile.tile-2up-tertiary .tile__category { + margin-bottom: 8px + } + + .tile.tile-2up-tertiary .tile__timestamp { + margin-top: 8px + } +} + +.tile.tile-2up-feature { + display: block; + position: relative; + flex-direction: column; + width: 472px +} + +.tile.tile-2up-feature .tile__headline { + font-size: 24px; + line-height: 1.16667; + font-weight: 700; + letter-spacing: .009em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + -webkit-line-clamp: 5; + -webkit-box-orient: vertical; + display: -webkit-box; + overflow: hidden +} + +.tile.tile-2up-feature .tile__headline:lang(ar) { + line-height: 1.33341; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-feature .tile__headline:lang(ja) { + line-height: 1.25; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-feature .tile__headline:lang(ko) { + line-height: 1.29167; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-feature .tile__headline:lang(th) { + line-height: 1.375; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-feature .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-feature .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-feature .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-2up-feature .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 1068px) { + .tile.tile-2up-feature .tile__headline { + font-size: 19px; + line-height: 1.21053; + font-weight: 700; + letter-spacing: .012em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-feature .tile__headline:lang(ar) { + line-height: 1.36844; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-feature .tile__headline:lang(ja) { + line-height: 1.26316; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-feature .tile__headline:lang(ko) { + line-height: 1.31579; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-feature .tile__headline:lang(th) { + line-height: 1.36844; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-feature .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-feature .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-feature .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-2up-feature .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +.tile.tile-2up-feature .tile__gradient { + position: absolute; + bottom: 0; + width: 100%; + z-index: 0 +} + +.tile.tile-2up-feature .tile__gradient::before { + content: ''; + position: absolute; + bottom: 0; + left: 0; + width: 100%; + height: 250%; + z-index: 0; + background: linear-gradient(to top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.77311) 12.83%, rgba(0, 0, 0, 0.72685) 24%, rgba(0, 0, 0, 0.66487) 33.77%, rgba(0, 0, 0, 0.59081) 42.37%, rgba(0, 0, 0, 0.50831) 50.07%, rgba(0, 0, 0, 0.421) 57.13%, rgba(0, 0, 0, 0.33252) 63.78%, rgba(0, 0, 0, 0.24652) 70.3%, rgba(0, 0, 0, 0.16663) 76.92%, rgba(0, 0, 0, 0.09648) 83.91%, rgba(0, 0, 0, 0.03973) 91.52%, rgba(0, 0, 0, 0)); + background-size: 100.1% 100.1% +} + +.tile.tile-2up-feature .tile__gradient.autoplay-controls-wrapper { + z-index: 3 +} + +.tile.tile-2up-feature .tile__description { + width: 100%; + box-sizing: border-box; + position: relative; + z-index: 2 +} + +.tile.tile-2up-feature .tile__description-has-controls { + display: flex; + flex-direction: row +} + +.tile.tile-2up-feature .tile__description-has-controls .tile__description-content { + flex: 1 calc(100% - 44px); + box-sizing: border-box; + padding-right: 16px +} + +@media only screen and (max-width: 1068px) { + .tile.tile-2up-feature .tile__description-has-controls .tile__description-content { + flex: 1 calc(100% - 36px) + } +} + +.tile.tile-2up-feature .tile__description-has-controls .autoplay-controls-container { + flex: 1 44px +} + +@media only screen and (max-width: 1068px) { + .tile.tile-2up-feature .tile__description-has-controls .autoplay-controls-container { + flex: 1 36px + } +} + +.tile.tile-2up-feature .tile__description-content { + display: flex; + flex-direction: column +} + +.tile.tile-2up-feature .tile__headline, +.tile.tile-2up-feature .tile__category, +.tile.tile-2up-feature .tile__timestamp { + color: #fff +} + +.tile.tile-2up-feature .tile__category { + margin-bottom: 12px +} + +.tile.tile-2up-feature .tile__timestamp { + margin-top: 12px +} + +.tile.tile-2up-feature .tile__description { + padding: 0 36px 36px +} + +.tile.tile-2up-feature .tile__media { + width: 980px; + height: 551px +} + +@media only screen and (max-width: 1068px) { + .tile.tile-2up-feature .tile__category { + margin-bottom: 8px + } + + .tile.tile-2up-feature .tile__timestamp { + margin-top: 8px + } + + .tile.tile-2up-feature .tile__description { + padding: 0 24px 24px + } + + .tile.tile-2up-feature .tile__media { + width: 692px; + height: 389px + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-2up-feature .tile__category { + margin-bottom: 4px + } + + .tile.tile-2up-feature .tile__timestamp { + margin-top: 8px + } + + .tile.tile-2up-feature .tile__description { + padding: 0 24px 24px + } + + .tile.tile-2up-feature .tile__media { + width: 100%; + padding-top: 125%; + height: 0; + position: relative + } + + .tile.tile-2up-feature .tile__media .viewport-image, + .tile.tile-2up-feature .tile__media .image { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100% + } +} + +.tile.tile-2up-feature .tile__description { + padding: 36px; + justify-content: space-between; + flex-basis: auto +} + +.tile.tile-2up-feature .tile__media { + flex-shrink: 0 +} + +.tile.tile-2up-feature .image { + background-size: cover +} + +.tile.tile-2up-feature .tile__media, +.tile.tile-2up-feature .tile__image-container { + width: 100%; + height: 472px; + min-height: auto; + flex-basis: auto; + flex-shrink: 1 +} + +.tile.tile-2up-feature .tile__category { + margin-bottom: 4px +} + +.tile.tile-2up-feature .tile__timestamp { + margin-top: 12px +} + +@media only screen and (max-width: 1068px) { + .tile.tile-2up-feature { + flex-direction: column; + width: 334px + } + + .tile.tile-2up-feature .tile__description { + padding: 24px; + justify-content: space-between; + flex-basis: auto + } + + .tile.tile-2up-feature .tile__media { + flex-shrink: 0 + } + + .tile.tile-2up-feature .image { + background-size: cover + } + + .tile.tile-2up-feature .tile__media, + .tile.tile-2up-feature .tile__image-container { + width: 100%; + height: 334px; + min-height: auto; + flex-basis: auto; + flex-shrink: 1 + } + + .tile.tile-2up-feature .tile__category { + margin-bottom: 4px + } + + .tile.tile-2up-feature .tile__timestamp { + margin-top: 8px + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-2up-feature { + flex-direction: column; + width: 100% + } + + .tile.tile-2up-feature .tile__description { + padding: 24px; + justify-content: space-between; + flex-basis: auto + } + + .tile.tile-2up-feature .tile__media { + flex-shrink: 0 + } + + .tile.tile-2up-feature .image { + background-size: cover + } + + .tile.tile-2up-feature .tile__media, + .tile.tile-2up-feature .tile__image-container { + width: 100%; + height: auto; + min-height: auto; + flex-basis: auto; + flex-shrink: 1; + padding-top: 56.25%; + height: 0; + position: relative + } + + .tile.tile-2up-feature .tile__media .viewport-image, + .tile.tile-2up-feature .tile__media .image, + .tile.tile-2up-feature .tile__image-container .viewport-image, + .tile.tile-2up-feature .tile__image-container .image { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100% + } + + .tile.tile-2up-feature .tile__category { + margin-bottom: 8px + } + + .tile.tile-2up-feature .tile__timestamp { + margin-top: 8px + } + + .tile.tile-2up-feature .tile__gradient { + position: relative + } + + .tile.tile-2up-feature .tile__gradient::before { + content: none + } + + .tile.tile-2up-feature .viewport-image { + border-bottom-left-radius: 0; + border-bottom-right-radius: 0 + } +} + +.tile.tile-3up { + flex-direction: column; + width: 303px +} + +.tile.tile-3up .tile__headline { + font-size: 19px; + line-height: 1.21053; + font-weight: 700; + letter-spacing: .012em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + -webkit-line-clamp: 6; + -webkit-box-orient: vertical; + display: -webkit-box; + overflow: hidden +} + +.tile.tile-3up .tile__headline:lang(ar) { + line-height: 1.36844; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-3up .tile__headline:lang(ja) { + line-height: 1.26316; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-3up .tile__headline:lang(ko) { + line-height: 1.31579; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-3up .tile__headline:lang(th) { + line-height: 1.36844; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-3up .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-3up .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-3up .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-3up .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-3up .tile__description { + padding: 24px; + justify-content: space-between; + flex-basis: auto +} + +.tile.tile-3up .tile__media { + flex-shrink: 0 +} + +.tile.tile-3up .image { + background-size: cover +} + +.tile.tile-3up .tile__media, +.tile.tile-3up .tile__image-container { + width: 100%; + height: 170px; + min-height: auto; + flex-basis: auto; + flex-shrink: 1 +} + +.tile.tile-3up .tile__category { + margin-bottom: 4px +} + +.tile.tile-3up .tile__timestamp { + margin-top: 8px +} + +@media only screen and (max-width: 1068px) { + .tile.tile-3up { + flex-direction: column; + width: 333px + } + + .tile.tile-3up .tile__description { + padding: 24px; + justify-content: space-between; + flex-basis: auto + } + + .tile.tile-3up .tile__media { + flex-shrink: 0 + } + + .tile.tile-3up .image { + background-size: cover + } + + .tile.tile-3up .tile__media, + .tile.tile-3up .tile__image-container { + width: 100%; + height: 187px; + min-height: auto; + flex-basis: auto; + flex-shrink: 1 + } + + .tile.tile-3up .tile__category { + margin-bottom: 4px + } + + .tile.tile-3up .tile__timestamp { + margin-top: 8px + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-3up { + flex-direction: column; + width: 100% + } + + .tile.tile-3up .tile__description { + padding: 24px; + justify-content: space-between; + flex-basis: auto + } + + .tile.tile-3up .tile__media { + flex-shrink: 0 + } + + .tile.tile-3up .image { + background-size: cover + } + + .tile.tile-3up .tile__media, + .tile.tile-3up .tile__image-container { + width: 100%; + height: auto; + min-height: auto; + flex-basis: auto; + flex-shrink: 1; + padding-top: 56.25%; + height: 0; + position: relative + } + + .tile.tile-3up .tile__media .viewport-image, + .tile.tile-3up .tile__media .image, + .tile.tile-3up .tile__image-container .viewport-image, + .tile.tile-3up .tile__image-container .image { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100% + } + + .tile.tile-3up .tile__category { + margin-bottom: 8px + } + + .tile.tile-3up .tile__timestamp { + margin-top: 8px + } +} + +.tile.tile-3up-secondary { + flex-direction: column; + width: 303px +} + +.tile.tile-3up-secondary .tile__headline { + font-size: 19px; + line-height: 1.21053; + font-weight: 700; + letter-spacing: .012em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + -webkit-line-clamp: 6; + -webkit-box-orient: vertical; + display: -webkit-box; + overflow: hidden +} + +.tile.tile-3up-secondary .tile__headline:lang(ar) { + line-height: 1.36844; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-3up-secondary .tile__headline:lang(ja) { + line-height: 1.26316; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-3up-secondary .tile__headline:lang(ko) { + line-height: 1.31579; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-3up-secondary .tile__headline:lang(th) { + line-height: 1.36844; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-3up-secondary .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-3up-secondary .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-3up-secondary .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-3up-secondary .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 734px) { + .tile.tile-3up-secondary .tile__headline { + font-size: 17px; + line-height: 1.23536; + font-weight: 700; + letter-spacing: -.022em; + font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-3up-secondary .tile__headline:lang(ar) { + letter-spacing: 0em; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-3up-secondary .tile__headline:lang(ja) { + letter-spacing: 0em; + font-family: "SF Pro JP", "SF Pro Text", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-3up-secondary .tile__headline:lang(ko) { + line-height: 1.35296; + letter-spacing: 0em; + font-family: "SF Pro KR", "SF Pro Text", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-3up-secondary .tile__headline:lang(zh) { + letter-spacing: 0em + } + + .tile.tile-3up-secondary .tile__headline:lang(th) { + line-height: 1.35296; + letter-spacing: 0em; + font-family: "SF Pro TH", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-3up-secondary .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-3up-secondary .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-3up-secondary .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-3up-secondary .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +.tile.tile-3up-secondary .tile__description { + padding: 24px; + justify-content: space-between; + flex-basis: auto +} + +.tile.tile-3up-secondary .tile__media { + flex-shrink: 0 +} + +.tile.tile-3up-secondary .image { + background-size: cover +} + +.tile.tile-3up-secondary .tile__media, +.tile.tile-3up-secondary .tile__image-container { + width: 100%; + height: 170px; + min-height: auto; + flex-basis: auto; + flex-shrink: 1 +} + +.tile.tile-3up-secondary .tile__category { + margin-bottom: 4px +} + +.tile.tile-3up-secondary .tile__timestamp { + margin-top: 8px +} + +@media only screen and (max-width: 1068px) { + .tile.tile-3up-secondary { + flex-direction: column; + width: 333px + } + + .tile.tile-3up-secondary .tile__description { + padding: 24px; + justify-content: space-between; + flex-basis: auto + } + + .tile.tile-3up-secondary .tile__media { + flex-shrink: 0 + } + + .tile.tile-3up-secondary .image { + background-size: cover + } + + .tile.tile-3up-secondary .tile__media, + .tile.tile-3up-secondary .tile__image-container { + width: 100%; + height: 187px; + min-height: auto; + flex-basis: auto; + flex-shrink: 1 + } + + .tile.tile-3up-secondary .tile__category { + margin-bottom: 4px + } + + .tile.tile-3up-secondary .tile__timestamp { + margin-top: 8px + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-3up-secondary { + border-radius: revert; + overflow: revert; + z-index: revert; + position: revert; + background-color: transparent; + flex-direction: row; + width: 100% + } + + .tile.tile-3up-secondary .tile__media { + border-radius: 12px; + overflow: hidden; + z-index: 0; + position: relative + } + + .tile.tile-3up-secondary .tile__description { + padding: 0 0 0 16px; + justify-content: center; + flex-basis: 0 + } + + .tile.tile-3up-secondary .tile__media { + flex-shrink: 1 + } + + .tile.tile-3up-secondary .image { + background-size: contain + } + + .tile.tile-3up-secondary .tile__media, + .tile.tile-3up-secondary .tile__image-container { + width: 105px; + height: 105px; + min-height: auto; + flex-basis: auto; + flex-shrink: 1 + } + + .tile.tile-3up-secondary .tile__category { + margin-bottom: 4px + } + + .tile.tile-3up-secondary .tile__timestamp { + margin-top: 8px + } +} + +.tile.tile-hero { + flex-direction: row; + width: 100% +} + +.tile.tile-hero .tile__headline { + font-size: 32px; + line-height: 1.125; + font-weight: 700; + letter-spacing: .004em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + -webkit-line-clamp: 6; + -webkit-box-orient: vertical; + display: -webkit-box; + overflow: hidden +} + +.tile.tile-hero .tile__headline:lang(ar) { + line-height: 1.34375; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero .tile__headline:lang(ja) { + line-height: 1.21875; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero .tile__headline:lang(ko) { + line-height: 1.21875; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero .tile__headline:lang(th) { + line-height: 1.375; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 1068px) { + .tile.tile-hero .tile__headline { + font-size: 21px; + line-height: 1.19048; + font-weight: 700; + letter-spacing: .011em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero .tile__headline:lang(ja) { + line-height: 1.2381; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero .tile__headline:lang(ko) { + line-height: 1.2858; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero .tile__headline:lang(th) { + line-height: 1.381; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero .tile__headline:lang(ar) { + line-height: 1.4286; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-hero .tile__headline { + font-size: 19px; + line-height: 1.21053; + font-weight: 700; + letter-spacing: .012em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero .tile__headline:lang(ar) { + line-height: 1.36844; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero .tile__headline:lang(ja) { + line-height: 1.26316; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero .tile__headline:lang(ko) { + line-height: 1.31579; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero .tile__headline:lang(th) { + line-height: 1.36844; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +.tile.tile-hero .tile__description { + padding: 32px; + justify-content: space-between; + flex-basis: 0 +} + +.tile.tile-hero .tile__media { + flex-shrink: 1 +} + +.tile.tile-hero .image { + background-size: contain +} + +.tile.tile-hero .tile__media, +.tile.tile-hero .tile__image-container { + width: 100%; + height: auto; + min-height: 362px; + flex-basis: 643px; + flex-shrink: 1 +} + +.tile.tile-hero .tile__category { + margin-bottom: 8px +} + +.tile.tile-hero .tile__timestamp { + margin-top: 12px +} + +@media only screen and (max-width: 1068px) { + .tile.tile-hero { + flex-direction: row; + width: 100% + } + + .tile.tile-hero .tile__description { + padding: 24px; + justify-content: space-between; + flex-basis: 0 + } + + .tile.tile-hero .tile__media { + flex-shrink: 1 + } + + .tile.tile-hero .image { + background-size: contain + } + + .tile.tile-hero .tile__media, + .tile.tile-hero .tile__image-container { + width: 100%; + height: auto; + min-height: 255px; + flex-basis: 453px; + flex-shrink: 1 + } + + .tile.tile-hero .tile__category { + margin-bottom: 8px + } + + .tile.tile-hero .tile__timestamp { + margin-top: 12px + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-hero { + flex-direction: column; + width: 100% + } + + .tile.tile-hero .tile__description { + padding: 24px; + justify-content: space-between; + flex-basis: auto + } + + .tile.tile-hero .tile__media { + flex-shrink: 0 + } + + .tile.tile-hero .image { + background-size: cover + } + + .tile.tile-hero .tile__media, + .tile.tile-hero .tile__image-container { + width: 100%; + height: auto; + min-height: auto; + flex-basis: auto; + flex-shrink: 1; + padding-top: 56.25%; + height: 0; + position: relative + } + + .tile.tile-hero .tile__media .viewport-image, + .tile.tile-hero .tile__media .image, + .tile.tile-hero .tile__image-container .viewport-image, + .tile.tile-hero .tile__image-container .image { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100% + } + + .tile.tile-hero .tile__category { + margin-bottom: 8px + } + + .tile.tile-hero .tile__timestamp { + margin-top: 8px + } +} + +.tile.tile-hero .tile__headline:lang(ar) { + -webkit-line-clamp: 5; + -webkit-box-orient: vertical; + display: -webkit-box; + overflow: hidden +} + +@media only screen and (max-width: 734px) { + .tile.tile-hero .tile__headline:lang(ar) { + -webkit-line-clamp: 6; + -webkit-box-orient: vertical; + display: -webkit-box; + overflow: hidden + } +} + +.tile.tile-hero:lang(ar) .image { + background-size: cover +} + +.tile.tile-hero-reversed { + flex-direction: row-reverse; + width: 100% +} + +.tile.tile-hero-reversed .tile__headline { + font-size: 32px; + line-height: 1.125; + font-weight: 700; + letter-spacing: .004em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + -webkit-line-clamp: 6; + -webkit-box-orient: vertical; + display: -webkit-box; + overflow: hidden +} + +.tile.tile-hero-reversed .tile__headline:lang(ar) { + line-height: 1.34375; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-reversed .tile__headline:lang(ja) { + line-height: 1.21875; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-reversed .tile__headline:lang(ko) { + line-height: 1.21875; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-reversed .tile__headline:lang(th) { + line-height: 1.375; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-reversed .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-reversed .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-reversed .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-reversed .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 1068px) { + .tile.tile-hero-reversed .tile__headline { + font-size: 21px; + line-height: 1.19048; + font-weight: 700; + letter-spacing: .011em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-reversed .tile__headline:lang(ja) { + line-height: 1.2381; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-reversed .tile__headline:lang(ko) { + line-height: 1.2858; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-reversed .tile__headline:lang(th) { + line-height: 1.381; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-reversed .tile__headline:lang(ar) { + line-height: 1.4286; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-reversed .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-reversed .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-reversed .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-reversed .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-hero-reversed .tile__headline { + font-size: 19px; + line-height: 1.21053; + font-weight: 700; + letter-spacing: .012em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-reversed .tile__headline:lang(ar) { + line-height: 1.36844; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-reversed .tile__headline:lang(ja) { + line-height: 1.26316; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-reversed .tile__headline:lang(ko) { + line-height: 1.31579; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-reversed .tile__headline:lang(th) { + line-height: 1.36844; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-reversed .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-reversed .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-reversed .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-reversed .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +.tile.tile-hero-reversed .tile__description { + padding: 32px; + justify-content: space-between; + flex-basis: 0 +} + +.tile.tile-hero-reversed .tile__media { + flex-shrink: 1 +} + +.tile.tile-hero-reversed .image { + background-size: contain +} + +.tile.tile-hero-reversed .tile__media, +.tile.tile-hero-reversed .tile__image-container { + width: 100%; + height: auto; + min-height: 362px; + flex-basis: 643px; + flex-shrink: 1 +} + +.tile.tile-hero-reversed .tile__category { + margin-bottom: 8px +} + +.tile.tile-hero-reversed .tile__timestamp { + margin-top: 12px +} + +@media only screen and (max-width: 1068px) { + .tile.tile-hero-reversed { + flex-direction: row-reverse; + width: 100% + } + + .tile.tile-hero-reversed .tile__description { + padding: 24px; + justify-content: space-between; + flex-basis: 0 + } + + .tile.tile-hero-reversed .tile__media { + flex-shrink: 1 + } + + .tile.tile-hero-reversed .image { + background-size: contain + } + + .tile.tile-hero-reversed .tile__media, + .tile.tile-hero-reversed .tile__image-container { + width: 100%; + height: auto; + min-height: 255px; + flex-basis: 453px; + flex-shrink: 1 + } + + .tile.tile-hero-reversed .tile__category { + margin-bottom: 8px + } + + .tile.tile-hero-reversed .tile__timestamp { + margin-top: 12px + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-hero-reversed { + flex-direction: column; + width: 100% + } + + .tile.tile-hero-reversed .tile__description { + padding: 24px; + justify-content: space-between; + flex-basis: auto + } + + .tile.tile-hero-reversed .tile__media { + flex-shrink: 0 + } + + .tile.tile-hero-reversed .image { + background-size: cover + } + + .tile.tile-hero-reversed .tile__media, + .tile.tile-hero-reversed .tile__image-container { + width: 100%; + height: auto; + min-height: auto; + flex-basis: auto; + flex-shrink: 1; + padding-top: 56.25%; + height: 0; + position: relative + } + + .tile.tile-hero-reversed .tile__media .viewport-image, + .tile.tile-hero-reversed .tile__media .image, + .tile.tile-hero-reversed .tile__image-container .viewport-image, + .tile.tile-hero-reversed .tile__image-container .image { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100% + } + + .tile.tile-hero-reversed .tile__category { + margin-bottom: 8px + } + + .tile.tile-hero-reversed .tile__timestamp { + margin-top: 8px + } +} + +.tile.tile-hero-reversed:lang(ar) .image { + background-size: cover +} + +.tile.tile-hero-highlight .tile__headline, +.tile.tile-hero-highlight-secondary .tile__headline { + font-size: 40px; + line-height: 1.1; + font-weight: 700; + letter-spacing: 0em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + -webkit-line-clamp: 4; + -webkit-box-orient: vertical; + display: -webkit-box; + overflow: hidden +} + +.tile.tile-hero-highlight .tile__headline:lang(ar), +.tile.tile-hero-highlight-secondary .tile__headline:lang(ar) { + line-height: 1.3; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-highlight .tile__headline:lang(ja), +.tile.tile-hero-highlight-secondary .tile__headline:lang(ja) { + line-height: 1.175; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-highlight .tile__headline:lang(ko), +.tile.tile-hero-highlight-secondary .tile__headline:lang(ko) { + line-height: 1.2; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-highlight .tile__headline:lang(th), +.tile.tile-hero-highlight-secondary .tile__headline:lang(th) { + line-height: 1.35; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-highlight .tile__headline:lang(zh-CN), +.tile.tile-hero-highlight-secondary .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-highlight .tile__headline:lang(zh-HK), +.tile.tile-hero-highlight-secondary .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-highlight .tile__headline:lang(zh-MO), +.tile.tile-hero-highlight-secondary .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-highlight .tile__headline:lang(zh-TW), +.tile.tile-hero-highlight-secondary .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 1068px) { + + .tile.tile-hero-highlight .tile__headline, + .tile.tile-hero-highlight-secondary .tile__headline { + font-size: 28px; + line-height: 1.14286; + font-weight: 700; + letter-spacing: .007em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight .tile__headline:lang(ko), + .tile.tile-hero-highlight-secondary .tile__headline:lang(ko) { + line-height: 1.25; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight .tile__headline:lang(th), + .tile.tile-hero-highlight-secondary .tile__headline:lang(th) { + line-height: 1.39286; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight .tile__headline:lang(ar), + .tile.tile-hero-highlight-secondary .tile__headline:lang(ar) { + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight .tile__headline:lang(ja), + .tile.tile-hero-highlight-secondary .tile__headline:lang(ja) { + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight .tile__headline:lang(zh-CN), + .tile.tile-hero-highlight-secondary .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight .tile__headline:lang(zh-HK), + .tile.tile-hero-highlight-secondary .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight .tile__headline:lang(zh-MO), + .tile.tile-hero-highlight-secondary .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight .tile__headline:lang(zh-TW), + .tile.tile-hero-highlight-secondary .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +@media only screen and (max-width: 734px) { + + .tile.tile-hero-highlight .tile__headline, + .tile.tile-hero-highlight-secondary .tile__headline { + font-size: 24px; + line-height: 1.16667; + font-weight: 700; + letter-spacing: .009em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight .tile__headline:lang(ar), + .tile.tile-hero-highlight-secondary .tile__headline:lang(ar) { + line-height: 1.33341; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight .tile__headline:lang(ja), + .tile.tile-hero-highlight-secondary .tile__headline:lang(ja) { + line-height: 1.25; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight .tile__headline:lang(ko), + .tile.tile-hero-highlight-secondary .tile__headline:lang(ko) { + line-height: 1.29167; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight .tile__headline:lang(th), + .tile.tile-hero-highlight-secondary .tile__headline:lang(th) { + line-height: 1.375; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight .tile__headline:lang(zh-CN), + .tile.tile-hero-highlight-secondary .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight .tile__headline:lang(zh-HK), + .tile.tile-hero-highlight-secondary .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight .tile__headline:lang(zh-MO), + .tile.tile-hero-highlight-secondary .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight .tile__headline:lang(zh-TW), + .tile.tile-hero-highlight-secondary .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + + + +html.js .tile.tile-hero-highlight[data-progressive-load], +html.js .tile.tile-hero-highlight-secondary[data-progressive-load] { + opacity: 0 +} + +html.js .tile.tile-hero-highlight.large-load, +html.js .tile.tile-hero-highlight-secondary.large-load { + opacity: 0; + transition: none +} + +html.js .tile.tile-hero-highlight.large-loaded, +html.js .tile.tile-hero-highlight-secondary.large-loaded { + opacity: 1; + transition: opacity 1s cubic-bezier(0.4, 0, 0.25, 1) 0ms +} + +@media only screen and (max-width: 1068px) { + + html.js .tile.tile-hero-highlight.medium-load, + html.js .tile.tile-hero-highlight-secondary.medium-load { + opacity: 0; + transition: none + } + + html.js .tile.tile-hero-highlight.medium-loaded, + html.js .tile.tile-hero-highlight-secondary.medium-loaded { + opacity: 1; + transition: opacity 1s cubic-bezier(0.4, 0, 0.25, 1) 0ms + } +} + +@media only screen and (max-width: 734px) { + + html.js .tile.tile-hero-highlight.small-load, + html.js .tile.tile-hero-highlight-secondary.small-load { + opacity: 0; + transition: none + } + + html.js .tile.tile-hero-highlight.small-loaded, + html.js .tile.tile-hero-highlight-secondary.small-loaded { + opacity: 1; + transition: opacity 1s cubic-bezier(0.4, 0, 0.25, 1) 0ms + } +} + +.tile.tile-hero-highlight { + display: block; + position: relative +} + +.tile.tile-hero-highlight .tile__gradient { + position: absolute; + bottom: 0; + width: 100%; + z-index: 0 +} + +.tile.tile-hero-highlight .tile__gradient::before { + content: ''; + position: absolute; + bottom: 0; + left: 0; + width: 100%; + height: 250%; + z-index: 0; + background: linear-gradient(to top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.77311) 12.83%, rgba(0, 0, 0, 0.72685) 24%, rgba(0, 0, 0, 0.66487) 33.77%, rgba(0, 0, 0, 0.59081) 42.37%, rgba(0, 0, 0, 0.50831) 50.07%, rgba(0, 0, 0, 0.421) 57.13%, rgba(0, 0, 0, 0.33252) 63.78%, rgba(0, 0, 0, 0.24652) 70.3%, rgba(0, 0, 0, 0.16663) 76.92%, rgba(0, 0, 0, 0.09648) 83.91%, rgba(0, 0, 0, 0.03973) 91.52%, rgba(0, 0, 0, 0)); + background-size: 100.1% 100.1% +} + +.tile.tile-hero-highlight .tile__gradient.autoplay-controls-wrapper { + z-index: 3 +} + +.tile.tile-hero-highlight .tile__description { + width: 100%; + box-sizing: border-box; + position: relative; + z-index: 2 +} + +.tile.tile-hero-highlight .tile__description-has-controls { + display: flex; + flex-direction: row +} + +.tile.tile-hero-highlight .tile__description-has-controls .tile__description-content { + flex: 1 calc(100% - 44px); + box-sizing: border-box; + padding-right: 16px +} + +@media only screen and (max-width: 1068px) { + .tile.tile-hero-highlight .tile__description-has-controls .tile__description-content { + flex: 1 calc(100% - 36px) + } +} + +.tile.tile-hero-highlight .tile__description-has-controls .autoplay-controls-container { + flex: 1 44px +} + +@media only screen and (max-width: 1068px) { + .tile.tile-hero-highlight .tile__description-has-controls .autoplay-controls-container { + flex: 1 36px + } +} + +.tile.tile-hero-highlight .tile__description-content { + display: flex; + flex-direction: column +} + +.tile.tile-hero-highlight .tile__headline, +.tile.tile-hero-highlight .tile__category, +.tile.tile-hero-highlight .tile__timestamp { + color: #fff +} + +.tile.tile-hero-highlight .tile__category { + margin-bottom: 12px +} + +.tile.tile-hero-highlight .tile__timestamp { + margin-top: 12px +} + +.tile.tile-hero-highlight .tile__description { + padding: 0 36px 36px +} + +.tile.tile-hero-highlight .tile__media { + width: 980px; + height: 551px +} + +@media only screen and (max-width: 1068px) { + .tile.tile-hero-highlight .tile__category { + margin-bottom: 8px + } + + .tile.tile-hero-highlight .tile__timestamp { + margin-top: 8px + } + + .tile.tile-hero-highlight .tile__description { + padding: 0 24px 24px + } + + .tile.tile-hero-highlight .tile__media { + width: 692px; + height: 389px + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-hero-highlight .tile__category { + margin-bottom: 4px + } + + .tile.tile-hero-highlight .tile__timestamp { + margin-top: 8px + } + + .tile.tile-hero-highlight .tile__description { + padding: 0 24px 24px + } + + .tile.tile-hero-highlight .tile__media { + width: 100%; + padding-top: 125%; + height: 0; + position: relative + } + + .tile.tile-hero-highlight .tile__media .viewport-image, + .tile.tile-hero-highlight .tile__media .image { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100% + } +} + +@media only screen and (min-width: 1069px) { + .tile.tile-hero-highlight-secondary { + display: block; + position: relative + } + + .tile.tile-hero-highlight-secondary .tile__gradient { + position: absolute; + bottom: 0; + width: 100%; + z-index: 0 + } + + .tile.tile-hero-highlight-secondary .tile__gradient::before { + content: ''; + position: absolute; + bottom: 0; + left: 0; + width: 100%; + height: 250%; + z-index: 0; + background: linear-gradient(to top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.77311) 12.83%, rgba(0, 0, 0, 0.72685) 24%, rgba(0, 0, 0, 0.66487) 33.77%, rgba(0, 0, 0, 0.59081) 42.37%, rgba(0, 0, 0, 0.50831) 50.07%, rgba(0, 0, 0, 0.421) 57.13%, rgba(0, 0, 0, 0.33252) 63.78%, rgba(0, 0, 0, 0.24652) 70.3%, rgba(0, 0, 0, 0.16663) 76.92%, rgba(0, 0, 0, 0.09648) 83.91%, rgba(0, 0, 0, 0.03973) 91.52%, rgba(0, 0, 0, 0)); + background-size: 100.1% 100.1% + } + + .tile.tile-hero-highlight-secondary .tile__gradient.autoplay-controls-wrapper { + z-index: 3 + } + + .tile.tile-hero-highlight-secondary .tile__description { + width: 100%; + box-sizing: border-box; + position: relative; + z-index: 2 + } + + .tile.tile-hero-highlight-secondary .tile__description-has-controls { + display: flex; + flex-direction: row + } + + .tile.tile-hero-highlight-secondary .tile__description-has-controls .tile__description-content { + flex: 1 calc(100% - 44px); + box-sizing: border-box; + padding-right: 16px + } +} + +@media only screen and (min-width: 1069px) and (max-width: 1068px) { + .tile.tile-hero-highlight-secondary .tile__description-has-controls .tile__description-content { + flex: 1 calc(100% - 36px) + } +} + +@media only screen and (min-width: 1069px) { + .tile.tile-hero-highlight-secondary .tile__description-has-controls .autoplay-controls-container { + flex: 1 44px + } +} + +@media only screen and (min-width: 1069px) and (max-width: 1068px) { + .tile.tile-hero-highlight-secondary .tile__description-has-controls .autoplay-controls-container { + flex: 1 36px + } +} + +@media only screen and (min-width: 1069px) { + .tile.tile-hero-highlight-secondary .tile__description-content { + display: flex; + flex-direction: column + } + + .tile.tile-hero-highlight-secondary .tile__headline, + .tile.tile-hero-highlight-secondary .tile__category, + .tile.tile-hero-highlight-secondary .tile__timestamp { + color: #fff + } + + .tile.tile-hero-highlight-secondary .tile__category { + margin-bottom: 12px + } + + .tile.tile-hero-highlight-secondary .tile__timestamp { + margin-top: 12px + } + + .tile.tile-hero-highlight-secondary .tile__description { + padding: 0 36px 36px + } + + .tile.tile-hero-highlight-secondary .tile__media { + width: 980px; + height: 551px + } +} + +@media only screen and (min-width: 1069px) and (max-width: 1068px) { + .tile.tile-hero-highlight-secondary .tile__category { + margin-bottom: 8px + } + + .tile.tile-hero-highlight-secondary .tile__timestamp { + margin-top: 8px + } + + .tile.tile-hero-highlight-secondary .tile__description { + padding: 0 24px 24px + } + + .tile.tile-hero-highlight-secondary .tile__media { + width: 692px; + height: 389px + } +} + +@media only screen and (min-width: 1069px) and (max-width: 734px) { + .tile.tile-hero-highlight-secondary .tile__category { + margin-bottom: 4px + } + + .tile.tile-hero-highlight-secondary .tile__timestamp { + margin-top: 8px + } + + .tile.tile-hero-highlight-secondary .tile__description { + padding: 0 24px 24px + } + + .tile.tile-hero-highlight-secondary .tile__media { + width: 100%; + padding-top: 125%; + height: 0; + position: relative + } + + .tile.tile-hero-highlight-secondary .tile__media .viewport-image, + .tile.tile-hero-highlight-secondary .tile__media .image { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100% + } +} + +@media only screen and (max-width: 1068px) { + .tile.tile-hero-highlight-secondary { + flex-direction: column; + width: 333px + } + + .tile.tile-hero-highlight-secondary .tile__description { + padding: 24px; + justify-content: space-between; + flex-basis: auto + } + + .tile.tile-hero-highlight-secondary .tile__media { + flex-shrink: 0 + } + + .tile.tile-hero-highlight-secondary .image { + background-size: cover + } + + .tile.tile-hero-highlight-secondary .tile__media, + .tile.tile-hero-highlight-secondary .tile__image-container { + width: 100%; + height: 187px; + min-height: auto; + flex-basis: auto; + flex-shrink: 1 + } + + .tile.tile-hero-highlight-secondary .tile__category { + margin-bottom: 4px + } + + .tile.tile-hero-highlight-secondary .tile__timestamp { + margin-top: 8px + } + + .tile.tile-hero-highlight-secondary .tile__headline { + font-size: 24px; + line-height: 1.16667; + font-weight: 700; + letter-spacing: .009em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + -webkit-line-clamp: 5; + -webkit-box-orient: vertical; + display: -webkit-box; + overflow: hidden + } + + .tile.tile-hero-highlight-secondary .tile__headline:lang(ar) { + line-height: 1.33341; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-secondary .tile__headline:lang(ja) { + line-height: 1.25; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-secondary .tile__headline:lang(ko) { + line-height: 1.29167; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-secondary .tile__headline:lang(th) { + line-height: 1.375; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-secondary .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-secondary .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-secondary .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-secondary .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +@media only screen and (max-width: 1068px) and (max-width: 1068px) { + .tile.tile-hero-highlight-secondary .tile__headline { + font-size: 19px; + line-height: 1.21053; + font-weight: 700; + letter-spacing: .012em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-secondary .tile__headline:lang(ar) { + line-height: 1.36844; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-secondary .tile__headline:lang(ja) { + line-height: 1.26316; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-secondary .tile__headline:lang(ko) { + line-height: 1.31579; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-secondary .tile__headline:lang(th) { + line-height: 1.36844; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-secondary .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-secondary .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-secondary .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-secondary .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +@media only screen and (max-width: 1068px) { + .tile.tile-hero-highlight-secondary .autoplay-controls-container { + position: absolute; + top: calc(187px - (36px + 16px)) + } + + .tile.tile-hero-highlight-secondary .tile__gradient { + flex: 1 + } + + .tile.tile-hero-highlight-secondary .tile__description { + box-sizing: border-box; + height: 100% + } + + .tile.tile-hero-highlight-secondary .tile__description-content { + display: flex; + flex-direction: column; + height: 100%; + justify-content: space-between + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-hero-highlight-secondary { + display: block; + position: relative; + width: 100% + } + + .tile.tile-hero-highlight-secondary .tile__gradient { + position: absolute; + bottom: 0; + width: 100%; + z-index: 0 + } + + .tile.tile-hero-highlight-secondary .tile__gradient::before { + content: ''; + position: absolute; + bottom: 0; + left: 0; + width: 100%; + height: 250%; + z-index: 0; + background: linear-gradient(to top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.77311) 12.83%, rgba(0, 0, 0, 0.72685) 24%, rgba(0, 0, 0, 0.66487) 33.77%, rgba(0, 0, 0, 0.59081) 42.37%, rgba(0, 0, 0, 0.50831) 50.07%, rgba(0, 0, 0, 0.421) 57.13%, rgba(0, 0, 0, 0.33252) 63.78%, rgba(0, 0, 0, 0.24652) 70.3%, rgba(0, 0, 0, 0.16663) 76.92%, rgba(0, 0, 0, 0.09648) 83.91%, rgba(0, 0, 0, 0.03973) 91.52%, rgba(0, 0, 0, 0)); + background-size: 100.1% 100.1% + } + + .tile.tile-hero-highlight-secondary .tile__gradient.autoplay-controls-wrapper { + z-index: 3 + } + + .tile.tile-hero-highlight-secondary .tile__description { + width: 100%; + box-sizing: border-box; + position: relative; + z-index: 2 + } + + .tile.tile-hero-highlight-secondary .tile__description-has-controls { + display: flex; + flex-direction: row + } + + .tile.tile-hero-highlight-secondary .tile__description-has-controls .tile__description-content { + flex: 1 calc(100% - 44px); + box-sizing: border-box; + padding-right: 16px + } +} + +@media only screen and (max-width: 734px) and (max-width: 1068px) { + .tile.tile-hero-highlight-secondary .tile__description-has-controls .tile__description-content { + flex: 1 calc(100% - 36px) + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-hero-highlight-secondary .tile__description-has-controls .autoplay-controls-container { + flex: 1 44px + } +} + +@media only screen and (max-width: 734px) and (max-width: 1068px) { + .tile.tile-hero-highlight-secondary .tile__description-has-controls .autoplay-controls-container { + flex: 1 36px + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-hero-highlight-secondary .tile__description-content { + display: flex; + flex-direction: column + } + + .tile.tile-hero-highlight-secondary .tile__headline, + .tile.tile-hero-highlight-secondary .tile__category, + .tile.tile-hero-highlight-secondary .tile__timestamp { + color: #fff + } + + .tile.tile-hero-highlight-secondary .tile__category { + margin-bottom: 12px + } + + .tile.tile-hero-highlight-secondary .tile__timestamp { + margin-top: 12px + } + + .tile.tile-hero-highlight-secondary .tile__description { + padding: 0 36px 36px + } + + .tile.tile-hero-highlight-secondary .tile__media { + width: 980px; + height: 551px + } +} + +@media only screen and (max-width: 734px) and (max-width: 1068px) { + .tile.tile-hero-highlight-secondary .tile__category { + margin-bottom: 8px + } + + .tile.tile-hero-highlight-secondary .tile__timestamp { + margin-top: 8px + } + + .tile.tile-hero-highlight-secondary .tile__description { + padding: 0 24px 24px + } + + .tile.tile-hero-highlight-secondary .tile__media { + width: 692px; + height: 389px + } +} + +@media only screen and (max-width: 734px) and (max-width: 734px) { + .tile.tile-hero-highlight-secondary .tile__category { + margin-bottom: 4px + } + + .tile.tile-hero-highlight-secondary .tile__timestamp { + margin-top: 8px + } + + .tile.tile-hero-highlight-secondary .tile__description { + padding: 0 24px 24px + } + + .tile.tile-hero-highlight-secondary .tile__media { + width: 100%; + padding-top: 125%; + height: 0; + position: relative + } + + .tile.tile-hero-highlight-secondary .tile__media .viewport-image, + .tile.tile-hero-highlight-secondary .tile__media .image { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100% + } +} + +.tile.tile-hero-highlight-feature { + display: block; + position: relative; + display: flex +} + +.tile.tile-hero-highlight-feature .tile__headline { + font-size: 40px; + line-height: 1.1; + font-weight: 700; + letter-spacing: 0em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + -webkit-line-clamp: 4; + -webkit-box-orient: vertical; + display: -webkit-box; + overflow: hidden +} + +.tile.tile-hero-highlight-feature .tile__headline:lang(ar) { + line-height: 1.3; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-highlight-feature .tile__headline:lang(ja) { + line-height: 1.175; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-highlight-feature .tile__headline:lang(ko) { + line-height: 1.2; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-highlight-feature .tile__headline:lang(th) { + line-height: 1.35; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-highlight-feature .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-highlight-feature .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-highlight-feature .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-highlight-feature .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 1068px) { + .tile.tile-hero-highlight-feature .tile__headline { + font-size: 28px; + line-height: 1.14286; + font-weight: 700; + letter-spacing: .007em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-feature .tile__headline:lang(ko) { + line-height: 1.25; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-feature .tile__headline:lang(th) { + line-height: 1.39286; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-feature .tile__headline:lang(ar) { + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-feature .tile__headline:lang(ja) { + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-feature .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-feature .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-feature .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-feature .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-hero-highlight-feature .tile__headline { + font-size: 24px; + line-height: 1.16667; + font-weight: 700; + letter-spacing: .009em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-feature .tile__headline:lang(ar) { + line-height: 1.33341; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-feature .tile__headline:lang(ja) { + line-height: 1.25; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-feature .tile__headline:lang(ko) { + line-height: 1.29167; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-feature .tile__headline:lang(th) { + line-height: 1.375; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-feature .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-feature .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-feature .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-highlight-feature .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +.tile.tile-hero-highlight-feature .tile__gradient { + position: absolute; + bottom: 0; + width: 100%; + z-index: 0 +} + +.tile.tile-hero-highlight-feature .tile__gradient::before { + content: ''; + position: absolute; + bottom: 0; + left: 0; + width: 100%; + height: 250%; + z-index: 0; + background: linear-gradient(to top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.77311) 12.83%, rgba(0, 0, 0, 0.72685) 24%, rgba(0, 0, 0, 0.66487) 33.77%, rgba(0, 0, 0, 0.59081) 42.37%, rgba(0, 0, 0, 0.50831) 50.07%, rgba(0, 0, 0, 0.421) 57.13%, rgba(0, 0, 0, 0.33252) 63.78%, rgba(0, 0, 0, 0.24652) 70.3%, rgba(0, 0, 0, 0.16663) 76.92%, rgba(0, 0, 0, 0.09648) 83.91%, rgba(0, 0, 0, 0.03973) 91.52%, rgba(0, 0, 0, 0)); + background-size: 100.1% 100.1% +} + +.tile.tile-hero-highlight-feature .tile__gradient.autoplay-controls-wrapper { + z-index: 3 +} + +.tile.tile-hero-highlight-feature .tile__description { + width: 100%; + box-sizing: border-box; + position: relative; + z-index: 2 +} + +.tile.tile-hero-highlight-feature .tile__description-has-controls { + display: flex; + flex-direction: row +} + +.tile.tile-hero-highlight-feature .tile__description-has-controls .tile__description-content { + flex: 1 calc(100% - 44px); + box-sizing: border-box; + padding-right: 16px +} + +@media only screen and (max-width: 1068px) { + .tile.tile-hero-highlight-feature .tile__description-has-controls .tile__description-content { + flex: 1 calc(100% - 36px) + } +} + +.tile.tile-hero-highlight-feature .tile__description-has-controls .autoplay-controls-container { + flex: 1 44px +} + +@media only screen and (max-width: 1068px) { + .tile.tile-hero-highlight-feature .tile__description-has-controls .autoplay-controls-container { + flex: 1 36px + } +} + +.tile.tile-hero-highlight-feature .tile__description-content { + display: flex; + flex-direction: column +} + +.tile.tile-hero-highlight-feature .tile__headline, +.tile.tile-hero-highlight-feature .tile__category, +.tile.tile-hero-highlight-feature .tile__timestamp { + color: #fff +} + +.tile.tile-hero-highlight-feature .tile__category { + margin-bottom: 12px +} + +.tile.tile-hero-highlight-feature .tile__timestamp { + margin-top: 12px +} + +.tile.tile-hero-highlight-feature .tile__description { + padding: 0 36px 36px +} + +.tile.tile-hero-highlight-feature .tile__media { + width: 980px; + height: 551px +} + +@media only screen and (max-width: 1068px) { + .tile.tile-hero-highlight-feature .tile__category { + margin-bottom: 8px + } + + .tile.tile-hero-highlight-feature .tile__timestamp { + margin-top: 8px + } + + .tile.tile-hero-highlight-feature .tile__description { + padding: 0 24px 24px + } + + .tile.tile-hero-highlight-feature .tile__media { + width: 692px; + height: 389px + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-hero-highlight-feature .tile__category { + margin-bottom: 4px + } + + .tile.tile-hero-highlight-feature .tile__timestamp { + margin-top: 8px + } + + .tile.tile-hero-highlight-feature .tile__description { + padding: 0 24px 24px + } + + .tile.tile-hero-highlight-feature .tile__media { + width: 100%; + padding-top: 125%; + height: 0; + position: relative + } + + .tile.tile-hero-highlight-feature .tile__media .viewport-image, + .tile.tile-hero-highlight-feature .tile__media .image { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100% + } +} + +.tile.tile-hero-secondary { + flex-direction: row; + width: 100% +} + +.tile.tile-hero-secondary .tile__headline { + font-size: 32px; + line-height: 1.125; + font-weight: 700; + letter-spacing: .004em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + -webkit-line-clamp: 6; + -webkit-box-orient: vertical; + display: -webkit-box; + overflow: hidden +} + +.tile.tile-hero-secondary .tile__headline:lang(ar) { + line-height: 1.34375; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-secondary .tile__headline:lang(ja) { + line-height: 1.21875; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-secondary .tile__headline:lang(ko) { + line-height: 1.21875; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-secondary .tile__headline:lang(th) { + line-height: 1.375; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-secondary .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-secondary .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-secondary .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-hero-secondary .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 1068px) { + .tile.tile-hero-secondary .tile__headline { + font-size: 19px; + line-height: 1.21053; + font-weight: 700; + letter-spacing: .012em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-secondary .tile__headline:lang(ar) { + line-height: 1.36844; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-secondary .tile__headline:lang(ja) { + line-height: 1.26316; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-secondary .tile__headline:lang(ko) { + line-height: 1.31579; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-secondary .tile__headline:lang(th) { + line-height: 1.36844; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-secondary .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-secondary .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-secondary .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .tile.tile-hero-secondary .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +.tile.tile-hero-secondary .tile__description { + padding: 32px; + justify-content: space-between; + flex-basis: 0 +} + +.tile.tile-hero-secondary .tile__media { + flex-shrink: 1 +} + +.tile.tile-hero-secondary .image { + background-size: contain +} + +.tile.tile-hero-secondary .tile__media, +.tile.tile-hero-secondary .tile__image-container { + width: 100%; + height: auto; + min-height: 362px; + flex-basis: 643px; + flex-shrink: 1 +} + +.tile.tile-hero-secondary .tile__category { + margin-bottom: 8px +} + +.tile.tile-hero-secondary .tile__timestamp { + margin-top: 12px +} + +@media only screen and (max-width: 1068px) { + .tile.tile-hero-secondary { + flex-direction: column; + width: 333px + } + + .tile.tile-hero-secondary .tile__description { + padding: 24px; + justify-content: space-between; + flex-basis: auto + } + + .tile.tile-hero-secondary .tile__media { + flex-shrink: 0 + } + + .tile.tile-hero-secondary .image { + background-size: cover + } + + .tile.tile-hero-secondary .tile__media, + .tile.tile-hero-secondary .tile__image-container { + width: 100%; + height: 187px; + min-height: auto; + flex-basis: auto; + flex-shrink: 1 + } + + .tile.tile-hero-secondary .tile__category { + margin-bottom: 4px + } + + .tile.tile-hero-secondary .tile__timestamp { + margin-top: 8px + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-hero-secondary { + flex-direction: column; + width: 100% + } + + .tile.tile-hero-secondary .tile__description { + padding: 24px; + justify-content: space-between; + flex-basis: auto + } + + .tile.tile-hero-secondary .tile__media { + flex-shrink: 0 + } + + .tile.tile-hero-secondary .image { + background-size: cover + } + + .tile.tile-hero-secondary .tile__media, + .tile.tile-hero-secondary .tile__image-container { + width: 100%; + height: auto; + min-height: auto; + flex-basis: auto; + flex-shrink: 1; + padding-top: 56.25%; + height: 0; + position: relative + } + + .tile.tile-hero-secondary .tile__media .viewport-image, + .tile.tile-hero-secondary .tile__media .image, + .tile.tile-hero-secondary .tile__image-container .viewport-image, + .tile.tile-hero-secondary .tile__image-container .image { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100% + } + + .tile.tile-hero-secondary .tile__category { + margin-bottom: 8px + } + + .tile.tile-hero-secondary .tile__timestamp { + margin-top: 8px + } +} + +.tile.tile-hero-secondary:lang(ar) .image { + background-size: cover +} + + +@media (hover: hover) { + + html.no-touch.no-reduced-motion .tile.tile-list:hover .image, + html.no-touch.no-reduced-motion .tile.tile-list:hover .media--video { + transform: scale(1.05) + } +} + +@media only screen and (hover: hover) and (max-width: 734px) { + + html.no-touch .tile.tile-list:hover .image, + html.no-touch .tile.tile-list:hover .media--video { + transform: none + } +} + +html.no-touch.no-reduced-motion .tile.tile-list[data-focus-method=key] .image, +html.no-touch.no-reduced-motion .tile.tile-list[data-focus-method=key] .media--video { + transform: scale(1.05) +} + +@media only screen and (max-width: 734px) { + + html.no-touch .tile.tile-list[data-focus-method=key] .image, + html.no-touch .tile.tile-list[data-focus-method=key] .media--video { + transform: none + } +} + + +.cover { + height: 100%; + width: 100%; + object-fit: cover; +} + + +.view-archive-wrapper { + margin-top: 32px; + font-size: 17px; + line-height: 1.23536; + font-weight: 500; + letter-spacing: -.022em; + font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + text-align: center; +} + +@media only screen and (max-width: 1068px) { + .view-archive-wrapper { + margin-top: 28px + } +} + +@media only screen and (max-width: 734px) { + .view-archive-wrapper { + margin-top: 24px + } +} + +.cta-primary-light { + letter-spacing: 0em; + border-radius: 30px; + display: inline-block; + transition: background-color 300ms cubic-bezier(0.4, 0, 0.25, 1) 0ms, border-color 300ms cubic-bezier(0.4, 0, 0.25, 1) 0ms, color 300ms cubic-bezier(0.4, 0, 0.25, 1) 0ms; + font-size: 17px; + line-height: 1.23536; + font-weight: 600; + letter-spacing: -.022em; + font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + border: 2px solid; + padding: 10px 24px 9px; + border-color: #1d1d1f; + color: #161617; +} + +.cta-primary-light:visited { + text-decoration: none; +} + +.cta-primary-light:hover { + background: #1d1d1f; + border-color: #1d1d1f; + color: #f5f5f7; + text-decoration: none; +} + + +.tile.tile-list { + border-radius: revert; + overflow: revert; + z-index: revert; + position: revert; + background-color: transparent; + flex-direction: row; + width: 457px +} + +.tile.tile-list .tile__headline { + font-size: 17px; + line-height: 1.23536; + font-weight: 700; + letter-spacing: -.022em; + font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + -webkit-line-clamp: 6; + -webkit-box-orient: vertical; + display: -webkit-box; + overflow: hidden +} + +.tile.tile-list .tile__headline:lang(ar) { + letter-spacing: 0em; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-list .tile__headline:lang(ja) { + letter-spacing: 0em; + font-family: "SF Pro JP", "SF Pro Text", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-list .tile__headline:lang(ko) { + line-height: 1.35296; + letter-spacing: 0em; + font-family: "SF Pro KR", "SF Pro Text", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-list .tile__headline:lang(zh) { + letter-spacing: 0em +} + +.tile.tile-list .tile__headline:lang(th) { + line-height: 1.35296; + letter-spacing: 0em; + font-family: "SF Pro TH", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-list .tile__headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-list .tile__headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-list .tile__headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-list .tile__headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.tile.tile-list .tile__media { + border-radius: 16px; + overflow: hidden; + z-index: 0; + position: relative +} + +.tile.tile-list .tile__description { + padding: 0 0 0 24px; + justify-content: center; + flex-basis: 0 +} + +.tile.tile-list .tile__media { + flex-shrink: 1 +} + +.tile.tile-list .image { + background-size: contain +} + +.tile.tile-list .tile__media, +.tile.tile-list .tile__image-container { + width: 132px; + height: 132px; + min-height: auto; + flex-basis: auto; + flex-shrink: 1 +} + +.tile.tile-list .tile__category { + margin-bottom: 4px +} + +.tile.tile-list .tile__timestamp { + margin-top: 8px +} + +@media only screen and (max-width: 1068px) { + .tile.tile-list { + flex-direction: row; + width: 631px + } + + .tile.tile-list .tile__description { + padding: 0 0 0 24px; + justify-content: center; + flex-basis: 0 + } + + .tile.tile-list .tile__media { + flex-shrink: 1 + } + + .tile.tile-list .image { + background-size: contain + } + + .tile.tile-list .tile__media, + .tile.tile-list .tile__image-container { + width: 132px; + height: 132px; + min-height: auto; + flex-basis: auto; + flex-shrink: 1 + } + + .tile.tile-list .tile__category { + margin-bottom: 4px + } + + .tile.tile-list .tile__timestamp { + margin-top: 8px + } +} + +@media only screen and (max-width: 734px) { + .tile.tile-list { + flex-direction: row; + width: 100% + } + + .tile.tile-list .tile__description { + padding: 0 0 0 16px; + justify-content: center; + flex-basis: 0 + } + + .tile.tile-list .tile__media { + flex-shrink: 1 + } + + .tile.tile-list .image { + background-size: contain + } + + .tile.tile-list .tile__media, + .tile.tile-list .tile__image-container { + width: 105px; + height: 105px; + min-height: auto; + flex-basis: auto; + flex-shrink: 1 + } + + .tile.tile-list .tile__category { + margin-bottom: 4px + } + + .tile.tile-list .tile__timestamp { + margin-top: 8px + } + + .tile.tile-list .tile__media { + border-radius: 12px + } +} + +@media (hover: hover) { + + html.no-touch.no-reduced-motion .tile.tile-list:hover .image, + html.no-touch.no-reduced-motion .tile.tile-list:hover .media--video { + transform: scale(1.05) + } +} + +@media only screen and (hover: hover) and (max-width: 734px) { + + html.no-touch .tile.tile-list:hover .image, + html.no-touch .tile.tile-list:hover .media--video { + transform: none + } +} + +html.no-touch.no-reduced-motion .tile.tile-list[data-focus-method=key] .image, +html.no-touch.no-reduced-motion .tile.tile-list[data-focus-method=key] .media--video { + transform: scale(1.05) +} + +@media only screen and (max-width: 734px) { + + html.no-touch .tile.tile-list[data-focus-method=key] .image, + html.no-touch .tile.tile-list[data-focus-method=key] .media--video { + transform: none + } +} + + +.pagetitle.component { + margin-top: 0; + margin-bottom: 0 +} + +.pagetitle .hero-headline { + font-size: 48px; + line-height: 1.08349; + font-weight: 700; + letter-spacing: -.003em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagetitle .hero-headline:lang(ar) { + line-height: 1.25; + letter-spacing: 0em; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagetitle .hero-headline:lang(ja) { + line-height: 1.14599; + letter-spacing: 0em; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagetitle .hero-headline:lang(ko) { + line-height: 1.1875; + letter-spacing: 0em; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagetitle .hero-headline:lang(zh) { + letter-spacing: 0em +} + +.pagetitle .hero-headline:lang(th) { + line-height: 1.33349; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagetitle .hero-headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagetitle .hero-headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagetitle .hero-headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagetitle .hero-headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 1068px) { + .pagetitle .hero-headline { + font-size: 40px; + line-height: 1.1; + font-weight: 700; + letter-spacing: 0em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagetitle .hero-headline:lang(ar) { + line-height: 1.3; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagetitle .hero-headline:lang(ja) { + line-height: 1.175; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagetitle .hero-headline:lang(ko) { + line-height: 1.2; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagetitle .hero-headline:lang(th) { + line-height: 1.35; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagetitle .hero-headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagetitle .hero-headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagetitle .hero-headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagetitle .hero-headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +@media only screen and (max-width: 734px) { + .pagetitle .hero-headline { + font-size: 32px; + line-height: 1.125; + font-weight: 700; + letter-spacing: .004em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagetitle .hero-headline:lang(ar) { + line-height: 1.34375; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagetitle .hero-headline:lang(ja) { + line-height: 1.21875; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagetitle .hero-headline:lang(ko) { + line-height: 1.21875; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagetitle .hero-headline:lang(th) { + line-height: 1.375; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagetitle .hero-headline:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagetitle .hero-headline:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagetitle .hero-headline:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagetitle .hero-headline:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + + +.category.component { + margin-top: 0; + margin-bottom: 20px +} + + +.component { + margin-left: auto; + margin-right: auto; + width: 980px +} + +.component::before, +.component::after { + content: ' '; + display: table +} + +.component::after { + clear: both +} + +@media only screen and (min-width: 1441px) { + .component { + margin-left: auto; + margin-right: auto; + width: 980px + } +} + +@media only screen and (max-width: 1068px) { + .component { + margin-left: auto; + margin-right: auto; + width: 692px + } +} + +@media only screen and (max-width: 734px) { + .component { + margin-left: auto; + margin-right: auto; + width: 87.5% + } +} + +.component { + margin-top: 44px; + margin-bottom: 44px +} + +@media only screen and (max-width: 1068px) { + .component { + margin-top: 36px; + margin-bottom: 36px + } +} + +@media only screen and (max-width: 734px) { + .component { + margin-top: 32px; + margin-bottom: 32px + } +} + +@media only screen and (max-width: 734px) { + .component { + max-width: 414px; + width: 100%; + margin-left: auto; + margin-right: auto + } +} + + + +.pagebody { + font-size: 17px; + line-height: 1.4211; + font-weight: 400; + letter-spacing: .012em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody:lang(ar) { + line-height: 1.57895; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody:lang(ja) { + line-height: 1.47376; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody:lang(ko) { + line-height: 1.52632; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody:lang(th) { + line-height: 1.36844; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 1068px) { + .pagebody { + font-size: 17px; + line-height: 1.47059; + font-weight: 400; + letter-spacing: -.022em; + font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody:lang(ar) { + line-height: 1.58824; + letter-spacing: 0em; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody:lang(ja) { + letter-spacing: 0em; + font-family: "SF Pro JP", "SF Pro Text", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody:lang(ko) { + line-height: 1.58824; + letter-spacing: 0em; + font-family: "SF Pro KR", "SF Pro Text", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody:lang(zh) { + letter-spacing: 0em + } + + .pagebody:lang(th) { + line-height: 1.35296; + letter-spacing: 0em; + font-family: "SF Pro TH", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +.pagebody-media { + margin-top: 0; + margin-bottom: 15px; + width: 291px +} + +@media only screen and (max-width: 1068px) { + .pagebody-media { + width: 206px + } +} + +@media only screen and (max-width: 734px) { + .pagebody-media { + width: 100% + } +} + +.pagebody-media.left { + float: left; + margin-left: -12.5%; + margin-right: 36px +} + +@media only screen and (max-width: 1068px) { + .pagebody-media.left { + margin-left: -10%; + margin-right: 24px + } +} + +@media only screen and (max-width: 734px) { + .pagebody-media.left { + margin-right: 0 + } +} + +.pagebody-media.right { + float: right; + margin-right: -12.5%; + margin-left: 36px +} + +@media only screen and (max-width: 1068px) { + .pagebody-media.right { + margin-right: -10%; + margin-left: 24px + } +} + +@media only screen and (max-width: 734px) { + .pagebody-media.right { + margin-left: 0 + } +} + +.pagebody-media .image-sharesheet { + display: block +} + +.pagebody-media .image-description, +.pagebody-media .video-description { + margin-left: 0; + margin-right: 0; + margin-bottom: 0 +} + +@media only screen and (max-width: 734px) { + + .pagebody-media.left, + .pagebody-media.right { + float: none; + margin: 28px auto + } + + .pagebody-media:first-child { + margin-top: 0 + } +} + +.pagebody-copy { + margin-bottom: 1.4211em +} + +.pagebody-copy:lang(ar) { + margin-bottom: 1.57895em +} + +.pagebody-copy:lang(ja) { + margin-bottom: 1.47376em +} + +.pagebody-copy:lang(th) { + margin-bottom: 1.36844em +} + +.pagebody-copy:lang(ko) { + margin-bottom: 1.52632em +} + +.pagebody-copy:first-child { + margin-top: 0 +} + +.pagebody-copy:last-child { + margin-bottom: 0 +} + + + + + +.component-content { + margin-left: auto; + margin-right: auto; + width: 653px +} + +@media only screen and (max-width: 1068px) { + .component-content { + width: 576px + } +} + +@media only screen and (max-width: 734px) { + .component-content { + width: 87.5% + } +} + +.image-big .component-content { + width: 980px +} + +@media only screen and (max-width: 1068px) { + .image-big .component-content { + width: 692px + } +} + +@media only screen and (max-width: 734px) { + .image-big .component-content { + width: 100% + } +} + +.image-inline .component-content { + width: 653px +} + +@media only screen and (max-width: 1068px) { + .image-inline .component-content { + width: 576px + } +} + +@media only screen and (max-width: 734px) { + .image-inline .component-content { + width: 87.5% + } +} + +@media only screen and (max-width: 734px) { + + .gallery, + .image, + .video { + width: 100% + } + + .gallery:not(.body-copy-wide) .component-content, + .image:not(.image-fullbleed) .component-content { + width: 320px + } +} + + + +.image-sharesheet { + display: table; + border-radius: 10px; + overflow: hidden; + z-index: 0; + position: relative +} + +@media only screen and (max-width: 734px) { + .image-sharesheet { + display: block + } +} + +@media only screen and (max-width: 734px) { + .image.image-fullbleed .image-sharesheet { + border-radius: 0 + } +} + +@media only screen and (min-width: 416px) and (max-width: 734px) { + .image.image-fullbleed .image-sharesheet { + border-radius: 10px + } +} + +@media only screen and (max-width: 415px) { + .image .image-sharesheet { + border-radius: 0 + } +} + +.component.not-rounded .image-sharesheet { + border-radius: 0 !important +} + + + +.image-description { + position: relative; + display: flex; + align-items: flex-start; + justify-content: space-between; + color: #6e6e73; + margin: 16px 16px 0; + font-size: 12px; + line-height: 1.33337; + font-weight: 600; + letter-spacing: -.01em; + font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.theme-dark .image-description { + color: #86868b +} + +.image-description:lang(ar) { + line-height: 1.66667; + letter-spacing: 0em; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.image-description:lang(ja) { + line-height: 1.41667; + letter-spacing: 0em; + font-family: "SF Pro JP", "SF Pro Text", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.image-description:lang(ko) { + line-height: 1.41667; + letter-spacing: 0em; + font-family: "SF Pro KR", "SF Pro Text", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.image-description:lang(zh) { + letter-spacing: 0em +} + +.image-description:lang(th) { + line-height: 1.33337; + letter-spacing: 0em; + font-family: "SF Pro TH", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.image-description:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.image-description:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.image-description:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.image-description:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 1068px) { + .image-description { + margin-top: 12px + } +} + +.image-description:empty { + margin-bottom: 0 +} + +.image-description .icon { + font-size: 19px; + line-height: 1.4211; + font-weight: 400; + letter-spacing: .012em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.image-description .icon:lang(ar) { + line-height: 1.57895; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.image-description .icon:lang(ja) { + line-height: 1.47376; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.image-description .icon:lang(ko) { + line-height: 1.52632; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.image-description .icon:lang(th) { + line-height: 1.36844; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.image-description .icon:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.image-description .icon:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.image-description .icon:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.image-description .icon:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 1068px) { + .image-description .icon { + font-size: 17px; + line-height: 1.47059; + font-weight: 400; + letter-spacing: -.022em; + font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .image-description .icon:lang(ar) { + line-height: 1.58824; + letter-spacing: 0em; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .image-description .icon:lang(ja) { + letter-spacing: 0em; + font-family: "SF Pro JP", "SF Pro Text", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .image-description .icon:lang(ko) { + line-height: 1.58824; + letter-spacing: 0em; + font-family: "SF Pro KR", "SF Pro Text", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .image-description .icon:lang(zh) { + letter-spacing: 0em + } + + .image-description .icon:lang(th) { + line-height: 1.35296; + letter-spacing: 0em; + font-family: "SF Pro TH", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .image-description .icon:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .image-description .icon:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .image-description .icon:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .image-description .icon:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +.image-description .icon::before, +.image-description .icon::after { + line-height: inherit +} + +.body-copy-wide .image-description { + margin-left: 0; + margin-right: 0 +} + +.image-description .image-caption { + flex-grow: 1 +} + +.body-copy-wide .image-description { + margin-right: 0; + margin-left: 0 +} + +.image-keyline .image-asset, +.image-keyline .picture-image { + box-sizing: border-box; + border: 1px solid #d2d2d7 +} + +.image.image-big { + min-width: 320px +} + +.image.image-fullbleed .image-sharesheet, +.image.image-inline.body-copy-wide .image-sharesheet, +.image.image-grid.body-copy-wide .image-sharesheet { + display: block +} + +.image.body-copy-wide.image-fullbleed .image-description { + width: 653px; + margin-left: auto; + margin-right: auto +} + +@media only screen and (max-width: 1068px) { + .image.body-copy-wide.image-fullbleed .image-description { + width: 576px + } +} + +@media only screen and (max-width: 734px) { + .image.body-copy-wide.image-fullbleed .image-description { + width: 87.5% + } +} + +@media only screen and (max-width: 734px) { + .image.body-copy-wide.image-inline .component-content { + width: 100% + } +} + +.no-touch .image:hover { + position: relative; + z-index: 1 +} + +@media only screen and (max-width: 734px) { + .image-inline .image-description { + margin-left: auto; + margin-right: auto; + width: 87.5% + } +} + +.image.image-wide { + width: 100% +} + +.image.image-wide .component-content { + width: 100%; + max-width: 2560px +} + +.image.image-wide .image-asset { + width: 100%; + height: 100% +} + +.image.image-wide .image-sharesheet, +.image.image-wide .pullquote-cover { + width: 100%; + border-radius: 0 +} + +@media only screen and (min-width: 1441px) { + + .image.image-wide .image-sharesheet, + .image.image-wide .pullquote-cover { + max-width: 1920px; + margin: 0 auto + } +} + +@media only screen and (min-width: 1922px) { + + .image.image-wide .image-sharesheet, + .image.image-wide .pullquote-cover { + border-radius: 10px; + overflow: hidden; + z-index: 0; + position: relative + } +} + +@media only screen and (min-width: 1441px) { + .image.image-wide .picture-image { + position: relative; + top: 50%; + left: 50%; + transform: translate(-50%, -50%) scale(1.01) + } +} + +.image-grid { + position: relative; + z-index: 1 +} + +.image-grid::before, +.image-grid::after { + content: ' '; + display: table +} + +.image-grid::after { + clear: both +} + +.image-grid-item { + box-sizing: border-box; + flex: 0 0 283px; + margin-bottom: 44px +} + +@media only screen and (max-width: 1068px) { + .image-grid-item { + margin-bottom: 36px + } +} + +@media only screen and (max-width: 734px) { + .image-grid-item { + flex: 0 0 100%; + margin-bottom: 32px + } +} + +.image-grid-item:nth-child(odd) { + margin-right: 5px +} + +@media only screen and (max-width: 734px) { + .image-grid-item:nth-child(odd) { + margin-right: 0 + } +} + +@media only screen and (max-width: 734px) { + .image-grid .row:last-of-type .image-grid-item:not(:last-of-type) { + margin-bottom: 32px + } +} + +.image-grid .row:last-of-type .image-grid-item { + margin-bottom: 0 +} + +.image-grid .row { + width: 100%; + position: relative; + display: flex; + flex-direction: row +} + +@media only screen and (max-width: 734px) { + .image-grid .row { + display: block + } +} + +.touch .image-grid.body-copy-wide .component-content { + width: component-content-width +} + +@media only screen and (max-width: 734px) { + .touch .image-grid.body-copy-wide .component-content { + width: 87.5% + } +} + +@media only screen and (max-width: 734px) { + .no-touch .image-grid.body-copy-wide .component-content { + width: component-content-width + } +} + +@media only screen and (max-width: 734px) and (max-width: 734px) { + .no-touch .image-grid.body-copy-wide .component-content { + width: 87.5% + } +} + +.datelocation { + position: relative; + z-index: 1 +} + +.datelocation::before, +.datelocation::after { + content: ' '; + display: table +} + +.datelocation::after { + clear: both +} + +.datelocation-copy { + font-size: 19px; + line-height: 1.4211; + font-weight: 400; + letter-spacing: .012em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + margin: 0 +} + +.datelocation-copy:lang(ar) { + line-height: 1.57895; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.datelocation-copy:lang(ja) { + line-height: 1.47376; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.datelocation-copy:lang(ko) { + line-height: 1.52632; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.datelocation-copy:lang(th) { + line-height: 1.36844; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.datelocation-copy:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.datelocation-copy:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.datelocation-copy:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.datelocation-copy:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 1068px) { + .datelocation-copy { + font-size: 17px; + line-height: 1.47059; + font-weight: 400; + letter-spacing: -.022em; + font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .datelocation-copy:lang(ar) { + line-height: 1.58824; + letter-spacing: 0em; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .datelocation-copy:lang(ja) { + letter-spacing: 0em; + font-family: "SF Pro JP", "SF Pro Text", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .datelocation-copy:lang(ko) { + line-height: 1.58824; + letter-spacing: 0em; + font-family: "SF Pro KR", "SF Pro Text", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .datelocation-copy:lang(zh) { + letter-spacing: 0em + } + + .datelocation-copy:lang(th) { + line-height: 1.35296; + letter-spacing: 0em; + font-family: "SF Pro TH", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .datelocation-copy:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .datelocation-copy:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .datelocation-copy:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .datelocation-copy:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + + +.modal-gallery-trigger { + border: 0; + background: transparent; + cursor: pointer; + position: relative; + display: block; + width: 100% +} + +.modal-gallery-trigger::after { + content: ''; + opacity: 0; + position: absolute; + pointer-events: none; + top: 0; + left: 0; + right: 0; + bottom: 0; + border: 4px solid rgba(0, 125, 250, 0.6) +} + +.modal-gallery-trigger[data-focus-method=key]::after { + opacity: 1 +} + + +.picture-image { + display: inline-block; + width: 100%; + height: auto +} + +.picture { + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0 +} + +.picture.no-dl { + pointer-events: none +} + +.icon.icon-arrowdown::before, +.icon.icon-arrowdown::after { + font-family: "social-media-font" !important; + content: "" +} + + + + +.theme-dark { + background-color: #000; + color: #f5f5f7; + --footer-background: #121214; + --footer-border-color: #424245; + --footer-text-color: #86868b; + --footer-link-color: #d2d2d7; + --footer-pipe-color: #6e6e73; + --footer-directory-title-color: #f5f5f7; + --footer-directory-title-color-hover: #fff; +} + +.theme-dark h1, +.theme-dark h2, +.theme-dark h3, +.theme-dark h4, +.theme-dark h5, +.theme-dark h6 { + color: #f5f5f7 +} + +.theme-dark a, +.theme-dark .link { + color: #f5f5f7; +} + +.theme-dark .footnote a { + color: inherit +} + +.theme-dark .footnote a:hover { + color: #2997ff +} + +.theme-dark a.block { + color: inherit +} + +.theme-dark a.block .block-link { + color: #2997ff +} + +.theme-dark .dotnav .dotnav-item { + background-color: rgba(134, 134, 139, 0.4) +} + +.theme-dark .dotnav .dotnav-item:hover { + background-color: rgba(134, 134, 139, 0.6) +} + +.theme-dark .dotnav .dotnav-item.current { + background-color: #86868b +} + +.theme-dark .paddlenav .paddlenav-arrow { + background-color: rgba(0, 0, 0, 0); + color: rgba(134, 134, 139, 0.8) +} + +.theme-dark .paddlenav .paddlenav-arrow:hover { + background-color: rgba(0, 0, 0, 0); + color: #86868b +} + +.theme-dark .paddlenav .paddlenav-arrow:active { + background-color: rgba(0, 0, 0, 0); + color: #86868b +} + +.theme-dark .paddlenav .paddlenav-arrow:focus[data-focus-method="mouse"]:not(input):not(textarea):not(select):hover, +.theme-dark .paddlenav .paddlenav-arrow:focus[data-focus-method="touch"]:not(input):not(textarea):not(select):hover { + background-color: rgba(0, 0, 0, 0); + color: #86868b +} + +.theme-dark .paddlenav .paddlenav-arrow:focus[data-focus-method="mouse"]:not(input):not(textarea):not(select):active, +.theme-dark .paddlenav .paddlenav-arrow:focus[data-focus-method="touch"]:not(input):not(textarea):not(select):active { + background-color: rgba(0, 0, 0, 0); + color: #86868b +} + +.theme-dark .paddlenav-framed .paddlenav-arrow { + background-color: rgba(210, 210, 215, 0.2); + color: rgba(134, 134, 139, 0.8) +} + +.theme-dark .paddlenav-framed .paddlenav-arrow:hover { + background-color: rgba(210, 210, 215, 0.28); + color: #86868b +} + +.theme-dark .paddlenav-framed .paddlenav-arrow:active { + background-color: rgba(210, 210, 215, 0.36); + color: #86868b +} + +.theme-dark .paddlenav-framed .paddlenav-arrow:focus[data-focus-method="mouse"]:not(input):not(textarea):not(select):hover, +.theme-dark .paddlenav-framed .paddlenav-arrow:focus[data-focus-method="touch"]:not(input):not(textarea):not(select):hover { + background-color: rgba(210, 210, 215, 0.28); + color: #86868b +} + +.theme-dark .paddlenav-framed .paddlenav-arrow:focus[data-focus-method="mouse"]:not(input):not(textarea):not(select):active, +.theme-dark .paddlenav-framed .paddlenav-arrow:focus[data-focus-method="touch"]:not(input):not(textarea):not(select):active { + background-color: rgba(210, 210, 215, 0.36); + color: #86868b +} + +.theme-dark .quote .quote-copy { + color: #f5f5f7 +} + +.theme-dark .quote .quote-credit, +.theme-dark .quote .quote-subcredit { + color: #f5f5f7 +} + +.theme-dark .sosumi { + color: #6e6e73 +} + +.theme-dark .sosumi a { + color: #a1a1a6 +} + +.theme-dark .violator { + background: rgba(0, 0, 0, 0); + border-color: #f56300; + color: #f56300 +} + +.theme-dark .violator-frameless { + background: rgba(0, 0, 0, 0); + border-color: #f56300; + color: #f56300 +} + +.theme-dark .violator-secondary { + background: rgba(0, 0, 0, 0); + border-color: #86868b; + color: #86868b +} + + +.tertiarynav { + margin: 36px auto 50px +} + +.tertiarynav .component-content { + border-top: 1px solid #d2d2d7 +} + +.theme-dark .tertiarynav .component-content { + border-top-color: #424245 +} + +.theme-dark header { + background-color: rgba(29, 29, 31, 0.7); +} + +.pagebody-header { + font-size: 24px; + line-height: 1.16667; + font-weight: 700; + letter-spacing: .009em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + margin-bottom: 16px; + margin-top: 52px +} + +.pagebody-header:lang(ar) { + line-height: 1.33341; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody-header:lang(ja) { + line-height: 1.25; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody-header:lang(ko) { + line-height: 1.29167; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody-header:lang(th) { + line-height: 1.375; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody-header:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody-header:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody-header:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody-header:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 1068px) { + .pagebody-header { + font-size: 21px; + line-height: 1.19048; + font-weight: 700; + letter-spacing: .011em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header:lang(ja) { + line-height: 1.2381; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header:lang(ko) { + line-height: 1.2858; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header:lang(th) { + line-height: 1.381; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header:lang(ar) { + line-height: 1.4286; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +@media only screen and (max-width: 1068px) { + .pagebody-header { + margin-top: 48px + } +} + +@media only screen and (max-width: 734px) { + .pagebody-header { + margin-top: 44px + } +} + +.pagebody-header--secondary { + font-size: 40px; + line-height: 1.1; + font-weight: 700; + letter-spacing: 0em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + margin-top: 52px; + margin-bottom: 24px +} + +.pagebody-header--secondary:lang(ar) { + line-height: 1.3; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody-header--secondary:lang(ja) { + line-height: 1.175; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody-header--secondary:lang(ko) { + line-height: 1.2; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody-header--secondary:lang(th) { + line-height: 1.35; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody-header--secondary:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody-header--secondary:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody-header--secondary:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.pagebody-header--secondary:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 1068px) { + .pagebody-header--secondary { + font-size: 32px; + line-height: 1.125; + font-weight: 700; + letter-spacing: .004em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header--secondary:lang(ar) { + line-height: 1.34375; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header--secondary:lang(ja) { + line-height: 1.21875; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header--secondary:lang(ko) { + line-height: 1.21875; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header--secondary:lang(th) { + line-height: 1.375; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header--secondary:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header--secondary:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header--secondary:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header--secondary:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +@media only screen and (max-width: 734px) { + .pagebody-header--secondary { + font-size: 28px; + line-height: 1.14286; + font-weight: 700; + letter-spacing: .007em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header--secondary:lang(ko) { + line-height: 1.25; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header--secondary:lang(th) { + line-height: 1.39286; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header--secondary:lang(ar) { + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header--secondary:lang(ja) { + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header--secondary:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header--secondary:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header--secondary:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .pagebody-header--secondary:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +@media only screen and (max-width: 1068px) { + .pagebody-header--secondary { + margin-top: 48px; + margin-bottom: 20px + } +} + +@media only screen and (max-width: 734px) { + .pagebody-header--secondary { + margin-top: 44px + } +} + +.pagebody-header:first-child { + margin-top: 8px +} + +@media only screen and (max-width: 1068px) { + .pagebody-header:first-child { + margin-top: 12px + } +} + +@media only screen and (max-width: 734px) { + .pagebody-header:first-child { + margin-top: 12px + } +} + +.pagebody-header:last-child { + margin-bottom: 0 +} + + +.category-eyebrow { + font-size: 12px; + line-height: 1.33337; + font-weight: 700; + letter-spacing: -.01em; + font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.category-eyebrow:lang(ar) { + line-height: 1.66667; + letter-spacing: 0em; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.category-eyebrow:lang(ja) { + line-height: 1.41667; + letter-spacing: 0em; + font-family: "SF Pro JP", "SF Pro Text", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.category-eyebrow:lang(ko) { + line-height: 1.41667; + letter-spacing: 0em; + font-family: "SF Pro KR", "SF Pro Text", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.category-eyebrow:lang(zh) { + letter-spacing: 0em +} + +.category-eyebrow:lang(th) { + line-height: 1.33337; + letter-spacing: 0em; + font-family: "SF Pro TH", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.category-eyebrow:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.category-eyebrow:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.category-eyebrow:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.category-eyebrow:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.category-eyebrow__category, +.category-eyebrow__date { + display: block +} + +@media only screen and (max-width: 1068px) { + + .category-eyebrow__category, + .category-eyebrow__date { + margin-right: -7px + } +} + +@media only screen and (max-width: 734px) { + + .category-eyebrow__category, + .category-eyebrow__date { + margin-right: 0 + } +} + +.category-eyebrow__category::after, +.category-eyebrow__category::before, +.category-eyebrow__date::after, +.category-eyebrow__date::before { + alt: '' +} + +.category-eyebrow__category { + text-transform: uppercase; + color: #6e6e73; + border-color: #6e6e73 +} + +.theme-dark .category-eyebrow__category { + color: #86868b; + border-color: #86868b +} + +@media only screen and (max-width: 1068px) { + .landingtile-featured .category-eyebrow__category { + font-size: 12px; + line-height: 1.33337; + font-weight: 400; + letter-spacing: -.01em; + font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + border-radius: 12px; + padding-left: 11px; + padding-right: 11px; + padding-top: 3px; + padding-bottom: 3px + } + + .landingtile-featured .category-eyebrow__category:lang(ar) { + letter-spacing: 0em; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .landingtile-featured .category-eyebrow__category:lang(ja) { + letter-spacing: 0em; + font-family: "SF Pro JP", "SF Pro Text", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .landingtile-featured .category-eyebrow__category:lang(ko) { + letter-spacing: 0em; + font-family: "SF Pro KR", "SF Pro Text", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .landingtile-featured .category-eyebrow__category:lang(zh) { + letter-spacing: 0em + } + + .landingtile-featured .category-eyebrow__category:lang(th) { + font-family: "SF Pro TH", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .landingtile-featured .category-eyebrow__category:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .landingtile-featured .category-eyebrow__category:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .landingtile-featured .category-eyebrow__category:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .landingtile-featured .category-eyebrow__category:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +.category-eyebrow__date { + font-size: 14px; + line-height: 1.28577; + font-weight: 600; + letter-spacing: -.016em; + font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.category-eyebrow__date:lang(ar) { + letter-spacing: 0em; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.category-eyebrow__date:lang(ja) { + line-height: 1.35718; + letter-spacing: 0em; + font-family: "SF Pro JP", "SF Pro Text", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.category-eyebrow__date:lang(ko) { + line-height: 1.42859; + letter-spacing: 0em; + font-family: "SF Pro KR", "SF Pro Text", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.category-eyebrow__date:lang(zh) { + letter-spacing: 0em +} + +.category-eyebrow__date:lang(th) { + line-height: 1.35718; + letter-spacing: 0em; + font-family: "SF Pro TH", "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.category-eyebrow__date:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.category-eyebrow__date:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.category-eyebrow__date:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.category-eyebrow__date:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Text", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.page-article .category-eyebrow__date { + margin-top: 4px +} + +.category.component { + margin-top: 0; + margin-bottom: 20px +} + + +.article-subhead { + font-size: 24px; + line-height: 1.16667; + font-weight: 500; + letter-spacing: .009em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif; + margin-top: 20px; + margin-bottom: 0 +} + +.article-subhead:lang(ar) { + line-height: 1.33341; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.article-subhead:lang(ja) { + line-height: 1.25; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.article-subhead:lang(ko) { + line-height: 1.29167; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.article-subhead:lang(th) { + line-height: 1.375; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.article-subhead:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.article-subhead:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.article-subhead:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +.article-subhead:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif +} + +@media only screen and (max-width: 1068px) { + .article-subhead { + font-size: 21px; + line-height: 1.19048; + font-weight: 500; + letter-spacing: .011em; + font-family: "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .article-subhead:lang(ja) { + line-height: 1.2381; + font-family: "SF Pro JP", "SF Pro Display", "SF Pro Icons", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .article-subhead:lang(ko) { + line-height: 1.2858; + font-family: "SF Pro KR", "SF Pro Display", "SF Pro Icons", "Apple Gothic", "HY Gulim", "MalgunGothic", "HY Dotum", "Lexi Gulim", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .article-subhead:lang(th) { + line-height: 1.381; + font-family: "SF Pro TH", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .article-subhead:lang(ar) { + line-height: 1.4286; + font-family: "SF Pro AR", "SF Pro Gulf", "SF Pro Display", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .article-subhead:lang(zh-CN) { + font-family: "SF Pro SC", "SF Pro Display", "SF Pro Icons", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .article-subhead:lang(zh-HK) { + font-family: "SF Pro HK", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .article-subhead:lang(zh-MO) { + font-family: "SF Pro HK", "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang HK", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } + + .article-subhead:lang(zh-TW) { + font-family: "SF Pro TC", "SF Pro Display", "SF Pro Icons", "PingFang TC", "Helvetica Neue", "Helvetica", "Arial", sans-serif + } +} + +@media only screen and (max-width: 1068px) { + .article-subhead { + margin-top: 16px + } +} + +.article-subhead+.sharesheet { + margin-top: 24px +} + +@media only screen and (max-width: 1068px) { + .article-subhead+.sharesheet { + margin-top: 20px + } +} + +.article-subhead+.tagssheet { + margin-top: 24px; + margin-bottom: 3px; +} + +@media only screen and (max-width: 1068px) { + .article-subhead+.tagssheet { + margin-top: 20px; + margin-bottom: 3px; + } +} + +.article-header, +.featured-header { + padding: 16px 0px 0px 0px; +} + + +.footer-main { + margin: 0 auto; + width: 100%; + border-top: 1px solid rgb(224 226 217 / 1); +} + +.footer-wraper { + padding: 20px; + margin: 0 auto; +} + +.footer-box { + margin: 0 auto; + display: flex; + flex-direction: column; + align-items: center; +} + +.footer-main .foot-nav { + color: var(--gray-text); + width: 100%; +} + +.footer-main .item .logo { + font-size: 16px; + font-weight: 600; + color: var(--black); +} + +.footer-main .foot-nav-items { + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: flex-start; +} + +@media screen and (min-width: 320px) { + .footer-main .foot-nav-items { + flex-direction: column; + } +} + +@media screen and (min-width: 768px) { + .footer-main .foot-nav-items { + flex-direction: row; + } +} + +@media screen and (min-width: 955px) { + .footer-main .foot-nav-items { + flex-direction: row; + } +} + + +.footer-main { + margin: 0 auto; + width: 100%; + background-color: var(--footer-background); + border: none; +} + +.theme-dark .footer-main { + background-color: var(--footer-background); +} + +.footer-wraper { + padding: 20px; + margin: 0 auto; +} + +.footer-box { + margin: 0 auto; + display: flex; + flex-direction: column; + align-items: center; +} + +.footer-main .foot-nav { + color: var(--footer-text-color); + width: 100%; +} + +.footer-main .item .logo { + font-size: 16px; + font-weight: 600; + color: var(--footer-directory-title-color); +} + +.footer-main .foot-nav-items { + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: flex-start; +} + +@media screen and (min-width: 320px) { + .footer-main .foot-nav-items { + flex-direction: column; + } +} + +@media screen and (min-width: 768px) { + .footer-main .foot-nav-items { + flex-direction: row; + } +} + +@media screen and (min-width: 955px) { + .footer-main .foot-nav-items { + flex-direction: row; + } +} + + + +.foot-nav-items .item { + display: flex; + flex-direction: column; +} + +.footer-main .item div, +.footer-main .item a { + padding: 8px 5px; + font-size: 14px; + color: var(--footer-pipe-color); +} + +.footer-main .item a:hover { + color: var(--footer-directory-title-color-hover); +} + +.footer-main .foot-nav-items .item-title { + color: var(--footer-directory-title-color); + font-size: 14px; + font-weight: 600; +} + +.footer-main .copyright { + color: var(--footer-pipe-color); + padding-top: 20px; + margin-top: 20px; + font-size: 14px; +} + + +.page-article table { + overflow: auto; + display: block; + border-spacing: 0; + border-collapse: collapse; + margin-top: 1rem; + margin-bottom: 1rem +} + +.page-article table tr th, +.page-article table tr td { + padding: .5rem 1rem; + border: 1px solid #e9ecef; +} + +.page-article table tr:nth-child(2n) { + background: #f8f9fa; +} + +.code pre { + overflow-x: auto; + border-radius: 8px; +} + + +.theme-dark table th, +.theme-dark table td { + color: #eee !important; +} + +.theme-dark table th { + background: #000000 !important; +} + +.theme-dark table tr:nth-child(2n) { + background: #000000; +} + +.tag { + cursor: pointer; + display: inline-block; + text-align: center; + white-space: nowrap; + font-size: 12px; + line-height: 1.33337; + font-weight: 400; + letter-spacing: -.01em; + min-width: 23px; + padding-left: 11px; + padding-right: 11px; + padding-top: 4px; + padding-bottom: 4px; + border-radius: 12px; + background: #0071e3; + color: #fff; + margin-right: 12px; +} + +.tag:hover { + text-decoration: none; + background: #0077ED; +} + +.article-copyright { + background-color: #f5f5f7; + border-radius: 10px; + display: flex; + flex-direction: column; + margin: 0; + padding: 10px 0px; + font-size: 14px; +} + +.theme-dark .article-copyright { + background-color: #1d1d1f; +} + +.article-copyright .content { + margin: 0 32px; + padding-bottom: 8px; + padding-top: 8px; +} + +@media only screen and (max-width: 734px) { + .article-copyright .contentm { + margin: 0 16px; + } +} + + +@media only screen and (max-width: 1068px) { + .article-copyright .content { + margin: 0 16px; + } +} + +section.archive { + min-height: 78vh; + background-color: #f2f2f2; + margin-top: 0; +} + +.section-tag { + padding: 24px 0px; +} + +.tag-header { + font-size: 24px; + line-height: 1.16667; + font-weight: 700; + letter-spacing: .009em; + ; +} + +.archive-tag { + background: white; + padding: 1em 1em; + border-radius: 8px; + margin: 10px 0px; +} + +a.tag_post-content { + color: #1d1d1f; + letter-spacing: 0.011em; + font-size: 17px; +} + + +.tag-post-list li { + padding: 0.3em 0; + margin: 0px 1em; +} + +span.tag-date { + margin-right: 5px; +} + +@media only screen and (max-width: 1068px) { + .tag-header { + font-size: 21px; + } + + a.tag_post-content { + font-size: 14px; + } +} + +@media only screen and (max-width: 734px) { + .tag-header { + font-size: 18px; + } + + .tag-post-list li { + margin: 0px 0em; + } +} + +ul>li, ol>li { + margin: 1em 0px; +} + +code { + margin: 0px 0.25em; +} + +blockquote { + background: #fafafa; + border-left: 0.3em solid #ccc; + padding: 0.5em 0.5em; + border-radius: 4px; + margin-bottom: 1.4211em; + color: #6e6e73; + font-size: 16px; +} + +.theme-dark blockquote { + background: #1d1d1f; + border-left: 0.3em solid #ccc; + color: #6e6e73; +} + +.theme-dark blockquote { + background: #1d1d1f; + border-left: 0.39em solid #8c7f7f; + color: #9999a5; +} + +blockquote p { + display: inline; +} diff --git a/themes/itheme/static/css/search.css b/themes/itheme/static/css/search.css new file mode 100644 index 0000000..40d4811 --- /dev/null +++ b/themes/itheme/static/css/search.css @@ -0,0 +1,21 @@ +#modal-wrapper{ + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: rgba(25,25,25,0.3); + z-index: 999; + backdrop-filter: blur(5px); +} + +.modal-body{ + width: 50%; + transform: translateX(50%); + margin-top: 10vh; +} + +.aa-Panel{ + position: fixed !important; + z-index: 999; +}
\ No newline at end of file |