@ptcwebops/ptcw-design 3.4.6 → 3.4.8

package/dist/cjs/most-popular-news_9.cjs.entry.js

@@ -0,0 +1,569 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-cd9a1b1a.js');
+const utils = require('./utils-03d92070.js');
+const interfaces = require('./interfaces-574e6df7.js');
+
+const mostPopularNewsCss = "h1,h2,h3,h4,h5,h6,p,ul,li,span{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,span{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}.most-popular-wrapper{border:1px solid #eee;display:flex;flex-flow:column nowrap;background-color:var(--color-gray-02)}::slotted([slot=seo-content]){display:none}.most-popular-title{border-radius:4px 4px 0px 0px;background-color:var(--color-gray-12);padding:var(--ptc-element-spacing-05) 0px}.most-popular-cards{display:flex;flex-flow:column nowrap;padding:12px}.most-popular-card ptc-card-wrapper{border-radius:4px;background:#FFF;box-shadow:0px 1px 4px 0px rgba(0, 0, 0, 0.24)}@media screen and (min-width: 768px){.most-popular-title{display:none}.most-popular-cards{display:flex;flex-flow:row nowrap}}@media screen and (min-width: 992px){.most-popular-title{display:block}.most-popular-cards{display:flex;flex-flow:column nowrap}}";
+
+const MostPopularNews = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.topTitle = undefined;
+  }
+  componentDidRender() {
+    utils.equalizeHeightsWithinShadow('.js-card-bottom', this.el);
+  }
+  render() {
+    return (index.h(index.Host, null, index.h("div", { class: "most-popular-wrapper" }, index.h("slot", { name: "seo-content" }), index.h("ptc-title", { type: "h2", "text-align": "center", "title-size": "large", "title-color": "white", upperline: "no-upperline", "title-display": "block", "title-height": "densest", "title-margin": "margin-flush", "title-weight": "w-7", class: "most-popular-title" }, this.topTitle), index.h("div", { class: "most-popular-cards" }, index.h("div", { class: "most-popular-card" }, index.h("ptc-card-wrapper", { "card-type": "most-popular", "card-link": "https://www.ptc.com/", "is-loading": "false", "link-target": "_blank", "link-title": "Link title on hover", class: "most-pupular-card" }, index.h("ptc-badge", { number: 1 }), index.h("ptc-card-content", null, index.h("ptc-picture", { alt: "image-test", "is-full-height": true, "is-full-width": true, src: "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data" })), index.h("ptc-card-bottom", { "card-type": "most-popular", class: "js-card-bottom" }, index.h("ptc-para", { "para-line-h": "--ptc-line-height-denser", "font-size": "x-small", "font-weight": "w-7", "para-color": "primary-grey", "para-margin": "margin-top-3", "seo-compatibility-mode": true }, index.h("p", null, "PTC Q2 FY\u201923 Earnings Presentation"))))), index.h("div", { class: "most-popular-card" }, index.h("ptc-card-wrapper", { "card-type": "most-popular", "card-link": "https://www.ptc.com/", "is-loading": "false", "link-target": "_blank", "link-title": "Link title on hover", class: "most-pupular-card" }, index.h("ptc-badge", { number: 2 }), index.h("ptc-card-content", null, index.h("ptc-picture", { alt: "image-test", "is-full-height": true, "is-full-width": true, src: "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data" })), index.h("ptc-card-bottom", { "card-type": "most-popular", class: "js-card-bottom" }, index.h("ptc-para", { "para-line-h": "--ptc-line-height-denser", "font-size": "x-small", "font-weight": "w-7", "para-color": "primary-grey", "para-margin": "margin-top-3", "seo-compatibility-mode": true }, index.h("p", null, "PTC Announces Availability of Creo 9"))))), index.h("div", { class: "most-popular-card" }, index.h("ptc-card-wrapper", { "card-type": "most-popular", "card-link": "https://www.ptc.com/", "is-loading": "false", "link-target": "_blank", "link-title": "Link title on hover", class: "most-pupular-card" }, index.h("ptc-badge", { number: 3 }), index.h("ptc-card-content", null, index.h("ptc-picture", { alt: "image-test", "is-full-height": true, "is-full-width": true, src: "https://s7d1.scene7.com/is/image/ptcinc//dpm-male-worker-laptop-factory-data" })), index.h("ptc-card-bottom", { "card-type": "most-popular", class: "js-card-bottom" }, index.h("ptc-para", { "para-line-h": "--ptc-line-height-denser", "font-size": "x-small", "font-weight": "w-7", "para-color": "primary-grey", "para-margin": "margin-top-3", "seo-compatibility-mode": true }, index.h("p", null, "PTC Completes Acquisition of Intland Software")))))))));
+  }
+  get el() { return index.getElement(this); }
+};
+MostPopularNews.style = mostPopularNewsCss;
+
+const ptcBadgeCss = "h1,h2,h3,h4,h5,h6,p,ul,li,span{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,span{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}.badge{background-color:var(--color-green-08);color:white;border-radius:50%;padding:0.5em;min-width:1.18em;text-align:center;position:absolute;top:0;left:0;transform:translate(-50%, -50%);z-index:2;font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-x-small)}";
+
+const PtcBadge = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.number = undefined;
+  }
+  render() {
+    return (index.h(index.Host, null, index.h("div", { class: "badge" }, this.number)));
+  }
+};
+PtcBadge.style = ptcBadgeCss;
+
+const ptcCardBottomCss = "h1,h2,h3,h4,h5,h6,p,ul,li,span{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,span{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}:host{display:block}:host ::slotted([slot=seo-content]){display:none}:host(.card-tall) .ptc-card-bottom-wrapper,:host(.card-wide) .ptc-card-bottom-wrapper{position:absolute;bottom:0;left:0;padding:0 var(--ptc-element-spacing-07) var(--ptc-element-spacing-07) var(--ptc-element-spacing-06);z-index:2}:host(.card-2up) .ptc-card-bottom-wrapper{position:absolute;bottom:0;left:0;padding:0px 24px 24px 16px}:host(.card-playlist){flex:72% 2 1;align-self:center}:host(.mouse-hover-card-bottom) .ptc-card-bottom-wrapper{z-index:5;cursor:pointer}:host(.extra-tall){position:absolute;top:0;left:0}:host(.extra-tall) .ptc-card-bottom-wrapper{position:relative;top:0px;left:0px;bottom:0px;right:0px;display:flex;flex-direction:column;align-items:center;width:calc(100% - 64px);padding:var(--ptc-layout-spacing-05) var(--ptc-element-spacing-07);padding-bottom:calc(var(--ptc-layout-spacing-03) + var(--ptc-layout-spacing-05));z-index:2}@media only screen and (min-width: 768px){:host(.extra-tall) .ptc-card-bottom-wrapper{padding-bottom:var(--ptc-layout-spacing-05)}}@media only screen and (min-width: 992px){:host(.extra-tall) .ptc-card-bottom-wrapper{padding-top:var(--ptc-layout-spacing-05)}}@media only screen and (min-width: 1200px){:host(.extra-tall) .ptc-card-bottom-wrapper{padding-top:calc(var(--ptc-layout-spacing-04) + var(--ptc-layout-spacing-05))}}@media only screen and (min-width: 1440px){:host(.extra-tall) .ptc-card-bottom-wrapper{padding-top:calc(var(--ptc-layout-spacing-05) * 2)}}:host(.color-outlined) .ptc-card-bottom-wrapper{position:absolute;top:50%;transform:translateY(-50%);display:flex;justify-content:center;flex-direction:column;align-items:center;width:calc(100% - 80px);height:100%;padding:0px var(--ptc-element-spacing-08)}:host(.most-popular){padding:0 16px 14px 16px}@media only screen and (min-width: 768px){:host(.card-2up) .ptc-card-bottom-wrapper{padding:0 32px 32px 24px}}@media only screen and (min-width: 1200px){:host(.card-video-intro){flex:20% 2 1;justify-content:flex-end}:host(.card-video-intro) .ptc-card-bottom-wrapper{display:flex;justify-content:flex-end}}@media only screen and (min-width: 1440px){:host(.card-2up) .ptc-card-bottom-wrapper{width:70%}}@media only screen and (min-width: 1980px){:host(.card-2up) .ptc-card-bottom-wrapper{width:60%}}";
+
+const PtcCardBottom = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.hoverEvent = index.createEvent(this, "hoverEvent", 7);
+    this.leaveEvent = index.createEvent(this, "leaveEvent", 7);
+    this.cardType = undefined;
+    this.styles = undefined;
+  }
+  hoverEventHandler() {
+    this.hoverEvent.emit();
+    //if statement: the card type that doesn't need a hover event
+    if (!this.el.classList.contains('card-video') && !this.el.classList.contains('card-playlist') && !this.el.classList.contains('extra-tall')) {
+      this.el.previousElementSibling.classList.add('mouse-hover');
+      this.el.classList.add('mouse-hover-card-bottom');
+    }
+  }
+  leaveEventHandler() {
+    this.hoverEvent.emit();
+    //if statement: the card type that doesn't need a hover event
+    if (!this.el.classList.contains('card-video') && !this.el.classList.contains('card-playlist') && !this.el.classList.contains('extra-tall')) {
+      this.el.previousElementSibling.classList.remove('mouse-hover');
+      this.el.classList.remove('mouse-hover-card-bottom');
+    }
+  }
+  render() {
+    const classMap = this.getCssClassMap();
+    return (index.h(index.Host, { part: "card-bottom", class: classMap, onMouseEnter: this.hoverEventHandler.bind(this), onMouseLeave: this.leaveEventHandler.bind(this) }, this.styles && index.h("style", null, this.styles), index.h("slot", { name: "slot-content" }), index.h("div", { class: "ptc-card-bottom-wrapper" }, index.h("slot", null))));
+  }
+  getCssClassMap() {
+    return {
+      [this.cardType]: this.cardType ? true : false,
+    };
+  }
+  get el() { return index.getElement(this); }
+};
+PtcCardBottom.style = ptcCardBottomCss;
+
+const ptcCardContentCss = "h1,h2,h3,h4,h5,h6,p,ul,li,span{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,span{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}:host{display:block;height:100%}:host ::slotted([slot=seo-content]){display:none}:host(.speed-bump){border:1px solid var(--color-gray-08);border-radius:var(--ptc-border-radius-large);padding:var(--ptc-element-spacing-06) 28px var(--ptc-element-spacing-06) 28px;text-align:center}:host(.speed-bump-2){border:1px solid var(--color-gray-08);border-radius:var(--ptc-border-radius-large);padding:var(--ptc-element-spacing-07) var(--ptc-element-spacing-05);text-align:center}@media only screen and (min-width: 768px){:host(.speed-bump){text-align:left}}@media only screen and (min-width: 768px){:host(.speed-bump-2){text-align:left}}:host(.card-tall) .ptc-card-content-wrapper,:host(.card-video) .ptc-card-content-wrapper,:host(.card-wide) .ptc-card-content-wrapper,:host(.card-playlist) .ptc-card-content-wrapper{border-radius:var(--ptc-border-radius-large);position:relative}:host(.card-tall) .ptc-card-content-wrapper::before,:host(.card-video) .ptc-card-content-wrapper::before,:host(.card-wide) .ptc-card-content-wrapper::before,:host(.card-playlist) .ptc-card-content-wrapper::before{content:\"\";position:absolute;width:100%;height:100%;border-radius:var(--ptc-border-radius-large);top:0;left:0;background:transparent;z-index:1;box-shadow:var(--ptc-shadow-x-small);transition:background var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.card-tall) .ptc-card-content-wrapper::after,:host(.card-video) .ptc-card-content-wrapper::after,:host(.card-wide) .ptc-card-content-wrapper::after,:host(.card-playlist) .ptc-card-content-wrapper::after{content:url(\"data:image/svg+xml,%3Csvg width='54' height='56' viewBox='0 0 54 56' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg filter='url(%23filter0_d_126_10476)'%3E%3Cpath d='M42 20L12 36V4L42 20Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='filter0_d_126_10476' x='0' y='0' width='54' height='56' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='hardAlpha'/%3E%3CfeOffset dy='8'/%3E%3CfeGaussianBlur stdDeviation='6'/%3E%3CfeComposite in2='hardAlpha' operator='out'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 0'/%3E%3CfeBlend mode='normal' in2='BackgroundImageFix' result='effect1_dropShadow_126_10476'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='effect1_dropShadow_126_10476' result='shape'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E%0A\");position:absolute;opacity:0;top:52.5%;left:50%;transform:translate(-50%, -50%);z-index:2;transition:opacity var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.extra-tall) .ptc-card-content-wrapper{border-radius:var(--ptc-border-radius-large);position:relative;box-shadow:0px 4px 4px rgba(0, 0, 0, 0.12)}:host(.card-2up) .ptc-card-content-wrapper{border-radius:var(--ptc-border-radius-large);position:relative}:host(.card-2up) .ptc-card-content-wrapper::before{content:\"\";position:absolute;width:100%;height:100%;border-radius:var(--ptc-border-radius-large);top:0;left:0;background:transparent;z-index:1;box-shadow:var(--ptc-shadow-x-small);transition:background var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.card-2up) .ptc-card-content-wrapper::after{content:\"\";position:absolute;opacity:0;top:52.5%;left:50%;transform:translate(-50%, -50%);z-index:2;transition:opacity var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.card-playlist) .ptc-card-content-wrapper{width:112px;height:112px}:host(.card-playlist) .ptc-card-content-wrapper::before{width:112px;height:112px}:host(.card-playlist) .ptc-card-content-wrapper::after{content:url(\"data:image/svg+xml,%3Csvg width='46' height='48' viewBox='0 0 46 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg filter='url(%23filter0_d_126_10337)'%3E%3Cpath d='M34 16L12 28V4L34 16Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='filter0_d_126_10337' x='0' y='0' width='46' height='48' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='hardAlpha'/%3E%3CfeOffset dy='8'/%3E%3CfeGaussianBlur stdDeviation='6'/%3E%3CfeComposite in2='hardAlpha' operator='out'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 0'/%3E%3CfeBlend mode='normal' in2='BackgroundImageFix' result='effect1_dropShadow_126_10337'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='effect1_dropShadow_126_10337' result='shape'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E%0A\");width:40px;height:30px;top:50%}:host(.thumbnail-video-preview) .ptc-card-content-wrapper{cursor:pointer;position:relative}:host(.thumbnail-video-preview) .ptc-card-content-wrapper::before{content:\"\";position:absolute;width:100%;height:100%;top:0;left:0;background:transparent;z-index:1;box-shadow:var(--ptc-shadow-x-small);transition:background var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.thumbnail-video-preview) .ptc-card-content-wrapper::after{content:url(\"data:image/svg+xml,%3Csvg width='54' height='56' viewBox='0 0 54 56' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg filter='url(%23filter0_d_126_10476)'%3E%3Cpath d='M42 20L12 36V4L42 20Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='filter0_d_126_10476' x='0' y='0' width='54' height='56' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='hardAlpha'/%3E%3CfeOffset dy='8'/%3E%3CfeGaussianBlur stdDeviation='6'/%3E%3CfeComposite in2='hardAlpha' operator='out'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 0'/%3E%3CfeBlend mode='normal' in2='BackgroundImageFix' result='effect1_dropShadow_126_10476'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='effect1_dropShadow_126_10476' result='shape'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E%0A\");position:absolute;opacity:1;top:60%;left:50%;transform:translate(-50%, -50%);z-index:2;transition:opacity var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.card-video) .ptc-card-content-wrapper::after{top:59.5%}:host(.mouse-hover) .ptc-card-content-wrapper::before{background:rgba(0, 0, 0, 0.6)}:host(.mouse-hover) .ptc-card-content-wrapper::after{opacity:1}:host(.card-tall) .ptc-card-content-wrapper::before,:host(.card-wide) .ptc-card-content-wrapper::before,:host(.card-2up) .ptc-card-content-wrapper::before{height:100%}:host(.card-playlist){flex:1 2 0%;margin-right:var(--ptc-element-spacing-04)}@media only screen and (min-width: 768px){:host(.card-playlist){margin-right:var(--ptc-element-spacing-03)}}@media only screen and (min-width: 992px){:host(.card-playlist) .ptc-card-content-wrapper{width:88px;height:88px}:host(.card-playlist) .ptc-card-content-wrapper::before{width:88px;height:88px}}@media only screen and (min-width: 768px){:host(.card-playlist) .ptc-card-content-wrapper{width:112px;height:112px}:host(.card-playlist) .ptc-card-content-wrapper::before{width:112px;height:112px}}@media screen and (min-width: 1981px){:host(.card-playlist){margin-right:var(--ptc-element-spacing-04)}}@media only screen and (min-width: 1200px){:host(.card-video-intro){flex:80% 8 1}}:host(.card-video) .ptc-card-content-wrapper{padding-bottom:56.25%}:host(.card-video) .ptc-card-content-wrapper ::slotted(*){position:absolute;width:100%;height:100%;top:0;left:0}:host(.card-tall) .ptc-card-content-wrapper{height:322px}:host(.card-tall) .ptc-card-content-wrapper ::slotted(*){height:322px}:host(.card-wide) .ptc-card-content-wrapper{height:268px}:host(.card-wide) .ptc-card-content-wrapper ::slotted(*){height:268px}:host(.card-2up) .ptc-card-content-wrapper{height:322px}:host(.card-2up) .ptc-card-content-wrapper ::slotted(*){height:322px}:host(.extra-tall) .ptc-card-content-wrapper{height:auto}:host(.extra-tall) .ptc-card-content-wrapper ::slotted(*){height:auto}:host(.color-outlined){border-radius:var(--ptc-border-radius-large);box-shadow:0px 4px 4px rgba(0, 0, 0, 0.12)}:host(.color-outlined) .ptc-card-content-wrapper{height:235px}:host(.color-outlined) .ptc-card-content-wrapper ::slotted(*){height:235px}@media only screen and (min-width: 480px){:host(.extra-tall) .ptc-card-content-wrapper{height:435px}:host(.extra-tall) .ptc-card-content-wrapper ::slotted(*){height:435px}}@media only screen and (min-width: 768px){:host(.card-tall) .ptc-card-content-wrapper{height:325px}:host(.card-tall) .ptc-card-content-wrapper ::slotted(*){height:325px}:host(.card-wide) .ptc-card-content-wrapper{height:268px}:host(.card-wide) .ptc-card-content-wrapper ::slotted(*){height:268px}:host(.card-2up) .ptc-card-content-wrapper{height:268px}:host(.card-2up) .ptc-card-content-wrapper ::slotted(*){height:268px}:host(.extra-tall) .ptc-card-content-wrapper{height:507px}:host(.extra-tall) .ptc-card-content-wrapper ::slotted(*){height:507px}}@media only screen and (min-width: 992px){:host(.card-tall) .ptc-card-content-wrapper{height:380px}:host(.card-tall) .ptc-card-content-wrapper ::slotted(*){height:380px}}@media only screen and (min-width: 1200px){:host(.extra-tall) .ptc-card-content-wrapper{height:663px}:host(.extra-tall) .ptc-card-content-wrapper ::slotted(*){height:663px}}@media only screen and (min-width: 1980px){:host(.card-tall) .ptc-card-content-wrapper{height:546px}:host(.card-tall) .ptc-card-content-wrapper ::slotted(*){height:546px}:host(.card-wide) .ptc-card-content-wrapper{height:376px}:host(.card-wide) .ptc-card-content-wrapper ::slotted(*){height:376px}:host(.card-2up) .ptc-card-content-wrapper{height:376px}:host(.card-2up) .ptc-card-content-wrapper ::slotted(*){height:376px}}:host(.o-red){border:2px solid var(--color-red-07)}:host(.o-green){border:2px solid var(--color-green-07)}:host(.o-slate-grey){border:2px solid var(--color-gray-07)}:host(.o-orange){border:2px solid var(--color-orange-07)}:host(.o-blue){border:2px solid var(--color-blue-07)}";
+
+const PtcCardContent = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.hoverEvent = index.createEvent(this, "hoverEvent", 7);
+    this.leaveEvent = index.createEvent(this, "leaveEvent", 7);
+    this.cardType = undefined;
+    this.outlineColor = undefined;
+    this.styles = undefined;
+    this.isLoading = false;
+  }
+  hoverEventHandler() {
+    if (!this.el.classList.contains('speed-bump') &&
+      !this.el.classList.contains('card-video-intro') &&
+      !this.el.classList.contains('card-dynamic') &&
+      !this.el.classList.contains('extra-tall')) {
+      this.hoverEvent.emit();
+      this.el.classList.add('mouse-hover');
+      if (!this.el.classList.contains('card-video') && !this.el.classList.contains('card-playlist') && this.el.nextElementSibling) {
+        this.el.nextElementSibling.classList.add('mouse-hover-card-bottom');
+      }
+    }
+  }
+  leaveEventHandler() {
+    if (!this.el.classList.contains('speed-bump') &&
+      !this.el.classList.contains('card-video-intro') &&
+      !this.el.classList.contains('card-dynamic') &&
+      !this.el.classList.contains('extra-tall')) {
+      this.hoverEvent.emit();
+      this.el.classList.remove('mouse-hover');
+      if (!this.el.classList.contains('card-video') && !this.el.classList.contains('card-playlist') && this.el.nextElementSibling) {
+        this.el.nextElementSibling.classList.remove('mouse-hover-card-bottom');
+      }
+    }
+  }
+  async setHeight(height) {
+    this.el.style.height = height + 'px';
+    const image = this.el.querySelector('ptc-picture');
+    image.style.height = height + 'px';
+  }
+  async removeInlineHeight() {
+    this.el.style.removeProperty('height');
+    const image = this.el.querySelector('ptc-picture');
+    if (image)
+      image.style.removeProperty('height');
+  }
+  render() {
+    const classMap = this.getCssClassMap();
+    return (index.h(index.Host, Object.assign({ part: "card-content", class: classMap }, (!this.isLoading ? { onMouseEnter: this.hoverEventHandler.bind(this) } : {}), (!this.isLoading ? { onMouseLeave: this.leaveEventHandler.bind(this) } : {})), this.styles && index.h("style", null, this.styles), index.h("slot", { name: "slot-content" }), index.h("div", { class: "ptc-card-content-wrapper" }, index.h("slot", null))));
+  }
+  getCssClassMap() {
+    return {
+      [this.cardType]: !!this.cardType ? true : false,
+      [this.outlineColor]: !!this.outlineColor ? true : false,
+    };
+  }
+  get el() { return index.getElement(this); }
+};
+PtcCardContent.style = ptcCardContentCss;
+
+const ptcCardWrapperCss = "h1,h2,h3,h4,h5,h6,p,ul,li,span{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,span{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}:host{display:block}:host(.card-tall),:host(.card-wide),:host(.card-video),:host(.card-playlist),:host(.card-2up){position:relative}:host(.card-tall) a,:host(.card-wide) a,:host(.card-video) a,:host(.card-playlist) a,:host(.card-2up) a{text-decoration:none !important}:host(.card-tall) a:hover,:host(.card-wide) a:hover,:host(.card-video) a:hover,:host(.card-playlist) a:hover,:host(.card-2up) a:hover{text-decoration:none}:host(.card-tall) a:focus,:host(.card-wide) a:focus,:host(.card-video) a:focus,:host(.card-playlist) a:focus,:host(.card-2up) a:focus{outline:none;text-decoration:none}:host(.card-tall) a:focus-visible,:host(.card-wide) a:focus-visible,:host(.card-video) a:focus-visible,:host(.card-playlist) a:focus-visible,:host(.card-2up) a:focus-visible{outline:none;text-decoration:none}:host(.card-playlist) div,:host(.card-playlist) a{display:flex;text-decoration:none;outline:none}:host(.card-playlist) div:hover,:host(.card-playlist) a:hover{text-decoration:none;outline:none}:host(.card-video-intro){border-bottom-left-radius:var(--ptc-border-radius-large);border-bottom-right-radius:var(--ptc-border-radius-large)}:host(.card-video-intro) div{display:block}:host(.card-video-shadow){box-shadow:var(--ptc-shadow-x-small)}:host(.extra-tall){position:relative}:host(.extra-tall) a{position:relative;display:block;width:100%;height:100%;inset:0px}:host(.extra-tall) a::after{content:\"\";position:absolute;width:100%;height:100%;background:rgba(0, 0, 0, 0);bottom:0;left:0;border-radius:var(--ptc-border-radius-large);transition:background var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.color-outlined){position:relative;border-radius:var(--ptc-border-radius-large)}:host(.card-video-p){padding:var(--ptc-element-spacing-05);padding-bottom:var(--ptc-element-spacing-06)}:host(.card-m-right){margin-right:var(--ptc-element-spacing-02)}:host(.card-m-left){margin-left:var(--ptc-element-spacing-02)}:host(.extraT-overlay) a::after{background:rgba(0, 0, 0, 0.6)}@media only screen and (min-width: 768px){:host(.card-m-right){margin-right:var(--ptc-element-spacing-03)}:host(.card-m-left){margin-left:var(--ptc-element-spacing-03)}}@media only screen and (min-width: 992px){:host(.card-m-right){margin-right:var(--ptc-element-spacing-04)}:host(.card-m-left){margin-left:var(--ptc-element-spacing-04)}}@media only screen and (min-width: 1200px){:host(.card-video-intro) div{display:flex}}:host(.result-box){width:505px;border:1px solid #6A6A6A;padding-top:56px;padding-bottom:56px;border-radius:var(--ptc-border-radius-large)}:host(.result-box) div{display:flex;justify-content:center;align-items:center;flex-direction:column}:host(.simple-card){border-radius:var(--ptc-border-radius-standard);background-color:var(--color-white);box-shadow:var(--ptc-shadow-small);padding:var(--ptc-layout-spacing-03)}:host(.simple-card) a{text-decoration:none}:host(.simple-card) a:hover{text-decoration:none}:host(.most-popular){position:relative;margin:12px;background-color:var(--color-white)}:host(.most-popular) a{text-decoration:none}:host(.most-popular) a:hover{text-decoration:none}";
+
+const PtcCardPlm = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.hoverEvent = index.createEvent(this, "hoverEvent", 7);
+    this.leaveEvent = index.createEvent(this, "leaveEvent", 7);
+    this.squareHeightChanged = index.createEvent(this, "squareHeightChanged", 7);
+    this.cardType = undefined;
+    this.cardLink = undefined;
+    this.linkTitle = undefined;
+    this.linkTarget = '_self';
+    this.isLoading = false;
+    this.styles = undefined;
+  }
+  handleResize() {
+    this.checkScreenSize();
+    this.emitHeight();
+  }
+  hoverEventHandler() {
+    if (this.el.classList.contains('extra-tall')) {
+      this.hoverEvent.emit();
+      this.el.classList.add('extraT-overlay');
+    }
+    if (this.el.classList.contains('color-outlined')) {
+      this.hoverEvent.emit();
+      const cardOverlay = this.el.querySelector('ptc-overlay');
+      cardOverlay.setOverlay('black-5');
+    }
+  }
+  leaveEventHandler() {
+    if (this.el.classList.contains('extra-tall')) {
+      this.hoverEvent.emit();
+      this.el.classList.remove('extraT-overlay');
+    }
+    if (this.el.classList.contains('color-outlined')) {
+      this.hoverEvent.emit();
+      const cardOverlay = this.el.querySelector('ptc-overlay');
+      cardOverlay.setOverlay('black-4');
+    }
+  }
+  componentDidLoad() {
+    this.checkScreenSize();
+    this.emitHeight();
+  }
+  render() {
+    const classMap = this.getCssClassMap();
+    const Tag = !!this.cardLink ? 'a' : 'div';
+    return (index.h(index.Host, Object.assign({ class: classMap }, (!this.isLoading ? { onMouseEnter: this.hoverEventHandler.bind(this) } : {}), (!this.isLoading ? { onMouseLeave: this.leaveEventHandler.bind(this) } : {})), this.styles && index.h("style", null, this.styles), index.h(Tag, Object.assign({}, (!!this.cardLink && !this.isLoading ? { href: this.cardLink } : {}), (!!this.linkTarget && !!this.cardLink && !this.isLoading ? { target: this.linkTarget } : {}), (!!this.cardLink && !this.isLoading ? { title: this.linkTitle ? this.linkTitle : this.cardLink } : {})), index.h("slot", null))));
+  }
+  getCssClassMap() {
+    return {
+      [this.cardType]: this.cardType ? true : false,
+    };
+  }
+  emitHeight() {
+    const height = this.el.offsetHeight;
+    this.squareHeightChanged.emit(height);
+  }
+  getBtmContentHeight() {
+    const bottomContent = this.el.querySelector('ptc-card-bottom');
+    return bottomContent.offsetHeight;
+  }
+  checkScreenSize() {
+    if (this.cardType === 'extra-tall') {
+      if (window.innerWidth < 768) {
+        const cardContent = this.el.querySelector('ptc-card-content');
+        if (cardContent) {
+          cardContent.setHeight(this.getBtmContentHeight());
+        }
+      }
+      else {
+        const cardContent = this.el.querySelector('ptc-card-content');
+        if (cardContent) {
+          cardContent.removeInlineHeight();
+        }
+      }
+    }
+  }
+  get el() { return index.getElement(this); }
+};
+PtcCardPlm.style = ptcCardWrapperCss;
+
+const ptcParaCss = "h1,h2,h3,h4,h5,h6,p,ul,li,span{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,span{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}:host{position:relative;z-index:1}:host(.white){color:var(--color-white)}:host(.z-1){z-index:1}:host(.z-2){z-index:2}:host(.z-3){z-index:3}:host(.z-99){z-index:99}:host(.z-999){z-index:999}:host(.z-auto){z-index:auto}p.default{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;}p.main{text-shadow:0 3px 6px var(--color-white);line-height:var(--ptc-line-height-dense);color:var(--color-gray-10)}p.primary-grey{color:var(--color-gray-10)}p.gray-darker{color:var(--color-gray-11)}p.white{color:var(--color-white)}p.xxx-small{font-size:var(--ptc-font-size-xxx-small)}p.xx-small{font-size:var(--ptc-font-size-xx-small)}p.x-small{font-size:var(--ptc-font-size-x-small)}p.small{font-size:var(--ptc-font-size-small)}p.medium{font-size:var(--ptc-font-size-medium)}p.large{font-size:var(--ptc-font-size-large)}p.x-large{font-size:var(--ptc-font-size-x-large)}p.xx-large{font-size:var(--ptc-font-size-xx-large)}p.xxx-large{font-size:var(--ptc-font-size-xxx-large)}p.xxxx-large{font-size:var(--ptc-font-size-xxxx-large)}p.htmlquote-para{font-size:var(--ptc-font-size-small)}@media only screen and (min-width: 992px){p.htmlquote-para{font-size:var(--ptc-font-size-large)}}p.w-3{font-weight:var(--ptc-font-weight-thin)}p.w-4{font-weight:var(--ptc-font-weight-regular)}p.w-5{font-weight:var(--ptc-font-weight-medium)}p.w-6{font-weight:var(--ptc-font-weight-semibold)}p.w-7{font-weight:var(--ptc-font-weight-bold)}p.w-8{font-weight:var(--ptc-font-weight-extrabold)}p.w-9{font-weight:var(--ptc-font-weight-black)}p.margin-flush{margin-top:0;margin-bottom:0}p.margin-top-1{margin-top:var(--ptc-element-spacing-01);margin-bottom:0}p.margin-top-2{margin-top:var(--ptc-element-spacing-02);margin-bottom:0}p.margin-top-3{margin-top:var(--ptc-element-spacing-03);margin-bottom:0}p.margin-top-4{margin-top:var(--ptc-element-spacing-04);margin-bottom:0}p.margin-top-5{margin-top:var(--ptc-element-spacing-05);margin-bottom:0}p.margin-top-6{margin-top:var(--ptc-element-spacing-06);margin-bottom:0}p.margin-bottom-1{margin-bottom:var(--ptc-element-spacing-01);margin-top:0}p.margin-bottom-2{margin-bottom:var(--ptc-element-spacing-02);margin-top:0}p.margin-bottom-3{margin-bottom:var(--ptc-element-spacing-03);margin-top:0}p.margin-bottom-4{margin-bottom:var(--ptc-element-spacing-04);margin-top:0}p.margin-bottom-5{margin-bottom:var(--ptc-element-spacing-05);margin-top:0}p.margin-bottom-6{margin-bottom:var(--ptc-element-spacing-06);margin-top:0}p.margin-1{margin-top:var(--ptc-element-spacing-01);margin-bottom:var(--ptc-element-spacing-01)}p.margin-2{margin-top:var(--ptc-element-spacing-02);margin-bottom:var(--ptc-element-spacing-02)}p.margin-3{margin-top:var(--ptc-element-spacing-03);margin-bottom:var(--ptc-element-spacing-03)}p.margin-4{margin-top:var(--ptc-element-spacing-04);margin-bottom:var(--ptc-element-spacing-04)}p.margin-5{margin-top:var(--ptc-element-spacing-05);margin-bottom:var(--ptc-element-spacing-05)}p.margin-6{margin-top:var(--ptc-element-spacing-06);margin-bottom:var(--ptc-element-spacing-06)}p.line-height-densest{line-height:var(--ptc-line-height-densest)}p.line-height-denser{line-height:var(--ptc-line-height-denser)}p.line-height-p{line-height:var(--ptc-line-height-p)}p.line-height-dense{line-height:var(--ptc-line-height-dense)}p.line-height-normal{line-height:var(--ptc-line-height-normal)}p.line-height-loose{line-height:var(--ptc-line-height-loose)}p.line-height-looser{line-height:var(--ptc-line-height-looser)}p.left{text-align:left}p.right{text-align:right}p.center{text-align:center}p.justify{text-align:justify}p.announcement{text-transform:uppercase;font-size:var(--ptc-font-size-small);color:var(--color-gray-07);line-height:var(--ptc-line-height-looser);letter-spacing:var(--ptc-letter-spacing-loose)}p.ellipsis-boxing{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;overflow-wrap:break-word}";
+
+const PtcPara = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.fontSize = 'x-small';
+    this.fontWeight = 'w-4';
+    this.paraStyle = 'default';
+    this.paraColor = 'primary-grey';
+    this.paraLineH = 'line-height-normal';
+    this.paraMargin = undefined;
+    this.paraAlign = undefined;
+    this.ellipsisLineCutoff = undefined;
+    this.paraZIndex = undefined;
+    this.styles = undefined;
+    this.seoCompatibilityMode = false;
+  }
+  render() {
+    if (this.seoCompatibilityMode) {
+      utils.seoSlotReset(this.el);
+    }
+    return this.standardRender();
+  }
+  standardRender() {
+    const classMap = this.getCssClassMap();
+    const colorClass = this.addWhiteClass();
+    const cutOff = this.getLineCuttoff();
+    return (index.h(index.Host, { class: `${colorClass} ${this.paraZIndex}` }, this.styles && index.h("style", null, this.styles), index.h("p", { class: classMap, part: "part-para", style: cutOff }, index.h("slot", null))));
+  }
+  getCssClassMap() {
+    return {
+      [this.fontSize]: true,
+      [this.fontWeight]: true,
+      [this.paraStyle]: true,
+      [this.paraMargin]: !!this.paraMargin ? true : false,
+      [this.paraColor]: true,
+      [this.paraLineH]: true,
+      [this.paraAlign]: !!this.paraAlign ? true : false,
+      ['ellipsis-boxing']: this.ellipsisLineCutoff && this.ellipsisLineCutoff > 0,
+    };
+  }
+  //WEB-2392
+  addWhiteClass() {
+    if (this.paraColor == 'white') {
+      return {
+        [this.paraColor]: true,
+      };
+    }
+  }
+  getLineCuttoff() {
+    let result;
+    if (this.ellipsisLineCutoff && this.ellipsisLineCutoff > 0) {
+      result = {
+        ['-webkit-line-clamp']: `${this.ellipsisLineCutoff}`,
+      };
+    }
+    return result;
+  }
+  get el() { return index.getElement(this); }
+};
+PtcPara.style = ptcParaCss;
+
+const ptcPictureCss = "h1,h2,h3,h4,h5,h6,p,ul,li,span{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,span{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}:host{display:block;overflow:hidden}:host .inline{display:inline}:host .inline-block{display:inline-block}:host .block{display:block}:host(.relative){position:relative}:host(.static){position:static}:host(.absoltue){position:absolute}img{max-width:100%}.cover{object-fit:cover}.fill{object-fit:fill}.contain{object-fit:contain}.scale-down{object-fit:scale-down}.none{object-fit:none}.initial{object-fit:initial}.inherit{object-fit:inherit}.radius-standard{border-radius:var(--ptc-border-radius-standard)}.radius-large{border-radius:var(--ptc-border-radius-large)}.is-full-height{height:100%}.is-full-width{width:100%}:host(.left){text-align:left}:host(.right){text-align:right}:host(.center){text-align:center}";
+
+const PtcPicture = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.src = undefined;
+    this.alt = 'image';
+    this.sizeXs = '510x340';
+    this.sizeSm = '1240x496';
+    this.sizeMd = '1366x500';
+    this.sizeLg = '1920x1080';
+    this.disableResize = false;
+    this.oldSrc = undefined;
+    this.imagePosition = 'static';
+    this.borderRadius = undefined;
+    this.height = undefined;
+    this.width = undefined;
+    this.objectFit = 'cover';
+    this.isFullHeight = false;
+    this.isFullWidth = false;
+    this.styles = undefined;
+    this.imageAlignment = 'left';
+    this.maxWidth = undefined;
+    this.displayImage = 'block';
+  }
+  WindowResize() {
+    this.addIntersectionObserver();
+  }
+  componentWillLoad() {
+    if (this.disableResize) {
+      this.sizeXs = undefined;
+      this.sizeSm = undefined;
+      this.sizeMd = undefined;
+      this.sizeLg = undefined;
+    }
+  }
+  componentDidLoad() {
+    this.addIntersectionObserver();
+  }
+  componentWillUpdate() {
+    if (this.src !== this.oldSrc) {
+      this.addIntersectionObserver();
+    }
+    this.oldSrc = this.src;
+  }
+  //lazy-loading
+  addIntersectionObserver() {
+    if (!this.src) {
+      return;
+    }
+    if ('IntersectionObserver' in window) {
+      let lazyLoadImages = new IntersectionObserver(entries => {
+        entries.forEach(entry => {
+          if (entry.isIntersecting) {
+            const image = this.el.shadowRoot.querySelector('img');
+            image.src = this.setResponsiveBg();
+            lazyLoadImages.unobserve(image);
+          }
+        });
+      });
+      let tempImg = this.el.shadowRoot.querySelector('img');
+      if (tempImg) {
+        lazyLoadImages.observe(tempImg);
+      }
+    }
+    else {
+      // fall back to setTimeout for Safari and IE
+      setTimeout(() => {
+        const image = this.el.shadowRoot.querySelector('img');
+        image.src = this.setResponsiveBg();
+        image.onload = () => {
+          image.removeAttribute('data-src');
+          console.log('loaded fallback');
+        };
+      }, 5000);
+    }
+  }
+  //responsive image
+  setResponsiveBg() {
+    // Define local variables
+    let backgrounds = (this.el.shadowRoot || document).querySelectorAll('img'), el, elData, currentBreakpoint = this.getCurrentBreakPoints();
+    for (var i = 0, len = backgrounds.length; i < len; i++) {
+      // Set current variables
+      el = backgrounds[i];
+      elData = el.getAttribute('data-' + currentBreakpoint);
+      if (elData !== null) {
+        return elData;
+      }
+      else {
+        if (typeof console == 'object') {
+          console.warn('Data attribute: data-' + currentBreakpoint + ' not found on element:\n\n' + el.outerHTML + '\n\n\n');
+        }
+      }
+    }
+  }
+  render() {
+    const classMap = this.getCssClassMap();
+    const classMapHost = this.getCssClassMapHost();
+    return (index.h(index.Host, { class: classMapHost }, this.styles && index.h("style", null, this.styles), index.h("img", Object.assign({ class: classMap, "data-xs": !!this.sizeXs ? `${this.src}` : `${this.src}`, "data-sm": !!this.sizeSm ? `${this.src}` : `${this.src}`, "data-md": !!this.sizeMd ? `${this.src}` : `${this.src}`, "data-lg": !!this.sizeLg ? `${this.src}` : `${this.src}` }, (!!this.width ? { width: this.width } : {}), (!!this.height ? { height: this.height } : {}), { alt: this.alt, style: Object.assign({}, (!!this.maxWidth ? { maxWidth: this.maxWidth + 'px' } : {})) })), index.h("slot", null)));
+  }
+  getCurrentBreakPoints() {
+    // Define local variables
+    let doc = window.document, temp = doc.createElement('div'), env;
+    // Append test node
+    doc.body.appendChild(temp);
+    // Loop through breakpoints
+    for (let i = interfaces.ResponsivePictureVariables.envs.length - 1; i >= 0; i--) {
+      env = interfaces.ResponsivePictureVariables.envs[i];
+      // Add classes
+      temp.className = 'hidden-' + env;
+      // Found breakpoint
+      if (temp.offsetParent === null) {
+        // Remove our test node
+        doc.body.removeChild(temp);
+        // Return current breakpoint
+        return env;
+      }
+    }
+    // Breakpoint not found, try fallback
+    doc.body.removeChild(temp);
+    return this.getFallbackBreakpoint();
+  }
+  getFallbackBreakpoint() {
+    if (window.matchMedia('(min-width: 992px)').matches) {
+      return 'lg';
+    }
+    else if (window.matchMedia('(min-width: 768px)').matches) {
+      return 'md';
+    }
+    else if (window.matchMedia('(min-width: 576px)').matches) {
+      return 'sm';
+    }
+    else {
+      return 'xs';
+    }
+  }
+  getCssClassMap() {
+    return {
+      [this.borderRadius]: this.borderRadius ? true : false,
+      [this.objectFit]: true,
+      [this.isFullHeight ? 'is-full-height' : 'is-normal-height']: true,
+      [this.isFullWidth ? 'is-full-width' : 'is-normal-width']: true,
+      [this.displayImage]: true
+    };
+  }
+  getCssClassMapHost() {
+    return {
+      [this.imagePosition]: true,
+      [this.imageAlignment]: true,
+    };
+  }
+  get el() { return index.getElement(this); }
+};
+PtcPicture.style = ptcPictureCss;
+
+const ptcSpacerCss = ":host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:relative;display:block;width:12px;min-width:12px;height:12px}@media (min-width: 36em){:host{width:16px;min-width:16px;height:16px}}:host(.ptc-spacer-horizontal){display:inline-block;height:100% !important}:host(.ptc-spacer-horizontal.xx-small){width:4px;min-width:4px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xx-small){width:4px;min-width:4px}}:host(.ptc-spacer-horizontal.x-small){width:4px;min-width:4px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.x-small){width:8px;min-width:8px}}:host(.ptc-spacer-horizontal.small){width:8px;min-width:8px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.small){width:12px;min-width:12px}}:host(.ptc-spacer-horizontal.medium){height:100%}:host(.ptc-spacer-horizontal.large){width:16px;min-width:16px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.large){width:20px;min-width:20px}}:host(.ptc-spacer-horizontal.x-large){width:20px;min-width:20px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.x-large){width:28px;min-width:28px}}:host(.ptc-spacer-horizontal.xx-large){width:28px;min-width:28px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xx-large){width:36px;min-width:36px}}:host(.ptc-spacer-horizontal.xxx-large){width:36px;min-width:36px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xxx-large){width:48px;min-width:48px}}:host(.ptc-spacer-horizontal.xxxx-large){width:48px;min-width:48px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xxxx-large){width:72px;min-width:72px}}:host(.ptc-spacer-vertical.xx-small){width:100%;height:4px;min-height:4px}:host(.ptc-spacer-vertical.x-small){width:100%;height:4px;min-height:4px}@media (min-width: 36em){:host(.ptc-spacer-vertical.x-small){height:8px;min-height:8px}}:host(.ptc-spacer-vertical.small){width:100%;height:8px;min-height:8px}@media (min-width: 36em){:host(.ptc-spacer-vertical.small){height:12px;min-height:12px}}:host(.ptc-spacer-vertical.medium){width:100%}:host(.ptc-spacer-vertical.large){width:100%;height:16px;min-height:16px}@media (min-width: 36em){:host(.ptc-spacer-vertical.large){height:20px;min-height:20px}}:host(.ptc-spacer-vertical.x-large){width:100%;height:20px;min-height:20px}@media (min-width: 36em){:host(.ptc-spacer-vertical.x-large){height:28px;min-height:28px}}:host(.ptc-spacer-vertical.xx-large){width:100%;height:28px;min-height:28px}@media (min-width: 36em){:host(.ptc-spacer-vertical.xx-large){height:36px;min-height:36px}}:host(.ptc-spacer-vertical.xxx-large){width:100%;height:36px;min-height:36px}@media (min-width: 36em){:host(.ptc-spacer-vertical.xxx-large){height:48px;min-height:48px}}:host(.ptc-spacer-vertical.xxxx-large){width:100%;height:48px;min-height:48px}@media (min-width: 36em){:host(.ptc-spacer-vertical.xxxx-large){height:72px;min-height:72px}}:host(.ptc-spacer-vertical.space-144){width:100%;height:144px;min-height:144px}:host(.ptc-spacer-vertical.space-120){width:100%;height:120px;min-height:120px}:host(.ptc-spacer-vertical.space-128){width:100%;height:128px;min-height:128px}:host(.ptc-spacer-xx-small){display:none}@media (max-width: 22.5em){:host(.ptc-spacer-xx-small){display:block}}:host(.ptc-spacer-x-small){display:none}@media (max-width: 35.99em){:host(.ptc-spacer-x-small){display:block}}:host(.ptc-spacer-small){display:none}@media (min-width: 36em){:host(.ptc-spacer-small){display:block}}:host(.ptc-spacer-medium){display:none}@media (min-width: 48em){:host(.ptc-spacer-medium){display:block}}:host(.ptc-spacer-large){display:none}@media (min-width: 62em){:host(.ptc-spacer-large){display:block}}:host(.ptc-spacer-x-large){display:none}@media (min-width: 64.0625em){:host(.ptc-spacer-x-large){display:block}}:host(.ptc-spacer-xx-large){display:none}@media (min-width: 75em){:host(.ptc-spacer-xx-large){display:block}}:host(.ptc-spacer-xxx-large){display:none}@media (min-width: 90em){:host(.ptc-spacer-xxx-large){display:block}}";
+
+const PtcSpacer = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.breakpoint = '';
+    this.size = 'medium';
+    this.direction = 'vertical';
+  }
+  render() {
+    const classMap = this.getCssClassMap();
+    return (index.h(index.Host, { class: classMap }));
+  }
+  getCssClassMap() {
+    return {
+      [this.size]: true,
+      ['ptc-spacer-horizontal']: this.direction === 'horizontal',
+      ['ptc-spacer-vertical']: this.direction === 'vertical',
+      ['ptc-spacer-xx-small']: this.breakpoint === 'xx-small',
+      ['ptc-spacer-x-small']: this.breakpoint === 'x-small',
+      ['ptc-spacer-small']: this.breakpoint === 'small',
+      ['ptc-spacer-medium']: this.breakpoint === 'medium',
+      ['ptc-spacer-large']: this.breakpoint === 'large',
+      ['ptc-spacer-x-large']: this.breakpoint === 'x-large',
+      ['ptc-spacer-xx-large']: this.breakpoint === 'xx-large',
+      ['ptc-spacer-xxx-large']: this.breakpoint === 'xxx-large',
+    };
+  }
+};
+PtcSpacer.style = ptcSpacerCss;
+
+const ptcTitleCss = "h1.sc-ptc-title,h2.sc-ptc-title,h3.sc-ptc-title,h4.sc-ptc-title,h5.sc-ptc-title,h6.sc-ptc-title,p.sc-ptc-title,ul.sc-ptc-title,li.sc-ptc-title,span.sc-ptc-title{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1.sc-ptc-title,h2.sc-ptc-title,h3.sc-ptc-title,h4.sc-ptc-title,h5.sc-ptc-title,h6.sc-ptc-title,p.sc-ptc-title,ul.sc-ptc-title,li.sc-ptc-title,span.sc-ptc-title{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}div.center.sc-ptc-title{text-align:center}div.center.dotted.sc-ptc-title h1.sc-ptc-title::before,div.center.dotted.sc-ptc-title h2.sc-ptc-title::before,div.center.dotted.sc-ptc-title h3.sc-ptc-title::before,div.center.dotted.sc-ptc-title h4.sc-ptc-title::before,div.center.dotted.sc-ptc-title h5.sc-ptc-title::before,div.center.dotted.sc-ptc-title h6.sc-ptc-title::before{left:50%;transform:translateX(-50%)}div.left.sc-ptc-title{text-align:left}div.left.dotted.sc-ptc-title h1.sc-ptc-title::before,div.left.dotted.sc-ptc-title h2.sc-ptc-title::before,div.left.dotted.sc-ptc-title h3.sc-ptc-title::before,div.left.dotted.sc-ptc-title h4.sc-ptc-title::before,div.left.dotted.sc-ptc-title h5.sc-ptc-title::before,div.left.dotted.sc-ptc-title h6.sc-ptc-title::before{left:0%}div.right.sc-ptc-title{text-align:right}div.right.dotted.sc-ptc-title h1.sc-ptc-title::before,div.right.dotted.sc-ptc-title h2.sc-ptc-title::before,div.right.dotted.sc-ptc-title h3.sc-ptc-title::before,div.right.dotted.sc-ptc-title h4.sc-ptc-title::before,div.right.dotted.sc-ptc-title h5.sc-ptc-title::before,div.right.dotted.sc-ptc-title h6.sc-ptc-title::before{right:0%}div.inherit.sc-ptc-title{text-align:inherit}div.dotted.sc-ptc-title h1.sc-ptc-title::before,div.dotted.sc-ptc-title h2.sc-ptc-title::before,div.dotted.sc-ptc-title h3.sc-ptc-title::before,div.dotted.sc-ptc-title h4.sc-ptc-title::before,div.dotted.sc-ptc-title h5.sc-ptc-title::before,div.dotted.sc-ptc-title h6.sc-ptc-title::before{content:\"\";position:absolute;top:-6px;width:30%;display:block;border-top:3px dashed var(--color-green-07)}div.solid.sc-ptc-title h1.sc-ptc-title,div.solid.sc-ptc-title h2.sc-ptc-title,div.solid.sc-ptc-title h3.sc-ptc-title,div.solid.sc-ptc-title h4.sc-ptc-title,div.solid.sc-ptc-title h5.sc-ptc-title,div.solid.sc-ptc-title h6.sc-ptc-title{padding-top:12px}div.solid.sc-ptc-title h1.sc-ptc-title::before,div.solid.sc-ptc-title h2.sc-ptc-title::before,div.solid.sc-ptc-title h3.sc-ptc-title::before,div.solid.sc-ptc-title h4.sc-ptc-title::before,div.solid.sc-ptc-title h5.sc-ptc-title::before,div.solid.sc-ptc-title h6.sc-ptc-title::before{content:\"\";position:absolute;width:100%;height:0.7px;background-color:var(--color-gray-03);opacity:0.9;left:0px;top:0}div.solid.sc-ptc-title h1.sc-ptc-title::after,div.solid.sc-ptc-title h2.sc-ptc-title::after,div.solid.sc-ptc-title h3.sc-ptc-title::after,div.solid.sc-ptc-title h4.sc-ptc-title::after,div.solid.sc-ptc-title h5.sc-ptc-title::after,div.solid.sc-ptc-title h6.sc-ptc-title::after{content:\"\";position:absolute;width:56px;height:2px;background-color:var(--color-green-07);top:-2px;left:0px}div.is-standard.sc-ptc-title h1.sc-ptc-title,div.is-standard.sc-ptc-title h2.sc-ptc-title,div.is-standard.sc-ptc-title h3.sc-ptc-title,div.is-standard.sc-ptc-title h4.sc-ptc-title,div.is-standard.sc-ptc-title h5.sc-ptc-title,div.is-standard.sc-ptc-title h6.sc-ptc-title{display:inline-block;position:relative}div.is-standard.sc-ptc-title h1.sc-ptc-title{font-size:var(--ptc-font-size-xxx-large);line-height:var(--ptc-line-height-densest);font-weight:var(--ptc-font-weight-extrabold);letter-spacing:0px;color:var(--color-gray-10)}@media only screen and (min-width: 768px){div.is-standard.sc-ptc-title h1.sc-ptc-title{font-size:var(--ptc-font-size-xxxx-large)}}div.is-standard.sc-ptc-title h2.sc-ptc-title{font-size:var(--ptc-font-size-x-large);line-height:var(--ptc-line-height-densest);font-weight:var(--ptc-font-weight-extrabold);color:var(--color-gray-10)}@media only screen and (min-width: 768px){div.is-standard.sc-ptc-title h2.sc-ptc-title{font-size:var(--ptc-font-size-xx-large)}}div.is-plm-hub.sc-ptc-title h1.sc-ptc-title,div.is-plm-hub.sc-ptc-title h2.sc-ptc-title,div.is-plm-hub.sc-ptc-title h3.sc-ptc-title,div.is-plm-hub.sc-ptc-title h4.sc-ptc-title,div.is-plm-hub.sc-ptc-title h5.sc-ptc-title,div.is-plm-hub.sc-ptc-title h6.sc-ptc-title{display:inline-block;position:relative;margin-block-start:0em;margin-block-end:0em;margin-inline-start:0px;margin-inline-end:0px;color:var(--color-white) !important}div.margin-flush.sc-ptc-title{margin-top:0;margin-bottom:0}div.margin-flush.sc-ptc-title h1.sc-ptc-title,div.margin-flush.sc-ptc-title h2.sc-ptc-title,div.margin-flush.sc-ptc-title h3.sc-ptc-title,div.margin-flush.sc-ptc-title h4.sc-ptc-title,div.margin-flush.sc-ptc-title h5.sc-ptc-title{margin-top:0;margin-bottom:0}div.margin-top-2.sc-ptc-title{margin-top:var(--ptc-element-spacing-02);margin-bottom:0}div.margin-top-3.sc-ptc-title{margin-top:var(--ptc-element-spacing-03);margin-bottom:0}div.margin-top-4.sc-ptc-title{margin-top:var(--ptc-element-spacing-04);margin-bottom:0}div.margin-top-5.sc-ptc-title{margin-top:var(--ptc-element-spacing-05);margin-bottom:0}div.margin-top-6.sc-ptc-title{margin-top:var(--ptc-element-spacing-06);margin-bottom:0}div.margin-bottom-2.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-02);margin-top:0}div.margin-bottom-3.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-03);margin-top:0}div.margin-bottom-4.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-04);margin-top:0}div.margin-bottom-5.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-05);margin-top:0}div.margin-bottom-6.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-06);margin-top:0}div.margin-2.sc-ptc-title{margin-top:var(--ptc-element-spacing-02);margin-bottom:var(--ptc-element-spacing-02)}div.margin-3.sc-ptc-title{margin-top:var(--ptc-element-spacing-03);margin-bottom:var(--ptc-element-spacing-03)}div.margin-4.sc-ptc-title{margin-top:var(--ptc-element-spacing-04);margin-bottom:var(--ptc-element-spacing-04)}div.margin-5.sc-ptc-title{margin-top:var(--ptc-element-spacing-05);margin-bottom:var(--ptc-element-spacing-05)}div.margin-5.sc-ptc-title h4.sc-ptc-title{margin-top:0;margin-bottom:0}div.margin-6.sc-ptc-title{margin-top:var(--ptc-element-spacing-06);margin-bottom:var(--ptc-element-spacing-06)}div.margin-9.sc-ptc-title{margin-top:var(--ptc-element-spacing-09);margin-bottom:var(--ptc-element-spacing-09)}div.green.sc-ptc-title h1.sc-ptc-title,div.green.sc-ptc-title h2.sc-ptc-title,div.green.sc-ptc-title h3.sc-ptc-title,div.green.sc-ptc-title h4.sc-ptc-title,div.green.sc-ptc-title h5.sc-ptc-title,div.green.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-green-07)}div.blue.sc-ptc-title h1.sc-ptc-title,div.blue.sc-ptc-title h2.sc-ptc-title,div.blue.sc-ptc-title h3.sc-ptc-title,div.blue.sc-ptc-title h4.sc-ptc-title,div.blue.sc-ptc-title h5.sc-ptc-title,div.blue.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-blue-07)}div.red.sc-ptc-title h1.sc-ptc-title,div.red.sc-ptc-title h2.sc-ptc-title,div.red.sc-ptc-title h3.sc-ptc-title,div.red.sc-ptc-title h4.sc-ptc-title,div.red.sc-ptc-title h5.sc-ptc-title,div.red.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-red-07)}div.orange.sc-ptc-title h1.sc-ptc-title,div.orange.sc-ptc-title h2.sc-ptc-title,div.orange.sc-ptc-title h3.sc-ptc-title,div.orange.sc-ptc-title h4.sc-ptc-title,div.orange.sc-ptc-title h5.sc-ptc-title,div.orange.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-orange-07)}div.slate-grey.sc-ptc-title h1.sc-ptc-title,div.slate-grey.sc-ptc-title h2.sc-ptc-title,div.slate-grey.sc-ptc-title h3.sc-ptc-title,div.slate-grey.sc-ptc-title h4.sc-ptc-title,div.slate-grey.sc-ptc-title h5.sc-ptc-title,div.slate-grey.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-gray-07)}div.w-3.sc-ptc-title h1.sc-ptc-title,div.w-3.sc-ptc-title h2.sc-ptc-title,div.w-3.sc-ptc-title h3.sc-ptc-title,div.w-3.sc-ptc-title h4.sc-ptc-title,div.w-3.sc-ptc-title h5.sc-ptc-title,div.w-3.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-thin)}div.w-4.sc-ptc-title h1.sc-ptc-title,div.w-4.sc-ptc-title h2.sc-ptc-title,div.w-4.sc-ptc-title h3.sc-ptc-title,div.w-4.sc-ptc-title h4.sc-ptc-title,div.w-4.sc-ptc-title h5.sc-ptc-title,div.w-4.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-regular)}div.w-5.sc-ptc-title h1.sc-ptc-title,div.w-5.sc-ptc-title h2.sc-ptc-title,div.w-5.sc-ptc-title h3.sc-ptc-title,div.w-5.sc-ptc-title h4.sc-ptc-title,div.w-5.sc-ptc-title h5.sc-ptc-title,div.w-5.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-medium)}div.w-6.sc-ptc-title h1.sc-ptc-title,div.w-6.sc-ptc-title h2.sc-ptc-title,div.w-6.sc-ptc-title h3.sc-ptc-title,div.w-6.sc-ptc-title h4.sc-ptc-title,div.w-6.sc-ptc-title h5.sc-ptc-title,div.w-6.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-semibold)}div.w-7.sc-ptc-title h1.sc-ptc-title,div.w-7.sc-ptc-title h2.sc-ptc-title,div.w-7.sc-ptc-title h3.sc-ptc-title,div.w-7.sc-ptc-title h4.sc-ptc-title,div.w-7.sc-ptc-title h5.sc-ptc-title,div.w-7.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-bold)}div.w-8.sc-ptc-title h1.sc-ptc-title,div.w-8.sc-ptc-title h2.sc-ptc-title,div.w-8.sc-ptc-title h3.sc-ptc-title,div.w-8.sc-ptc-title h4.sc-ptc-title,div.w-8.sc-ptc-title h5.sc-ptc-title,div.w-8.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-extrabold)}div.w-9.sc-ptc-title h1.sc-ptc-title,div.w-9.sc-ptc-title h2.sc-ptc-title,div.w-9.sc-ptc-title h3.sc-ptc-title,div.w-9.sc-ptc-title h4.sc-ptc-title,div.w-9.sc-ptc-title h5.sc-ptc-title,div.w-9.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-black)}div.xx-small.sc-ptc-title h1.sc-ptc-title,div.xx-small.sc-ptc-title h2.sc-ptc-title,div.xx-small.sc-ptc-title h3.sc-ptc-title,div.xx-small.sc-ptc-title h4.sc-ptc-title,div.xx-small.sc-ptc-title h5.sc-ptc-title,div.xx-small.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xx-small)}div.x-small.sc-ptc-title h1.sc-ptc-title,div.x-small.sc-ptc-title h2.sc-ptc-title,div.x-small.sc-ptc-title h3.sc-ptc-title,div.x-small.sc-ptc-title h4.sc-ptc-title,div.x-small.sc-ptc-title h5.sc-ptc-title,div.x-small.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-x-small)}div.small.sc-ptc-title h1.sc-ptc-title,div.small.sc-ptc-title h2.sc-ptc-title,div.small.sc-ptc-title h3.sc-ptc-title,div.small.sc-ptc-title h4.sc-ptc-title,div.small.sc-ptc-title h5.sc-ptc-title,div.small.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-small)}div.medium.sc-ptc-title h1.sc-ptc-title,div.medium.sc-ptc-title h2.sc-ptc-title,div.medium.sc-ptc-title h3.sc-ptc-title,div.medium.sc-ptc-title h4.sc-ptc-title,div.medium.sc-ptc-title h5.sc-ptc-title,div.medium.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-medium)}div.large.sc-ptc-title h1.sc-ptc-title,div.large.sc-ptc-title h2.sc-ptc-title,div.large.sc-ptc-title h3.sc-ptc-title,div.large.sc-ptc-title h4.sc-ptc-title,div.large.sc-ptc-title h5.sc-ptc-title,div.large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-large)}div.large.sc-ptc-title h3.sc-ptc-title{font-size:var(--ptc-font-size-medium)}@media only screen and (min-width: 768px){div.large.sc-ptc-title h3.sc-ptc-title{font-size:var(--ptc-font-size-large)}}div.x-large.sc-ptc-title h1.sc-ptc-title,div.x-large.sc-ptc-title h2.sc-ptc-title,div.x-large.sc-ptc-title h3.sc-ptc-title,div.x-large.sc-ptc-title h4.sc-ptc-title,div.x-large.sc-ptc-title h5.sc-ptc-title,div.x-large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-x-large)}div.xx-large.sc-ptc-title h1.sc-ptc-title,div.xx-large.sc-ptc-title h2.sc-ptc-title,div.xx-large.sc-ptc-title h3.sc-ptc-title,div.xx-large.sc-ptc-title h4.sc-ptc-title{font-size:var(--ptc-font-size-x-large)}@media only screen and (min-width: 768px){div.xx-large.sc-ptc-title h1.sc-ptc-title,div.xx-large.sc-ptc-title h2.sc-ptc-title,div.xx-large.sc-ptc-title h3.sc-ptc-title,div.xx-large.sc-ptc-title h4.sc-ptc-title{font-size:var(--ptc-font-size-xx-large)}}div.xxx-large.sc-ptc-title h1.sc-ptc-title,div.xxx-large.sc-ptc-title h2.sc-ptc-title,div.xxx-large.sc-ptc-title h3.sc-ptc-title,div.xxx-large.sc-ptc-title h4.sc-ptc-title,div.xxx-large.sc-ptc-title h5.sc-ptc-title,div.xxx-large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xx-large)}@media only screen and (min-width: 768px){div.xxx-large.sc-ptc-title h1.sc-ptc-title,div.xxx-large.sc-ptc-title h2.sc-ptc-title,div.xxx-large.sc-ptc-title h3.sc-ptc-title,div.xxx-large.sc-ptc-title h4.sc-ptc-title,div.xxx-large.sc-ptc-title h5.sc-ptc-title,div.xxx-large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxx-large)}}div.xxxx-large.sc-ptc-title h1.sc-ptc-title,div.xxxx-large.sc-ptc-title h2.sc-ptc-title,div.xxxx-large.sc-ptc-title h3.sc-ptc-title,div.xxxx-large.sc-ptc-title h4.sc-ptc-title,div.xxxx-large.sc-ptc-title h5.sc-ptc-title,div.xxxx-large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxx-large)}@media screen and (min-width: 769px){div.xxxx-large.sc-ptc-title h1.sc-ptc-title,div.xxxx-large.sc-ptc-title h2.sc-ptc-title,div.xxxx-large.sc-ptc-title h3.sc-ptc-title,div.xxxx-large.sc-ptc-title h4.sc-ptc-title,div.xxxx-large.sc-ptc-title h5.sc-ptc-title,div.xxxx-large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxxx-large)}}div.xx-large-allbp.sc-ptc-title h1.sc-ptc-title,div.xx-large-allbp.sc-ptc-title h2.sc-ptc-title,div.xx-large-allbp.sc-ptc-title h3.sc-ptc-title,div.xx-large-allbp.sc-ptc-title h4.sc-ptc-title,div.xx-large-allbp.sc-ptc-title h5.sc-ptc-title,div.xx-large-allbp.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xx-large)}div.xxxx-large-allbp.sc-ptc-title h1.sc-ptc-title,div.xxxx-large-allbp.sc-ptc-title h2.sc-ptc-title,div.xxxx-large-allbp.sc-ptc-title h3.sc-ptc-title,div.xxxx-large-allbp.sc-ptc-title h4.sc-ptc-title,div.xxxx-large-allbp.sc-ptc-title h5.sc-ptc-title,div.xxxx-large-allbp.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxxx-large)}div.xxxx-large-desktop.sc-ptc-title h1.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h2.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h3.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h4.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h5.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxx-large)}@media only screen and (min-width: 992px){div.xxxx-large-desktop.sc-ptc-title h1.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h2.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h3.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h4.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h5.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxxx-large)}}div.xxxx-large-store.sc-ptc-title h1.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h2.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h3.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h4.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h5.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxx-large)}@media only screen and (min-width: 992px){div.xxxx-large-store.sc-ptc-title h1.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h2.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h3.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h4.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h5.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxxx-large)}}div.densest.sc-ptc-title h1.sc-ptc-title,div.densest.sc-ptc-title h2.sc-ptc-title,div.densest.sc-ptc-title h3.sc-ptc-title,div.densest.sc-ptc-title h4.sc-ptc-title,div.densest.sc-ptc-title h5.sc-ptc-title,div.densest.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-densest)}div.denser.sc-ptc-title h1.sc-ptc-title,div.denser.sc-ptc-title h2.sc-ptc-title,div.denser.sc-ptc-title h3.sc-ptc-title,div.denser.sc-ptc-title h4.sc-ptc-title,div.denser.sc-ptc-title h5.sc-ptc-title,div.denser.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-denser)}div.dense.sc-ptc-title h1.sc-ptc-title,div.dense.sc-ptc-title h2.sc-ptc-title,div.dense.sc-ptc-title h3.sc-ptc-title,div.dense.sc-ptc-title h4.sc-ptc-title,div.dense.sc-ptc-title h5.sc-ptc-title,div.dense.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-dense)}div.normal.sc-ptc-title h1.sc-ptc-title,div.normal.sc-ptc-title h2.sc-ptc-title,div.normal.sc-ptc-title h3.sc-ptc-title,div.normal.sc-ptc-title h4.sc-ptc-title,div.normal.sc-ptc-title h5.sc-ptc-title,div.normal.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-normal)}div.loose.sc-ptc-title h1.sc-ptc-title,div.loose.sc-ptc-title h2.sc-ptc-title,div.loose.sc-ptc-title h3.sc-ptc-title,div.loose.sc-ptc-title h4.sc-ptc-title,div.loose.sc-ptc-title h5.sc-ptc-title,div.loose.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-loose)}div.looser.sc-ptc-title h1.sc-ptc-title,div.looser.sc-ptc-title h2.sc-ptc-title,div.looser.sc-ptc-title h3.sc-ptc-title,div.looser.sc-ptc-title h4.sc-ptc-title,div.looser.sc-ptc-title h5.sc-ptc-title,div.looser.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-looser)}div.paragraph.sc-ptc-title h1.sc-ptc-title,div.paragraph.sc-ptc-title h2.sc-ptc-title,div.paragraph.sc-ptc-title h3.sc-ptc-title,div.paragraph.sc-ptc-title h4.sc-ptc-title,div.paragraph.sc-ptc-title h5.sc-ptc-title,div.paragraph.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-paragraph)}div.black.sc-ptc-title h1.sc-ptc-title,div.black.sc-ptc-title h2.sc-ptc-title,div.black.sc-ptc-title h3.sc-ptc-title,div.black.sc-ptc-title h4.sc-ptc-title,div.black.sc-ptc-title h5.sc-ptc-title,div.black.sc-ptc-title h6.sc-ptc-title{color:var(--color-black)}div.white.sc-ptc-title h1.sc-ptc-title,div.white.sc-ptc-title h2.sc-ptc-title,div.white.sc-ptc-title h3.sc-ptc-title,div.white.sc-ptc-title h4.sc-ptc-title,div.white.sc-ptc-title h5.sc-ptc-title,div.white.sc-ptc-title h6.sc-ptc-title{color:var(--color-white)}div.gray-1.sc-ptc-title h1.sc-ptc-title,div.gray-1.sc-ptc-title h2.sc-ptc-title,div.gray-1.sc-ptc-title h3.sc-ptc-title,div.gray-1.sc-ptc-title h4.sc-ptc-title,div.gray-1.sc-ptc-title h5.sc-ptc-title,div.gray-1.sc-ptc-title h6.sc-ptc-title{color:var(--color-gray-01)}div.gray.sc-ptc-title h1.sc-ptc-title,div.gray.sc-ptc-title h2.sc-ptc-title,div.gray.sc-ptc-title h3.sc-ptc-title,div.gray.sc-ptc-title h4.sc-ptc-title,div.gray.sc-ptc-title h5.sc-ptc-title,div.gray.sc-ptc-title h6.sc-ptc-title{color:var(--color-gray-10)}div.gray-darker.sc-ptc-title h1.sc-ptc-title,div.gray-darker.sc-ptc-title h2.sc-ptc-title,div.gray-darker.sc-ptc-title h3.sc-ptc-title,div.gray-darker.sc-ptc-title h4.sc-ptc-title,div.gray-darker.sc-ptc-title h5.sc-ptc-title,div.gray-darker.sc-ptc-title h6.sc-ptc-title{color:var(--color-gray-11)}div.ellipsis-boxing.sc-ptc-title h1.sc-ptc-title,div.ellipsis-boxing.sc-ptc-title h2.sc-ptc-title,div.ellipsis-boxing.sc-ptc-title h3.sc-ptc-title,div.ellipsis-boxing.sc-ptc-title h4.sc-ptc-title,div.ellipsis-boxing.sc-ptc-title h5.sc-ptc-title,div.ellipsis-boxing.sc-ptc-title h6.sc-ptc-title{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;overflow-wrap:break-word;padding-bottom:0}div.block.sc-ptc-title h1.sc-ptc-title,div.block.sc-ptc-title h2.sc-ptc-title,div.block.sc-ptc-title h3.sc-ptc-title,div.block.sc-ptc-title h4.sc-ptc-title,div.block.sc-ptc-title h5.sc-ptc-title,div.block.sc-ptc-title h6.sc-ptc-title{display:block}";
+
+const PtcTitle = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.isPlmHub = false;
+    this.type = 'h2';
+    this.textAlign = undefined;
+    this.upperline = 'dotted';
+    this.titleShadow = undefined;
+    this.titleColor = 'gray';
+    this.titleMargin = undefined;
+    this.titleWeight = undefined;
+    this.titleSize = undefined;
+    this.titleHeight = 'densest';
+    this.styles = undefined;
+    this.ellipsisLineCutoff = undefined;
+    this.titleDisplay = 'inline-block';
+    this.seoCompatibilityMode = false;
+  }
+  render() {
+    if (this.seoCompatibilityMode) {
+      return this.seoCompRender();
+    }
+    else {
+      return this.standardRender();
+    }
+  }
+  seoCompRender() {
+    const classMap = this.getCssClassMap();
+    const cutOff = this.getLineCuttoff();
+    const [TagType, firstChild] = utils.getSeoTagType(this.el, this.type);
+    const html = firstChild && firstChild.innerHTML;
+    if (this.el == firstChild) {
+      this.el.innerHTML = '';
+    }
+    return (index.h(index.Host, null, this.styles && index.h("style", null, this.styles), index.h("div", { class: classMap }, index.h(TagType, { innerHTML: html, style: cutOff }))));
+  }
+  standardRender() {
+    const classMap = this.getCssClassMap();
+    const cutOff = this.getLineCuttoff();
+    let TagType;
+    switch (this.type) {
+      case 'h1':
+        TagType = 'h1';
+        break;
+      case 'h3':
+        TagType = 'h3';
+        break;
+      case 'h4':
+        TagType = 'h4';
+        break;
+      case 'h5':
+        TagType = 'h5';
+        break;
+      case 'h6':
+        TagType = 'h6';
+        break;
+      default:
+        TagType = 'h2';
+    }
+    return (index.h(index.Host, null, this.styles && index.h("style", null, this.styles), index.h("div", { class: classMap }, index.h(TagType, { style: cutOff }, index.h("slot", null)))));
+  }
+  getCssClassMap() {
+    return {
+      [this.textAlign]: !!this.textAlign ? true : false,
+      [this.upperline]: true,
+      [this.isPlmHub ? 'is-plm-hub' : 'is-standard']: true,
+      [this.titleMargin]: !!this.titleMargin ? true : false,
+      [this.titleShadow]: !!this.titleShadow ? true : false,
+      [this.titleWeight]: !!this.titleWeight ? true : false,
+      [this.titleSize]: !!this.titleSize ? true : false,
+      [this.titleHeight]: !!this.titleHeight ? true : false,
+      [this.titleColor]: !!this.titleColor ? true : false,
+      ['ellipsis-boxing']: this.ellipsisLineCutoff && this.ellipsisLineCutoff > 0,
+      [this.titleDisplay]: !!this.titleDisplay ? true : false,
+    };
+  }
+  getLineCuttoff() {
+    let result;
+    if (this.ellipsisLineCutoff && this.ellipsisLineCutoff > 0) {
+      result = {
+        ['-webkit-line-clamp']: `${this.ellipsisLineCutoff}`,
+      };
+    }
+    return result;
+  }
+  get el() { return index.getElement(this); }
+};
+PtcTitle.style = ptcTitleCss;
+
+exports.most_popular_news = MostPopularNews;
+exports.ptc_badge = PtcBadge;
+exports.ptc_card_bottom = PtcCardBottom;
+exports.ptc_card_content = PtcCardContent;
+exports.ptc_card_wrapper = PtcCardPlm;
+exports.ptc_para = PtcPara;
+exports.ptc_picture = PtcPicture;
+exports.ptc_spacer = PtcSpacer;
+exports.ptc_title = PtcTitle;