@import url(https://c1-ofp.static.pub/ShareResource/DSM/DSM_2/css/variables.css); * { scroll-behavior: smooth; } .wpc-blade-container { position: relative; } .wpc-blade-container.wpc-blade-margin { margin-bottom: var(--spacing-1); margin-top: var(--spacing-1); } .wpc-blade-container picture { display: flex; overflow: hidden; } .wpc-blade-container .wpc-blade-media-border-all, .wpc-blade-container picture:has(.wpc-blade-media-border-all) { border-radius: var(--blade-br); } .wpc-blade-container .wpc-blade-content-border-all, .wpc-blade-container picture:has(.wpc-blade-content-border-all) { border-radius: var(--blade-br); } .wpc-blade-container .wpc-blade-media-border-none, .wpc-blade-container picture:has(.wpc-blade-media-border-none) { border-radius: 0; } .wpc-blade-container .wpc-blade-content-border-none, .wpc-blade-container picture:has(.wpc-blade-content-border-none) { border-radius: 0; } .wpc-blade-container .wpc-blade-media-border-right, .wpc-blade-container picture:has(.wpc-blade-media-border-right) { border-bottom-right-radius: var(--blade-br); border-top-right-radius: var(--blade-br); } .wpc-blade-container .wpc-blade-content-border-right, .wpc-blade-container picture:has(.wpc-blade-content-border-right) { border-bottom-right-radius: var(--blade-br); border-top-right-radius: var(--blade-br); } .wpc-blade-container .wpc-blade-media-border-left, .wpc-blade-container picture:has(.wpc-blade-media-border-left) { border-bottom-left-radius: var(--blade-br); border-top-left-radius: var(--blade-br); } .wpc-blade-container .wpc-blade-content-border-left, .wpc-blade-container picture:has(.wpc-blade-content-border-left) { border-bottom-left-radius: var(--blade-br); border-top-left-radius: var(--blade-br); } @media screen and (min-width: 1280px) { .wpc-blade-container .wpc-blade-desktop-bg { height: 100%; left: var(--spacing-2); position: absolute; top: 0; width: calc(100% - var(--spacing-2)); z-index: -1; } .wpc-blade-container .wpc-blade-desktop-bg-not-full-width { left: calc(var(--spacing-8) + 16px); max-width: calc(100% - var(--spacing-8) * 2 - 16px); } } @media screen and (min-width: 1920px) { .wpc-blade-container .wpc-blade-desktop-bg-not-full-width { left: calc(var(--xl-grid-margin) + 16px); max-width: calc(100% - var(--xl-grid-margin) * 2 - 16px); } } .wpc-blade-container > .MuiGrid-item > iframe, .wpc-blade-container > .MuiGrid-item > picture img { height: var(--blade-mobile-height); } @media screen and (min-width: 768px) { .wpc-blade-container > .MuiGrid-item > iframe, .wpc-blade-container > .MuiGrid-item > picture img { height: var(--blade-tablet-height); } } @media screen and (min-width: 1280px) { .wpc-blade-container.wpc-blade-container-short > .MuiGrid-item > iframe, .wpc-blade-container.wpc-blade-container-short > .MuiGrid-item > picture img { height: var(--blade-short-height); } .wpc-blade-container.wpc-blade-container-medium > .MuiGrid-item > iframe, .wpc-blade-container.wpc-blade-container-medium > .MuiGrid-item > picture img { height: var(--blade-medium-height); } .wpc-blade-container.wpc-blade-container-tall > .MuiGrid-item > iframe, .wpc-blade-container.wpc-blade-container-tall > .MuiGrid-item > picture img { height: var(--blade-tall-height); } .wpc-blade-container.wpc-blade-container-align-start { align-items: start; } .wpc-blade-container.wpc-blade-container-align-center { align-items: center; } } .wpc-blade-container .wpc-blade-content-container.MuiGrid-item { position: relative; } @media screen and (max-width: 1280px) { .wpc-blade-container .wpc-blade-content-container.MuiGrid-item { padding-bottom: var(--spacing-2)  !important; } .wpc-blade-container .wpc-blade-content-container.MuiGrid-item .wpc-wide-blade-mobile-bg { border-bottom-left-radius: var(--blade-br); border-bottom-right-radius: var(--blade-br); display: block; height: calc(100% + 8px); left: 16px; position: absolute; top: -8px; width: calc(100% - 16px); z-index: -1; } } @media screen and (min-width: 1280px) { .wpc-blade-container .wpc-blade-content-container.MuiGrid-item .wpc-blade-content-padding-left { padding-left: 48px; padding-right: 0; } .wpc-blade-container .wpc-blade-content-container.MuiGrid-item .wpc-blade-content-padding-right { padding-left: 0; padding-right: 48px; } .wpc-blade-container .wpc-blade-content-container.MuiGrid-item .wpc-blade-content-no-padding { padding-left: 0; padding-right: 0; } } .wpc-blade-container .wpc-blade-content-container.MuiGrid-item .wpc-blade-content { display: flex; flex-direction: column; } @media screen and (max-width: 1280px) { .wpc-blade-container .wpc-blade-content-container.MuiGrid-item .wpc-blade-content.wpc-blade-content-align-center { align-items: center; } .wpc-blade-container .wpc-blade-content-container.MuiGrid-item .wpc-blade-content.wpc-blade-content-align-start { align-items: start; } } .wpc-blade-container .wpc-blade-content-container.MuiGrid-item .wpc-blade-content .wpc-blade-content-logo { margin-bottom: 16px; } @media screen and (min-width: 1280px) { .wpc-blade-container .wpc-blade-content-container.MuiGrid-item .wpc-blade-content .wpc-blade-content-logo { margin-bottom: var(--spacing-5); } } .wpc-blade-container .wpc-blade-content-container.MuiGrid-item .wpc-blade-content .wpc-blade-content-headline { margin-bottom: var(--spacing-2); } .wpc-blade-container .wpc-blade-content-container.MuiGrid-item .wpc-blade-content .wpc-blade-copy { margin-bottom: var(--spacing-5); } .wpc-blade-container .wpc-blade-content-container.MuiGrid-item .wpc-blade-content .wpc-blade-copy ul { display: flex; flex-direction: column; gap: var(--li-gap); margin-left: var(--li-ml); } .wpc-typo-display-l { font-size: var(--display-l); line-height: var(--display-l-line); } .wpc-typo-display-m { font-size: var(--display-m); line-height: var(--display-m-line); } .wpc-typo-display-s { font-size: var(--display-s); line-height: var(--display-s-line); } .wpc-typo-headline-l { font-size: var(--headline-l); line-height: var(--headline-l-line); } .wpc-typo-headline-m { font-size: var(--headline-m); line-height: var(--headline-m-line); } .wpc-typo-headline-s { font-size: var(--headline-s); line-height: var(--headline-s-line); } .wpc-typo-title-l { font-size: var(--title-l); line-height: var(--title-l-line); } .wpc-typo-title-m { font-size: var(--title-m); line-height: var(--title-m-line); } .wpc-typo-title-s { font-size: var(--title-s); line-height: var(--title-s-line); } .wpc-typo-title-xs { font-size: var(--title-xs); line-height: var(--title-xs-line); } .wpc-typo-body-l { font-size: var(--body-l); line-height: var(--body-l-line); } .wpc-typo-body-m { font-size: var(--body-m); line-height: var(--body-m-line); } .wpc-typo-body-s { font-size: var(--body-s); line-height: var(--body-s-line); } .wpc-typo-label-s { font-size: var(--label-s); line-height: var(--label-s-line); } .wpc-navbaritem-chip { align-items: center; background-color: var(--alternate-pale); border: 1px solid var(--alternate-light); border-radius: var(--chip-br); display: flex; gap: var(--chip-gap); justify-content: center; margin: 0; padding: var(--spacing-1); } .wpc-navbaritem-chip:hover { cursor: pointer; } .wpc-navbaritem-chip.wpc-navbaritem-active, .wpc-navbaritem-chip:focus, .wpc-navbaritem-chip:hover { background-color: var(--alternate-med); border: 1px solid var(--alternate-med); } .wpc-navbaritem-chip.wpc-navbaritem-active .wpc-navbaritem-text, .wpc-navbaritem-chip:focus .wpc-navbaritem-text, .wpc-navbaritem-chip:hover .wpc-navbaritem-text { color: var(--pure-light)  !important; } .wpc-navbaritem-chip.wpc-navbaritem-active .wpc-icon.hover-dark-to-alternate-med, .wpc-navbaritem-chip:focus .wpc-icon.hover-dark-to-alternate-med, .wpc-navbaritem-chip:hover .wpc-icon.hover-dark-to-alternate-med { filter: invert(24%) sepia(65%) saturate(1411%) hue-rotate(197deg) brightness(90%) contrast(87%); } .wpc-navbaritem-chip.wpc-navbaritem-active .wpc-icon.hover-light-to-alternate-med, .wpc-navbaritem-chip:focus .wpc-icon.hover-light-to-alternate-med, .wpc-navbaritem-chip:hover .wpc-icon.hover-light-to-alternate-med { filter: brightness(0) saturate(100%) invert(22%) sepia(41%) saturate(2411%) hue-rotate(200deg) brightness(97%) contrast(86%); } .wpc-navbaritem-chip.wpc-navbaritem-active .wpc-icon.hover-auxiliary, .wpc-navbaritem-chip:focus .wpc-icon.hover-auxiliary, .wpc-navbaritem-chip:hover .wpc-icon.hover-auxiliary { filter: brightness(0) saturate(100%) invert(95%) sepia(89%) saturate(7500%) hue-rotate(103deg) brightness(101%) contrast(103%); } .wpc-navbaritem-chip.wpc-navbaritem-active .wpc-icon.hover-pure-dark, .wpc-navbaritem-chip.wpc-navbaritem-active .wpc-icon.hover-pure-light, .wpc-navbaritem-chip:focus .wpc-icon.hover-pure-dark, .wpc-navbaritem-chip:focus .wpc-icon.hover-pure-light, .wpc-navbaritem-chip:hover .wpc-icon.hover-pure-dark, .wpc-navbaritem-chip:hover .wpc-icon.hover-pure-light { filter: invert(100%); } .wpc-navbaritem { align-items: center; color: var(--pure-dark); display: flex; flex-direction: column; gap: var(--spacing-1); height: 100%; justify-content: normal; padding-bottom: var(--spacing-2); position: relative; text-align: center; } .wpc-navbaritem:focus, .wpc-navbaritem:hover { cursor: pointer; } .wpc-navbaritem:focus .wpc-navbaritem-text, .wpc-navbaritem:hover .wpc-navbaritem-text { color: var(--alternate-med)  !important; } .wpc-navbaritem:focus .wpc-icon.hover-dark-to-alternate-med, .wpc-navbaritem:hover .wpc-icon.hover-dark-to-alternate-med { filter: invert(24%) sepia(65%) saturate(1411%) hue-rotate(197deg) brightness(90%) contrast(87%); } .wpc-navbaritem:focus .wpc-icon.hover-light-to-alternate-med, .wpc-navbaritem:hover .wpc-icon.hover-light-to-alternate-med { filter: brightness(0) saturate(100%) invert(22%) sepia(41%) saturate(2411%) hue-rotate(200deg) brightness(97%) contrast(86%); } .wpc-navbaritem:focus .wpc-icon.hover-auxiliary, .wpc-navbaritem:hover .wpc-icon.hover-auxiliary { filter: brightness(0) saturate(100%) invert(95%) sepia(89%) saturate(7500%) hue-rotate(103deg) brightness(101%) contrast(103%); } .wpc-navbaritem:focus .wpc-icon.hover-pure-dark, .wpc-navbaritem:focus .wpc-icon.hover-pure-light, .wpc-navbaritem:hover .wpc-icon.hover-pure-dark, .wpc-navbaritem:hover .wpc-icon.hover-pure-light { filter: invert(100%); } .wpc-navbaritem:after { background-color: var(--alternate-med); bottom: 0; content: ""; height: var(--navbaritem-active-bh); left: 0; position: absolute; transform: scaleX(0); transform-origin: bottom left; transition: transform var(--transition-duration) ease-out; width: 100%; } .wpc-navbaritem.wpc-navbaritem-active { height: 100%; } .wpc-navbaritem.wpc-navbaritem-active .wpc-navbaritem-text { color: var(--alternate-med)  !important; } .wpc-navbaritem.wpc-navbaritem-active:after { transform: scaleX(1); transform-origin: bottom left; } .wpc-navbaritem.wpc-navbaritem-active .wpc-icon.hover-dark-to-alternate-med { filter: invert(24%) sepia(65%) saturate(1411%) hue-rotate(197deg) brightness(90%) contrast(87%); } .wpc-navbaritem.wpc-navbaritem-active .wpc-icon.hover-light-to-alternate-med { filter: brightness(0) saturate(100%) invert(22%) sepia(41%) saturate(2411%) hue-rotate(200deg) brightness(97%) contrast(86%); } .wpc-navbaritem.wpc-navbaritem-active .wpc-icon.hover-auxiliary { filter: brightness(0) saturate(100%) invert(95%) sepia(89%) saturate(7500%) hue-rotate(103deg) brightness(101%) contrast(103%); } .wpc-navbaritem.wpc-navbaritem-active .wpc-icon.hover-pure-dark, .wpc-navbaritem.wpc-navbaritem-active .wpc-icon.hover-pure-light { filter: invert(100%); } .wpc-navbaritem.wpc-navbaritem-active:hover { cursor: pointer; } .wpc-navbaritem.wpc-navbaritem-active:hover .wpc-icon.hover-dark-to-alternate-med { filter: invert(24%) sepia(65%) saturate(1411%) hue-rotate(197deg) brightness(90%) contrast(87%); } .wpc-navbaritem.wpc-navbaritem-active:hover .wpc-icon.hover-light-to-alternate-med { filter: brightness(0) saturate(100%) invert(22%) sepia(41%) saturate(2411%) hue-rotate(200deg) brightness(97%) contrast(86%); } .wpc-navbaritem.wpc-navbaritem-active:hover .wpc-icon.hover-auxiliary { filter: brightness(0) saturate(100%) invert(95%) sepia(89%) saturate(7500%) hue-rotate(103deg) brightness(101%) contrast(103%); } .wpc-navbaritem.wpc-navbaritem-active:hover .wpc-icon.hover-pure-dark, .wpc-navbaritem.wpc-navbaritem-active:hover .wpc-icon.hover-pure-light { filter: invert(100%); } .wpc-navbaritem-text { font-size: var(--label-s); font-weight: 700; line-height: var(--label-s-line); } @media screen and (min-width: 768px) { .wpc-navbaritem-text { font-size: var(--body-s); line-height: var(--body-s-line); } } .wpc-navbartextitem-chip { border-radius: var(--chip-br); } .wpc-navbartextitem-chip.wpc-navbartextitem-active { color: var(--pure-light); } .wpc-navbartextitem { align-items: center; color: var(--text-black); color: var(--neutral-med-dark); display: flex; flex-direction: column; font-size: var(--body-l); height: 100%; justify-content: normal; line-height: var(--body-l-line); padding-bottom: var(--spacing-2); position: relative; text-align: center; text-decoration: none; transition: var(--transition-duration) ease; } .wpc-navbartextitem:hover { color: var(--alternate-med)  !important; cursor: pointer; } .wpc-navbartextitem:after { background-color: var(--alternate-med); bottom: 0; content: ""; height: var(--navbaritem-active-bh); left: 0; position: absolute; transform: scaleX(0); transform-origin: bottom left; transition: transform var(--transition-duration) ease-out; width: 100%; } .wpc-navbartextitem.wpc-navbartextitem-active { color: var(--alternate-med)  !important; height: 100%; } .wpc-navbartextitem.wpc-navbartextitem-active:after { transform: scaleX(1); transform-origin: bottom left; } .wpc-navbartextitem.wpc-navbartextitem-active:hover { cursor: pointer; } .wpc-navbartextitem-chip { align-items: center; background-color: var(--alternate-pale); border: 1px solid var(--alternate-light); border-radius: 16px; display: flex; gap: var(--chip-gap); justify-content: center; margin: 0; padding: var(--spacing-1); } .wpc-navbartextitem-chip:hover { cursor: pointer; } .wpc-navbartextitem-chip.wpc-navbartextitem-active { background-color: var(--alternate-med); border: 1px solid var(--alternate-med); color: var(--pure-light)  !important; } .wpc-horizontal-scroll > ::-webkit-scrollbar { display: none; } .wpc-horizontal-scroll > * { scrollbar-width: none; } .wpc-horizontal-scroll > .MuiGrid-container { align-items: stretch  !important; flex-wrap: nowrap; overflow-x: scroll; } .wpc-horizontal-scroll > .MuiGrid-container > .MuiGrid-item { flex-shrink: 0; } .wpc-wrap > .MuiGrid-container { flex-wrap: wrap; } .wpc-no-pointer-events { pointer-events: none; } .wpc-no-row-reverse .MuiGrid-container { flex-direction: row  !important; } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xs-1 { max-width: calc(25% - var(--spacing-2) / 4); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xs-2 { max-width: calc(50% - var(--spacing-2) / 2); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xs-3 { max-width: calc(75% - var(--spacing-2) / 1.33333); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xs-4 { max-width: calc(100% - var(--spacing-2) / 1); } @media screen and (min-width: 360px) { .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-sm-1, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xs-1 { max-width: calc(25% - var(--spacing-2) / 4); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-sm-2, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xs-2 { max-width: calc(50% - var(--spacing-2) / 2); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-sm-3, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xs-3 { max-width: calc(75% - var(--spacing-2) / 1.33333); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-sm-4, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xs-4 { max-width: calc(100% - var(--spacing-2) / 1); } } @media screen and (min-width: 768px) { .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-md-1, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-sm-1, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xs-1 { max-width: calc(12.5% - var(--spacing-2) / 8); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-md-2, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-sm-2, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xs-2 { max-width: calc(25% - var(--spacing-2) / 4); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-md-3, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-sm-3, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xs-3 { max-width: calc(37.5% - var(--spacing-2) / 2.66667); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-md-4, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-sm-4, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xs-4 { max-width: calc(50% - var(--spacing-2) / 2); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-md-5 { max-width: calc(62.5% - var(--spacing-2) / 1.6); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-md-6 { max-width: calc(75% - var(--spacing-2) / 1.33333); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-md-7 { max-width: calc(87.5% - var(--spacing-2) / 1.14286); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-md-8 { max-width: calc(100% - var(--spacing-2) / 1); } } @media screen and (min-width: 1280px) { .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-md-1, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-sm-1, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xs-1 { max-width: calc(8.33333% - var(--spacing-2) / 12); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-md-2, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-sm-2, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xs-2 { max-width: calc(16.66667% - var(--spacing-2) / 6); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-md-3, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-sm-3, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xs-3 { max-width: calc(25% - var(--spacing-2) / 4); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-md-4, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-sm-4, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xs-4 { max-width: calc(33.33333% - var(--spacing-2) / 3); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-md-5 { max-width: calc(41.66667% - var(--spacing-2) / 2.4); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-md-6 { max-width: calc(50% - var(--spacing-2) / 2); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-md-7 { max-width: calc(58.33333% - var(--spacing-2) / 1.71429); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-md-8 { max-width: calc(66.66667% - var(--spacing-2) / 1.5); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-lg-1, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xl-1 { max-width: calc(8.33333% - var(--spacing-2) / 12); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-lg-2, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xl-2 { max-width: calc(16.66667% - var(--spacing-2) / 6); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-lg-3, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xl-3 { max-width: calc(25% - var(--spacing-2) / 4); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-lg-4, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xl-4 { max-width: calc(33.33333% - var(--spacing-2) / 3); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-lg-5, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xl-5 { max-width: calc(41.66667% - var(--spacing-2) / 2.4); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-lg-6, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xl-6 { max-width: calc(50% - var(--spacing-2) / 2); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-lg-7, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xl-7 { max-width: calc(58.33333% - var(--spacing-2) / 1.71429); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-lg-8, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xl-8 { max-width: calc(66.66667% - var(--spacing-2) / 1.5); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-lg-9, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xl-9 { max-width: calc(75% - var(--spacing-2) / 1.33333); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-lg-10, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xl-10 { max-width: calc(83.33333% - var(--spacing-2) / 1.2); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-lg-11, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xl-11 { max-width: calc(91.66667% - var(--spacing-2) / 1.09091); } .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-lg-12, .wpc-horizontal-scroll-resizing > .MuiGrid-container > .MuiGrid-item.MuiGrid-grid-xl-12 { max-width: calc(100% - var(--spacing-2) / 1); } } @media screen and (max-width: 1280px) { .wpc-horizontal-scroll .wpc-blade-container { padding-left: 0; padding-right: 0; } .wpc-horizontal-scroll .wpc-blade-container .wpc-blade-content-no-padding { padding-left: 0; } .wpc-horizontal-scroll .wpc-blade-container .MuiGrid-item { max-width: unset  !important; } } .wpc-actioncontainer-function, .wpc-actioncontainer-url { color: inherit; cursor: pointer; margin: 0; padding: 0; text-decoration: none; width: 100%; } .wpc-actioncontainer-function:active, .wpc-actioncontainer-function:hover, .wpc-actioncontainer-url:active, .wpc-actioncontainer-url:hover { color: inherit; text-decoration: none; } button.wpc-actioncontainer-function { background: 0; border: 0; } .wpc-carousel-single, .wpc-carousel-single .wpc-carousel-item-outer-container { width: 100%; } .wpc-carousel { position: relative; } .wpc-carousel .wpc-carousel-arrow-outer-container { position: absolute; top: 50%; transform: translateY(-50%); } .wpc-carousel .wpc-carousel-arrow-outer-container .MuiGrid-item { padding-top: 0; } @media screen and (min-width: 1920px) { .wpc-carousel .wpc-carousel-arrow-outer-container .MuiGrid-item { padding-left: var(--spacing-1); } } .wpc-carousel .wpc-carousel-arrow-outer-container .wpc-carousel-arrow-inner-container { position: relative; } .wpc-carousel .wpc-carousel-arrow-outer-container .wpc-carousel-arrow-inner-container .wpc-carousel-arrow { align-items: center; background-color: var(--pure-dark); border-radius: 50%; cursor: pointer; display: flex; height: var(--spacing-7); justify-content: center; transition: all var(--transition-duration) ease; width: var(--spacing-7); } .wpc-carousel .wpc-carousel-arrow-outer-container .wpc-carousel-arrow-inner-container .wpc-carousel-arrow.wpc-carousel-arrow-left span { border-left: 2px solid var(--pure-light); border-top: 2px solid var(--pure-light); height: 10px; transform: rotate(-45deg) translate(15%, 15%); width: 10px; } .wpc-carousel .wpc-carousel-arrow-outer-container .wpc-carousel-arrow-inner-container .wpc-carousel-arrow.wpc-carousel-arrow-right span { border-left: 2px solid var(--pure-light); border-top: 2px solid var(--pure-light); height: 10px; transform: rotate(135deg) translate(15%, 15%); width: 10px; } .wpc-carousel .wpc-carousel-arrow-outer-container .wpc-carousel-arrow-inner-container .wpc-carousel-arrow.wpc-carousel-arrow-dark { background-color: var(--pure-light); } .wpc-carousel .wpc-carousel-arrow-outer-container .wpc-carousel-arrow-inner-container .wpc-carousel-arrow.wpc-carousel-arrow-dark.wpc-carousel-arrow-left span, .wpc-carousel .wpc-carousel-arrow-outer-container .wpc-carousel-arrow-inner-container .wpc-carousel-arrow.wpc-carousel-arrow-dark.wpc-carousel-arrow-right span { border-left: 2px solid var(--neutral-dark); border-top: 2px solid var(--neutral-dark); } .wpc-carousel .wpc-carousel-arrow-outer-container .wpc-carousel-arrow-inner-container .wpc-carousel-arrow-disabled { background-color: var(--neutral-med-pale); } .wpc-carousel .wpc-carousel-arrow-outer-container .wpc-carousel-arrow-inner-container .wpc-carousel-arrow-disabled.wpc-carousel-arrow-left span, .wpc-carousel .wpc-carousel-arrow-outer-container .wpc-carousel-arrow-inner-container .wpc-carousel-arrow-disabled.wpc-carousel-arrow-right span { border-left: 2px solid var(--pure-dark); border-top: 2px solid var(--pure-dark); } .wpc-carousel .wpc-carousel-arrow-outer-container .wpc-carousel-arrow-inner-container .wpc-carousel-arrow-disabled.wpc-carousel-arrow-dark { background-color: var(--neutral-med); } .wpc-carousel .wpc-carousel-arrow-outer-container .wpc-carousel-arrow-inner-container .wpc-carousel-arrow-disabled.wpc-carousel-arrow-dark.wpc-carousel-arrow-left span, .wpc-carousel .wpc-carousel-arrow-outer-container .wpc-carousel-arrow-inner-container .wpc-carousel-arrow-disabled.wpc-carousel-arrow-dark.wpc-carousel-arrow-right span { border-left: 2px solid var(--neutral-med-dark); border-top: 2px solid var(--neutral-med-dark); } .wpc-carousel .wpc-carousel-arrow-outer-container .wpc-carousel-arrow-inner-container .wpc-carousel-arrow-right { position: absolute; right: 0; } .wpc-carousel .wpc-carousel-item-outer-container { margin-right: calc(var(--spacing-8) + var(--spacing-7) + var(--spacing-2)); overflow-x: hidden; width: 100%; } @media screen and (min-width: 1920px) { .wpc-carousel .wpc-carousel-item-outer-container { margin-right: calc( var(--xl-grid-margin) + var(--spacing-7) + var(--spacing-2) ); } } .wpc-carousel .wpc-carousel-item-outer-container .wpc-carousel-item-container { flex-wrap: nowrap; margin-left: calc(var(--spacing-8) + var(--spacing-7)); overflow-x: hidden; padding-bottom: var(--spacing-2); padding-left: 0; padding-right: calc(var(--spacing-8) + var(--spacing-7) + var(--spacing-2)); } @media screen and (min-width: 1920px) { .wpc-carousel .wpc-carousel-item-outer-container .wpc-carousel-item-container { margin-left: calc( var(--xl-grid-margin) + var(--spacing-7) - var(--spacing-2) ); padding-right: calc(var(--xl-grid-margin) + var(--spacing-7)); } } .wpc-carousel .wpc-carousel-item-outer-container .wpc-carousel-item-container .MuiGrid-item { flex-shrink: 0; max-width: 100%; transition: transform var(--second-transition-duration) ease; } .wpc-carousel .wpc-carousel-item-outer-container .wpc-carousel-item-container .wpc-blade-container { padding-left: 0; } .wpc-carousel .wpc-carousel-dot-container { margin-top: 0; padding-left: calc( var(--spacing-8) + var(--spacing-7) + var(--spacing-2) * 2 ); padding-right: calc(var(--spacing-8) + var(--spacing-7) + var(--spacing-2)); } @media screen and (min-width: 1920px) { .wpc-carousel .wpc-carousel-dot-container { padding-left: calc( var(--xl-grid-margin) + var(--spacing-7) + var(--spacing-2) ); padding-right: calc( var(--xl-grid-margin) + var(--spacing-7) + var(--spacing-2) ); } } .wpc-carousel .wpc-carousel-dot-container .wpc-carousel-dot { background-color: var(--pure-light); border: 1px solid var(--neutral-med); border-radius: 50%; cursor: pointer; height: var(--spacing-2); margin-left: calc(var(--spacing-1) / 2); margin-right: calc(var(--spacing-1) / 2); transition: background-color var(--transition-duration) ease; width: var(--spacing-2); } .wpc-carousel .wpc-carousel-dot-container .wpc-carousel-dot-active { background-color: var(--pure-dark); } .wpc-carousel .wpc-carousel-dot-container.wpc-carousel-dot-container-dark .wpc-carousel-dot { background-color: var(--neutral-med-dark); border: 1px solid var(--pure-light); } .wpc-carousel .wpc-carousel-dot-container.wpc-carousel-dot-container-dark .wpc-carousel-dot-active { background-color: var(--pure-light); } .wpc-card { display: flex; flex-direction: column; height: 100%; overflow: hidden; position: relative; } .wpc-card:hover :not( .wpc-actioncontainer-url .wpc-icon, .wpc-actioncontainer-function .wpc-icon ).hover-dark-to-alternate-med { filter: invert(24%) sepia(65%) saturate(1411%) hue-rotate(197deg) brightness(90%) contrast(87%); } .wpc-card:hover :not( .wpc-actioncontainer-url .wpc-icon, .wpc-actioncontainer-function .wpc-icon ).hover-light-to-alternate-med { filter: brightness(0) saturate(100%) invert(22%) sepia(41%) saturate(2411%) hue-rotate(200deg) brightness(97%) contrast(86%); } .wpc-card:hover :not( .wpc-actioncontainer-url .wpc-icon, .wpc-actioncontainer-function .wpc-icon ).hover-auxiliary { filter: brightness(0) saturate(100%) invert(95%) sepia(89%) saturate(7500%) hue-rotate(103deg) brightness(101%) contrast(103%); } .wpc-card:hover :not( .wpc-actioncontainer-url .wpc-icon, .wpc-actioncontainer-function .wpc-icon ).hover-pure-dark, .wpc-card:hover :not( .wpc-actioncontainer-url .wpc-icon, .wpc-actioncontainer-function .wpc-icon ).hover-pure-light { filter: invert(100%); } .wpc-card-bordered { border: var(--card-bw) solid var(--neutral-med-pale); } .wpc-card-rounded { border-radius: var(--card-br-mobile); } @media screen and (min-width: 1280px) { .wpc-card-rounded { border-radius: var(--card-br); } } .wpc-card-background-pure-light { background-color: var(--pure-light); } .wpc-card-background-light { background-color: var(--neutral-pale); } .wpc-card-background-gaming { background-color: var(--neutral-med-dark); border: 0; } .wpc-container-accordion { background-color: transparent; overflow: hidden; } .wpc-container-accordion .wpc-accordion-icon.wpc-accordion-icon-active { transform: rotate(180deg); } .wpc-container-accordion .wpc-accordion-icon.wpc-accordion-icon-inactive { transform: rotate(0deg); } .wpc-container-accordion .wpc-accordion-icon-light { filter: invert(1); } button.wpc-accordion-primary { border: 0; border-bottom: 1px solid #ccc; flex-direction: column; margin: 0; overflow: hidden; padding: var(--spacing-5) 0 var(--spacing-1); } button.wpc-accordion-primary, button.wpc-accordion-primary .wpc-headline { display: flex  !important; display: -ms-flexbox; display: -webkit-flex; width: 100%; } button.wpc-accordion-primary .wpc-headline { justify-content: space-between; text-align: left; } @media screen and (min-width: 1280px) { button.wpc-accordion-primary .wpc-headline { padding: 0 var(--spacing-3); } } button.wpc-accordion-primary .wpc-headline:hover { cursor: pointer; } button.wpc-accordion-primary .wpc-headline h2, button.wpc-accordion-primary .wpc-headline h3, button.wpc-accordion-primary .wpc-headline h4, button.wpc-accordion-primary .wpc-headline h5, button.wpc-accordion-primary .wpc-headline h6 { font-weight: var(--bold); padding: 0; } button.wpc-accordion-primary .wpc-headline img { transition: all var(--transition-duration) ease; } .wpc-accordion-body { display: flex; flex-direction: column; height: auto; margin: 0; margin-top: calc((var(--spacing-2)) * -1); overflow: hidden; padding: 0; text-align: left; -webkit-transition: all var(--second-transition-duration) ease; -moz-transition: all var(--second-transition-duration) ease; -o-transition: all var(--second-transition-duration) ease; -ms-transition: all var(--second-transition-duration) ease; transition: all var(--second-transition-duration) ease; } .wpc-accordion-body li, .wpc-accordion-body p { font-weight: var(--regular); margin: 0; padding: var(--spacing-2) 0 var(--spacing-2); } @media screen and (min-width: 1280px) { .wpc-accordion-body li, .wpc-accordion-body p { padding: var(--spacing-3); } } .wpc-brand-card { padding: var(--spacing-2); } .wpc-espot-horizontal-card { border-radius: var(--card-br-mobile); position: relative; } @media screen and (min-width: 1280px) { .wpc-espot-horizontal-card { border-radius: var(--card-br); min-height: var(--card-espot-hor-h); } } .wpc-espot-horizontal-card .wpc-espot-horizontal-card-image { width: 100%  !important; } .wpc-espot-horizontal-card .wpc-espot-horizontal-card-textcontainer { background-color: var(--pure-dark); bottom: var(--spacing-2); left: var(--spacing-2); padding: var(--spacing-3); position: absolute  !important; width: calc(100% - var(--spacing-6))  !important; } @media screen and (min-width: 768px) { .wpc-espot-horizontal-card .wpc-espot-horizontal-card-textcontainer { left: 0; min-height: var(--card-espot-hor-text-h); position: relative  !important; width: 100%  !important; } } .wpc-espot-horizontal-card .wpc-espot-horizontal-card-textcontainer .wpc-espot-horizontal-card-logo { margin-bottom: var(--spacing-1); } .wpc-espot-hover-card { border-radius: var(--card-br-mobile); display: block; height: 415px; overflow: hidden; position: relative; } @media screen and (min-width: 1280px) { .wpc-espot-hover-card { border-radius: var(--card-br); } } .wpc-espot-hover-card .wpc-espot-hover-card-img { border-radius: var(--card-br-mobile); height: 100%; position: absolute; } @media screen and (min-width: 1280px) { .wpc-espot-hover-card .wpc-espot-hover-card-img { border-radius: var(--card-br); } } .wpc-espot-hover-card .wpc-espot-hover-card-content { background-color: #000; border-radius: var(--card-br-mobile); bottom: 0; display: flex; flex-direction: column; gap: var(--spacing-1); padding: var(--spacing-2); position: absolute; width: 100%; } @media screen and (min-width: 1280px) { .wpc-espot-hover-card .wpc-espot-hover-card-content { background-color: rgba(0, 0, 0, .7); border-radius: var(--card-br); } } .wpc-espot-hover-card .wpc-espot-hover-card-content .wpc-espot-hover-card-icon { margin: 0 auto; } .wpc-espot-hover-card .wpc-espot-hover-card-content .wpc-espot-hover-card-cta { height: auto  !important; } .wpc-espot-hover-card .wpc-espot-hover-card-content .wpc-espot-hover-card-cta:hover { text-decoration: underline; } @media screen and (max-width: 1279px) { .wpc-espot-hover-card.wpc-espot-hover-card-mobile-small { height: 155px; } .wpc-espot-hover-card.wpc-espot-hover-card-mobile-small .wpc-espot-hover-card-content { background-color: rgba(0, 0, 0, .7); height: 100%; justify-content: center; width: 100%; } .wpc-espot-hover-card.wpc-espot-hover-card-mobile-small .wpc-espot-hover-card-content .wpc-espot-hover-card-cta, .wpc-espot-hover-card.wpc-espot-hover-card-mobile-small .wpc-espot-hover-card-content .wpc-espot-hover-card-title { display: none; } } @media screen and (min-width: 1280px) { .wpc-espot-hover-card-content { height: 35%; justify-content: center; transition: height var(--transition-duration) ease; } .wpc-espot-hover-card-content .wpc-espot-hover-card-copy { height: unset  !important; } .wpc-espot-hover-card-content .wpc-espot-hover-card-copy, .wpc-espot-hover-card-content .wpc-espot-hover-card-cta { display: none; } .wpc-espot-hover-card:hover .wpc-espot-hover-card-content { height: 70%; } .wpc-espot-hover-card:hover .wpc-espot-hover-card-content .wpc-espot-hover-card-icon { display: none  !important; } .wpc-espot-hover-card:hover .wpc-espot-hover-card-content .wpc-espot-hover-card-copy, .wpc-espot-hover-card:hover .wpc-espot-hover-card-content .wpc-espot-hover-card-cta { display: block; } } .wpc-espot-vertical-card .wpc-espot-vertical-card-image { width: 100%  !important; } .wpc-espot-vertical-card .wpc-espot-vertical-card-light { background-color: var(--neutral-pale); } .wpc-espot-vertical-card .wpc-espot-vertical-card-dark { background-color: var(--pure-dark); } .wpc-espot-vertical-card .wpc-espot-vertical-card-pure-light { background-color: var(--pure-light); border: 1px solid var(--neutral-med-pale); } .wpc-espot-vertical-card .wpc-espot-vertical-card-textcontainer { padding: var(--spacing-3); } .wpc-espot-vertical-card .wpc-espot-vertical-card-textcontainer .wpc-espot-vertical-card-divider { display: none; } @media (min-width: 768px) { .wpc-espot-vertical-card .wpc-espot-vertical-card-textcontainer .wpc-espot-vertical-card-divider { display: block; margin: var(--spacing-2) 0 var(--spacing-2); width: 100%  !important; } } .wpc-espot-vertical-card .wpc-espot-vertical-card-textcontainer .wpc-espot-vertical-card-logo { display: none; max-width: 200px; } @media (min-width: 768px) { .wpc-espot-vertical-card .wpc-espot-vertical-card-textcontainer .wpc-espot-vertical-card-logo { display: block  !important; } } .wpc-espot-vertical-card .wpc-espot-vertical-card-textcontainer .wpc-espot-vertical-card-title { margin-bottom: var(--spacing-1); } .wpc-ctabutton-animate { display: block; width: fit-content; } .wpc-actioncontainer-function:hover .wpc-icon, .wpc-actioncontainer-url:hover .wpc-icon { transition: none; } .wpc-actioncontainer-function:hover .wpc-icon.hover-dark-to-alternate-med, .wpc-actioncontainer-url:hover .wpc-icon.hover-dark-to-alternate-med { filter: invert(24%) sepia(65%) saturate(1411%) hue-rotate(197deg) brightness(90%) contrast(87%); } .wpc-actioncontainer-function:hover .wpc-icon.hover-light-to-alternate-med, .wpc-actioncontainer-url:hover .wpc-icon.hover-light-to-alternate-med { filter: brightness(0) saturate(100%) invert(22%) sepia(41%) saturate(2411%) hue-rotate(200deg) brightness(97%) contrast(86%); } .wpc-actioncontainer-function:hover .wpc-icon.hover-auxiliary, .wpc-actioncontainer-url:hover .wpc-icon.hover-auxiliary { filter: brightness(0) saturate(100%) invert(95%) sepia(89%) saturate(7500%) hue-rotate(103deg) brightness(101%) contrast(103%); } .wpc-actioncontainer-function:hover .wpc-icon.hover-pure-dark, .wpc-actioncontainer-function:hover .wpc-icon.hover-pure-light, .wpc-actioncontainer-url:hover .wpc-icon.hover-pure-dark, .wpc-actioncontainer-url:hover .wpc-icon.hover-pure-light { filter: invert(100%); } .wpc-actioncontainer-function.wpc-ctabutton-primary, .wpc-actioncontainer-url.wpc-ctabutton-primary { align-items: center; background-color: var(--alternate-med); border: 1px solid var(--alternate-med); border-radius: var(--btn-br-mobile); color: var(--pure-light); cursor: pointer; display: flex; flex-grow: 0; flex-shrink: 0; font-size: var(--body-m); font-weight: var(--bold); gap: var(--spacing-1); justify-content: center; line-height: 1; padding: 15px 23px; text-align: center; text-decoration: none; transition: all ease-out var(--transition-duration), color ease-out var(--transition-duration); white-space: nowrap; width: fit-content; } @media screen and (min-width: 1280px) { .wpc-actioncontainer-function.wpc-ctabutton-primary, .wpc-actioncontainer-url.wpc-ctabutton-primary { border-radius: var(--btn-br); } } .wpc-actioncontainer-function.wpc-ctabutton-primary:hover, .wpc-actioncontainer-url.wpc-ctabutton-primary:hover { background-color: var(--alternate-pale); color: var(--alternate-med); } .wpc-actioncontainer-function.wpc-ctabutton-secondary, .wpc-actioncontainer-url.wpc-ctabutton-secondary { align-items: center; background-color: var(--pure-light); border: 1px solid var(--alternate-med); border-radius: var(--btn-br-mobile); color: var(--alternate-med); cursor: pointer; display: flex; flex-grow: 0; flex-shrink: 0; font-size: var(--body-m); font-weight: var(--bold); gap: var(--spacing-1); justify-content: center; line-height: 1; padding: 15px 23px; text-align: center; text-decoration: none; transition: all ease-out var(--transition-duration), color ease-out var(--transition-duration); white-space: nowrap; width: fit-content; } @media screen and (min-width: 1280px) { .wpc-actioncontainer-function.wpc-ctabutton-secondary, .wpc-actioncontainer-url.wpc-ctabutton-secondary { border-radius: var(--btn-br); } } .wpc-actioncontainer-function.wpc-ctabutton-secondary:hover, .wpc-actioncontainer-url.wpc-ctabutton-secondary:hover { background-color: var(--alternate-pale); color: var(--alternate-med); } .wpc-actioncontainer-function.wpc-ctabutton-cto-primary, .wpc-actioncontainer-url.wpc-ctabutton-cto-primary { align-items: center; background-color: var(--pure-dark); border: 1px solid var(--pure-dark); border-radius: var(--btn-br-mobile); color: var(--pure-light); cursor: pointer; display: flex; flex-grow: 0; flex-shrink: 0; font-size: var(--body-m); font-weight: var(--bold); gap: var(--spacing-1); justify-content: center; line-height: 1; padding: 15px 23px; text-align: center; text-decoration: none; transition: all ease-out var(--transition-duration), color ease-out var(--transition-duration); white-space: nowrap; width: fit-content; } @media screen and (min-width: 1280px) { .wpc-actioncontainer-function.wpc-ctabutton-cto-primary, .wpc-actioncontainer-url.wpc-ctabutton-cto-primary { border-radius: var(--btn-br); } } .wpc-actioncontainer-function.wpc-ctabutton-cto-primary:hover, .wpc-actioncontainer-url.wpc-ctabutton-cto-primary:hover { background-color: var(--pure-light); color: var(--pure-dark); } .wpc-actioncontainer-function.wpc-ctabutton-merchandising-dark, .wpc-actioncontainer-url.wpc-ctabutton-merchandising-dark { align-items: center; background-color: var(--pure-dark); border: 1px solid var(--pure-light); border-radius: var(--btn-br-mobile); color: var(--pure-light); cursor: pointer; display: flex; flex-grow: 0; flex-shrink: 0; font-size: var(--body-m); font-weight: var(--bold); gap: var(--spacing-1); justify-content: center; line-height: 1; padding: 15px 23px; text-align: center; text-decoration: none; transition: all ease-out var(--transition-duration), color ease-out var(--transition-duration); white-space: nowrap; width: fit-content; } @media screen and (min-width: 1280px) { .wpc-actioncontainer-function.wpc-ctabutton-merchandising-dark, .wpc-actioncontainer-url.wpc-ctabutton-merchandising-dark { border-radius: var(--btn-br); } } .wpc-actioncontainer-function.wpc-ctabutton-merchandising-dark:hover, .wpc-actioncontainer-url.wpc-ctabutton-merchandising-dark:hover { background-color: var(--neutral-med-pale); border: 1px solid var(--pure-dark); color: var(--pure-dark); } .wpc-actioncontainer-function.wpc-ctabutton-merchandising-light, .wpc-actioncontainer-url.wpc-ctabutton-merchandising-light { align-items: center; background-color: var(--pure-light); border: 1px solid var(--pure-dark); border-radius: var(--btn-br-mobile); color: var(--pure-dark); cursor: pointer; display: flex; flex-grow: 0; flex-shrink: 0; font-size: var(--body-m); font-weight: var(--bold); gap: var(--spacing-1); justify-content: center; line-height: 1; padding: 15px 23px; text-align: center; text-decoration: none; transition: all ease-out var(--transition-duration), color ease-out var(--transition-duration); white-space: nowrap; width: fit-content; } @media screen and (min-width: 1280px) { .wpc-actioncontainer-function.wpc-ctabutton-merchandising-light, .wpc-actioncontainer-url.wpc-ctabutton-merchandising-light { border-radius: var(--btn-br); } } .wpc-actioncontainer-function.wpc-ctabutton-merchandising-light:hover, .wpc-actioncontainer-url.wpc-ctabutton-merchandising-light:hover { background-color: var(--pure-dark); border: 1px solid var(--pure-light); color: var(--pure-light); } .wpc-actioncontainer-function.wpc-ctabutton-homepage, .wpc-actioncontainer-url.wpc-ctabutton-homepage { align-items: center; background-color: var(--alternate-med); border: 1px solid var(--pure-light); border-radius: var(--btn-br-mobile); color: var(--pure-light); cursor: pointer; display: flex; flex-grow: 0; flex-shrink: 0; font-size: var(--body-m); font-weight: var(--bold); gap: var(--spacing-1); justify-content: center; line-height: 1; padding: 15px 23px; text-align: center; text-decoration: none; transition: all ease-out var(--transition-duration), color ease-out var(--transition-duration); white-space: nowrap; width: fit-content; } @media screen and (min-width: 1280px) { .wpc-actioncontainer-function.wpc-ctabutton-homepage, .wpc-actioncontainer-url.wpc-ctabutton-homepage { border-radius: var(--btn-br); } } .wpc-actioncontainer-function.wpc-ctabutton-homepage:hover, .wpc-actioncontainer-url.wpc-ctabutton-homepage:hover { background-color: var(--alternate-pale); border: 1px solid var(--alternate-med); color: var(--alternate-med); } .wpc-actioncontainer-function.wpc-ctabutton-gaming-primary, .wpc-actioncontainer-url.wpc-ctabutton-gaming-primary { align-items: center; background-color: var(--pure-light); border: 1px solid var(--pure-dark); border-radius: var(--btn-br-mobile); color: var(--pure-dark); cursor: pointer; display: flex; flex-grow: 0; flex-shrink: 0; font-size: var(--body-m); font-weight: var(--bold); gap: var(--spacing-1); justify-content: center; line-height: 1; padding: 15px 23px; text-align: center; text-decoration: none; transition: all ease-out var(--transition-duration), color ease-out var(--transition-duration); white-space: nowrap; width: fit-content; } @media screen and (min-width: 1280px) { .wpc-actioncontainer-function.wpc-ctabutton-gaming-primary, .wpc-actioncontainer-url.wpc-ctabutton-gaming-primary { border-radius: var(--btn-br); } } .wpc-actioncontainer-function.wpc-ctabutton-gaming-primary:hover, .wpc-actioncontainer-url.wpc-ctabutton-gaming-primary:hover { background-color: var(--pure-dark); border: 1px solid var(--pure-light); color: var(--pure-light); } .wpc-actioncontainer-function.wpc-ctabutton-gaming-cto, .wpc-actioncontainer-url.wpc-ctabutton-gaming-cto { align-items: center; background-color: var(--pure-dark); border: 1px solid var(--pure-dark); border-radius: var(--btn-br-mobile); color: var --pure-light; cursor: pointer; display: flex; flex-grow: 0; flex-shrink: 0; font-size: var(--body-m); font-weight: var(--bold); gap: var(--spacing-1); justify-content: center; line-height: 1; padding: 15px 23px; text-align: center; text-decoration: none; transition: all ease-out var(--transition-duration), color ease-out var(--transition-duration); white-space: nowrap; width: fit-content; } @media screen and (min-width: 1280px) { .wpc-actioncontainer-function.wpc-ctabutton-gaming-cto, .wpc-actioncontainer-url.wpc-ctabutton-gaming-cto { border-radius: var(--btn-br); } } .wpc-actioncontainer-function.wpc-ctabutton-gaming-cto:hover, .wpc-actioncontainer-url.wpc-ctabutton-gaming-cto:hover { background-color: var(--pure-light); color: var(--pure-dark); } .wpc-actioncontainer-function.wpc-ctabutton-text, .wpc-actioncontainer-url.wpc-ctabutton-text { background-color: transparent; border: 0; border-radius: 0; color: var(--alternate-med); font-size: var(--body-m); font-weight: var(--bold); line-height: 1; padding: 0  !important; padding: 15px 0; text-decoration: none; white-space: nowrap; } .wpc-actioncontainer-function.wpc-ctabutton-text:hover, .wpc-actioncontainer-url.wpc-ctabutton-text:hover { background-color: transparent; border: 0; color: var(--alternate-med); text-decoration: underline; } .wpc-actioncontainer-function.wpc-ctabutton-text-gaming, .wpc-actioncontainer-url.wpc-ctabutton-text-gaming { background-color: transparent; border: 0; border-radius: 0; color: var(--auxiliary); font-size: var(--body-m); font-weight: var(--bold); line-height: 1; padding: 0  !important; padding: 15px 0; text-decoration: none; white-space: nowrap; } .wpc-actioncontainer-function.wpc-ctabutton-text-gaming:hover, .wpc-actioncontainer-url.wpc-ctabutton-text-gaming:hover { background-color: transparent; border: 0; color: var(--auxiliary); text-decoration: underline; } .wpc-actioncontainer-function.wpc-ctabutton-text-homepage, .wpc-actioncontainer-url.wpc-ctabutton-text-homepage { background-color: transparent; border: 0; border-radius: 0; color: var(--alternate-light); font-size: var(--body-m); font-weight: var(--bold); line-height: 1; padding: 0  !important; padding: 15px 0; text-decoration: none; white-space: nowrap; } .wpc-actioncontainer-function.wpc-ctabutton-text-homepage:hover, .wpc-actioncontainer-url.wpc-ctabutton-text-homepage:hover { background-color: transparent; border: 0; color: var(--alternate-light); text-decoration: underline; } .wpc-actioncontainer-function.wpc-ctabutton-fullwidth, .wpc-actioncontainer-url.wpc-ctabutton-fullwidth { width: 100%; } .wpc-icon { display: block; max-width: none; } .wpc-featured-card .wpc-featured-card-video { display: block; min-height: var(--card-featured-video-height); } @media screen and (max-width: 768px) { .wpc-featured-card .wpc-featured-card-video.wpc-featured-card-video-small { min-height: var(--card-featured-video-small-height)  !important; } } .wpc-featured-card .wpc-featured-card-divider { background: var(--neutral-med); height: 1px; margin: var(--spacing-2) 0 var(--spacing-2); width: 100%; } .wpc-featured-card .wpc-featured-card-textcontainer { display: flex; height: 100%; justify-content: space-between  !important; } .wpc-featured-card .wpc-featured-card-textcontainer .wpc-featured-card-logo { display: flex  !important; justify-content: center; width: 100%; } .wpc-featured-card .wpc-featured-card-textcontainer .wpc-featured-card-text-spacing, .wpc-featured-card .wpc-featured-card-textcontainer .wpc-featured-card-title { margin-bottom: var(--spacing-2); } .wpc-featured-card .wpc-featured-card-textcontainer .wpc-featured-card-list { display: flex; flex-direction: column; gap: var(--li-gap); list-style-type: disc; margin-left: var(--spacing-2); } .wpc-featured-card .wpc-featured-card-textcontainer .wpc-featured-card-cta { text-align: center; z-index: 2; } .wpc-featured-card .wpc-actioncontainer-function:hover .wpc-icon.hover-dark-to-alternate-med, .wpc-featured-card .wpc-actioncontainer-url:hover .wpc-icon.hover-dark-to-alternate-med { filter: invert(24%) sepia(65%) saturate(1411%) hue-rotate(197deg) brightness(90%) contrast(87%); } .wpc-featured-card .wpc-actioncontainer-function:hover .wpc-icon.hover-light-to-alternate-med, .wpc-featured-card .wpc-actioncontainer-url:hover .wpc-icon.hover-light-to-alternate-med { filter: brightness(0) saturate(100%) invert(22%) sepia(41%) saturate(2411%) hue-rotate(200deg) brightness(97%) contrast(86%); } .wpc-featured-card .wpc-actioncontainer-function:hover .wpc-icon.hover-auxiliary, .wpc-featured-card .wpc-actioncontainer-url:hover .wpc-icon.hover-auxiliary { filter: brightness(0) saturate(100%) invert(95%) sepia(89%) saturate(7500%) hue-rotate(103deg) brightness(101%) contrast(103%); } .wpc-featured-card .wpc-actioncontainer-function:hover .wpc-icon.hover-pure-dark, .wpc-featured-card .wpc-actioncontainer-function:hover .wpc-icon.hover-pure-light, .wpc-featured-card .wpc-actioncontainer-url:hover .wpc-icon.hover-pure-dark, .wpc-featured-card .wpc-actioncontainer-url:hover .wpc-icon.hover-pure-light { filter: invert(100%); } .wpc-featured-card .wpc-featured-card-clickableparent:before { content: ""; inset: 0; position: absolute; z-index: 1; } .wpc-full-image-card { height: var(--card-full-image-h)  !important; } .wpc-full-image-background { left: 0; position: absolute; z-index: 0; } .wpc-full-image-content { bottom: 0; left: 0; padding: var(--spacing-3); position: absolute; z-index: 1; } .wpc-full-image-content p { margin-bottom: var(--spacing-7); margin-top: var(--spacing-1); padding-right: 25%; text-align: start  !important; } .wpc-ctacontainer { display: flex; flex-wrap: wrap; gap: var(--spacing-1); margin: 0; padding: 0; } @media screen and (min-width: 768px) { .wpc-ctacontainer { gap: var(--spacing-2); } } .wpc-ctacontainer.wpc-ctacontainer-row { flex-direction: row; } .wpc-ctacontainer.wpc-ctacontainer-column { flex-direction: column; } .wpc-ctacontainer.wpc-ctacontainer-alignItems-start { align-items: start; } .wpc-ctacontainer.wpc-ctacontainer-alignItems-center { align-items: center; } .wpc-ctacontainer.wpc-ctacontainer-alignItems-end { align-items: end; } .wpc-ctacontainer.wpc-ctacontainer-justifycontent-start { justify-content: start; } .wpc-ctacontainer.wpc-ctacontainer-justifycontent-center { justify-content: center; } .wpc-ctacontainer.wpc-ctacontainer-justifycontent-end { justify-content: end; } .wpc-icon-card { padding: var(--spacing-2); } .wpc-icon-card-text-container { padding-top: var(--spacing-1); } .wpc-icon-card-default img, .wpc-icon-card-gaming img { height: auto; } .wpc-icon-card-default:hover p { color: var(--alternate-med)  !important; } @media screen and (min-width: 768px) { .wpc-image-card-hover:hover .wpc-image-card-inner { transform: rotateY(180deg); } } .wpc-image-card { padding: var(--spacing-3); } .wpc-image-card .wpc-image-card-inner { height: 100%; position: relative; text-align: center; transform-style: preserve-3d; transition: transform var(--transition-duration); width: 100%; } .wpc-image-card .wpc-image-card-inner .wpc-image-card-back, .wpc-image-card .wpc-image-card-inner .wpc-image-card-front { -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 100%; width: 100%; } .wpc-image-card .wpc-image-card-inner .wpc-image-card-back img, .wpc-image-card .wpc-image-card-inner .wpc-image-card-front img { margin: auto; } .wpc-image-card .wpc-image-card-inner .wpc-image-card-title { font-size: var(--M); font-weight: var(--regular); line-height: var(--M-line-line); margin-bottom: var(--spacing-1); margin-top: var(--spacing-1); } .wpc-image-card .wpc-image-card-inner .wpc-image-card-back { align-items: center; display: flex; flex-direction: column; justify-content: center; position: absolute; top: 0; transform: rotateY(180deg); } .wpc-image-card .wpc-image-card-inner .wpc-image-card-back .wpc-image-card-title { margin-bottom: var(--spacing-1); text-align: center; } .wpc-image-card .wpc-image-card-inner .wpc-image-card-back p { margin-top: 0; padding: 0 var(--spacing-2); text-align: center; } .wpc-informative-card { gap: var(--spacing-2); padding: var(--spacing-2); } .wpc-informative-card .wpc-informative-card-text-container { gap: var(--spacing-2); height: 100%; } .wpc-informative-card .wpc-informative-card-text-container h2, .wpc-informative-card .wpc-informative-card-text-container h3, .wpc-informative-card .wpc-informative-card-text-container h4, .wpc-informative-card .wpc-informative-card-text-container h5, .wpc-informative-card .wpc-informative-card-text-container h6 { font-weight: var(--regular); } .wpc-informative-card .wpc-informative-card-text-container p { color: var(--neutral-med-dark); word-break: break-word; } .wpc-informative-card .wpc-informative-card-text-container .wpc-featured-card-list { color: var(--neutral-med-dark); display: flex; flex-direction: column; gap: var(--li-gap); list-style-type: disc; margin-left: var(--spacing-2); } .wpc-label-card { gap: var(--spacing-2); justify-content: space-between  !important; padding: var(--spacing-1); } @media only screen and (min-width: 1280px) { .wpc-label-card { padding: var(--spacing-2); } } .wpc-label-card.wpc-card-background-gaming:hover .wpc-label-card-copy { color: var(--auxiliary); transition: all var(--transition-duration) ease; } .wpc-label-card.wpc-card-background-light:hover .wpc-label-card-copy { color: var(--alternate-med); transition: all var(--transition-duration) ease; } .wpc-label-card .wpc-label-card-label { color: #fff; height: auto; padding: var(--spacing-1) var(--spacing-2); } .wpc-product-card { padding: var(--spacing-3); } .wpc-product-card-logo { margin-top: var(--spacing-3); } .wpc-product-card-product-name { font-weight: 700; margin-top: var(--spacing-3); } .wpc-product-card-description { padding-bottom: var(--spacing-2); padding-top: var(--spacing-2); } .wpc-product-card-text-line-through { text-decoration: line-through; } .wpc-product-card-price span { font-size: var(--body-s); } .wpc-product-card-price { font-weight: 700; padding-bottom: var(--spacing-2); } .wpc-product-card-bottom-copy { font-size: var(--spacing-2); } .wpc-product-card-bottom-copy a { color: var(--alternate-med); text-decoration: none; } .wpc-db-card { background-color: transparent  !important; } .wpc-db-card .wpc-db-card-image-container:has(.wpc-actioncontainer-function:focus) .wpc-actioncontainer-url:after, .wpc-db-card .wpc-db-card-image-container:has(.wpc-actioncontainer-url:focus) .wpc-actioncontainer-url:after { border: 3px solid var(--elementary-signature); border-radius: calc(var(--blade-br) + 3px); box-sizing: border-box; content: ""; height: 100%; inset: 0; position: absolute; width: 100%; } .wpc-db-card .wpc-db-card-image-container { border-radius: var(--blade-br)  !important; margin-bottom: var(--spacing-2); overflow: hidden; position: relative; width: 100%; } .wpc-db-card .wpc-db-card-image-container picture { display: block; } .wpc-db-card .wpc-icon-card-text-container { justify-content: space-between; } .wpc-db-card .wpc-db-card-label { border-radius: var(--small-border-radius); display: flex; margin-bottom: 12px; min-height: 30px; padding: 0 var(--spacing-2); place-items: center; width: fit-content; } .wpc-db-card .wpc-db-card-label .wpc-db-card-label-text { font-size: var(--body-s); font-weight: 700; height: auto  !important; line-height: var(--body-m)  !important; padding: 7px 0; } .wpc-db-card .wpc-db-card-productname { font-size: var(--body-m); line-height: var(--body-m-line); margin-bottom: 12px; } @media screen and (min-width: 1280px) { .wpc-db-card .wpc-db-card-productname { font-size: var(--title-s); line-height: var(--title-s-line); } } @media screen and (min-width: 1920px) { .wpc-db-card .wpc-db-card-productname { font-size: var(--title-m); line-height: var(--title-m-line); } } .wpc-db-card .wpc-db-card-price-saving-section { display: flex; flex-direction: column; flex-wrap: wrap; place-items: center; } @media screen and (min-width: 1280px) { .wpc-db-card .wpc-db-card-price-saving-section { flex-direction: row; gap: var(--spacing-2); } } .wpc-db-card .wpc-db-card-price-saving-section .wpc-db-card-price-container { display: flex; flex-direction: row; margin-bottom: 12px; } .wpc-db-card .wpc-db-card-price-saving-section .wpc-db-card-price-container .wpc-db-card-price { font-weight: 700; } .wpc-db-card .wpc-db-card-price-saving-section .wpc-db-card-price-container .wpc-db-card-price.wpc-db-card-price-big { font-size: var(--title-l); } .wpc-db-card .wpc-db-card-price-saving-section .wpc-db-card-price-container .wpc-db-card-price.wpc-db-card-price-small { font-size: var(--title-m); } @media screen and (min-width: 1920px) { .wpc-db-card .wpc-db-card-price-saving-section .wpc-db-card-price-container .wpc-db-card-price.wpc-db-card-price-small { font-size: var(--title-l); } } .wpc-db-card .wpc-db-card-price-saving-section .wpc-db-card-price-container .wpc-db-card-price-strikethrough { text-decoration: line-through; } .wpc-db-card .wpc-db-card-price-saving-section .wpc-db-card-price-container .wpc-db-card-price-strikethrough.wpc-db-card-price-big { font-size: var(--title-l); } .wpc-db-card .wpc-db-card-price-saving-section .wpc-db-card-price-container .wpc-db-card-price-strikethrough.wpc-db-card-price-small { font-size: var(--title-m); } @media screen and (min-width: 1920px) { .wpc-db-card .wpc-db-card-price-saving-section .wpc-db-card-price-container .wpc-db-card-price-strikethrough.wpc-db-card-price-small { font-size: var(--title-l); } } .wpc-db-card .wpc-db-card-price-saving-section .wpc-db-card-price-container :nth-child(2) { margin-left: var(--spacing-2)  !important; } .wpc-db-card .wpc-db-card-price-saving-section .wpc-db-card-savings-container { display: flex; flex-direction: row; margin-bottom: 12px; } @media screen and (min-width: 1280px) { .wpc-db-card .wpc-db-card-price-saving-section .wpc-db-card-savings-container { align-self: center; } } .wpc-db-card .wpc-db-card-price-saving-section .wpc-db-card-savings-container .wpc-db-card-savings-price { font-size: var(--body-s); height: fit-content  !important; line-height: var(--body-s-line); } @media screen and (min-width: 1920px) { .wpc-db-card .wpc-db-card-price-saving-section .wpc-db-card-savings-container .wpc-db-card-savings-price { font-size: var(--body-m); line-height: var(--body-m-line); } } .wpc-db-card .wpc-db-card-price-saving-section .wpc-db-card-savings-container .wpc-db-card-savings-percentage { font-size: var(--body-s); height: fit-content  !important; line-height: var(--body-s-line); padding: 0 6px; } @media screen and (min-width: 1920px) { .wpc-db-card .wpc-db-card-price-saving-section .wpc-db-card-savings-container .wpc-db-card-savings-percentage { font-size: var(--body-m); line-height: var(--body-m-line); } } .wpc-db-card .wpc-db-card-price-saving-section .wpc-db-card-savings-container :nth-child(2) { margin-left: var(--spacing-1)  !important; } .wpc-db-card .wpc-db-card-cta-section { display: flex; flex-direction: column; flex-wrap: wrap; margin-bottom: var(--spacing-2); width: fit-content; } @media screen and (min-width: 1280px) { .wpc-db-card .wpc-db-card-cta-section { flex-direction: row; place-items: center; } } .wpc-db-card .wpc-db-card-cta-section.wpc-db-card-cta-section-centered { flex-direction: column; place-items: center; align-items: center; } @media screen and (min-width: 1280px) { .wpc-db-card .wpc-db-card-cta-section.wpc-db-card-cta-section-centered :nth-child(2) { margin-top: 12px; } } .wpc-db-card .wpc-db-card-cta-section :nth-child(2) { margin-top: 12px; } @media screen and (min-width: 1280px) { .wpc-db-card .wpc-db-card-cta-section :nth-child(2) { margin-left: var(--spacing-2)  !important; margin-top: 0; } } .wpc-db-card .wpc-db-card-cta-section .wpc-db-card-cta { border-radius: var(--btn-br); font-size: var(--body-m); font-weight: 700; line-height: 1; padding: var(--btn-pt) var(--btn-pl) var(--btn-pb) var(--btn-pr); transition: all .3s ease-out; white-space: nowrap; width: fit-content; } .wpc-db-card .wpc-db-card-cta-section .wpc-db-card-cta-dark { background-color: var(--neutral-dark); border: 1px solid var(--neutral-dark); color: var(--pure-light); } .wpc-db-card .wpc-db-card-cta-section .wpc-db-card-cta-dark:focus, .wpc-db-card .wpc-db-card-cta-section .wpc-db-card-cta-dark:hover { background-color: var(--pure-light); color: var(--neutral-dark); outline-offset: 4px; } .wpc-db-card .wpc-db-card-cta-section .wpc-db-card-cta-light { background-color: var(--pure-light); border: 1px solid var(--neutral-dark); color: var(--neutral-dark); } .wpc-db-card .wpc-db-card-cta-section .wpc-db-card-cta-light:focus, .wpc-db-card .wpc-db-card-cta-section .wpc-db-card-cta-light:hover { background-color: var(--neutral-dark); color: var(--pure-light); outline-offset: 3px; } .wpc-db-card .wpc-db-card-cta-section .wpc-db-card-disclaimer { font-size: var(--label-s); font-style: italic; height: fit-content  !important; line-height: var(--label-s-line); width: fit-content; } @media screen and (min-width: 1280px) { .wpc-db-card .wpc-db-card-cta-section .wpc-db-card-disclaimer { font-size: var(--body-s); line-height: var(--body-s-line); } } .wpc-resources-card { gap: var(--spacing-2); padding: var(--spacing-2); } .wpc-resources-card .wpc-resources-card-text-container { gap: var(--spacing-2); height: 100%; } .wpc-resources-card .wpc-resources-card-text-container h2, .wpc-resources-card .wpc-resources-card-text-container h3, .wpc-resources-card .wpc-resources-card-text-container h4, .wpc-resources-card .wpc-resources-card-text-container h5, .wpc-resources-card .wpc-resources-card-text-container h6 { font-weight: var(--regular); } .wpc-resources-card .wpc-resources-card-text-container p { color: var(--neutral-med-dark); word-break: break-word; } .wpc-resources-card .wpc-resources-card-text-container .wpc-featured-card-list { color: var(--neutral-med-dark); display: flex; flex-direction: column; gap: var(--li-gap); list-style-type: disc; margin-left: var(--spacing-2); } .wpc-resources-card .wpc-actioncontainer-url.wpc-ctabutton-text { text-align: center; } .hidden { visibility: hidden  !important; } .d-none { display: none  !important; } .mobileVisible { visibility: visible  !important; } .wpc-vertical-hover-card-container .wpc-card-background-gaming { background-color: transparent  !important; } .wpc-vertical-hover-card-container { height: 28.5625rem; } .variant-short-hover-card { height: 23.5rem; } .wpc-vertical-hover-card-link { bottom: 0; height: 100%; left: 0; position: absolute; width: 100%; z-index: 3; } picture:has(.wpc-vertical-hover-card-image-top) { height: 50%  !important; width: 100%  !important; } .wpc-vertical-hover-card-logo-image { height: auto  !important; margin-bottom: var(--spacing-1)  !important; margin-left: auto  !important; margin-right: auto  !important; position: relative; width: 200px  !important; z-index: 2; } .wpc-vertical-hover-card-outside-copy { height: fit-content; margin-top: var(--spacing-2)  !important; } .wpc-vertical-hover-card-container { border-radius: 5px  !important; box-shadow: 3px 6px 10px rgba(0, 0, 0, .161); margin-bottom: 5px  !important; position: relative; } .wpc-vertical-hover-card-container .wpc-vertical-hover-card-image-copy-container { border-radius: 5px; } .wpc-vertical-hover-card-container:after { border-radius: 5px  !important; content: ""; height: 100%; left: 0; position: absolute; top: 0; transition: all .2s ease-in  !important; width: 100%; z-index: 1; } @media screen and (min-width: 768px) { .wpc-vertical-hover-card-container .wpc-vertical-hover-card-product-image { top: -50px  !important; } } @media screen and (min-width: 1280px) { .wpc-vertical-hover-card-container .wpc-vertical-hover-card-product-image { bottom: 0  !important; } .wpc-vertical-hover-card-container .d-none, .wpc-vertical-hover-card-container .wpc-vertical-hover-card-cta { display: block  !important; } .wpc-vertical-hover-card-container:focus-within .visible, .wpc-vertical-hover-card-container:hover .visible { visibility: visible  !important; } .wpc-vertical-hover-card-container:focus-within:after, .wpc-vertical-hover-card-container:hover:after { background-color: var(--background-hover-color); height: 100%; } .wpc-vertical-hover-card-container:focus-within .wpc-vertical-hover-card-product-image, .wpc-vertical-hover-card-container:hover .wpc-vertical-hover-card-product-image { top: -180px  !important; transition: all .3s; z-index: 2  !important; } .wpc-vertical-hover-card-container:focus-within .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-title, .wpc-vertical-hover-card-container:hover .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-title { color: var(--pure-light)  !important; } .wpc-vertical-hover-card-container:focus-within .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-copy-hover-content-container, .wpc-vertical-hover-card-container:hover .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-copy-hover-content-container { opacity: 100%  !important; top: -2rem  !important; } .wpc-vertical-hover-card-container:focus-within .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-hidden, .wpc-vertical-hover-card-container:hover .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-hidden { visibility: hidden  !important; } .wpc-vertical-hover-card-container:focus-within .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-copy, .wpc-vertical-hover-card-container:hover .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-copy { color: var(--pure-light)  !important; display: block  !important; opacity: 100%  !important; visibility: visible  !important; } .wpc-vertical-hover-card-container:focus-within .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-cta, .wpc-vertical-hover-card-container:hover .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-cta { display: block  !important; margin: 0 auto  !important; opacity: 100%  !important; visibility: visible  !important; z-index: 4  !important; } } @media screen and (min-width: 1920px) { .wpc-vertical-hover-card-container .wpc-vertical-hover-card-product-image { bottom: 0  !important; top: -80px  !important; } .wpc-vertical-hover-card-container:focus-within:after, .wpc-vertical-hover-card-container:hover:after { background-color: var(--background-hover-color); } .wpc-vertical-hover-card-container:focus-within .wpc-vertical-hover-card-product-image, .wpc-vertical-hover-card-container:hover .wpc-vertical-hover-card-product-image { top: -180px  !important; } .wpc-vertical-hover-card-container:focus-within .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-copy-hover-content-container, .wpc-vertical-hover-card-container:hover .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-copy-hover-content-container { gap: 0  !important; opacity: 100%  !important; top: -1rem  !important; } } .wpc-vertical-hover-card-container .wpc-vertical-hover-card-image-top { border-top-left-radius: 5px  !important; border-top-right-radius: 5px  !important; height: 100%; width: 100%  !important; } .wpc-vertical-hover-card-container .wpc-vertical-hover-card-product-image { left: 50%  !important; position: absolute  !important; top: -80px; transform: translate(-50%, -50%)  !important; z-index: 2  !important; } @media screen and (min-width: 1280px) { .wpc-vertical-hover-card-container .wpc-vertical-hover-card-product-image { left: 50%  !important; position: absolute  !important; top: -80px  !important; transform: translate(-50%, -50%)  !important; z-index: 2  !important; } } .wpc-vertical-hover-card-container .wpc-vertical-hover-card-image-copy-container { height: 100%; padding: calc(var(--spacing-3) + var(--spacing-6)) var(--spacing-6) var(--spacing-3); position: relative; width: 100%; } @media screen and (min-width: 768px) and (max-width: 1279px) { .wpc-vertical-hover-card-container .wpc-vertical-hover-card-image-copy-container { padding-top: calc(var(--spacing-8) + var(--spacing-6)); } } .wpc-vertical-hover-card-container .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-product-image { margin-bottom: var(--spacing-6)  !important; margin-left: auto  !important; margin-right: auto  !important; position: relative; transition: all .2s ease-out  !important; z-index: 2  !important; } @media screen and (min-width: 768px) { .wpc-vertical-hover-card-container .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-product-image { width: 360px  !important; } } @media screen and (min-width: 1280px) { .wpc-vertical-hover-card-container .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-product-image { width: 248px  !important; } } .wpc-vertical-hover-card-container .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-title { font-size: var(--headline-s)  !important; line-height: var(--headline-s-line)  !important; position: relative; z-index: 2; } .wpc-vertical-hover-card-container .wpc-vertical-hover-card-image-copy-container .hover-only-title { margin-bottom: 16px; } .wpc-vertical-hover-card-container .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-copy-hover-content-container { display: flex; flex-direction: column; gap: 8px  !important; height: 100%; justify-content: flex-end  !important; left: 0; margin-top: auto  !important; opacity: 0; position: absolute; top: 0; transition: all .2s ease-in; width: 100%; } .wpc-vertical-hover-card-container .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-copy { display: none  !important; font-size: var(--title-xs)  !important; height: inherit  !important; line-height: var(--title-xs-line)  !important; margin-bottom: 0  !important; opacity: 0  !important; position: relative; visibility: hidden  !important; z-index: 2; } @media screen and (min-width: 1920px) { .wpc-vertical-hover-card-container .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-copy { font-size: var(--title-s)  !important; line-height: var(--title-s-line)  !important; margin-bottom: var(--spacing-4)  !important; } } .wpc-vertical-hover-card-container .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-cta { margin: 20px auto 0  !important; opacity: 0  !important; position: relative; transition: all .3s ease; visibility: hidden  !important; z-index: 5  !important; } .wpc-vertical-hover-card-container .wpc-vertical-hover-card { border-radius: 5px  !important; overflow: visible  !important; position: relative; } .variant-short-hover-card .wpc-vertical-hover-card-image-copy-container, .wpc-vertical-hover-card-container .wpc-vertical-hover-card-image-copy-container { align-items: center; display: flex; flex-direction: column; height: 50%  !important; justify-content: center; } .variant-short-hover-card .wpc-vertical-hover-card-image-copy-container picture:has(.wpc-vertical-hover-card-product-image), .wpc-vertical-hover-card-container .wpc-vertical-hover-card-image-copy-container picture:has(.wpc-vertical-hover-card-product-image) { flex: 0; } .variant-short-hover-card .wpc-vertical-hover-card-image-copy-container { padding-bottom: 0; padding-top: var(--spacing-2); } .variant-short-hover-card .wpc-vertical-hover-card-image-copy-container .wpc-vertical-hover-card-product-image { height: 200px; top: -60px; } .variant-short-hover-card .wpc-vertical-hover-card-image-copy-container picture:has(.wpc-vertical-hover-card-product-image) { flex: 0; } .wpc-vertical-hover-card-copy-hover-content-container { padding-bottom: var(--spacing-3); padding-left: var(--spacing-6); padding-right: var(--spacing-6); } @media screen and (min-width: 768px) and (max-width: 1279px) { .wpc-vertical-hover-card-copy-hover-content-container { padding-top: calc(var(--spacing-8) + var(--spacing-6)); } } @media screen and (min-width: 768px) { .wpc-vertical-hover-card-container { height: 36.6875rem; } .variant-short-hover-card { height: 25.75rem; } .variant-short-hover-card .wpc-vertical-hover-card-product-image { height: 257px  !important; top: -60px  !important; } } @media screen and (min-width: 1280px) { .wpc-vertical-hover-card-container { height: 36.6875rem; } .variant-short-hover-card { height: 30.5rem; } } @media screen and (min-width: 1920px) { .wpc-vertical-hover-card-container { height: 36.6875rem; } .variant-short-hover-card { height: 27.375rem; } } .wpc-fixednavbar-row { background-color: var(--pure-light); } .wpc-fixednavbar-row .wpc-fixednavbar-wpcactioncontainer { height: 100%; width: 100%; } @media screen and (max-width: 767px) { .wpc-fixednavbar-row .wpc-fixednavbar-wpcactioncontainer { padding-bottom: var(--spacing-2); } } @media screen and (min-width: 1920px) { .wpc-fixednavbar-row .wpc-horizontal-scroll { margin-left: 0; margin-right: 0; } } .wpc-centered-hero { background-color: rgba(0, 0, 0, .5); height: var(--blade-mobile-height); position: relative; } @media screen and (min-width: 768px) { .wpc-centered-hero { height: var(--blade-tablet-height); } } @media screen and (min-width: 1280px) { .wpc-centered-hero { height: var(--blade-medium-height); } } .wpc-centered-hero .MuiGrid-container > picture img { left: 0; position: absolute; width: 100%  !important; z-index: -1; } .wpc-centered-hero .MuiGrid-container .wpc-centered-hero-text-container { align-items: center; display: flex; flex-direction: column; gap: var(--spacing-5); height: 100%; justify-content: center; padding-top: 0; } .wpc-medium-hero-transbg { align-items: center; background-color: rgba(0, 0, 0, var(--overlay-transparency)); bottom: 0; color: var(--pure-light); display: flex; flex-direction: column; height: var(--medium-hero-height); justify-content: center; padding: var(--spacing-1); width: 100%; } .wpc-medium-hero-transbg p { color: var(--neutral-white)  !important; font-size: var(--body-s); margin: var(--spacing-1) 0; } .wpc-medium-hero-transbg .wpc-actioncontainer-url, .wpc-medium-hero-transbg p { text-align: center  !important; } @media (min-width: 768px) { .wpc-medium-hero-transbg { align-items: start; height: 150px; padding-left: var(--card-padding); } .wpc-medium-hero-transbg p { font-size: var(--body-m); margin-bottom: var(--spacing-5); } .wpc-medium-hero-transbg .wpc-actioncontainer-url { text-align: left  !important; } } @media (min-width: 1280px) { .wpc-medium-hero-transbg { height: 100%; padding-left: var(--spacing-8); padding-right: var(--spacing-8); width: 41.6666666667%; } .wpc-medium-hero-transbg p { margin-top: var(--spacing-5); text-align: left  !important; } } @media (min-width: 1920px) { .wpc-medium-hero-transbg { height: 100%; padding-left: var(--xl-grid-margin); } } .wpc-small-hero-container, .wpc-small-hero-container .wpc-small-hero-background { position: relative; } .wpc-small-hero-container .wpc-small-hero-copy { align-items: center; display: flex; font-size: var(--body-l); font-weight: 700; height: 64px; justify-content: center; position: absolute; top: 0; } @media screen and (min-width: 360px) { .wpc-small-hero-container .wpc-small-hero-copy { font-size: var(--title-l); height: 100%; } } @media screen and (min-width: 768px) { .wpc-small-hero-container .wpc-small-hero-copy { font-size: var(--headline-l); } } .wpc-navbar-row { background-color: var(--pure-light); } .wpc-navbar-row .wpc-navbar-wpcactioncontainer { height: 100%; width: 100%; } * { box-sizing: border-box; font-family: Lato, sans-serif; margin: 0; padding: 0; } img { max-width: 100%; } body { margin: 0  !important; } .wpc-tooltip { position: relative; } .wpc-tooltiptext { border-radius: 8px; box-shadow: 0 8px 10px -7px hsla(0, 1%, 69%, .2); -webkit-box-shadow: 0 8px 10px -7px hsla(0, 1%, 69%, .2); -moz-box-shadow: 0 8px 10px -7px hsla(0, 1%, 69%, .2); inline-size: max-content; margin-top: 16px; opacity: 0; padding: var(--spacing-2) var(--spacing-2); position: absolute; text-align: center; top: 100%; transition: opacity .3s; visibility: hidden; width: calc(100vw - var(--spacing-6)); z-index: 1; } .wpc-tooltiptext p { height: auto  !important; } .wpc-tooltip-container:has(.wpc-tooltip.wpc-tooltip-container-width) { container-type: inline-size; overflow: unset; } .wpc-tooltip-container:has(.wpc-tooltip.wpc-tooltip-container-width) .wpc-tooltiptext { width: calc(100cqw - 32px)  !important; } .wpc-tooltip:after { border-bottom-color: inherit; border-bottom-style: solid; border-bottom-width: 12px; border-left: 12px solid transparent; border-right: 12px solid transparent; border-top: 12px solid transparent; bottom: -16px; content: " "; left: 50%; opacity: 0; position: absolute; transform: translateX(-50%); transition: opacity .3s; visibility: hidden; } .wpc-tooltip:focus + .wpc-tooltiptext, .wpc-tooltip:focus-within + .wpc-tooltiptext, .wpc-tooltip:focus-within:after, .wpc-tooltip:focus:after, .wpc-tooltip:hover + .wpc-tooltiptext, .wpc-tooltip:hover:after { opacity: 1; visibility: visible; } .wpc-tooltip:focus .wpc-tooltiptext, .wpc-tooltip:focus-within .wpc-tooltiptext, .wpc-tooltip:focus-within:after, .wpc-tooltip:focus:after, .wpc-tooltip:hover .wpc-tooltiptext, .wpc-tooltip:hover:after { opacity: 1; visibility: visible; } .wpc-table-header, .wpc-table-item { padding: var(--spacing-2); } .wpc-table-item { vertical-align: top; } .wpc-table-item ul li { list-style-position: inside; } .wpc-table { border-collapse: separate; border-spacing: 0; width: 100%; } .wpc-table thead { position: relative; z-index: 3; } .wpc-table thead th { text-wrap: wrap; } .wpc-table th:first-of-type { border-top-left-radius: 4px; } .wpc-table th:last-of-type { border-top-right-radius: 4px; } .wpc-table tr:last-of-type td:first-of-type { border-bottom-left-radius: 4px; } .wpc-table tr:last-of-type td:last-of-type { border-bottom-right-radius: 4px; } @media screen and (max-width: 1279px) { .wpc-table-fixed-column { overflow-x: unset  !important; } .wpc-table-fixed-column > .MuiGrid-item { overflow-x: scroll; } .wpc-table-fixed-column > .MuiGrid-item .wpc-table th:first-of-type, .wpc-table-fixed-column > .MuiGrid-item td.wpc-table-item:first-child, .wpc-table-fixed-column > .MuiGrid-item th.wpc-table-item:first-child { left: 0; position: sticky; top: 0; z-index: 2; } } .wpc-table-toggle { align-items: center; display: flex; font-weight: 700; margin-top: var(--spacing-5)  !important; } .wpc-table-toggle img { margin-left: var(--spacing-1); } .wpc-table-toggle .wpc-rotate { transform: rotate(180deg); } @media screen and (min-width: 1280px) { .wpc-table-toggle { justify-content: center; margin-top: var(--spacing-6); } } .wpc-table-container { position: relative; } .wpc-table-container .wpc-table-hide-overflow { height: 100%; position: absolute; width: var(--spacing-2); z-index: 4; } .wpc-filtered-title { font-weight: 700; } .wpc-deals-banner { align-items: center; display: flex; height: 100px; isolation: isolate; justify-content: center; position: relative; text-align: center; width: 100%; } .wpc-deals-banner .wpc-deals-banner-bg-img { left: 0; margin: 0; padding: 0; position: absolute; top: 0; width: 0; z-index: -1; } .wpc-deals-banner .wpc-deals-banner-content { align-items: center; align-self: center; display: flex; flex-direction: column; gap: var(--spacing-2); height: 100%; justify-content: center; left: 0; left: 50%; max-width: calc(100% - var(--spacing-2) * 2); padding: 0 var(--spacing-2) 0; position: absolute; top: 0; top: 50%; transform: translate(-50%, -50%); width: 100%; } @media screen and (min-width: 768px) { .wpc-deals-banner .wpc-deals-banner-content { flex-direction: row; padding: 0 var(--spacing-8) 0; } } @media screen and (min-width: 1280px) { .wpc-deals-banner .wpc-deals-banner-content { gap: var(--spacing-5); max-width: calc(100% - var(--spacing-8) * 2); } } @media screen and (min-width: 1920px) { .wpc-deals-banner .wpc-deals-banner-content { max-width: calc(1920px - var(--xl-grid-margin) * 2); } } .wpc-deals-banner .wpc-deals-banner-pure-light { color: var(--pure-light); } .wpc-deals-banner .wpc-deals-banner-pure-dark { color: var(--pure-dark); } .wpc-deals-banner .wpc-deals-banner-large-text { font-size: var(--title-l); font-weight: var(--bold); line-height: var(--title-l); } @media screen and (min-width: 768px) { .wpc-deals-banner .wpc-deals-banner-large-text { font-size: var(--headline-l); line-height: var(--headline-l-line); } } .wpc-deals-banner .wpc-deals-banner-small-text { font-size: var(--title-xs); line-height: var(--title-xs-line); } @media screen and (min-width: 768px) { .wpc-deals-banner .wpc-deals-banner-small-text { font-size: var(--title-m); line-height: var(--title-m-line); } } @media screen and (min-width: 1280px) { .wpc-deals-banner .wpc-deals-banner-small-text { font-size: var(--title-l); line-height: var(--title-l); } } .wpc-deals-banner picture { flex-shrink: 0; } .wpc-skinny-banner { min-height: 60px; } .wpc-skinny-banner, .wpc-skinny-banner .wpc-skinny-banner-content { align-items: center; display: flex; justify-content: center; width: 100%; } .wpc-skinny-banner .wpc-skinny-banner-content { gap: var(--spacing-5); height: 100%; padding: 6px var(--spacing-2); } .wpc-skinny-banner .wpc-skinny-banner-title-pure-light { color: var(--pure-light); width: auto; } .wpc-skinny-banner .wpc-skinny-banner-title-pure-dark { color: var(--pure-dark); width: auto; } .wpc-skinny-banner .wpc-skinny-banner-title-text { font-size: var(--title-xs); font-weight: var(--bold); } @media screen and (min-width: 768px) { .wpc-skinny-banner .wpc-skinny-banner-title-text { font-size: var(--title-s); } } .wpc-wide-blade.wpc-blade-container, .wpc-wide-blade.wpc-blade-container .wpc-wide-blade-content-container.MuiGrid-item { position: relative; } @media screen and (min-width: 1280px) { .wpc-wide-blade.wpc-blade-container .wpc-wide-blade-content-container.MuiGrid-item { position: absolute  !important; } .wpc-wide-blade.wpc-blade-container .wpc-wide-blade-content-container.MuiGrid-item .MuiGrid-container .MuiGrid-item { padding-top: 0  !important; } .wpc-wide-blade.wpc-blade-container .wpc-wide-blade-content-container.MuiGrid-item .wpc-blade-content { border-radius: var(--blade-br); padding: var(--spacing-7); } .wpc-wide-blade.wpc-blade-container .wpc-wide-blade-content-container.MuiGrid-item .wpc-blade-content.wpc-wide-blade-content-position-right { margin-left: var(--spacing-1); } .wpc-wide-blade.wpc-blade-container .wpc-wide-blade-content-container.MuiGrid-item .wpc-blade-content.wpc-wide-blade-content-position-left { margin-right: var(--spacing-1); } .wpc-wide-blade.wpc-blade-container .wpc-wide-blade-content-container.MuiGrid-item .wpc-blade-content.wpc-wide-blade-content-container-bg-dark { background: var(--neutral-dark); } .wpc-wide-blade.wpc-blade-container .wpc-wide-blade-content-container.MuiGrid-item .wpc-blade-content.wpc-wide-blade-content-container-bg-light { background: var(--pure-light); } } @media screen and (min-width: 1280px) and (min-width: 1920px) { .wpc-wide-blade.wpc-blade-container .wpc-wide-blade-content-container.MuiGrid-item .wpc-blade-content { margin-left: calc(var(--spacing-5) * -1); } } @media screen and (min-width: 1920px) { .wpc-wide-blade.wpc-blade-container .wpc-wide-blade-content-container.MuiGrid-item .wpc-blade-content.wpc-wide-blade-content-position-right { margin-left: var(--spacing-1); margin-right: var(--xl-grid-margin); } .wpc-wide-blade.wpc-blade-container .wpc-wide-blade-content-container.MuiGrid-item .wpc-blade-content.wpc-wide-blade-content-position-left { margin-left: var(--xl-grid-margin); margin-right: var(--spacing-1); } .wpc-wide-blade.wpc-blade-container .wpc-wide-blade-content-container.MuiGrid-item > .MuiGrid-root.MuiGrid-container { padding: 0; } } .wpc-wide-blade.wpc-blade-container > .MuiGrid-item > picture img { border-radius: var(--blade-br); } .wpc-wide-blade.wpc-blade-container > .MuiGrid-item > picture img.wpc-blade-img-no-border { border-radius: 0; } @media screen and (min-width: 1920px) { .wpc-wide-blade.wpc-blade-container > .MuiGrid-item > picture img.wpc-blade-img-no-border { border-radius: var(--blade-br); } } @media screen and (min-width: 1280px) { .wpc-hotspot-container { position: absolute; } } .wpc-hotspot-container .wpc-hotspot-br-desktop, .wpc-hotspot-container .wpc-hotspot-br-mobile { border-radius: var(--card-br-mobile); } .wpc-hotspot-container .wpc-hotspot-product:focus-within .wpc-hotspot-product-card .wpc-hotspot-product-cta-container, .wpc-hotspot-container .wpc-hotspot-product:hover .wpc-hotspot-product-card .wpc-hotspot-product-cta-container { display: flex; } .wpc-hotspot-mobile-overlay { background-color: transparent; transition: all var(--transition-duration) ease; } .wpc-hotspot-product-card, .wpc-hotspot-product-card.wpc-hotspot-active-mobile { transition: opacity var(--transition-duration) ease, transform var(--transition-duration) ease; z-index: 2; } .wpc-hotspot-product-card.wpc-hotspot-active-mobile { transform: translateY(0); } .wpc-hotspot-product-card.wpc-hotspot-active-mobile ~ .wpc-hotspot-mobile-overlay { background-color: rgba(0, 0, 0, .7); z-index: 1; } @media screen and (max-width: 767px) { .wpc-hotspot-product-card { left: 0; position: fixed  !important; transform: translateY(100px); z-index: -5; } } .wpc-hotspot-container { overflow: hidden; position: relative; width: 100%  !important; } .wpc-hotspot-container .wpc-hotspot-background { width: 100%  !important; } .wpc-hotspot-container .wpc-hotspot-mobile-overlay { height: 100%; position: absolute; top: 0; width: 100%; } .wpc-hotspot-container .wpc-tooltip-container { background-color: transparent; border: 0; z-index: 5; } .wpc-hotspot-container .wpc-tooltip-container:focus { outline: 2px solid red  !important; } .wpc-hotspot-container .wpc-hotspot-product { align-items: center; display: flex; gap: var(--spacing-2); justify-content: center; pointer-events: none; width: fit-content; z-index: 10; } .wpc-hotspot-container .wpc-hotspot-product .wpc-hotspot-icon { animation: scaleIcon .8s infinite; animation-direction: alternate; cursor: pointer; pointer-events: auto; } .wpc-hotspot-container .wpc-hotspot-product:focus-within, .wpc-hotspot-container .wpc-hotspot-product:hover { pointer-events: all; z-index: 999; } .wpc-hotspot-container .wpc-hotspot-product:focus-within .wpc-hotspot-product-card, .wpc-hotspot-container .wpc-hotspot-product:hover .wpc-hotspot-product-card { opacity: 1; pointer-events: all; } .wpc-hotspot-container .wpc-hotspot-product button { width: fit-content; } .wpc-hotspot-container .wpc-hotspot-product-cta-container { display: flex; } @keyframes scaleIcon { to { transform: scale(1.2); } 0% { transform: scale(1); } } .wpc-hotspot-top-content-title { font-family: Montserrat, sans-serif; font-size: 28px; font-weight: 700; line-height: 1.3; margin-bottom: var(--spacing-2); } .wpc-hotspot-top-content-copy { font-family: Noto Sans, sans-serif; font-size: 12px; font-weight: 400; line-height: 1.6; margin-bottom: var(--spacing-3); } .wpc-hotspot-top-content-cta { font-family: Noto Sans, sans-serif; margin-bottom: var(--spacing-6); } .wpc-hotspot-top-content-container { padding-top: var(--spacing-5)  !important; } @media screen and (min-width: 768px) { .wpc-hotspot-top-content-container { padding-top: var(--spacing-8)  !important; } .wpc-hotspot-top-content-title { font-family: Montserrat, sans-serif; font-size: var(--headline-m-line); font-weight: 700; line-height: 1.3; margin-bottom: var(--spacing-2); } .wpc-hotspot-top-content-copy { font-family: Noto Sans, sans-serif; font-size: var(--body-s); line-height: 1.6; margin-bottom: var(--spacing-6); } } @media screen and (min-width: 1280px) { .wpc-hotspot-top-content-container { padding-top: 64px  !important; position: absolute; width: 800px; z-index: 10; } .wpc-hotspot-top-content-title { font-family: Montserrat, sans-serif; font-size: 56px; font-weight: 700; line-height: 1; margin-bottom: var(--spacing-2); } .wpc-hotspot-top-content-copy { font-family: Noto Sans, sans-serif; font-size: var(--body-m); line-height: 1.6; margin-bottom: var(--spacing-6); } } @media screen and (max-width: 1279px) { .wpc-hotspot-container { background-color: var(--web-neutral-gray-03); } } @media screen and (min-width: 1920px) { .wpc-hotspot-top-content-container { padding-top: 76px  !important; position: absolute; width: 950px; z-index: 10; } .wpc-hotspot-top-content-title { font-family: Montserrat, sans-serif; font-size: 64px; font-weight: 700; line-height: 1.13; margin-bottom: var(--spacing-2); } .wpc-hotspot-top-content-copy { font-family: Noto Sans, sans-serif; font-size: var(--body-l); line-height: 1.6; margin-bottom: var(--spacing-6); max-width: 350px; } } .wpc-hotspot-product-card { border-radius: 12px  !important; bottom: 0; box-shadow: 1px 16px 32px 0 rgba(0, 0, 0, .1); -webkit-box-shadow: 1px 16px 32px 0 rgba(0, 0, 0, .1); -moz-box-shadow: 1px 16px 32px 0 rgba(0, 0, 0, .1); gap: var(--spacing-1); height: auto  !important; opacity: 0; padding: var(--spacing-2); transition: opacity var(--main-transition-duration) var(--third-transition-timing-function), transform var(--main-transition-duration) var(--third-transition-timing-function); width: 100%; } .wpc-hotspot-product-card.wpc-hotspot-active-mobile { border-bottom-left-radius: 0  !important; border-bottom-right-radius: 0  !important; bottom: 0; opacity: 1; padding-top: var(--spacing-8); position: fixed  !important; visibility: visible; z-index: 20; } .wpc-hotspot-product-card.wpc-hotspot-active-mobile ~ .wpc-hotspot-mobile-overlay { height: 100vh; left: 0; position: fixed; top: 0; width: 100vw; z-index: 18; } .wpc-hotspot-product-card .wpc-newhotspot-nav-container { align-items: center; display: flex; justify-content: space-between; width: 100%; } .wpc-hotspot-product-card .wpc-newhotspot-nav-container button { background-color: transparent  !important; border: 0; cursor: pointer; outline: 0; width: 10%; } .wpc-hotspot-product-card .nav-arrow-next, .wpc-hotspot-product-card .wpc-newhotspot-nav-arrow { border-style: solid; border-width: 1.5px 1.5px 0 0; content: ""; display: inline-block; height: 12px; position: relative; top: 2px; transform: rotate(-135deg); width: 12px; } .wpc-hotspot-product-card .nav-arrow-next { scale: -1; } .wpc-hotspot-product-card .wpc-hotspot-dot-container { background-color: var(--neutral-med-pale); border-radius: 20px; display: flex; flex-direction: row; gap: 8px; padding: 10px 16px; } .wpc-hotspot-product-card .wpc-hotspot-dot-container .wpc-carousel-dot { border: 1px solid var(--neutral-med-dark); border-radius: 100px; cursor: pointer; height: 8px; padding: 0  !important; width: 8px; } .wpc-hotspot-product-card .wpc-hotspot-dot-container .wpc-carousel-dot-active { background-color: var(--neutral-med-dark); } @media screen and (max-width: 1279px) { .wpc-hotspot-product-card { left: 0; position: fixed  !important; visibility: hidden; z-index: 100; } } @media screen and (min-width: 1279px) { .wpc-hotspot-product-card { width: 412px; } } .wpc-hotspot-product-card .wpc-close-hotspot { background: #000; cursor: pointer; height: 1px; position: absolute; right: var(--spacing-2); top: 23px; transform: rotate(45deg); width: var(--spacing-2); } .wpc-hotspot-product-card .wpc-close-hotspot:after { background: #000; content: ""; display: block; height: 1px; position: absolute; right: 0; transform: rotate(90deg); width: 16px; } .wpc-hotspot-product-card .wpc-hotspot-product-content-container { align-items: center; display: flex; gap: var(--spacing-2); } .wpc-hotspot-product-card .wpc-hotspot-product-content-container .wpc-hotspot-product-image { align-self: stretch; background-color: var(--neutral-med-pale)  !important; border-radius: 12px; flex-basis: 120px; flex-grow: 0; flex-shrink: 0; height: auto; } .wpc-hotspot-product-card .wpc-hotspot-product-content-container .wpc-hotspot-product-image img { transition-duration: 0s  !important; } .wpc-hotspot-product-card .wpc-hotspot-product-content-container .wpc-hotspot-product-content { align-items: start; display: flex; flex-direction: column; gap: var(--spacing-1); } .wpc-hotspot-product-card .wpc-hotspot-product-content-container .wpc-hotspot-product-content .wpc-hotspot-product-flag { border-radius: var(--card-br); height: 30px; padding: 5px var(--spacing-2); } .wpc-hotspot-product-card .wpc-hotspot-product-content-container .wpc-hotspot-product-content .wpc-hotspot-product-flag p { font-weight: var(--bold); text-transform: uppercase; } .wpc-hotspot-product-card .wpc-hotspot-product-content-container .wpc-hotspot-product-content .wpc-hotspot-product-title { font-family: Montserrat, sans-serif; letter-spacing: -0.8px; line-height: var(--body-s-line); } .wpc-hotspot-product-card .wpc-hotspot-product-content-container .wpc-hotspot-product-content > p { font-weight: var(--bold); } .wpc-hotspot-product-card .wpc-hotspot-product-content-container .wpc-hotspot-product-content .prices { align-items: flex-end; display: flex; gap: var(--spacing-1); position: relative; } .wpc-hotspot-product-card .wpc-hotspot-product-content-container .wpc-hotspot-product-content .prices .wpc-hotspot-product-old-price { line-height: unset  !important; text-decoration: line-through; } .wpc-hotspot-product-card .wpc-hotspot-product-content-container .wpc-hotspot-product-content .prices .wpc-hotspot-product-starting-at { font-family: Noto Sans, sans-serif; position: absolute; top: -7px; } .wpc-hotspot-product-card .wpc-hotspot-product-content-container .wpc-hotspot-product-content .prices .wpc-hotspot-product-price { font-family: Montserrat, sans-serif; font-weight: 700; } .wpc-hotspot-product-card .wpc-hotspot-product-content-container .wpc-hotspot-product-content .wpc-hotspot-product-cta-container { align-items: center; gap: var(--spacing-2); } @media screen and (max-width: 1279px) { .wpc-hotspot-product-card { opacity: 1; } .wpc-hotspot-product-image { flex-basis: 50%  !important; } .wpc-hotspot-product-image img { height: 120px; width: 100%  !important; } .prices:has(.wpc-hotspot-product-starting-at) { padding-top: var(--spacing-1); } .wpc-hotspot-product-content-container { opacity: 0; padding-bottom: var(--spacing-1); transition: opacity var(--main-transition-duration) var(--third-transition-timing-function); } .wpc-hotspot-active-mobile .wpc-hotspot-product-content-container { opacity: 1; transition: opacity var(--main-transition-duration) var(--third-transition-timing-function); } } @media screen and (min-width: 768px) { .wpc-hotspot-product-image img { height: 210px; width: 100%  !important; } .wpc-hotspot-product-content-container { opacity: 0; padding-bottom: var(--spacing-2); transition: opacity var(--main-transition-duration) var(--third-transition-timing-function); width: 100%; } .wpc-hotspot-product-content-container .wpc-hotspot-product-title { font-size: var(--title-l); letter-spacing: -0.82px  !important; line-height: 1.33  !important; } .wpc-hotspot-active-mobile .wpc-hotspot-product-content-container { opacity: 1; transition: opacity var(--main-transition-duration) var(--third-transition-timing-function); } .prices .wpc-hotspot-product-starting-at { top: -4px  !important; } .prices .wpc-hotspot-product-price { font-size: var(--title-l); } .prices:has(.wpc-hotspot-product-starting-at) { padding-top: var(--spacing-2); } .wpc-hotspot-product-cta-container { padding-top: var(--spacing-1); } .wpc-newhotspot-nav-container { padding-bottom: var(--spacing-2); } } @media screen and (min-width: 1280px) { .wpc-hotspot-product-content-container { height: 100px  !important; opacity: 1  !important; padding-bottom: 0; } .wpc-hotspot-product-content-container .wpc-hotspot-product-title { font-family: Lato, sans-serif  !important; font-size: var(--body-m); letter-spacing: -0.82px  !important; line-height: 1.33  !important; } .wpc-hotspot-product-content { gap: var(--spacing-1)  !important; } .prices .wpc-hotspot-product-price { font-family: Lato, sans-serif  !important; font-size: var(--body-s-line); } .wpc-hotspot-product-cta-container { padding-top: 0  !important; } .wpc-hotspot-product-image img { height: 100px  !important; width: fit-content  !important; } } .wpc-mbg-hero h2, .wpc-mbg-hero p { color: var(--pure-light)  !important; padding-right: var(--spacing-2); } .wpc-mbg-hero h2 { font-size: var(--headline-s)  !important; font-weight: 700; } .wpc-mbg-title { padding-bottom: var(--spacing-2); } @media only screen and (max-width: 1280px) { .wpc-mbg-title { font-size: var(--title-l)  !important; } } @media only screen and (max-width: 767px) { .wpc-mbg-title { padding: 0; padding-bottom: var(--spacing-2); } } .wpc-navbar-wpcactioncontainer h2 { color: var(--neutral-med-dark); font-size: var(--body-l); font-weight: 500; line-height: var(--body-l-line); padding-bottom: var(--spacing-2); } .wpc-navbar-wpcactioncontainer h2:hover { color: var(--alternate-med); } .wpc-skinny-banner-content { z-index: 999; } .wpc-skinny-banner-content a { color: var(--pure-dark)  !important; } @media screen and (min-width: 1280px) { .wpc-skinny-banner-content a { color: var(--pure-light)  !important; } .wpc-skinny-banner-content a:hover { color: var(--pure-dark)  !important; } } .wpc-mbg-navbar { z-index: 99  !important; top:0; } .wpc-navbar-wpcactioncontainer a { text-decoration: none  !important; } .wpc-mbg-title-video { font-size: var(--title-l)  !important; line-height: var(--title-l); padding: 0 var(--spacing-3); vertical-align: center; } @media only screen and (max-width: 767px) { .wpc-mbg-title-video { font-size: var(--title-m)  !important; padding: 0; padding-bottom: var(--spacing-2); } } .wpc-mbg-TopHero { margin-top: 0  !important; padding-top: 0  !important; } .wpc-mbg-copy { margin-bottom: var(--display-m); } @media only screen and (max-width: 767px) { .wpc-mbg-copy { margin-bottom: 0; } } .wpc-mbg-accordion { font-size: var(--title-l); } .wpc-mbg-grid-grey { background-color: var(--neutral-pale); } .wpc-blade-content a { color: var(--alternate-med); font-weight: 700; text-decoration: none; } .wpc-blade-content p { margin: 10px auto; } .wpc-blade-content a:hover { color: var(--alternate-med); text-decoration: underline; } .wpc-mbg-connection-type { background-image: url(//p3-ofp.static.pub/ShareResource/na/landing-pages/monitor-buying-guide/background/lenovo-smartergradient-pale-creative-desktop.jpg); } .wpc-mbg-NavItem { margin: auto 20px; } .wpc-mbg-NavItem-url { align-items: center; color: var(--text-black); color: var(--neutral-med-dark); display: flex; flex-direction: column; font-size: var(--body-l); height: 100%; justify-content: normal; line-height: var(--body-l-line); padding-bottom: var(--spacing-2); position: relative; text-align: center; text-decoration: none; transition: var(--transition-duration) ease; } .wpc-mbg-NavItem-url:hover { color: var(--alternate-med)  !important; cursor: pointer; } .wpc-horizontal-scroll .MuiGrid-container { justify-content: flex-start; } @media only screen and (min-width: 1280px) { .wpc-horizontal-scroll .MuiGrid-container { justify-content: center; } } .wpc-horizontal-scroll .MuiGrid-container > :first-child { margin-left: 0  !important; } @media only screen and (max-width: 767px) { .wpc-mbg-hide-mobile { display: none  !important; } } .wpc-mbg-copy ul { list-style: disc  !important; } .wpc-mbg-border-right { border-left: 1px solid var(--pure-dark); padding-left: 50px; } @media only screen and (max-width: 767px) { .wpc-mbg-border-right { border-left: 0; } } .wpc-mbg-border-right p { padding-left: 20px; } .wpc-mbg-navbar { border-bottom: 1px solid var(--neutral-med-pale); z-index: 9999; } .wpc-mbg-freeformcta { padding: 10px; } .wpc-mbg-freeform-list ul { margin-bottom: 40px; } .wpc-mbg-freeform-listTitle { margin-top: 15px; } @media only screen and (max-width: 767px) { .wpc-mbg-freeform-listTitle { font-weight: 700; } } .wpc-mbg-freeform-list li { list-style-type: none; } .wpc-mbg-freeform-list a { color: var(--pure-light); text-decoration: underline; } @media only screen and (max-width: 767px) { .wpc-mbg-freeform-list a { color: var(--alternate-med); font-weight: 700; line-height: var(--headline-m); } } .alternate-pale { background-color: var(--alternate-pale); } .prodblocks { margin-top: 48px; } .wpc-mbg-contain-hero { width: 100%; } .wpc-HalfBlade h3 { font-size: var(--headline-s); line-height: var(--headline-m); } @media only screen and (max-width: 1280px) { .wpc-HalfBlade h3 { font-size: var(--title-l)  !important; } } .wpc-mbg-halfblade { padding-bottom: 50px; } .wpc-mbg-freeform-list li { margin: 12px 0; } @media only screen and (max-width: 767px) { .wpc-HalfBlade, .wpc-blade-container .wpc-blade-content-container.MuiGrid-item .wpc-blade-content .wpc-blade-copy { margin-bottom: 0; } .wpc-mbg-hero h2 { font-size: var(--title-m)  !important; } .wpc-mbg-hero p { font-size: var(--body-s)  !important; line-height: var(--body-m)  !important; } .wpc-HalfBlade h3 { font-size: var(--title-m)  !important; } .wpc-mbg-freeform-list { display: none; } .wpc-blade-content p:first-child { margin-top: 0; } .wpc-mbg-copy { padding-bottom: var(--spacing-6); } .wpc-mbg-video { margin-bottom: 24px  !important; } .wpc-mbg-border-right li { margin-bottom: 16px; } .prodblock-img2 { transform: translateY(-20%); } .wpc-mbg-border-right p { padding-bottom: 20px; padding-left: 15px; } .wpc-mbg-halfblade { padding-bottom: 0  !important; } .prodblocks { display: flex; flex-direction: column; margin-top: 26px; row-gap: 16px; } .prodblock-top .prodblock-img1 { height: 270px; object-fit: cover; object-position: bottom; } .prodblock-copy { padding-bottom: 40px; padding-top: 80px; } .prodblock-desc { margin-left: auto; margin-right: auto; max-width: 220px; } .wpc-medium-hero-transbg p { margin-bottom: var(--spacing-1)  !important; } } @media only screen and (max-width: 600px) { .wpc-mbg-freeform-list { display: block; } .wpc-bladeHorScrollVideo { max-width: 100%  !important; padding: 20px; width: 100%; } } @media only screen and (min-width: 600px) { .prodblocks { column-gap: 24px; display: flex; flex-direction: row; flex-wrap: wrap; margin: 32px auto 0; max-width: 766px; padding: 0 24px; row-gap: 24px; } .prodblock { width: calc(50% - 12px); } } .wpc-mbg-video { text-align: center; } .wpc-mbg-video-iframe { margin: 24px auto 0; max-width: 1148px  !important; text-align: center; } .wpc-bladeHorScrollVideo { max-width: 1148px  !important; width: 100%; } @media only screen and (min-width: 992px) { .prodblocks { column-gap: 24px; display: flex; flex-wrap: nowrap; margin-top: 60px; max-width: 1368px; } } .wpc-blade-container .wpc-blade-img-no-border { border-radius: var(--blade-br)  !important; } .prodblock { background-color: var(--elementary-pale); border-radius: 8px; box-shadow: 0 4px 12px rgba(0, 0, 0, .1); color: var(--pure-dark); display: flex; flex-direction: column; text-align: center; text-decoration: none; transition: .4s; } .prodblock:hover { background-color: var(--connector-med); } .prodblock:hover .prodblock-img1 { opacity: 0; } .prodblock:hover .prodblock-img2 { transform: translateY(-24%); } .prodblock:hover .prodblock-copy { transform: translateY(-75%); transition-delay: 50ms; } .prodblock:hover .prodblock-desc-default { opacity: 0; visibility: hidden; } .prodblock:hover .prodblock-desc-alt { opacity: 1; transform: translateY(0); transition-delay: .1s; visibility: visible; } .prodblock:hover h4, .prodblock:hover p { color: var(--pure-light)  !important; text-decoration: none; } .prodblock h4 { color: var(--pure-dark)  !important; font-size: 1.4rem; line-height: 1em; margin: 0 0 12px; transition: .4s; } @media only screen and (min-width: 768px) { .prodblock h4 { font-size: var(--headline-s); margin-bottom: 20px; } } .prodblock p { color: #000  !important; } .prodblock-top { position: relative; } .prodblock-top img { height: auto; width: 100%; } .prodblock-img1 { border-top-left-radius: 8px; border-top-right-radius: 8px; transition: .5s; } .prodblock-img2 { left: 0; position: absolute; transform: translateY(34%); } .prodblock-copy, .prodblock-img2 { transition: all .5s cubic-bezier(0.23, 1, .32, 1); } @media only screen and (min-width: 768px) { .prodblock-copy { margin: 0 auto; max-width: 240px; padding: 50px 0; width: 80%; } .prodblock-img2 { transform: translateY(49%); } } .prodblock-desc { position: relative; transition: all .5s cubic-bezier(0.23, 1, .32, 1); } .prodblock-desc-default { transition: all .3s cubic-bezier(0.23, 1, .32, 1); } .prodblock-desc-alt { left: 0; opacity: 0; position: absolute; top: 0; transform: translateY(16px); transition: all .5s cubic-bezier(0.23, 1, .32, 1); visibility: hidden; width: 100%; } @media (max-width: 1280px) { .wpc-actioncontainer-url.wpc-ctabutton-merchandising-dark.wpc-ctabutton-text.wpc-skinny-banner-cta { color: var(--pure-light); text-decoration: underline; } }